
.selectBox input {
 display:none
}
.selectBox input:checked+label {
 border-color:#191971;
 color:#191971;
 z-index:1
}
.selectBox input:checked+label:before {
 background:#191971;
 box-shadow:0 0 0 2px #191971;
}
.selectBox.round label {
 border-radius:100px;
}
.selectBox label {
 width:100%;
 padding:.5em;
 font-size:1.1em;
 cursor:pointer;
 font-weight:400;
 position:relative;
 text-align:center;
 transition:all .25s;
 border:2px solid rgba(161,175,179,.5);
 border-radius:.3333rem
}
.selectBox label:before {
 top:50%;
 content:"";
 right:1em;
 width:15px;
 height:15px;
 position:absolute;
 border:3px solid #fff;
 transition:all .25s;
 transform:translateY(-50%);
 box-shadow:0 0 0 2px #a1afb3
}
.selectBox label:hover {
 z-index:1;
 border-color:#8e8eac
}
.selectBox.noCheckMark label {
 display:flex;
 align-items:center
}
.selectBox.noCheckMark label:before {
 display:none
}
.selectBox.radio label:before {
 border-radius:100%
}
.selectBoxGroup {
 display:flex;
 flex-wrap:wrap
}
.selectBoxGroup .selectBox {
 margin-left:-1px
}
.selectBoxGroup .selectBox:first-child {
 margin-left:0
}
@media screen and (max-width:568px) {
 .selectBoxGroup {
  flex-direction:column
 }
 .selectBoxGroup .selectBox {
  margin-left:0
 }
 .selectBoxGroup .selectBox label {
  width:100%
 }
}
.selectBoxGroup.underneath {
 flex-direction:column
}
.selectBoxGroup.underneath .selectBox {
 margin-left:0
}
.selectBoxGroup.underneath .selectBox label {
 width:100%
}
.selectBoxGroup.rtl {
 direction:rtl
}
.selectBoxGroup.rtl label {
 width:100%;
 padding:15px 40px 15px 15px;
 text-align:right
}
.selectBoxGroup.rtl label:before {
 right:15px
}