/*
Theme Name: Pilarmedia.com
Theme URI: http://www.pilarmedia.com/
Description: Design by <a href="http://ardyansah.com">Mantan Kyai</a>.
Version: 2.1
Author: Afandy A.G.
Author URI: http://afandyag.pilarholic.com/
Tags: pilarmedia

*/

/* Reset */
html,body,div,span,object,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;vertical-align:baseline;outline:none;font-size:100%;background:transparent;border:none;text-decoration:none}b,i,hr,u,center,menu,layer,s,strike,font,xmp{margin:0;padding:0;vertical-align:baseline;outline:none;font-size:100%;font-weight:normal;font-style:normal;background:transparent;border:none;text-decoration:none}font{color:#333}center{text-align:left}

/* Body */
body {
	background:url('images/bgbody.jpg') repeat-y center center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:62.5%; /* reset 1em = 10px */
	}
#page {
	margin: 40px auto;
	width: 921px;
	position:relative;
	}

/* Header */
#header {
	background:url(images/headerb.jpg) no-repeat center top;
	height: 355px;
	}
.home #header {
	background:url(images/header.jpg) no-repeat center top;
	height:570px;
	}
#site-title, #site-description {
	margin-left:-1000em;
	}
#about {
	color:#fff;
	font-size:1.4em;
	margin:150px 400px 0 40px;
	}

/* Page Menu */
.page-menu ul {
	font-size:1.2em;
	height:30px;
	left:40px;
	padding-top:2px;
	position:relative;
	text-transform:uppercase;
	top:58px;
	width:460px;
	}
.page-menu li {
	float:left;
	list-style-type:none;
	padding:0.5em 0.6em;
	}
.page-menu a {
	color:#fff;
	}
.page-menu a:hover {
	color:#000;
	}
li.page_item {
	background:url(images/bordermenu.jpg) no-repeat left top;
	}

/* Searchform */
.search-text {
	background:url(images/bgsearch.jpg) repeat-x;
	border:1px solid #727272;
	color:#727272;
	font-size:1em;
	left:666px;
	padding:3px 5px;
	position:absolute;
	top:66px;
	width:180px;
	}

/* Wrapper Service & Portofolio */
#wrapper {
	float:left;
	position:relative;
	top:90px;
	}
#services h2, #portofolio h2 {
	font-size:3em;
	margin:5px 0;
	}
#services {
	background:url(images/borderservice.jpg) no-repeat right center;
	float:left;
	margin-left:30px;
	padding:0 10px 10px;
	width:340px;
	}
#services ul {
	margin:5px;
	padding-left:10px;
	}
#services li {
	list-style-position:outside;
	list-style-image:url(images/dot.jpg);
	padding-bottom:5px;
	}
#portofolio {
	float:left;
	margin-left:15px;
	}
#slideportofolio img {
	margin-bottom:10px;
	}
	
/* Content */
.content-wrap {
	background:#363636 url(images/bgcontent.jpg);
	overflow:hidden;
	min-height:250px;
	height:auto;
	}
/*\*/
* html .container {
	height: 250px;
}
#content {
	display:block;
	float:left;
	margin:0 20px 20px 80px;
	position:relative;
	width:430px;
	}
#content h3, .pagetitle {
	color:#ededed;
	font-size:2.2em;
	margin:10px 5px;
	}

/* Posts */
.post {
	background:url(images/borderpost.jpg) no-repeat center bottom;
	padding:15px;
	}
body.page .hentry {
	background:#e8e8e8;
	margin-bottom:10px;
	padding:15px;
	}
.home .post, .single .post {
	background:#e8e8e8;
	margin-bottom:10px;
	}
.news-title {
	font-family:Helvetica,"Myriad Pro",Verdana,Arial;
	font-size:2.4em;
	}
.news-title a {
	color:#910d28;
	text-decoration:none;
	}
.post-title {
	font-size:1.2em !important;
	margin-left:0 !important;
	}
.post-title a {
	color:#d39110;
	text-decoration:none;
	}
.published {
	background:url(images/bgdate.jpg) no-repeat;
	height:81px;
	margin:-15px 0 0 -70px;
	position:absolute;
	text-align:center;
	width:50px;
	}
.month {
	font-size:1.3em;
	font-family:Helvetica, "Myriad Pro", Verdana, Arial;
	display:block;
	margin-top:16px;
	text-transform:uppercase;
	font-weight:bold;
	}
.date {
	font-size:2em;
	display:block;
	}
