:root { /* Eco Green */ --Eco-Green_100: #64B450; --eco-green-100: #64B450; --Eco-Green_80: #8CC373; --Eco-Green_60: #ADD298; --Eco-Green_40: #D7E9CD; --Eco-Green_20: #ECF4E7; /* Dark Wintergreen */ --Dark-Wintergreen_100: #236B57; --Dark-Wintergreen_80: #718F80; --Dark-Wintergreen_60: #B2BCB4; --Dark-Wintergreen_40: #C6CDC6; --Dark-Wintergreen_20: #ECF2EC; --dark-wintergreen-100: #236B57; --dark-wintergreen-80: #718F80; --dark-wintergreen-60: #B2BCB4; --dark-wintergreen-40: #C6CDC6; --dark-wintergreen-20: #ECF2EC; /* Neutrals */ --Moon-Black_Titles: #141414; --Moon-Grey_Body-text: #5E6062; --Black-Shade: #141512; --Total-White: #FFFFFF; --Clean-White_100: #FFFFFF; /* Accents */ --Attention-Red: #CB4141; --Aditional_Yellow: #F1E456; --Aditional_Blue: #003E8A; } html {font-size:0.8342028vw; } body, html { width: 100%; height:100%; background: var(--Dark-Wintergreen_20);} body, th, td {color:var(--Moon-Black_Titles); font-family: "Arial";font-size: 1.125rem;font-weight: 400;line-height: 140%; letter-spacing: -0.01125rem;} body, form, object {margin: 0;padding: 0;} img, table {border: none;} table {border-collapse: collapse;} table td {padding: 0;} a {color:var(--Moon-Black_Titles); text-decoration:underline; transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); } a:hover {text-decoration:none;} :focus {outline:none!important;text-decoration:none!important;} section {overflow:hidden;} .wrapper {overflow:hidden;} .sticky {position:fixed;} .stop { position: relative;} .bold {font-weight:bold;} .container-fluid {max-width:102rem;padding-left:1rem;padding-right:1rem;} .container-fluid.big {max-width:116rem;padding-left:1rem;padding-right:1rem;} .italic {font-style:italic;} img {max-width:100%;height:auto;width:auto;display:block;} svg {max-width:100%;height:auto;width:auto;display:block;margin:0 auto;} video {display:block;max-width:100%;height:auto;width:auto;} button { font-family: "Arial";font-size: 1.125rem;font-weight: 400;line-height: 140%; letter-spacing: -0.02rem; display:block; margin:0; border:0; outline: none!important; background:none; padding:0; text-align:left; transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .ic { display:block; transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .ic:before {color:inherit; display:block; transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .ic:after { display:block; transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .h-100 { height: 100% !important;} .margin-bottom {margin-bottom:10rem!important;} .margin-bottom-small {margin-bottom:5rem!important;} .padding {padding-top:10rem;padding-bottom:10rem;} .padding-top {padding-top:10rem;} .padding-bottom {padding-bottom:10rem;} .lenis-stopped {overflow:visible!important;} .menu-open {height:100%!important;} .cover > * { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); } .cover picture {height:100%;display:block;} .cover picture > * { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); } .cover.parallax > * {height:120%;} .cover.parallax picture img {height:120%;} .parallax {overflow:hidden;} [class*="anons"] > * {margin:0 0 2rem 0;} [class*="anons"] > *:last-child {margin:0;} .gutters-075 {margin-right: -0.75rem;margin-left: -0.75rem;} .gutters-075 > .col,.gutters-075 > [class*="col-"] {padding-right: 0.75rem; padding-left: 0.75rem;} .gutters-0625 {margin-right: -0.625rem;margin-left: -0.625rem;} .gutters-0625 > .col,.gutters-0625 > [class*="col-"] {padding-right: 0.625rem; padding-left: 0.625rem;} .gutters-1 {margin-right: -1rem;margin-left: -1rem;} .gutters-1 > .col,.gutters-1 > [class*="col-"] {padding-right: 1rem; padding-left: 1rem;} .gutters-125 {margin-right: -1.25rem;margin-left: -1.25rem;} .gutters-125 > .col,.gutters-125 > [class*="col-"] {padding-right: 1.25rem; padding-left: 1.25rem;} .gutters-3125 {margin-right: -3.125rem;margin-left: -3.125rem;} .gutters-3125 > .col,.gutters-3125 > [class*="col-"] {padding-right: 3.125rem; padding-left: 3.125rem;} .p-2 > * {margin-bottom:2rem!important;} .p-2 > *:last-child {margin-bottom:0!important;} .p-15 > * {margin-bottom:1.5rem!important;} .p-15 > *:last-child {margin-bottom:0!important;} .p-125 > * {margin-bottom:1.25rem!important;} .p-125 > *:last-child {margin-bottom:0!important;} .p-175 > * {margin-bottom:1.75rem!important;} .p-175 > *:last-child {margin-bottom:0!important;} .p-075 > * {margin-bottom:0.75rem!important;} .p-075 > *:last-child {margin-bottom:0!important;} .p-1 > * {margin-bottom:1rem!important;} .p-1 > *:last-child {margin-bottom:0!important;} .p-25 > * {margin-bottom:2.5rem!important;} .p-25 > *:last-child {margin-bottom:0!important;} .p-3 > * {margin-bottom:3rem!important;} .p-3 > *:last-child {margin-bottom:0!important;} h1 {margin:0 0 2rem 0;color: var(--Moon-Black_Titles);text-align: center;font-family: "Exo 2";font-size: 4.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0425rem;text-transform: uppercase;} .h1 {margin:0 0 2rem 0;color: var(--Moon-Black_Titles);text-align: center;font-family: "Exo 2";font-size: 4.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0425rem;text-transform: uppercase;} h2 {margin:0 0 2rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 4rem;font-weight: 700;line-height: 100%;letter-spacing: -0.04rem;text-transform: uppercase;} h2 span {color:var(--eco-green-100);} h3 {margin:0 0 2rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 3rem;font-weight: 700;line-height: 100%;letter-spacing: -0.04rem;text-transform: uppercase;} h3 span {color:var(--eco-green-100);} .h3 {margin:0 0 2rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 3rem;font-weight: 700;line-height: 100%;letter-spacing: -0.04rem;text-transform: uppercase;} .h3 span {color:var(--eco-green-100);} h4 {margin:0 0 1.5rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} h4 span {color:var(--eco-green-100);} h5 {margin:0 0 1rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.025rem;text-transform: uppercase;} h6 {margin:0 0 1rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.125rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0125rem;text-transform: uppercase;} ::-webkit-scrollbar { width: 0.25rem; border-radius: 6px; background-color: var(--Dark-Wintergreen_40); -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } ::-webkit-scrollbar-thumb { border-radius: 6px; background: var(--Eco-Green_100); -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } ::-webkit-scrollbar-track { border-radius: 6px; background-color: transparent; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } ::-webkit-scrollbar:horizontal{display:none;} #wpadminbar {display:none!important;} #detach-button-host {display:none!important;} .wpcf7 form {position:relative;} .wpcf7 form.invalid .wpcf7-response-output {display:none!important;} .wpcf7-not-valid-tip {line-height:1rem; font-size: 0.875rem; position:absolute;left:0;top:100%; width:100%;} .wpcf7-not-valid {border-color:red!important;} .wpcf7-list-item {margin:0;} .wpcf7 form .wpcf7-response-output {text-align: center; position:absolute;left:0;top:100%;font-size:0.875rem;line-height:1rem;margin:0.5rem 0 0 0; width:100%;} .modal-dialog {margin:0 auto;max-width: 39.5rem;} .big .modal-dialog {max-width: 67.5rem;} .global-form {position:relative;} .wpcf7-form-control-wrap {display:block;} .wpcf7 form.sent .wpcf7-response-output {display:none!important;} .modal-content { overflow:auto; border-radius: 1.25rem; background: var(--Total-White); -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; padding:3.75rem;} .modal-form .modal-image {width: 31.25rem;min-width: 31.25rem;margin:-2.5rem 3rem -2.5rem -2.5rem;height: 44.1875rem;} .modal-form .modal-title {margin:0 0 1.5rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 3rem;font-weight: 700;line-height: 100%;letter-spacing: -0.03rem;text-transform: uppercase;} .modal-form .modal-title span {color: var(--eco-green-100);} .modal-form .modal-anons {margin:0 0 2.5rem 0;} .form-submit .submit {margin:0 1.25rem 0 0;} .form-submit .politica {order:12;color: var(--Moon-Black_Titles);font-size: 0.875rem;line-height: 140%;letter-spacing: -0.00875rem;} .modal-form .modal-logo {margin:2rem 0;} .modal-form .modal-logo img {height: 16.25rem;margin:0 auto;} article h2,article h3,article h4 { opacity:1!important; transform:none!important ; -webkit-transform:none!important ; -moz-transform:none!important ; -ms-transform:none!important ; -o-transform:none!important ; } .article h2,.article h3,.article h4,.article h5 { text-align: left; opacity:1!important; transform:none!important ; -webkit-transform:none!important ; -moz-transform:none!important ; -ms-transform:none!important ; -o-transform:none!important ; } .op h2,.op h3,.op h4,.op h5 { opacity:1!important; transform:none!important ; -webkit-transform:none!important ; -moz-transform:none!important ; -ms-transform:none!important ; -o-transform:none!important ; } .anim-link { position: relative; display: inline-block;} .anim-link::after { content: ""; color:inherit; position: absolute; left: 0; bottom: -0.125rem; width: 100%; height: 0.0625rem; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .anim-link:not(:hover)::after { transform: scaleX(0); transform-origin: right;} p {margin: 0 0 1rem 0;} .js-animation { opacity: 0; -webkit-transform: translate3d(0, 60px, 0) scale3d(0.96, 0.96, 1); transform: translate3d(0, 60px, 0) scale3d(0.96, 0.96, 1); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transition: all 1.2s cubic-bezier(0.22, 1, 0.36, 1); transition: all 1.2s cubic-bezier(0.22, 1, 0.36, 1); will-change: transform,opacity; } .js-animation._animated { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); } .nav {margin:0;} .body:not(.hero) {padding:7.75rem 0 0 0;} .btn-default {white-space: nowrap; position:relative; display:inline-flex; align-items:center; border:0; justify-content: center; text-align: center; text-decoration: none; color: var(--Total-White);font-family: Arial;font-size: 1rem;font-weight: 400;line-height: 100%;letter-spacing: 0.02rem; height:3rem; padding:0 0.75rem 0 1rem; border-radius: 0.75rem; background: var(--Eco-Green_100); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .btn-default .ic {position:relative;z-index:3; margin:0 0 0 1rem;font-size:1.5rem;color: var(--Moon-Black_Titles);} .btn-default .value { position:relative; z-index:3; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .btn-default:before { content:""; left:calc(100% - 2.5rem); transition:0.5s ; display:block; position:absolute; right:0.38rem; top:0.38rem; bottom:0.38rem; border-radius: 0.5rem; background: var(--Total-White); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .btn-default:hover:before {width:auto;left:0.25rem;right:0.25rem;top:0.25rem;bottom:0.25rem;} .btn-default:hover {color:var(--Moon-Black_Titles);} .btn-border {white-space: nowrap; position:relative; display:inline-flex; align-items:center; border:0.125rem solid var(--Eco-Green_100); justify-content: center; text-align: center; text-decoration: none; color: var(--Moon-Black_Titles);font-family: Arial;font-size: 1rem;font-weight: 400;line-height:3rem;letter-spacing: 0.02rem; height:3rem; padding:0 0.875rem; border-radius: 0.75rem; background: none; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .btn-border.big {padding:0 1.375rem;height:3.25rem;font-size:1.125rem;line-height:3.25rem;} .btn-border:hover {color:var(--Total-White);background: var(--eco-green-100);} .btn-border.icon {padding:0 0.375rem 0 0.875rem; } .btn-border.icon .icon { overflow:hidden; transition:0.3s ; font-size: 1.25rem; color:var(--Total-White); width: 2rem; height: 2rem; margin:0 0 0 0.75rem; border-radius: 0.5rem; background: var(--eco-green-100); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; -webkit-transition:; -moz-transition:; -ms-transition:; -o-transition:; } .btn-border.icon .icon .ic {margin:0 0.38rem 0 0;} .btn-border.icon:hover .icon {background: var(--Total-White);color:var(--eco-green-100);} .btn-border.icon:hover .icon .ic:last-child {margin:0 -1.25rem 0 0;} .btn-border.icon.file .icon .ic {margin:0!important;} .btn-border.white {border-color:var(--Total-White);color:var(--Total-White);} .btn-border.white.icon .icon {color:var(--Moon-Black_Titles);background:var(--Total-White);} .btn-border.white:hover {background:var(--Total-White);color:var(--Moon-Black_Titles);} .btn-border.white.icon:hover .icon {background:var(--Moon-Black_Titles);color:var(--Total-White);} .header { z-index:200; position:fixed; top:0; left:0; right:0; border-bottom:0.0625rem solid var(--Dark-Wintergreen_40); transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .header .logo img {width: 15rem;} .header:before { content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; z-index:2; background: rgba(236, 242, 236, 0.80); transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .header:after { content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; z-index:3; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .header .header-container {height:4.75rem;position:relative;z-index:10;} .header .cta {margin:0 0 0 0.7rem;} .header .header-search {margin:0 0 0 2.15rem; font-size:1.25rem;width: 3rem;height: 3rem; color:var(--Moon-Black_Titles); text-decoration:none; border-radius: 1rem; border: 0.125rem solid var(--Eco-Green_100); -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .header .header-search:hover {background:var(--Eco-Green_100);color:var(--Total-White);} .header .header-langs {margin:0 0 0 2.15rem;position:relative;} .header .header-langs .langs-drop {margin:-1rem 0 0 0;opacity:0;visibility: hidden;pointer-events: none; transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); position:absolute; top:100%; left:-1.5rem; padding:1.5rem; border-radius: 0.5rem; background: var(--Total-White); box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.06); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; -webkit-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); } .header .header-langs .langs-btn {color: var(--Moon-Black_Titles);font-weight: 400;line-height: 2.75rem; height:2.75rem;letter-spacing: -0.01125rem;text-transform: uppercase;} .header .header-langs .langs-btn .ic {margin:0 0 0 0.5rem;font-size:1.25rem;} .header .header-nav li a {text-decoration:none;margin:0 2.5rem 0 0;color: var(--Moon-Black_Titles);line-height: 2.75rem; height:2.75rem;letter-spacing: 0.0225rem;} .header .header-nav li:last-child a {margin:0;} .header .header-nav li a .ic {margin:0 0.5rem 0 0;color:var(--Eco-Green_100);font-size:1.75rem;} .header .header-nav li a .ic.drop-ic {margin:0 0 0 0.25rem;font-size:1.25rem;color: var(--Moon-Black_Titles);} .header .header-nav li:hover > a {color:var(--Eco-Green_100)!important;} .header .header-nav li:hover > a .ic {color:var(--Eco-Green_100)!important;} .header .header-nav li:hover a .drop-ic { transform:rotate(-180deg) ; -webkit-transform:rotate(-180deg) ; -moz-transform:rotate(-180deg) ; -ms-transform:rotate(-180deg) ; -o-transform:rotate(-180deg) ; } .header .header-nav li {position:relative;} .header .header-nav .drop-menu {margin:-1rem 0 0 0;opacity:0;visibility: hidden;pointer-events: none; transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); position:absolute; top:100%; left:-1.5rem; padding:1.5rem; border-radius: 0.5rem; background: var(--Total-White); box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.06); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; -webkit-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); } .header .header-nav .drop-menu a {height:auto; display:block;text-decoration:none;margin:0 0 1.25rem 0;color: var(--Moon-Black_Titles)!important; white-space: nowrap;line-height: 100%;letter-spacing: 0.0225rem;} .header .header-nav .drop-menu li:last-child a {margin:0;} .header .header-nav li.drop-btn:hover .drop-menu {opacity:1;visibility: visible;pointer-events: all;margin:0;} .header .header-langs .langs-drop {height:auto; display:block;text-decoration:none;margin:0 0 1.25rem 0;color: var(--Moon-Black_Titles)!important; white-space: nowrap;line-height: 100%;letter-spacing: 0.0225rem;} .header .header-langs .langs-drop a {height:auto; display:block;text-decoration:none;margin:0 0 1.25rem 0;color: var(--Moon-Black_Titles)!important; white-space: nowrap;line-height: 100%;letter-spacing: 0.0225rem;} .header .header-langs .langs-drop li:last-child a {margin:0;} .header .header-langs .langs-drop a:hover {color:var(--Eco-Green_100)!important;} body.hero .header:not(.fix) {border:0;top:1.5rem;} body.hero .header:not(.fix):before {opacity:0;} body.hero .header:not(.fix):after {opacity:0;} body.hero .header:not(.fix) .logo img {filter: brightness(0) invert(1); } body.hero .header:not(.fix) .header-nav li a {color:var(--Total-White);} body.hero .header:not(.fix) .header-nav li a .ic {color:var(--Total-White);} body.hero .header:not(.fix) .header-search {color:var(--Total-White);} body.hero .header:not(.fix) .header-langs .langs-btn {color:var(--Total-White);} .main-hero {position:relative;} .main-hero .hero-media {position:relative;overflow:hidden; margin:1rem 1rem 0 1rem; height:calc(100vh - 2rem); border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .main-hero .hero-media:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;background: linear-gradient(180deg, rgba(20, 20, 20, 0.10) 0%, rgba(20, 20, 20, 0.20) 100%);} .main-hero .hero-info {position:absolute;left:0;right:0;bottom:8rem;} .main-hero .hero-info .info-left {width:49.25rem;} .main-hero .hero-info h1 {text-align:left; margin:0 0 1.25rem 0;color: var(--Total-White);font-family: "Exo 2";font-size: 4.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0425rem;text-transform: uppercase;} .main-hero .hero-info .hero-anons {max-width: 40.8125rem;color: var(--Total-White);font-size: 1.25rem;line-height: 130%;letter-spacing: -0.0125rem;} .main-hero .hero-info .hero-news {width: 23.875rem;} .main-hero .hero-info .hero-news .news-title {margin:0 0 0.75rem 0;color: var(--Total-White);font-family: "Exo 2";font-size: 1.5rem;font-weight: 700;line-height: 100%;letter-spacing: -0.015rem;text-transform: uppercase;} .main-hero .hero-info .news-container { position:relative; overflow:hidden; padding:0.75rem; border-radius: 2.5rem; -webkit-border-radius: 2.5rem; -moz-border-radius: 2.5rem; -ms-border-radius: 2.5rem; -o-border-radius: 2.5rem; } .main-hero .hero-info .news-container:before {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;z-index:2;background: rgba(255, 255, 255, 0.30);} .main-hero .hero-info .news-container:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;z-index:3;-webkit-backdrop-filter: blur(16px);backdrop-filter: blur(16px);} .main-hero .news-slider { position:relative; z-index:5; overflow:hidden; border-radius: 1.75rem; -webkit-border-radius: 1.75rem; -moz-border-radius: 1.75rem; -ms-border-radius: 1.75rem; -o-border-radius: 1.75rem; } .main-hero .news-slider .item {position:relative;display:block;} .main-hero .news-slider .item .item-image {height: 19.875rem;position:relative;} .main-hero .news-slider .item .item-image:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;background: linear-gradient(180deg, rgba(20, 20, 20, 0.00) 50.18%, rgba(20, 20, 20, 0.90) 100%);} .main-hero .news-slider .item .item-name {position:absolute;bottom:1.5rem;left:1.5rem;width: 13.1875rem;color: var(--Total-White);font-family: "Exo 2";font-size: 1.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0125rem;} .global-search {opacity:0;visibility: hidden;pointer-events: none; position:fixed;top:0;bottom:0;left:0;right:0;z-index:300;padding:1.5rem 0;} .global-search:before { content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; z-index:2; background: rgba(255, 255, 255, 0.30); transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .global-search:after { content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; z-index:3; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .global-search .container-fluid {position:relative;z-index:5;} .global-search .search-container { padding:0.88rem 1rem;border-radius: 1.5rem;background: var(--Total-White);margin:0 0 0.75rem 0;} .global-search .search-container form {display:block;position:relative;width:100%;} .global-search .search-container input[type=text] {padding:0 0 0 3.375rem;color: var(--Moon-Black_Titles);font-family: Arial;font-size: 1.125rem;line-height: 100%;letter-spacing: 0.0225rem; display:block; height: 3rem;width:100%; border-radius: 1rem; border: 0.125rem solid var(--eco-green-100); -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .global-search .search-container input[type=submit] { display:block; position:absolute; left:1.25rem; width: 1.25rem; border:0; height: 1.25rem; top:50%; background:url('../../images/search2.svg') no-repeat center; background-size:1.25rem; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; } .global-search .search-close {margin:0 0 0 0.75rem;font-size:1.5rem; min-width: 3rem;width: 3rem;height: 3rem;border-radius: 1rem;border: 0.125rem solid var(--eco-green-100);} .global-search .search-close:hover {background:var(--eco-green-100);color:var(--Total-White);} input::-webkit-input-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} input::-moz-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} input:-moz-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} input:-ms-input-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} input:focus::-webkit-input-placeholder {color: transparent!important;} input:focus::-moz-placeholder {color: transparent!important;} input:focus:-moz-placeholder {color: transparent!important;} input:focus:-ms-input-placeholder {color: transparent!important;} textarea::-webkit-input-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} textarea::-moz-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} textarea:-moz-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} textarea:-ms-input-placeholder {color: var(--Moon-Black_Titles); opacity:0.4;} textarea:focus::-webkit-input-placeholder {color: transparent!important;} textarea:focus::-moz-placeholder {color: transparent!important;} textarea:focus:-moz-placeholder {color: transparent!important;} textarea:focus:-ms-input-placeholder {color: transparent!important;} .ar {font-family:Arial;} .global-search .search-results { margin:0.75rem 0 0 0;padding:0 0 2.5rem 0; border-radius: 1.5rem; background: var(--Total-White); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .global-search .search-results .search-title {border-bottom:0.0625rem solid var(--Dark-Wintergreen_40); margin:0 0 1.5rem 0; padding:2rem 2.5rem;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} .global-search .search-results .results-container {padding:0 2.5rem 0rem 2.5rem;height:27rem;overflow:auto;margin:0 1rem 0rem 0;} .global-search .search-results .item {text-decoration: none;margin:0 0 0.75rem 0;} .global-search .search-results .item:last-child {margin:0;} .global-search .search-results .item .item-image {padding:0.62rem 0.56rem; min-width: 7.5rem; width: 7.5rem; height: 8.25rem; margin:0 2rem 0 0; border-radius: 1rem; background: var(--Dark-Wintergreen_20); -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .global-search .search-results .item .item-image img {max-width: 6.375rem;max-height: 7rem;} .global-search .search-results .item .item-image.fl {padding:0;overflow:hidden;} .global-search .search-results .item .item-image.fl img {max-width: 100%;max-height: 100%;-o-object-fit: cover; object-fit: cover; width: 100%; height: 100%;} .global-search .search-results .item .category { display:inline-flex; padding:0.25rem 0.75rem; border-radius: 0.5rem; background: var(--Dark-Wintergreen_20); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .global-search .search-results .item .item-name { transition:0.5s ; color: var(--Moon-Black_Titles); font-family: "Exo 2"; font-size: 1.25rem; font-weight: 700; line-height: 100%; letter-spacing: -0.0125rem; text-transform: uppercase; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .global-search .search-results .item:hover .item-name {color: var(--Eco-Green_100);} .global-search .search-results .search-empty {padding:0 2.5rem;color: var(--Moon-Black_Titles);font-family: Arial;font-size: 1.125rem;line-height: 130%;} .search-open .global-search {opacity:1;visibility: visible;pointer-events: all;} .input-container {position:relative;margin:0 0 1rem 0;} .input { display:block; padding:0 0 0 1.125rem; color: var(--Moon-Black_Titles); font-family: Arial; font-size: 1.125rem; font-weight: 400; line-height: 100%; letter-spacing: -0.01125rem; width:100%; height:3.25rem; background:rgba(255,255,255,0.6); border:0.0625rem solid rgba(198, 205, 198, 0.6); border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .focus .input {border:0.0625rem solid var(--eco-green-100);background:rgba(255,255,255,1);} .ok .input {border:0.0625rem solid var(--eco-green-100);background:rgba(255,255,255,1);} .textarea { resize:none; display:block; padding:1.125rem 0 0 1.125rem; color: var(--Moon-Black_Titles); font-family: Arial; font-size: 1.125rem; font-weight: 400; line-height: 100%; letter-spacing: -0.01125rem; width:100%; height:7.5rem; background:rgba(255,255,255,0.6); border:0.0625rem solid rgba(198, 205, 198, 0.6); border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .focus .textarea {border:0.0625rem solid var(--eco-green-100);background:rgba(255,255,255,1);} .ok .textarea {border:0.0625rem solid var(--eco-green-100);background:rgba(255,255,255,1);} .line-section {margin:3.75rem 0 0 0;} .line-section .line-slider .slide {white-space: nowrap; margin:0 2rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} .line-section .line-slider .slide.is-small {color:var(--eco-green-100);} .line-section .line-slider .slide .ic {margin:0 2rem 0 0; font-size:1.75rem; color:var(--dark-wintergreen-100)} .line-section .line-slider .slider-track {width: max-content;} .main-info {overflow:visible;} .main-info .info-left {width:36.25rem;position:relative;} .main-info .info-left .pattern {position:relative;margin:2rem -4.56rem 0 -10rem;} .main-info .info-left .pattern img {position:relative;margin:0 0 0 -5rem;} .main-info .info-cards {width:49.25rem;} .main-info .info-cards .item {min-height:23.75rem; align-items:start; margin:0 0 1.25rem 0; padding:2rem; border-radius: 1.5rem; background: var(--Total-White); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .main-info .info-cards .item .item-name {margin:0 0 1.56rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} .main-info .info-cards .item .item-icon {width: 5.5rem;height: 5.5rem; margin:0 0 1.56rem 0; border-radius: 1rem; background: var(--Dark-Wintergreen_20); -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .main-info .info-cards .item .item-icon img {width:3.25rem;} .title-container {margin:0 0 3.75rem 0;} .title-container h2 {margin:0;} .catalog-list.catalog-slider .slick-list {overflow:visible;} .main-catalog .slider-container { position:relative; margin:0 -10rem 0 0; overflow:hidden; border-radius: 1.5rem 0 0 1.5rem; -webkit-border-radius: 1.5rem 0 0 1.5rem; -moz-border-radius: 1.5rem 0 0 1.5rem; -ms-border-radius: 1.5rem 0 0 1.5rem; -o-border-radius: 1.5rem 0 0 1.5rem; } .catalog-list.catalog-slider .item {margin:0 1.5rem 0 0;width: 23.875rem;} .catalog-list .item {overflow:hidden;margin:0 0 1.5rem 0; position:relative; text-decoration:none; padding:1.5rem; border-radius: 1.5rem; background: var(--Total-White); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem;} .catalog-list .item .item-image {height: 22.8125rem;margin:0 0 1.25rem 0; display:flex;align-items: center;justify-content: center;} .catalog-list .item .item-image img { max-width:19.375rem; max-height: 21.3125rem; transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .catalog-list .item .item-bg { margin:-12.1rem 0 0 -13.4rem; opacity:0.08; position:absolute; top:100%; left:100%; width: 26.6875rem; height:13.34375rem; background: url('../../images/card-bg.webp') no-repeat center; background-size: 26.6875rem; transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .catalog-list .item .item-category { margin:0 0 0.75rem 0; display:inline-flex; padding:0.25rem 0.75rem; border-radius: 0.5rem; background: var(--Dark-Wintergreen_20); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .catalog-list .item .item-name {min-height:2.5rem;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0125rem;text-transform: uppercase;} .catalog-list .item .shilds {position:absolute;z-index:5;top:1.5rem;left:1.5rem;display:flex;flex-direction: column; align-items: start;} .catalog-list .item .shilds .shild { margin:0 0 0.5rem 0;color: var(--Total-White);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem; padding:0.25rem 0.75rem; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .catalog-list .item .shilds .shild.new {color:var(--Moon-Black_Titles);background: var(--Aditional_Yellow);} .catalog-list .item .shilds .shild.popular {background: var(--dark-wintergreen-100);} .catalog-list .item .shilds .shild.recomend {background: var(--Aditional_Blue);} .catalog-list .item .cultures {z-index:5;position:absolute;right:1.5rem;top:1.5rem;} .catalog-list .item .cultures img {height:2rem;margin:0 0 1rem 0;} .slider-bottom {margin:3.75rem 0 0 0;} .slider-bottom .line {width:calc(100% - 4rem); margin:0 2rem; height:0.125rem; border-radius: 1.25rem; opacity: 0.4; background: var(--Dark-Wintergreen_40); -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem;} .slider-navs {height: 3rem;position:relative;width:6.75rem;min-width:6.75rem; } .post-list .slider-navs {margin:0 auto;} /* стрелки вставляет slick — без него контейнер остаётся пустым */ .slider-navs:empty {display:none;} .main-programs {position:relative;} .main-programs .programs-image {position:relative;height:100vh;} .main-programs .programs-image img {object-position: top center;} .main-programs .programs-image:before {content:"";display:block;position:absolute;top:0;left:0;right:0;z-index:3;height: 21.75rem;background: linear-gradient(180deg, #ECF2EC 0%, rgba(236, 242, 236, 0.00) 100%);} .main-programs .programs-image:after {content:"";display:block;position:absolute;bottom:0;left:0;right:0;z-index:3;height: 25.5rem;background: linear-gradient(0deg, #141414 0%, rgba(20, 20, 20, 0.70) 70.19%, rgba(20, 20, 20, 0.00) 100%);} .main-programs .programs-info {position:absolute;top:5rem;bottom:5rem;left:0;right:0;z-index:6;} .main-programs .programs-list .item {padding:1.25rem 0 0 0;color: var(--Total-White);line-height: 100%;letter-spacing: -0.01125rem; display:block; text-decoration: none; width: 9.25rem; border-radius: 0.75rem; height: 7.75rem; margin:0 0.375rem; border:0.0625rem solid rgba(198, 205, 198, 0.4); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .main-programs .programs-list .item:hover {background:var(--Total-White);border-color: var(--Total-White);color: var(--dark-wintergreen-100);} .main-programs .programs-list .item svg path { transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; fill:var(--Total-White)!important; } .main-programs .programs-list .item:hover svg path {fill:var(--dark-wintergreen-100)!important;} .main-programs .programs-list .item .icon {margin:0 0 0.75rem 0;} .main-programs .programs-list .item .icon svg {width:auto;height:3.25rem;} .main-programs .cta {margin:2.5rem 0 0 0;} .main-rd {position:relative;} .main-rd .rd-video {height: 57.5rem;position:relative;} .main-rd .rd-video:after {content:"";display:block;position:absolute;top:0;left:0;right:0;height: 22.25rem;background: linear-gradient(180deg, #ECF2EC 0%, rgba(236, 242, 236, 0.50) 49.93%, rgba(236, 242, 236, 0.00) 100%);} .main-rd .bg1 {position:absolute;top:0;left:0;width:34rem;} .main-rd .bg2 {position:absolute;top:0;right:0;width:34rem;} .main-rd .rd-info {position:absolute;z-index:5;top:0;left:0;right:0;} .title-container .navs-tabs {display:inline-flex; padding:0.5rem 0.25rem; border-radius: 1rem; background: var(--Total-White); -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .title-container .navs-tabs a {padding:0.62rem 0.5rem; min-width: 10.3125rem;color: var(--Moon-Black_Titles);font-size: 1rem;line-height: 100%;letter-spacing: 0.02rem; display:block; text-decoration:none; margin:0 0.25rem; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .title-container .navs-tabs a.active {color:var(--Total-White); background: var(--eco-green-100);} .title-container .navs-tabs a:hover {color:var(--Total-White); background: var(--eco-green-100);} .main-posts {overflow: visible;} .post-list .col-12 {padding-bottom:2.5rem;} .main-posts .post-list .col-12 {padding-bottom:0;} .post-list .posts-slider .item {margin:0 1.5rem 0 0;} .post-list .posts-slider {margin:0 -1.5rem 0 0;} .post-list .item { display:block; text-decoration: none; height:100%; padding:1.5rem 1.5rem 2rem 1.5rem; border-radius: 1.5rem; background: var(--Total-White); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .post-list .item .item-image { margin:0 0 1.25rem 0; height: 22.75rem; overflow:hidden; border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .post-list .item .item-info {margin:0 0 1rem 0;} .post-list .item .shild { margin:0 1rem 0 0; padding:0.25rem 0.75rem;color: var(--Total-White);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .post-list .item .shild.news {background: var(--Aditional_Yellow);color: var(--Moon-Black_Titles);} .post-list .item .shild.article {background:var(--Aditional_Blue);} .post-list .item .shild.analitika {background:var(--dark-wintergreen-100);} .post-list .item .item-name {color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0125rem;} .post-list .item.big { border-radius: 2rem; -webkit-border-radius: 2rem; -moz-border-radius: 2rem; -ms-border-radius: 2rem; -o-border-radius: 2rem; } .post-list .item.big .item-image { width: 47.6875rem; min-width: 47.6875rem; height: 35.5rem; margin:0 4.75rem 0 0; border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } /* колонка добирает остаток: в макете она 653px и справа остаётся 60px пустоты, здесь текст просто занимает всю ширину */ .post-list .item.big .item-container {flex:1;} .post-list .item.big .item-info {margin:0 0 1rem 0;} .post-list .item.big .item-name {margin:0 0 1rem 0;font-size: 3rem;letter-spacing: -0.03rem;text-transform: uppercase;} .post-list .item.big .item-anons {margin:0 0 1.5rem 0;color: var(--Moon-Grey_Body-text);line-height:140%;letter-spacing: -0.01125rem;} .post-list .item:hover .item-image img { transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; } .post-list .item:hover {box-shadow: 0 32px 32px 4px rgba(0, 0, 0, 0.08);} .logos-slider .slick-list {overflow:visible;} .logos-slider .item { margin:0 1.5rem 0 0; width: 18.75rem; height: 8rem; display:flex; align-items: center; justify-content: center; border-radius: 1rem; background: rgba(255, 255, 255, 0.60); -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .logos-slider .item img {max-width: 15rem;max-height: 4.5rem;} .logos-slider.logos-slider-right {margin:1.5rem 0 0 0;} .main-form .form-bg {width: 56.5rem;height: 56.5rem;position:relative;margin:0 -10rem 0 0; -webkit-mask-image: url('../../images/mask.svg'); mask-image: url('../../images/mask.svg'); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: cover; mask-size: cover; } .main-form .form-container {width: 40.8125rem;} .faq-accordions .item {margin:0 0 0.75rem 0; padding:0.75rem 0.75rem 0.75rem 1.25rem; border-radius: 0.75rem; background: var(--Total-White); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .faq-accordions .accordion-button {line-height: 120%;letter-spacing: -0.01125rem;color:var(--eco-green-100);} .faq-accordions .accordion-button.collapsed {color:var(--Moon-Black_Titles)} .faq-accordions .accordion-button .ic { color:var(--Total-White); display: flex; align-items: center; justify-content: center; font-size:1.25rem; width:2.25rem; min-width:2.25rem; height:2.25rem; border-radius: 0.75rem; background: var(--eco-green-100); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .faq-accordions .accordion-button .ic:before { transition: 0.5s; transform:rotate(45deg) ; -webkit-transform:rotate(45deg) ; -moz-transform:rotate(45deg) ; -ms-transform:rotate(45deg) ; -o-transform:rotate(45deg) ; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; } .faq-accordions .accordion-button.collapsed .ic {color:var(--Moon-Black_Titles);background: var(--Eco-Green_40);} .faq-accordions .accordion-button.collapsed .ic:before { transform:rotate(0) ; -webkit-transform:rotate(0) ; -moz-transform:rotate(0) ; -ms-transform:rotate(0) ; -o-transform:rotate(0) ; } .faq-accordions .answer {padding:1rem 0;} .faq-accordions .item:hover .accordion-button {color:var(--eco-green-100);} .socials .item { font-size:1.5rem;width: 3rem;height: 3rem; text-decoration: none; margin:0 1.25rem 0 0; border-radius: 0.75rem; border: 0.125rem solid var(--eco-green-100); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .socials .item:hover {background: var(--eco-green-100);color:var(--Total-White);} .socials.light .item {border:0;background:rgba(255,255,255,0.14); color:var(--Total-White);} .socials.light .item:hover {border:0;background:rgba(255,255,255,1); color:var(--eco-green-100);} .footer .footer-container { border-radius:2rem 2rem 0 0; margin:0 1rem -1rem 1rem; padding:5.5rem 0 2.75rem 0; background: var(--Total-White) url('../../images/footer-bg.webp') no-repeat top right; background-size:41rem; -webkit-border-radius:2rem 2rem 0 0; -moz-border-radius:2rem 2rem 0 0; -ms-border-radius:2rem 2rem 0 0; -o-border-radius:2rem 2rem 0 0; } .footer .footer-left {width: 23.875rem;} .footer .logo img {margin:0 0 2.5rem 0;width: 23.875rem;} .footer .copy {opacity:0.4;margin:4.3rem 0 0 0;line-height: 100%;} .footer .footer-contacts {width:27rem;} .footer .footer-contacts .item {margin:0 0 3rem 0;} .footer .footer-contacts .item:last-child {margin:0;} .footer .footer-contacts .item .icon { margin:0 1.25rem 0 0; font-size:2rem;color:var(--Total-White); min-width: 3rem; width: 3rem; height: 3rem; border-radius: 0.75rem; background: var(--eco-green-100); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .footer .footer-contacts .item .data {opacity: 0.4;margin:0 0 0.5rem 0;color: var(--Moon-Black_Titles);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem;} .footer .footer-contacts .item a.value {display:block;text-decoration: none;font-size: 1.75rem;line-height: 100%;letter-spacing: -0.0175rem;} .footer .footer-nav {width:32.37rem;} .footer .footer-nav .nav { display:block!important; column-count: 2; column-gap: 2rem;} .footer .footer-nav .nav li { break-inside: avoid;margin:0 0 3rem 0;} .footer .footer-nav .nav a {display:inline-block;text-decoration: none;line-height: 100%;} ul {margin:0;} .mobile-menu { transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); opacity:0; visibility: hidden; pointer-events: none; margin:-2rem 0 0 0; display:flex; flex-direction: column; overflow:auto; z-index:199; background:var(--Total-White); text-align: center; position:fixed; top:0; left:0; right:0; height:100%; padding:6.25rem 1rem 1rem 1rem; -webkit-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: all 1s cubic-bezier(0.22, 1, 0.36, 1); } .menu-open .mobile-menu {opacity:1;visibility: visible;pointer-events: all; margin:0;} .breadcrumps {line-height: 100%; margin:0 0 3rem 0;} .breadcrumps a {text-decoration: none;margin:0 0.62rem 0 0;display:inline-flex;align-items: center;} .breadcrumps a:after {content:"";display:block;width: 1rem;height: 1rem;margin:0 0 0 0.62rem;background: url('../../images/bread.svg') no-repeat center;} .breadcrumps span {opacity: 0.4;} .breadcrumps a:hover {opacity:0.4;} .hero-inner {padding:7.75rem 0 0 0;margin:0 0 3.75rem 0;} .h1-slider {position:relative;} .h1-slider .h1-slide {margin:0 1.5rem;} .h1-slider .h1-slide .shape {margin:0 0 0 3rem;width: 3.75rem;min-width: 3.75rem;} .h1-slider .h1-slide h1 {margin:0;white-space: nowrap;} .h1-slider .h1-slide .h1 {margin:0;white-space: nowrap;} .h1-slider:before {content:"";z-index:80; display:block;position:absolute;left:0;top:0;bottom:0;width: 33.875rem;background: linear-gradient(270deg, rgba(236, 242, 236, 0.00) 0%, rgba(236, 242, 236, 0.80) 40.45%, #ECF2EC 100%);} .h1-slider:after {content:"";z-index:80;display:block;position:absolute;right:0;top:0;bottom:0;width: 33.875rem;background: linear-gradient(90deg, rgba(236, 242, 236, 0.00) 0%, rgba(236, 242, 236, 0.80) 40.45%, #ECF2EC 100%);} .catalog-section {overflow:visible} .catalog-section .categorys-title {text-align:center;margin:0 0 1.25rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.5rem;font-weight: 700;line-height: 100%;letter-spacing: -0.015rem;text-transform: uppercase;} .catalog-section .category-slider {position:relative;} .catalog-section .category-slider .item {padding:1.25rem 0 0 0;text-align: center; color: var(--Moon-Black_Titles);line-height: 100%;letter-spacing: -0.01125rem; display:block; text-decoration: none; width: 9.25rem; border-radius: 0.75rem; height: 7.75rem; margin:0 0.375rem; border:0.0625rem solid var(--dark-wintergreen-40); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .catalog-section .category-slider .item:hover {background:var(--Total-White);border-color: var(--Total-White);color: var(--dark-wintergreen-100);} .catalog-section .category-slider .item svg path {fill:var(--dark-wintergreen-100)!important; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .catalog-section .category-slider .item:hover svg path {fill:var(--dark-wintergreen-100)!important;} .catalog-section .category-slider .item .icon {margin:0 0 0.75rem 0;} .catalog-section .category-slider .item .icon svg {width:auto;height:3.25rem;} .catalog-section .catalog-categorys {margin:0 0 3rem 0;} .catalog-section .catalog-categorys .slider-bottom {margin:1.25rem 0 0 0;} .catalog-section .catalog-top {margin:0 0 1.5rem 0;} .catalog-section .catalog-left {position:relative; width: 23.875rem;min-width: 23.875rem;margin:0 2.5rem 0 0;} .catalog-section .catalog-container {width:100%;} .catalog-section .catalog-top .quant {margin:0 0 0 1.5rem;} .catalog-section .filter-button {color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.5rem;font-weight: 700;line-height: 100%;letter-spacing: -0.015rem;text-transform: uppercase;} .catalog-section .catalog-filter {position:sticky;top:6rem; height:calc(100vh - 7.5rem); padding:2rem 0.5rem 2rem 2.5rem; border-radius: 1.5rem; background: var(--Total-White); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .catalog-section .catalog-filter .filter-container {overflow:auto;padding:0 1rem 0 0;} .catalog-section .catalog-filter .filter-name {margin:0 0 1.25rem 0;font-weight: 700;line-height: 100%;letter-spacing: -0.01125rem;} .catalog-section .catalog-filter .filter-block {margin:0 0 2rem 0;} .catalog-section .catalog-filter .filter-block:last-child {margin:0;} .catalog-section .catalog-filter .collapse:not(.show) { display: block; height: 13.5rem; overflow: hidden;} .catalog-section .catalog-filter .collapsing {height:13.5rem;} .catalog-section .catalog-filter .filter-more {color: var(--Moon-Black_Titles);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem;} .catalog-section .catalog-filter .filter-more .ic {color:var(--eco-green-100); margin:0 0 0 0.5rem;font-size:1.5rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .catalog-section .catalog-filter .filter-more:hover {color: var(--Eco-Green_100);} .catalog-section .catalog-filter .filter-more .less {display:none;} .catalog-section .catalog-filter .filter-more:not(.collapsed) .more {display:none;} .catalog-section .catalog-filter .filter-more:not(.collapsed) .less {display:block;} .catalog-section .catalog-filter .filter-more:not(.collapsed) .ic { transform:rotate(180deg) ; -webkit-transform:rotate(180deg) ; -moz-transform:rotate(180deg) ; -ms-transform:rotate(180deg) ; -o-transform:rotate(180deg) ; } .checkbox {margin:0 0 0.75rem 0;} .checkbox input { cursor:pointer; position: absolute; z-index: -1; opacity: 0; } .checkbox label {display:inline-block;margin:0;cursor:pointer; display:block; } .checkbox label input+span { cursor:pointer; position:relative; display:flex; align-items:center; padding:0;color: var(--Moon-Black_Titles);font-family: Arial;font-size: 1rem;font-weight: 400;line-height: 100%;letter-spacing: -0.01rem;} .checkbox label input+span:before { content:""; margin:0 0.75rem 0 0; display:block; background:var(--Eco-Green_40); border-radius: 0.25rem; min-width: 1.5rem; width: 1.5rem; height: 1.5rem; -webkit-border-radius: 0.25rem; -moz-border-radius: 0.25rem; -ms-border-radius: 0.25rem; -o-border-radius: 0.25rem; } .checkbox label input:checked+span:before {opacity:1;background: var(--Eco-Green_100) url('../../images/check2.svg') no-repeat center; background-size:1rem; } .hero-inner .hero-anons {max-width: 49.0625rem;margin:2.5rem auto 0 auto;color: var(--Moon-Grey_Body-text);} /* логотип партнёра поверх картинки карточки; height:auto перебивает .cover > * — иначе слой встал бы в поток и уехал под обрезку */ .post-list .item .item-image {position:relative;} .post-list .item .item-image .item-logo { position:absolute; z-index:3; top:0; bottom:0; left:0; right:0; height:auto; padding:0 1.5rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .post-list .item .item-image .item-logo img { width:auto; max-width:18.5625rem; max-height:7.5rem; transition:0.5s ; -webkit-transition:; -moz-transition:; -ms-transition:; -o-transition:; } /* --- страница статьи --- */ .article-section {padding:7.75rem 0 0 0;} .article-section .article-container { max-width: 83.125rem; margin:0 auto; padding:4rem 8.5rem; background: var(--Total-White); border-radius: 2rem; -webkit-border-radius: 2rem; -moz-border-radius: 2rem; -ms-border-radius: 2rem; -o-border-radius: 2rem; } .article-section .article-top {margin:0 0 1.25rem 0;} .article-section .article-top .shild { margin:0 1rem 0 0; padding:0.25rem 0.75rem;color: var(--Total-White);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .article-section .article-top .shild.news {background: var(--Aditional_Yellow);color: var(--Moon-Black_Titles);} .article-section .article-top .shild.article {background: var(--Aditional_Blue);} .article-section .article-top .shild.analitika {background: var(--dark-wintergreen-100);} .article-section h1 {margin:0 0 2.5rem 0;text-align:left;font-size: 3rem;letter-spacing: -0.03rem;} .article-section .article-image { height: 35.5rem; margin:0 0 2.5rem 0; overflow:hidden; border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .article > *:last-child {margin-bottom:0!important;} .article p {margin:0 0 2.5rem 0;} .article ul:not(.nav) {margin:0 0 2.5rem 0;} .article ol {margin:0 0 2.5rem 0;} .article h3 {margin:0 0 1.25rem 0;} .article h4 {margin:0 0 1.25rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} .article .btn-default {margin-top:0.5rem;} /* видео: подложка со светлой рамкой 0.75rem, внутри превью с затемнением и кнопкой play */ .article .article-video { position:relative; display:block; height:40rem; margin:0 0 2.5rem 0; padding:0.75rem; background: var(--Dark-Wintergreen_20); border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .article .article-video .video-image { height:100%; overflow:hidden; border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .article .article-video .video-image:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;background: var(--Moon-Black_Titles);opacity:0.5;} .article .article-video .video-play { position:absolute; z-index:3; left:50%; top:50%; width:3.5rem; height:3.5rem; margin:-1.75rem 0 0 -1.75rem; font-size:1.5rem; color: var(--Moon-Black_Titles); background: var(--Total-White); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .article .article-video:hover .video-image img { transform:scale(1.05) ; -webkit-transform:scale(1.05) ; -moz-transform:scale(1.05) ; -ms-transform:scale(1.05) ; -o-transform:scale(1.05) ; } /* только margin-bottom: шорткат обнулял бы отрицательные боковые margin у .gutters-075 и колонки теряли ширину */ .article .article-gallery {margin-bottom:2.5rem;} .article .article-gallery .gallery-item {margin:1.5rem 0 0 0; display:block; height: 21.75rem; overflow:hidden; border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .article .article-gallery .gallery-item:hover img { transform:scale(1.05) ; -webkit-transform:scale(1.05) ; -moz-transform:scale(1.05) ; -ms-transform:scale(1.05) ; -o-transform:scale(1.05) ; } .article .article-gallery .col-12:nth-child(1) .gallery-item {margin:0;} .article .article-gallery .col-12:nth-child(2) .gallery-item {margin:0;} .seo-section .seo-container { padding:3rem 4rem; background: var(--Total-White); border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .seo-section .seo-text h2 {font-size: 2.5rem;letter-spacing: -0.025rem;} .seo-section .seo-text h3 {font-size: 2rem;letter-spacing: -0.025rem;} .seo-section .seo-text h4 {font-size: 1.5rem;letter-spacing: -0.025rem;} .seo-section .seo-text p {margin:0 0 1.5rem 0;line-height:140%;letter-spacing: -0.01125rem;} .seo-section .seo-text p:last-child {margin:0;} .seo-section .seo-text .collapse:not(.show) {display:block;height:8rem;overflow:hidden;} .seo-section .seo-text .collapsing {height:8rem;} .seo-section .seo-more {color: var(--Moon-Black_Titles);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem;} .seo-section .seo-more .ic {color:var(--eco-green-100); margin:0 0 0 0.5rem;font-size:1.5rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .seo-section .seo-more:hover {color: var(--Eco-Green_100);} .seo-section .seo-more .less {display:none;} .seo-section .seo-more:not(.collapsed) .more {display:none;} .seo-section .seo-more:not(.collapsed) .less {display:block;} .seo-section .seo-more:not(.collapsed) .ic { transform:rotate(180deg) ; -webkit-transform:rotate(180deg) ; -moz-transform:rotate(180deg) ; -ms-transform:rotate(180deg) ; -o-transform:rotate(180deg) ; } .more-block {margin:1.5rem 0 0 0;} .more-block .more-load {width:23.875rem;} .more-block .more-load .ic {margin:0 0.5rem 0 0;font-size:1.75rem;color: var(--Eco-Green_100);} .more-block .more-load:hover .ic { color:var(--Total-White); transform:rotate(360deg) ; -webkit-transform:rotate(360deg) ; -moz-transform:rotate(360deg) ; -ms-transform:rotate(360deg) ; -o-transform:rotate(360deg) ; } .more-block .pagination-list .page { width:3.25rem; height:3.25rem; margin:0 0 0 0.75rem; display:flex; align-items:center; justify-content:center; text-decoration:none;background: var(--Total-White); border:0.125rem solid transparent; border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .more-block .pagination-list .page:first-child {margin:0;} .more-block .pagination-list .page.active {color: var(--Total-White);background: var(--Eco-Green_100);border-color: var(--Eco-Green_100);} .more-block .pagination-list .page:hover {color: var(--Total-White);background: var(--Eco-Green_100);border-color: var(--Eco-Green_100);} .more-block .pagination-list .page.dots {background:none;} .more-block .pagination-list .page.prev, .more-block .pagination-list .page.next {font-size:1.25rem;background:none;border-color: var(--Eco-Green_100);} .more-block .pagination-list .page.prev:hover, .more-block .pagination-list .page.next:hover {color: var(--Total-White);background: var(--Eco-Green_100);} /* на первой странице «назад» неактивна, на последней — «вперёд»: состояние вешается классом, кнопка остаётся в потоке */ .more-block .pagination-list .page.disabled {display:none!important; pointer-events:none;color: var(--dark-wintergreen-60);border-color: var(--dark-wintergreen-40);} .catalog-bnner {margin:10rem 0 0 0; position:relative; overflow:hidden; height:27.5rem; border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } /* подложка размыта своим filter, а не backdrop-filter у рамки: backdrop у наложенного слоя оказывается пустым и полоса заливается ровным тёмным вместо фото */ .catalog-bnner .banner-media {position:absolute;top:0;left:0;right:0;bottom:0;} /* картинка с запасом за края: blur размывает границу в прозрачность, и без запаса по периметру шла бы светлая кайма */ .catalog-bnner .banner-media img { position:absolute; top:-1rem; left:-1rem; width:calc(100% + 2rem); height:calc(100% + 2rem); max-width:none; -o-object-fit: cover; object-fit: cover; -webkit-filter: blur(0.25rem); filter: blur(0.25rem); } .catalog-bnner .banner-media:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;background: linear-gradient(90deg, rgba(20, 20, 20, 0.80) 0%, rgba(20, 20, 20, 0.61) 33%, rgba(20, 20, 20, 0.00) 67%);} /* высветление рамки поверх размытой подложки; внутреннюю область перекрывает чёткая копия .banner-inner со своим радиусом 1rem */ .catalog-bnner .banner-frost { position:absolute; top:0; left:0; right:0; bottom:0; background: rgba(255, 255, 255, 0.10); border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } /* копия фото и градиента, растянутая на габариты всего баннера и обрезанная по внутреннему скруглению — так она попиксельно совпадает с подложкой */ .catalog-bnner .banner-inner { position:absolute; overflow:hidden; top:2.5rem; left:2.5rem; right:2.5rem; bottom:2.5rem; border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .catalog-bnner .banner-inner img { position:absolute; top:-2.5rem; left:-2.5rem; width:calc(100% + 5rem); height:calc(100% + 5rem); max-width:none; -o-object-fit: cover; object-fit: cover; } .catalog-bnner .banner-inner:after {content:"";display:block;position:absolute;top:-2.5rem;left:-2.5rem;width:calc(100% + 5rem);height:calc(100% + 5rem);background: linear-gradient(90deg, rgba(20, 20, 20, 0.80) 0%, rgba(20, 20, 20, 0.61) 33%, rgba(20, 20, 20, 0.00) 67%);} /* линия по внутреннему краю: сплошной бордер плюс маска, чтобы он растворялся вправо, — так сохраняется скругление, которого не даёт border-image */ .catalog-bnner .banner-line { position:absolute; top:2.5rem; left:2.5rem; right:2.5rem; bottom:2.5rem; border:0.125rem solid rgba(255, 255, 255, 0.40); -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0) 100%); mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0) 100%); border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .catalog-bnner .banner-info {position:absolute;z-index:5;top:6.5rem;left:6.5rem;width:29.125rem;} .catalog-bnner .banner-title {margin:0 0 1.5rem 0;color: var(--Total-White);font-family: "Exo 2";font-size: 2.5rem;font-weight: 700;line-height: 100%;letter-spacing: -0.025rem;text-transform: uppercase;} .select2-container--custom .select2-selection__clear {display:none;} .select2-container.select2-container--custom {width:auto!important;} .select2-container.select2-container--custom .select2-selection--single .select2-selection__rendered {padding:0 1.25rem;line-height:3rem;} .select2-container.select2-container--custom .select2-selection--single { height:3rem; border-radius: 0.75rem; border: 1px solid var(--Dark-Wintergreen_40); background: rgba(255,255,255,0.6); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .select2-container.select2-container--custom .select2-selection__arrow { width: 1.25rem; height: 1.25rem; top:0.875rem; right:1rem; position:absolute; background: url('../../images/select.svg') no-repeat; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; background-size:1.25rem; } .select2-container--open.select2-container--custom .select2-selection__arrow { transform:rotate(-180deg); -webkit-transform:rotate(-180deg); -moz-transform:rotate(-180deg); -ms-transform:rotate(-180deg); -o-transform:rotate(-180deg); } .select2-container.select2-container--custom.select2-container--open .select2-selection--single {border: 1px solid var(--eco-green-100); background: rgba(255,255,255,1);} .select2-container--custom .select2-dropdown { padding:0.5rem; margin:0.37rem 0 0 0; border-radius: 0.75rem; border: 1px solid var(--dark-wintergreen-40); background: var(--Total-White); box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.06); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .select2-container.select2-container--custom .select2-results__option:before {display:none;} .catalog-section .select2-container.select2-container--custom {min-width: 23.875rem;} .catalog-section .select2-container.select2-container--custom .select2-results__option { padding:0.5rem 0.75rem; color: var(--Moon-Black_Titles); line-height: 100%; margin:0 0 0.25rem 0; letter-spacing: -0.01125rem; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; } .catalog-section .select2-container.select2-container--custom .select2-results__option--selected {background: var(--dark-wintergreen-20);} .catalog-section .select2-container.select2-container--custom .select2-results__option:hover {background: var(--dark-wintergreen-20);} /* --- R&D / демо-полігон --- */ .rd-hero {position:relative;margin:0 0 5rem 0;} .rd-hero .hero-media { position:relative; overflow:hidden; margin:1rem 1rem 0 1rem; height:35.5rem; border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .rd-hero .hero-media:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;background: linear-gradient(180deg, rgba(20, 20, 20, 0.00) 0%, rgba(20, 20, 20, 0.40) 100%), linear-gradient(180deg, rgba(20, 20, 20, 0.50) 0%, rgba(20, 20, 20, 0.20) 100%);} .rd-hero .hero-info {position:absolute;z-index:5;left:0;right:0;bottom:6rem;} .rd-hero h1 {width:49.25rem;margin:0;text-align:left;color: var(--Total-White);} .rd-hero .hero-anons {margin:0 0 0 1.5rem; width:40.625rem;color: var(--Total-White);font-size: 1.25rem;line-height:130%;letter-spacing: -0.0125rem;} .rd-stages .stages-title {margin:0 0 2.5rem 0;} .rd-stages h4 {margin:0;} .rd-stages .stages-title .h3 {margin:0;max-width: 83.1875rem;} .rd-stages .stages-list .item { margin:0 0 1.25rem 0; min-height:16.25rem; padding:2.5rem 4.25rem; background: var(--Total-White); box-shadow: 0 -0.5rem 1.5rem 0 rgba(0, 0, 0, 0.06); border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .rd-stages .stages-list .item:last-child {margin:0;} .rd-stages .item-head {width: 37.75rem;min-width: 37.75rem;margin:0 8.75rem 0 0;} .rd-stages .item-icon { width: 5.5rem; min-width: 5.5rem; height: 5.5rem; margin:0 3rem 0 0; background: var(--Dark-Wintergreen_20); border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .rd-stages .item-icon img {width:3.75rem;} .rd-stages .item-name {color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} .rd-stages .item-list {margin:0;padding:0;list-style:none;} .rd-stages .item-list li {position:relative;margin:0 0 1rem 0;padding:0 0 0 2rem;color: var(--Moon-Grey_Body-text);} .rd-stages .item-list li:last-child {margin:0;} .rd-stages .item-list li:before {content:"";display:block;position:absolute;left:0;top:0.19rem;width:1.25rem;height:1.25rem;background: url('../../images/check.svg') no-repeat center;background-size:1.25rem;} .rd-about .about-title {margin:0 0 3.75rem 0;} .rd-about .about-anons {max-width: 49.1875rem;margin:0 auto;color: var(--Moon-Grey_Body-text);} .rd-about .about-image { width: 49.1875rem; min-width: 49.1875rem; height: 55rem; overflow:hidden; border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .rd-about .about-list {width: 21.75rem;padding:7.5rem 0 0 0;} .rd-about .about-list .item {margin:0 0 5rem 0;} .rd-about .about-list .item:last-child {margin:0;} .rd-about .about-list .item-icon {height:2.5rem;margin:0 0 0.75rem 0;} .rd-about .about-list .item-icon img {height:2.5rem;margin:0 auto;} .rd-about .about-list .item-name {max-width: 15.4375rem;margin:0 auto;color: var(--Moon-Grey_Body-text);} /* фигурная обрезка картинки — тот же приём, что у .main-form .form-bg */ .rd-about .rd-mask {width: 74.625rem;max-width:100%;margin:-14rem auto 0 auto;} .rd-about .rd-mask .mask-image {height: 28.6875rem; -webkit-mask-image: url('../../images/mask4.svg'); mask-image: url('../../images/mask4.svg'); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: cover; mask-size: cover; } .rd-about .rd-mask .mask-image img { width:100%; height:100%; -o-object-fit: cover; object-fit: cover; } .rd-map {position:relative;overflow:hidden;padding:5rem 0 0 0;} .rd-map .map-media {height:64rem;position:relative;} .rd-map .map-media:after {content:"";display:block;position:absolute;top:0;left:0;right:0;height:15rem;background: linear-gradient(180deg, var(--Dark-Wintergreen_20) 0%, rgba(236, 242, 236, 0.00) 100%);} .rd-map .container-fluid {position:relative;z-index:3;} .rd-map .map-info {margin:0 0 2.5rem 0;} .rd-map .map-anons {max-width: 49.1875rem;margin:0 auto;color: var(--Moon-Grey_Body-text);} .rd-map .map-cont {position:relative;} /* карта статичная: подложка фоном, пины абсолютом в процентах — никакой логики */ .rd-map .map-container {position:absolute; top:3.75rem; left:0;right:0; max-width: 83.125rem;margin:0 auto;} .rd-map .map-picture {height: 51rem;} .rd-map .pin { position:absolute; width:2rem; height:2rem; margin:-2rem 0 0 -1rem; display:flex; align-items:center; justify-content:center; font-size:2rem; color: var(--Eco-Green_100); } .catalog-section .system-image {display:block; position:relative; margin:0 0 3.75rem 0; padding:1.5rem; border-radius: 1.5rem; background: var(--Total-White); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .catalog-section .system-image .image-container { position:relative; overflow:hidden; border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .catalog-section .system-image .image-container:after { content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; opacity: 0; background: var(--Moon-Black_Titles); backdrop-filter: blur(6px); transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .catalog-section .system-image .zoom {opacity:0; font-size:5rem; color:var(--Total-White); position:absolute; top:50%; left:50%; z-index:3; transition:0.5s ; transform:translate(-50%,-50%) ; -webkit-transform:translate(-50%,-50%) ; -moz-transform:translate(-50%,-50%) ; -ms-transform:translate(-50%,-50%) ; -o-transform:translate(-50%,-50%) ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .catalog-section .system-image:hover .zoom {opacity:1;} .catalog-section .system-image:hover .image-container:after {opacity:0.2;} .catalog-section .catalog-anons {margin:0 0 3.75rem 0;} ul:not(.nav) {margin:0;padding:0;list-style:none;} ul:not(.nav) li {position:relative;margin:0 0 1.25rem 0;padding:0 0 0 2rem;} ul:not(.nav) li:last-child {margin:0;} ul:not(.nav) li:before {content:"";display:block;position:absolute;left:0;top:0.19rem;width:1.25rem;height:1.25rem;background: url('../../images/check.svg') no-repeat center;background-size:1.25rem;} .catalog-section .category-aside { padding:1.5rem 1.25rem; border-radius: 1.5rem; background: var(--Total-White, #FFF); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .catalog-section .category-aside .item {text-decoration: none; display:flex; align-items:center; margin:0 0 0.25rem 0; padding:0.25rem 1.25rem; border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .catalog-section .category-aside .item .icon {width:2.5rem;min-width:2.5rem;margin:0 1.25rem 0 0;} .catalog-section .category-aside .item .icon svg path { fill:var(--Dark-Wintergreen_100)!important; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .catalog-section .category-aside .item .icon svg {width:100%;height:auto;} .catalog-section .category-aside .item:hover {background: var(--dark-wintergreen-20);} .catalog-section .category-aside .item.active {background: var(--dark-wintergreen-20);} .catalog-section .catalog-left .catalog-categorys {margin:0;top:6.5rem;position:sticky;} .catalog-detail {padding:6rem 0 0 0;overflow:visible;} .catalog-detail .detail-left {position:relative;margin:0 0 0 -9rem;width: 58rem;} .catalog-detail .detail-media {padding:5rem; position: sticky; top:6rem; height:calc(100vh - 7.5rem); border-radius: 1.25rem; background: url('../../images/bg3.webp') no-repeat top center; background-size: cover; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .catalog-detail .detail-media .image-container {position:relative; max-width: 45.5625rem;max-height: 47.5rem;height:100%;} .catalog-detail .detail-media .image-container img {max-width:none;height:100%;} .catalog-detail .detail-media .image-container .tech {position:absolute;top:2rem;left:2rem;width: 12.75rem;} .catalog-detail .detail-media .image-container .tech img {max-width:100%;} .catalog-detail .detail-media .shilds {position:absolute;top:3rem;right:3rem;text-align: right;} .catalog-detail .detail-media .shilds .shild {display:inline-block; margin:0 0 0.5rem 0;color: var(--Total-White);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem; padding:0.25rem 0.75rem; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .catalog-detail .detail-media .shilds .shild.new {color:var(--Moon-Black_Titles);background: var(--Aditional_Yellow);} .catalog-detail .detail-media .shilds .shild.popular {background: var(--dark-wintergreen-100);} .catalog-detail .detail-media .shilds .shild.recomend {background: var(--Aditional_Blue);} .catalog-detail .detail-media .product {position:absolute;right:2.5rem;bottom:2.5rem;text-align: center;font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem;} .catalog-detail .detail-media .product .product-media {margin:0 0 0.75rem 0; position:relative; padding:0.5rem;height: 12.5rem;width:12.5rem; border-radius: 1rem; background: var(--Total-White); -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .catalog-detail .detail-media .product .product-media .product-image {position:relative; height:100%; overflow:hidden; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .catalog-detail .detail-media .product .product-media .product-image:after { content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; opacity: 0; background: var(--Moon-Black_Titles); backdrop-filter: blur(6px); transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .catalog-detail .detail-media .product .product-media .zoom {opacity:0; font-size:3rem; color:var(--Total-White); position:absolute; top:50%; left:50%; z-index:3; transition:0.5s ; transform:translate(-50%,-50%) ; -webkit-transform:translate(-50%,-50%) ; -moz-transform:translate(-50%,-50%) ; -ms-transform:translate(-50%,-50%) ; -o-transform:translate(-50%,-50%) ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .catalog-detail .detail-media .product .product-media:hover .zoom {opacity:1; } .catalog-detail .detail-media .product .product-media:hover .product-image:after {opacity:0.3;} .catalog-detail .detail-container {padding:2.5rem 0 0 0;font-size:1rem;line-height: 140%;} .catalog-detail .detail-container .category {padding:0.53rem 0.75rem;color: var(--dark-wintergreen-100);font-size: 1rem;font-weight: 700;line-height: 100%; /* 1rem */letter-spacing: -0.01rem; display:inline-block; border-radius: 0.5rem; background: rgba(100, 180, 80, 0.12); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .catalog-detail .detail-container h1 {text-align: left;} .catalog-detail .detail-container .anons {font-size: 1rem;line-height: 140%;letter-spacing: -0.01rem;} .catalog-detail .detail-container .detail-buttons > * {margin:0 1rem 0 0;} .catalog-detail .detail-container .detail-buttons > *:last-child {margin:0;} .catalog-detail .detail-container .detail-elements h6 {margin:0;} .catalog-detail .detail-container .detail-elements .item { overflow:hidden; margin:1rem 0.63rem 0 0; width: 5.25rem; height: 4.625rem; position:relative; padding:0.75rem 0 0 0.75rem; background: rgba(100, 180, 80, 0.1); border-radius:0.75rem 0.75rem 0.75rem 0 ; -webkit-border-radius:0.75rem 0.75rem 0.75rem 0 ; -moz-border-radius:0.75rem 0.75rem 0.75rem 0 ; -ms-border-radius:0.75rem 0.75rem 0.75rem 0 ; -o-border-radius:0.75rem 0.75rem 0.75rem 0 ; } .catalog-detail .detail-container .detail-elements .item .item-name {opacity:0.6; margin:0 0 0.5rem 0;color: var(--dark-wintergreen-100);font-size: 0.875rem;font-weight: 700;line-height: 100%;letter-spacing: -0.00875rem;} .catalog-detail .detail-container .detail-elements .item .item-letter {color: var(--dark-wintergreen-100);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} .catalog-detail .detail-container .detail-elements .item .item-color {position:absolute;right:0;bottom:0;width: 1rem;height: 1rem;} .catalog-detail .detail-container ul:not(.nav) li:before { top: 0; } .catalog-detail .detail-container ul:not(.nav) li {margin:0 0 1rem 0;} .catalog-detail .detail-container .article p { margin: 0 0 1rem 0; font-size: 1rem; line-height: 140%; letter-spacing: -0.01rem;} .catalog-detail .detail-container .detail-cultures h6 {margin:0 0 0.5rem 0;} .catalog-detail .detail-container .detail-cultures .item {color: var(--dark-wintergreen-100);font-size: 0.875rem;font-weight: 700;line-height: 100%;letter-spacing: -0.00875rem; display:flex; background:rgba(100, 180, 80, 0.1); align-items: center; justify-content: center; flex-direction: column; border-radius:0.75rem ; margin:0.5rem 0.25rem 0rem 0; width: 6.5rem; height: 4.625rem; text-align: center; -webkit-border-radius:0.75rem ; -moz-border-radius:0.75rem ; -ms-border-radius:0.75rem ; -o-border-radius:0.75rem ; } .catalog-detail .detail-container .detail-cultures .item .icon img {margin:0 0 0.25rem 0;height: 2.125rem;} .catalog-detail .detail-container .detail-packs h6 {margin:0;} .catalog-detail .detail-container .detail-packs .item { margin:0 0 0 0.75rem; padding:0.5rem 0.75rem;color: var(--dark-wintergreen-100);font-size: 1rem;font-weight: 700;line-height: 100%;letter-spacing: -0.01rem; border-radius: 0.5rem; background: rgba(100, 180, 80, 0.12); -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .video-block { padding:0.75rem; background: var(--Total-White); border-radius: 1.5rem; -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .video-block .video-container { overflow:hidden; height: 24.25rem; position:relative; overflow:hidden; border-radius: 1rem; -webkit-border-radius:; -moz-border-radius:; -ms-border-radius:; -o-border-radius:; } .video-block .video-container:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;opacity: 0.5;background: var(--Moon-Black_Titles);} .video-block .play-btn { position:absolute; z-index:5; font-size:2rem; color:var(--eco-green-100); width: 3.5rem; border-radius: 0.75rem; background: var(--Total-White); height: 3.5rem; top:50%; left:50%; transform:translate(-50%,-50%) ; -webkit-transform:translate(-50%,-50%) ; -moz-transform:translate(-50%,-50%) ; -ms-transform:translate(-50%,-50%) ; -o-transform:translate(-50%,-50%) ; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .video-block:hover .play-btn {background:var(--eco-green-100);color:var(--Total-White);} .article .video-block .video-container {height: 38.5rem;} .article .video-block {background: var(--dark-wintergreen-20);margin:0 0 2.5rem 0;} .detail-map .map-container {position:relative;} .detail-map .map-container .cta { position:absolute; top:50%; left:50%; transform:translate(-50%,-150%) ; -webkit-transform:translate(-50%,-150%) ; -moz-transform:translate(-50%,-150%) ; -ms-transform:translate(-50%,-150%) ; -o-transform:translate(-50%,-150%) ; } .catalog-detail .detail-container .detail-articles .item { text-decoration: none; padding:1.25rem; margin:0 0 1.5rem 0; border-radius: 1.5rem; background: var(--Total-White); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; -ms-border-radius: 1.5rem; -o-border-radius: 1.5rem; } .catalog-detail .detail-container .detail-articles .item:last-child {margin:0;} .catalog-detail .detail-container .detail-articles .item .item-image {margin:0 1.25rem 0 0; min-width: 14.5625rem;width: 14.5625rem;height: 11.375rem; border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .catalog-detail .detail-container .detail-articles .item .item-name {margin:1rem 0 0 0;font-family: "Exo 2";font-size: 1.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0125rem;} .catalog-detail .detail-container .detail-articles .item .shild { margin:0 1rem 0 0; padding:0.25rem 0.75rem;color: var(--Total-White);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .catalog-detail .detail-container .detail-articles .item .shild.news {background: var(--Aditional_Yellow);color: var(--Moon-Black_Titles);} .catalog-detail .detail-container .detail-articles .item .shild.article {background:var(--Aditional_Blue);} .catalog-detail .detail-container .detail-articles .item .shild.analitika {background:var(--dark-wintergreen-100);} .catalog-detail .detail-container .detail-articles .item .date {font-size: 1rem;line-height: 100%; /* 1rem */letter-spacing: -0.01rem;} .article img[align=left] {margin:0 1rem 1rem 0;} .article img[align=right] {margin:0 0rem 1rem 1rem;} .article .alignleft {margin:0 1rem 1rem 0;float:left;} .article .alignright {margin:0 0rem 1rem 1rem;float:right;} .article ul:before {content:"";clear:both;display:block;} .detail-text:after {content:"";clear:both;display:block;} .catalog-detail .detail-container {width: 40.8125rem;} @media (min-width: 993px) { .anim-link:hover::after { transform: scaleX(1); transform-origin: left;} .header .header-langs:hover .langs-drop {opacity:1;visibility: visible;pointer-events: all;margin:0;} .catalog-list .item:hover .item-image img { transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; } .catalog-list .item:hover .item-bg { opacity:0.14;margin:-12.6rem 0 0 -13.9rem;} } /* --- Про компанію --- */ .about-hero {position:relative;margin:0 0 5rem 0;} .about-hero .hero-media { position:relative; overflow:hidden; margin:1rem 1rem 0 1rem; height:35.5rem; border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .about-hero .hero-media:after {content:"";display:block;position:absolute;top:0;bottom:0;left:0;right:0;background: linear-gradient(180deg, rgba(20, 20, 20, 0.50) 0%, rgba(20, 20, 20, 0.20) 100%);} .about-hero .hero-info {position:absolute;z-index:5;left:0;right:0;bottom:2.5rem;} .about-hero h1 {margin:0 0 3rem 0;text-align:left;color: var(--Total-White);} .about-hero .about-nav {margin:0;} .about-hero .about-nav .navs-tabs { flex-wrap: nowrap; display:flex; width:100%; padding:0.5rem; -webkit-backdrop-filter: blur(1rem); backdrop-filter: blur(1rem); border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .about-hero .about-nav .navs-tabs li {width:100%;} .about-hero .about-nav .navs-tabs a {min-width:0;margin:0;padding:0.75rem 1.25rem;text-align:center;} .about-history {overflow:visible;} .about-history .history-container {position:relative;padding:4.25rem 0 0 0;} .about-history .history-row {position:relative;padding:2.5rem 0 5rem 0;border-top:0.0625rem solid rgba(35, 107, 87, 0.4);} .about-history .history-row:last-child {padding-bottom:0;margin:0;} .about-history .history-row h3 {width:23.9375rem;margin:0;} .about-history .history-list {width:40.8125rem;margin:0;padding:0;list-style:none;} .about-history .history-list li {position:relative;margin:0 0 1.5rem 0;padding:0 0 0 2rem;line-height:140%;letter-spacing: -0.01125rem;} .about-history .history-list li:last-child {margin:0;} .about-history .history-list li:before {content:"";display:block;position:absolute;left:0;top:0.19rem;width:1.25rem;height:1.25rem;background: url(../../images/check.svg) no-repeat center;background-size:1.25rem;} .about-history .history-mask {position:absolute;z-index:3;left:25.375rem;top:0;width: 27.125rem;height: 45.125rem;} .about-history .history-mask .mask-image {height:100%; -webkit-mask-image: url(../../images/mask3.svg); mask-image: url(../../images/mask3.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: cover; mask-size: cover; } .about-history .history-mask .mask-image img { width:100%; height:100%; -o-object-fit: cover; object-fit: cover; } .about-numbers {padding:0 1rem;} .about-numbers .numbers-image { width: 50%; min-width: 50%; height: 61.75rem; overflow:hidden; } .about-numbers .numbers-image.first { border-radius: 1.25rem 1.25rem 0 1.25rem; -webkit-border-radius: 1.25rem 1.25rem 0 1.25rem; -moz-border-radius: 1.25rem 1.25rem 0 1.25rem; -ms-border-radius: 1.25rem 1.25rem 0 1.25rem; -o-border-radius: 1.25rem 1.25rem 0 1.25rem; } .about-numbers .numbers-image.second { border-radius: 0 1.25rem 0 1.25rem; -webkit-border-radius: 0 1.25rem 0 1.25rem; -moz-border-radius: 0 1.25rem 0 1.25rem; -ms-border-radius: 0 1.25rem 0 1.25rem; -o-border-radius: 0 1.25rem 0 1.25rem; } .about-numbers .numbers-list {width: 40.8125rem;min-width: 40.8125rem;margin:0 9rem 0 0rem;} .about-numbers .numbers-row.second .numbers-list {margin:0 0rem 0 9rem;} .about-numbers .numbers-list .item {margin:0 0 5rem 0;} .about-numbers .numbers-list .item:last-child {margin:0;} .about-numbers .numbers-list .h3 {margin:0 0 1.25rem 0;font-size: 3rem;letter-spacing: -0.03rem;} .about-numbers .numbers-row:not(.second) .numbers-list .item:nth-child(even) .h3 span {color: var(--Dark-Wintergreen_100);} .about-numbers .numbers-row.second .numbers-list .item:first-child .h3 span {color: var(--Dark-Wintergreen_100);} .about-numbers .numbers-row.second .numbers-image {order:12;} .about-numbers .numbers-list .item-anons {line-height:140%;letter-spacing: -0.01125rem;} .about-directions {background: var(--Total-White) url('../../images/bg4.svg') no-repeat left top 5rem;} .about-directions .directions-head {position:relative;width: 40.8125rem;} .about-directions .directions-list {position:relative;width:41rem;margin:0 8rem 0 0;} .about-directions .directions-line {display:block;position:absolute;left:2rem;top:0rem;bottom:0rem;width:0.0625rem;background: repeating-linear-gradient(180deg, var(--Dark-Wintergreen_40) 0, var(--Dark-Wintergreen_40) 0.5rem, transparent 0.5rem, transparent 1rem);} .about-directions .directions-line .progress-line {position:absolute;left:0;right:0;top:0;height:0%;background: var(--eco-green-100);} .about-directions .directions-list .item {position:relative;margin:0 0 10rem 0;} .about-directions .directions-list .item:last-child {margin:0;background: var(--Total-White) ;} .about-directions .item-num {margin:0 4.44rem 0 0; width:4rem; height:4rem; display:flex; align-items:center; justify-content:center; color: var(--Moon-Black_Titles);font-size: 1.75rem;font-weight: 700;line-height:100%;letter-spacing: -0.0175rem; background: var(--Total-White); border:0.125rem solid var(--Eco-Green_100); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .about-directions .item-icon { width: 5.5rem; min-width: 5.5rem; height: 5.5rem; margin:0 3rem 0 0; background: var(--Dark-Wintergreen_20); border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } .about-directions .item-icon img {width:3.25rem;} .about-directions .item-info {width: 23.875rem;} .about-society .society-list .item {padding:2.5rem 0;border-bottom:0.0625rem solid rgba(20, 20, 20, 0.2);} .about-society .society-list .item:first-child {border-top:0.0625rem solid rgba(20, 20, 20, 0.2);} .about-society .society-list .item:last-child {border-bottom:0;padding-bottom:0;} .about-society .item-images {margin:0 5rem 0 0;} .about-society .item-image { height: 20.75rem; overflow:hidden; border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .about-society .item-image:first-child {width: 23.875rem;min-width: 23.875rem;margin:0 1.5rem 0 0;} .about-society .item-image:last-child {width: 32.3125rem;min-width: 32.3125rem;} .about-society .item-info {width: 32.3125rem;padding:3rem 0 0 0;} .about-society .item-name {margin:0 0 1.25rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 2rem;font-weight: 700;line-height: 100%;letter-spacing: -0.02rem;text-transform: uppercase;} .about-society .item-anons {line-height:140%;letter-spacing: -0.01125rem;} .about-vacancies {position:relative;overflow:hidden;} .about-vacancies .vacancies-media {position:relative;z-index:1;top:0;height:100vh; border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .about-vacancies .vacancies-media:after {content:"";display:block;position:absolute;top:0;left:0;right:0;height:22.5rem;background: linear-gradient(180deg, var(--Dark-Wintergreen_20) 0%, rgba(236, 242, 236, 0.00) 100%);} .about-vacancies .vacancies-info {position:absolute;left:0;right:0;top:5rem;} .about-vacancies .container-fluid {position:relative;z-index:3;} .about-vacancies .vacancies-list {position:relative;margin:-2.75rem 0 0 0;} .about-vacancies .vacancies-list .item { min-height:5.5rem; margin:0 0 0.75rem 0; padding:1.25rem 2.5rem; text-decoration:none; background: var(--Total-White); border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .about-vacancies .vacancies-list .item:last-child {margin:0;} .about-vacancies .vacancies-list .item-name { color: var(--Moon-Black_Titles); width:42rem; font-family: "Exo 2"; font-size: 1.5rem; font-weight: 700; line-height: 120%; letter-spacing: -0.015rem; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .about-vacancies .vacancies-list .item-place {margin:0 1.5rem 0 0;width:10rem;} .about-vacancies .vacancies-list .item-place .ic {margin:0 0.75rem 0 0;font-size:1.75rem;color: var(--dark-wintergreen-100);} .about-vacancies .vacancies-list .item-type {margin:0 1.5rem 0 0;width:32rem;} .about-vacancies .vacancies-list .item-type .ic {margin:0 0.75rem 0 0;font-size:1.75rem;color: var(--dark-wintergreen-100);} .about-vacancies .vacancies-list .item-right > .ic { width:2.25rem; min-width:2.25rem; height:2.25rem; display:flex; align-items:center; justify-content:center; font-size:1.25rem; color: var(--Eco-Green_100); background: rgba(100, 180, 80, 0.2); border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .about-vacancies .vacancies-list .item:hover .item-right > .ic {color: var(--Total-White);background: var(--Eco-Green_100);} .about-vacancies .vacancies-list .item:hover .item-name {color: var(--eco-green-100);} /* --- Детальна сторінка вакансії --- */ /* .vacancy-hero идёт вторым классом к .about-hero: медиа, градиент и hero-info берём оттуда, здесь только отличия */ .vacancy-hero .hero-info {top:8.25rem;bottom:auto;} /* 7.25rem от медиа + 1rem его верхнего margin */ .vacancy-hero .hero-back {margin:0 0 4rem 0;color: var(--Total-White);text-decoration:none;} .vacancy-hero .hero-back .back-ic { transition:0.5s ; width:3rem; min-width:3rem; height:3rem; margin:0 0.75rem 0 0; font-size:1.25rem; color: var(--Moon-Black_Titles); background: var(--Eco-Green_100); border-radius: 0.75rem; -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .vacancy-hero .hero-back .back-ic .ic { width:2.25rem; height:2.25rem; display:flex; align-items:center; justify-content:center; background: var(--Total-White); border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; } .vacancy-hero .hero-back:hover .back-ic {background: var(--Total-White);} .vacancy-hero h1 {width: 57.6875rem;margin:0 0 2rem 0;} .vacancy-hero .hero-chars {color: var(--Total-White);} .vacancy-hero .hero-chars > div {margin:0 2.5rem 0 0;} .vacancy-hero .hero-chars > div:last-child {margin:0;} .vacancy-hero .hero-chars .ic {margin:0 0.5rem 0 0;font-size:1.25rem;} .vacancy-section .vacancy-text {width: 49.25rem;} .vacancy-section .vacancy-form {width: 40.8125rem;min-width: 40.8125rem;} .vacancy-section .vacancy-form h3 {margin:0 0 1.5rem 0;} .vacancy-section .vacancy-form .anons {margin:0 0 2.5rem 0;line-height:140%;letter-spacing: -0.01125rem;} /* нативный input прячем: кликом работает сама подпись */ .file-add {margin:0 0 1.5rem 0;cursor:pointer;} .file-add input[type="file"] {position:absolute;width:0;height:0;opacity:0;} .file-add .ic {margin:0 0.75rem 0 0;font-size:1.75rem;color: var(--dark-wintergreen-100);} .file-add .value {font-size: 1rem;line-height:140%;letter-spacing: -0.01rem;} .file-add:hover .value {color: var(--Moon-Grey_Body-text);} .file-add.selected .value {color: var(--Moon-Black_Titles);} .contacts-section .section-top {margin:0 0 2.5rem 0;} .contacts-section .section-top h3 {margin:0;} .contacts-section .contacts-slider { margin:0 -10rem 0 0; border-radius:1.5rem 0 0 1.5rem; overflow:hidden; -webkit-border-radius:1.5rem 0 0 1.5rem; -moz-border-radius:1.5rem 0 0 1.5rem; -ms-border-radius:1.5rem 0 0 1.5rem; -o-border-radius:1.5rem 0 0 1.5rem; } .contacts-section .contacts-slider .item { width: 23.875rem; height:100%; display:flex; flex-direction:column; margin:0 1.5rem 0 0; padding:1.5rem 1.25rem; background: var(--Total-White); border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } /* шапка и фото в отдельной колонке: у фото min-height, шапка тянется на остаток — так фото не зависит от того, сколько строк в должности */ .contacts-section .contacts-slider .item-top {display:flex;flex-direction:column;flex:1 1 auto;} .contacts-section .contacts-slider .item-head {height:100%;margin:0 0 1.25rem 0;} .contacts-section .contacts-slider .item-name {margin:0 0 0.5rem 0;color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.5rem;font-weight: 700;line-height: 100%;letter-spacing: -0.015rem;} .contacts-section .contacts-slider .item-post {color: var(--Moon-Grey_Body-text);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem;} .contacts-section .contacts-slider .item-photo { min-height: 19.25rem; margin:0 0 1.25rem 0; overflow:hidden; border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; } /* резерв под две контактные строки: 24 + 12 зазор + 24. Без него карточка без почты даёт .item-top на 36px выше, шапка забирает остаток и фото уезжает вниз */ .contacts-section .contacts-slider .item-contacts {min-height:3.75rem;} .contacts-section .contacts-slider .item-contacts .row-link {margin:0 0 0.75rem 0;color: var(--Moon-Black_Titles);font-size: 1.25rem;line-height: 100%;letter-spacing: -0.0125rem;text-decoration:none;} .contacts-section .contacts-slider .item-contacts .row-link:last-child {margin:0;} .contacts-section .contacts-slider .item-contacts .row-link .ic {margin:0 0.75rem 0 0;font-size:1.5rem;color: var(--Eco-Green_100);} .contacts-section .contacts-slider .item-contacts .row-link:hover {color: var(--Eco-Green_100);} .contacts-hero {margin:0 0 3.75rem 0;} .contacts-hero h1 {text-align: left;margin:0;} .contacts-hero .contacts-list {max-width:58rem;} .contacts-hero .contacts-list .items:first-child {width:23.875rem;min-width:23.875rem;margin:0 1.5rem 0 0;} .contacts-hero .contacts-list .items {width:100%;} .contacts-hero .contacts-list .item {margin:0 0 2rem 0;break-inside: avoid;} .contacts-hero .contacts-list .item:last-child {margin:0;} .contacts-hero .contacts-list .item .ic {min-width: 3rem;width: 3rem;height: 3rem; margin:0 1.25rem 0 0; font-size:2rem;color:var(--Total-White); display:flex; align-items:center; justify-content: center; border-radius: 0.75rem; background: var(--eco-green-100); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .contacts-hero .contacts-list .item .data {margin:0 0 0.5rem 0;color: var(--Moon-Black_Titles);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem;} .contacts-hero .contacts-list .item .value {font-weight: 700;line-height: 120%;} .contacts-hero .contacts-list .item a.value {display:block;text-decoration: none;font-size: 1.75rem;line-height: 100%;letter-spacing: -0.0175rem;} .contacts-map {margin:0 0 3.75rem 0;} .contacts-map .map-info {width:23.75rem;} .contacts-map .map-info .info-netwworks { padding:1.5rem 2rem; border-radius: 0.75rem; background: var(--Total-White); -webkit-border-radius: 0.75rem; -moz-border-radius: 0.75rem; -ms-border-radius: 0.75rem; -o-border-radius: 0.75rem; } .contacts-map .map-info .info-netwworks .network {display:none;} .contacts-map .map-info .info-netwworks .network.active {display:block;} .contacts-map .map-info .info-netwworks .region {margin:0 0 1rem 0;border-bottom:0.0625rem solid var(--dark-wintergreen-40); padding:0 0 1rem 0;color: var(--eco-green-100);font-family: "Exo 2";font-size: 1.5rem;font-weight: 700;line-height: 100%;letter-spacing: -0.015rem;text-transform: uppercase;} .contacts-map .map-info .info-netwworks .item {margin:0 0 1rem 0;padding:0 0 1rem 0;border-bottom:0.0625rem solid var(--dark-wintergreen-40);} .contacts-map .map-info .info-netwworks .item:last-child {border:0;padding:0;margin:0;} .contacts-map .map-info .info-netwworks .item .name {color: var(--Moon-Black_Titles);font-family: "Exo 2";font-size: 1.5rem;font-weight: 700;line-height: 100%;letter-spacing: -0.015rem;} .contacts-map .map-info .info-netwworks .item .anons {color:var(--Moon-Grey_Body-text);font-size: 1rem;line-height: 100%;letter-spacing: -0.01rem;} .contacts-map .map-info .info-netwworks .item .link .ic {margin:0 0.75rem 0 0;font-size:1.25rem; color:var(--dark-wintergreen-100);} .contacts-map .map-info .info-netwworks .item .link a {text-decoration:none;color: var(--Moon-Black_Titles);font-size: 1.25rem;font-weight: 700;line-height: 100%;letter-spacing: -0.0125rem;} .contacts-map .map-region { cursor:pointer; transition:0.5s ; -webkit-transition:0.5s ; -moz-transition:0.5s ; -ms-transition:0.5s ; -o-transition:0.5s ; } .contacts-map .map-region:not(.disabled):hover {fill:var(--Eco-Green_40)!important;} .contacts-map .map-region.active {fill:var(--eco-green-100)!important; stroke: var(--Total-White)!important;} .contacts-map .map-region.active:hover {fill:var(--eco-green-100)!important; stroke: var(--Total-White)!important;} .contacts-map .map-container path:not(.map-region).active {fill:var(--Total-White)!important;} .contacts-socials {margin:0 0 7rem 0;} .contacts-socials .socials-container {padding:5rem 6.5rem; background:url('../../images/bg7.webp') no-repeat center;background-size:cover; border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; } .contacts-socials .socials-container h3 {width:37.5rem;color: var(--Total-White); margin:0 6.75rem 0 0;} .contacts-section .contacts-slider.no-slider {margin:0;} .contacts-section .contacts-slider.no-slider .catalog-bnner {width:100%;height:auto;margin:0;} .contacts-section .contacts-slider.no-slider .item {min-width: 23.875rem;height:auto} .contacts-section .contacts-slider.no-slider .catalog-bnner .banner-info { top: 50%; left: 5rem; width: 21.75rem; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; } .catalog-bnner .banner-title { font-size: 2rem; line-height: 100%;} .error-section {position:relative;overflow:hidden;padding:12.25rem 0 11.3125rem 0;} .error-section h3 {max-width:49.25rem;margin:0 auto 2rem auto;text-align:center;} .error-section .error-numbers {position:relative;margin:6rem 0 0 0;} .error-section .numbers-bg { position:absolute; z-index:1; top:-6.6875rem; left:50%; width:94.375rem; max-width:none; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); } .error-section .numbers-item {position:relative;z-index:2;width:20.5rem;margin:0 0 0.375rem 0;} /* цифра «0» — маска, внутри неё крутится гифка */ .error-section .numbers-zero {position:relative;z-index:2;width:20rem;height:26.9375rem;margin:0 2.5625rem; -webkit-mask-image: url('../../images/404mask.svg'); mask-image: url('../../images/404mask.svg'); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; } /* поле снизу перекрывает низ цифр — так в макете */ .error-section .error-bottom {position:absolute;z-index:3;left:0;right:0;bottom:0;height:14.8125rem;} .no-footer .footer {display:none;} .catalog-section .catalog-empty {padding:3rem 0;text-align:center;color:var(--Moon-Grey_Body-text);} /* поки йде запит — список притухає, але не смикається */ .catalog-section .catalog-list.loading [data-catalog-items] { opacity:0.4; transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .catalog-section .catalog-list [data-catalog-items] { transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -webkit-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -moz-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -ms-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); -o-transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1); } .codedropz-upload-handler,.dnd-upload-status {display:none!important;} /*--------------------------------- Перехід між сторінками -----------------------------------*/ .page-transition {position:fixed;left:0;top:0;width:100%;height:100%;z-index:9999;display:flex;align-items:center;justify-content:center;pointer-events:none;visibility:hidden;overflow:hidden;} /* панель вища за екран: із заокругленням кути інакше оголюють краї */ .page-transition .transition-bg {position:absolute;left:0;top:0;width:100%;height:110%;background: var(--Total-White);} .page-transition .transition-logo {position:relative;opacity:0;} .page-transition .transition-logo img {width:20rem;} /* перший кадр нової сторінки: панель уже закриває екран, далі нею керує скрипт */ html.page-loading .page-transition {visibility:visible;} html.page-loading .transition-bg {top:0;height:100%;} html.page-loading .transition-logo {opacity:1;} .preloader {display:none;align-items:center; justify-content: center; position:fixed;top:0;left:0;left:0;width:100vw;height:100vh;z-index:2000;background: var(--Total-White);} .first .preloader {display:flex;} .preloader .lottie {width:20rem;}