/* Настройки шаблона */ @font-face { font-family: "Montserrat-Regular"; src: url("/templates/rostsayt-4/fonts/Montserrat-Regular.ttf") format("truetype"); } @font-face { font-family: "Montserrat-SemiBold"; src: url("/templates/rostsayt-4/fonts/Montserrat-SemiBold.ttf") format("truetype"); } @font-face { font-family: 'ActayWide-Bold'; src: url("/templates/rostsayt-4/fonts/ActayWide-Bold.otf") format("opentype"); } @font-face { font-family: "Montserrat-Medium"; src: url("/templates/rostsayt-4/fonts/Montserrat-Medium.ttf") format("truetype"); font-weight: 500; } :root, body {font-size: 10px;} @media screen and (min-width: 576px) { :root, body {font-size: 12px;} } @media screen and (min-width: 768px) { :root, body {font-size: 12px;} } @media screen and (min-width: 992px) { :root, body {font-size: 14px;} } @media screen and (min-width: 1200px) { :root, body {font-size: 16px;} } /* переменные */ :root { /* --bebas: "BebasNeue-Regular", sans-serif; --roboto: "Roboto", sans-serif; */ --orange: #BD5F17; --green: #00381F; --white: #fff; --black: #000; } /* Элементы */ html {width: calc(100% + calc(100vw - 100%)); overflow-x: hidden;} body {display: flex; flex-direction: column; margin: 0 auto; max-width: 1920px; font-family: 'Montserrat-Regular', sans-serif; color: var(--green); overflow-x: hidden;} #middle main {overflow: inherit;} *::before {pointer-events: none;} @media (min-width: 1680px) {.container {max-width: 1296px;}} @media (min-width: 1920px) {.bg-color::before {margin-left: -960px;}} h1, .h1 {font-size: 3.75rem !important; font-family: 'ActayWide-Bold' !important; line-height: 140% !important;} h2, .h2 {font-size: 2.8125rem !important; font-family: 'ActayWide-Bold' !important; line-height: 140% !important;} h3, .h3 {font-size: 1.875rem !important; font-family: 'ActayWide-Bold' !important;} h4, .h4 {font-size: 1.5rem !important; font-family: 'Montserrat-SemiBold' !important;} h5, .h5 {font-size: 1.25rem !important; font-family: 'Montserrat-SemiBold' !important;} h6, .h6 {font-size: 1rem !important; font-family: 'Montserrat-SemiBold' !important;} .bg-color::before {background-color: var(--white);} .text-success {color: var(--green) !important;} .text-warning {color: var(--orange) !important;} .bg-success-transparent {background-color: rgba(0, 56, 31, 0.30) !important; backdrop-filter: blur(6.5px);} .border-success {border-color: var(--green) !important;} .border-warning {border-color: var(--orange) !important;} .form-control:focus {border-color: #fff; box-shadow: 0 0 0 .25rem rgba(255,255,255,.25);} a {text-decoration: none;} input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } /* Адаптация */ /* Анимации */ .delay-1 {-webkit-animation-delay:200ms;animation-delay:200ms} .delay-2 {-webkit-animation-delay:400ms;animation-delay:400ms} .delay-3 {-webkit-animation-delay:600ms;animation-delay:600ms} .delay-4 {-webkit-animation-delay:800ms;animation-delay:800ms} .delay-5 {-webkit-animation-delay:1000ms;animation-delay:1000ms} .delay-6 {-webkit-animation-delay:1200ms;animation-delay:1200ms} .delay-7 {-webkit-animation-delay:1400ms;animation-delay:1400ms} .delay-8 {-webkit-animation-delay:1600ms;animation-delay:1600ms} .delay-9 {-webkit-animation-delay:1800ms;animation-delay:1800ms} .delay-10 {-webkit-animation-delay:2000ms;animation-delay:2000ms} /* Задний фон */ .bg-success {background-color: #00381F !important;} .bg-warning {background-color: #BD5F17 !important;} /* Кнопки */ .btn-nav {height: 4rem; width: 4rem} .btn-warning {background-color: #BD5F17 !important; color: #fff !important; border:#BD5F17 !important; border-radius: 30px;} .btn-success {background-color: var(--green) !important; color: #fff !important; border-radius: 30px;} .btn-outline-success {color: var(--green) !important; border-color: var(--green) !important;} .btn-outline-success:hover {border-color: var(--green) !important; color: var(--white) !important; background-color: var(--green) !important;} .btn-outline-success.active {border-color: var(--green) !important; color: var(--white) !important; background-color: var(--green) !important;} /* Шапка */ #navbar {margin-top: 18px; z-index: 100000;} #navbar .bg-navbar-blur {background: rgba(0, 56, 31, 0.30); backdrop-filter: blur(6.5px);} #navbar-content {border-radius: 3rem; } #navbar-content #top_menu ul {display: flex; flex: 1 1 auto; justify-content: space-between;} #navbar-content #top_menu ul li a {color: #fff; font-size: 18px;} #navbar .goods_menu_popup .header_filter:hover {text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.80);} #navbar .nav-item.item-103 {position: relative;} #navbar .nav-item.item-103::before {content:''; background: url('/images/navbar_icon/icon.svg') no-repeat center; position: absolute; top: 0; right: 0; margin-right: -27px; width: 24px; height: 24px;} #navbar .nav-item.item-103.active::before {transform: rotate(180deg);} #navbar-content .navbar-btn {padding: 10px 35px; margin-right: 24px;} #navbar .goods_menu_popup {top: 110px; left: 27%; display: none;} #navbar .goods_menu_popup.active {display: flex;} /* Верхний слайдер */ .mod-main-slider {z-index: 10000;} .mod-main-slider::before {background: var(--bg-image) no-repeat center var(--green); border-radius: 5rem; background-size: cover; top: -17rem; margin-top: 0px; margin-bottom: 0px; z-index: -1;} .btn_main_slider {padding: 8px 45px;} /* Изделия */ /* .product_item .product_item_title::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; bottom: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.80) 100%); z-index: -1; transition: .3s;} */ .product_item::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; bottom: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 66.38%, rgba(0, 0, 0, 0.60) 100%); z-index: 1;} /* .mod-products .product_item .product_item_img {transition: transform 0.2s ease;} .mod-products .product_item .product_item_img:hover {transform: scale(1.1);} */ .mod-products .product_back_item {background: rgba(0, 56, 31, 0.30); backdrop-filter: blur(6.5px);} .mod-products .product_cart_item:hover .product_back_item {display: block !important;} .mod-products .product_cart_item:hover .product_item_title {top: 0 !important;} /* Наши преимущества */ .advants-carousel.owl-carousel .owl-item {transition: opacity 3s ease; opacity: 0;} .advants-carousel.owl-carousel .owl-item.active {transition: opacity 3s ease; opacity: 1;} /* Экологичная древесина */ .mod-eco::before {background: var(--bg-image) no-repeat center var(--green); background-size: cover; top: 0; margin-top: 0; margin-bottom: 0; z-index: -2;} /* .mod-eco::after {background: var(--bg-fon-image) no-repeat center #ffffff; background-size: cover; top: 0; margin-top: 0; margin-bottom: 0; z-index: -1;} */ /* Товары */ .mod-goods .filter-point > div::before {content: ''; position: absolute; left: 0; top: 4px; width: 1.25rem; height: 1.25rem; border: var(--green) 1px solid; background-color: white; border-radius: 50%;} .mod-goods .filter-point.active > div::before {background-color: var(--green);} .mod-goods .goods_item {display: flex;} /* Класификация древесин */ .mod-сlassifications .tab-content::before {content: ''; background: var(--bg-image) no-repeat center var(--green); background-size: cover; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin-top: 0; margin-bottom: 0; z-index: -2; border-radius: 32px;} .mod-сlassifications ul {list-style: none; padding-left: 0;} .mod-сlassifications ul li {margin: 1rem 0; position: relative; padding-left: 2.125rem;} .mod-сlassifications ul li::before {content: ''; position: absolute; left: 0; top: 0; width: 1.5rem; height: 1.5rem; background-color: white; border-radius: 50%;} /* Наши проекты */ .mod-projects .project_item::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; bottom: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 66.38%, rgba(0, 0, 0, 0.60) 100%); z-index: 1;} .mod-projects .project_item .project_item_img {transition: transform 0.2s ease;} .mod-projects .project_item .project_item_img:hover {transform: scale(1.1);} /* Минимизируем Ваши расходы */ .mod-min-expenses::before {background:linear-gradient(270deg, rgba(0, 0, 0, 0.00) 46.33%, rgba(0, 0, 0, 0.50) 100%), var(--bg-image) no-repeat center var(--green); background-size: cover; top: 0; margin-top: 0; margin-bottom: 0; z-index: -1;} .mod-min-expenses .form-control::placeholder {color: #fff;} /* Товары по акции */ .mod-sale .sale_item_hide::before {content:''; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 66.38%, rgba(0, 0, 0, 0.60) 100%) no-repeat center; position:absolute; top: 0; left:0; right:0; bottom:0; margin-top: 0; margin-bottom: 0; z-index: 0;} .mod-sale .sale_item {perspective: 150rem;} .mod-sale .sale_item .sale_item_hide {transform: rotateY(-180deg);} .mod-sale .sale_item .sale_item_side { transition: all 0.8s ease; backface-visibility: hidden;} .mod-sale .sale-carousel .owl-stage-outer {overflow: visible;} .mod-sale .sale-carousel .owl-stage {display: flex;} .mod-sale .sale-carousel .owl-stage .owl-item {display: flex; flex: 1 1 0;} @media screen and (min-width: 1200px) { .mod-sale .sale_item:hover > .sale_item_show {transform: rotateY(-180deg);} .mod-sale .sale_item:hover > .sale_item_hide {transform: rotateY(0);} } /* Услуги */ .mod-services img {top: -3.125rem;} .mod-services .service_item:hover {background-color: var(--green); color: #fff} /* .mod-services .service_item:hover > svg {fill: #fff;} */ .mod-services .service_item:hover .service_svg .background { fill: #ffffff; /* Белый цвет при наведении */ } .mod-services .service_item:hover .service_svg .line { stroke: var(--green); /* Белый цвет линий при наведении */ } /* Плотность древесины */ .mod-density .density_arrow {left: -25%;} .mod-density .density_image {left: 44% !important; position: absolute;} /* Стандарты */ .mod-standards::before {background: var(--bg-image) no-repeat center var(--green); background-size: cover; top: 0; margin-top: 0; margin-bottom: 0; z-index: -1;} .mod-standards ul {list-style: none; padding-left: 0;} .mod-standards ul li {margin: 1.5rem 0; position: relative; padding-left: 2.125rem;} .mod-standards ul li::before {content: ''; position: absolute; left: 0; top: 0; width: 1.5rem; height: 1.5rem; background-color: white; border-radius: 50%;} .mod-standards .left-branch {bottom:0; left: -25.6%;} .mod-standards .right-top-branch {top: 0%; right: -25.35%;} .mod-standards .right-bottom-branch {bottom: -29%; right: -25.35%;} /* .mod-standards::after {background: url(/images/standards/001.png) left top no-repeat, url(/images/standards/002.png) right top no-repeat, url(/images/standards/003.png) right 205% no-repeat !important; content:''; margin-left: -325px; position: absolute; width: 1920px; top:0; right: 0; bottom: 0; left: 0; z-index: -1;} */ /* Наши отзывы */ /* .reviews-carousel .owl-item {max-width: 306px !important;} .reviews-carousel .owl-item.center {width: 636px !important;} */ /* .mod-reviews .reviews-carousel .owl-item {min-height: 305px !important; width: 306px !important; display: flex !important; align-items: center;} */ .mod-reviews .reviews-carousel .owl-stage-outer .owl-stage {margin: 3rem 0 !important;} /* .mod-reviews .reviews-carousel .owl-item {width: 416px !important;} */ .mod-reviews .reviews-carousel .owl-item .reviews_person_img {width: 4rem !important; height: 4rem !important;} .mod-reviews .reviews-carousel .owl-item .reviews_person_name {font-size: 1rem !important;} .mod-reviews .reviews-carousel .owl-item .reviews_person_date {font-size: 1rem !important;} .mod-reviews .reviews-carousel .owl-item .reviews_person_star {width: 1rem !important; height: 1rem !important;} .mod-reviews .reviews-carousel .owl-item .reviews_person_desc {font-size: 15px !important; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;} .mod-reviews .reviews-carousel .owl-item.center.anim {transform: scale(1.3) !important;} .mod-reviews .reviews-carousel .owl-item{transition: transform 0.8s;} .mod-reviews .reviews-carousel .owl-item:not(.center) {transform: scale(.7) !important; filter: blur(3.5px);} /* .mod-reviews .reviews-carousel .owl-item.center .reviews_person_img {width: 50px !important; height: 50px !important;} */ /* .mod-reviews .reviews-carousel .owl-item.center .reviews_person_name {font-size: 10px !important;} */ /* .mod-reviews .reviews-carousel .owl-item.center .reviews_person_date {font-size: 10px !important;} */ /* .mod-reviews .reviews-carousel .owl-item.center .reviews_person_star {width: 10px !important; height: 10px !important;} */ /* .mod-reviews .reviews-carousel .owl-item.center .reviews_person_desc {font-size: 10px !important;} */ .mod-reviews .person_img {max-width: 100px; max-height: 100px;} .mod-reviews .slider-item.active{display: block !important;} .mod-reviews .slider-item.extreme_slider{filter:blur(2px);} .mod-reviews .slider-item.extreme_slider .person_img{max-width: 50px !important; max-height: 50px !important;} .mod-reviews .slider-item.extreme_slider .stars_img{width: 12px; height: 12px;} .mod-reviews .slider-item.extreme_slider .reviews_item{padding: 12px !important;} .mod-reviews .slider-item.extreme_slider .slider_fio, .mod-reviews .slider-item.extreme_slider .slider_date, .mod-reviews .slider-item.extreme_slider .slider_text {font-size: 10px !important;} /* Отгрузка и Доставка */ .mod-delivery .delivery_item::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; bottom: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 66.38%, rgba(0, 0, 0, 0.60) 100%); z-index: 1;} .mod-delivery .delivery_item .delivery_item_img {transition: transform 0.2s ease;} .mod-delivery .delivery_item .delivery_item_img:hover {transform: scale(1.1);} /* Высокие стандарты работы */ /* .mod-eco.bg-color::before {background-color: var(--green) !important;} */ /* .mod-eco::after {background: url(/images/eco/001.png) left top no-repeat, url(/images/eco/002.png) right top no-repeat, url(/images/eco/003.png) right 185% no-repeat var(--green) !important; content:''; margin-left: -325px; position: absolute; width: 1920px; top:0; right: 0; bottom: 0; left: 0; z-index: -1;} */ /* .mod-standards::before {background:linear-gradient(270deg, rgba(0, 0, 0, 0.00) 37.12%, rgba(0, 0, 0, 0.50) 56.71%), var(--bg-image) no-repeat center #ffffff; background-size: cover; top: 0; margin-top: 0; margin-bottom: 0; z-index: -1;} */ /* Контакты */ .mod-contacts .contact_address_two {top: -0.7rem; filter: brightness(50%); z-index: 0;} .mod-contacts .contact_address {font-family: "Montserrat-Medium";} .mod-contacts .contact_address_one {z-index: 1;} /* футер */ footer .mod-menu {justify-content: space-around; flex: 1 1 auto; margin: 0 4.5rem;} footer .mod-menu li > a {color: var(--green); font-size: 1.15rem;} footer .footer_line::before {content: ''; position: absolute; top: 0; width: 1920px; max-width: 100%; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); height: 1px; background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 56, 31, 1), rgba(0, 0, 0, 0));} /* Корзина */ #allBasket {z-index: 10000000;} #allBasket > div {z-index: 1000000000} #allBasket > .popup_body {z-index: 10000000000000; height: 100vh; overflow-y: auto;} #allBasket input[type="number"], #orderBasket input[type="number"] {max-width: 60px;} #allBasket .basket_all_sum::before, #orderBasket .basket_all_sum::before {content: ''; position: absolute; top: 0; width: 1920px; max-width: 100%; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); height: 1px; background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 56, 31, 1), rgba(0, 0, 0, 0));} #fixedBasket {z-index: 1000; top: 5%; right: 1%;} #fixedBasket:hover {cursor: pointer;} /* Оформление заказа */ #orderBasket {z-index: 10000000000000000000000000000;} #orderBasket > .popup_body {z-index: 10000000000; height: 100vh; overflow-y: auto;} #orderBasket .basket_price_count {display: block !important;} /* Модальные окна */ #fos .modal-header {display: none;} #fos .modal-content {background-color: var(--green); border-radius: 30px; padding: 3.125rem; text-align: center;} #addPhone .modal-header {display: none;} #addPhone .modal-content {background-color: var(--green); border-radius: 30px; padding: 3.125rem; text-align: center;} .modal-backdrop.fade.show {z-index: 10000000;} .modal.fade.show {z-index: 10000000000;} #m-feed-back-info .modal-content {text-align: center !important; color: #ffffff !important; background-color: var(--green); border-radius: 2rem !important;} #m-feed-back-info .modal-header {border-bottom: none !important;} #m-feed-back-info .modal-header .modal-title {width: 100% !important; font-size: 1.875rem !important; font-family: 'ActayWide-Bold' !important;} @media screen and (max-width: 1400px) { footer .mod-menu {margin: 0;} #top_menu {margin-left: .25rem !important; margin-right: .25rem !important;} #navbar .nav-item.item-103::before {top: 2px; margin-right: -22px;} } @media screen and (max-width: 1200px) { /* Шапка */ #navbar-content #top_menu ul {flex-direction: column; align-items: center; gap: 1rem;} #navbar-content {position: absolute; width: 100%; left: 0; top: 0;} .mod-eco::after {display: none;} #navbar .goods_menu_popup {top: 85px; left: 37%;} /* Наши отзывы */ .mod-reviews .slider-item.active.extreme_slider{display:none !important;} /* Плотность древесины */ .mod-density .density_image {left: 0 !important; position: static;} .mod-density .density_arrow {left: 5%; margin-bottom: -30%;} .mod-density .density_arrow > svg {height: 200px;} /* .mod-sale .sale_item:hover {pointer-events: none;} .mod-products .product_cart_item:hover {pointer-events: none;} */ /* Стандарты */ .mod-standards::after{display: none;} } @media screen and (max-width: 992px){ /* Шапка */ #navbar .goods_menu_popup {left: 35%;} #allBasket .popup_body {width: 100% !important;} .mod-density .density_arrow {left: 5%; margin-bottom: -90%;} .mod-density .density_arrow > svg {height: 150px;} /* Подвал */ footer .mod-menu {flex-direction: column; gap: 1rem; align-items: center;} footer .mod-footer > div > div > a:nth-child(1), footer .mod-footer > div > div > a:nth-child(2) {margin-top: 1rem; margin-left: 28px;} footer .mod-footer > div > div > a:nth-child(3) {margin-right: 20px; margin-top: 1rem; display: inline-block !important; margin-left: 28px;} footer .mod-footer > div > div > a:nth-child(4) {margin-top: 1rem; display: inline-block !important;} /* Кнопки каруселек */ .btn-nav.mod-next, .btn-nav.mod-prev {width: 50px; height: 50px;} } @media screen and (max-width: 768px) { /* Шапка */ #navbar .goods_menu_popup {left: 29%;} /* Класификация древесин */ .mod-сlassifications .classif_img {aspect-ratio: 16/9;} .mod-goods .filter-point > div::before {top: 3px;} } @media screen and (max-width: 576px) { /* Отзывы */ .mod-reviews .reviews-carousel .owl-item.center.anim {transform: scale(1) !important;} } @media screen and (max-width: 450px) { /* Шапка */ #navbar-content #top_menu {padding-top: 50px !important;} #navbar .goods_menu_popup {top: 125px;} .mod-main-slider .h1 {font-size: 2.75rem !important;} }