
/* The container must be positioned relative: */
.custom-select {
  position: relative;
  padding: 0;
  border-radius: 0;
  height: unset;
  border: 1px solid #fff;
  font-size: 1em;
  background-color: #3b3a3c;
  min-height: 44px;
}

.custom-select select {
  display: none; /*hide original SELECT element: */
}

.select-selected {
  background-color: transparent;
  border: 1px solid #fff;
}


/* Style the arrow inside the select element: */
.select-selected:after{
  position: absolute;
  content: "";
  top: 14px;
  right: 20px;
  width: 0;
  height: 0;
  transform: rotate(45deg) translateY(-5px);
  -webkit-transform: rotate(45deg) translateY(-3px);
  border: solid #fff;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 5px;
  margin-left: 5px;
}

.select-selected.selected-div:after {
  display: none;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

/* style the items (options), including the selected item: */
.select-items div,.select-selected {
  color: #fff;
  padding: 8px 16px;
  border: 1px solid transparent;
  cursor: pointer;
  position: relative;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: #ececf1 !important;
  color: #ddd !important;
  top: -10px;
  left: 0;
  right: 0;
  z-index: 99;
  border: 1px solid #ececf1;
  max-height: 60vh;
  overflow: auto;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  color:  #1f6b31;
  text-decoration: none;
}


.select-items div {
  color: #3b3a3c;
  border-bottom: none;
  padding: 12px 16px;
}

.custom-select-location .select-items div:nth-child(3),
.custom-select-location .select-items div:nth-child(4),
.custom-select-location .select-items div:nth-child(5),
.custom-select-location .select-items div:nth-child(6),
.custom-select-location .select-items div:nth-child(7),
.custom-select-location .select-items div:nth-child(8),
.custom-select-location .select-items div:nth-child(9),
.custom-select-location .select-items div:nth-child(9),
.custom-select-location .select-items div:nth-child(10),
.custom-select-location .select-items div:nth-child(11),
.custom-select-location .select-items div:nth-child(12),
.custom-select-location .select-items div:nth-child(13),
.custom-select-location .select-items div:nth-child(14),
.custom-select-location .select-items div:nth-child(15){
  padding-left: 10%;
}

.select-selected .close-trigger{
  position: absolute;
  width: 100%;
  height: 2px;
  transform: rotate(45deg);
}

.select-selected .close-trigger:before,
.select-selected .close-trigger:after {
  position: absolute;
  content:'';
  width: 100%;
  height: 2px;
  background-color: #fff;
}

.select-selected .close-trigger:before {
  transform: rotate(90deg);
}

.close-trigger.close-trigger-select {
  height: 20px;
  width: 20px;
  position: absolute;
  right: 15px;
  top: 15px;
}

