/*  Theme Name: Petani
URI: https://spi.or.id
Description: Petani Themes
Version: 1.0
Author: Cecep Risnandar
*/

/* Generale rule*/
body{font-family: sans-serif; line-height:1.6em; padding:0; margin:0; color:#666666;}
img{max-width:100%; height:auto; display:block}
a{color:#106596;text-decoration:none}
a:hover{color:#000000;text-decoration:underline}
p {margin:0;padding:0}
h1,h2,h3,h4,h5,h6{line-height:1.4em; padding:5px 0; margin:0}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a{color:#333333}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover{color:#000000}
h1{font-size:2.6em}
h2{font-size:1.3em}
h3{font-size:1.2em}
h4{font-size:1.1em}
h5{font-size:1em}
h6{font-size:0.9em}

/* Content image rule! */
.alignnone{margin:5px 0 15px 0;}
.aligncenter, div.aligncenter{display:block;margin:5px auto 20px auto}
.aligncenter{display:block;margin:5px auto 20px auto}
.alignright{float:right;margin:5px 0 20px 20px;}
.alignleft{float:left;margin:5px 20px 20px 0;}
.wp-caption{max-width:100%;margin:0;padding:0;}
.wp-caption.alignnone{margin:5px 0 20px 0;}
.wp-caption.aligncenter{margin:5px auto 20px auto}
.wp-caption.alignleft{margin:5px 20px 20px 0;}
.wp-caption.alignright{margin:5px 0 20px 20px;}
.wp-caption img{border:0 none;height:auto;width:auto;max-width:100%;}
.wp-caption p.wp-caption-text{font-size:0.9em;font-style:italic;line-height:1.2em;color:#999999}
.wp-caption p.wp-caption-text a{color:#666666}
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; margin-bottom:20px }
.embed-container iframe, .embed-container object, .embed-container embed, .embed-container video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Header*/
.header{ height:80px; color:#333333; background:#ffffff; box-shadow: 0 0 1px 0 #999999;}
.header a{ text-decoration:none; color:#333333 }
.header a:hover{color:#999999}
.header-logo{overflow:hidden;float:left}
.header-logo-img{float:left;width:233px;height:60px;margin:10px 0 0 30px}
.header-logo-img:hover{opacity:0.6}
.header-logo-text{float:left; font-size:0.8em; width:200px; height:46px; margin:17px 10px; padding:0 10px; line-height:1.2em; color:#999999; border-left:1px solid #999999}
.header-logo-text a{color:#999999;}
.header-menu-desktop{float:right; font-size:14px; height:65px; padding:15px 0 0 0; margin:0;}
.header-search-desktop{float:right; width:80px; height:80px;}
.header-search-desktop-icon{font-size:14px; margin:27px 30px;}
.header-menu-mobile{display:none; float:right; width:80px; height:80px; }
.header-menu-mobile-icon{font-size:24px; margin:25px;}
.header-mobile{color:#ffffff; background:#333333}
.header-mobile a {color:#ffffff;}
.header-mobile ul {list-style:none; padding:16px; margin:0}

/* DropDown CSS menu */
#primary_nav_wrap { margin-top:15px }
#primary_nav_wrap ul { list-style:none;	position:relative;	float:left;	margin:0;	padding:0}
#primary_nav_wrap ul a{	display:block;	color:#333;	text-decoration:none;	padding:0 15px; }
#primary_nav_wrap ul li{	position:relative;	float:left;	margin:0;	padding:0}
#primary_nav_wrap ul li:hover{	background:#f6f6f6; z-index:9999;}
#primary_nav_wrap ul ul{	display:none;	position:absolute;	top:100%;	left:0;	background:#fff;	padding:0}
#primary_nav_wrap ul ul li{	float:none;	width:200px}
#primary_nav_wrap ul ul a{	line-height:120%;	padding:10px 15px}
#primary_nav_wrap ul ul ul{	top:0;	left:100%}
#primary_nav_wrap ul li:hover > ul{	display:block}

/* Mobile CSS menu */
#toggle-1{margin:0;padding:10px 0;background:#333;border-bottom: 1px solid #666}
#toggle-2{overflow:hidden;width:100%;margin:0;padding:0;}
#toggle-2 i{margin:0 10px 0 0;padding:0;}
.navmenu{font-weight:bold; padding:5px 10px; margin:0; color:#ffffff; background:#555555; border-bottom:1px solid #444444}
.navmenu a{display:block; cursor:pointer; color:#ffffff; }
.navmenu a:hover{text-decoration:none}
.navmenu:hover{background:#888888}
ul.subnav {list-style:none;padding:0;margin:0}
.subnav li {padding:5px 30px 5px 20px; margin:0; color:#ffffff; background:#666666; border-bottom:1px solid #444444}
.subnav li a{display:block; cursor:pointer; color:#ffffff; }
.subnav li a:hover{text-decoration:none}
.subnav li:hover{background:#888888}
.subnav li ul {list-style:none;padding:10px 0;margin:0}
.subnav li ul li{padding:5px 20px; margin:0; border:none;}
.subnav li:hover ul li{background:#666666}

/* footer */
footer{clear:both}
.footer-content-1{
	overflow:hidden;
	font-size:0.9em;
	padding:40px 5%;
	background: rgb(0,0,0); /* Old browsers */
	background: -moz-linear-gradient(45deg, rgba(0,0,0,1) 0%, rgba(69,72,77,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, rgba(0,0,0,1) 0%,rgba(69,72,77,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, rgba(0,0,0,1) 0%,rgba(69,72,77,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#45484d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}
	.footer-col-1{float:left;width:16%;margin:20px 1%;}
	.footer-col-1 i{padding:0; margin:0 10px 0 0}
	.footer-col-1 h5{font-size:1em;margin:0 0 5px 0;color:#fff}
	.footer-col-1 ul{margin:0 0 20px 0; padding:0}
	.footer-col-1 li{list-style-type:none;padding:0;margin:0;color:#ccc}
	.footer-col-1 li a{color:#ccc}
	.footer-col-1 li a:hover{text-decoration:none;color:#fff}
	.footer-col-1 li span a{font-size:0.8em; font-weight:bold}
	.footer-col-2{float:left;width:26%;margin:20px 1%;}
	.footer-col-2 h5{font-size:1em; margin:0 0 10px 0;color:#fff}
	.footer-col-2-box{font-size:1em; line-height:1.6em; width:230px; margin:0 0 5px 0; color:#ccc}
	.footer-col-2-box i {font-size:1em;margin:0 10px 0 0}
.footer-content-2{overflow:hidden;font-size:0.8em; padding:15px 5% 10px 5%; color:#666; background:#000}
.footer-content-2 a{color:#ccc}
.footer-content-2 a:hover{color:#fff}

/* Media screen responsive */
@media screen and (max-width:1280px){
	.header-menu-desktop,.header-search-desktop{ display:none }
	.header-menu-mobile { display:block }
	.header-logo-img{margin:10px 0 0 10px}
}
@media screen and (max-width:890px){
	.footer-content-1{padding:40px 5% 20px 5%;}
	.footer-content-2{padding:20px 5%;}
	.footer-col-1{width:48%}
	.footer-col-2{width:98%}
}
@media screen and (max-width:680px){
	.header{ height:60px;}
	.header-menu-desktop,.header-search-desktop{ display:none }
	.header-logo-img{width:155px; height:40px;}
	.header-menu-mobile { display:block; width:60px; height:60px;}
	.header-menu-mobile-icon{font-size:18px; margin:18px;}
}
@media screen and (max-width:480px){
	.wp-caption{width:100% !important}
	.wp-caption img{width:100%  !important}
	.wp-caption.alignnone,.wp-caption.aligncenter,.wp-caption.alignleft,.wp-caption.alignright{margin:0 !important;}
	.aligncenter,.alignright,.alignleft{float:none;margin:5px 0 20px 0!important;}
}