

/*-----------------------------------------
* 02. Basic Styles
* -----------------------------------------*/   
body { font-family:'century gothic', sans-serif; background-color:; color:#b6b6b6; font-size:15px; font-weight:400; line-height:30px; width:100vw; }
a { text-decoration:none; color:#b6b6b6; }
a:hover { color:#000000; text-decoration:none; }
a:focus { outline:0 none; }
a:active, a:hover { outline:0; }
a:hover img { opacity:0.88; }
a, a i.fa, a img, .button, .btn { -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; transition:all 0.3s ease; }
ol, ul { list-style:none; padding:0; margin:0; }
.gray-bg,.bg-light { background-color:#26282b !important; }
::selection { color:#ffffff; }
.row-items { margin-top:-30px; }
.row-items .row-item { margin-top:30px; }


	#about > div > div.content-block.content-service-block > div > div:nth-child(1) > div > div.card-icon > i {padding-bottom: 10px;color:#EE771A;;font-size:46px!important;}
	#about > div > div.content-block.content-service-block > div > div:nth-child(2) > div > div.card-icon > i {padding-bottom: 10px;color:#EE771A;;font-size:46px!important;}
	#about > div > div.content-block.content-service-block > div > div:nth-child(3) > div > div.card-icon > i {padding-bottom: 10px;color:#EE771A;;font-size:46px!important;}
/*-----------------------------------------
* 03. Typography
* -----------------------------------------*/
h1,h2,h3,h4,h5,h6 { font-family:'century gothic', sans-serif; color:#fafafa; margin:0 0 10px; text-transform:uppercase; overflow-wrap: break-word; word-wrap: break-word; }
p { margin:0 0 15px; }
p:last-child { margin-bottom:0; }




/*-----------------------------------------
* 08. Banner Section
* -----------------------------------------*/
.banner-section { position:relative; background-color:#d7d7d7; min-height:100vh; padding:60px 0; }
.banner-section .banner-inner { position:relative; z-index:99; }
.banner-section .banner-text h2 { color:#ffffff; font-size:18px; letter-spacing:0.9px; font-weight:400; text-transform:uppercase; margin:0 0 15px; }
.banner-section .banner-text h3 { color:#ffffff; font-size:42px; font-weight:400; letter-spacing:1px; margin:0 0 15px; }
.banner-section .banner-text p { color:#ffffff; max-width:510px; letter-spacing:0.2px; margin:0 0 15px; }
.banner-section .social-links a { color:#ffffff; font-size:20px; margin:0 20px 20px 0; }

/* Background Image */
.banner-section.header-bg-img { background-image:url('../images/banners/home-banner.jpg'); background-size:cover; background-repeat:no-repeat; background-position:center center; height:100vh!important;}
/* Background overlay opacity */
.banner-section.header-bg-img:after { content:""; background-color:rgba(0,0,0,0.8); position:absolute; top:0; bottom:0; left:0; right:0; }
.banner-section .banner-inner .center-picture { border-radius:50%; max-width:500px; border:10px solid rgba(255,255,255,0.1); }

/* Cd Type Word Wrapper */
.cd-words-wrapper { display:inline-block; position:relative; text-align:left; }
.cd-words-wrapper b { display:inline-block; position:absolute; white-space:nowrap; left:0; top:0; }
.cd-words-wrapper b.is-visible { position:relative; }
.cd-headline.clip .cd-words-wrapper { overflow:hidden; vertical-align:top; border-right:2px solid #dddddd; padding-right:4px; }
.cd-headline.clip b { opacity:0; }
.cd-headline.clip b.is-visible { opacity:1; }

/* Bottom Scroll Arrow */
.scroll-down-arrow { position:absolute; bottom:5vh; left:0; right:0; margin:0 auto; z-index:999; display:block; cursor:pointer; width:30px; height:60px; border:2px solid #ffffff; border-radius:50px; -webkit-box-shadow:0 1px 2px rgba(0,0,0,0.4); box-shadow:0 1px 2px rgba(0,0,0,0.4); -webkit-animation:bounce 2s infinite; animation:bounce 2s infinite; -webkit-transition:all 0.3s ease; transition:all 0.3s ease; }
.scroll-down-arrow:before { content:""; position:absolute; top:10px; left:50%; width:8px; height:8px; margin-left:-3px; background-color:#fafafa; border-radius:50%; -webkit-animation:scroll_down 2s infinite; animation:scroll_down 2s infinite; }
@-webkit-keyframes scroll_down { 0% { -webkit-transform:translate(0,0); transform:translate(0,0); opacity:0; } 40% { opacity:1; } 80% { -webkit-transform:translate(0,20px); transform:translate(0,20px); opacity:0; } 100% { opacity:0; } }
@keyframes scroll_down { 0% { -webkit-transform:translate(0,0); transform:translate(0,0); opacity:0; } 40% { opacity:1; } 80% { -webkit-transform:translate(0, 20px); transform:translate(0,20px); opacity:0; } 100% { opacity:0; } }
@-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform:translateY(0); } 40% { transform:translateY(-30px);} 60% { transform:translateY(-15px);} } 
@keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform:translateY(0); } 40% { transform:translateY(-30px);}  60% { transform:translateY(-15px);} } 

/* Section Title */
.section-title { position:relative; }
.section-title h1 { font-size:42px; font-weight:bold; text-transform:uppercase; margin:0 0 60px; text-align:center; }
.section-subtitle h3 { margin-bottom:40px; text-align:center; }

/* Separator */
.separator { position:absolute; bottom:-10px; left:0; right:0; background:#fafafa; width:150px; height:5px; margin:0 auto; border-radius:50px; overflow:hidden; }
.separator:after { content:""; display:block; width:10px; height:5px; position:relative; background-color:#222222; animation:separator 2s linear infinite; overflow:hidden; border-radius:2px; -webkit-transition:all .5s; transition:all .5s; }
@keyframes separator { 0% { top:0; left:0; } 25% { left:25px; width:25%; } 50% { left:50px; width:45%; } 75% { left:75px; width:65%; } 100% { left:150px; width:80%; } }
