/*  
Theme Name: Yans Karunia Abadi
Theme URI: https://bimastudio.co/
Author: m0n0kur0b0
Author URI: https://bimastudio.co/
Description: Fast and responsive wp themes!
Version: 1.0
Tags: fast, responsive, green, white, flat
*/


html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border: 0;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
html{scroll-behavior: smooth;}
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,.descuser span{display: block;}
ol,ul{list-style: none;}
.c{clear:both}
.l{float:left!important;}
.r{float:right!important;}
.mt80{margin-top:80px!important;}
.mt40{margin-top:40px!important;}
.mt20{margin-top:20px!important;}
.mb20{margin-bottom:20px!important;}
.ml20{margin-left:20px!important;}
.mb40{margin-bottom:40px!important;}
.mb120{margin-bottom:120px!important;}
.pt100{padding-top:100px!important;}
.p20{padding: 20px!important;}
a{color:#006400;-moz-transition: 0.4s; -webkit-transition: 0.4s;transition: 0.4s;}
a:hover{color:#000;}
a .layanan p{color:#000;}
a .layanan p:hover{color:#000;}
a, a:hover{text-decoration:none}
.tr{text-align:right;background:none!important;border:none!important;}
.tl{text-align:left!important;}
h1,h2,h3,h4,h5,h6{color: #0C2845;font-family: 'Exo', sans-serif;font-weight: bold;line-height: 1.2;margin: 0 0 16px;}
h1 {font-size: 36px;}
h2 {font-size: 22px;}
h3 {font-size: 20px;}
h4 {font-size: 16px;}
h5 {font-size: 16px;}
h6 {font-size: 116px;}
blockquote{font-size:18px;}
blockquote::before,
blockquote::after {font-size: 350%;font-family: arial;display:block;position: absolute;}
blockquote::before {content: open-quote;left: 0px;line-height: 40px;}
blockquote::after {content: close-quote;right: 10px;line-height: 30px;}
body {font-family:'Roboto', sans-serif;font-size:16px;color:#222;line-height: 1.625;}
#header{position: fixed;top: 0;left: 0;width: 100%;height: 54px;padding: 0;background-color: #fff;outline: 0;z-index: 101;-webkit-backface-visibility: hidden;-webkit-box-sizing: border-box;box-sizing: border-box;box-shadow: 0px 6px 15px 0px rgb(64 79 104 / 6%);}
#logo img{float:left;height:40px;margin: 7px 10px;}
.menu{background:#fff;}
.menu ul li{font-family: 'Roboto', sans-serif;float:left;display: block;color: #f2f2f2;text-align: center;padding: 14px 36px;text-decoration: none;text-transform:uppercase;}
.menu ul li a{color:#006400;}
.sub-menu li a{color:#006400!important;}
.sub-menu li:hover a,.sub-menu li a:hover{color:#fff!important;}
.sub-menu li .sub-menu li a{color:#006400!important;}
.sub-menu li .sub-menu li:hover a,.sub-menu li .sub-menu li a:hover{color:#fff!important;}
.menu ul li:hover{background:#006400;}
.menu ul li:hover a,.menu ul li a:hover{color:#fff;}
ul.sub-menu li {float: none;color: black;padding: 12px 16px;text-decoration: none;display: block;text-align: left;}
.menu ul li:hover>.sub-menu {display: block;}
#project,#kontak,#about,#blog,#single{position:relative;}
.proyek{font-size:14px;box-shadow:0px 2px 5px 0px rgb(0 0 0 / 10%), 0px 10px 30px 0px rgb(0 0 0 / 5%);position:relative;background:#fff;}
.proyek img{width:100%;}
.proyek h4{font-size:16px;font-weight:bold;color:#006400;margin-top:10px;text-transform:uppercase;}
.proyek a{background:#006400;display:block;padding:5px 13px;margin-top:10px;color:#fff;position: absolute;bottom: 0px;right: 0px;}
.proyek a:hover{background:#d4d4d4;}
.proyek div.list{font-size: 12px;display:block;text-align:left;}
.proyek .readmore{display:block!important;}
.tab{overflow: hidden;}
.tab button{background: #d2d2d4;color:#fff;float: left;border: none;outline: none;cursor: pointer;padding: 5px 10px;transition: 0.3s;font-size: 16px;margin-right:10px;border-radius:4px;}
.tab button:hover{background-color: #006400;}
.tab button.active{background-color: #006400;}
.tabcontent {display: none;border-top: none;}
#single img{width:100%;}
#footer{padding:10px 0;}
.slideshow-container{width: 100%;position: relative;margin: auto;}
.mySlides img{width:100%;}
.prev, .next {cursor: pointer;position: absolute;bottom:0;width: auto;padding: 16px 24px;margin-top: -22px;color: white;font-weight: bold;font-size: 18px;transition: 0.6s ease;user-select: none;}
.prev {background:#d4d4d4;right: 57px;color:#333;}
.next {background:#006400;right: 0;}
.prev:hover{background-color: #006400;color:#fff;}
.next:hover{background-color: #d4d4d4;color:#333;}
.dot {cursor: pointer;height: 12px;width: 12px;margin: 0 2px;background-color: #bbb;border-radius: 50%;display: inline-block;transition: background-color 0.6s ease;}
.active, .dot:hover {background-color: #717171;}
.wa span, .wa a{display: none;}
.wa.show{background:#fff;width:300px;height:220px;border-radius:10px;margin-bottom:10px;}
.wa.show span{background:#22c15e;padding:10px;display:block;color:#fff;border-radius: 10px 10px 0 0;}
.wa.show a{padding:5px 10px;display:block;color:#777;}
.wa.show a:hover{background:#eee;}
#wabtn{}
#wabtn {cursor: pointer;}
.fade{animation:fading 5s;}
@keyframes fading{0%{opacity:0}20%{opacity:0.9}50%{opacity:1}80%{opacity:0.9}100%{opacity:0.1}}
#btnup i{bottom:-40px;}
#btnup.show i{position:fixed;background:#006400;padding:5px 7px 9px 7px;border-radius:50%;font-size:20px;color:#fff;right:15px;bottom:15px;z-index:999;display: block;transition: bottom 1s;}
.is-visible{position:relative;animation:animatebottom 2s}
@keyframes animatebottom{from{bottom:-200px;opacity:0} to{bottom:0;opacity:1}}
@media only screen and ( max-width: 4000px ) {
	.box1140,.box1140a{width:1140px;margin:0 auto;}
	.sosmed{display: block;border-top: 1px solid #e8e8e9;line-height: 9px;padding: 31px 0;text-align:center;}
	.menu ul li a:hover{background:#006400;color:#fff;}
	ul.sub-menu ul.sub-menu {display: none;position: absolute;right:-180px;margin-top:-38px;background-color: #f9f9f9;width: 180px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);z-index: 1;}
	ul.sub-menu {display: none;position: absolute;background-color: #f9f9f9;width: 180px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);z-index: 1;font-size:12px;border-radius:5px;margin-left:-36px;}
	.menu-item-has-children:after{font-family:FontAwesome;font-style:normal;font-weight:normal;content:"\f107";color:#222;}
	.sub-menu .menu-item-has-children:after{font-family:FontAwesome;font-style:normal;font-weight:normal;content:"\f105";color:#222;}
	.sosmed{background:#006400;width:100%;}
	.sosmed i{margin:0 10px;}
	.sosmed a i{color:#fff;}
	.titlebg{position:absolute;left: 0;color: #f5f6f7;-webkit-text-fill-color: transparent;-webkit-text-stroke-width: 1px;-webkit-text-stroke-color: #d2d2d4;display: inline-block!important;line-height: 210px;font-weight: 600;overflow: hidden;font-size: 180px;z-index:-1;}
	#content{width: 1140px;margin:0 auto;}
	#layanan,#project,#kontak,#about,#blog,#single{width:96%;padding:0 2%;}
	.layanan{width:29%;float:left;margin:2%;}
	.layanan span{font-size:12px;color:#919191;}
	.layanan h2{font-size:50px;color:#006400;}
	#project h2,#kontak h2,#about h2,#blog h2,#single h1{padding-top:100px;font-size:90px;color:#006400;}
	.layanan h3{font-size:20px;color:#006400;}
	.proyek{float:left;width:27%;margin:2% 1% 0 1%;padding:2% 2% 4% 2%;}
	.kontak{float:left;width:46%;margin:0 2%;}
	.limg{display:block;font-size:64px;color:#006400;}
	.blog img{float:left;width:150px;margin-right:10px;}
	#header .icon,#logo h2, #logo h1{display:none;}
}
@media only screen and ( max-width: 960px ) {
	#logo img {float:none;height: 40px;margin: 7px 10px;}
	#header a.icon {float: right;display: block;font-size:34px;margin-right:10px;}
	.menu{margin-top:-54px;}
	.menu.responsive {width: 100%;margin-top:0;position: relative;}
	#header .icon {position: absolute;right: 0;top: 0;}
	.menu.responsive ul li {float: none;display: block;text-align: left;}
	.menu.responsive ul {float: none;}
	.menu.responsive ul.sub-menu {position: relative;background-color: #fff;width: 100%;box-shadow: none;}
	ul.sub-menu ul.sub-menu {display: none;position: relative;right:0;margin-top:0;z-index: 1;}
	.menu-item-has-children:hover{padding-bottom:0;}
	.menu-item-has-children:after{content:"";}
	.sub-menu .menu-item-has-children:after{content:"";}
	#content{margin-top:65px;margin-left:0;float: none;width: 100%;}
	.titlebg{position:absolute;left: 0;color: #f5f6f7;-webkit-text-fill-color: transparent;-webkit-text-stroke-width: 1px;-webkit-text-stroke-color: #d2d2d4;display: inline-block!important;line-height: 110px;font-weight: 600;overflow: hidden;font-size: 90px;z-index:-1;}
	#project h2,#kontak h2,#about h2,#blog h2,#single h1{padding-top:40px;font-size:60px;color:#006400;}
	.layanan,.kontak{width:96%;float:none;margin:2%;}
	.proyek{float:none;width:84%;margin:2% 1% 0 1%;padding:7%;}
	.menu a:not(:first-child),.psn,.menu ul li{display: none;}
}