/**
 *
*/

.contact-regions{
    padding-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.contact-regions .title{
    font-size: 18px;
}
.contact-regions .item,
.contact-regions .selected{
    font-size: 14px;
    margin-bottom: 0;
    padding:9px 35px 9px 12px;
    cursor:pointer;
}
.contact-regions .list .item {
    display: none;
}
.contact-regions .list.__open .item {
    display: block;
}

.contact-regions .list{
    border: 1px solid #4b666e;
    position: relative;
}
.contact-regions .selected{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.contact-regions .selected:after{
    font-family: 'fontello';
    content: '\f142';
    position: relative;
    left:15px;
}
.contact-regions .select{
    position: absolute;
    top:calc(100% + 10px);
    left:-1px;
    width:100%;
    opacity: 0;
    visibility: hidden;
    height: 0;
    background-color: #fff;
    transition-property:opacity, visibility;
    transition-duration: .3s;
}

.contact-regions .__open .select{
    opacity: 1;
    visibility: visible;
    height: auto;
    max-height: 250px;
    overflow: auto;
    box-shadow: 1px 1.732px 3px 0px rgba(18, 32, 52, 0.5);
    background-color: #f4f4f4;
    padding: 8px;
    box-sizing: border-box;
    z-index: 1024;
}
.contact-regions .__open .selected:after{
    transform: rotate(180deg);
}

.contact-regions .item.__active{
    white-space: nowrap;
}

@media (min-width: 992px){
    .contact-regions .select p{
        transition: color .3s;
    }
    .contact-regions .select p:hover{
        color:#122034;
    }
}

/** - */

.regions-list{}

.regions-list {
    width:48%;
    margin-bottom: 30px;
}
@media (max-width: 575px){
    .regions-list{
        width:100%;
    }
}

/** - */

.states-list{
    width:48%;
    margin-bottom: 30px;
}
.states-list .list{
    display: none;
}
.states-list .list.__active{
    display: block;
}
@media (max-width: 575px){
    .states-list{
        width:100%;
    }
}

/** - */

.states-content{
    width:100%;
}
.states-content .state{
    display: none;
}
.states-content .state.__active{
    display: block;
}