body{padding:0;margin:0;background-color:#000;font-family:Nexa;font-weight:400;font-style:normal}
.fb-container{width:1470px;margin-left:auto;margin-right:auto}
.paragraph{font-size:15px;color:#fff}
section.HomeSec1{width:100%;height:100vh;display:flex;align-items:center;background:url(../images/home-bg.jpg);background-size:cover}
.head{display:flex;align-items:center;justify-content:space-between}
.header{position:absolute;width:100%;left:0;top:70px}
.langLink a{color:#fff;text-decoration:none;font-size:18px}
.menuContent{border-left:1px solid #fff;padding:25px 0 0 0;width:170px;transition:all .4s ease-in-out;position:fixed;top:42vh;z-index:999}
.menuItem{text-transform:uppercase;color:#808285;font-size:15px;font-weight:300;line-height:1.2;transition:all .3s ease-in-out;padding-bottom:25px}
.menuItem:last-child{padding-bottom:0}
.menuItem:hover{color:#fff}
.menuItem.menuItemBlack:hover{color:#000}
.menuItem.activeItem{color:#000;margin-left:10px}
.menuItem a{color:#fff;text-decoration:none;position:relative;padding-left:40px}
.menuItem.activeItem{color:#000;margin-left:0;position:relative}
.menuItem.activeItem::after{content:"";position:absolute;left:0;width:4px;height:30px;background:#fff;top:-5px}
section.HomeSec1 .paragraph{padding-top:55px}
.main-title{font-size:28px;color:#fff;font-weight:900}
.brands-header{padding-top:75px;padding-bottom:44px}
.brands-header .main-title{padding-bottom:28px}
.half-brand-inner{width:39%}
.half-brand{background:#0c0c0c;color:#fff;position:absolute;width:100%;padding:64px 75px 30px 60px}
.bleft .half-brand-inner{float:right}
.brand-info{position:relative;display:flex;width:100%;align-items:center}
.brand-mg{position:relative;z-index:1;margin-left:35px;width:50%}
.brands-container{padding-bottom:45px}
.brand-name{padding-bottom:27px;font-weight:600;color:#fff}
.brand-location{padding-bottom:65px;font-weight:600}
.brand-description{padding-bottom:40px}
.half-brand-inner,.half-brand-inner a{color:#fff;font-size:14px;font-weight:400}
.brand-link a{text-decoration:none;border-bottom:1px solid #fff;padding-bottom:5px;color:#fff}
.bright .brand-info{flex-direction:row-reverse}
.bright .brand-mg{margin-left:0;margin-right:35px}
.brand-mg img{width:100%;height:515px;object-fit:cover}
.WhatwedoSec{background:url(../images/whatwedo.jpg);background-repeat:no-repeat;background-size:contain;background-color:#0c0c0c;margin-top:70px;padding-bottom:100px}
.wwd-icon svg{width:auto;height:43px;padding-left:20px}
.wwd-icon{padding-bottom:19px}
.wwd-cn{padding-bottom:50px}
.WhatWeDo-Half{height:95vh;position:relative}
.WhatWeDo-HalfBG{background:url(../images/whatwedo-half.jpg);background-size:auto 100%;height:1018px;background-repeat:no-repeat;background-position:right;position:relative}
.WhatWeDo-HalfText{color:#fff;mix-blend-mode:difference;font-size:41px;z-index:29;font-weight:bolder;padding-top:141px}
.WhatWeDo-HalfBG-Text{color:#000;font-weight:400;padding-top:8%;padding-left:12%;width:70%}
.blog-head{padding-top:80px;padding-bottom:44px}
.blog-title{font-size:17px;font-weight:400;color:#fff}
.blog-cn.blog-full{position:relative}
.blog-full .blog-title{position:absolute;top:60px;left:80px}
.blog-full .brand-link{position:absolute;bottom:40px;left:80px}
.blog-mg img{width:100%;height:100%;object-fit:cover}
.blog-cn.blog-full .blog-mg{height:555px}
.blog-Shead .main-title{font-size:20px;font-weight:600;padding-top:75px;padding-bottom:30px}
.swiper{user-select:none;box-sizing:border-box;overflow:hidden;width:87%;padding:0 0;margin-left:0;margin-bottom:300px}
.swiper-slide{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;box-sizing:border-box;z-index:3}
.swiper-slide-content{width:100%;height:100%;display:flex;position:relative;z-index:1;box-sizing:border-box}
.blog-small .blog-mg{height:190px}
.blog-small .paragraph{padding-top:10px;font-weight:400}
.blog-pad{padding-left:20px}
.blog-link a{color:#fff;text-decoration:none;border-bottom:1px solid #fff;padding-bottom:5px;font-size:12px}
.blog-link{float:right;margin-bottom:12px}
.swiper-button-next,.swiper-button-prev{color:#fff}
.swiper-button-next,.swiper-rtl .swiper-button-prev{top:var(--swiper-navigation-top-offset,70%);right:var(--swiper-navigation-sides-offset,0);left:auto}
.swiper-button-prev,.swiper-rtl .swiper-button-next{top:var(--swiper-navigation-top-offset,83%);left:auto;right:var(--swiper-navigation-sides-offset,0)}
section#blog,section#contact{background:#0c0c0c}
.relative{position:relative}
.contact-cn{height:155px;padding:15px 130px;background:#fff;position:relative;display:flex;align-items:center;width:100%}
img.lineImage{position:absolute;top:-23px;left:70px}
.contact-cn a{color:#000;font-weight:600;text-decoration:none}
.contact-info{padding-left:50px;width:100%}
.social_links{display:flex}
.social_link-a{display:flex;align-items:center;margin-right:15px}
.social_link{width:21px;height:21px;margin-right:7px;display:flex}
.socialIcon{width:100%;height:100%}
.copywrites{font-size:12px;font-weight:600}
.socialCP{width:100%;display:flex;align-items:flex-end;justify-content:space-between}
.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,12px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,20px));background:0 0;opacity:.3;color:#fff}
.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity,1);background:0 0}
.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,0);top:var(--swiper-pagination-top,auto);right:0;width:auto;text-align:right;z-index:1;display:inline;left:auto}
#MenuItem{position:fixed;top:3%;right:0;z-index:10;display:none}
.menuItem6{display:none}
.menu{display:block}
section{overflow-x:hidden}
.project-data{padding-top:42vh}
.project-header{min-height:575px;display:flex;background:#0c0c0c}
.project-logo{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.project-header>div{width:100%}
.project-details .main-title{padding-top:70px;padding-bottom:28px}
.project-locotion{padding-bottom:65px}
.project-description{width:80%;padding-bottom:90px}
.project-locotion .paragraph{font-weight:600}
.project-images{--gap:0px;columns:2;column-gap:var(--gap);padding-bottom:180px}
.project-images>img{display:block;width:100%;margin-bottom:var(--gap);padding-bottom:56px}
.blog-details{padding-top:42vh;padding-bottom:100px}
.blog-details .project-details .main-title{padding-top:0}
.blog-images img{width:100%;object-fit:cover;height:500px;z-index:3;position:relative}
.blog-images img:nth-child(2){position:relative;margin-top:-80px;z-index:1}
.blog-images img:nth-child(3){position:relative;margin-top:-80px;right:40px;z-index:0}
.blog-images img:nth-child(1){right:40px}
.related-blog .blog-small{width:85%}
.related-blog{padding-bottom:80px}
.blog-small {
    width: 100%;
}
@media only screen and (min-width:2150px){
.fb-container{width:1880px}
}
@media only screen and (max-width:1680px){
.fb-container{width:1170px;margin-left:auto;margin-right:auto}
.brands-header .main-title{padding-bottom:0}
.brands-header{padding-top:60px;padding-bottom:30px}
.main-title{font-size:24px}
.brand-name{padding-bottom:15px}
.paragraph{font-size:14px}
.wwd-icon svg{width:auto;height:37px;padding-left:12px}
.wwd-cn{padding-bottom:35px}
.WhatwedoSec{background:url(../images/whatwedo.jpg);background-repeat:no-repeat;background-size:auto 68%;background-color:#0f0f0f;margin-top:55px;padding-bottom:60px}
.WhatWeDo-HalfBG{height:642px}
.WhatWeDo-HalfText{font-size:36px;padding-top:90px}
.contact-cn{padding:15px 37px 15px 130px}
.project-images{padding-bottom:100px}
.project-locotion{padding-bottom:50px}
.project-details .main-title{padding-top:60px;padding-bottom:20px}
.menuContent{top:40vh}
.project-data{padding-top:40vh}
.blog-images img{height:455px}
}
@media only screen and (max-width:1024px){
.fb-container{width:100%}
#MenuItem{display:block;z-index:2001;width:36px;height:28px;position:relative}
.menuItem6{display:block}
.stage{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.burgerIcon-container{position:relative;height:22px;width:36px;cursor:pointer}
.burgerIcon-container .line-bottom,.burgerIcon-container .line-middle,.burgerIcon-container .line-top{position:absolute;display:block;height:4px;width:36px;border-radius:2px;background:#fff}
.HomepageMenu .burgerIcon-container .line-bottom,.HomepageMenu .burgerIcon-container .line-middle,.HomepageMenu .burgerIcon-container .line-top{background-image:linear-gradient(to right,#fff,#fff);transition:all .4s ease-in-out}
.burgerIcon-container .line-top{top:0;transform-origin:34px 2px;background-image:linear-gradient(to right,#000,#000);border:.8px solid #535353;transition:all .4s ease-in-out}
.burgerIcon-container .line-middle{top:9px;transition:opacity .2s linear;background-image:linear-gradient(to right,#000 35%,#000 30%,#000 35%);border:.8px solid #535353;transition:all .4s ease-in-out}
.burgerIcon-container .line-bottom{bottom:0;transform-origin:34px 2px;background-image:linear-gradient(to right,#000,#000);border:.8px solid #535353;transition:all .4s ease-in-out}
.burgerIcon-container.is-open .line-top{animation:line-top-out .6s linear normal;animation-fill-mode:forwards}
.burgerIcon-container.is-open .line-middle{opacity:0}
.burgerIcon-container.is-open .line-bottom{animation:line-bot-out .6s linear normal;animation-fill-mode:forwards}
.burgerIcon-container.is-closed .line-top{animation:line-top-in .6s linear normal;animation-fill-mode:forwards}
.burgerIcon-container.is-closed .line-middle{transition-delay:.2s}
.burgerIcon-container.is-closed .line-bottom{animation:line-bot-in .6s linear normal;animation-fill-mode:forwards}
.menu{display:none}
.menu.open{display:flex!important;position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;align-items:center;z-index:2000;background:rgb(0 0 0 / 90%);margin:0;flex-direction:column;padding:0;border-left:none}
.langLink{display:none}
.brands-header{padding-bottom:100px}
.half-brand{padding:15px 24px 20px 35px}
.brand-location{padding-bottom:20px;font-weight:600}
.brand-description{padding-bottom:12px}
section.HomeSec1{height:55vh;background-position:center}
.half-brand-inner,.half-brand-inner a{font-size:13px;font-weight:400}
.contact-cn{height:auto;padding:95px 0 50px 0}
.contact-info{padding-left:15px}
.copywrites{padding-top:15px}
.WhatwedoSec{background-size:auto 50%}
.WhatWeDo-HalfBG{height:460px}
.WhatWeDo-HalfBG-Text{color:#000;font-weight:400;padding-top:4%;padding-left:8%;width:90%}
.WhatWeDo-HalfText{font-size:35px;padding-top:50px;text-align:center}
.blog-cn.blog-full .blog-mg{height:390px}
.blog-Shead .main-title{font-size:19px;font-weight:600;padding-top:50px;padding-bottom:20px}
.socialCP{display:block}
img.lineImage{position:absolute;top:-23px;left:15px}
.header{position:absolute;width:100%;left:0;top:0}
.head{display:flex;align-items:center;justify-content:space-between;position:fixed;align-items:center;justify-content:space-between;width:100%;background:#000;padding:15px 10px;z-index:9999}
.menuItem a{padding-left:0}
.menuItem.activeItem::after{display:none}
.menuItem{font-size:20px}
.project-details .main-title{padding-top:45px;padding-bottom:20px}
.project-locotion{padding-bottom:35px}
.project-description{width:95%;padding-bottom:50px}
.project-header{min-height:500px}
.project-images>img{padding-bottom:25px}
.project-images{padding-bottom:80px}
.project-data{padding-top:15%}
.blog-details{padding-top:15vh;padding-bottom:0}
.blog-images img{height:320px}
.swiper{margin-bottom:110px}
.brand-mg img{height:400px}
}
@media only screen and (max-width:650px){
.fb-container{width:94%}
.header .fb-container{width:100%}
.brand-info{display:block;width:100%}
.brand-mg{margin-left:0;width:100%}
.half-brand{position:relative;width:100%;padding:15px 0 20px 0}
.half-brand-inner{width:108%;padding-bottom:50px;padding-top:10px}
.bleft .half-brand-inner{float:none}
.swiper-button-prev,.swiper-rtl .swiper-button-next{top:var(--swiper-navigation-top-offset,110%);left:var(--swiper-navigation-sides-offset,0);right:auto}
.swiper-button-next,.swiper-rtl .swiper-button-prev{top:var(--swiper-navigation-top-offset,110%);right:var(--swiper-navigation-sides-offset,0);left:auto}
.swiper-button-next,.swiper-button-prev{z-index:99}
.swiper{width:100%;margin-bottom:200px}
.WhatWeDo-HalfBG{background-size:cover}
section.HomeSec1 .paragraph{padding-top:100px}
.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,-60px);top:var(--swiper-pagination-top,auto);right:0;width:100%;text-align:center;z-index:1;display:inline;left:auto}
.logo img{width:85px}
.paragraph{font-size:15px}
.half-brand-inner,.half-brand-inner a{font-size:15px;font-weight:400}
.blog-full .blog-title{top:auto;left:10px;bottom:50px}
.blog-full .brand-link{bottom:23px;left:10px}
.project-images{columns:1}
.project-details{text-align:center}
.project-description{width:100%;padding-bottom:55px}
.project-images>img{padding-bottom:25px}
.blog-details .project-details{padding-bottom:40px}
.blog-images img:nth-child(1){right:0}
.blog-images img:nth-child(3){right:0}
.related-blog .blog-small{width:100%}
.brand-mg img{height:auto}
}
@keyframes line-bot-in{
0%{left:-5px;transform:rotate(45deg)}
20%{left:-5px;bot:0;transform:rotate(60deg)}
80%{left:0;bot:0;transform:rotate(-15deg)}
100%{left:0;transform:rotate(0)}
}
@keyframes line-bot-out{
0%{left:0;transform:rotate(0)}
20%{left:0;transform:rotate(-15deg)}
80%{left:-5px;transform:rotate(60deg)}
100%{left:-5px;transform:rotate(45deg)}
}
@keyframes line-top-in{
0%{left:-5px;bot:0;transform:rotate(-45deg)}
20%{left:-5px;bot:0;transform:rotate(-60deg)}
80%{left:0;bot:0;transform:rotate(15deg)}
100%{left:0;bot:1px;transform:rotate(0)}
}
@keyframes line-top-out{
0%{left:0;top:-5px;transform:rotate(0)}
20%{left:0;top:-5px;transform:rotate(15deg)}
80%{left:-5px;top:-5px;transform:rotate(-60deg)}
100%{left:-5px;top:-5px;transform:rotate(-45deg)}
}
@keyframes bgMenuMain{
0%{background-image:linear-gradient(170deg,rgba(0,0,0,.1) 40%,rgba(0,0,0,.1) 51%)}
20%{background-image:linear-gradient(170deg,rgba(0,0,0,.2) 40%,rgba(0,0,0,.2) 51%)}
30%{background-image:linear-gradient(170deg,rgba(0,0,0,.4) 40%,rgba(0,0,0,.4) 51%)}
100%{background-image:linear-gradient(170deg,rgba(0,0,0,.8) 40%,rgba(0,0,0,.8) 51%)}
}
@keyframes fadeInMenuItem{
0%{opacity:0}
100%{opacity:1}
}
@-webkit-keyframes line-bot-in{
0%{left:-5px;transform:rotate(45deg)}
20%{left:-5px;bot:0;transform:rotate(60deg)}
80%{left:0;bot:0;transform:rotate(-15deg)}
100%{left:0;transform:rotate(0)}
}
@-webkit-keyframes line-bot-out{
0%{left:0;transform:rotate(0)}
20%{left:0;transform:rotate(-15deg)}
80%{left:-5px;transform:rotate(60deg)}
100%{left:-5px;transform:rotate(45deg)}
}
@-webkit-keyframes line-top-in{
0%{left:-5px;bot:0;transform:rotate(-45deg)}
20%{left:-5px;bot:0;transform:rotate(-60deg)}
80%{left:0;bot:0;transform:rotate(15deg)}
100%{left:0;bot:1px;transform:rotate(0)}
}
@-webkit-keyframes line-top-out{
0%{left:0;top:0;transform:rotate(0)}
20%{left:0;top:0;transform:rotate(15deg)}
80%{left:-5px;top:0;transform:rotate(-60deg)}
100%{left:-5px;top:1px;transform:rotate(-45deg)}
}
@-webkit-keyframes bgMenuMain{
0%{background-image:linear-gradient(170deg,rgba(0,0,0,.1) 40%,rgba(0,0,0,.1) 51%)}
20%{background-image:linear-gradient(170deg,rgba(0,0,0,.2) 40%,rgba(0,0,0,.2) 51%)}
30%{background-image:linear-gradient(170deg,rgba(0,0,0,.4) 40%,rgba(0,0,0,.4) 51%)}
100%{background-image:linear-gradient(170deg,rgba(0,0,0,.8) 40%,rgba(0,0,0,.8) 51%)}
}
@-webkit-keyframes fadeInMenuItem{
0%{opacity:0}
100%{opacity:1}
}
@-webkit-keyframes slit-in-horizontal{
0%{-webkit-transform:translateZ(-800px) rotateX(90deg);transform:translateZ(-800px) rotateX(90deg);opacity:0}
54%{-webkit-transform:translateZ(-160px) rotateX(87deg);transform:translateZ(-160px) rotateX(87deg);opacity:1}
100%{-webkit-transform:translateZ(0) rotateX(0);transform:translateZ(0) rotateX(0);opacity:1}
}
@keyframes slit-in-horizontal{
0%{-webkit-transform:translateZ(-800px) rotateX(90deg);transform:translateZ(-800px) rotateX(90deg);opacity:0}
54%{-webkit-transform:translateZ(-160px) rotateX(87deg);transform:translateZ(-160px) rotateX(87deg);opacity:1}
100%{-webkit-transform:translateZ(0) rotateX(0);transform:translateZ(0) rotateX(0);opacity:1}
}
.scale-down-center{-webkit-animation:scale-down-center .4s cubic-bezier(.25,.46,.45,.94) reverse both;animation:scale-down-center .4s cubic-bezier(.25,.46,.45,.94) reverse both}
@keyframes scale-down-center{
0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
100%{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}
}
@keyframes leftToRight{
0%{left:-100%}
100%{left:0}
}