body{font-family:var(--content);color:var(--color-body);overflow-x:hidden;}

header { position:relative;}
header .center { display:flex; align-items:center; justify-content:space-between; gap:20px }
header:before { width:50%; height:4px; background:var(--color-main); position: absolute; top: 0; left: 0; content: '';}
header:after { width:50%; height:4px; background:var(--color-second); position: absolute; top: 0; right: 0; content: '';}
header .header-right { display:flex; align-items:center; gap:30px }
header .header-right .lang-btn>a { display:block; background:var(--color-silver); color:var(--color-main); line-height:48px; width:48px; text-align: center; border-radius: 48px}


body.kz #cssmenu>ul>li>a {font-size: 12px; padding: 0 15px}
body.kz #cssmenu .has-sub:before { right: 0px;}

body.ru #cssmenu>ul>li>a {font-size: 12px; padding: 0 15px}
body.ru #cssmenu .has-sub:before { right: 0px;}

header .header-right .lang-btn>a>span { color:var(--color-main); font-weight:700; font-size: 13px; display: inline-block; vertical-align:text-top;}
header:before { width:50%; height:4px; background:var(--color-second); position:absolute; top:0; left:0; content:''; }
header:after { width:50%; height:4px; background:var(--color-main); position:absolute; top:0; right:0; content:''; }
header .header-right .lang-btn { position:relative; }
header .header-right .lang-btn ul { display: none; position: absolute;z-index: 999;background:var(--color-white); border-radius: 3px; list-style: none; box-shadow: 0 0 20px rgba(0,0,0,.15); width: 120px; padding:10px 0; margin: auto;  right: 0; top:120%}
header .header-right .lang-btn ul li a { color:var(--color-main); font-size: 14px; font-weight: 500; display: block; padding: 5px 15px; }
header .header-right .lang-btn ul li a:hover { color:var(--color-second); }
header .header-right .lang-btn { position: relative; }
header .header-right .lang-btn ul:before { position: absolute; top:-11px; content:'\f0d8'; right: 20px; display: block; font-weight: 600; font-family:'Font Awesome 6 Free'; color:var(--color-white); text-align: center;}

.banner-mobile { display:none; }

.cat-box img {transition: transform .2s;}
.cat-box:hover img {transform: scale(1.1);}
.cat-box a { position:relative; display: block; overflow: hidden;}
.cat-box .overlay {background: rgb(49,192,125); background: linear-gradient(180deg, rgba(49,192,125,0) 0%, rgba(3,13,8,1) 100%); }
.cat-box .cat-ex { position:absolute; left:40px; right:40px; bottom:60px }
.cat-box .cat-ex h3, .news-box .nb-ex p { color:var(--color-white); }
.cat-box .cat-ex p { font-size:14px }

.benefits { display:flex; gap:30px; margin:20px 0 20px 0 }
.benefits .icon-box { display:flex; align-items:center; gap:10px; font-size:12px; border-radius: 6px; border:1px solid var(--color-grey); padding:5px 15px;}
.benefits .icon-ex  span { font-size:12px; font-weight:600; color:var(--color-main); }

.add-info .info-content { padding:30px ; border-radius:6px; background:var(--color-silver); }

.contact-page .center { background:var(--color-white);}
.map { position:relative; z-index:1 }

.news-image { margin-bottom:20px }

.related { background:var(--color-silver); }

.page ul { list-style:disc; font-size:14px; margin:20px }