.year {
	display:block;
	font-size:1.3em;
	padding-top:8px;
	color:#fff;
	font-weight:bold;
	}
.news, #content .post, #content .page {
	color:#3f3d3d;
	}
.isi {
	color:#8c8c8c !important;
	}
.entry {
	margin:5px 0;
}
.postmetadata {
	text-transform:uppercase;
	margin:5px 0;
	}
.postmetadata a {
	color:#333333;
	}
.postmetadata a:hover {	
	text-decoration:underline;
	}

/* Page-navigation */
.wp-pagenavi {
  margin:15px;
  text-align:center;
  }
.wp-pagenavi a, .wp-pagenavi span {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #e0e0e0;
	color: #545454;
	background:url(images/bgnavi.jpg) repeat-x;	
}


/* Widgets */
.aside {
	float:left;
	width:150px;
	margin:10px;
	}
.aside a {
	color:#a1a1a1;
	}
.aside a:hover {
	text-decoration:underline;
	}
.widgettitle {
	color:#ededed;
	font-size:2.2em;
	margin-bottom:5px;
	}
#primary ul {
	list-style-image:url(images/dot.jpg);
	list-style-position:inside;
	padding-left:5px;
	}
#primary li {
	background:url(images/bgcategories.jpg) no-repeat left bottom;
	padding:5px 0;
	list-style-image:url(images/dot.jpg);
	list-style-position:inside;
	padding-left:5px;
	}
#secondary ul {
	list-style-type:none;
	color:#a1a1a1;
	}
#secondary ul li {
	padding:5px 0;
	}
#secondary .widget img {
	border:2px solid #848484;
	}
#secondary .org {
	font-weight:bold;
	padding-left:5px;
	}
#secondary .work {
	padding-left:5px;
	padding-bottom:10px;
	}

/* Footer */
#footer {
	clear:left;
	color:#a3a3a3;
	padding-left:90px;
	padding-bottom:20px;
	width:350px;
	}

/* Begin Images */
p img {
	padding: 0;
	max-width: 100%;
	}

img.centered {
	display: block;
	margin:0 auto 2px;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left;
	}
/* End Images */

/* Begin Lists

	Special stylized non-IE bullets
	Do not work in Internet Explorer, which merely default to normal bullets. */

html>body .entry ul {
	margin-left: 0px;
	padding: 0 0 0 30px;
	padding-left: 10px;
	}

html>body .entry li {
	margin: 7px 0 8px 10px;
	}

.entry ol {
	padding: 0 0 0 35px;
	margin: 0;
	}

.entry ol li {
	margin: 0;
	padding: 0;
	}

/* Stepcaraousel */
.stepcarousel{
position: relative; /*leave this value alone*/
border: none;
overflow: scroll; /*leave this value alone*/
width: 490px;
height: 110px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin-right: 10px; /*margin around each panel*/
width: 115px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
text-align:center;
background:url(images/bgslide.jpg) no-repeat top left;
padding-top:10px;
}
.stepcarousel .panel a {
color:#676767;
}
.nextprev {
background:url(images/panel.jpg) no-repeat;
font-weight:bold;
height:22px;
padding-top:5px;
width:490px;
}
.nextprev a {
color:#fff;
}
.prev {
margin-left:10px;
}
.next {
margin-left:10px;
}
.more {
margin-left:270px;
}

/* Cycle Portofolio */
.carousel{
position: relative; /*leave this value alone*/
border: none;
overflow: scroll; /*leave this value alone*/
width:497px;
height: 355px; /*Height should enough to fit largest content's height*/
margin-left:-40px;
}

.carousel .slideshow {
position: absolute; /*leave this value alone*/
left: 0;
top: 275px;
}

.carousel .panel {
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin:0 10px 0 22px; /*margin around each panel*/
width: 106px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
text-align:center;
}
.slideshow img { cursor:pointer; border:5px solid #fff; }
.fullimage { margin-left:40px; }
.fullimage img { border:5px solid #fff; }
#arrowl { position:absolute; left:0; margin-top:10px; }
#arrowr { position:absolute; right:0; margin-top:10px; }

/* Classes */
.proxima {
	font-family: ProximaNova, "Myriad Pro", Verdana, Arial;
	}
#tooltip {
	position: absolute;
	z-index: 3000;
	border: 1px solid #111;
	background-color: #eee;
	padding: 5px;
	opacity: 0.85;max-width:400px;
}
#tooltip h3, #tooltip div { margin: 0; }