.select-box{
    display:flex;
    flex-direction:column;
    width:400px;
}

.select-box .options-container.active{
    max-height: 300px;
    opacity: 1;
    overflow-y:scroll;
}

.select-box .options-container::-webkit-scrollbar{
    display:none
}

.select-box .options-container::-webkit-scrollbar-thumb{
    display:none
}


.select-box .options-container{
    background: #EDFAFD;
    max-height: 0;
    width: calc(100%-2px);
    opacity: 0;
    transition: all 0.4s;
    border-radius: 8px;
    overflow: hidden;
    order:1;
    border: 1px solid #ADB5BD;
}


#arrow_icon{
    margin-left:calc(100% - 60px);
    transition: all 0.4s;
    position:absolute;
}

#arrow_icon.rotated{
    transform:rotateX(180deg)
}

.select-box .option,
.selected{
    padding:5px 24px;
    cursor: pointer;
}

.selected{
    background: #fafafa;
    border-radius: 8px;
    margin-bottom: 8px;
    position: relative;
    order:0;
    display:flex;
    align-items: center;
    border: 1px solid #ADB5BD;
}

.selected.active{
    background: #EDFAFD;
}


.option_wrap_label,
.selected_text{
    float:left;
    margin:0px;
    display:flex;
    align-items:center; 
    font-size:18px
}


.options-container>.option-wrapper{
    padding:5px 10px;
    overflow-y:auto;
    border-top:1px solid #ADB5BD;
    cursor:pointer;
    transition: background 0.2s ease;
}
.options-container>.option-wrapper:last-child{
    border-bottom:0px !important;
}

.option-wrapper:hover{
    background: #B6EBF7;
}

.options-container>.option-wrapper.active{
    background: #B6EBF7;
}

.select-box .option{
    width: 100%;
    display: inline;
}

.radio{
    display: none;
}


