/*** The new CSS reset - version 1.11.2 (last updated 15.11.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Fix mobile Safari increase font-size on landscape mode */ html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu, summary { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; box-sizing: border-box; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; box-sizing: border-box; } /* Remove details summary webkit styles */ ::-webkit-details-marker { display: none; } @font-face { font-family: Athelas; font-display: swap; src: url("../fonts/Athelas-Bold.woff2") format("woff2"), url("../fonts/Athelas-Bold.woff") format("woff"); font-weight: 700; font-style: normal; } @font-face { font-family: Athelas; font-display: swap; src: url("../fonts/Athelas-BoldItalic.woff2") format("woff2"), url("../fonts/Athelas-BoldItalic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: Athelas; font-display: swap; src: url("../fonts/Athelas-Italic.woff2") format("woff2"), url("../fonts/Athelas-Italic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: Athelas; font-display: swap; src: url("../fonts/Athelas-Regular.woff2") format("woff2"), url("../fonts/Athelas-Regular.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: CochinLTStd; font-display: swap; src: url("../fonts/CochinLTStd-Bold.woff2") format("woff2"), url("../fonts/CochinLTStd-Bold.woff") format("woff"); font-weight: 700; font-style: normal; } @font-face { font-family: CochinLTStd; font-display: swap; src: url("../fonts/CochinLTStd-BoldItalic.woff2") format("woff2"), url("../fonts/CochinLTStd-BoldItalic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: CochinLTStd; font-display: swap; src: url("../fonts/CochinLTStd-Italic.woff2") format("woff2"), url("../fonts/CochinLTStd-Italic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: CochinLTStd; font-display: swap; src: url("../fonts/CochinLTStd.woff2") format("woff2"), url("../fonts/CochinLTStd.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-Black.woff2") format("woff2"), url("../fonts/GothamPro-Black.woff") format("woff"); font-weight: 900; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-BlackItalick.woff2") format("woff2"), url("../fonts/GothamPro-BlackItalick.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-Bold.woff2") format("woff2"), url("../fonts/GothamPro-Bold.woff") format("woff"); font-weight: 700; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-BoldItalic.woff2") format("woff2"), url("../fonts/GothamPro-BoldItalic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-Italic.woff2") format("woff2"), url("../fonts/GothamPro-Italic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-Light.woff2") format("woff2"), url("../fonts/GothamPro-Light.woff") format("woff"); font-weight: 300; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-LightItalic.woff2") format("woff2"), url("../fonts/GothamPro-LightItalic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-Medium.woff2") format("woff2"), url("../fonts/GothamPro-Medium.woff") format("woff"); font-weight: 500; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro-MediumItalic.woff2") format("woff2"), url("../fonts/GothamPro-MediumItalic.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: GothamPro; font-display: swap; src: url("../fonts/GothamPro.woff2") format("woff2"), url("../fonts/GothamPro.woff") format("woff"); font-weight: 400; font-style: normal; } html { font-family: GothamPro; } body { background-image: url("../img/leaf-bckg-right.svg"), url("../img/leaf-bckg-left.svg"), url("../img/leaf-bckg-right.svg"), url("../img/leaf-bckg-left.svg"), url("../img/leaf-bckg-right.svg"); background-position: right 1450px, left 2470px, right 3300px, left 4700px, right 5500px; background-repeat: no-repeat; } .container { width: 1190px; margin: 0 auto; } .title-h1 { font-family: Athelas; font-size: 75px; font-weight: 700; line-height: 93%; } .title-h2 { position: relative; width: -moz-fit-content; width: fit-content; font-family: Athelas; font-size: 40px; font-weight: 700; line-height: 100%; color: #5E7B6E; } .title-h2 span { position: absolute; top: -77px; left: -50px; font-size: 200px; font-weight: 700; line-height: 100%; text-align: center; opacity: 10%; } .fancybox__backdrop { background-color: rgba(0, 0, 0, 0.8666666667); } #success-message { position: fixed; top: 10px; right: 10px; z-index: 1000; padding: 15px; border: 1px solid transparent; border-radius: 4px; color: #155724; background-color: #d4edda; border-color: #c3e6cb; opacity: 1; transition: opacity 0.6s; } .header { position: fixed; width: 100%; z-index: 10; } .header__container_upper { color: #fff; background-color: #5E7B6E; font-weight: 400; line-height: 100%; } .header__container_main { background-color: #fff; } .header__container_mobile { display: none; } .header__upper-grid { display: flex; justify-content: space-between; height: 35px; } .header__main-grid { position: relative; display: flex; justify-content: space-between; align-items: center; height: 120px; font-size: 18px; font-weight: 500; line-height: 90%; text-align: left; color: #6D6E6E; } .header__main-grid > .logo { position: absolute; top: 44%; left: 50%; transform: translate(-50%, -50%); } .header__contacts-menu { display: flex; gap: 50px; } .header__item { display: flex; justify-content: center; align-items: center; gap: 15px; } .header__media { display: flex; align-items: center; gap: 20px; } .header__main-menu > .logo { display: none; width: 127px; } .header__main-menu { display: flex; gap: 40px; } .header__main-menu-list { display: flex; gap: 40px; } .header__mobile-media { display: none; } .header__link { transition: color 0.2s linear; } .header__link:hover, .header__link.active { color: #5E7B6E; } .header__btn-whatsapp { padding: 12px 30px; outline: 1px solid #5E7B6E; background-color: #fff; border-radius: 100px; color: #5E7B6E; transition-property: background-color, color; transition-timing-function: linear; transition-duration: 0.2s; } .header__btn-whatsapp:hover { background-color: #5E7B6E; color: #fff; } .footer__container { background-color: #E2E5E4; } .footer__container .container { padding: 0 24px; } .footer__container_main { border-bottom: 1px solid #a0b0a9; padding: 30px 0; background-image: url("../img/bckg-footer-left.svg"), url("../img/bckg-footer-right.svg"); background-repeat: no-repeat; background-position: left 35%, right 35%; } .footer__container_main .container { padding-left: 30px; } .footer__logo { display: flex; justify-content: center; margin-bottom: 50px; } .footer__grid { display: grid; grid-template-columns: repeat(4, 1fr); } .footer__item { display: flex; flex-direction: column; gap: 15px; color: #686867; } .footer__item-title { margin-bottom: 5px; font-family: Athelas; font-size: 20px; font-weight: 700; line-height: 90%; color: #5E7B6E; } .footer__link { font-size: 16px; font-weight: 400; line-height: 100%; } .footer__phones { display: flex; flex-direction: column; gap: 15px; } .footer__copyright-wrapper { display: flex; justify-content: space-between; padding: 32px 0; font-size: 14px; font-weight: 400; line-height: 100%; color: #a0b0a9; } .footer__media-list { display: flex; gap: 20px; } .hero { padding-top: 155px; } .hero__container { background-image: url("../img/main-photo.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; } .hero__wrapper { position: relative; display: flex; align-items: center; height: 700px; } .hero__info { width: 575px; height: 387px; padding: 45px; border-radius: 39px; background-color: #5E7B6E; color: #fff; background-image: url("../img/bckg-info.svg"); background-repeat: no-repeat; background-position: 0 60%; } .hero__info-text { display: flex; flex-direction: column; gap: 10px; } .hero__gift { font-size: 22px; font-weight: 700; line-height: 130%; } .hero__desc { font-size: 18px; font-weight: 400; line-height: 150%; } .hero__next-block { position: absolute; bottom: 45px; left: 50%; transform: translate(-50%); } .about__container { padding-top: 180px; margin-bottom: 230px; } .about__wrapper { display: grid; grid-template-columns: 50% 50%; } .about__text-wrapper { display: flex; flex-direction: column; gap: 50px; font-size: 18px; font-weight: 400; line-height: 150%; letter-spacing: -0.01em; color: #6D6E6E; } .about__slider-wrapper .swiper-pagination { position: relative !important; bottom: -25px; z-index: unset; } .about__slider-wrapper .swiper-pagination-bullet-active { background-color: #5E7B6E; } .about__overlay { display: block; opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; background-color: rgba(0, 0, 0, 0.3333333333); transition: 0.2s linear opacity; } .about__slider .swiper-wrapper { transform-style: flat !important; } .about__slider .swiper-slide { display: flex; background-position: center; background-size: cover; width: 400px !important; height: auto; } .about__slider .swiper-slide img { display: block; -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .about__slider .swiper-slide.swiper-slide-active:hover .about__show-menu-btn { opacity: 1; z-index: 2; } .about__slider .swiper-slide.swiper-slide-active:hover .about__overlay { opacity: 1; z-index: 1; } .about__show-menu-btn { display: block; opacity: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%); font-size: 18px; font-weight: 500; line-height: 150%; letter-spacing: -0.01em; text-align: center; text-transform: uppercase; color: #fff; padding: 12px 39px; width: 274px; outline: 2px solid #fff; border-radius: 100px; transition: opacity 0.2s linear; } .advantages__container { margin-bottom: 230px; } .advantages__title-wrapper { display: flex; justify-content: center; margin-bottom: 150px; } .advantages__title { text-align: center; } .advantages__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; } .advantages__list { display: grid; grid-gap: 30px; } .advantages__item { display: grid; grid-template-columns: 78px 1fr; gap: 41px; } .advantages__number { display: flex; align-items: center; font-family: CochinLTStd; font-size: 150px; font-weight: 700; line-height: 100%; text-align: center; color: #eff2f1; } .advantages__item-text-wrapper { display: flex; flex-direction: column; justify-content: center; gap: 20px; } .advantages__item-title { font-size: 24px; font-weight: 500; line-height: 150%; color: #424241; opacity: 80%; } .advantages__item-text { font-size: 18px; font-weight: 400; line-height: 120%; color: #6D6E6E; } .advantages__images { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 0; } .advantages__images img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .advantages__img { display: flex; height: 356px; } .banquet-hall__container { margin-bottom: 230px; } .banquet-hall__title-wrapper { display: flex; justify-content: center; margin-bottom: 150px; } .banquet-hall__title { text-align: center; } .banquet-hall__grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 25px; } .banquet-hall-card__wrapper { background-color: #EFF2F0; border-radius: 20px; } .banquet-hall-card__image img { width: 100%; height: 260px; -o-object-fit: cover; object-fit: cover; border-radius: 20px; } .banquet-hall-card__info { padding: 30px; } .banquet-hall-card__text { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px; } .banquet-hall-card__title { font-family: Athelas; font-size: 26px; font-weight: 700; line-height: 100%; color: #5E7B6E; margin-bottom: 20px; } .banquet-hall-card__list { display: flex; flex-direction: column; gap: 20px; font-size: 16px; font-weight: 400; line-height: 120%; list-style-type: disc; list-style-position: inside; color: #424241; opacity: 0.8; } .banquet-hall-card__btn-wrapper { display: flex; flex-direction: column; justify-content: end; } .banquet-hall-card__btn { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 500; line-height: 120%; color: #5E7B6E; } .banquet-hall-card__btn svg path { transition-property: fill, transform; transition-duration: 0.2s; transition-timing-function: ease-in; } .banquet-hall-card__btn svg ellipse { transition: fill 0.2s ease-in; } .banquet-hall-card__btn:hover svg path { transform: translate(10px); fill: #fff; } .banquet-hall-card__btn:hover svg ellipse { fill: #5E7B6E; } .gallery__container { margin-bottom: 120px; } .gallery__title { margin-bottom: 70px; text-align: center; } .gallery__grid { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 25px; margin-bottom: 50px; height: 1078px; overflow: hidden; transition: height 2s ease-out; } .gallery__title-wrapper { display: flex; justify-content: center; } .gallery__col-img { display: flex; } .gallery__col-img img { -o-object-fit: cover; object-fit: cover; height: 100%; width: 100%; } .gallery__col { display: flex; flex-direction: column; gap: 25px; } .gallery__col:not(:nth-child(2)) .gallery__col-img:nth-child(even) { height: 500px; } .gallery__col:not(:nth-child(2)) .gallery__col-img:nth-child(odd) { height: 264px; } .gallery__col:nth-child(2) .gallery__col-img { height: 526px; } .gallery__btn-wrapper { display: flex; justify-content: center; } .gallery__btn-show-more-svg_mobile { display: none; } .gallery__btn-show-more { display: flex; align-items: center; gap: 20px; font-size: 20px; font-weight: 500; line-height: 130%; color: #5E7B6E; text-transform: uppercase; } .gallery__btn-show-more svg path { transition-property: fill, transform; transition-duration: 0.2s; transition-timing-function: ease-in; } .gallery__btn-show-more svg circle { transition: fill 0.2s ease-in; } .gallery__btn-show-more:hover svg path { transform: translate(20px); fill: #fff; } .gallery__btn-show-more:hover svg circle { fill: #5E7B6E; } .video__container { margin-bottom: 120px; } .video__container .container { max-width: 1218px; } .video__wrapper video { width: 100%; border-radius: 10px; } .contacts__container { background-image: url("../img/contacts-bckg.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; } .contacts__wrapper { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: end; height: 950px; } .contacts-feedback__wrapper { padding: 94px 70px; background-color: #fff; } .contacts-feedback__title { margin-bottom: 30px; font-family: Athelas; font-size: 40px; font-weight: 700; line-height: 100%; text-align: center; color: #5E7B6E; } .contacts-feedback__text-wrapper { width: 380px; } .contacts-feedback__subtitle { margin-bottom: 70px; font-size: 18px; font-weight: 400; line-height: 120%; text-align: center; color: #686867; } .contacts-feedback__inputs { display: flex; flex-direction: column; gap: 50px; margin-bottom: 80px; } .contacts-feedback__input { border-bottom: 2px solid #5E7B6E; padding-bottom: 10px; font-size: 18px; line-height: 120%; } .contacts-feedback__input::-moz-placeholder { color: #c2c2c2; } .contacts-feedback__input::placeholder { color: #c2c2c2; } .contacts-feedback__btn { padding: 22px 0; font-size: 18px; font-weight: 500; line-height: 120%; text-align: center; text-transform: uppercase; cursor: pointer; width: 100%; background-color: #5E7B6E; color: #fff; transition-property: outline, color, background-color; transition-timing-function: linear; transition-duration: 0.2s; } .contacts-feedback__btn:hover { outline: solid #5E7B6E 1px; color: #5E7B6E; background-color: #ffffff; } .fixed-media { position: fixed; z-index: 5; right: 125px; bottom: 50px; } .fixed-media__wrapper { display: flex; flex-direction: column; gap: 20px; } .fixed-media__link { position: relative; text-align: center; } .fixed-media__link::before { content: ""; position: absolute; border: 2px solid #5E7B6E; left: -20px; opacity: 0; right: -20px; top: -20px; bottom: -20px; border-radius: 50%; animation: pulse 2.5s linear infinite; pointer-events: none; } @keyframes pulse { 0% { transform: scale(0.5); opacity: 0; } 50% { opacity: 1; } 100% { transform: scale(1.2); opacity: 0; } } .fixed-media__link:hover circle { stroke: #6D6E6E; fill: #fff; } .fixed-media__link:hover path { fill: #5E7B6E; } .fixed-media__link svg { pointer-events: none; display: flex; justify-content: center; align-items: center; } .fixed-media__link svg circle { transition-property: stroke, fill; transition-duration: 0.2s; transition-timing-function: linear; } .fixed-media__link svg path { transition-property: stroke, fill; transition-duration: 0.2s; transition-timing-function: linear; } #burger-menu { display: none; cursor: pointer; height: 27px; width: 27px; overflow: visible; position: relative; z-index: 3; } #burger-menu span { height: 3px; opacity: 1; position: absolute; background-color: #5E7B6E; transition: 0.3s ease-in-out; right: 0px; top: 13px; width: 27px; border-radius: 50px; } #burger-menu span:before, #burger-menu span:after { display: block; height: 3px; opacity: 1; position: absolute; background-color: #5E7B6E; transition: 0.3s ease-in-out; border-radius: 50px; } #burger-menu span:before, #burger-menu span:after { content: ""; } #burger-menu span:before { left: 0px; top: -7px; width: 27px; } #burger-menu span:after { left: 0px; top: 7px; width: 27px; } #burger-menu.close span { transform: rotate(-45deg); top: 13px; width: 27px; background-color: #5E7B6E; } #burger-menu.close span:before { top: 0px; transform: rotate(90deg); width: 27px; background-color: #5E7B6E; } #burger-menu.close span:after { top: 0px; left: 0; transform: rotate(90deg); opacity: 0; width: 0; background-color: #5E7B6E; } .menu-gallery { display: none; } .menu-gallery__wrapper { width: 824px; } .menu-gallery__wrapper .swiper-slide { text-align: center; } .menu-gallery__wrapper .swiper-button-next, .menu-gallery__wrapper .swiper-button-prev { bottom: 5px; top: unset; width: unset; } .menu-gallery__wrapper .swiper-button-next { content: url("../img/menu-gallery-arrow-next.svg"); } .menu-gallery__wrapper .swiper-button-prev { content: url("../img/menu-gallery-arrow-prev.svg"); } .menu-gallery__wrapper .swiper-slide { display: flex; height: auto; } .menu-gallery__wrapper .swiper-slide img { -o-object-fit: cover; object-fit: cover; height: 100%; width: 100%; } @media (max-width: 1300px) { .container { width: 900px; } .header__main-grid { font-size: 16px; } .header__main-menu { gap: 10px; } .header__main-menu-list { gap: 15px; } .banquet-hall__grid { grid-template-columns: 1fr 1fr; } } @media (max-width: 1000px) { .container { width: 700px; } .header__main-grid > .logo { width: 127px; } .header__contacts-menu { gap: 20px; } .header__main-menu { display: flex; align-items: center; flex-direction: column; gap: 50px; z-index: 3; visibility: hidden; min-width: 100%; min-height: 100%; position: fixed; top: 0; left: 0; height: 0; opacity: 0; text-align: center; padding-top: 20px; transition: all 0.3s ease-in-out; } .header__main-menu.overlay { visibility: visible; opacity: 1; padding-top: 73px; background: rgba(255, 255, 255, 0.9333333333); } .header__btn-whatsapp { position: absolute; width: -moz-fit-content; width: fit-content; bottom: -19px; left: 50%; transform: translate(-50%); white-space: nowrap; } .footer__grid { grid-template-columns: repeat(2, 1fr); gap: 36px; } .hero__wrapper { justify-content: center; } .hero__info { width: 100%; } .about__wrapper { grid-template-columns: 100%; gap: 50px; } .about__title-wrapper { display: flex; justify-content: center; } .advantages__grid { gap: 30px; } .advantages__img { height: auto; } .gallery__grid { grid-gap: 10px; margin-bottom: 30px; } .gallery__col { grid-gap: 10px; } #burger-menu { display: block; } .menu-gallery__wrapper { width: 100%; } } @media (max-width: 700px) { body { background-image: url("../img/leaf-bckg-mobile-right.svg"), url("../img/leaf-bckg-mobile-left.svg"), url("../img/leaf-bckg-mobile-right.svg"), url("../img/leaf-bckg-mobile-left.svg"), url("../img/leaf-bckg-mobile-right.svg"); background-position: right 1300px, left 2600px, right 4220px, left 5410px, right 5780px; } .container { padding: 0 20px; width: 100%; } .title-h1 { font-size: 55px; } .title-h2 { font-size: 25px; line-height: 90%; } .title-h2 span { font-size: 100px; line-height: 70%; left: -29px; top: -24px; } .header__container_mobile { display: block; } .header__upper-grid { height: 44px; font-size: 10px; line-height: 100%; } .header__main-grid { align-items: start; padding-top: 20px; } .header__contacts-menu { width: 100%; justify-content: space-between; gap: 15px; } .header__contacts-menu svg { width: 20px; height: 20px; } .header__item { gap: 9px; } .header__item:nth-child(2) { white-space: nowrap; order: 1; } .header__item:nth-child(3) { white-space: nowrap; } .header__media { display: none; } .header__main-menu > .logo { display: block; } .header__main-menu-list { flex-direction: column; gap: 30px; font-weight: bold; font-size: 18px; } .header__mobile-media { display: flex; gap: 20px; } .footer__container_main { padding-top: 270px; } .footer__logo { margin-bottom: 30px; } .footer__link { font-size: 14px; line-height: 120%; } .footer__phones { gap: 6px; } .footer__schedule, .footer__address { display: flex; flex-direction: column; gap: 10px; } .footer__copyright-wrapper { flex-direction: column; align-items: center; gap: 5px; font-size: 12px; line-height: 120%; letter-spacing: -0.5px; padding: 20px 0px; } .hero__container .container { padding: 0; } .hero__wrapper { align-items: end; height: 375px; } .hero__info { position: absolute; bottom: -288px; height: 310px; border-radius: 39px 39px 0 0; padding: 30px 20px 20px 20px; text-align: center; } .hero__gift { font-size: 16px; } .hero__desc { font-size: 16px; line-height: 120%; letter-spacing: -0.3px; } .hero__next-block { display: none; } .about__container { padding-top: 380px; margin-bottom: 104px; } .about__text-wrapper { gap: 44px; } .about__text { font-size: 14px; font-weight: 400; line-height: 120%; text-align: justify; } .about__slider .swiper-slide { width: 100% !important; } .advantages__container { margin-bottom: 104px; } .advantages__container .container { padding: 0; } .advantages__title-wrapper { margin-bottom: 84px; } .advantages__grid { grid-template-columns: auto; } .advantages__list { padding: 0 20px; } .advantages__item { grid-template-columns: 52px 1fr; gap: 27px; } .advantages__number { font-size: 100px; line-height: 80%; } .advantages__item-text-wrapper { gap: 10px; } .advantages__item-title { font-size: 18px; line-height: 120%; } .advantages__item-text { font-size: 14px; line-height: 120%; } .advantages__img { height: 223px; } .banquet-hall__container { margin-bottom: 104px; } .banquet-hall__title-wrapper { margin-bottom: 60px; } .banquet-hall__grid { grid-template-columns: auto; } .banquet-hall-card__title { font-size: 24px; } .banquet-hall-card__item { font-size: 14px; line-height: 120%; } .banquet-hall-card__btn { font-size: 14px; line-height: 120%; gap: 5px; } .banquet-hall-card__btn svg { height: 24px; } .gallery__container { margin-bottom: 55px; } .gallery__container .container { padding: 0; } .gallery__grid { grid-template-columns: 1fr; grid-gap: 5px; margin-bottom: 30px; } .gallery__col-img { justify-content: center; } .gallery__col { grid-gap: 5px; justify-content: center; } .gallery__btn-show-more-svg_desktop { display: none; } .gallery__btn-show-more-svg_mobile { display: block; } .gallery__btn-show-more { gap: 10px; font-size: 16px; } .video__container { margin-bottom: 50px; } .video__wrapper video { height: auto; width: 100%; -o-object-fit: cover; object-fit: cover; } .contacts__wrapper { align-items: unset; height: 375px; } .contacts-feedback__wrapper { position: absolute; top: 170px; width: 100%; padding: 35px 23px 50px 23px; } .contacts-feedback__title { margin-bottom: 15px; font-size: 30px; line-height: 90%; } .contacts-feedback__text-wrapper { width: 100%; } .contacts-feedback__subtitle { font-size: 16px; margin-bottom: 20px; } .contacts-feedback__inputs { padding: 0 22px; margin-bottom: 50px; } .contacts-feedback__input { font-size: 16px; } .contacts-feedback__btn-wrapper { padding: 0 22px; } .contacts-feedback__btn { padding: 14px; font-size: 18px; } .fixed-media { right: 30px; } }