@font-face{font-family:'Charmonman';src:url(../fonts/Charmonman-Regular.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Charmonman';src:url(../fonts/Charmonman-Bold.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Josefin Sans';src:url(../fonts/JosefinSans-Light.woff) format("woff");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Josefin Sans';src:url(../fonts/JosefinSans-Regular.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
:before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
body{background:#f6f8f9;overflow:hidden;overflow-y:auto}
body.active{overflow:hidden}
body,ul,ol,li,h1,h2,h3,h4,h5,h6,figure,p,strong{padding:0;margin:0;list-style:none;font-family:Arial,"sans-serif"}
body,p,li{font-size:18px;line-height:25px}
p + p{margin-top:20px}
a,a:hover,a:focus,.btn,button{text-decoration:none;outline:none}
small{font-size:100%}
h1,h2,h3,h4{font-family:'Charmonman';font-weight:700}
.mobileItem{display:none}
section{padding:120px 0 100px;min-height:100vh}
section h2{margin-bottom:50px;display:block;text-align:center;font-size:50px}
section h2 span{display:block;font-size:16px;color:#fff;background:linear-gradient(to right,#fff,#e3e3e3,#e3e3e3,#e3e3e3);-webkit-background-clip:text;font-weight:400}
.img-responsive{max-width:100%;height:auto;max-height:100%}
.btn:focus,a:focus{outline:none!important}
.navbar{height:60px;border:none;color:#f0f0e6;z-index:100;margin-bottom:0;border-radius:0;transition:background 1s ease 0;/*border-bottom:#ffffff21 solid 1px;*/background:transparent}
.navbar-brand{margin-top:3px;display:none;color:#f0f0e6;font-weight:400}
.navbar-default .navbar-nav > li > a{padding:0 15px;margin:0 2px;color:#f0f0e6;font-weight:500;font-family:'Charmonman';font-size:20px;border-radius:5px;transition:.5s;line-height:60px}
.navbar-default .navbar-nav > li > a:hover,.navbar-default .navbar-nav > li > a:active,.navbar-default .navbar-nav > li > a:focus{color:#f0f0e6}
.navbar-default .navbar-nav > li > a:visited{color:#f0f0e6;text-decoration:none}
.navbar-default .navbar-nav > .active > a,.navbar-default .navbar-nav > .active > a:hover,.navbar-default .navbar-nav > .active > a:focus{background:transparent;color:#f0f0e6}
.navbar-default .navbar-toggle{margin-top:13px;border-color:#f0f0e6}
.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{background:#B68E52}
.navbar-default .navbar-toggle .icon-bar{color:#f0f0e6;background:#f0f0e6}
.navbar-default .navbar-collapse.collapse.in ul{background:#B68E52}
.navbar.solid{background:#000;transition:background 1s ease 0;box-shadow:0 0 4px rgba(7,55,74,0.2);border-bottom:#ffffff21 solid 1px;}
.navbar.solid .navbar-brand{display:inline-block;color:#f0f0e6;transition:color 1s ease 0;background:linear-gradient(to right,#865307,#F7EC84,#865307);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-family:'Charmonman';font-size:25px;line-height:30px;font-weight:700}
.navbar.solid .navbar-nav > li > a{color:#f0f0e6;transition:color 1s ease 0}
.navbar .navbar-nav > li:hover > a{background:linear-gradient(to right,#865307,#F7EC84,#865307);-webkit-text-fill-color:transparent;-webkit-background-clip:text;transition:.5s}
.cover{padding:10% 0}
.cover.bottom{padding:10% 0}
.back-to-top{display:none}
.back-to-top.visible{display:block}
.whiteBg{background:#fff}
.whiteBg h2{color:#1b1b1b}
.garyBg{background:#1b1b1b}
.garyBg h2{background:linear-gradient(to right,#865307,#865307,#F7EC84,#F7EC84);-webkit-text-fill-color:transparent;-webkit-background-clip:text}
.blackBg{background:#000}
.blackBg h2{background:linear-gradient(to right,#865307,#865307,#F7EC84,#F7EC84);-webkit-text-fill-color:transparent;-webkit-background-clip:text}
.goldenBg{background:#B68E52}
.goldenBg h2{color:#1b1b1b}
.greenBg{background:#07374a}
.greenBg h2{color:#25b79f}
.welcomeSection{padding:0 15px;display:flex;height:100vh;text-align:center;background:#000;align-items:center;justify-content:center;position:relative}
.welcomeSection canvas{ position: absolute; top:0px;left:0px; width:100%; height:100%;}
.welcomeSection figure{padding:30px 0 0;height:200px;display:flex;align-items:center;justify-content:center}
.welcomeSection .welcomBox{padding:0 15px;margin:0 auto;display:block;text-align:center;width:100%}
.welcomeSection .welcomBox h1{background:linear-gradient(to right,#865307,#F7EC84,#865307);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-family:'Charmonman';font-size:25px;line-height:30px;font-weight:600}
.welcomeSection .scrollTopItem{margin-left:-22px;font-size:13px;color:#dec66b;border:solid 2px #dec66b;border-radius:50%;padding:10px;position:absolute;bottom:40px;left:50%;width:44px;height:65px;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:.3s}
.welcomeSection .scrollTopItem:after{margin-left:-1px;content:'';position:absolute;top:0;left:50%;width:2px;height:10px;border-radius:10px;background:#dec66b;display:block}
.welcomeSection .scrollTopItem a{color:#fff}
.welcomeSection .scrollTopItem:hover{bottom:50px;transition:.3s}
.chevron{margin-top:80px;position:absolute;width:28px;height:8px;opacity:0;transform:scale3d(0.5,0.5,0.5);animation:move 3s ease-out infinite}
.chevron:first-child{animation:move 3s ease-out 1s infinite}
.chevron:nth-child(2){animation:move 3s ease-out 2s infinite}
.chevron:before,.chevron:after{content:' ';position:absolute;top:0;height:100%;width:51%;background:#dec66b}
.chevron:before{left:0;transform:skew(0deg,-30deg)}
.chevron:after{right:0;width:50%;transform:skew(0deg,30deg)}
@keyframes move {
25%{opacity:1}
33%{opacity:1;transform:translatey(-30px)}
67%{opacity:1;transform:translatey(-40px)}
100%{opacity:0;transform:translatey(-55px) scale3d(0.5,0.5,0.5)}
}
.aboutSection{display:block}
.aboutSection figure{margin-top:-15px;height:500px}
.aboutSection h3{margin:50px 0 10px;font-size:30px;color:#1b1b1b}
.aboutSection h4{margin:60px 0 10px;font-size:30px;color:#1b1b1b;display:block;text-align:center}
.aboutSection p{color:#393939;font-family:'Josefin Sans'}
.aboutSection ul{display:block}
.aboutSection ul li{padding-left:20px;display:block;position:relative;color:#393939;font-family:'Josefin Sans'}
.aboutSection ul li:after{content:'';position:absolute;top:8px;left:0;width:7px;height:7px;border-radius:10px;background:#1b1b1b}
.aboutSection .ourValuesBox{margin-top:80px;display:block;border-top:#1b1b1b33 solid 1px}
.aboutSection .ourValuesBox ul{margin-top:50px;display:flex;gap:20px;flex-wrap:wrap;justify-content:center}
.aboutSection .ourValuesBox ul li{padding:20px;width:172px;height:172px;border-radius:300px;display:flex;align-items:center;justify-content:center;background:#1b1b1b;text-align:center;font-size:18px;transition:.5s;cursor:default}
.aboutSection .ourValuesBox ul li:after{display:none}
.aboutSection .ourValuesBox ul li span{background:linear-gradient(to right,#865307,#F7EC84,#865307);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-family:'Charmonman';font-size:22px;line-height:30px;font-weight:600}
.aboutSection .ourValuesBox ul li:hover{border-radius:30px;transition:.5s}
.servicesSection{display:block}
.servicesSection figure{height:250px}
.servicesSection p{color:#898989;font-family:'Josefin Sans'}
.servicesSection h4{margin:60px 0 10px;font-size:30px;color:#fff;display:block;text-align:center}
.servicesSection .coreServicesBox{margin-top:80px;display:block;border-top:#ffffff33 solid 1px}
.servicesSection .coreServicesBox ul{margin-top:50px;display:flex;gap:20px;flex-wrap:wrap;justify-content:center}
.servicesSection .coreServicesBox ul li{padding:12px 30px;border-radius:300px;display:flex;align-items:center;justify-content:center;background:#fff;text-align:center;transition:.5s;position:relative;overflow:hidden;cursor: default}
.servicesSection .coreServicesBox ul li::before{content:'';position:absolute;top:0;left:0;width:0;height:100%;transition:.5s}
.servicesSection .coreServicesBox ul li span{font-weight:600;position:relative;font-size:18px;font-family:'Josefin Sans';background:linear-gradient(to right,#3b3b3b,#000,#3b3b3b);-webkit-text-fill-color:transparent;-webkit-background-clip:text}
.servicesSection .coreServicesBox ul li:hover{border-radius:30px;transition:.5s}
.servicesSection .coreServicesBox ul li:hover::before{width:100%;height:100%;background:linear-gradient(to right,#B68E52,#F7EC84,#B68E52);transition:.5s}
.galleryBox{display:block}
.galleryBox ul{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.galleryBox ul li{display:flex;border:#1b1b1b solid 1px;height:220px;align-items:center;justify-content:center;position:relative;width:calc(33.3% - 10px);overflow: hidden}
.galleryBox ul li .overLay{padding:15px;display:flex;position:absolute;bottom:0;left:0;width:100%;height:50px;text-align:center;background:#1b1b1be3;color:#fff;justify-content:center;align-items:center;transition:.5s;overflow: hidden}
.galleryBox ul li .overLay h4{font-size:16px;display:block;color:#fff;font-family:'Josefin Sans';}
.galleryBox ul li .overLay .btn{padding:10px 20px;margin:15px auto 0;font-size:14px;background:#B68E52;border-radius:0;border:0; display: none; width:200px;}
.galleryBox ul li:before{content:'';position:absolute;top:5px;left:5px;width:calc(100% - 10px);height:calc(100% - 10px);background:#fff}
.galleryBox ul li img{position:relative;width: 100%;height: 100%;object-fit: cover;}
.galleryBox ul li:hover img{transform: scale(1.2);transition:.5s}
.galleryBox ul li:hover .overLay{ height:100%;transition:.5s}
.galleryBox ul li:hover .overLay .btn{ display: block}
.clientsSection{display:block}
.clientsSection ul{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.clientsSection ul li{padding:10px;display:flex;border:#ffffff30 solid 1px;height:120px;align-items:center;justify-content:center;position:relative}
.clientsSection ul li:before{content:'';position:absolute;top:5px;left:5px;width:calc(100% - 10px);height:calc(100% - 10px);background:#fff}
.clientsSection ul li img{position:relative}
.contactSection{display:flex;text-align:center;align-items:center}
.contactSection span{color:#fff;font-family:'Josefin Sans';display:block;font-weight:300}
.contactSection h3{margin:0 0 10px;font-size:25px;color:#fff}
.contactSection h3 ~ H3{margin-top:50px}
.contactSection ul{margin-top:20px;display:flex;justify-content:center;gap:10px}
.contactSection ul li{display:inline-flex}
.contactSection ul li a{padding:10px;display:flex;align-items:center;justify-content:center;border:#dec66b solid 2px;width:40px;height:40px;border-radius:50px;color:#dec66b;transition:.5s}
.contactSection ul li a:hover{border:#fff solid 2px;color:#fff;transition:.5s}
.footer{padding:15px 0;background:#B68E52;font-size:14px;font-weight:300;font-family:'Josefin Sans';color:#1b1b1b;text-align:center;line-height:16px}
.downloadProfile{position:fixed;bottom:20px;right:20px;width:150px;height:188px;z-index:10}
@media screen and (max-width:768px) {
section{min-height:auto}
.mobileItem{display:block}
.desktopItem{display:none}
.navbar.solid .navbar-brand{font-size:20px}
.navbar-default .navbar-nav > li > a{font-size:16px}
.aboutSection figure{margin-bottom:30px;display:flex;align-items:center;justify-content:center;height:350px}
.aboutSection h3{text-align:center}
.aboutSection .ourValuesBox ul li{width:225px;height:225px}
.servicesSection figure{margin-bottom:30px;display:flex;align-items:center;justify-content:center}
.galleryBox ul li{height:150px}
.servicesSection .coreServicesBox ul{gap:10px}
.servicesSection .coreServicesBox ul li{padding:10px 25px}
.servicesSection .coreServicesBox ul li span{font-size:16px;font-weight:600}
}
@media screen and (max-width:514px) {
.navbar-header{ height:60px; }
.navbar-default .navbar-collapse,.navbar-default .navbar-form{background:#B68E52;height:100vh}
.navbar-nav{margin:0 -15px}
.nav>li{position:relative;display:block;border-bottom:#ccc solid 1px}
.navbar-default .navbar-nav > li > a{font-size:20px;line-height:50px;font-weight:600}
.navbar-default .navbar-nav > li:hover > a {background: none;-webkit-text-fill-color: inherit;}
.aboutSection figure{height:auto}
.aboutSection .ourValuesBox ul{margin-top:30px;gap:10px}
.aboutSection .ourValuesBox ul li{padding:10px 20px;width:100%;height:auto}
.aboutSection .ourValuesBox ul li span{font-size:16px}
.servicesSection .coreServicesBox ul{margin-top:30px;gap:10px}
.servicesSection .coreServicesBox ul li{padding:10px 20px;width:100%;height:auto}
.servicesSection .coreServicesBox ul li span{font-size:16px}
.galleryBox ul li{height:180px;width:100%}
.clientsSection ul li{padding:10px;height:auto;width:calc(50% - 5px)}
.downloadProfile{display:none}
}