.wb-cities-w{
    padding: 55px;
    background: #f6f6f6;
    display: flex;
    margin-bottom: 16px;
}
.wb-cities-l{
    flex-basis: 40%;
    flex-shrink: 0;
    padding-right: 60px;
}
.wb-cities-l p{
    font-size: 16px;
    color: #000;
    margin-bottom: 10px;
}
.wb-cities-l select{
    color: #000;
    padding: 15px 30px 15px 0;
    border:0;
    border-bottom: 1px solid #FF0808;
    outline: none;
    width: 100%;
    background: transparent;
}
.wb-cities-r{
    flex-basis: 60%;
    flex-shrink: 0;
}
.wb-cities-r ul{
    display: flex;
    flex-wrap: wrap;
}
.wb-cities-r ul li{
    margin-right: 62px;
    margin-bottom: 8px;
}
.wb-cities-r ul li a{
    color: #000;
    font-weight: 400;
    font-size: 16px;
}
.wb-cities-r ul li a.active{
    font-weight: bold;
    color: #FF0808;
}
.wb-map{
    margin-bottom: 30px;
    height: 460px;
}
.wb-items-w{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 10px;
    margin-bottom: 70px;
}
.wb-item{
    border: 1px solid #ddd;
    padding:30px;
    display: flex;
    flex-direction: column;
    transition: .3s all ease;
}
.wb-item:hover{
    border: 1px solid #FF0808;
}
.wb-item-img{
    height: 225px;
    margin-bottom: 20px;
    display: block;
}
.wb-item-name{
    margin-bottom: 15px;
    font-size: 18px;
    color: #232427;
    transition: .3s all ease;
    display: block;
}
.wb-item-name:hover{
    color: #000;
}
.wb-item-addr{
    position: relative;
    color: #000;
    font-size: 14px;
    margin-bottom: 10px;
    padding-left: 30px;
}
.wb-item-addr::before,
.wb-item-phone::before,
.wb-item-tw::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
}
.wb-item-addr::before{
    background: url(/image/wb-geo.png) center no-repeat;
    height: 21px;
    width: 17px;
}
.wb-item-phone::before{
    background: url(/image/wb-tel.png) center no-repeat;
    height: 17px;
    width: 17px;
}
.wb-item-phone{
    position: relative;
    color: #25292D;
    font-size: 16px;
    font-weight: bold;
    padding-left: 30px;
    margin-bottom: 10px;
}
.wb-item-aw{
    flex-grow: 1;
    display: flex;
    align-items: flex-end;
}
.wb-item-tw{
    position: relative;
    margin-bottom: 24px;
    color: #707D8A;
    padding-left: 30px;
    font-size: 14px;
}
.wb-item-tw::before{
    background: url(/image/wb-clock.png) center no-repeat;
    width: 20px;
    height: 20px;
    margin-top: -2px;
}
.wb-item-a{
    display: flex;
    width: 100%;
    background: #eee;
    padding: 12px 0;
    font-weight: bold;
    font-size: 14px;
    color: #000;
    justify-content: center;
    align-items: center;
    transition: .3s all ease;
    text-decoration: none;
}
.wb-item-a:hover{
    background: #FF0808;
    color: #fff;
}
.wb-item-a svg{
    margin-left: 8px;
    transition: .3s all ease;
}
.wb-item-a:hover svg{
    transform: translateX(10px);
}
.wb-item-a svg path{
    fill: #000;
}
.wb-item-a:hover svg path{
    fill:#fff;
}
.where-title{
    color: #232427;
    font-size: 34px;
    margin: 50px 0 35px 0;
}
.tabs-changer{
    list-style: none;
    display: flex;
    padding-left: 0;
}
.tabs-changer li{
    font-weight: bold;
    font-size: 14px;
    background: #eee;
    margin-right: 20px;
    margin-bottom: 20px;
    padding: 12px 30px;
    cursor: pointer;
    transition: .3s all ease;
}
.tabs-changer li.active,
.tabs-changer li:hover{
    background-color: #FF0808;
    color: #fff;
}


