.jspContainer {
  overflow: hidden;
  position: relative; }

.jspPane {
  position: absolute; }

.jspVerticalBar {
  position: absolute;
  top: 0;
  right: 0;
  width: 16px;
  height: 100%;
  background: red; }

.jspHorizontalBar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 16px;
  background: red; }

.jspVerticalBar *,
.jspHorizontalBar * {
  margin: 0;
  padding: 0; }

.jspCap {
  display: none; }

.jspHorizontalBar .jspCap {
  float: left; }

.jspTrack {
  background: #dde;
  position: relative; }

.jspDrag {
  background: #bbd;
  position: relative;
  top: 0;
  left: 0;
  cursor: pointer; }

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag {
  float: left;
  height: 100%; }

.jspArrow {
  background: #50506d;
  text-indent: -20000px;
  display: block;
  cursor: pointer; }

.jspArrow.jspDisabled {
  cursor: default;
  background: #80808d; }

.jspVerticalBar .jspArrow {
  height: 16px; }

.jspHorizontalBar .jspArrow {
  width: 16px;
  float: left;
  height: 100%; }

.jspVerticalBar .jspArrow:focus {
  outline: none; }

.jspCorner {
  background: #eeeef4;
  float: left;
  height: 100%; }

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner {
  margin: 0 -3px 0 0; }
/***************CS******************************/
.custom_select{
  position: relative;
}
.custom_select select {
  opacity: 0; }

.customSelect select {
  position: absolute;
  left: -999em; }

@media screen and (max-width: 767px) {
  .customSelect select {
    left: 0;
    z-index: 10;
    top: 0; } }

/*@media screen and (max-width: 767px){*/
.custom-select .customSelect {
  border: none;
  background: none;
  padding: 0;
  height: auto;
  position:relative;
}

.customSelect .selectValueWrap {
  position: relative;
  cursor: pointer;

  background: #fff;
  width: 100%;

  border: 1px solid #E5E5E5;
  box-sizing: border-box;
  padding: 8px 16px;
  color: #000000;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}


.simplecheckout-block .customSelect .selectValueWrap .selectedValue{
  /*color: #818995;*/
  color: #000000;
}

.has_error .customSelect .selectValueWrap{
  display: flex;
  align-items: center;
  justify-content: center;
}


.customSelect .selectValueWrap .selectedValue {
  background: #fff;
  box-sizing: border-box;
  position: relative;
  padding: 0px 0px 0px 0px;
  width: 100%;
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
  color: #221F1F;
}


.customSelect .caret {
  margin: 0;
  padding: 0;
  border: none;
}


.customSelect .caret{
  display: flex;
  align-items: center;
  justify-content: center;

  width: 20px;
  height: 20px;
  text-align: center;


  margin-top: 0px;

  font-size: 7px;
  color:#4D4D4D;
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



.customSelect.select-open .caret{
  transform: rotate(-180DEG);
}

.customSelect .selectList {
  z-index: 100;
  position: absolute;
  left: -99999em;
  top: -99999em;
  background: #FFFFFF;
  box-shadow: none;
  border-radius: 0px;
  width: 100%;
}

.customSelect .selectList{
  min-width: 230px;
  right: 0;
  left: auto!important;
  border: 1px solid #BFC5CF;
  box-shadow: none!important;
  border-radius: 0!important;
}

.customSelect.select-open .selectList {
  left: 0 !important;
  top: auto !important; }

.customSelect .selectList dl {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 14px;
  color: #818995;
}

.customSelect .selectList dl.defaultScrollbar {
  overflow-x: hidden;
  overflow-y: scroll; }

.customSelect dl, .customSelect dd {
  margin: 0; }

.customSelect dd {
  zoom: 1;
  cursor: pointer; }

.customSelect .selectList dd.hovered {
  background:  #F8F9FD;
}

.customSelect dd{
  border:none;
  padding: 8px 15px 8px 15px;
  background-color: #ffffff;

  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 20px;
  color: #818995;
  position: relative;
  text-transform: lowercase;
}


.customSelect dd:hover,.customSelect dd.selected{
  background-color: #F8F9FD;
  color: #000000;
}




.hasJS select.custom {
  position: absolute;
  left: -999em; }

.customSelect .jspPane {
  overflow-x: hidden; }

.customSelect .jspVerticalBar {
  background: none;
  width: 6px;
  border-radius: 5px;
  background-color: #F6F6F6;
  border: 1px solid #E5E5E5;
  box-sizing: border-box; }

.customSelect .jspHorizontalBar {
  height: 0;
  overflow: hidden; }

.customSelect .jspTrack {
  background: none;
  right: 0px;
  border-radius: 5px; }

.customSelect .jspDrag {
  color: #ffffff;
  border-radius: 5px;
  background-color: #4CAF50;
  width: 5px;
}

.customSelect.use-default select{
  width: 100%;
  height:100%;
}
/*****************************/
.custom-select .selectValueWrap {
  box-sizing: border-box;
  padding: 11.5px 10px;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #808080;
  border: 1px solid #E0E0E0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.custom-select .selectValueWrap .selectedValue {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #808080;
}
.custom-select .selectValueWrap .caret {
  color: #828282;
}
