@font-face {
font-family: 'Gilroy';
src: url('../fonts/Gilroy-Light.woff2') format('woff2'),
url('../fonts/Gilroy-Light.woff') format('woff');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Gilroy';
src: url('../fonts/Gilroy-ExtraBold.woff2') format('woff2'),
url('../fonts/Gilroy-ExtraBold.woff') format('woff');
font-weight: bold;
font-style: normal;
font-display: swap;
}
html {
font-family: 'Gilroy', sans-serif;
box-sizing: border-box;
scroll-padding-top: 84px;
}
/*html {*/
/* scroll-behavior: smooth !important;*/
/*}*/
/*html {*/
/* overflow-y: scroll;*/
/* scroll-snap-type: y mandatory;*/
/*}*/
/*.node--type-landing > .paragraph {*/
/* scroll-snap-align: start;*/
/*}*/
*, *::before, *::after {
box-sizing: border-box;
}
body {
margin: 0;
font: 13px / 1.2 'Gilroy', sans-serif;
}
.clearfix:after,
.clearfix:before {
display: none;
}
/*html, body {*/
/*display: flex;*/
/* flex-direction: column;*/
/* height: 100%;*/
/*width: 100%;*/
/*}*/
/*.dialog-off-canvas-main-canvas {*/
/* display: flex;*/
/* flex-direction: column;*/
/* height: 100%;*/
/*}*/
h1,h2,h3,h4,h5,h6,.site-name a {
font-family: 'Oswald',sans-serif;
overflow-wrap: anywhere;
word-wrap: break-word;
font-weight: bold;
margin: 1rem 0;
}
h2 {
font-size: 1.5em;
}
h3 {
font-size: 1.17em;
}
a {
color: #3b5998;
text-decoration: underline;
}
a:hover {
color: #3B59F2;
}
img {
display: block;
max-width: 100%;
height: auto;
}
[class*="body"] p {
margin: 1rem 0;
}
[class*="body"] p:first-child {
margin-top: 0;
}
:root {
--breakpoint-1720px: 1710px; /* Переменная для точки перелома */
--container-1720px: 1720px; /* Переменная для максимальной ширины контента */
--container-1420px: 1420px;
--container-1240px: 1300px;
--outer-0-959: 16px;
--outer-960-1440: 29px;
--outer-1440-1900: 71px;
--section-border-bottom: 25px;
}
.region-header {
height: 90px;
display: flex;
/*justify-content: space-between;*/
align-items: center;
padding: 28px var(--outer-0-959) 0;
position: sticky;
top: 0;
background: white;
z-index: 2;
}
.region-header #block-logo {
order: 1;
}
.region-header #block-search {
order: 2;
margin-left: auto;
margin-right: 15px;
}
.region-header #block-main-menu {
order: 3;
}
.region-header > span {
display: none;
}
#block-logo img {
width: 130px;
}
.region-header .menu-btn {
display: none;
}
.region-header .menu-icon {
display: block;
background: url('../svg/burger.svg') center no-repeat;
background-size: cover;
width: 64px;
height: 64px;
cursor: pointer;
}
.region-header .menu-btn:checked ~ .menu-icon {
background: url('../svg/burger-close.svg') center no-repeat;
}
#block-main-menu .menu {
display: none;
}
#block-main-menu .menu-btn:checked ~ .menu {
display: flex;
width: 284px;
position: absolute;
right: -17px;
top: 100%;
padding: 50px 0;
background: white;
z-index: 1;
border: 1px solid lightgrey;
flex-direction: column;
align-items: center;
gap: 5px;
padding: 46px 0;
}
#block-main-menu .menu li.menu-item--expanded {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
gap: 0 15px;
}
#block-main-menu .menu li .fa-angle-down {
display: block;
width: 15px;
height: 15px;
background: url('data:image/svg+xml,') no-repeat center;
}
/*#block-main-menu .menu li:first-child a {-webkit-text-stroke: 0.5px rgb(5, 104, 57);}*/
#block-main-menu .menu li a {
display: flex;
height: 50px;
justify-content: center;
align-items: center;
color: rgb(50, 50, 50);
font-family: Gilroy;
font-size: 18px;
font-weight: 400;
line-height: 102%;
text-decoration: none;
white-space: nowrap;
/*transition: text-shadow .3s;*/
}
#block-main-menu .menu li a:hover,
#block-main-menu .menu li a:focus {
/*text-shadow: 0 0 .65px #333, 0 0 .65px #333;*/
/*-webkit-text-stroke: 1px black;*/
color: rgb(5, 104, 57);
}
#block-main-menu .menu li ul {
display: block;
max-height: 0;
width: 100%;
overflow: hidden;
transition: max-height 1s, padding-top 1s;
}
#block-main-menu .menu li.active ul {
width: 100%;
max-height: 500px;
}
#block-main-menu .menu li li {
padding: 0 2rem;
}
#block-main-menu .menu li li a {
font-size: 16px;
height: auto;
padding: 5px 0;
white-space: normal;
}
#block-search {
display: flex;
align-items: center;
position: relative;
}
#block-search .search-icon {
background: url(../icons/icon-search.svg) no-repeat center;
width: 38px;
height: 29px;
background-size: contain;
cursor: pointer;
}
#block-search.active .search-icon {
background: url(../icons/icon-search-close.svg) no-repeat center;
background-size: cover;
}
#block-search form {
position: absolute;
width: calc(100vw - 32px);
/*left: calc(-100vw + 123px);*/
top: 100%;
right: -79px;
padding: 0;
margin-top: 30px;
overflow: hidden;
background: white;
transition: height .3s, padding .3s;
height: 0;
}
#block-search.active form {
border-top: 1px solid lightgray;
border-bottom: 1px solid lightgray;
padding: 20px;
height: 82px;
}
#block-search .form-text {
padding-left: 25px;
padding-top: 8px;
padding-bottom: 8px;
height: 40px;
border: none;
border-bottom: 1px solid rgb(30, 30, 30);
/*border-radius: 100px;*/
border-radius: 0;
width: 100%;
background: white;
}
#block-search .form-submit {
display: none;
}
#block-lang,
#block-header-social {
display: none;
}
/*.node--type-landing {*/
/* height: 100vh;*/
/* overflow-y: scroll;*/
/* scroll-snap-type: y mandatory;*/
/* scroll-behavior: smooth;*/
/* transition: transform 0.5s ease-in-out;*/
/*}*/
/*.node--type-landing > .paragraph {*/
/* scroll-snap-align: start;*/
/*}*/
@media (min-width: 960px) {
.region-header {
border-bottom: 3px solid #056839;
padding: 22px var(--outer-960-1440) 0 var(--outer-960-1440);
}
.region-header #block-logo,
.region-header #block-search,
.region-header #block-main-menu {
order: inherit;
}
#block-logo img {
width: 167px;
}
.region-header .menu-icon {
display: none;
}
#block-main-menu {
margin: 0 27px 0 auto;
}
#block-main-menu > .menu {
display: flex;
gap: 17px;
}
#block-main-menu > .menu > li {
display: flex;
align-items: center;
gap: 15px;
cursor: pointer;
position: relative;
}
#block-main-menu .menu li a {
font-size: 12px;
}
#block-lang,
#block-header-social {
display: block;
}
#block-main-menu .menu li ul {
display: flex;
width: 330px;
left: -25px;
position: absolute;
background: white;
flex-direction: column;
z-index: 1;
gap: 0;
top: 100%;
padding-top: 0;
}
#block-main-menu .menu li.active ul {
padding-top: 9px;
width: 330px;
}
#block-main-menu .menu li li {
padding: 0;
}
#block-main-menu .menu li.active ul li:first-child {
border-top: 1px solid rgb(5, 104, 57);
}
#block-main-menu .menu li ul a {
padding: 15px 20px;
justify-content: flex-start;
height: auto;
font-size: 18px;
}
#block-main-menu .menu li.active ul a:hover {
background: rgba(5, 104, 57, 0.2);
}
#block-main-menu .menu li .fa-angle-down {}
#block-search form {
position: absolute;
left: 0;
top: -7px;
right: 50px;
overflow: hidden;
transition: left .3s;
height: auto;
width: auto;
margin-top: 0;
}
#block-search.active form {
border: none;
padding: 0;
margin: 0;
height: auto;
left: -850px;
}
#block-lang .links {
display: flex;
gap: 5px;
}
#block-lang .links a {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 14px;
font-weight: 500;
line-height: 102%;
text-decoration: none;
text-transform: capitalize;
}
#block-lang .links a.is-active {
text-decoration: underline;
}
#block-lang .links li:first-child:after {
content: "/";
margin-left: 5px;
}
#block-header-social {
margin-left: 39px;
}
.block-content--type-social {
display: flex;
gap: 10px;
}
.block-content--type-social a[href*='t.me'] {
background: url(../icons/icon-tg.svg) no-repeat center;
}
.block-content--type-social a[href*='instagram.com'] {
background: url(../icons/icon-inst.svg) no-repeat center;
}
.block-content--type-social a[href*='facebook.com'] {
background: url(../icons/icon-fb.svg) no-repeat center;
}
.block-content--type-social a[href*='prom.ua'] {
background: url(../svg/prom.svg) no-repeat center;
}
.block-content--type-social a[href*='linkedin.com'] {
background: url(../svg/linkedin.svg) no-repeat center;
}
.block-content--type-social a[href*='youtube.com'] {
background: url(../svg/youtube-round.svg) no-repeat center;
}
.block-content--type-social a {
display: block;
width: 24px;
height: 24px;
font-size: 0;
background-size: cover !important;
}
}
@media (min-width: 1008px) {
.region-header {
padding: 13px var(--outer-960-1440) 0 var(--outer-960-1440);
height: 84px;
}
}
@media (min-width: 1360px) {
.region-header {
padding-left: var(--outer-1440-1900);
padding-right: var(--outer-1440-1900);
}
#block-main-menu .menu li a,
#block-lang .links a {
font-size: 18px;
}
}
@media (min-width: 1300px) {
.region-header {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
}
#block-main-menu {
margin: 0 32px 0 auto;
}
#block-main-menu > .menu {
gap: 40px;
}
/*#block-main-menu > .menu >li:last-child {*/
/* margin-left: 99px;*/
/*}*/
#block-header-social {
/*order: 3;*/
gap: 16px;
/*margin-left: 0;*/
}
#block-lang {
/*order: 4;*/
/*margin-left: 31px;*/
}
#block-lang .links {
gap: 6px;
}
/*#block-lang .links li:first-child:after {*/
/* font-size: 20px;*/
/* margin-left: 4px;*/
/*}*/
/*#block-main-menu .menu > li > a,*/
/*#block-lang .links a {*/
/* font-size: 20px;*/
/*}*/
}
footer#footer {
background: #1E1E1E;
}
.region-footer {
display: flex;
flex-wrap: wrap;
padding: 28px var(--outer-0-959);
gap: 49px 0px;
justify-content: space-between;
}
.region-footer nav {
width: 45%;
}
.region-footer nav .menu {
display: flex;
flex-direction: column;
gap: 6px;
}
.region-footer nav .menu-title {
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 20px;
font-weight: 600;
line-height: 100%;
margin-bottom: 14px;
}
.region-footer nav .menu li {}
.region-footer nav .menu li a {
color: rgba(255, 255, 255, 0.9);
font-family: Gilroy;
font-size: 16px;
font-weight: 250;
line-height: 100%;
text-decoration: none;
transition: color .3s;
}
.region-footer nav .menu li a:hover {
/*color: rgba(255, 255, 255, 1);*/
font-weight: 700;
}
.region-footer-webform {
padding: 0 var(--outer-0-959);
margin-bottom: 17px;
}
#block-footer-webform {
height: 196px;
box-sizing: border-box;
border: 0.5px solid rgb(255, 255, 255);
border-radius: 10px;
max-width: 408px;
width: 100%;
margin: 0 auto;
}
#block-footer-webform .block-content {
display: flex;
flex-direction: column;
align-items: flex-end;
padding: 6px 23px 19px;
height: 100%;
}
#block-footer-webform .field--name-body {
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 24px;
font-weight: 700;
line-height: 115%;
text-align: right;
max-width: 240px;
}
#block-footer-webform .field--name-dynamic-twig-fieldblock-content-ds-footer-button {
margin-top: auto;
}
#block-footer-webform .field--name-dynamic-twig-fieldblock-content-ds-footer-button button {
width: 165px;
height: 45px;
border-radius: 5px;
border: none;
background: rgb(3, 84, 46);
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 24px;
font-weight: 400;
line-height: 102%;
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
}
#block-footer-webform .field--name-dynamic-twig-fieldblock-content-ds-footer-button button:hover,
#block-footer-webform .field--name-dynamic-twig-fieldblock-content-ds-footer-button button:focus {
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
background: rgb(5, 104, 57);
}
#block-footer-webform .field--name-dynamic-twig-fieldblock-content-ds-footer-button button:before {
content: "";
width: 24px;
height: 24px;
display: block;
background: url(../icons/icon-footer-phone.webp) no-repeat center;
}
#block-copyright {
border-top: 0.2px solid rgb(255, 255, 255);
padding: 0 var(--outer-0-959);
height: 93px;
}
#block-copyright .field-name-body {
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 12px;
font-weight: 300;
line-height: 100%;
padding: 21px 28px 0;
background: url(../img/footer-logo.webp) no-repeat center right;
height: 100%;
}
#block-copyright .field-name-body p {
display: flex;
align-items: center;
}
#block-copyright .field-name-body strong {
font-size: 23px;
font-weight: normal;
position: relative;
/*top: 4px;*/
margin-right: 9px;
}
@media (min-width: 960px) {
.region-footer,
.region-footer-webform,
#block-copyright {
padding: 28px var(--outer-960-1440);
}
footer#footer {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 0 var(--outer-960-1440);
}
.region-footer {
padding: 28px 0 ;
}
.region-footer-webform {
padding: 28px 0;
margin-bottom: 0;
}
#block-footer-webform {
height: 100%;
}
.region-footer-copyright {
width: 100%;
}
#block-copyright {
height: 85px;
padding: 23px 0;
}
#block-copyright .field-name-body {
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 20px;
font-weight: 300;
line-height: 100%;
letter-spacing: 0%;
text-align: left;
padding: 0;
}
#block-copyright .field-name-body strong {
/*top: 3px;*/
margin-right: 2px;
}
}
@media (min-width: 1360px) {
footer#footer {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
}
.region-footer {
justify-content: flex-start;
gap: 0;
flex: 1;
padding: 53px 0;
}
.region-footer nav {
width: 193px;
}
.region-footer-webform {
padding: 30px 0 0;
}
#block-footer-webform {
width: 363px;
height: 339px;
}
#block-footer-webform .block-content {
padding: 14px 17px 24px;
}
#block-footer-webform .field--name-dynamic-twig-fieldblock-content-ds-footer-button button {
width: 189px;
height: 55px;
gap: 46px;
}
#block-copyright {
margin-top: 28px;
height: 102px;
padding: 23px 0;
}
#block-copyright .field-name-body strong {
/*top: 10px;*/
margin-right: 10px;
font-size: 33px;
}
}
/*@media (min-width: 1460px) {*/
/* footer#footer {*/
/* margin: 0 auto;*/
/* max-width: var(--container-1420px);*/
/* border-radius: 5px;*/
/* }*/
/*}*/
.paragraph--type-main-banner {
position: relative;
height: calc(100vh - 90px);
height: calc(100svh - 90px);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.paragraph--type-main-banner video {
width: 100%;
height: 100%;
object-fit: cover;
z-index: -1;
position: absolute;
left: 0;
top: 0;
}
.banner-wrapper {
max-width: var(--container-1240px);
margin: 0 auto;
height: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 0 var(--outer-0-959) 50px;
align-content: flex-end;
align-items: flex-end;
}
.banner-title {
max-width: 300px;
color: #ffffff;
font-family: Gilroy;
font-size: 32px;
font-weight: 900;
line-height: 102%;
overflow-wrap: anywhere;
}
.banner-sound {
margin-right: calc(100% - 25px);
margin-bottom: 1rem;
width: 25px;
height: 25px;
border: none;
background: url('../icons/icon-sound-no.webp') center no-repeat;
background-size: 25px;
}
.banner-sound.sound-on {
background: url('../icons/icon-sound.webp') center no-repeat;
background-size: 25px;
}
.banner_button {
display: block;
width: 65px;
height: 65px;
cursor: pointer;
background: url(../img/banner-feedback.webp) no-repeat center;
background-size: cover;
border: none;
}
@media (min-width: 960px) {
.banner-wrapper {
padding: 0 var(--outer-960-1440) 50px;
}
.banner-title {
max-width: 760px;
font-size: 80px;
}
.banner_button {
width: 80px;
height: 80px;
}
.banner-sound {
margin-right: calc(100% - 40px);
margin-bottom: 2rem;
width: 40px;
height: 40px;
background-size: 40px;
}
.banner-sound.sound-on {
background-size: 40px;
}
}
@media (min-width: 1360px) {
.banner-wrapper {
padding: 0 var(--outer-1440-1900) 50px;
}
}
@media (min-width: 1440px) {
.banner-wrapper {
position: relative;
padding-left: 0;
padding-right: 0;
margin: 0 auto;
/*background: url(../img/banner-logo.webp) no-repeat calc(100% - var(--outer-1440-1900)) 44px;*/
}
.banner-title {
width: 915px;
font-size: 80px;
}
}
/*@media (min-width: 1580px) {*/
/* .paragraph--type-main-banner .wrapper {*/
/* max-width: var(--container-1720px);*/
/* }*/
/*}*/
/*@media (min-width: 1760px) {*/
/* .paragraph--type-main-banner .wrapper {*/
/* padding: 0 0 50px;*/
/* background: url(../img/banner-logo.webp) no-repeat 100% 44px;*/
/* }*/
/* footer#footer {*/
/* margin: 0 auto;*/
/* max-width: var(--container-1720px);*/
/* border-radius: 5px;*/
/* }*/
/*}*/
/*paragraph--type-about*/
.paragraph-type-about {
background: #EEF1F3;
position: relative;
border-bottom: 21px solid #056839;
}
.about-item-head {
padding: 63px 0 0;
}
.about-item-head .field--name-field-section-title {
color: #000;
font-family: Gilroy;
font-size: 32px;
font-weight: 400;
line-height: 100%;
text-align: center;
margin: 0 0 22px;
}
.about-item-head .field--name-field-description {
font-family: Gilroy;
font-size: 20px;
font-weight: 600;
text-align: center;
/*padding: 0 50px;*/
max-width: 340px;
width: 100%;
margin: 0 auto 25px;
}
.about-item-top {
background: white;
padding: 15px var(--outer-0-959) 13px;
}
#about-slider, #about-thumbs {
overflow: hidden;
}
#about-thumbs .swiper-slide {
width: 130px;
}
.about-item-top .paragraph--type-about-item {
display: flex;
flex-direction: column;
gap: 11px;
background: white;
}
/*.about-item-top .paragraph:not(:first-child) {*/
/*display: none;*/
/*}*/
.about-item-top .group-left img {
width: 100%;
aspect-ratio: 845 / 500;
object-fit: cover;
border-radius: 10px;
}
.about-item-top .group-right {
min-height: 339px;
border-radius: 10px;
background: rgb(5, 104, 57);
padding: 28px 20px;
color: #fff;
}
.about-item-top .group-right p:not(:last-child) {
margin-bottom: 26px;
}
.about-item-top .group-right .field--name-field-title {
font-family: Gilroy;
font-size: 20px;
font-weight: 800;
line-height: 102%;
text-align: center;
margin-bottom: 27px;
text-transform: uppercase;
}
.about-item-top .group-right .field--name-field-description {
font-family: Gilroy;
font-size: 14px;
font-weight: 500;
text-align: center;
}
.about-item-bottom {
/*display: flex;*/
/*overflow: auto;*/
padding: 0 14px 10px;
/*gap: 26px;*/
}
.about-item-bottom .paragraph {
display: flex;
flex-direction: column;
/*width: 130px;*/
padding-top: 20px;
cursor: pointer;
margin-right: 5px;
}
.about-item-bottom .paragraph:last-child {
margin-right: 0;
}
.about-item-bottom .field--name-field-icon,
.about-item-bottom .field--name-field-icon-hover {
height: 80px;
margin-bottom: 5px;
position: relative;
}
.about-item-bottom .field--name-field-icon img,
.about-item-bottom .field--name-field-icon-hover img {
/*height: 100%;*/
height: 70px;
width: auto;
margin: 0 auto;
}
.about-item-bottom .field--name-field-icon-hover img {
transition: transform .2s;
}
.about-item-bottom .field--name-field-icon-hover:hover img {
transform: scale(1.2);
}
.about-item-bottom .field--name-field-title {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 16px;
/*font-weight: 700;*/
line-height: 102%;
text-align: center;
width: 120px;
}
.about-item-bottom .field--name-field-icon {}
.about-item-bottom .field--name-field-icon-hover {
display:
none;
}
.about-item-bottom .swiper-slide-thumb-active .field--name-field-icon,
.about-item-bottom .paragraph:hover .field--name-field-icon {
display: none;;
}
.about-item-bottom .swiper-slide-thumb-active .field--name-field-icon-hover,
.about-item-bottom .paragraph:hover .field--name-field-icon-hover {
display: block;
}
.about-item-bottom .swiper-slide-thumb-active .field--name-field-title,
.about-item-bottom .paragraph:hover .field--name-field-title {
color: #056839;
}
@media (min-width: 960px) {
.paragraph-type-about {
position: relative;
border-bottom: 25px solid #056839;
}
.about-item-head {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 68px var(--outer-960-1440) 12px;
height: 250px;
}
.about-item-head .field--name-field-section-title {
font-size: 40px;
margin: 0 0 0 30px;
text-align: left;
}
.about-item-head .field--name-field-description {
font-size: 34px;
max-width: 546px;
padding: 0;
text-align: right;
margin: 0;
position: relative;
/*right: 10px;*/
}
.about-item-top {
padding: 24px var(--outer-960-1440) 50px;
}
.about-item-top .paragraph--type-about-item {
flex-direction: row;
}
.about-item-top .group-left {
width: auto;
height: 500px;
flex: 1;
}
.about-item-top .group-right {
width: 443px;
height: 500px;
flex: 0 0 443px;
padding: 39px 55px 0 27px;
}
.about-item-top .group-right {
order: 1;
}
.about-item-top .group-left {
order: 2;
}
.about-item-top .group-left .field--name-field-cover {
height: 100%;
position: relative;
}
.about-item-top .group-left .field--name-field-cover img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 10px;
}
.about-item-top .group-right .field--name-field-title {
font-size: 40px;
text-align: left;
margin-bottom: 14px;
}
.about-item-top .group-right .field--name-field-description {
font-size: 16px;
text-align: left;
}
.about-item-bottom {
padding: 0 14px 25px;
}
.about-item-bottom #about-thumbs .swiper-slide {
width: 230px;
height: 220px;
}
.about-item-bottom .field--name-field-icon,
.about-item-bottom .field--name-field-icon-hover {
height: 100px;
margin-bottom: 24px;
}
.about-item-bottom .field--name-field-icon img,
.about-item-bottom .field--name-field-icon-hover img {
height: 100px;
}
.about-item-bottom .field--name-field-title {
font-size: 24px;
width: 230px;
}
}
@media (min-width: 1360px) {
.paragraph-type-about .layout__region--content .block {
padding-left: var(--outer-1440-1900);
padding-right: var(--outer-1440-1900);
}
}
@media (min-width: 1440px) {
.paragraph-type-about .layout__region--content .block {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
}
.paragraph-type-about .about-item-head {
/*height: 400px;*/
}
.paragraph-type-about .about-item-top {
padding-top: 26px;
padding-bottom: 50px;
height: 576px;
}
.paragraph-type-about .about-item-bottom {
padding-top: 0;
padding-bottom: 26px;
}
.about-item-head .field--name-field-section-title {
/*margin: auto 0 0 36px;*/
}
.about-item-top .paragraph--type-about-item {
padding: 0;
height: 500px;
}
}
/*@media (min-width: 1760px) {*/
/* .paragraph-type-about .layout__region--content .block {*/
/* padding-left: calc((100% - var(--container-1720px)) / 2);*/
/* padding-right: calc((100% - var(--container-1720px)) / 2);*/
/* }*/
/* .paragraph-type-about .about-item-bottom {*/
/* display: flex;*/
/* justify-content: space-between;*/
/* }*/
/*}*/
.about-item-top .field--name-field-item {
position: relative;
}
.about-item-top .paragraph:not(:first-child) {}
/* Блок по умолчанию */
/*.about-item-top .paragraph--type-about-item {*/
/* opacity: 0;*/
/* position: absolute;*/
/* top: 0;*/
/* left: 0;*/
/* width: 100%;*/
/* transition: opacity 0.5s ease, z-index 0s 0.5s;*/
/* z-index: 1;*/
/* background: white;*/
/* visibility: hidden;*/
/*}*/
/*.about-item-top.active .paragraph--type-about-item:first-child {*/
/* transition: opacity 0.5s ease, z-index 0s 0.5s;*/
/* z-index: 1;*/
/* background: white;*/
/* visibility: hidden;*/
/*}*/
/* Первый элемент всегда видим */
/*.about-item-top .paragraph--type-about-item:first-child {*/
/* position: static;*/
/* opacity: 1;*/
/* z-index: 2;*/
/* visibility: visible;*/
/*}*/
/* Активний блок (відповідний кліку) */
/*.about-item-top .paragraph--type-about-item.open,*/
/*.about-item-top.active .paragraph--type-about-item.open:first-child {*/
/* visibility: visible;*/
/* opacity: 1;*/
/* z-index: 3;*/
/* transition: opacity 3.5s ease, z-index 0s;*/
/*}*/
/*paragraph--type-industries*/
.paragraph--type-industries {
padding: 0;
overflow: hidden;
background-color: #EDF0F2;
border-bottom: 25px solid #056839;
}
.paragraph--type-industries .group-head {
margin: 21px 0 0;
}
.paragraph--type-industries .field-name-field-head-img {}
.paragraph--type-industries .field--name-field-title {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 32px;
font-weight: 400;
text-align: center;
max-width: 310px;
margin: 0 auto 29px;
}
.paragraph--type-industries .field--name-field-description {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 20px;
font-weight: 700;
text-align: center;
/*padding: 0 50px;*/
min-height: 236px;
max-width: 340px;
width: 100%;
margin: 0 auto;
background: url('../img/industries-img-1.webp') no-repeat 50% calc(100% - 10px);
background-size: 170px;
}
.paragraph--type-industries .field--name-field-description:after {
content: "";
display: block;
}
.paragraph--type-industries .industries-sectors {
/*display: flex;*/
/*gap: 12px;*/
/*overflow: auto;*/
background: white;
padding: 19px 19px;
}
.node--type-sector.node--view-mode-teaser {
position: relative;
width: 310px;
/*flex: 1 1 500px;*/
box-sizing: content-box;
display: inline-block;
margin-right: 12px;
}
.node--type-sector.node--view-mode-teaser:last-child {
margin-right: 0;
}
/*.node--type-sector.node--view-mode-teaser:not(.ssssssssssssss) {*/
/* filter: grayscale(1);*/
/*}*/
.node--type-sector.node--view-mode-teaser .field--name-node-title {
top: 22px;
left: 20px;
right: 20px;
position: absolute;
z-index: 1;
}
.node--type-sector.node--view-mode-teaser .field--name-node-title a {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 20px;
font-weight: 700;
line-height: 102%;
text-transform: uppercase;
text-decoration: none;
}
.node--type-sector.node--view-mode-teaser .field--name-field-image-teaser img {
width: 310px;
height: 310px;
border-radius: 10px;
}
.paragraph--type-industries .group-bottom {
/*height: 300px;*/
background-color: white;
padding: 25px var(--outer-960-1440);
display: flex;
justify-content: space-between;
}
.paragraph--type-industries .field--name-field-description2 {
font-family: Gilroy;
font-size: 20px;
font-weight: 600;
text-align: center;
max-width: 340px;
width: 100%;
margin: 0 auto;
}
@media (min-width: 960px) {
.paragraph--type-industries {
border-bottom: 25px solid #056839;
}
.paragraph--type-industries .group-head {
background: url('../img/industries-img-1.webp') no-repeat calc(100% - var(--outer-960-1440)) center;
background-size: 400px auto;
padding: 93px var(--outer-960-1440) 0;
margin-top: 0;
}
.paragraph--type-industries .field--name-field-title {
font-size: 40px;
text-align: left;
max-width: 500px;
margin: 0 0 29px;
}
.paragraph--type-industries .field--name-field-description {
font-size: 28px;
background: none;
text-align: left;
padding: 0;
margin: 0;
max-width: 470px;
line-height: 103%;
min-height: 222px;
}
.paragraph--type-industries .field--name-field-sectors {
padding: 26px 0 100px;
}
.node--type-sector.node--view-mode-teaser {
min-width: 427px;
margin-right: 10px;
}
.node--type-sector.node--view-mode-teaser .field--name-node-title {
top: 31px;
left: 27px;
right: 100px;
}
.node--type-sector.node--view-mode-teaser .field--name-node-title a {
font-size: 28px;
}
.node--type-sector.node--view-mode-teaser .field--name-field-image-teaser img {
width: 427px;
height: 427px;
}
.flickity-button {}
.flickity-button:focus {
box-shadow: inherit;
}
.flickity-prev-next-button {
width: 36px;
height: 36px;
top: calc(100% - 67px);
transform: inherit;
box-sizing: border-box;
border: 1px solid rgba(5, 104, 57, 0.87);
border-radius: 5px;
}
.flickity-prev-next-button.previous {
left: calc(50% - 41px);
}
.flickity-prev-next-button.next {
right: calc(50% - 41px);
}
.paragraph--type-industries .group-bottom:before {
content:"";
width: 139px;
height: 135px;
display: block;
background: url(../img/logo-green.webp) no-repeat center;
}
.paragraph--type-industries .field--name-field-description2 {
font-size: 34px;
max-width: 546px;
padding: 0;
text-align: right;
margin: 0;
position: relative;
}
}
@media (min-width: 1276px) {
.paragraph--type-industries .field--name-field-sectors {
padding: 25px calc((100% - 1400px) / 2) 100px;
/*margin: 0 auto;*/
/*max-width: 1318px;*/
position: relative;
}
}
@media (min-width: 1360px) {
.paragraph--type-industries .group-head {
padding: 18px calc((100% - var(--container-1240px)) / 2) 13px;
background: url(../img/industries-img-1.webp) no-repeat calc(50% + 450px) calc(100% - 30px);
background-size: 400px auto;
}
.paragraph--type-industries .field--name-field-sectors {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
}
.paragraph--type-industries .group-bottom {
padding: 25px calc((100% - var(--container-1240px)) / 2);
}
}
@media (min-width: 1440px) {
.paragraph--type-industries .group-head {
padding: 91px calc((100% - var(--container-1240px)) / 2) 1px;
margin: 0;
}
}
/*@media (min-width: 1760px) {*/
/* .paragraph--type-industries .group-head {*/
/*padding-left: calc((100% - var(--container-1720px)) / 2);*/
/*padding-right: calc((100% - var(--container-1720px)) / 2);*/
/* padding-left: 0;*/
/* padding-right: 0;*/
/* max-width: var(--container-1720px);*/
/* margin: 0 auto;*/
/* }*/
/* .paragraph--type-industries .group-bottom {*/
/*max-width: var(--container-1720px);*/
/*margin: 0 auto;*/
/* height: 300px;*/
/*background: lightgrey;*/
/* padding-left: calc((100% - var(--container-1720px)) / 2);*/
/* padding-right: calc((100% - var(--container-1720px)) / 2);*/
/* }*/
/* .paragraph--type-industries .field--name-field-sectors {*/
/*border: 1p300pxlid red;*/
/* padding-left: calc((100% - var(--container-1720px)) / 2);*/
/* padding-right: calc((100% - var(--container-1720px)) / 2);*/
/* }*/
/*}*/
/*paragraph--type-products*/
.paragraph--type-products {
background: #EEF1F3;
overflow: hidden;
border-bottom: 25px solid #056839;
}
/*.paragraph--type-products .field--name-field-head-img {*/
/* display: none;*/
/*}*/
.paragraph--type-products .group-head {
background: url(../img/products-img-1.webp) no-repeat 50% calc(100% - 10px);
background-size: 185px;
}
.paragraph--type-products .section-title {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 32px;
font-weight: 300;
line-height: 100%;
text-align: center;
margin: 37px auto 27px;
}
.paragraph--type-products .field--name-field-description {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 20px;
font-weight: 600;
line-height: 95%;
text-align: center;
max-width: 340px;
margin: 0 auto;
min-height: 236px;
}
.paragraph--type-products .field--name-field-term-sections {
padding: 0 var(--outer-0-959) 20px;
}
.taxonomy-term--type-sectors {
border-radius: 10px;
background: white;
padding: 21px 0 25px;
margin-bottom: 11px;
}
.taxonomy-term--type-sectors .field--name-taxonomy-term-title {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 24px;
font-weight: 800;
line-height: 105%;
text-align: center;
text-transform: uppercase;
margin: 0 auto 14px;
max-width: 260px;
letter-spacing: 1px;
}
.taxonomy-term--type-sectors .field--name-field-teaser-description {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 16px;
font-weight: 400;
text-align: center;
margin: 0 auto 23px;
max-width: 345px;
}
.taxonomy-term--type-sectors:first-child .field--name-field-teaser-images img {
width: 100%;
aspect-ratio: 409/198;
object-fit: cover;
}
.taxonomy-term--type-sectors:nth-child(2) .field--name-field-teaser-images {
display: flex;
justify-content: space-evenly;
}
.taxonomy-term--type-sectors:nth-child(2) .field--name-field-teaser-images img {
width: calc(50% - var(--outer-0-959));
max-width: 184px;
}
/*.taxonomy-term--type-sectors:nth-child(2) .field--name-field-teaser-images img {*/
/* height: 184px;*/
/* width: 184px;*/
/* object-fit: cover;*/
/*}*/
.taxonomy-term--type-sectors:nth-child(3) .field--name-field-teaser-images img {
/*height: 214px;*/
width: 285px;
margin: 0 auto;
}
.taxonomy-term--type-sectors .field--name-taxonomy-term-link a {
display: block;
border-radius: 5px;
background: rgb(3, 94, 51);
width: 165px;
height: 45px;
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
line-height: 102%;
letter-spacing: 0%;
text-align: left;
text-decoration: none;
display: flex;
gap: 7px;
align-items: center;
justify-content: center;
margin: 20px auto 0;
}
.taxonomy-term--type-sectors .field--name-taxonomy-term-link a:after {
content: "";
display: block;
width: 14px;
height: 14px;
background-image: url('data:image/svg+xml,');
}
.taxonomy-term--type-sectors .field--name-taxonomy-term-link {
display: none;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper {
overflow: hidden;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-slide {
width: 122px;
}
@media screen and (max-width: 960px) {
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper {
overflow: hidden;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-slide {
width: 122px;
}
}
@media screen and (min-width: 790px) and (max-width: 959px) {
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper {
display: flex;
gap: 5px;
justify-content: center;
}
}
@media (min-width: 960px) {
.paragraph--type-products .group-head {
padding: 37px var(--outer-960-1440) 75px;
background: url(../img/products-img-1.webp) no-repeat calc(100% - var(--outer-960-1440)) center;
background-size: 32%;
}
.paragraph--type-products .section-title {
font-size: 40px;
order: 1;
text-align: left;
margin: 37px 0 27px;
}
.paragraph--type-products .field--name-field-description {
font-size: 28px;
order: 2;
margin: 0;
text-align: left;
min-height: auto;
line-height: 98%;
max-width: 450px;
}
.paragraph--type-products .field--name-field-term-sections {
padding: 0 var(--outer-960-1440) 20px;
}
.taxonomy-term--type-sectors {
display: flex;
}
.taxonomy-term--type-sectors:first-child {
width: 100%;
}
.taxonomy-term--type-sectors:not(:nth-child(2)) {
padding: 35px;
display: grid;
grid-template-columns: auto 340px;
grid-template-rows: auto 1fr;
grid-auto-rows: auto 1fr;
gap: 0px 75px;
grid-auto-flow: row;
grid-template-areas:
"field--name-taxonomy-term-title field--name-field-teaser-images"
"field--name-field-teaser-description field--name-field-teaser-images";
}
.taxonomy-term--type-sectors:first-child {
grid-template-areas:
"field--name-taxonomy-term-title field--name-field-responsive-image-wrapper"
"field--name-field-teaser-description field--name-field-responsive-image-wrapper";
}
.taxonomy-term--type-sectors .field--name-taxonomy-term-title { grid-area: field--name-taxonomy-term-title;}
.taxonomy-term--type-sectors .field--name-field-teaser-description { grid-area: field--name-field-teaser-description;}
.taxonomy-term--type-sectors .field--name-field-teaser-images { grid-area: field--name-field-teaser-images;}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper { grid-area: field--name-field-responsive-image-wrapper;}
.taxonomy-term--type-sectors .field--name-taxonomy-term-title {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 32px;
font-weight: 800;
line-height: 109%;
text-align: left;
text-transform: uppercase;
margin: 0 0 19px;
max-width: initial;
}
.taxonomy-term--type-sectors .field--name-field-teaser-description {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
letter-spacing: 0%;
text-align: left;
margin: 0;
max-width: inherit;
}
.taxonomy-term--type-sectors:first-child .field--name-field-teaser-images img {
width: 349px;
height: 515px;
object-fit: fill;
}
.taxonomy-term--type-sectors:nth-child(2) {
flex-wrap: wrap;
justify-content: space-between;
align-content: flex-start;
padding: 35px;
}
.taxonomy-term--type-sectors:nth-child(2) .field--name-field-teaser-images {
gap: 14px;
}
.taxonomy-term--type-sectors:nth-child(2) .field--name-field-teaser-images img {
width: auto;
height: auto;
max-width: inherit;
}
}
@media screen and (min-width: 960px) and (max-width: 1360px) {
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper {
--s: 165px; /* control the size */
--g: 10px; /* control the gap */
--f: 1.5; /* control the scale factor */
display: grid;
gap: var(--g);
width: calc(2*var(--s) + var(--g));
height: 515px;
aspect-ratio: 1;
grid-template-columns: repeat(2,auto);
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper .swiper-slide {
width: 0;
height: 0;
min-height: 100%;
min-width: 100%;
/*object-fit: cover;*/
cursor: pointer;
filter: grayscale(80%);
transition: .35s linear;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper .swiper-slide picture {}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper .swiper-slide picture img {
object-fit: cover;
width: 100%;
height: 100%;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-slide:hover{
filter: grayscale(0);
width: calc(var(--s)*var(--f));
height: calc(var(--s)*var(--f));
}
.taxonomy-term--type-sectors:nth-child(3) .field--name-field-teaser-images img {
width: auto;
}
}
@media (min-width: 1360px) {
.paragraph--type-products .group-head {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
background: url(../img/products-img-1.webp) no-repeat calc(50% + 440px) center;
background-size: 410px;
}
.paragraph--type-products .field--name-field-term-sections {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
}
.field--name-field-term-sections {
display: flex;
flex-wrap: wrap;
gap: 11px;
}
.taxonomy-term--type-sectors:first-child {
grid-template-columns: 440px 1fr;
margin-bottom: 0;
}
.taxonomy-term--type-sectors:nth-child(3) {
grid-template-columns: 330px 1fr;
}
.taxonomy-term--type-sectors:first-child .field--name-field-teaser-images img {
width: 100%;
}
.taxonomy-term--type-sectors:nth-child(2) {
width: calc(44% - 6px);
gap: 14px;
}
.taxonomy-term--type-sectors:nth-child(3) {
width: calc(56% - 6px);
}
.taxonomy-term--type-sectors:nth-child(2) .field--name-field-teaser-images {
/*flex-direction: column;*/
}
.taxonomy-term--type-sectors:nth-child(3) {
gap: 14px;
grid-template-areas:
"field--name-taxonomy-term-title field--name-taxonomy-term-title"
"field--name-field-teaser-description field--name-field-teaser-images";
}
.taxonomy-term--type-sectors .field--name-field-teaser-images {
display: flex;
align-items: flex-end;
}
.taxonomy-term--type-sectors:nth-child(3) .field--name-field-teaser-images img {
height: auto;
width: 100%;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper {
display: flex;
flex-direction: row;
width: 100%;
height: 526px;
gap: 10px
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper .swiper-slide {
flex: 1;
height: 100%;
transition: flex 0.8s ease;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper .swiper-slide:hover{
flex: 7;
}
.taxonomy-term--type-sectors .field--name-field-responsive-image-wrapper .swiper-wrapper .swiper-slide img {
object-fit: cover;
object-position: left;
width: 100%;
height: 100%;
cursor: pointer;
border-radius: 10px;
}
}
/*@media (min-width: 1760px) {*/
/* .paragraph--type-products .group-head {*/
/*background: url(../img/products-img-1.webp) no-repeat calc((100% - var(--container-1720px)) / 2) center;*/
/* background-size: 380px;*/
/* }*/
/*}*/
/*paragraph--type-our-experience */
.paragraph--type-our-experience {
overflow: hidden;
background: #EEF1F3;
border-bottom: 25px solid #056839;
}
.paragraph--type-our-experience .group-head {
padding: 30px var(--outer-0-959) 20px;
}
.paragraph--type-our-experience .section-title {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 32px;
font-weight: 300;
line-height: 100%;
text-align: center;
margin: 0 0 48px;
}
.paragraph--type-our-experience .field--name-field-description {
font-family: Gilroy;
font-size: 20px;
font-weight: 600;
text-align: center;
max-width: 340px;
width: 100%;
margin: 0 auto 25px;
}
.paragraph--type-our-experience .group-glue {
padding: 0 var(--outer-0-959) 44px;
}
.paragraph--type-our-experience .group-glue .field--name-field-title {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 32px;
font-weight: 800;
text-align: center;
max-width: 370px;
margin: 0 auto 16px;
}
.paragraph--type-our-experience .group-glue .field--name-field-description2 {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
text-align: center;
max-width: 370px;
margin: 0 auto 44px;
}
.paragraph--type-our-experience .group-glue .field--name-field-cover {}
.paragraph--type-our-experience .group-glue .field--name-field-cover img {
margin: 0 auto;
max-width: 100%;
}
.paragraph--type-our-experience .group-glue .field--name-field-glue-logo {
margin: 25px auto 0;
display: grid;
gap: 15px 17px;
grid-template-columns: repeat(2, 1fr);
max-width: 380px;
}
}
.paragraph--type-our-experience .group-glue .field--name-field-glue-logo img {}
.paragraph--type-our-experience .group-wrapper {
padding: 2rem 0;
background: white;
}
.paragraph--type-review-item {
/*border-radius: 10px;*/
/*background: #06522E;*/
min-width: 330px;
width: 330px;
height: 330px;
padding: 29px 0 0;
margin-right: 17px;
perspective: 500px;
}
.paragraph--type-review-item .wrapper {
transition: transform 1s;
transform-style: preserve-3d;
}
.paragraph--type-review-item:hover .wrapper {
transform: rotateY( 180deg ) ;
transition: transform 0.5s;
}
.paragraph--type-review-item:last-child {
margin-right: 0;
}
.paragraph--type-review-item .wrapper {
width: 100%;
height: 100%;
}
.paragraph--type-review-item .front,
.paragraph--type-review-item .back {
position: absolute;
border-radius: 10px;
background: rgb(6, 82, 46);
width: 100%;
height: 100%;
backface-visibility: hidden;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.paragraph--type-review-item .back {
transform: rotateY(180deg);
}
.paragraph--type-review-item .field--name-field-partners-logo {
width: 100px;
margin: 0 auto;
border-radius: 10px;
background: white;
overflow: hidden;
}
.paragraph--type-review-item .field--name-field-partners-logo img {
margin: 0 auto;
}
.field--name-dynamic-twig-fieldparagraph-ds-review-button {
text-align: center;
margin: 1rem 0;
}
.field--name-dynamic-twig-fieldparagraph-ds-review-button .review-button {
border: none;
cursor: pointer;
color: white;
text-transform: uppercase;
font-size: 24px;
font-weight: 600;
}
.field--name-dynamic-twig-fieldparagraph-ds-review-button .review-button:hover {
text-decoration: underline;
}
.paragraph--type-review-item .field--name-field-title {
color: rgb(255, 255, 255);
/*font-family: Manrope;*/
font-family: Gilroy;
font-size: 19.92px;
font-weight: 800;
line-height: 19.92px;
text-align: center;
margin: 22px 0 9px;
}
.paragraph--type-review-item .field--name-field-description {
color: rgb(255, 255, 255);
/*font-family: Manrope;*/
font-family: Gilroy;
font-size: 11.95px;
font-weight: 400;
line-height: 17.93px;
text-align: center;
padding: 0 40px;
}
.paragraph--type-review-item .field--name-field-rating {
display: flex;
justify-content: center;
}
.paragraph--type-our-experience > .field--name-field-title2 {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 24px;
font-weight: 300;
line-height: 118%;
text-align: center;
padding: 21px 0 21px;
}
.paragraph--type-our-experience > .field--name-field-title2 strong {
display: block;
}
.paragraph--type-our-experience .experience-partners-logo {
/*display: flex;*/
/*gap: 10px;*/
/*overflow: auto;*/
/*padding: 2rem 0;*/
/*background: white;*/
}
.paragraph--type-our-experience .experience-partners-logo .swiper-slide {
margin-right: 10px;
width: 150px;
border: 0.5px solid black;
}
/*.paragraph--type-our-experience .experience-partners-logo .swiper-slide a {*/
/* border: 0.5px solid black;*/
/* display: block;*/
/*}*/
.paragraph--type-our-experience .experience-partners-logo .swiper-slide:last-child {
margin-right: 0;
}
@media (min-width: 960px) {
.paragraph--type-our-experience .group-head {
background: white;
padding: 30px var(--outer-960-1440) 20px;
display: flex;
justify-content: space-between;
}
.paragraph--type-our-experience .section-title {
background: white;
font-size: 40px;
text-align: left;
}
.paragraph--type-our-experience .group-head .field--name-field-description {
margin: 0;
text-align: right;
font-size: 34px;
max-width: 546px;
}
.paragraph--type-our-experience .group-glue {
padding: 45px 50px 0 76px;
display: grid;
grid-template-columns: auto 366px;
grid-template-rows: auto 1fr;
grid-auto-rows: auto 1fr;
gap: 0px 110px;
grid-auto-flow: row;
grid-template-areas:
"field--name-field-title field--name-field-cover"
"field--name-field-description field--name-field-cover"
"field--name-field-glue-logo field--name-field-glue-logo";
}
.group-glue .field--name-field-description { grid-area: field--name-field-description; }
.group-glue .field--name-field-title { grid-area: field--name-field-title; }
.group-glue .field--name-field-cover { grid-area: field--name-field-cover; }
.group-glue .field--name-field-glue-logo { grid-area: field--name-field-glue-logo; }
.paragraph--type-our-experience .group-glue {
padding: 50px var(--outer-960-1440) 50px;
}
.paragraph--type-our-experience .group-glue .field--name-field-title {
text-align: left;
padding: 0 0 0;
max-width: 400px;
line-height: 104%;
margin: 0 0 25px;
}
.paragraph--type-our-experience .group-glue .field--name-field-description2 {
text-align: left;
padding: 0;
margin: 0;
max-width: 100%;
}
.paragraph--type-our-experience .group-glue .field--name-field-cover {
width: 366px;
height: 100%;
padding: 0;
margin-left: auto;
}
.paragraph--type-our-experience .group-glue .field--name-field-cover img {
margin: 0;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 10px;
}
.paragraph--type-our-experience .group-glue .field--name-field-glue-logo {
grid-template-columns: repeat(4, 1fr);
margin: 25px auto 0;
max-width: 840px;
}
/*.paragraph--type-our-experience .field--name-field-item {*/
/* padding: 34px 0 36px;*/
/* gap: 10px;*/
/*}*/
.paragraph--type-our-experience .group-wrapper {
padding-left: var(--outer-960-1440);
padding-right: var(--outer-960-1440);
}
.paragraph--type-review-item {
width: calc(100% / 3 - 3px);
min-width: inherit;
height: 280px;
padding: 25px 0 0;
margin-right: 0;
}
.paragraph--type-review-item .field--name-field-partners-logo img {
/*width: 75px;*/
}
.paragraph--type-review-item .field--name-field-title {
margin: 20px 0 4px;
}
.paragraph--type-review-item .field--name-field-description {
font-size: 16px;
font-weight: 300;
line-height: 17.93px;
padding: 0 15px;
}
.paragraph--type-our-experience > .field--name-field-title2 {
padding: 19px 0 11px;
}
.swiper-nav {
background: white;
padding: 2rem 0 0;
display: flex;
justify-content: center;
gap: 0.5rem;
}
.swiper-nav div {
width: 36px;
height: 36px;
border: 1px solid rgba(5, 104, 57, 0.87);
border-radius: 5px;
cursor: pointer;
display: block;
}
.swiper-nav .swiper-button-disabled {
opacity: 0.5;
cursor: no-drop;
}
.swiper-nav .experience-prev,
.sectors-prev {
background: url(../icons/icon-arrow-left.webp) center no-repeat;
}
.swiper-nav .experience-next,
.sectors-next {
background: url(../icons/icon-arrow-right.webp) center no-repeat;
}
.paragraph--type-our-experience .experience-partners-logo {
/*padding: 34px calc((100% - 645px) / 2);*/
/*display: flex;*/
/*flex-wrap: wrap;*/
/*gap: 15px;*/
}
.paragraph--type-our-experience .experience-partners-logo .swiper-slide {
margin-right: 14px;
}
}
/*@media (min-width: 1360px) {*/
/* .paragraph--type-our-experience .group-head {*/
/* padding-left: var(--outer-1440-1900);*/
/* padding-right: var(--outer-1440-1900);*/
/* }*/
/* .paragraph--type-our-experience .group-glue {*/
/* padding-left: var(--outer-1440-1900);*/
/* padding-right: var(--outer-1440-1900);*/
/* }*/
/*}*/
@media (min-width: 1360px) {
/*.paragraph--type-our-experience .section-title {*/
/* padding: 83px 135px 103px;*/
/*}*/
.paragraph--type-our-experience .group-glue {
/*padding: 57px 135px 100px;*/
grid-template-areas:
"field--name-field-title field--name-field-cover"
"field--name-field-description field--name-field-cover"
"field--name-field-glue-logo field--name-field-cover";
grid-template-rows: auto 1fr;
grid-template-columns: auto;
gap: 0px 105px;
}
.paragraph--type-our-experience .group-glue .field--name-field-title {
font-size: 40px;
line-height: 112%;
max-width: inherit;
margin-bottom: 13px;
}
.paragraph--type-our-experience .group-glue .field--name-field-description {
max-width: inherit;
margin: 25px 0 0;
}
.paragraph--type-our-experience .group-glue .field--name-field-glue-logo {
padding: 0;
}
.paragraph--type-our-experience .group-glue .field--name-field-cover {
width: 390px;
padding: 0;
}
.paragraph--type-our-experience .field--name-field-item {
padding: 31px 62px 45px;
gap: 5px;
}
.paragraph--type-review-item {
width: calc(25% - 3px);
min-width: inherit;
height: 330px;
margin-right: 5px;
}
.paragraph--type-review-item .field--name-field-partners-logo img {
/*width: 87px;*/
}
.paragraph--type-review-item .field--name-field-title {
margin: 25px 0 7px;
}
.paragraph--type-review-item .field--name-field-description {і
padding: 0 40px;
}
}
/*@media (min-width: 1256px) {*/
/* .paragraph--type-our-experience .experience-partners-logo .swiper-wrapper {*/
/* justify-content: center;*/
/* }*/
/*}*/
@media (min-width: 1360px) {
.paragraph--type-our-experience .group-wrapper,
/*.paragraph--type-our-experience > .experience-partners-logo,*/
.paragraph--type-our-experience .group-head,
.paragraph--type-our-experience .group-glue,
.paragraph--type-our-experience .field--name-field-item {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
}
/*.paragraph--type-our-experience .group-glue .field--name-field-cover {*/
/* width: 513px;*/
/* height: 513px;*/
/*}*/
}
/*paragraph--type-communication*/
.paragraph--type-communication {
background: #EEF1F3;
padding: 60px 0 0;
border-bottom: 25px solid #056839;
}
.paragraph--type-communication .group-head {
padding-bottom: 2rem;
}
.paragraph--type-communication .section-title {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 40px;
font-weight: 300;
text-align: center;
margin: 0 0 24px;
}
.paragraph--type-communication .group-head .field--name-field-title {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 32px;
font-weight: 700;
line-height: 102%;
text-align: center;
margin: 0 36px 20px;
}
.paragraph--type-communication .group-head .field--name-field-description {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
padding: 0 57px;
text-align: center;
}
.paragraph--type-communication .communication-cards {
background: #fff;
display: grid;
grid-template-columns: 1fr 1fr;
gap: var(--outer-0-959);
padding: 46px var(--outer-0-959) 17px;
}
.communication-card {
box-sizing: border-box;
border: 1px solid rgb(0, 0, 0);
border-radius: 10px;
width: 100%;
height: 190px;
padding: 15px;
display: flex;
flex-direction: column;
max-width: 196px;
}
.communication-card .communication-card-icon {
margin-bottom: 5px;
height: 65px
}
.communication-card .communication-card-icon img {
height: 100%;
width: auto;
}
.communication-card .communication-card-title {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 16px;
font-weight: 600;
text-transform: uppercase;
display: flex;
align-items: center;
min-height: 32px;
}
.communication-card .communication-card-button {
max-width: 165px;
width: 100%;
height: 45px;
border-radius: 5px;
background: rgb(5, 87, 48);
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 16px;
font-weight: 400;
line-height: 102%;
display: flex;
gap: 10px;
align-items: center;
justify-content: center;
text-decoration: none;
margin-top: auto;
}
.communication-card .communication-card-button:hover {
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
background-color: rgb(5, 104, 57);
/*background-color: rgb(3, 84, 46);*/
}
.communication-cards.job .communication-card-button {
font-size: 14px;
}
.communication-card .communication-card-button:before {
content: "";
display: block;
width: 18px;
height: 18px;
background-image: url('data:image/svg+xml,');
background-size: contain;
}
.paragraph--type-communication .field--name-field-title2 {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 32px;
font-weight: 700;
text-align: center;
margin: 27px 36px 20px;
}
.paragraph--type-communication .field--name-field-description2 {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
text-align: center;
padding: 0px 36px 25px;
}
.job .communication-card .communication-card-icon {
background: url(../icons/icon-job.webp) left center no-repeat;
background-size: contain;
}
.job .communication-card .communication-card-button:before {
background-image: url('data:image/svg+xml,');
}
@media (min-width: 440px) {
.paragraph--type-communication .communication-cards {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.communication-card {
max-width: 190px;
}
.communication-cards.job .communication-card-button {
font-size: 14px;
}
}
@media (min-width: 960px) {
.paragraph--type-communication {
padding: 56px 0 0;
}
.paragraph--type-communication .group-head {
padding: 0 var(--outer-960-1440) 33px;
}
.paragraph--type-communication .section-title {
text-align: left;
margin: 0 0 56px;
}
.paragraph--type-communication .group-head .field--name-field-title {
text-align: left;
margin: 0 0 19px;
font-size: 40px;
padding-right: 350px;
}
.paragraph--type-communication .group-head .field--name-field-description {
text-align: left;
padding: 0 390px 0 0;
}
.paragraph--type-communication .communication-cards {
padding: 17px var(--outer-960-1440) 18px;
gap: 30px;
}
.communication-card {
max-width: 268px;
height: 268px;
}
.communication-card .communication-card-icon {
height: 100px;
margin-bottom: 16px;
}
.communication-card .communication-card-icon img {
}
.job .communication-card .communication-card-icon {
width: 97px;
height: 93px;
}
.communication-card .communication-card-title {
font-size: 24px;
}
.paragraph--type-communication .group-bottom {
padding: 29px var(--outer-960-1440) 25px;
}
.paragraph--type-communication .field--name-field-title2 {
text-align: left;
font-size: 40px;
margin: 0 0 16px;
}
.paragraph--type-communication .field--name-field-description2 {
text-align: left;
padding: 0;
}
}
@media (min-width: 1360px) {
.paragraph--type-communication {
padding: 0;
}
.paragraph--type-communication .group-head {
padding: 50px 151px 50px;
}
.paragraph--type-communication .section-title {
}
.paragraph--type-communication .group-head .field--name-field-title {
padding-right: 410px;
margin: 0 0 25px;
}
.paragraph--type-communication .group-head .field--name-field-description {
padding: 0 460px 0 0
}
.paragraph--type-communication .field--name-field-item {
padding: 43px 144px 42px;
}
.paragraph--type-communication-file-item {
}
.paragraph--type-communication-file-item .field--name-field-icon img {
}
.paragraph--type-communication-file-item .field--name-field-title {
}
.paragraph--type-communication-file-item .file-download {
}
.paragraph--type-communication-file-item .file-download:before {
}
.paragraph--type-communication .group-bottom {
padding: 18px 144px 23px;
}
.paragraph--type-communication .field--name-field-title2 {
padding-right: 630px;
}
.paragraph--type-communication .field--name-field-description2 {
padding-right: 630px;
}
.paragraph--type-communication .group-head,
.paragraph--type-communication .communication-cards,
.paragraph--type-communication .group-bottom {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
}
}
/*@media (min-width: 1760px) {*/
/* .paragraph--type-communication .group-head,*/
/* .paragraph--type-communication .field--name-field-item,*/
/* .paragraph--type-communication .group-bottom {*/
/* padding-left: calc((100% - var(--container-1240px)) / 2);*/
/* padding-right: calc((100% - var(--container-1240px)) / 2);*/
/* }*/
/*}*/
/*paragraph--type-contacts*/
.paragraph--type-contacts {
padding: 67px 0 0;
background: url('../img/map.png') no-repeat center #EEF1F3;
background-position: center 340px;
background-position: center calc(100% - 120px);
background-size: 1200px;
}
.paragraph--type-contacts .field--name-field-title {
color: #000;
font-family: Gilroy;
font-size: 40px;
font-weight: 300;
line-height: 100%;
text-align: center;
margin: 65px 0 41px;
}
.paragraph--type-contacts .field--name-field-description {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 30px;
font-weight: 700;
line-height: 102%;
text-align: center;
padding: 0 40px;
margin-bottom: 16px;
}
.paragraph--type-contacts .contacts-map {
height: 824px;
padding: 129px var(--outer-0-959) 0;
display: flex;
flex-direction: column;
position: relative;
}
.paragraph--type-contacts .field--name-field-address {
color: rgb(255, 255, 255);
box-sizing: border-box;
border: 1px solid rgb(255, 255, 255);
border-radius: 10px;
font-size: 24px;
font-weight: 400;
margin: 0 auto;
padding: 18px;
line-height: 120%;
max-width: 408px;
width: 100%;
}
.paragraph--type-contacts .field--name-field-address strong {
margin-bottom: 17px;
display: block;
}
.paragraph--type-contacts .field--name-field-phones {
text-align: right;
margin: 23px auto 0;
letter-spacing: 1px;
max-width: 408px;
width: 100%;
}
.paragraph--type-contacts .field--name-field-phones a {
display: block;
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 32px;
font-weight: 500;
line-height: 39px;
text-decoration: none;
}
.paragraph--type-contacts .field--name-field-map a {
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
width: 167px;
height: 47px;
border: 1px solid #056839;
border-radius: 10px;
background: rgb(255, 255, 255);
color: rgb(0, 0, 0);
font-size: 20px;
font-weight: 400;
text-align: left;
text-decoration: none;
margin: 0 auto;
}
.paragraph--type-contacts .field--name-field-map a:hover {
color: #056839;
}
.paragraph--type-contacts .field--name-field-map a:before {
content: "";
display: block;
width: 27px;
height: 27px;
background-image: url('data:image/svg+xml,');
}
.paragraph--type-contacts .field--name-field-map {
margin: auto 0 0;
}
.paragraph--type-contacts .field--name-field-social-links {
display: flex;
justify-content: center;
gap: 16px;
font-size: 0;
margin: 30px 0 50px;
}
.paragraph--type-contacts .field--name-field-social-links a {
display: block;
width: 42px;
height: 42px;
border-radius: 50%;
background-color: #056839;
background-position: center;
background-repeat: no-repeat;
}
.paragraph--type-contacts .field--name-field-social-links a:hover {
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
/*background-color: rgb(5, 104, 57);*/
background-color: rgb(3, 84, 46);
}
.paragraph--type-contacts .field--name-field-social-links a[href*='viber'] {
background-image: url(../icons/icon-b-vb.png);
}
.paragraph--type-contacts .field--name-field-social-links a[href*='instagram.com'] {
background-image: url(../icons/icon-b-inst.png);
}
.paragraph--type-contacts .field--name-field-social-links a[href*='prom.ua'] {
background-image: url(../svg/prom-white.svg);
background-size: 28px;
}
.paragraph--type-contacts .field--name-field-social-links a[href*='facebook.com'] {
background-image: url(../icons/icon-b-fb.png);
background-position: bottom;
background-size: 16px;
}
.paragraph--type-contacts .field--name-field-social-links a[href*='t.me'] {
background-image: url(../icons/icon-b-tg.png);
}
.paragraph--type-contacts .field--name-field-social-links a[href*='linkedin.com'] {
background-image: url(../icons/icon-b-lin.png);
}
.paragraph--type-contacts .field--name-field-social-links a[href*='youtube.com'] {
background-image: url(../icons/icon-b-yt.svg);
background-size: 24px;
}
@media (min-width: 960px) {
.paragraph--type-contacts {
padding: 65px 0 0;
}
.paragraph--type-contacts .group-head {
padding: 0 var(--outer-960-1440);
background: url(../img/logo-green.webp) no-repeat calc(100% - var(--outer-960-1440)) center;
}
.paragraph--type-contacts .field--name-field-title {
margin: 0 0 20px;
text-align: left;
}
.paragraph--type-contacts .field--name-field-description {
text-align: left;
padding: 0;
max-width: 500px;
}
.paragraph--type-contacts .contacts-map {
padding: 142px var(--outer-960-1440) 0;
background-size: 1244px;
}
.paragraph--type-contacts .field--name-field-address {
width: 438px;
height: 174px;
margin: 0 auto;
padding: 14px 24px;
left: 157px;
position: relative;
}
.paragraph--type-contacts .field--name-field-phones {
margin: 25px auto 0;
position: relative;
left: 150px;
}
.paragraph--type-contacts .field--name-field-map {
margin: auto 0 0;
position: absolute;
left: 57px;
top: 269px;
}
.paragraph--type-contacts .field--name-field-social-links {
margin: 50px 0px 50px 28px;
justify-content: flex-start;
}
}
@media (min-width: 1360px) {
.paragraph--type-contacts {
padding: 0;
background: url(../img/map.png) no-repeat center bottom rgb(238, 241, 243);
background-size: 1437px;
}
.paragraph--type-contacts .group-head {
padding: 95px calc((100% - var(--container-1240px)) / 2);
background: url(../img/logo-green.webp) no-repeat calc(50% + 580px) center;
}
.paragraph--type-contacts .field--name-field-title {
}
.paragraph--type-contacts .field--name-field-description {
font-size: 40px;
padding: 0;
max-width: 620px;
}
.paragraph--type-contacts .contacts-map {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
padding-top: 157px;
}
.paragraph--type-contacts .field--name-field-address {
left: 98px;
}
.paragraph--type-contacts .field--name-field-phones {
left: 65px;
}
.paragraph--type-contacts .field--name-field-map {
left: calc(50% - 650px);
top: 310px;
}
.paragraph--type-contacts .field--name-field-social-links {
margin: 120px 0px 0;
}
}
/*@media (min-width: 1760px) {*/
/* .paragraph--type-contacts .group-head,*/
/* .paragraph--type-contacts .contacts-map {*/
/* padding-left: calc((100% - var(--container-1720px)) / 2);*/
/* padding-right: calc((100% - var(--container-1720px)) / 2);*/
/* }*/
/*}*/
/*paragraph--type-employees*/
.paragraph--type-employees {
background: #EEF1F3;
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
margin-bottom: 10px;
padding: 0 var(--outer-0-959);
}
.paragraph--type-employee-item {
position: relative;
display: flex;
justify-content: space-between;
max-width: 390px;
width: 100%;
height: auto;
aspect-ratio: 390/240;
padding: 6px 0 44px;
border-radius: 10px;
background: #EEF1F3;
transition: background .3s;
}
.paragraph--type-employee-item:hover {
background: rgb(205, 218, 224);
}
.paragraph--type-employee-item .group-left,
.paragraph--type-employee-item .group-right {
width: 50%;
}
.paragraph--type-employee-item .group-left {
padding: 0 15px;
}
.paragraph--type-employee-item .group-right {
display: flex;
flex-direction: column;
word-break: break-word;
padding-right: 14px;
}
.employee-photo {}
.employee-name {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 22px;
/*font-size: 28px;*/
font-weight: 700;
text-align: left;
margin: 7px 0 14px;
}
.employee-post {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 16px;
font-weight: 300;
}
.employee-phone {
margin: auto 0 75px;
}
.employee-phone a {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 16px;
font-weight: 300;
line-height: 100%;
text-decoration: none;
}
.employee-email {
width: 100%;
height: 34px;
position: absolute;
left: 0;
bottom: 23px;
display: flex;
align-items: center;
justify-content: center;
background: #056839;
}
.employee-email a {
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 16px;
font-weight: 400;
line-height: 102%;
text-decoration: none;
}
@media (min-width: 440px) {
.employee-name {
/*font-size: 28px;*/
font-size: 25px;
}
}
@media (min-width: 960px) {
.paragraph--type-employees {
padding: 19px 27px;
flex-direction: row;
flex-wrap: wrap;
gap: 16px;
justify-content: center;
background: white;
}
.paragraph--type-employee-item {
width: 390px;
margin: 0;
padding: 14px 0 0px;
}
.paragraph--type-employee-item .field--name-field-emp-phone {
margin: auto 0 27px;
}
}
@media (min-width: 1360px) {
.paragraph--type-employees {
padding-left: calc((100% - var(--container-1240px)) / 2);
padding-right: calc((100% - var(--container-1240px)) / 2);
justify-content: space-between;
}
.paragraph--type-employee-item:last-child {
margin: 0 auto;
}
}
/*@media (min-width: 1440px) {*/
/* .paragraph--type-employees {*/
/* padding: 39px 27px;*/
/* }*/
/* .paragraph--type-employee-item {*/
/* }*/
/* .paragraph--type-employee-item .field--name-field-emp-phone {*/
/* }*/
/*}*/
/*@media (min-width: 1760px) {*/
/* .paragraph--type-employees {*/
/* padding-left: calc((100% - var(--container-1720px)) / 2);*/
/* padding-right: calc((100% - var(--container-1720px)) / 2);*/
/* }*/
/*}*/
/*product page*/
.product-page .group-banner {
display: flex;
align-items: flex-end;
justify-content: center;
height: calc(100vh - 84px);
height: calc(100svh - 84px);
width: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
margin-bottom: 3rem;
}
.product-page .product-title,
.product-page .sector-title {
border-radius: 10px;
background: rgba(255, 255, 255, 0.5);
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 32px;
font-weight: 800;
line-height: 102%;
text-align: center;
text-transform: uppercase;
padding: 47px 30px;
max-width: 1218px;
margin: 0 6rem 10vh;
}
.product-page .field--name-body {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 20px;
font-weight: 500;
line-height: 103%;
text-align: center;
max-width: 1304px;
margin: 0 var(--outer-0-959) 37px;
}
.product-page.node--type-product-model .group-footer {
margin: 0 var(--outer-0-959) 4rem;
max-width: var(--container-1420px);
}
.product-page .group-footer .group-content {
background: #F4F5F5;
border-radius: 10px;
padding: 1rem;
color: rgb(0, 0, 0);
font-size: 20px;
font-weight: 400;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a {
color: rgb(5, 104, 57);
text-decoration: none;
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a:hover {
text-decoration: underline;
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a:after {
content: ",";
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a:last-child:after {
content: "";
}
.product-page .group-footer .group-images {
max-width: 410px;
margin: 0 auto;
display: block;
border: 1px solid #F4F5F5;
border-radius: 10px;
}
.product-page .cards-3-col {
display: grid;
grid-template-columns: 1fr;
gap: 20px;
justify-self: center;
max-width: var(--container-1420px);
margin: 0 var(--outer-0-959) 4rem;
}
.product-page .card {
max-width: 560px;
width: 100%;
/*height: 900px;*/
padding: 25px;
border-radius: 10px;
background: #EEF1F3;
display: flex;
flex-direction: column;
}
.product-page .card:last-child {
margin-right: auto;
}
.product-page .group-images {
aspect-ratio: 510/400;
width: 100%;
}
.product-page .group-images {
position: relative;
display: inline-block;
overflow: hidden;
}
.product-page .group-images img {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.product-page .group-images .image-mask-svg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
.product-page .group-images .mask-border {
fill: none;
stroke: rgb(5, 104, 57);
stroke-width: 2;
opacity: 0;
transition: opacity 0.2s ease-out;
}
.product-page .card.node--type-product {
cursor: pointer;
}
.product-page .card .field--name-field-image {
overflow: hidden;
}
.product-page .card .field--name-field-image img {
transition: transform .2s;
}
.product-page .card:hover .field--name-field-image img {
transform: scale(1.2);
}
.product-page .card .card-title,
.product-page .card .card-title a {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 32px;
font-weight: 700;
line-height: 90%;
text-align: left;
text-transform: uppercase;
margin: 24px 0 19px;
min-height: 87px;
text-align: center;
text-decoration: none;
}
.product-page .card .card-description {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
text-align: left;
margin-bottom: auto;
text-align: center;
}
.product-page .card .group-footer {
display: flex;
align-items: center;
gap: 0.5rem;
margin-top: 2rem;
}
.product-page .card .product-button {
min-width: 40px;
max-width: 160px;
width: 100%;
height: 40px;
border: none;
margin: 0 auto 0 0;
border-radius: 5px;
background: rgb(109, 113, 111);
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 18px;
font-weight: 400;
line-height: 102%;
text-align: center;
cursor: pointer;
position: relative;
transition: background .3s;
}
.product-page .card .product-button:hover {
background: rgb(5, 104, 57);
}
.product-page .card .field--name-field-color {
display: flex;
gap: 0.5rem;
}
.product-page .card .field--name-field-color .color_field__swatch--circle {
display: block;
width: 40px !important;
height: 40px !important;
}
.product-page .card .field--name-field-scheme a:first-child {
display: block;
width: 40px;
height: 40px;
font-size: 0;
background: url('../icons/icon-schema-black.webp') center no-repeat;
background-size: cover;
}
.product-page .card .field--name-field-scheme .photoswipe-gallery:not(:first-child),
.product-page .card .field--name-field-scheme a:first-child img {
display: none;
}
.product-page .card .field--name-field-scheme a:first-child:hover {
background: url('../icons/icon-schema-green.webp') center no-repeat;
background-size: cover;
}
.pswp--touch .pswp__button--arrow {
visibility: visible;
}
.pswp--ui-visible .pswp__hide-on-close {
opacity: 1;
}
.product-page .card .card-more {
display: block;
border-radius: 5px;
background: rgb(109, 113, 111);
width: 250px;
height: 50px;
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
line-height: 102%;
text-align: left;
text-decoration: none;
display: flex;
gap: 7px;
align-items: center;
justify-content: center;
margin: 20px auto 0;
transition: background .3s;
position: relative;
}
.product-page .card .card-more:after {
content: "";
display: block;
width: 14px;
height: 14px;
background-image: url('data:image/svg+xml,');
}
.product-page .card .card-more:before,
.product-page .card .product-button:before {
content: "";
display: block;
width: 0;
height: 1px;
position: absolute;
bottom: 15px;
left: 42px;
background: white;
transition: width 0.5s;
}
.product-page .card .product-button:before {
left: 15px;
}
.product-page .card .card-more:hover:before {
width: 165px;
}
.product-page .card .product-button:hover:before {
max-width: 180px;
}
.product-page .card .card-more:hover {
background: rgb(5, 104, 57);
}
@media (min-width: 440px) {
.product-page .card .product-button {
max-width: 210px;
height: 50px;
font-size: 22px;
}
.product-page .card .field--name-field-color .color_field__swatch--circle {
width: 50px !important;
height: 50px !important;
}
.product-page .card .field--name-field-scheme a:first-child {
width: 50px;
height: 50px;
}
}
@media (min-width: 960px) {
.product-page .product-title,
.product-page .sector-title {
font-size: 80px;
}
.product-page .field--name-body {
font-size: 34px;
margin: 0 var(--outer-960-1440) 37px;
}
.product-page .cards-3-col {
grid-template-columns: 1fr 1fr;
margin: 0 var(--outer-960-1440) 4rem;
}
.product-page .card .field--name-field-title {
font-size: 40px;
min-height: 108px;
}
.product-page.node--type-product-model .group-footer {
margin: 0 auto 4rem;
}
.product-page .group-footer {
display: flex;
gap: 1rem;
}
}
@media (min-width: 1440px) {
.product-page .product-title,
.product-page .sector-title {
font-size: 96px;
}
.product-page .field--name-body {
font-size: 40px;
margin: 0 auto 37px;
max-width: 1260px;
}
.product-page .cards-3-col {
grid-template-columns: 1fr 1fr 1fr;
margin: 0 auto 4rem;
}
.product-page .group-footer {
margin: 0 0 4rem;
}
}
/*product-components*/
.product-page .group-banner {
display: flex;
align-items: flex-end;
justify-content: center;
height: calc(100vh - 84px);
height: calc(100svh - 84px);
width: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
margin-bottom: 3rem;
}
.product-page .product-title,
.product-page .sector-title {
border-radius: 10px;
background: rgba(255, 255, 255, 0.5);
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 32px;
font-weight: 800;
line-height: 102%;
text-align: center;
text-transform: uppercase;
padding: 47px 30px;
max-width: 1218px;
margin: 0 6rem 10vh;
}
.product-page .field--name-body {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 20px;
font-weight: 500;
line-height: 103%;
text-align: center;
max-width: 1304px;
margin: 0 var(--outer-0-959) 37px;
}
.product-page.node--type-product-model .group-footer {
margin: 0 var(--outer-0-959) 4rem;
max-width: var(--container-1420px);
}
.product-page .group-footer .group-content {
background: #F4F5F5;
border-radius: 10px;
padding: 1rem;
color: rgb(0, 0, 0);
font-size: 20px;
font-weight: 400;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a {
color: rgb(5, 104, 57);
text-decoration: none;
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a:hover {
text-decoration: underline;
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a:after {
content: ",";
}
.product-page .group-footer .field--name-dynamic-block-fieldnode-ds-subindustry .view-content a:last-child:after {
content: "";
}
.product-page .group-footer .group-images {
max-width: 410px;
margin: 0 auto;
display: block;
border: 1px solid #F4F5F5;
border-radius: 10px;
}
.page-product-components .cards-3-col .view-content {
display: grid;
grid-template-columns: 1fr;
gap: 20px;
justify-self: center;
max-width: var(--container-1420px);
margin: 0 var(--outer-0-959) 4rem;
}
.page-product-components .view-content .card {
max-width: 560px;
width: 100%;
/*height: 900px;*/
padding: 25px;
border-radius: 10px;
background: #EEF1F3;
display: flex;
flex-direction: column;
}
.page-product-components .card:last-child {
margin-right: auto;
}
.product-page .card.node--type-product {
cursor: pointer;
}
.page-product-components .card .field--name-field-cover {
overflow: hidden;
}
.page-product-components .card .field--name-field-cover img {
transition: transform .2s;
}
.page-product-components .card:hover .field--name-field-cover img {
transform: scale(1.2);
}
.page-product-components .card .card-title,
.page-product-components .card .card-title a {
color: rgb(5, 104, 57);
font-family: Gilroy;
font-size: 32px;
font-weight: 700;
line-height: 90%;
text-align: left;
text-transform: uppercase;
margin: 24px 0 19px;
min-height: 87px;
text-align: center;
text-decoration: none;
}
.page-product-components .card .card-description {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 20px;
font-weight: 400;
text-align: left;
margin-bottom: auto;
text-align: center;
}
.page-product-components .card .product-button {
min-width: 40px;
max-width: 160px;
width: 100%;
height: 40px;
border: none;
margin: 0 auto 0 0;
border-radius: 5px;
background: rgb(109, 113, 111);
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 18px;
font-weight: 400;
line-height: 102%;
text-align: center;
cursor: pointer;
position: relative;
transition: background .3s;
}
.page-product-components .card .product-button:hover {
background: rgb(5, 104, 57);
}
.page-product-components .card .product-button:before {
content: "";
display: block;
width: 0;
height: 1px;
position: absolute;
bottom: 15px;
left: 42px;
background: white;
transition: width 0.5s;
}
.page-product-components .card .product-button:before {
left: 15px;
}
.page-product-components .card .product-button:hover:before {
max-width: 180px;
}
@media (min-width: 440px) {
.product-page .card .product-button {
max-width: 210px;
height: 50px;
font-size: 22px;
}
.product-page .card .field--name-field-color .color_field__swatch--circle {
width: 50px !important;
height: 50px !important;
}
.product-page .card .field--name-field-scheme a:first-child {
width: 50px;
height: 50px;
}
}
@media (min-width: 960px) {
..page-product-components .product-title,
.product-page .sector-title {
font-size: 80px;
}
.page-product-components .field--name-body {
font-size: 34px;
margin: 0 var(--outer-960-1440) 37px;
}
.page-product-components .cards-3-col .view-content {
grid-template-columns: 1fr 1fr;
margin: 0 var(--outer-960-1440) 4rem;
}
.page-product-components .card .field--name-field-title {
font-size: 40px;
min-height: 108px;
}
.product-page.node--type-product-model .group-footer {
margin: 0 auto 4rem;
}
.product-page .group-footer {
display: flex;
gap: 1rem;
}
}
@media (min-width: 1440px) {
.product-page .product-title,
.product-page .sector-title {
font-size: 96px;
}
.product-page .field--name-body {
font-size: 40px;
margin: 0 auto 37px;
max-width: 1260px;
}
.page-product-components .cards-3-col .view-content {
grid-template-columns: 1fr 1fr 1fr;
margin: 0 auto 4rem;
}
.product-page .group-footer {
margin: 0 0 4rem;
}
}
#youtube-modal {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.8);
justify-content: center;
align-items: center;
padding: 2rem;
box-sizing: border-box;
z-index: 9999;
}
.youtube-modal-inner {
position: relative;
width: 100%;
max-width: 1124px;
aspect-ratio: 16 / 9;
max-height: calc(100vh - 4rem); /* урахування 2rem зверху та знизу */
}
.youtube-modal-inner iframe {
width: 100%;
height: 100%;
border: none;
border-radius: 8px;
display: block;
}
.youtube-modal-close {
position: absolute;
top: -15px;
right: -15px;
height: 50px;
width: 50px;
border-radius: 50%;
border: 4px solid white;
cursor: pointer;
z-index: 10;
background: url('data:image/svg+xml,') center no-repeat;
background-size: 18px 18px;
}
/* Основные стили для формы */
.block-webform {
display: none;
}
.block-webform.active {
position: fixed;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: rgba(0,0,0,0.3);
display: block;
z-index: 2;
}
.block-webform.active .webform-submission-form {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
}
.block-webform.active .webform-submission-form {
display: block;
/*position: absolute;*/
/*bottom: 100%;*/
/*right: 100%;*/
max-width: 380px;
min-width: 300px;
/*height: 522px;*/
border-radius: 10px;
background: #056839;
color: white;
padding: 27px 30px 20px;
cursor: auto;
}
/* Заголовок */
.webform-submission-form .form-item-markup {
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 20px;
font-weight: 700;
text-align: center;
text-transform: uppercase;
margin-bottom: 14px;
}
/* Подзаголовок */
.webform-submission-form .js-form-type-processed-text {
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 16px;
font-weight: 300;
text-align: center;
margin-bottom: 21px;
}
/* Стили для меток */
.webform-submission-form .js-form-type-textfield,
.webform-submission-form .js-form-type-tel,
.webform-submission-form .js-form-type-textarea {
margin-bottom: 9px;
}
.webform-submission-form .form-item-city {
margin-bottom: 16px;
}
.webform-submission-form label {
display: block;
font-family: Gilroy;
font-size: 12px;
font-weight: 300;
margin-left: 8px;
margin-bottom: 4px;
}
/* Стили для полей ввода */
.webform-submission-form input[type="text"],
.webform-submission-form input[type="tel"],
.webform-submission-form textarea {
width: 100%;
height: 32px;
border-radius: 5px;
background: #fff;
padding: 10px;
}
.webform-submission-form .form-item-tel input,
.webform-submission-form .form-item-city input {
height: 40px;
}
.webform-submission-form textarea {
height: 90px;
}
/* Стили для текста в placeholder */
.webform-submission-form input::placeholder {
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 12px;
font-weight: 300;
}
.webform-submission-form .js-form-type-webform-document-file {
display: flex;
align-items: center;
gap: 1rem;
justify-content: center;
}
.webform-submission-form .js-form-type-webform-document-file .webform-file-button {
min-width: 165px;
width: 100%;
height: 45px;
border-radius: 5px;
background: rgb(5, 87, 48);
color: rgb(255, 255, 255);
font-family: Gilroy;
font-size: 16px;
font-weight: 400;
line-height: 102%;
display: flex;
gap: 10px;
align-items: center;
justify-content: center;
text-decoration: none;
border: 1px solid white;
}
.webform-submission-form .js-form-type-webform-document-file .webform-file-button:before {
content: "";
display: block;
width: 18px;
height: 18px;
background-image: url('data:image/svg+xml,');
background-size: contain;
}
/* Кнопка отправки */
.webform-submission-form .form-actions input[type="submit"] {
width: 100px;
height: 30px;
color: rgb(0, 0, 0);
font-family: Gilroy;
font-size: 12px;
font-weight: 700;
text-align: center;
background: white;
display: block;
margin: 23px auto 0;
cursor: pointer;
border: none;
border-radius: 3px;
}
.webform-submission-form .form-actions input[type="submit"]:focus,
.webform-submission-form .form-actions input[type="submit"]:hover {
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
background: rgb(209, 218, 214);
}
/* Закрывающая кнопка */
.webform-submission-form [id^="edit-close"] {
position: absolute;
top: 13px;
right: 8px;
width: 21px;
height: 21px;
border: 1px solid #fff;
border-radius: 50%;
cursor: pointer;
background: url('data:image/svg+xml,') no-repeat center;
}
.webform-confirmation {}
.webform-confirmation .webform-confirmation__message {
font-size: 18px;
text-align: center;
}
.webform-confirmation .webform-confirmation__back {
text-align: center;
}
.webform-confirmation .webform-confirmation__back a {
font-size: 16px;
color: white;
}
#popup-bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
}
#popup-img {
position: relative;
max-width: 90%;
max-height: 90%;
}
#popup-img img {
max-width: 100%;
max-height: 100%;
border-radius: 8px;
box-shadow: 0 0 10px #000;
}
#popup-close {
position: absolute;
top: -10px;
right: -10px;
width: 30px;
height: 30px;
background: #fff url("data:image/svg+xml;utf8,") center center no-repeat;
background-size: 16px;
border-radius: 50%;
cursor: pointer;
}
/*node--view-mode-search-index*/
.search-api-autocomplete-search {
box-shadow: 0px 4px 34px rgba(0, 0, 0, 0.08);
border-radius: 0px 0px 10px 10px;
padding: 20px 25px;
border: none !important;
margin-left: 20px;
margin-right: 20px;
font-family: Gilroy;
}
.search-api-autocomplete-search li.ui-menu-item:not(:last-child) {
margin-bottom: 10px;
}
.search-api-autocomplete-search .node--view-mode-search-index {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 14px;
width: fit-content;
}
.search-api-autocomplete-search .field--name-field-cover {
height: 50px;
width: 50px;
border-radius: 8px;
border: 1px solid rgb(229, 231, 235);
padding: 5px;
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
}
.search-api-autocomplete-search .field--name-field-cover img {}
.page-search #content {}
.page-search .page-title {
font-size: 34px;
font-weight: 600;
text-align: center;
}