@media (max-width: 992px){
    .wb-items-w{
        grid-template-columns: repeat(2, 1fr);
    }
    .wb-cities-w {
        padding: 35px;
    }
    .wb-items-w {
        grid-template-columns: repeat(1, 1fr);
    }
    .wb-cities-l {
        padding-right: 25px;
    }
}
@media (max-width: 700px){
    .postsP-top__title.catalog-top__title{
        font-size: 22px;
        margin-bottom: 26px;
    }
    .postsP-top.categories-top{
        padding-bottom: 0;
        margin-bottom: 0;
    }
    .wb-cities-w {
        padding: 20px;
    }
    .wb-cities-w{
        flex-direction: column;
    }
    .wb-cities-l{
        margin-bottom: 20px;
    }
    .wb-cities-r ul li{
        margin-right: 0;
        flex-basis: 50%;
        margin-bottom: 6px;
    }
    .wb-cities-r ul li a{
        font-size: 14px;
    }
    .wb-item{
        padding: 20px;
    }
    .where-title{
        font-size: 28px;
        margin-top: 35px;
        margin-bottom: 25px;
    }
}

.whd{
    color: #222;
    padding-bottom: 50px;
    padding-right: 15px;
    padding-left: 15px;
}
.wbd-top{
    display: flex;
    position: relative;
    margin-top: 70px;
    margin-bottom: 130px;
}
.wbd-w-sl{
    width: 82%;
    flex-grow: 1;
    margin: 0;
}
.wbcard-img{
    width: 700px;
    height: 410px;
}
.swiper-scrollbar1{
    width: 800px;
    background: #D8DCE6;
    height: 2px;
    bottom: 0;
    left: 0;
    position: absolute;
    margin-bottom: -35px;
}
.swiper-scrollbar1 .swiper-scrollbar-drag{
    height: 4px;
}
.wbd-w-r{
    width: 600px;
    background: #fff;
    flex-shrink: 0;
    padding: 30px 40px 30px 65px;
}
.wbd-w-r-n{
    font-size: 24px;
    color: #232427;
    margin-bottom: 20px;
    font-weight: bold;
}
.wbd-w-r-addr{
    position: relative;
    margin-bottom: 12px;
    padding-left: 30px;
}
.wbd-w-r-wt{
    position: relative;
    margin-bottom: 23px;
    padding-left: 30px;
}
.wbd-w-r-ph{
    position: relative;
    padding-left: 30px;
}
.wbd-w-r-addr::before,
.wbd-w-r-wt::before,
.wbd-w-r-ph::before
{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
}
.wbd-w-r-addr::before{
    background: url(/image/wb-geo.png) center no-repeat;
    height: 21px;
    width: 17px;
}
.wbd-w-r-wt::before{
    background: url(/image/wb-clock.png) center no-repeat;
    width: 20px;
    height: 20px;
    margin-top: -2px;
}
.wbd-w-r-ph::before{
    background: url(/image/wb-tel.png) center no-repeat;
    height: 17px;
    width: 17px;
}
.wbd-w-r-a{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 35px;
    height: 48px;
    background: #eee;
    font-size: 14px;
    font-weight: bold;
    color: #000;
    transition: .3s all ease;
    text-decoration: none;
}
.wbd-w-r-a:hover{
    background: #FF0808;
    color: #fff;
}
.wbd-w-rw{
    width: 350px;
}
.wbd-proezd-w{
    display: flex;
}
.wbd-proezd-l{
    width: 842px;
    flex-shrink: 0;
}
.wbd-proezd-l #map{
    width: 100%;
    height: 620px;
}
.wbd-proezd-r{
    margin-left: 65px;
    margin-top: 30px;
}
.wbd-proezd-title{
    font-weight: bold;
    font-size: 24px;
    margin-bottom: 20px;
    color: #232427;
}
.wbd-proezd-txt{
    margin-bottom: 44px;
    font-size: 14px;
    line-height: 145%;  
}
.wbd-proezd-ya{
    color: #25292D;
    font-size: 14px;
    line-height: 143%;
    padding-left: 80px;
    position: relative;
}
.wbd-proezd-ya::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 62px;
    height: 62px;
    background: url(/image/ya-arrow.jpg) no-repeat center;
}
.wbd-proezd-ya a{
    text-decoration: none;
    color: #D02937;
}
.wbd-proezd-ya a:hover{
    text-decoration: underline;
}
.wbd-proezd-ya-t{
    color: #232427;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 8px;
}
.wbd-w-r-n1{
    display: none;
}
@media (max-width: 1540px){
    .wbcard-img {
        width: 505px;
        height: 290px;
    }
    .swiper-scrollbar1,
    .wbd-proezd-l{
        width: 610px;
    }
    .wbd-proezd-l #map{
        height: 500px;
    }
}
@media (max-width: 1340px){
    .wbd-top{
        margin-top: 50px;
        margin-bottom: 70px;
    }
    .wbcard-img {
        width: 505px;
        height: 270px;
    }
    .swiper-scrollbar1 {
        margin-bottom: -15px;
    }
    .wbd-w-r{
        width: 470px;
        padding: 20px 30px 20px 40px;
    }
    .wbd-proezd-r{
        margin-left: 40px;
    }
}
@media (max-width: 1160px){
    .wbd-w-r {
        width: 332px;
    }
    .wbd-w-rw{
        width: 100%;
    }
}
@media (max-width: 992px){
    .wbd-w-r{
        padding: 15px;
    }
    .wbcard-img{
        width: 455px;
    }
    .swiper-scrollbar1{
        width: 549px;
    } 
    .wbd-proezd-l{
        width: 547px;
    }
    .wbd-proezd-r {
        margin-left: 15px;
        margin-top: 15px;
    }
}
@media (max-width: 940px){
    .wbd-top{
        margin-top: 30px;
        margin-bottom: 30px;
    }
    .wbd-w-r {
        width: 300px;
    }
    .swiper-scrollbar1 {
        width: 481px;
    }
    .wbd-proezd-l {
        width: 480px;
    }
    .wbcard-img {
        width: 400px;
    }
}
@media (max-width: 820px){
    .wbd-top{
        flex-direction: column;
    }
    .wbcard-img {
        width: 100%;
    }
    .wbd-w-sl{
        width: 100%;
    }
    .swiper-scrollbar1{
        position: relative;
        margin-bottom: 30px;
        margin-top: 20px;
        width: 100%;
    }
    .wbd-w-r-n{
        display: none;
    }
    .wbd-w-r-n1{
        display: block;
        margin-bottom: 16px;
        font-size: 22px;
        font-weight: bold;
        color: #232427;
    }
    .wbd-w-r{
        width: 100%;
    }
    .wbd-proezd-w{
        flex-direction: column;
    }
    .wbd-proezd-l{
        width: 100%;
    }
    .wbd-proezd-r{
        margin-left: 0;
        margin-bottom: 50px;
    }
    
}
@media (max-width: 500px){
    .wbcard-img {
        height: 220px;
    }
}
.wb2l-emp{
    font-size: 16px;
    padding: 30px 0;
    font-weight: bold;
    color: #232427;
}
.wb2l-w{
    padding: 25px 0;
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
}
.wb2l-item-img{
    margin-bottom: 15px;
    border: 1px solid #eee;
    width: 150px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wb2l-item{
    text-align: center;
    margin: 15px;
}
.wb2l-item-a{
    font-size: 16px;
    font-size: bold;
    display: inline-block;
    text-decoration: none;
    transition: .3s all ease;
    color: #232427;
    padding: 6px 0;
}
@media (max-width: 700px){
    .wb2l-item-a{
        font-size: 14px;
    }
    .wb2l-w{
        justify-content: center;
    }
}