@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700&display=swap');

.page-content{padding-top: 60px; padding-bottom: 60px;}
/* header */
body.scrolled header{position: fixed; top: 0; max-width: 100%; border-radius: 0;}
header{ position: fixed;width: 100%;padding: 20px 0;background-color: #1F283C;margin: 0 auto;z-index: 3;transition: all 350ms;}
header .container{display: flex; gap: 30px; justify-content: space-between; max-width: 1350px; width: 100%; margin: 0 auto; padding: 0 50px;}
body.scrolled header .logo{width: 122px; height: 86px; background-size: cover;}
body.scrolled .quick-contact{box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
header .logo{width: 170px;height: 134px;background-image: url(../images/logo.svg);background-position: center center;background-size: contain;background-repeat: no-repeat;display: block;position: fixed;top: 0; transition: all 350ms;}

header .nav{display: flex; list-style: none; align-items: center; gap: 60px; padding-left: 200px; width: 100%; justify-content: flex-end;}
header .nav .menu{display: flex; gap: 20px; list-style: none; flex-wrap: wrap;}
body.scrolled header .nav .menu li a{font-size: 16px;}
header .nav .menu li a{font-style: normal;color: #D8D8D8; transition: all 200ms; white-space: nowrap; font-weight: 400;font-size: 16px;line-height: 19px;}
header .nav .menu li:hover a{color: #ffffff;}
header .nav .menu li:hover .hasdropdown a{color: #242D42;}
header .nav .menu li a.active{color: #ffffff;}
header .nav .hamburger{display: flex; justify-content: center; align-items: center; gap: 7px; cursor: pointer; display: none;}
header .nav .hamburger .bar{height: 17px; width: 2px; background-color: rgb(255, 255, 255);}

.quick-contact{width: 100%; padding: 5px 0; background: linear-gradient(90deg, #242D42 28.88%, rgba(200, 200, 200, 0) 54.77%); background-color: white; position: fixed; top: 59px; z-index: 2; transition: all 350ms;}
.quick-contact .quick-contact-container{display: flex; justify-content: flex-end; gap: 60px; padding-left: 200px; transition: all 350ms;}
.quick-contact .quick-contact-container .phone,
.quick-contact .quick-contact-container .mail{font-style: normal;font-weight: 400;font-size: 14px;line-height: 17px;color: #4D4D4D; padding-left: 22px;}


.quick-contact .quick-contact-container .phone b,
.quick-contact .quick-contact-container .mail b{font-style: normal;font-weight: 700;font-size: 14px;line-height: 17px;color: #4D4D4D;}
header .nav .menu li:hover ul.hasdropdown{display: block;}
header .nav .menu ul.hasdropdown{list-style: none; position: absolute; background-color: white; display: none;}
header .nav .menu ul.hasdropdown li{position: relative; padding: 15px 30px;}
header .nav .menu ul.hasdropdown ul{top: 0; left: 100%;}


.leaflet{background: white;position: fixed;top: 0;right: -422px;max-width: 422px;width: 100%;display: flex;flex-direction: column; transition: all 200ms; z-index: 3; height: 100vh; padding-left: 50px; align-items: end; -webkit-box-shadow: -6px 1px 15px -10px rgba(152, 152, 152, 0.59);
  -moz-box-shadow: -6px 1px 15px -10px rgba(152, 152, 152, 0.59);
  box-shadow: -6px 1px 15px -10px rgba(152, 152, 152, 0.59);}

.leaflet.active{right: 0;}
.leaflet .controls{background: #BE1621; width: 60px; height: 53px; position: relative; margin-top: 50px; transition: all 200ms; cursor: pointer; margin-bottom: 4rem;}
.leaflet .controls::before{content: ''; width: 13px; height: 12px; background-image: url(../images/leaflet/close.svg); background-position: center center; background-repeat: no-repeat; background-size: contain; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute;}
.leaflet .controls:hover{background-color: #7a1219;}
.leaflet .content{width: 100%; margin-bottom: 60px;}
.leaflet .content.mobile{display: none;}

.leaflet .content a{color: #181818;}
.leaflet .content .title{font-style: normal;font-weight: 700;font-size: 20px;line-height: 119.5%;color: #181818;}
.leaflet .content .subtitle{font-weight: 400;font-size: 18px;line-height: 119.5%;color: #181818; margin-bottom: 35px;}
.leaflet .content .main{font-style: normal;font-weight: 400;font-size: 17px;line-height: 95.5%;color: #181818;}
body.page .leaflet .content .main{padding-top: 0;}
body.page .leaflet .content .main::before{content: none;}
.leaflet .content .details{margin-top: 36px; display: flex; flex-direction: column; gap: 25px;}

.leaflet .content .media{display: flex; gap: 40px; flex-wrap: wrap;}

.leaflet .buttons{width: 100%;}

.banner-container{width: 100%;height: 100vh;background-color:#1C1C1B; position: relative;}
.banner-container::before{content: '';position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #2d2d2d52; z-index: 1;}
.banner-container .splide__slide img{height: 100vh; width: 100%; object-fit: cover;}
.banner-container .banner-content{position: absolute; top: 40%; z-index: 1;}
.banner-container .banner-content .subtitle{font-style: normal;font-weight: 400;font-size: 18px;line-height: 21px; color: #fff; margin-bottom: 23px; position: relative; max-width: fit-content; padding-right: 60px;}
.banner-container .banner-content .subtitle::before{content: ''; width: 40px; height: 1.5px; background-color: white; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.banner-container .banner-content .title,
.banner-container .banner-content .title p{font-weight: 500;font-size: clamp(1.625rem, 1.091rem + 2.372vw, 3.938rem) !important /*63px->26px*/;line-height: clamp(1.750rem, 1.317rem + 1.923vw, 3.625rem) !important /*58px->28px*/;color: #FFFFFF; max-width: 700px;}


.banner-container .banner-content .arrows{display: flex; margin-top: 35px;}
.banner-container .banner-content .arrows .prev{height: 100%; width: 60px; background: #F93943; border-top-left-radius: 10px; border-bottom-left-radius: 10px; padding: 7px 0; display: flex; align-items: center; transition: all 350ms; cursor: pointer;}
.banner-container .banner-content .arrows .prev:hover{background: #d12931;}
.banner-container .banner-content .arrows .prev svg{fill: white; width: 100%; height: 18px; transform: rotate(180deg);}
.banner-container .banner-content .arrows .next{height: 100%; width: 60px; background: #F93943; border-top-right-radius: 10px; border-bottom-right-radius: 10px; padding: 7px 0; display: flex; align-items: center; transition: all 350ms; cursor: pointer;}
.banner-container .banner-content .arrows .next:hover{background: #d12931;}
.banner-container .banner-content .arrows .next svg{fill: white; width: 100%; height: 18px;}

.banner-container .splide__arrows{position: absolute;bottom: 0;z-index: 1;max-width: 730px;width: 100%;right: 335px;display: flex; gap: 4px; display: none;}
.banner-container .splide__arrows .splide__arrow{position: relative; height: 50px; width: 50%; background-color: #BE1621; border-radius: 6px 6px 0px 0px; bottom: 0; left: 0; opacity: 1; top: 0; transform: none; transition: all 200ms;}
.banner-container .splide__arrows .splide__arrow.splide__arrow--prev{background-color: #BE1621;}
.banner-container .splide__arrows .splide__arrow.splide__arrow--prev:hover{background-color: #7a1219;}
.banner-container .splide__arrows .splide__arrow.splide__arrow--next{background-color: #FFFFFF;}
.banner-container .splide__arrows .splide__arrow.splide__arrow--next:hover{background-color: #a2a2a2;}
.banner-container .splide__arrows .splide__arrow.splide__arrow--next svg{fill: black;}
.banner-container .splide__arrows .splide__arrow svg{fill: white;}

/* main on page */

body.page .main{position: relative; padding-top: 100px; padding-bottom: 100px;}
body.page .main .content img{object-fit: cover;}
body.page.not-found .main::before{opacity: 0;}
body.page.not-found .pageTitle .content .breadcrumbs{display: none}


/* popup */
.popup-container{position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 1000;}
.popup-container .overlay{position: absolute;background: #0000008a;width: 100%;height: 100%;}
.popup-container .content{max-width: 700px;margin: 0 auto;padding: 15px 0;height: 100%;display: flex;flex-direction: column;justify-content: center;position: relative;}
.popup-container .content .image{max-width: 100%; width: 100%; max-height: 585px; height: 100%;}
.popup-container .content .image img{width: 100%; height: 100%; object-fit: cover;}
.popup-container .content .text{background: #BE1621;color: #fff;padding: 15px;font-size: 14px;}
.popup-container .content .close{background: #BE1621;width: 60px;height: 53px;position: absolute;transition: all 200ms;cursor: pointer;right: -60px;}
.popup-container .content .close::before{content: '';width: 13px;height: 12px;background-image: url(../images/leaflet/close.svg);background-position: center center;background-repeat: no-repeat;background-size: contain;top: 50%;left: 50%;transform: translate(-50%, -50%);position: absolute;}


/* services */
.services-container{display: flex; gap: 10px; z-index: 1; position: relative; margin-top: -150px;}
.services-container .service{flex-basis: calc(33.3333% - 5px); position: relative; border-radius: 5px;}
.services-container .service:hover .image img{transform: scale(1.1);}
.services-container .service .image{width: 100%; height: 100%; overflow: hidden; border-radius: 5px;}
.services-container .service .image img{width: 100%; height: 100%; object-fit: cover; border-radius: 5px; transition: all 350ms;}
.services-container .service .name-tag{position: absolute; bottom: 0; left: 0; background-color: #1F283C; padding: 20px; color: #FFF;font-size: 16px;font-family: Rubik;font-weight: 500; box-shadow: 0px -1px 8px 0px rgba(0, 0, 0, 0.25); border-top-right-radius: 5px; text-transform: uppercase;}

/* separator-blue */
.separator-blue{height: 60px; background: #1F283C; width: 100%;}

/* custom-background */
.custom-background{background-image: url(../images/backgrounds/custom-banner-1.webp); padding-top: 100px; margin-top: -100px; padding-bottom: 30px; background-size: cover; background-repeat: no-repeat;}


/* whyus */

.whyus-container .content-container{margin-top: 65px;background: white;border-radius: 5px;display: flex;gap: 30px; margin-bottom: 35px;}
.whyus-container .content-container .content{flex-basis: calc(50% - 15px);padding: 50px;display: flex;flex-direction: column;justify-content: center;}
.whyus-container .content-container .image-container{flex-basis: calc(50% - 15px); max-height: 650px; border-top-right-radius: 5px; border-bottom-right-radius: 5px;}
.whyus-container .content-container .image-container img{height: 100%; width: 100%; border-top-right-radius: 5px; border-bottom-right-radius: 5px;}

.whyus-container .content-container .content .section{color: #F93943;font-size: 18px;font-family: Rubik;line-height: 130%; margin-bottom: 18px;}

.whyus-container .content-container .content .title{color: #242D42;font-size: clamp(1.625rem, 1.481rem + 0.641vw, 2.250rem) /*36px->26px*/;font-family: Rubik;font-weight: 500;line-height: 130%;}
.whyus-container .content-container .content .subtitle{color: #242D42;font-size: clamp(1.375rem, 1.231rem + 0.641vw, 2.000rem) /*32px->22px*/;font-family: Rubik;font-weight: 400;line-height: 130%; margin-bottom: 20px;}
.whyus-container .content-container .content .description{color: #242D42;font-size: 16px;font-family: Rubik;line-height: 130%; margin-bottom: 50px;}
.whyus-container .content-container .content .btn{border-radius: 5px;border: 1px solid #E1E1E1;background: #FFF;box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.14); color: #242D42;font-size: 15px;font-family: Rubik;line-height: 130%; transition: all 350px;}
.whyus-container .content-container .content .btn:hover{box-shadow: 0px 0px 8px 5px rgba(0, 0, 0, 0.05);}
.whyus-container .content-container .content .btn:hover.btn-arrow::before{right: 10px;}


/* statistics */
.statistics{padding: 65px 0; background: #242D42;}
.statistics .statistics-container{display: flex; gap: 30px;}
.statistics .statistics-container .stats{flex-basis: calc(33.333 - 15px); border-radius: 10px;
background: #1F283C;box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.13); padding: 50px; padding-bottom: 100px; position: relative;}
.statistics .statistics-container .stats::before{content: '';  border-radius: 0px 0px 5px 0px;
background: rgba(249, 57, 67, 0.88); width: 82px;height: 25px; position: absolute; bottom: 0; right: 0;}
.statistics .statistics-container .stats:nth-child(3){flex-grow: 1; max-width: 555px;}
.statistics .statistics-container .stats .top{display: flex; gap: 15px; align-items: center;}
.statistics .statistics-container .stats .top .num{color: #FFF;font-size: 70px;font-family: Rubik;}
.statistics .statistics-container .stats .top .sub{color: #FFF;font-size: 26px;font-family: Rubik;}
.statistics .statistics-container .stats .description{color: #FFF;font-size: 18px;font-family: Rubik; margin-top: 40px;}


.widget-products{background-color: #242D42;}
.widget-products .content{display: flex; gap: 20px; padding-bottom: 60px; padding-top: 60px;}
.widget-products .content .product{flex-basis: calc(25% - 10px); border-top-left-radius: 5px; border-top-right-radius: 5px;}
.widget-products .content .product:hover .image img{transform: scale(1.1); border-top-left-radius: 5px; border-top-right-radius: 5px;}
.widget-products .content .product .image{height: 360px; overflow: hidden; position: relative; border-top-left-radius: 5px; border-top-right-radius: 5px;}
.widget-products .content .product .image img{width: 100%; height: 100%; object-fit: cover; transition: all 350ms;}
.widget-products .content .product .image .title{padding: 7px 12px; background: rgba(0, 38, 89, 0.89); color: #fff; font-size: 14px; position: absolute; bottom: 0; width: 100%; min-height: 48px;}
.widget-products .content .product .button{padding: 20px 0; background-color: #192032; color: #FFF;font-size: 15px; font-weight: 300; text-align: center; transition: all 350ms;}
.widget-products .content .product:hover .button{background-color: #162a5c;}

.widget-products .buttons{display: flex; gap: 20px; margin-bottom: 60px;}
.widget-products .buttons a{flex-basis: calc(50% - 10px); background: #192032; color: #FFF;text-align: center;font-size: 15px;font-family: Rubik;line-height: 100%;text-transform: uppercase; display: flex; justify-content: space-between; align-items: center; text-align: center; transition: 350ms;}
.widget-products .buttons a:hover{background-color: #1e2945;}
.widget-products .buttons a .text{color: #FFF;text-align: center;font-size: 15px;font-family: Rubik;line-height: 100%;text-transform: uppercase; display: flex; align-items: center; justify-content: center; width: 100%;}

.ourpartners-container{background-image: url(../images/partners/bg/background.webp); background-position: center center; background-size: cover; background-repeat: no-repeat; padding-top: 80px;}
.ourpartners-container .content .description {padding-top: 60px; padding-bottom: 60px;}
.ourpartners-container .content .image-container{padding-top: 60px; padding-bottom: 60px;}
.ourpartners-container .content .image-container .splide__list{display: flex; align-items: center;}
.ourpartners-container .splide__pagination{bottom: -3em;}
.ourpartners-container .splide__pagination__page.is-active{background: #192032;}
.ourpartners-container .content .image-container .splide__arrow--prev{left: -3em; background: transparent;}
.ourpartners-container .content .image-container .splide__arrow--next{right: -3em; background: transparent;}

.ourpartners-container .content .image-container .splide__slide{display: flex; justify-content: center;}
.ourpartners-container .content .image-container .splide__slide a img{height: 70px; object-fit: contain;}


/* seo-container */
.seo-container{background-color: #242D42; height: 50px; position: relative;}
.seo-container .content{position: relative; bottom: -50px;}
.seo-container .description{background-color: #fff; border-radius: 5px; position: absolute; bottom: 0; padding: 38px 45px; right: 50px; width: calc(100% - 100px);}

/* contact map */
.contact-map{background-color: #242D42; padding-top: 30px; padding-bottom: 30px; position: relative; z-index: 1;}
.contact-map .content{width: 100%; height: 410px;}
.contact-map .content .map{height: 100%; border-radius: 5px; width: 100%;}

/* footer */
footer{background-color: #242D42; padding-top: 30px;}
footer .company-details .content{display: flex; justify-content: space-between; gap: 30px; padding-bottom: 70px;}

footer .company-details .content .description,
footer .company-details .content .description p {color: #D8D8D8;font-size: 15px;font-family: Rubik; padding-left: 3px;}

footer .company-details .content .phone .title{color: #D8D8D8;font-size: 15px;font-family: Rubik;font-weight: 500; margin-bottom: 10px;}

footer .company-details .content .phone p{color: #D8D8D8;font-size: 15px;font-family: Rubik;}

footer .company-details .content .phone a{text-decoration: none; color: #D8D8D8;font-size: 15px;font-family: Rubik;}

footer .company-details .content .mail .title{color: #D8D8D8;font-size: 15px;font-family: Rubik;font-weight: 500; margin-bottom: 10px;}

footer .company-details .content .mail p{color: #D8D8D8;font-size: 15px;font-family: Rubik;}

footer .company-details .content .mail a{text-decoration: none; color: #D8D8D8;font-size: 15px;font-family: Rubik;}

footer .company-details .content .timeopen .title{color: #D8D8D8;font-size: 15px;font-family: Rubik;font-weight: 500; margin-bottom: 10px;}

footer .company-details .content .timeopen p{color: #D8D8D8;font-size: 15px;font-family: Rubik;}

footer .company-details .content .timeopen a{text-decoration: none; color: #D8D8D8;font-size: 15px;font-family: Rubik;}




footer .company-details .content .buttons{display: flex; flex-direction: column; gap: 10px;}
footer .company-details .content .buttons a:nth-child(1){padding: 8px 15px; text-align: center; border-radius: 6px;background: #F93943; color: #fff;font-size: 15px;font-family: Rubik;}

footer .company-details .content .buttons a:nth-child(2){padding: 8px 30px; text-align: center; border-radius: 6px;background: #192032; color: #fff;font-size: 15px;font-family: Rubik;}

footer .bottom{background-color: #121723; padding: 25px;}
footer .bottom .content{display: flex; justify-content: space-between;}

footer .bottom .content .footer-menu ul{list-style: none;}
footer .bottom .content .footer-menu ul li,
footer .bottom .content .footer-menu ul li a{color: #D8D8D8;font-size: 16px;font-family: Rubik;}

footer .bottom .content .copyright{color: #D8D8D8;font-size: 16px;font-family: Rubik;}



/* header-pillow */
.header-pillow{height: 85px; width: 100%;}

.pageTitle{height: 340px; padding-top: 120px; position: relative; background-size: cover; background-position: center center;}
.pageTitle::before{content: ''; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.25); position: absolute; top: 0; left: 0;}
.pageTitle .content{z-index: 1; position: relative;}
.pageTitle .content .title.main-text{color: #FFF;font-size: clamp(1.875rem, 1.486rem + 1.731vw, 3.563rem) /*57px->30px*/;font-family: Rubik;font-weight: 500;line-height: 102.5%; margin-top: 15px;}


/* text-image-container */
.text-image-container{padding: 50px;background: white;display: flex;gap: 50px;border-radius: 5px;-webkit-box-shadow: 0px 0px 18px 1px rgba(36, 45, 66, 0.15);-moz-box-shadow: 0px 0px 18px 1px rgba(36, 45, 66, 0.15);box-shadow: 0px 0px 18px 1px rgba(36, 45, 66, 0.15); align-items: center;}
.text-image-container .texts{flex-basis: 50%;}

/* gallery preview */
.gallery-preview-container{padding-top: 100px; padding-bottom: 100px;}
.gallery-preview-container .gallery-preview{padding-top: 60px; display: flex; gap: 30px;}
.gallery-preview-container .gallery-preview .image{width: 100%; height: 100%; position: relative; overflow: hidden;}
.gallery-preview-container .gallery-preview .image:hover img{transform: scale(1.1);}
.gallery-preview-container .gallery-preview .image img{object-fit: cover; width: 100%; height: 100%; transition: all 350ms;}
.gallery-preview-container .gallery-preview .image .text{    position: absolute;top: 0;left: 0;background: #0000009c;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;color: #fff;}

/* gallery */
.gallery-container{display: flex; gap: 20px; flex-wrap: wrap;}
.gallery-container .tile{flex-basis: calc(33% - 10px); height: 300px; overflow: hidden;}
.gallery-container .tile:hover img{transform: scale(1.1);}
.gallery-container .tile img{height: 100%; width: 100%; object-fit: cover; transition: all 350ms;}
.pagination{padding-top: 60px;display: flex;justify-content: flex-end;gap: 5px;}
.pagination .item{padding: 12px 20px;font-size: 13px;color: #fff;border-radius: 2px;background: #F93943; transition: 350ms;}
.pagination .item:hover{background: #162a5c;}

/* products-container */
.products-container{display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 20px;}
.products-container .product{width: 100%; flex-basis: calc(25% - 15px); box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.13); display: flex; flex-direction: column; justify-content: space-between; border-top-left-radius: 5px; border-top-right-radius: 5px; height: 100%;}
.products-container .product:hover .image img{transform: scale(1.1);}
.products-container .product .image{width: 100%; height: 340px; border-top-left-radius: 5px; border-top-right-radius: 5px; overflow: hidden;  transition: all 350ms;}
.products-container .product .image img{width: 100%; height: 100%; object-fit: cover; border-top-left-radius: 5px; border-top-right-radius: 5px; transition: all 350ms;}
.products-container .product .title{padding: 17px 12px; display: flex; min-height: 71px; justify-content: center; align-items: center; text-align: center; background-color: #002659; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;color: #FFF;font-size: 16px;font-family: Rubik;font-weight: 300;line-height: 116.5%;letter-spacing: -0.64px; }


/* product page */
.product-container{background: #1F283C; padding-top: 100px;margin-bottom: -125px;}
.product-page{display: flex;gap: 60px;justify-content: space-between;}
.product-page .image{max-width: 510px; position: relative; height: 650px; box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.13);}
.product-page .image .splide__track{height: 100%;}
.product-page .image .splide__track .splide__slide a{height: 100%; display: block; position: relative;}
.product-page .image .splide__track .splide__slide a img{height: 100%; width: 100%; object-fit: cover;}
.product-page .image .splide__arrow--prev,
.product-page .image .splide__arrow--next{display: none;}
.product-page .image .product-gallery{height: 100%;}
.product-page .image .navigation{position: absolute;right: 0;display: flex;bottom: 0;}
.product-page .image .navigation .prev{width: 50px;transform: rotate(180deg);display: flex;justify-content: center;align-items: center; background: #242D42;padding: 10px; transition: all 350ms; cursor: pointer;}
.product-page .image .navigation .next{width: 50px;display: flex;justify-content: center;align-items: center; background: #242D42;padding: 10px; transition: all 350ms; cursor: pointer;}
.product-page .image .navigation svg{fill: white;}

.product-page .image .navigation .prev:hover{background: #192238}
.product-page .image .navigation .next:hover{background: #192238}

.product-page .details{min-width: 490px;}
.product-page .details .tag{color: #FFF;font-size: 16px;font-family: Rubik;line-height: 102.5%; margin-bottom: 12px;}

.product-page .details .text{color: #FFF;font-size: 16px;font-family: Rubik;font-weight: 500;line-height: 102.5%; margin-bottom: 12px;}

.product-page .details .title{color: #FFF;font-size: 28px;font-family: Rubik;font-weight: 500; margin-bottom: 20px; max-width: 490px;}

.product-page .details .state{margin-bottom: 20px;}
.product-page .details .reference_number{margin-bottom: 20px;}
.product-page .details .producer{margin-bottom: 20px;}
.product-page .details .separator{width: 100%; background-color: #242D42; height: 1.5px; margin-top: 30px; margin-bottom: 30px;}
.product-page .details .buttons{display: flex; gap: 10px;}
.product-page .details a{flex-basis: calc(50% - 5px);height: 54px;border-radius: 5px;background: #192032;display: flex;justify-content: center;align-items: center;color: #B9C3E4;text-align: center;font-size: 16px;font-family: Rubik;font-weight: 500;line-height: 102.5%; transition: all 350ms;}
.product-page .details a:hover{background: #202b47;}

.product-description{background: #192032; padding-top: 75px; padding-bottom: 75px;}
.product-description .content{display: flex; gap: 60px; justify-content: space-between;}
.product-description .content .blocker{max-width: 510px; min-width: 510px; width: 100%; height: 1px;}
.product-description .content .description{display: flex; flex-direction: column; gap: 20px; max-width: 490px; min-width: 490px;}
.product-description .content .tag{color: #FFF;font-size: 16px;font-family: Rubik;line-height: 102.5%;}
.product-description .content .text{color: #FFF;font-size: 16px;font-family: Rubik;font-weight: 300;line-height: 108%;}


.related-products{background-image: url(../images/partners/bg/background.webp);background-position: center center;background-size: cover;background-repeat: no-repeat;padding-top: 80px; padding-top: 60px; padding-bottom: 60px;}

.related-products .content{padding-top: 60px; display: flex; gap: 30px; flex-wrap: wrap;}
.related-products .content .related-product{max-width: 270px; width: 100%; box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.13); position: relative; padding-bottom: 52px;}
.related-products .content .related-product .image{max-width: 270px; height: 320px; overflow: hidden;}
.related-products .content .related-product .image img{height: 100%; width: 100%; object-fit: cover; border-radius: 5px 5px 0px 0px; transition: all 350ms;}
.related-products .content .related-product:hover .image img{transform: scale(1.1);}
.related-products .content .related-product .name{padding: 17px 12px; border-radius: 0px 0px 5px 5px; background: #002659; display: flex; justify-content: center; align-items: center; color: #FFF;font-size: 16px;font-family: Rubik;font-weight: 300;line-height: 116.5%;letter-spacing: -0.64px; position: absolute; bottom: 0; left: 0; width: 100%;}


/* services-container-page */
.services-container-page{display: flex; flex-direction: column; gap: 30px;}
.services-container-page .service{display: flex; gap: 20px;}
.services-container-page .service .text{flex-basis: calc(50% - 10px); padding: 50px; border-radius: 5px;background: rgba(255, 255, 255, 0.88);box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.13);}
.services-container-page .service .text .title{color: #242D42;font-size: 23px;font-family: Rubik;font-style: normal;font-weight: 500;line-height: normal; padding-bottom: 40px; position: relative;}
.services-container-page .service .text .title::before {content: '';position: absolute;left: 0;width: 35px;height: 4px;border-radius: 30px;bottom: 20px; background-color: #CF1E29;}
.services-container-page .service .text .description{font-size: 15px; color: #242D42;}
.services-container-page .service .image{flex-basis: calc(50% - 10px); height: 375px; border-radius: 5px;}
.services-container-page .service .image img{width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}

/* services-additional */
.services-additional{display: flex; gap: 20px;}
.services-additional .service{flex-basis: calc(33.3333% - 10px);}
.services-additional .service .image{height: 300px; overflow: hidden;}
.services-additional .service:hover .image img{transform: scale(1.1);}
.services-additional .service .image img{width: 100%; height: 100%; object-fit: cover; transition: all 350ms;}
.services-additional .service .title{color: #FFF;text-align: center;font-size: 19px;font-family: Rubik;font-style: normal;font-weight: 500;line-height: normal; background: #242D42; display: flex; justify-content: center; align-items: center; padding: 15px 12px;}

/* contact-form-container */
.contact-form-container{display: flex; gap: 30px; justify-content: space-between;}
.contact-form-container .form-container{flex-basis: calc(50% - 15px);}
.contact-form-container .form-container .headline{color: #202020;font-size: 24px;font-family: Rubik;font-style: normal;font-weight: 500;line-height: 112%;}
.contact-form-container .form-container .subtitle{color: #8B8B8B;font-size: 20px;font-family: Rubik;font-style: normal;font-weight: 300;line-height: 112%;}
.contact-form-container .form-container form{margin-top: 50px;}
.contact-form-container .form-container form .input-half{display: flex; flex-wrap: wrap; gap: 10px;}
.contact-form-container .form-container form .input-half div{flex-basis: calc(50% - 5px);}
.contact-form-container .form-container form .input-half div input{width: 100%; padding: 10px; border-radius: 4px;border: 1px solid #CECECE;background: #FFF; color: #505050;font-size: 15px;font-family: Rubik;font-style: normal;font-weight: 300;line-height: 101.7%;}
.contact-form-container .form-container form #topic{margin-top: 10px; padding: 10px; border-radius: 4px;border: 1px solid #CECECE;background: #FFF; width: 100%; color: #505050;font-size: 15px;font-family: Rubik;font-style: normal;font-weight: 300;line-height: 101.7%;}
.contact-form-container .form-container form textarea{margin-top: 10px; padding: 10px; border-radius: 4px;border: 1px solid #CECECE;background: #FFF; width: 100%; color: #505050;font-size: 15px;font-family: Rubik;font-style: normal;font-weight: 300;line-height: 101.7%;}
.contact-form-container .form-container form .btn{padding: 15px 30px; border-radius: 5px;background: #192032; display: flex; justify-content: center; align-items: center; color: #B9C3E4;font-size: 16px;font-family: Rubik;font-style: normal;font-weight: 500;line-height: 102.5%; max-width: 191px; border:1px solid transparent; cursor: pointer;}

.contact-form-container .form-container form .rules label{display: flex;gap: 10px;align-items: flex-start;margin-top: 10px;margin-bottom: 20px;}

.contact-form-container .form-container form .rules label span p{color: #929292;font-size: 12px !important;font-family: Rubik;font-style: normal;font-weight: 300;line-height: 101.7%;}

.contact-form-container .contactImage{max-width: 505px; width: 100%; padding: 40px;border-radius: 6px;background: #242D42; position: relative;}
.contact-form-container .contactImage::before{content: ''; position: absolute; bottom: 0; right: 0; width: 136px;height: 36px; background-color: #F93943E0; border-bottom-right-radius: 6px;}
.contact-form-container .contactImage .company{color: #F2F2F2;font-size: 17px;font-family: Rubik;font-style: normal;font-weight: 500;line-height: normal; margin-bottom: 25px; text-transform: uppercase;}
.contact-form-container .contactImage .text .tag{color: #FFF;font-size: 16px;font-family: Rubik;font-style: normal;font-weight: 300;line-height: 102.5%; margin-bottom: 10px;}
.contact-form-container .contactImage .text .title,
.contact-form-container .contactImage .text .title a{color: #F2F2F2;font-size: 17px;font-family: Rubik;font-style: normal;font-weight: 500;line-height: normal; margin-bottom: 30px;}
.contact-form-container .contactImage .navigate{padding: 15px 12px; border-radius: 5px;background: #192032; display: flex; justify-content: center; align-items: center; color: #B9C3E4;font-size: 16px;font-family: Rubik;font-style: normal;font-weight: 500;line-height: 102.5%; max-width: 191px; margin-top: 50px; margin-bottom: 10px;}

/* gallery-categories */
.gallery-categories{display: flex; gap: 8px; margin-bottom: 60px; flex-wrap: wrap;}
.gallery-categories .gallery{ padding: 10px 20px;border: 1px solid;border-radius: 30px;font-size: 13px;}
.gallery-categories .gallery.active{background-color: #242D42; border-color: #242D42; color: #fff;}

/* contact map */
.map-container{margin-top: 100px; border-radius: 5px; height: 450px;}
.map-container .map{height: 100%; border-radius: 5px; width: 100%;}


@media screen and (max-width: 1600px){
  .services-container-page .service .image{height: auto;}
}

/* padding 50px */
@media screen and (max-width: 1350px){
  .quick-contact .quick-contact-container{padding-right: 50px;}
}


@media screen and (max-width: 1150px){
  .product-description .content .blocker{min-width: 10px;}
}

@media screen and (max-width: 1100px){
  .gallery-container .tile{flex-basis: calc(50% - 10px);}

  .product-page .image{height: 560px;}
}

/* padding 30px */

@media screen and (max-width: 1024px){
  header .container{padding: 0 30px;}
  .quick-contact .quick-contact-container{padding-right: 30px;}
  .banner-container .banner-content{padding: 0;}



  .statistics .statistics-container{gap: 15px;}
  .statistics .statistics-container .stats{padding: 30px;}
  .widget-products .content{gap: 15px; flex-wrap: wrap;}

  .widget-products .content .product{flex-basis: calc(50% - 10px);}



  .statistics .statistics-container{flex-wrap: wrap;}
  .statistics .statistics-container .stats{flex-basis: calc(50% - 10px);}
  .statistics .statistics-container .stats:nth-child(3){max-width: 100%;}

  .whyus-container .content-container .content{padding: 30px !important;}
    
  .ourpartners-container .content .image-container .splide__arrow--prev{left: 0em;}
  .ourpartners-container .content .image-container .splide__arrow--next{right: 0em;}

  footer .company-details .content{flex-wrap: wrap;}

  footer .bottom{padding: 20px 0;}
  footer .company-details .content .description, footer .company-details .content .description p{padding: 0;}

  .ourpartners-container .content{padding-bottom: 60px !important;}

  .seo-container{height: auto; position: relative;}
  .seo-container .content{position: relative; bottom: 0px; top: 50px; padding-bottom: 50px;}
  .seo-container .description{right: 0; left: 0; width: 100% !important; padding: 30px; position: relative;}


  .text-image-container{flex-wrap: wrap;}
  .text-image-container .texts{flex-basis: 100%;}
  .text-image-container .image{flex-basis: 100%;}
  .text-image-container .image img{width: 100%;}

  .text-image-container{padding: 30px;}

  .gallery-preview-container{padding-top: 60px; padding-bottom: 60px;}
  .gallery-preview-container .gallery-preview{gap: 15px; flex-wrap: wrap;}
  .gallery-preview-container .gallery-preview .image{flex-basis: calc(50% - 8px);}

  .services-additional{flex-wrap: wrap;}
  .services-additional .service{flex-basis: calc(50% - 10px);}


  .contact-form-container{flex-wrap: wrap; flex-direction: column-reverse;}
  .contact-form-container .contactImage{max-width: 100%;}


  .product-page .image{height: 515px;}
  .product-description{padding-top: 30px; padding-bottom: 60px;}

  .product-container{margin-bottom: 0; padding-bottom: 50px;}
  .product-page .image{height: 450px;}


  .related-products .content{gap: 20px; flex-wrap: wrap;}
  .related-products .content .related-product{flex-basis: calc(33.33333% - 15px); max-width: 100%;}
  .related-products .content .related-product .image{max-width: 100%; height: 350px;}
}

@media screen and (max-width: 950px){
  .products-container .product .image{height: 280px;}
  .products-container .product{flex-basis: calc(33.3333% - 11px);}
  .products-container{gap: 10px; row-gap: 20px;}

  .product-description .content .blocker{display: none;}
  .product-description .content .description{max-width: 100%;}
  .product-page .details{min-width: auto;}
  .product-description{padding-top: 30px; padding-bottom: 30px;}

  .product-page .image{height: 380px; min-width: 290px;}
}


@media screen and (max-width: 900px){
  .whyus-container .content-container{flex-wrap: wrap;}
  .whyus-container .content-container .content{flex-basis: 100%;}
  .whyus-container .content-container .image-container{flex-basis: 100%;}

  .services-container{display: flex;gap: 10px;z-index: 1;position: relative;margin-top: auto;padding-top: 30px;padding-bottom: 30px;flex-wrap: wrap;background: #242D42;justify-content: center;}
  /* .separator-blue{display: none;} */

  .services-container .service{flex-basis: calc(50% - 5px);}
  .services-container .service .name-tag{padding: 15px;}
}

@media screen and (max-width: 850px){
  header .nav .hamburger{display: flex;}
  header .nav .menu.active{right: 15px;}
  header .nav .menu{display: flex;gap: 20px;list-style: none;flex-wrap: wrap;flex-direction: column;position: absolute;top: 90px;background: #1F283C;padding: 50px 50px;border-radius: 2px;padding-top: 50px;padding-bottom: 50px;z-index: -1;right: -260px; transition: all 200ms; max-width: 260px;}

  .quick-contact{top: 57px;}
  .header-pillow{height: 84px;}

  .services-container-page .service{flex-direction: column;}
  .services-container-page .service .text{padding: 30px;}

  .related-products .content .related-product .image{height: 320px;}
}

@media screen and (max-width: 767px){
  header .nav .menu{top: 70px;}
  .quick-contact{display: none;}
  header .logo{width: 120px; height: 95px;}

  .banner-container .banner-content{padding-right: 30px !important;}

  .banner-container .banner-content .title,
   .banner-container .banner-content .title p{max-width: 390px;}


   .header-pillow{height: 55px;}

   body.page .main{padding-top: 60px; padding-bottom: 60px;}

   .pageTitle .content{padding: 0 30px;}

   .product-page{flex-direction: column; align-items: center;}
   .product-page .image{height: auto; max-width: 400px; width: auto;}
   .product-page .details{min-width: auto; width: 100%;}
   .product-container{padding-top: 50px;}
}

@media screen and (max-width: 650px){
  .services-additional .service{flex-basis: 100%;}

  .services-container-page .service .image{padding: 10px;}
  .services-container-page .service{gap: 0; box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.13); border-radius: 5px;}
  .services-container-page .service .text{box-shadow: none;}
  .services-additional .service .image{height: 235px;}


  .products-container .product{flex-basis: calc(50% - 11px);}
  .products-container .product .image{height: 320px;}

  .products-container .product .title{font-size: 15px;}
  .related-products .content .related-product .name{font-size: 15px;}


  .related-products .content .related-product{flex-basis: calc(50% - 15px);}
}

@media screen and (max-width: 600px){
  .services-container .service{flex-basis: calc(75% - 5px);}
  .services-container .service .name-tag{padding: 15px;}


  .statistics .statistics-container .stats{flex-basis: 100%;}


  .widget-products .content{gap: 12px; row-gap: 20px;} 
  .widget-products .content .product .image{height: 220px;}
  .widget-products .content .product{flex-basis: calc(50% - 6px);}


  .widget-products .buttons{flex-wrap: wrap; gap: 10px;}

  .widget-products .buttons a{height: 50px; flex-basis: 100%;}

  .services-container-page .service .text{padding: 15px;}


  .gallery-container{gap: 10px;}
  .gallery-container .tile{height: 220px; flex-basis: calc(50% - 5px);}

  .products-container .product{box-shadow: none;}

  .product-description .content .description{min-width: auto;}

  .related-products .content .related-product{box-shadow: none;}
  
}

@media screen and (max-width: 500px){
  header .container{padding: 0 15px;}
  body.scrolled header .logo{width: 120px; height: 95px; background-size: contain;}


  .products-container .product{flex-basis: calc(50% - 5px);}
  .products-container .product .image{height: 290px;}
}

@media screen and (max-width: 450px){
  .products-container .product .image{height: 230px;}

  .products-container .product .title{font-size: 13px;}

  .related-products .content .related-product .name{font-size: 13px;}

  .related-products .content{gap: 10px;}
  .related-products .content .related-product{flex-basis: calc(50% - 5px);}
  .related-products .content .related-product .image{height: 270px;}

  .pageTitle .content{padding: 0 15px;}

  body.page .main .content img{width: 100%;}
}

@media screen and (max-width: 420px){
  .banner-container .banner-content .subtitle{padding-right: 0; padding-bottom: 15px;}
  .banner-container .banner-content .subtitle::before{right: auto; top: auto; transform: none; bottom: 0; left: 0;}
  .widget-products .content{gap: 8px; row-gap: 20px;} 
  .widget-products .content .product .image{height: 210px;}
  .widget-products .content .product{flex-basis: calc(50% - 4px);}
}

@media screen and (max-width: 400px){
  .services-container .service{flex-basis: 100%;}
  .services-container .service .name-tag{padding: 10px; font-size: 14px;}

  .widget-products .buttons a .text{padding: 0 20px;}

  footer .bottom .content{flex-wrap: wrap; gap: 15px;}

  .widget-products .content .product .image .title{font-size: 12px;}

  .gallery-preview-container .gallery-preview .image{flex-basis: 100%;}

  .gallery-container .tile{height: 180px;}

  .gallery-categories .gallery{padding: 10px 11px;}

  .products-container .product .title{font-size: 12px;}

  .related-products .content .related-product .image{height: 220px;}
  
}
