.cities {
    width: 1312px;
    max-width: 100%;
    box-shadow: 0 4px 13px rgba(0, 0, 1, 0.32);
    background-color: #fff;
    padding: 26px 38px;
    position: relative;
}

.cities::after {
    content: '';
    display: block;
    width: 190px;
    position: absolute;
    height: 47px;
    background-image: url(/local/templates/ritual/css/autoload/assets/cities/logo-cities.png);
    background-size: contain;
    top: 26px;
    right: 73px;
}

.cities__search {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.cities__search-header {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 700;
    margin-right: 12px;
}

.cities__search-input {
    display: block;
    width: 270px;
    height: 43px;
    border-radius: 10px 0 0 10px;
    border: 2px solid #9e9e9e;
    background-color: #fff;
    padding-left: 10px;
    font-size: 14px;
    border-right: 0;
    margin-right: -6px;
}

.cities__search-input::placeholder {
    color: #9e9e9e;
}

.cities__search-input::-ms-clear {
    display: none;
}

.cities__search-icon {
    position: relative;
    display: block;
    width: 40px;
    height: 43px;
    background-image: url(./assets/cities/search_grey.svg);
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 0 10px 10px 0;
    border: 2px solid #9e9e9e;
    border-left: 0;
    background-color: #fff;
}

.cities__search-wrap {
    display: flex;
    align-items: center;
}

.cities__close {
    position: absolute;
    top: 22px;
    right: 22px;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.cities__close::after {
    content: '';
    display: block;
    width: 24px;
    height: 3px;
    background-color: #ad5a55;
    position: absolute;
    transform: rotate(45deg);
    top: 10px;
    right: 0;
}

.cities__close::before {
    content: '';
    display: block;
    width: 24px;
    height: 3px;
    background-color: #ad5a55;
    position: absolute;
    transform: rotate(-45deg);
    top: 10px;
    right: 0;
}

.cities__top {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(206px, 1fr));
    padding: 0;
}

.cities__bottom {
    column-width: 206px;
    position: relative;
    column-gap: 0;
    margin-top: 40px;
    padding: 0;
}

.cities__top li,
.cities__bottom li {
    list-style-type: none;
    color: #464646;
    width: 206px;
}

.cities__top a,
.cities__bottom a {
    color: #464646;
    text-transform: uppercase;
    text-decoration: none;
    padding: 3px 0;
    display: inline-block;
}

.cities__top a {
    font-weight: 700;
    font-size: 14px;
}

.cities__bottom a {
    font-size: 13px;
}

.cities__top a:hover,
.cities__bottom a:hover {
    color: #ad5a55;
}

.cities__bottom::after {
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    background-color: #9e9e9e;
    position: absolute;
    top: -21px;
    left: 0;
}

.cities .fancybox-close-small {
    display: none;
}


.cities__item_ms a {
	font-weight:700;
}
@media (max-width: 1030px) {
    .cities::after {
        display: none;
    }
}

@media (max-width: 650px) {
    .cities__search {
        flex-direction: column;
    }

    .cities__search-header {
        margin: 0 0 12px
    }
}

@media (max-width: 420px) {
    .cities__close {
        top: 14px;
        right: 14px;
        transform: scale(0.9);
    }

    .cities__search-wrap,
    .cities__search-input {
        width: 100%;
    }
}



/* баг в ie 11 */
@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .cities__top {
        display: flex;
    }
}

@media screen and (-ms-high-contrast: active) and (max-width: 1340px),
(-ms-high-contrast: none) and (max-width: 1340px) {
    .cities__top li {
        width: 20%;
    }

    .cities__top {
        flex-wrap: wrap;
    }
}

@media screen and (-ms-high-contrast: active) and (max-width: 1137px),
(-ms-high-contrast: none) and (max-width: 1137px) {
    .cities__top li {
        width: 25%;
    }
}

@media screen and (-ms-high-contrast: active) and (max-width: 928px),
(-ms-high-contrast: none) and (max-width: 928px) {
    .cities__top li {
        width: 33.333%;
    }
}

@media screen and (-ms-high-contrast: active) and (max-width: 726px),
(-ms-high-contrast: none) and (max-width: 726px) {
    .cities__top li {
        width: 50%;
    }
}

@media screen and (-ms-high-contrast: active) and (max-width: 505px),
(-ms-high-contrast: none) and (max-width: 505px) {
    .cities__top li {
        width: 100%;
    }
}