.header-search {
position: relative;
width: 15.6168662155vw;
}
@media screen and (max-width: 1500px) {
.header-search {
display: none;
padding: 20px;
width: 100%;
background: #fff;
position: fixed;
left: 0;
}
.header-search.active {
display: block;
}
.header-search .asp_w_container_1 {
border: 1px solid #303030;
}
}
.header-search #ajaxsearchpro1_1 .probox .proinput input.orig,
.header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete,
.header-search #ajaxsearchpro1_2 .probox .proinput input.orig,
.header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete,
.header-search div.asp_m.asp_m_1 .probox .proinput input.orig,
.header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete {
height: auto;
font-family: "Montserrat", sans-serif;
font-weight: 400;
font-size: 0.8849557522vw;
line-height: 140%;
letter-spacing: -0.011em;
color: #ffffff;
margin: 0 !important;
padding: 0.4164497657vw 1.0411244144vw !important;
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox .proinput input.orig,
.header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete,
.header-search #ajaxsearchpro1_2 .probox .proinput input.orig,
.header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete,
.header-search div.asp_m.asp_m_1 .probox .proinput input.orig,
.header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete {
color: #202020;
font-size: 17px !important;
padding: 8px 20px !important;
background: #ffffff !important;
width: 100% !important;
}
}
.header-search #ajaxsearchpro1_1 .probox .proinput input.orig::placeholder,
.header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete::placeholder,
.header-search #ajaxsearchpro1_2 .probox .proinput input.orig::placeholder,
.header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete::placeholder,
.header-search div.asp_m.asp_m_1 .probox .proinput input.orig::placeholder,
.header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete::placeholder {
color: #ffffff;
font-family: Montserrat, sans-serif;
font-size: 0.8849557522vw;
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox .proinput input.orig::placeholder,
.header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete::placeholder,
.header-search #ajaxsearchpro1_2 .probox .proinput input.orig::placeholder,
.header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete::placeholder,
.header-search div.asp_m.asp_m_1 .probox .proinput input.orig::placeholder,
.header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete::placeholder {
font-size: 15px;
}
}
@media screen and (max-width: 560px) {
.header-search #ajaxsearchpro1_1 .probox .proinput input.orig::placeholder,
.header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete::placeholder,
.header-search #ajaxsearchpro1_2 .probox .proinput input.orig::placeholder,
.header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete::placeholder,
.header-search div.asp_m.asp_m_1 .probox .proinput input.orig::placeholder,
.header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete::placeholder {
font-size: 15px;
}
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete,
.header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete,
.header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete {
display: none !important;
}
}
.header-search #ajaxsearchpro1_1 .probox .proinput,
.header-search #ajaxsearchpro1_2 .probox .proinput,
.header-search div.asp_m.asp_m_1 .probox .proinput {
width: 100%;
margin: 0;
padding: 0;
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox .proinput,
.header-search #ajaxsearchpro1_2 .probox .proinput,
.header-search div.asp_m.asp_m_1 .probox .proinput {
width: auto;
flex: 1 1 auto;
}
}
.header-search #ajaxsearchpro1_1,
.header-search #ajaxsearchpro1_2,
.header-search div.asp_m.asp_m_1 {
background: transparent !important;
border-radius: 0;
border: 1px solid #ffffff;
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1,
.header-search #ajaxsearchpro1_2,
.header-search div.asp_m.asp_m_1 {
border: none;
background: #E6E6E6 !important;
}
}
.header-search #ajaxsearchpro1_1 .probox,
.header-search #ajaxsearchpro1_2 .probox,
.header-search div.asp_m.asp_m_1 .probox {
height: auto;
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox,
.header-search #ajaxsearchpro1_2 .probox,
.header-search div.asp_m.asp_m_1 .probox {
display: flex;
background: #fff !important;
}
}
.header-search #ajaxsearchpro1_1 .probox .promagnifier,
.header-search #ajaxsearchpro1_2 .probox .promagnifier,
.header-search div.asp_m.asp_m_1 .probox .promagnifier {
height: auto;
background: transparent;
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox .promagnifier,
.header-search #ajaxsearchpro1_2 .probox .promagnifier,
.header-search div.asp_m.asp_m_1 .probox .promagnifier {
flex: 0 0 auto;
width: auto;
}
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox .promagnifier .hiddend {
font-family: Montserrat, sans-serif;
display: block !important;
background: #FFF;
border-radius: 0;
color: #303030;
padding: 10px 22px;
height: auto;
transition: background 0.3s;
font-size: 13px;
font-style: normal;
font-weight: 600;
line-height: 150%;
letter-spacing: 0.26px;
border-left: 1px solid #303030;
}
.header-search #ajaxsearchpro1_1 .probox .promagnifier .hiddend:hover {
background: #A4D415;
}
}
.header-search .probox .proclose {
position: absolute !important;
right: 2.8630921395vw;
top: 50%;
transform: translateY(-50%);
width: 0.9370119729vw !important;
height: 0.9370119729vw !important;
}
@media screen and (max-width: 1500px) {
.header-search .probox .proclose {
display: none !important;
}
}
.header-search .probox .proclose svg {
width: 0.9370119729vw !important;
height: 0.9370119729vw !important;
}
.header-search #ajaxsearchpro1_1 .probox .promagnifier div.innericon,
.header-search #ajaxsearchpro1_2 .probox .promagnifier div.innericon,
.header-search div.asp_m.asp_m_1 .probox .promagnifier div.innericon {
background: url(//resort.artpeople.ru/wp-content/themes/resort/img/icon-search.svg) no-repeat center/0.9370119729vw;
padding-right: 0.8849557522vw;
padding-left: 0.8849557522vw;
width: 1.7699115044vw;
height: 100%;
}
@media screen and (max-width: 1500px) {
.header-search #ajaxsearchpro1_1 .probox .promagnifier div.innericon,
.header-search #ajaxsearchpro1_2 .probox .promagnifier div.innericon,
.header-search div.asp_m.asp_m_1 .probox .promagnifier div.innericon {
padding-left: 17px;
padding-right: 17px;
width: 34px;
display: none;
}
}
.header-search #ajaxsearchpro1_1 .probox .promagnifier div.innericon svg,
.header-search #ajaxsearchpro1_2 .probox .promagnifier div.innericon svg,
.header-search div.asp_m.asp_m_1 .probox .promagnifier div.innericon svg {
display: none;
}
.header-search input[aria-hidden] {
position: absolute !important;
}
.header {
position: fixed;
z-index: 100;
left: 0;
top: 0;
width: 100%;
background: rgba(255, 255, 255, 0);
transition: background 0.3s, opacity 0.3s;
transition-delay: 0.2s;
opacity: 1;
}
.header-top,
.header-bottom {
padding-left: 3.1233732431vw;
padding-right: 3.1233732431vw;
}
@media screen and (max-width: 1500px) {
.header-top,
.header-bottom {
padding-left: 30px;
padding-right: 30px;
}
}
.header-top {
border-bottom: 1px solid #ffffff;
}
@media screen and (max-width: 1500px) {
.header-top {
padding: 10px 0;
}
}
.header-top__location,
.header-top__phone,
.header-top__email,
.header-top__work-hours {
transition: color 0.3s;
}
.header-top__row {
display: flex;
align-items: center;
}
.header-top__logo-wrapper {
position: relative;
flex: 0 0 11.9729307652vw;
padding: 0.6246746486vw 1.8219677251vw;
border-width: 0px 0.0520562207vw;
border-style: solid;
border-color: #FFFFFF;
transition: border-color 0.3s;
}
@media screen and (max-width: 1500px) {
.header-top__logo-wrapper {
border-width: 0px 1px;
padding: 12px 35px;
flex-basis: 230px;
}
}
.header-top__logo-wrapper--link {
transition: all 0.3s;
}
.header-top__logo-wrapper--link:hover {
opacity: 0.8;
}
.header-top__logo-wrapper--link:active {
opacity: 0.6;
}
@media screen and (max-width: 1500px) {
.header-top__logo-wrapper {
display: none;
}
}
.header-top__logo-wrapper img {
width: 100%;
transition: opacity 0.3s;
}
.header-top__logo-wrapper img.header__logo--dark {
opacity: 0;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: calc(100% - 70px);
height: calc(100% - 24px);
}
.header-top__center {
padding-left: 2.6028110359vw;
padding-right: 2.6028110359vw;
margin-left: auto;
margin-right: auto;
display: flex;
align-items: center;
}
@media screen and (max-width: 1500px) {
.header-top__center {
padding-left: 50px;
padding-right: 50px;
}
}
@media screen and (max-width: 1100px) {
.header-top__center {
padding-left: 30px;
padding-right: 30px;
}
}
@media screen and (max-width: 960px) {
.header-top__center {
padding-left: 15px;
padding-right: 15px;
width: 100%;
justify-content: center;
}
}
.header-top__location {
font-weight: 400;
font-size: 0.8849557522vw;
line-height: 140%;
color: #FFFFFF;
margin-right: 1.5616866216vw;
}
@media screen and (max-width: 1500px) {
.header-top__location {
font-size: 17px;
margin-right: 30px;
}
}
@media screen and (max-width: 780px) {
.header-top__location {
font-size: 14px;
}
}
@media screen and (max-width: 560px) {
.header-top__location {
margin-right: auto;
font-size: 10px;
}
}
.header-top__phone,
.header-top__email {
font-weight: 600;
font-size: 0.9370119729vw;
line-height: 150%;
color: #FFFFFF;
margin-right: 1.0411244144vw;
text-decoration: none;
transition: all 0.3s;
}
@media screen and (max-width: 1500px) {
.header-top__phone,
.header-top__email {
margin-right: 20px;
font-size: 18px;
}
}
@media screen and (max-width: 780px) {
.header-top__phone,
.header-top__email {
font-size: 14px;
}
}
@media screen and (max-width: 560px) {
.header-top__phone,
.header-top__email {
font-size: 12px;
margin-right: 10px;
}
}
@media screen and (max-width: 370px) {
.header-top__phone,
.header-top__email {
font-size: 11px;
}
}
.header-top__phone:hover,
.header-top__email:hover {
color: #a4d415;
}
.header-top__phone:active,
.header-top__email:active {
color: #b3b3b3;
}
@media screen and (max-width: 800px) {
.header-top__phone--2 {
display: none;
}
}
@media screen and (max-width: 560px) {
.header-top__phone {
order: 3;
}
}
.header-top__work-hours {
font-weight: 400;
font-size: 0.7287870901vw;
line-height: 150%;
color: #FFFFFF;
margin-right: 1.0411244144vw;
}
@media screen and (max-width: 1500px) {
.header-top__work-hours {
display: none;
}
}
@media screen and (max-width: 560px) {
.header-top__messengers {
display: none;
}
}
.header-top__messengers a {
display: inline-block;
transition: all 0.3s;
text-decoration: none;
}
.header-top__messengers a:hover {
opacity: 0.8;
}
.header-top__messengers a:active {
opacity: 0.6;
}
.header-top__messengers a:not(:last-child) {
margin-right: 0.5205622072vw;
}
@media screen and (max-width: 1500px) {
.header-top__messengers a:not(:last-child) {
margin-right: 10px;
}
}
.header-top__messengers a svg {
fill: #ffffff;
transition: fill 0.3s;
width: 1.3534617387vw;
height: auto;
}
@media screen and (max-width: 1500px) {
.header-top__messengers a svg {
width: 26px;
}
}
.header-bottom {
border-bottom: 1px solid #ffffff;
}
@media screen and (max-width: 1500px) {
.header-bottom {
display: block;
}
}
@media screen and (max-width: 780px) {
.header-bottom {
padding-left: 15px;
padding-right: 15px;
}
}
@media screen and (max-width: 560px) {
.header-bottom {
min-height: 42px;
}
}
.header-bottom__row {
display: flex;
align-items: center;
}
.header-bottom__nav-wrapper {
margin-right: 1.5616866216vw;
}
@media screen and (max-width: 1500px) {
.header-bottom__nav-wrapper {
position: fixed;
margin-right: 30px;
width: 290px;
left: -290px;
top: 100px;
background: #fff;
padding: 23px 20px;
transition: left 0.3s;
}
.header-bottom__nav-wrapper.opened {
left: 0;
}
}
.header-bottom__nav-wrapper ul {
list-style: none;
}
.header-bottom__nav-wrapper>ul {
display: flex;
padding: 0;
margin: 0;
list-style: none;
}
@media screen and (max-width: 1500px) {
.header-bottom__nav-wrapper>ul {
flex-direction: column;
}
}
.header-bottom__nav-wrapper>ul a {
font-weight: 400;
font-size: 0.8849557522vw;
line-height: 140%;
letter-spacing: -0.011em;
color: #ffffff;
text-decoration: none;
transition: color 0.3s;
}
.header-bottom__nav-wrapper>ul a:hover {
color: #A4D415;
}
.header-bottom__nav-wrapper>ul a:active {
color: #b3b3b3;
}
@media screen and (max-width: 1500px) {
.header-bottom__nav-wrapper>ul a {
color: #202020;
font-size: 14px;
padding: 10px 60px 10px 10px;
display: block;
position: relative;
transition: color 0.3s, background 0.3s;
}
.header-bottom__nav-wrapper>ul a .arrow {
width: 17px;
height: 17px;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 10px;
}
.header-bottom__nav-wrapper>ul a .arrow::before,
.header-bottom__nav-wrapper>ul a .arrow::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: no-repeat center/contain;
transition: opacity 0.3s, transform 0.3s;
transform: rotate(-135deg);
}
.header-bottom__nav-wrapper>ul a .arrow::before {
background-image: url(//resort.artpeople.ru/wp-content/themes/resort/img/accordion-arrow-white.svg);
opacity: 0;
}
.header-bottom__nav-wrapper>ul a .arrow::after {
background-image: url(//resort.artpeople.ru/wp-content/themes/resort/img/accordion-arrow-black.svg);
}
.header-bottom__nav-wrapper>ul a:hover {
color: #ffffff;
background: #202020;
}
.header-bottom__nav-wrapper>ul a:hover .arrow::before,
.header-bottom__nav-wrapper>ul a:hover .arrow::after {
transform: rotate(-90deg);
}
.header-bottom__nav-wrapper>ul a:hover .arrow::before {
opacity: 1;
}
.header-bottom__nav-wrapper>ul a:hover .arrow::after {
opacity: 0;
}
}
.header-bottom__nav-wrapper>ul>.menu-item {
position: relative;
padding-top: 1.0411244144vw;
padding-bottom: 1.0411244144vw;
z-index: 10;
}
@media screen and (max-width: 1500px) {
.header-bottom__nav-wrapper>ul>.menu-item {
border: 1px solid #202020;
padding: 0;
}
}
.header-bottom__nav-wrapper>ul>.menu-item:not(:last-of-type) {
margin-right: 1.5616866216vw;
}
@media screen and (max-width: 1600px) {
.header-bottom__nav-wrapper>ul>.menu-item:not(:last-of-type) {
margin-right: 15px;
}
}
@media screen and (max-width: 1500px) {
.header-bottom__nav-wrapper>ul>.menu-item:not(:last-of-type) {
border-bottom: 0;
margin-right: 0;
}
}
.header-bottom__nav-wrapper>ul>.menu-item>a svg {
stroke: #ffffff;
transition: stroke 0.3s;
vertical-align: middle;
margin-right: 8px;
width: 0.8849557522vw;
height: 0.8849557522vw;
}
@media screen and (max-width: 1500px) {
.header-bottom__nav-wrapper>ul>.menu-item>a svg {
display: none;
}
}
.header-bottom__nav-wrapper>ul>.menu-item>a:hover svg {
stroke: #A4D415;
}
.header-bottom__nav-wrapper>ul>.menu-item>a:active {
color: #A4D415;
}
.header-bottom__nav-wrapper>ul>.menu-item>a:active svg {
stroke: #A4D415;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu {
width: 260px;
position: absolute;
left: 0;
top: 100%;
padding: 15px 20px;
background: #FFFFFF;
border: 1px solid #202020;
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.15);
opacity: 0;
pointer-events: none;
transition: opacity 0.3s;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu::before {
content: "";
display: block;
position: absolute;
width: 23px;
height: 15px;
background: url(//resort.artpeople.ru/wp-content/themes/resort/img/icon-white-triangle.svg) no-repeat center/contain;
top: -12px;
left: 34px;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu a {
color: #303030;
transition: color 0.3s;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu a:hover {
color: #A4D415;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu>.row>li {
padding-top: 5px;
padding-bottom: 5px;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu>.row>li.has-child {
position: relative;
width: calc(100% + 20px);
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu>.row>li.has-child>.sub-menu {
position: absolute;
left: 100%;
top: 0;
width: 340px;
background: #fff;
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.15);
padding: 11px 20px;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu>.row>li.has-child>.sub-menu a:hover {
color: #A4D415;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu>.row>li.has-child:hover>.sub-menu {
opacity: 1;
pointer-events: all;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu--2-cols {
width: 751px;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu--2-cols .row {
display: flex;
flex-wrap: wrap;
margin-left: -7px;
margin-right: -7px;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu--2-cols .row li {
margin-left: 7px;
margin-right: 7px;
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu--2-cols .row li:nth-child(even) {
width: calc(54% - 14px);
}
.header-bottom__nav-wrapper>ul>.menu-item>.sub-menu--2-cols .row li:nth-child(odd) {
width: calc(46% - 14px);
}
.header-bottom__nav-wrapper>ul>.menu-item:hover>.sub-menu {
opacity: 1;
pointer-events: all;
list-style: none;
}
@media screen and (max-width: 1500px) {
.header-bottom__nav-wrapper>ul>.menu-item:hover>.sub-menu {
display: none !important;
}
}
.header-bottom__calc-btn {
margin-left: auto;
text-decoration: underline;
color: #ffffff;
padding-left: 2.9151483602vw;
padding-right: 2.9151483602vw;
align-self: stretch;
display: flex;
align-items: center;
justify-content: center;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
transition: color 0.3s;
flex: 0 0 15.6168662155vw;
font-size: 0.9370119729vw;
}
.header-bottom__calc-btn:hover {
color: #A4D415;
}
.header-bottom__calc-btn:active {
color: #b3b3b3;
}
@media screen and (max-width: 1500px) {
.header-bottom__calc-btn {
display: none;
}
}
.header-bottom__lang-wrapper {
position: relative;
padding-left: 20px;
padding-right: 20px;
border-right: 1px solid #ffffff;
align-self: stretch;display: flex;justify-content: center;
align-items: center;
}
.header-bottom__lang-current {
font-size: 16px;
font-weight: 700;
color: #fff;
background: transparent;
border: none;
text-transform: uppercase;
cursor: pointer;
position: relative;
padding: 0 20px 0 0;
transition: color 0.3s;
}
.header-bottom__lang-current::before {
display: block;
content: '';
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 10px;
height: 10px;
background: url(//resort.artpeople.ru/wp-content/themes/resort/img/angle-down.svg) no-repeat center / contain;
}
.header-bottom__lang-current:hover {
color: #a4d415;
}
.header-bottom__lang-dropdown {
width: 100%;
position: absolute;
right: 0;
top: calc(100% + 8px);
display: flex;
flex-direction: column;
gap: 6px;
background: #fff;
z-index: 3;
padding: 8px; box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.04);
pointer-events: none;
opacity: 0;
transform: translateY(-10px);
transition: all 0.3s;
}
.header-bottom__lang-dropdown.active {
opacity: 1;
transform: translateY(0);
pointer-events: all;
}
.header-bottom__lang-dropdown button {
padding: 5px;
border: none;
background: transparent;
cursor: pointer;
transition: color 0.3s;
text-transform: uppercase;
font-size: 16px;color: #141414;
}
.header-bottom__lang-dropdown button:hover {
color: #a4d415;
}
.header-bottom__burger-btn {
width: 22px;
height: 16px;
background: transparent;
position: relative;
border: none;
}
.header-bottom__burger-btn-wrapper {
display: none;
}
@media screen and (max-width: 1500px) {
.header-bottom__burger-btn-wrapper {
flex: 0 0 93px;
border-right: 1px solid #ffffff;
align-self: stretch;
display: flex;
align-items: center;
justify-content: flex-start;
}
}
@media screen and (max-width: 370px) {
.header-bottom__burger-btn-wrapper {
flex-basis: 80px;
}
}
.header-bottom__burger-btn span {
display: inline-block;
position: absolute;
height: 2px;
left: 0;
background: #ffffff;
transition: background 0.3s;
}
.header-bottom__burger-btn span:nth-child(1) {
top: 0;
width: 10px;
}
.header-bottom__burger-btn span:nth-child(2) {
top: 7px;
width: 15px;
}
.header-bottom__burger-btn span:nth-child(3) {
top: 14px;
width: 100%;
}
.header-bottom__mob-logo-wrapper {
position: relative;
display: none;
}
@media screen and (max-width: 1500px) {
.header-bottom__mob-logo-wrapper {
display: flex;
justify-content: center;
align-items: center;
padding: 7px 18px;
flex: 1 1 auto;
}
}
.header-bottom__mob-logo-wrapper img {
width: 150px !important;
}
@media screen and (max-width: 560px) {
.header-bottom__mob-logo-wrapper img {
width: 125px !important;
}
}
.header-bottom__mob-logo-wrapper img.header__logo--dark {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 150px;
opacity: 0;
transition: opacity 0.3s;
}
@media screen and (max-width: 560px) {
.header-bottom__mob-logo-wrapper img.header__logo--dark {
width: 125px;
max-width: calc(100% - 36px);
}
}
.header-bottom__search-btn {
width: 17px;
height: 16px;
border: none;
transition: all 0.3s;
background: transparent;
padding: 0;
}
.header-bottom__search-btn-wrapper {
display: none;
}
@media screen and (max-width: 1500px) {
.header-bottom__search-btn-wrapper {
display: flex;
align-items: center;
justify-content: flex-end;
border-left: 1px solid #ffffff;
flex: 0 0 93px;
align-self: stretch;
}
}
@media screen and (max-width: 370px) {
.header-bottom__search-btn-wrapper {
flex-basis: 80px;
}
}
.header-bottom__search-btn svg {
width: 100%;
height: 100%;
stroke: #FFF;
transition: all 0.3s;
}
.header-bottom__search-btn:hover {
opacity: 0.8;
}
.header-bottom__search-btn:active {
opacity: 0.6;
}
.header__logo {
width: auto !important;
height: auto !important;
object-fit: contain;
}
@media screen and (max-width: 560px) {
.header__logo {
width: 94px !important;
height: 27px !important;
}
}
.header.submenu-active .header-bottom,
.header.submenu-active .header-top {
position: relative;
z-index: 101;
}
.header.submenu-active .header-bottom__nav-wrapper {
display: none;
}
.header--scrolled,
body.black-header,
body.submenu-active {
background: #ffffff;
}
.header--scrolled .header-top,
body.black-header .header-top,
body.submenu-active .header-top {
border-bottom-color: #303030;
}
.header--scrolled .header-top__location,
.header--scrolled .header-top__phone,
.header--scrolled .header-top__email,
.header--scrolled .header-top__work-hours,
.header--scrolled .header-bottom__lang-current,
body.black-header .header-top__location,
body.black-header .header-top__phone,
body.black-header .header-top__email,
body.black-header .header-top__work-hours,
body.black-header .header-bottom__lang-current,
body.submenu-active .header-top__location,
body.submenu-active .header-top__phone,
body.submenu-active .header-top__email,
body.submenu-active .header-top__work-hours,
body.submenu-active .header-bottom__lang-current
{
color: #303030;
}
.header--scrolled .header-top__logo-wrapper,
body.black-header .header-top__logo-wrapper,
body.submenu-active .header-top__logo-wrapper {
border-color: #303030;
}
.header--scrolled .header-bottom__lang-wrapper,
body.black-header .header-bottom__lang-wrapper,
body.submenu-active .header-bottom__lang-wrapper {
border-color: #303030;
}
.header--scrolled .header-bottom__lang-current::before,
body.black-header .header-bottom__lang-current::before,
body.submenu-active .header-bottom__lang-current::before {
background-image: url(//resort.artpeople.ru/wp-content/themes/resort/img/angle-down-black.svg);
}
.header--scrolled .header-top__messengers a svg,
body.black-header .header-top__messengers a svg,
body.submenu-active .header-top__messengers a svg {
fill: #303030;
}
.header--scrolled .header-top__logo-wrapper img,
body.black-header .header-top__logo-wrapper img,
body.submenu-active .header-top__logo-wrapper img {
opacity: 0;
}
.header--scrolled .header-top__logo-wrapper img.header__logo--dark,
body.black-header .header-top__logo-wrapper img.header__logo--dark,
body.submenu-active .header-top__logo-wrapper img.header__logo--dark {
opacity: 1;
}
.header--scrolled .header-bottom,
body.black-header .header-bottom,
body.submenu-active .header-bottom {
border-bottom: 1px solid #303030;
}
.header--scrolled .header-bottom__mob-logo-wrapper img,
body.black-header .header-bottom__mob-logo-wrapper img,
body.submenu-active .header-bottom__mob-logo-wrapper img {
opacity: 0;
}
.header--scrolled .header-bottom__mob-logo-wrapper img.header__logo--dark,
body.black-header .header-bottom__mob-logo-wrapper img.header__logo--dark,
body.submenu-active .header-bottom__mob-logo-wrapper img.header__logo--dark {
opacity: 1;
}
.header--scrolled .header-bottom__search-btn-wrapper,
body.black-header .header-bottom__search-btn-wrapper,
body.submenu-active .header-bottom__search-btn-wrapper {
border-color: #303030;
}
.header--scrolled .header-bottom__burger-btn-wrapper,
body.black-header .header-bottom__burger-btn-wrapper,
body.submenu-active .header-bottom__burger-btn-wrapper {
border-color: #303030;
}
.header--scrolled .header-bottom__nav-wrapper>ul>.menu-item>a svg,
body.black-header .header-bottom__nav-wrapper>ul>.menu-item>a svg,
body.submenu-active .header-bottom__nav-wrapper>ul>.menu-item>a svg {
stroke: #303030;
}
.header--scrolled .header-bottom__nav-wrapper>ul a,
body.black-header .header-bottom__nav-wrapper>ul a,
body.submenu-active .header-bottom__nav-wrapper>ul a {
color: #303030;
}
.header--scrolled .header-bottom__nav-wrapper>ul a:hover,
body.black-header .header-bottom__nav-wrapper>ul a:hover,
body.submenu-active .header-bottom__nav-wrapper>ul a:hover {
color: #A4D415;
}
.header--scrolled .header-bottom__nav-wrapper>ul a:hover svg,
body.black-header .header-bottom__nav-wrapper>ul a:hover svg,
body.submenu-active .header-bottom__nav-wrapper>ul a:hover svg {
stroke: #A4D415;
}
.header--scrolled .header-bottom__calc-btn,
body.black-header .header-bottom__calc-btn,
body.submenu-active .header-bottom__calc-btn {
color: #303030;
border-color: #303030;
}
.header--scrolled .header-bottom__calc-btn:hover,
body.black-header .header-bottom__calc-btn:hover,
body.submenu-active .header-bottom__calc-btn:hover {
color: #A4D415;
}
.header--scrolled .header-search #ajaxsearchpro1_1 .probox .promagnifier div.innericon,
body.black-header .header-search #ajaxsearchpro1_1 .probox .promagnifier div.innericon,
body.submenu-active .header-search #ajaxsearchpro1_1 .probox .promagnifier div.innericon {
background-image: url(//resort.artpeople.ru/wp-content/themes/resort/img/icon-search-black.svg);
}
.header--scrolled .header-search #ajaxsearchpro1_1,
.header--scrolled .header-search #ajaxsearchpro1_2,
.header--scrolled .header-search div.asp_m.asp_m_1,
body.black-header .header-search #ajaxsearchpro1_1,
body.black-header .header-search #ajaxsearchpro1_2,
body.black-header .header-search div.asp_m.asp_m_1,
body.submenu-active .header-search #ajaxsearchpro1_1,
body.submenu-active .header-search #ajaxsearchpro1_2,
body.submenu-active .header-search div.asp_m.asp_m_1 {
border-color: #303030;
}
.header--scrolled .header-search #ajaxsearchpro1_1 .probox .proinput input.orig,
.header--scrolled .header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete,
.header--scrolled .header-search #ajaxsearchpro1_2 .probox .proinput input.orig,
.header--scrolled .header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete,
.header--scrolled .header-search div.asp_m.asp_m_1 .probox .proinput input.orig,
.header--scrolled .header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete,
body.black-header .header-search #ajaxsearchpro1_1 .probox .proinput input.orig,
body.black-header .header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete,
body.black-header .header-search #ajaxsearchpro1_2 .probox .proinput input.orig,
body.black-header .header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete,
body.black-header .header-search div.asp_m.asp_m_1 .probox .proinput input.orig,
body.black-header .header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete,
body.submenu-active .header-search #ajaxsearchpro1_1 .probox .proinput input.orig,
body.submenu-active .header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete,
body.submenu-active .header-search #ajaxsearchpro1_2 .probox .proinput input.orig,
body.submenu-active .header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete,
body.submenu-active .header-search div.asp_m.asp_m_1 .probox .proinput input.orig,
body.submenu-active .header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete {
color: #303030 !important;
}
.header--scrolled .header-search #ajaxsearchpro1_1 .probox .proinput input.orig::placeholder,
.header--scrolled .header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete::placeholder,
.header--scrolled .header-search #ajaxsearchpro1_2 .probox .proinput input.orig::placeholder,
.header--scrolled .header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete::placeholder,
.header--scrolled .header-search div.asp_m.asp_m_1 .probox .proinput input.orig::placeholder,
.header--scrolled .header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete::placeholder,
body.black-header .header-search #ajaxsearchpro1_1 .probox .proinput input.orig::placeholder,
body.black-header .header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete::placeholder,
body.black-header .header-search #ajaxsearchpro1_2 .probox .proinput input.orig::placeholder,
body.black-header .header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete::placeholder,
body.black-header .header-search div.asp_m.asp_m_1 .probox .proinput input.orig::placeholder,
body.black-header .header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete::placeholder,
body.submenu-active .header-search #ajaxsearchpro1_1 .probox .proinput input.orig::placeholder,
body.submenu-active .header-search #ajaxsearchpro1_1 .probox .proinput input.autocomplete::placeholder,
body.submenu-active .header-search #ajaxsearchpro1_2 .probox .proinput input.orig::placeholder,
body.submenu-active .header-search #ajaxsearchpro1_2 .probox .proinput input.autocomplete::placeholder,
body.submenu-active .header-search div.asp_m.asp_m_1 .probox .proinput input.orig::placeholder,
body.submenu-active .header-search div.asp_m.asp_m_1 .probox .proinput input.autocomplete::placeholder {
color: #303030 !important;
}
.header--scrolled .header-bottom__burger-btn span,
body.black-header .header-bottom__burger-btn span,
body.submenu-active .header-bottom__burger-btn span {
background: #303030;
}
.header--scrolled .header-bottom__search-btn svg,
body.black-header .header-bottom__search-btn svg,
body.submenu-active .header-bottom__search-btn svg {
stroke: #303030;
}
.skiptranslate {
position: absolute;
left: -1000px;
top: -1000px;
opacity: 0;
z-index: -100;
width: 1px;
height: 1px;
}
@media screen and (max-width: 1500px) {
.header-bottom__lang-wrapper {
border-left: 1px solid #fff;
margin-left: 20px;
}
}
@media screen and (max-width: 600px) {
.header-bottom__lang-wrapper {
margin-left: 10px;
padding-left: 10px;
padding-right: 10px;
}
.header-bottom__search-btn-wrapper, .header-bottom__burger-btn-wrapper {
flex: 0 0 50px;
}
}.main-hero {
position: relative;
padding-top: 12.4934929724vw;
padding-bottom: 3.1233732431vw;
background: no-repeat left 50% top 30px/100%;
opacity: 1;
overflow: hidden;
margin-bottom: 7.8084331078vw;
min-height: 100vh;
display: flex;
background: #868686;
}
.main-hero::before {
content: '';
display: block;
left: 0;
top: 0;
position: absolute;
width: 100%;
height: 100%;
z-index: 3;
background: rgba(0,0,0,0.5);
}
@media screen and (max-width: 1500px) {
.main-hero {
margin-bottom: 150px;
}
}
.main-hero--article {
padding-top: 8.3289953149vw;
}
@media screen and (max-width: 1500px) {
.main-hero--article {
padding-top: 160px;
}
}
.main-hero__bg {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: left 50% top 0;
font-size: 0;
}
@media screen and (max-width: 1500px) {
.main-hero {
margin-bottom: 120px;
padding-top: 250px;
padding-bottom: 80px;
}
}
@media screen and (max-width: 960px) {
.main-hero {
background-position: left 50% top 300px;
padding-top: 200px;
}
}
@media screen and (max-width: 780px) {
.main-hero {
margin-bottom: 100px;
padding-top: 160px;
}
}
@media screen and (max-width: 560px) {
.main-hero {
margin-bottom: 50px;
background-position: left 50% top 220px;
padding-top: 130px;
padding-bottom: 100px;
}
}
@media screen and (max-width: 560px) {
.main-hero--logo-and-title {
padding-top: 134px;
}
}
.main-hero--has-breadcrumbs {
padding-top: 8.3289953149vw;
}
@media screen and (max-width: 1500px) {
.main-hero--has-breadcrumbs {
padding-top: 160px;
}
}
.main-hero__breadcrumbs {
margin-bottom: 6.2467464862vw;
}
@media screen and (max-width: 1500px) {
.main-hero__breadcrumbs {
margin-bottom: 120px;
}
}
.main-hero__breadcrumbs a, .main-hero__breadcrumbs {
color: #ffffff;
}
.main-hero .container {
position: relative;
z-index: 4;
width: 100%;
display: flex;
flex-direction: column;
}
.main-hero__title {
text-align: center;
margin: 0 0 4.1644976575vw 0;
}
@media screen and (max-width: 1500px) {
.main-hero__title {
margin-bottom: 80px;
}
}
@media screen and (max-width: 960px) {
.main-hero__title {
margin-bottom: 65px;
}
}
@media screen and (max-width: 780px) {
.main-hero__title {
margin-bottom: 50px;
}
}
@media screen and (max-width: 560px) {
.main-hero__title {
margin-bottom: 40px;
}
}
.main-hero__title * {
font-weight: 500;
line-height: 1.225;
letter-spacing: 0.04em;
color: #ffffff;
margin: 0;
font-size: 4.1644976575vw;
}
@media screen and (min-width: 1921px) and (max-width: 1500px) {
.main-hero__title * {
font-size: 80px;
}
}
.main-hero__title * b, .main-hero__title * strong {
color: #a4d415;
}
@media screen and (max-width: 1440px) {
.main-hero__title * {
font-size: 56px;
line-height: 120%;
}
}
@media screen and (max-width: 1100px) {
.main-hero__title * {
font-size: 48px;
}
}
@media screen and (max-width: 960px) {
.main-hero__title * {
font-size: 40px;
}
}
@media screen and (max-width: 780px) {
.main-hero__title * {
font-size: 36px;
}
}
@media screen and (max-width: 560px) {
.main-hero__title * {
font-size: 30px;
text-align: left;
}
}
@media screen and (max-width: 960px) {
.main-hero__title--small-mob * {
font-size: 32px;
}
}
@media screen and (max-width: 780px) {
.main-hero__title--small-mob * {
font-size: 26px;
}
}
@media screen and (max-width: 560px) {
.main-hero__title--small-mob * {
font-size: 22px;
}
}
.main-hero__logo {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 11.7647058824vw;
}
@media screen and (max-width: 1500px) {
.main-hero__logo {
max-width: 226px;
}
}
@media screen and (max-width: 780px) {
.main-hero__logo {
max-width: 200px;
}
}
@media screen and (max-width: 560px) {
.main-hero__logo {
display: none;
}
}
.main-hero__logo--large {
width: 33.8365434669vw;
max-width: 100%;
}
@media screen and (max-width: 1500px) {
.main-hero__logo--large {
width: 550px;
}
}
.main-hero__bottom {
display: flex;
align-items: flex-end;
}
@media screen and (max-width: 1220px) {
.main-hero__bottom {
flex-direction: column;
align-items: flex-start;
}
}
.main-hero__bottom-left {
flex: 0 0 30.7131702238vw;
margin-right: 2.0822488287vw;
}
@media screen and (max-width: 1220px) {
.main-hero__bottom-left {
flex: unset;
margin-right: 0;
margin-bottom: 30px;
}
}
@media screen and (max-width: 560px) {
.main-hero__bottom-left {
margin-bottom: 20px;
}
}
.main-hero__subtitle {
font-weight: 500;
font-size: 1.4575741801vw;
line-height: 130%;
letter-spacing: 0.04em;
color: #FFFFFF;
margin: 0 0 1.0411244144vw 0;
}
@media screen and (max-width: 1500px) {
.main-hero__subtitle {
font-size: 24px;
line-height: 150%;
margin-bottom: 20px;
}
}
@media screen and (max-width: 960px) {
.main-hero__subtitle {
font-size: 22px;
}
}
@media screen and (max-width: 780px) {
.main-hero__subtitle {
font-size: 20px;
}
}
@media screen and (max-width: 560px) {
.main-hero__subtitle {
font-weight: 400;
font-size: 18px;
letter-spacing: 0.04em;
}
}
.main-hero__text {
line-height: 140%;
letter-spacing: -0.011em;
margin: 0 0 1.0411244144vw;
font-weight: 400;
font-size: 0.9370119729vw;
color: #FFFFFF;
}
@media screen and (max-width: 1500px) {
.main-hero__text {
font-size: 18px;
margin-bottom: 20px;
}
}
@media screen and (max-width: 780px) {
.main-hero__text {
font-size: 16px;
}
}
@media screen and (max-width: 560px) {
.main-hero__text {
font-size: 15px;
line-height: 140%;
}
.main-hero__text br {
display: none;
}
}
.main-hero__block {
max-width: 100%;
margin-top: auto;
}
@media screen and (max-width: 1500px) {
.main-hero__block {
max-width: 785px;
}
}
.main-hero__block-bottom {
display: flex;
align-items: center;
}
@media screen and (max-width: 780px) {
.main-hero__block-bottom {
flex-direction: column;
align-items: flex-start;
}
}
.main-hero__block-bottom-desc {
margin: 0;
font-weight: 400;
font-size: 0.7287870901vw;
line-height: 150%;
letter-spacing: 0.02em;
color: #FFFFFF;
}
@media screen and (max-width: 1500px) {
.main-hero__block-bottom-desc {
font-size: 14px;
}
}
.main-hero__btn {
margin-right: 1.0411244144vw;
}
@media screen and (max-width: 1500px) {
.main-hero__btn {
margin-right: 20px;
}
}
@media screen and (max-width: 780px) {
.main-hero__btn {
margin-right: 0;
margin-bottom: 10px;
width: 100%;
max-width: 400px;
text-align: center;
}
}
@media screen and (max-width: 560px) {
.main-hero__btn {
max-width: 100%;
}
}
.main-hero__down-btn {
position: absolute;
right: 3.1233732431vw;
bottom: 3.4877667881vw;
width: 3.1233732431vw;
height: 3.1233732431vw;
padding: 0;
border: 1px solid #FFFFFF;
background: transparent;
transition: background 0.3s;
cursor: pointer;
}
@media screen and (max-width: 1500px) {
.main-hero__down-btn {
bottom: 120px;
right: 30px;
width: 60px;
height: 60px;
}
}
@media screen and (max-width: 960px) {
.main-hero__down-btn {
display: none;
}
}
.main-hero__down-btn:focus {
outline: none;
}
.main-hero__down-btn > div {
position: absolute;
height: 4.6850598647vw;
width: 100%;
bottom: 0;
left: 0;
overflow: hidden;
}
@media screen and (max-width: 1500px) {
.main-hero__down-btn > div {
height: 90px;
}
}
.main-hero__down-btn svg {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 0;
stroke: #ffffff;
transition: stroke 0.3s;
width: 1.5616866216vw;
height: 3.0192608017vw;
}
@media screen and (max-width: 1500px) {
.main-hero__down-btn svg {
width: 30px;
height: 58px;
}
}
.main-hero__down-btn:hover {
background: #ffffff;
}
.main-hero__down-btn:hover svg {
stroke: #A4D415;
}
.main-hero--has-breadcrumbs {
padding-top: 8.3289953149vw;
}
@media screen and (max-width: 1500px) {
.main-hero--has-breadcrumbs {
padding-top: 160px;
}
}
@media screen and (max-width: 780px) {
.main-hero--has-breadcrumbs {
padding-top: 120px;
}
}
@media screen and (max-width: 560px) {
.main-hero--has-breadcrumbs {
padding-top: 100px;
}
}
.main-hero--has-breadcrumbs .breadcrumbs {
margin-bottom: 6.2467464862vw;
}
@media screen and (max-width: 1500px) {
.main-hero--has-breadcrumbs .breadcrumbs {
margin-bottom: 120px;
}
}
@media screen and (max-width: 960px) {
.main-hero--has-breadcrumbs .breadcrumbs {
margin-bottom: 90px;
}
}
@media screen and (max-width: 780px) {
.main-hero--has-breadcrumbs .breadcrumbs {
margin-bottom: 65px;
}
}
@media screen and (max-width: 560px) {
.main-hero--has-breadcrumbs .breadcrumbs {
margin-bottom: 44px;
}
}
.main-hero--has-breadcrumbs .breadcrumbs a, .main-hero--has-breadcrumbs .breadcrumbs {
color: #ffffff;
}
.main-hero--has-breadcrumbs .breadcrumbs a:hover {
color: #A4D415;
}
.main-hero__article-date, .main-hero__article-time {
margin: 0;
font-size: 0.9370119729vw;
line-height: 140%;
color: #FFFFFF;
}
@media screen and (max-width: 1500px) {
.main-hero__article-date, .main-hero__article-time {
font-size: 18px;
}
}
.main-hero__article-time b {
font-weight: 700;
}
.main-hero__article-meta {
margin-bottom: 1.0411244144vw;
}
@media screen and (max-width: 1500px) {
.main-hero__article-meta {
margin-bottom: 20px;
}
}
@media screen and (max-width: 780px) {
.main-hero--project .main-hero__title {
flex: 1 1 auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
}
@media screen and (max-width: 780px) {
.main-hero--project .main-hero__title * {
text-align: center;
font-size: 26px;
}
}
@media screen and (max-width: 560px) {
.main-hero--project .main-hero__title * {
font-size: 22px;
}
}
.main-hero--text-shadow .main-hero__title * {
text-shadow: 0 0 22px rgba(0, 0, 0, 0.58);
}
.main-hero--text-shadow .main-hero__subtitle {
text-shadow: 0 0 22px rgba(0, 0, 0, 0.58);
}
@media screen and (max-width: 780px) {
body.ya-b .main-hero {
padding-bottom: 160px;
}
}