.address ul{list-style:none}
.address ul li{display:flex;align-items:center;margin-bottom:20px}
.address ul li .icon{width:52px;height:52px;line-height:52px;min-width:52px;background:var(--color-main);color:var(--color-white);border-radius:3px;text-align:center;font-size:18px;margin-right:20px}
.address ul li small{display:block;font-weight:600;color:var(--color-main);}
.address ul li a{color:var(--color-main)}
.address ol{display:flex;gap:10px;list-style:none}
.address ol li a{display:flex;align-items:center;margin-bottom:20px;background:var(--color-main);padding:0 20px 0 0;border-radius:3px}
.address ol li .icon{width:52px;height:52px;line-height:52px;min-width:52px;color:var(--color-white);border-radius:3px;text-align:center;font-size:18px;margin-right:0}
.address ol li small{display:block;font-weight:600;color:var(--color-white);font-size:14px}
.address ol li a{color:var(--color-main);font-size:12px;color:#var(--color-white)}
.address ol li a:hover{background:var(--color-second)}

.slider{position:relative;overflow:hidden}
.slider .owl-item.active span{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInDown;animation-delay:.6s}
.slider .owl-item.active .slide-content img{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInUp;animation-delay:.6s}
.slider .owl-item.active p{display:block;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInDown;animation-delay:.2s}
.slider .owl-item.active .scroll-down{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInUp;animation-delay:.6s}
.slider .owl-item.active .btn,.slider .owl-item.active .video-btn{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInUp;animation-delay:1s}
.overlay{position:absolute;top:0;left:0;right:0;bottom:0;}
.slider .overlay .center { display:flex; height:100%; width:100% }
.slider .overlay .slide-content { display:flex;width:100%;height:100%;}
.slider .overlay .slide-content .text { height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.slider .overlay .slide-content .image { height:100%; display:flex; align-items:flex-end; }
.slider .overlay .slide-content span{font-size:72px;color:var(--color-white);font-weight:800;margin-bottom:10px;display:block;font-family: var(--title);letter-spacing:-1px;position:relative;}
.slider .overlay .slide-content span:before{font-family:var(--title);letter-spacing:4px;color:var(--color-white);text-transform:uppercase;font-weight:400;position:absolute;top:-30px;left:2px;content:attr(data-text);font-size:14px}
.slider .overlay .slide-content small{color:var(--color-white);display:block;font-size:20px;margin-bottom:15px}
.slider .overlay .slide-content p{display:block;width:100%;font-size:20px;color:var(--color-white);font-weight:400;}
.slider .overlay .slide-content img { display:inline-block !important; width:auto !important }
.slider .owl-item.active img{width:100%;object-fit:cover;object-position:center;animation:move 40s ease;-ms-animation:move 40s ease;-webkit-animation:move 40s ease;-0-animation:move 40s ease;-moz-animation:move 40s ease}
@-webkit-keyframes move {
0%{-webkit-transform-origin:bottom left;-moz-transform-origin:center center;-ms-transform-origin:center center;-o-transform-origin:center center;transform-origin:center center;transform:scale(1.0);-ms-transform:scale(1.0);-webkit-transform:scale(1.0);-o-transform:scale(1.0);-moz-transform:scale(1.0)}
100%{transform:scale(1.2);-ms-transform:scale(1.2);-webkit-transform:scale(1.2);-o-transform:scale(1.2);-moz-transform:scale(1.2)}
}
.slider .owl-carousel .owl-nav button.owl-prev,.slider .owl-carousel .owl-nav button.owl-next{position:absolute;top:45%;background:var(--transparent);width:42px;height:42px;color:var(--color-grey);border-radius:42px;line-height:44px;}
.slider .owl-carousel .owl-nav button.owl-next span,.slider .owl-carousel .owl-nav button.owl-prev span{font-size:25px;line-height:25px}
.slider .owl-carousel .owl-nav button.owl-prev{left:30px}
.slider .owl-carousel .owl-nav button.owl-next{right:30px}

.feature-box { position:relative; padding:40px 40px 40px 100px; overflow:hidden; cursor:default; }
.feature-box h4 { color:var(--color-second); }
.feature-box p { color:var(--color-white); }
.features .feature-box:nth-child(1) { background:var(--color-green-a); }
.features .feature-box:nth-child(2) { background:var(--color-green-b); }
.features .feature-box:nth-child(3) { background:var(--color-green-c); }
.features .feature-box:nth-child(4) { background:var(--color-green-d); }
.feature-box img{position:absolute;left:0;bottom:0;transition:transform .5s ease}
.feature-box:hover img{transform:scale(1.5)}

.text .text-content { width:100%; max-width:720px; padding:0 30px 0 0}

.our-sub { background:var(--color-green-a); overflow:hidden; }
.our-sub .box { position:relative; z-index:99 }
.our-sub h3, .our-sub p { color:var(--color-white); }
.our-sub .box:nth-child(1) { padding-right:40px }
.our-sub:before { position: absolute; width:270px; height: 100%; content: ""; background:url('../img/middle.svg') center; background-size: cover; background-repeat: no-repeat; top: 0; left: 0; right: 0; bottom: 0; margin: auto}
.our-sub:after { position: absolute; width:50%; height: 100%; content: ""; background:var(--color-green-d); right: 0; top: 0; bottom: 0; z-index: 1}

.our { background:url('../img/world-map.svg'); background-repeat:no-repeat; background-position:top center; background-size:cover }
.our .center { max-width:960px; text-align: center;}
.our h3 { color:var(--color-main); }

.subs .sub-box .sub-image { box-shadow:10px 20px 40px var(--shadow); }
.subs .sub-box .sub-image img { border-radius:3px }
.subs .sub-box .sub-ex { padding:30px }

.news-box a { display:block; position:relative; border-radius:6px; overflow:hidden; }
.news-box .overlay {background: rgb(49,192,125); background: linear-gradient(180deg, rgba(49,192,125,0) 0%, rgba(3,13,8,1) 100%); }
.news-box .nb-ex { position:absolute; left:40px; right:40px; bottom:60px }
.news-box .nb-ex h4, .news-box .nb-ex p { color:var(--color-white); }
.news-box .nb-ex p { font-size:14px }

.home-faq:before { background:var(--color-silver); content: ''; width: 50%; height: 100%; position: absolute; top: 0; r.gbt: 0; bottom: 0}
.faq-ac h3 { color: var(--color-dark); border-bottom: 1px solid var(--color-grey); justify-content: flex-start; font-size: 15px; display: flex; gap: 20px; align-items: center; padding: 20px 20px 20px 0; margin-bottom: 0; cursor: pointer; font-weight: 500; }
.faq-ac h3:hover,.faq-ac h3.ui-state-active{color:var(--color-main);}
.faq-ac .faq-content{text-align:left;padding:20px 0}
.faq-ac .faq-content p{font-size:14px}
.faq-ac .faq-content p:last-child{margin-bottom:0}
.faq-ac h3 span{}
.faq-ac h3:last-child { border-bottom:none !important; }

.faq-list .faq-box { margin-bottom:80px }

.form .btn-g { width:100%; text-align:center; }

.g-box img { object-fit:cover; object-position:top; width:100%; height:10em }
.hg-box img { object-fit:cover; object-position:center; width:100%; height:16em }

.sidebar-content { display:flex; gap:40px}
.sidebar-content .content { width:100% }
.sidebar-content .content ul { margin:30px; list-style:disc; line-height:30px }
.sidebar-content .sidebar { width:25%; min-width:320px }
.side-menu { background:var(--color-main); border-radius: 6px;position: sticky; top: 240px }
.side-menu ul { list-style:none; padding:30px 0}
.side-menu ul li a { display:block; padding:15px 30px; font-size:14px; font-family:var(--title); color:var(--color-white); border-bottom:1px solid var(--color-light); }
.side-menu ul li:last-child a { border-bottom:none; }
.side-menu ul li a:hover, .side-menu ul li.active a { opacity:.7 }

footer { background:var(--color-dark); }
footer h5 { color:var(--color-white); margin-bottom:20px}

footer .center { display:flex; align-items:flex-start; justify-content:space-between; gap:40px }

.f-social ul { list-style:none; margin-top:10px }
.f-social ul li { display:inline-block; }
.f-social ul li a { display:block;background: rgb(255,213,41); background: linear-gradient(180deg, rgba(255,213,41,1) 0%, rgba(12,127,64,1) 100%); width:42px; height:42px; line-height:42px; text-align:center; border-radius:42px; color:var(--color-white); }
.f-social ul li a:hover { background:var(--color-main); }

.f-nav ul li { display:block; padding:4px 0 }
.f-nav ul li a { color:var(--color-white); font-size:14px }
.f-nav ul li a:hover { opacity:.7 }

.f-contact { text-align:right; }
.f-contact p { margin-bottom:5px; font-size: 14px; color: var(--color-white);}

.bottom { background:var(--color-dark); text-align:center; border-top:1px solid var(--transparent); }

#cssmenu{position:relative; z-index:99; font-family:var(--nav);}
#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #menu-button{list-style:none;display:block;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
#cssmenu>ul>li>a {display: block; font-size: 14px; font-weight:700; color:var(--color-main);padding:0 20px; line-height:170px; letter-spacing:-0.5px}
#cssmenu>ul>li.active>a, #cssmenu ul li:hover>a { color:var(--color-second); position: relative;}
#cssmenu>ul>li.active>a:before, #cssmenu ul li:hover>a:before {content:""; position: absolute; bottom: 0; left: 0; right: 0; height: 4px; background: var(--color-main);}
#cssmenu #menu-button{display:none;}
#cssmenu > ul > li{ display: inline-block;}
#cssmenu ul ul{position:absolute;left:-9999px;text-align: left;background:var(--color-main); padding:12px 0px;}
#cssmenu.align-right ul ul{text-align:right}
#cssmenu li:hover > ul{left:auto}
#cssmenu.align-right li:hover > ul{left:auto;right:0}
#cssmenu ul ul ul{margin-left:100%;top:0;}
#cssmenu.align-right ul ul ul{margin-left:0;margin-right:100%;}
#cssmenu ul ul li a{padding:10px 20px;font-size: 13px; display:block;width:240px;text-decoration:none;color:var(--color-white);font-weight:700;position:relative;}
#cssmenu ul ul li a:hover { background:color:var(--color-main); color:var(--color-white); opacity: .6;}
#cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a{border-bottom:0}
#cssmenu .has-sub { position: relative; }
#cssmenu .has-sub>a { padding-right: 40px; }
#cssmenu .has-sub:before { content: '\f107'; font-family:var(--faw); font-size: 12px; font-weight: 600; position: absolute; right: 20px; line-height:170px; color:var(--color-main); }
#cssmenu .has-sub:hover:before {color:var(--color-second);content: '\f106'; font-family:var(--faw); font-weight: 600;}
#cssmenu .active.has-sub:before {color:var(--color-second); }

@media only screen and (max-width:1249px) {
    #cssmenu>ul>li.active>a, #cssmenu ul li:hover>a { opacity:1;position: relative;}
    #cssmenu {position: absolute;left: 0;right: 0;width: auto;text-align: left;margin:0;}
    #cssmenu>ul>li>a:hover { background:var(--color-dark);color:var(--color-white)}
    #cssmenu > ul { margin: 0 0 0 0; position: relative;}
    #cssmenu>ul{display:none; z-index:9; position: absolute; top:60px;left:10px; right:10px}
    #cssmenu ul{display:none; z-index:9; position: absolute;}
    #cssmenu:after,#cssmenu > ul:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
    #cssmenu.align-center > ul,#cssmenu.align-right ul ul{text-align:left;}
    #cssmenu ul li,#cssmenu ul ul li,#cssmenu ul li:hover > ul > li{width:100%;height:auto;}
    #cssmenu > ul > li,#cssmenu.align-center > ul > li,#cssmenu.align-right > ul > li{float:none;display:block;}
    #cssmenu>ul>ul>li>a{font-size:12px;color:var(--color-white);background:none;padding:15px 20px 20px 30px;}
    #cssmenu>ul>li>a { padding:20px !important; color:var(--color-white) !important; display: block; background:color:var(--color-main); font-size: 14px; line-height: normal !important;border-bottom:1px solid var(--color-light);}
    #cssmenu>ul>li:last-child>a{border-bottom:none}
    #cssmenu>ul>li { background:var(--color-main); margin:0 }
    #cssmenu ul ul li a { padding:15px 20px; }
    #cssmenu ul ul { padding: 0 !important }
    #cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover{color:var(--color-white); background:var(--color-main)}
    #cssmenu ul ul li > a,#cssmenu ul ul li a {background:var(--color-white)}
    #cssmenu ul ul ul li a{padding-left:40px;}
    #cssmenu ul ul ul ul li a{padding-left:40px;}
    #cssmenu>ul>li { border-right:none; }
    #cssmenu ul ul,#cssmenu ul ul ul{position:relative;left:0;right:auto;width:100%;margin:0;}
    #cssmenu #menu-button{display:block;color:var(--color-main);cursor:pointer;font-size:12px;height:48px; background:var(--color-dark); width: 48px; position: absolute; top:-24px; right:20px; border-radius: 50px;}
    #cssmenu .submenu-button{position:absolute;z-index:10;right:0;top:0;display:block;border-left:1px solid var(--color-light);height:55px;width:55px;cursor:pointer;}
    #cssmenu .submenu-button::after{content:'';position:absolute;top:21px;left:26px;display:block;width:1px;height:11px;background:var(--color-white);z-index:99;}
    #cssmenu .submenu-button::before{content:'';position:absolute;left:21px;top:26px;display:block;width:11px;height:1px;background:var(--color-white);z-index:99;}
    #cssmenu ul li a,#cssmenu ul ul li a{width:100%;}
    #cssmenu > ul > li.has-sub > a::after,#cssmenu ul ul li.has-sub > a::after,#menu-line,#cssmenu .submenu-button.submenu-opened:after{display:none;}
    #cssmenu ul ul li a { color: var(--color-white); background:var(--colo-main); }
    #cssmenu ul ul{ border-bottom: none; }
    #cssmenu ul ul li a{border-bottom:1px solid var(--color-light);}
    #menu-button{width:55px;height:46px;position:absolute;right:0;top:0;cursor:pointer;z-index: 12399994;}
    #menu-button:after{-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; margin:auto;position:absolute;top:24px;right:0;left:0;display:block;height:4px;width:20px;border-top:2px solid #dddddd;border-bottom:2px solid #dddddd;content:''}
    #menu-button:before{-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; margin:auto;-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;position:absolute;top:17px;right:0;left:0;display:block;height:2px;width:20px;background:#ddd;content:''}
    #menu-button.menu-opened:after{-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;top:22px;border:0;height:2px;width:19px;background:var(--color-white);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}
    #menu-button.menu-opened:before{top:22px;background:var(--color-white);width:19px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}
    #cssmenu .has-sub:before{display: none;}

    header { padding:20px 0 }
    .shopping { position:fixed; right:20px; bottom:30px; z-index:99 }
    .logo { max-width:90px }
    .slider .slide img { object-fit:cover; height:60vh }
    .slider .overlay .slide-content .image{ display:none; }
    .slider .overlay .slide-content span { font-size:30px }
    .slider .overlay .slide-content p { font-size:15px }
    .features  .center { padding:0 }
    .features  .center .col-4 { grid-template-columns: repeat(2,1fr);}
    .feature-box { padding:30px}
    .feature-box img { display: none;}
    .feature-box p { font-size:14px; margin:0 }
    .wwd .text, .wwd .image { padding:0 30px; text-align:center; }
    .wwd .text-content h3:before { left:0; right:0; margin:auto; }
    .our { padding-top:40px !important } 
    .our-sub:before { display:none; }
    .our-sub .col-2 { gap:0; text-align: center;}
    .home-faq .col-2 { gap:0;}
    .contact-form { margin-top:80px }
    .our-sub .col-2 img { max-width:72px; }
    .our-sub:after { width:100%; height:50%; bottom:0; top:auto }
    .home-faq:before { width:100%; height:47%; bottom:0; top:auto }
    .our-sub .box:nth-child(1) { padding-right:0 }
    .our-sub .box:nth-child(2) { padding-top:40px; margin-top:40px } 
    footer .center {flex-direction: column;align-items: center; text-align: center;}
    .f-contact { text-align:center; }
    p { font-size:15px }
    header .header-right .lang-btn { margin-right:50px }

    .banner-mobile { display:block; }
    .banner-desktop { display:none; }


}