/*   
Theme Name: Mysterio 1.0
Theme URI: http://wpthememysterio.com
Description: This is just a The best worpdress theme out there for offline, businesss, etc...
Author: Josee Bedard
Author URI: http://wpthememysterio.com
Version: 1
*/


@media screen {

/* ---------------------{ Main }--------------------- */
* { margin: 0; padding: 0; }
body { background:#fff; font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#000000;  }
.screen-reader-text { position: absolute; left: -9999px; top: -9999px; }
.clear { clear: both; }
.group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .group, *:first-child+html .group { zoom: 1; } /* First selector = IE6, Second Selector = IE 7 */
hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.625em;}
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; } table { border-collapse: collapse; border-spacing: 0; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { display: inline-block; } /* Hide from IE Mac \*/ .clearfix { display: block; } /* End hide from IE Mac */ .none { display: none; } /* End Clearfix */

/* ---------------------{ Typography }--------------------- */
h1, h2, h3, h4, h5 { font-weight: normal; margin: 0 0 10px 0;  font-family: 'Oswald', sans-serif;  }
h1 { font-size:32px; }
h2 { font-size:24px;}
h3 { font-size:18px; }
h4 { font-size:14px; }
h5{  font-size:12px;}

p { margin: 0 0 10px 0; }
a { color:#ff6634 }
a:hover { } 

ul, ol { margin: 0 0 1.625em 2.5em;}
ul { list-style: square;}
ol { list-style-type: decimal;}
ol ol {list-style: upper-alpha;}
ol ol ol {list-style: lower-roman;}
ol ol ol ol {list-style: lower-alpha;}
ul ul, ol ol, ul ol, ol ul {margin-bottom: 0;}
dl {margin: 0 1.625em;}
dt {font-weight: bold;}
dd {margin-bottom: 1.625em;}
strong {font-weight: bold;}
cite, em, i {font-style: italic;}
blockquote {font-family: Georgia, "Bitstream Charter", serif; font-style: italic; font-weight: normal; margin: 0 3em;}
blockquote em, blockquote i, blockquote cite {font-style: normal;}
blockquote cite {color: #666; font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 300; letter-spacing: 0.05em; text-transform: uppercase;}
pre {background: #f4f4f4;font: 13px "Courier 10 Pitch", Courier, monospace;line-height: 1.5; margin-bottom: 1.625em; overflow: auto; padding: 0.75em 1.625em;}
code, kbd {font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;}
abbr, acronym, dfn {border-bottom: 1px dotted #666; cursor: help;}
address {display: block; margin: 0 0 1.625em;}
ins {background: #fff9c0 ;text-decoration: none;}
sup,sub {font-size: 10px; height: 0; line-height: 1; position: relative; vertical-align: baseline;}
sup {bottom: 1ex;}
sub {top: .5ex;}
a img {border: 0;}
.pingback{padding:10px 10px 10px 10px;}

.entry table,.commentlist table {border-bottom: 1px solid #ddd;margin: 0 0 1.625em;width: 100%;}
.entry th,.commentlist th {color: #666;font-size: 10px;font-weight: 500;letter-spacing: 0.1em;line-height: 2.6em;text-transform: uppercase;}
.entry td,.commentlist td {border-top: 1px solid #ddd;padding: 6px 10px 6px 10px;}
.th{ background-color:#CCCCCC; font-weight:bold; }

/* ---------------------{ Main Structure}--------------------- */
#page-wrap { width: 1020px; margin: 0px auto; line-height:1.5em; }

#container{ width:100%; padding:20px 0px 20px 0px;}
#container-all{ padding:20px 30px 20px 30px;}
#content{ float:left; display:inline; padding:0px 0px 0px 30px; width:640px;}
#sidebar{ float:right; display:inline; padding:0px 30px 0px 0px; width:275px;}
#footer{}

/* ---------------------{ Header }--------------------- */
#header-top{clear:both; width:1020px; height:45px; margin:0px 0px 0px 0px;}
#header-search{ float:right; width:144px; height:22px; background:url(images/search-box.png) center center no-repeat; margin:10px 30px 0px 0px;}
#header{width:1020px; height:66px; margin-left:-5px; background:url(images/nav-bg.png) top left no-repeat; position:relative:}
#logo{ float:left; width:220px; padding: 15px 0px 0px 15px;}
#header .right{float:right; padding:15px 20px 0px 0px; width:720px;}

/* ---------------------{ Slider }--------------------- */
#slider{clear:both; width:1020px; height:442px; background:url(images/slide-bg.png) top center no-repeat;}


/* ---------------------{ Top Navigation }--------------------- */
#mainnav {margin: 0; padding: 0px 0px 0px 0px; height:28px; float: left; width:720px; font-family:'Oswald', sans-serif;}
#mainnav .menu-header,div.menu {font-size: 12px;}
#mainnav .menu-header ul,div.menu ul {list-style: none; margin: 0; float:right;}
#mainnav .menu-header li,div.menu li {float: left; position: relative;}
#mainnav a {color: #4b4b4b;display: block; line-height: 28px; padding: 0 20px; text-decoration: none; font-family:'Oswald', sans-serif; text-transform:uppercase;}
#mainnav ul ul { background:#ff6633; box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);display: none;position: absolute;top: 28px; left: 0;float: left;width: 180px;z-index: 99999; -moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px; }
#mainnav ul ul li {min-width:180px; }
#mainnav ul ul ul {left: 100%;top: 0;}
#mainnav ul ul a {background:#ff6633; line-height: 1em;padding: 10px;width: 160px;height: auto; font-size:12px; color:#4b4b4b; text-transform:none;}
#mainnav li:hover > a{ color:#fff; background:#ff6633; -moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px; box-shadow: -1px -1px 1px #888;}
#mainnav ul ul :hover > a {background: #fe7947;color:#fff;}
#mainnav ul li:hover > ul {display: block;}
#mainnav ul li.current_page_item > a,#mainnav ul li.current-menu-ancestor > a,#mainnav ul li.current-menu-item > a,#mainnav ul li.current-menu-parent > a {color:#000;}
* html #mainnav ul li.current_page_item a,* html #mainnav ul li.current-menu-ancestor a,* html #mainnav ul li.current-menu-item a,* html #mainnav ul li.current-menu-parent a,* html #mainnav ul li a:hover {color:#000;}




/* ---------------------{ 3 Boxes}--------------------- */
#three-boxes{ clear:both; clear:both; width:1030px; padding:30px 0px 20px 0px; margin-left:-5px;}

#three-boxes .title{ clear:both;}
#three-boxes .orange-title{ float:left; width:33%; height:48px; }



#three-boxes .orange-title h2{ color:#fff; text-transform:uppercase; font-size:18px; padding:12px 0px 0px 10px;}
#three-boxes .right-title{ float:left; width:66%; }
#three-boxes .right-title h3{text-transform:uppercase; padding:12px 0px 0px 10px; }
#three-boxes .content{ clear:both; padding:20px 0px 0px 0px;}
#three-boxes .box{ float:left; width:33%; background:url(images/vertical-line.png) right center no-repeat;}
#three-boxes .box-content{padding:0px 30px 0px 30px;}
#three-boxes .akhir{ background:none;}
#three-boxes .frame67{ float:left; margin:0px 10px 0px 0px;}
#three-boxes .readmore{ padding:10px 0px 10px 0px;}

/* ---------------------{ Banner }--------------------- */

#banner{ clear:both; width:1030px; margin:20px 0px 20px -5px; height:86px; text-transform:uppercase;}
#banner .banner-left{ float:left; width:66%; text-align:center; padding:35px 0px 0px 0px; }
#banner .banner-right{ float:right; width:180px; padding:35px 0px 0px 0px; color:#fff; }
#banner .banner-right h3 a{color:#fff;}
#banner .banner-right h3 a:hover{color:#000;}

/* ---------------------{ Recent Work }--------------------- */

#recent-work{ clear:both; width:1030px; padding:30px 0px 20px 0px;  margin-left:-5px;}
#recent-work .title{ clear:both;}
#recent-work .orange-title{ float:left; background:url(images/title-bg.png) top left no-repeat; width:33%; height:48px; }




#recent-work .orange-title h2{ color:#fff; text-transform:uppercase; font-size:18px; padding:12px 0px 0px 10px;}
#recent-work .right-title{ float:left; width:66%; }
#recent-work .right-title h3{text-transform:uppercase; padding:12px 0px 0px 10px; }
#recent-work .frame239{ background:url(images/frame239-bg.png) left top no-repeat; width:239px; height:150px; padding:4px 0px 0px 11px;}





/* ---------------------{ 3 Widget }--------------------- */

#three-widget{ clear:both; width:100%; padding:30px 0px 20px 0px;}
#three-widget .content{ clear:both; padding:20px 0px 0px 0px;}
#three-widget .box{ float:left; width:33%; background:url(images/vertical-line.png) right center no-repeat;}
#three-widget .box-content{padding:0px 30px 0px 30px;}
#three-widget .akhir{ background:none;}
#three-widget h3{text-transform:uppercase;}
#three-widget li, #three-widget ul{list-style:none; font-size:11px; padding:0; margin:0; }
#three-widget li {border-bottom: 1px solid #eeeeee; padding:0px 0px 5px 0px; margin-bottom:5px;}
#three-widget .frame67{ background:url(images/frame67-bg.png) left top no-repeat; float:left; margin:0px 10px 0px 0px; width:67px; height:61px; padding:3px 0px 0px 6px;}
#three-widget .metas{ color:#a7a7a7;}
#three-widget .metab{ color:#4b4b4b; font-style:normal; }
#three-widget .italic{ font-style:italic;}
#three-widget a{color:#666666;}
#three-widget a:hover{color:#000;}

/* ---------------------{ Client Slider }--------------------- */


#client-slider{ clear:both; width:1030px; padding:20px 0px 20px 0px;  margin-left:-5px;}
#client-slider .title{ clear:both;}
#client-slider .orange-title{ float:left; background:url(images/title-bg.png) top left no-repeat; width:200px; height:48px; margin-top:20px; }




#client-slider .orange-title h2{ color:#fff; text-transform:uppercase; font-size:18px; padding:12px 0px 0px 10px;}
#client-slider .slider{  float:left; width:675px;}

#banner1{clear:both;background:url(images/banner-bg1.png) top center no-repeat;width:978px;height:317px;position:relative;margin:20px auto 10px auto;padding-right:3px;	}

/* ---------------------{ Sidebar}--------------------- */
#sidebar ul{ list-style:none; margin:0px 0px 0px 0px; padding:0px 0px 20px 0px; }
#sidebar ul ul{ padding:0px 0px 0px 0px; }
#sidebar li{ list-style:none; padding:3px 0px 3px 0px; }
#sidebar li li{ padding:3px 0px 3px 10px;}

/* ---------------------{ Footer }--------------------- */

/* ---------------------{ Footer Top}--------------------- */

#footertop{width:990px; margin:0px auto; padding:40px 0px 40px 30px; color:#666666; }
#footertop .footer-sidebar{ float:left; display:inline; width:180px; padding-right:30px; padding-left:30px; color:#c3c3c3;}
#footertop .last{ padding-right:0px;}

/* ---------------------{ Footer Widget}--------------------- */
.footer-widget { margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; color:#ffffff; }
.footer-widget h2 { padding:0px 0px 10px 0px; color:#cdcdcd; font-size:20px; }
.footer-widget a { color:#ffffff; }
.footer-widget a:hover { color:#ffffff; }
.footer-widget p { padding-bottom:5px; }
.footer-widget ul { clear:both; margin:0px; padding:10px 0px 0px 0px; list-style:none; }
.footer-widget ul li { padding:5px 0px 5px 0px;}
.footer-widget ul li a { padding:0px 0px 3px 15px; background:url(images/dot.png) 0px 3px no-repeat;}
.footer-widget ul li a:hover {background:url(images/dot-h.png) 0px 3px no-repeat;}
.footer-widget ul ul { margin:0px; padding:0px 0px 0px 0px; border-top:none; }
.footer-widget ul ul li { border:none; padding:0px 0px 0px 5px; }
.footer-widget ul ul ul { margin:0px; padding:0px 0px 0px 0px; border-top:none; }
.footer-widget .textwidget{ padding:10px 0px 0px 0px;}


#footer{ width: 1020px; margin:0px auto;height:45px;  }
#footer .left{float:left; display:inline; width:760px; padding:8px 0px 0px 30px; color:#9a9a9a}
#footer .right{float:right; display:inline; width:200px; padding:8px 30px 0px 0px;}
#footer .left ul{list-style:none; margin:0; padding:5px 0px 5px 0px; }
#footer .left li{float:left; padding:0px 5px 0px 5px; }
#footer .left a{color:#9a9a9a; text-decoration:none;}
#footer .right ul{list-style:none; margin:0; padding:5px 0px 5px 0px; }
#footer .right li{float:right; padding:0px 5px 0px 5px; }
#footer .right a{color:#fff; text-decoration:none;}


.block_slider_nivo{clear:both; width:1020px; height:442px; background:url(images/slide-bg.png) top center no-repeat; overflow:hidden;}
.slider_nivo {padding:5px 0px 0px 37px;}

#banner-slider{
	clear:both;
	background:url(images/slide-bg.png) top center no-repeat;
	width:1020px;
	height:442px;
	position:relative;
	margin:0px auto 30px auto;
}


.block_slider_thumbnail {width:940px; height:380px;}


/* ---------------------{ Post }--------------------- */
.post { }

.entry { }
.entry a { }
.entry a:hover { }

.meta { font-size:12px; font-style:italic; margin-bottom:10px; }
.postmetadata { font-size:12px; font-style:italic; margin-bottom:10px; }

	
/* ---------------------{ Navigation }--------------------- */
.navigation { }
   .next-posts { }
   .prev-posts { }
.pagesa {clear:both;padding:20px 0;position:relative;}
.pagesa span, .pagesa a {display:block;float:left;margin: 2px 2px 2px 0;padding:6px 9px 5px 9px;text-decoration:none;width:auto;color:#000;}
.pagesa a:hover{color:#f00;}
.pagesa .current{padding:6px 9px 5px 9px;background: #3279BB;color:#fff;}

/* ---------------------{ Search Form }--------------------- */
#searchform { padding:0px 0px 0px 0px;  }
	#searchsubmit{ padding:0px 0px 0px 0px;}
	#s { padding:3px 0px 2px 26px; background:none; border:none; width:110px; color:#4b4b4b;  font-size:11px; font-style:italic; }
	#submit, #sendmail {-moz-border-radius: 5px; -webkit-border-radius: 5px;-khtml-border-radius: 5px;  background:#797979; padding:4px 8px 4px 8px; color:#FFFFFF; border:none; }
	.reply-entry{ padding:7px 0px; }


/* ---------------------{ Comment }--------------------- */
	
ol.commentlist { list-style: none; }
ol.commentlist li { }
ol.commentlist li.alt { }
ol.commentlist li.bypostauthor { }
ol.commentlist li.byuser { }
ol.commentlist li.comment-author-admin { }
ol.commentlist li.comment { border-bottom: 1px dotted #666; padding: 10px; }
ol.commentlist li.comment div.comment-author { }
ol.commentlist li.comment div.vcard { }
ol.commentlist li.comment div.vcard cite.fn { font-style: normal; }
ol.commentlist li.comment div.vcard cite.fn a.url { }
ol.commentlist li.comment div.vcard img.avatar { float:right; margin: 0 0 10px 10px; }
ol.commentlist li.comment div.vcard img.avatar-32 { }
ol.commentlist li.comment div.vcard img.photo { }
ol.commentlist li.comment div.vcard span.says { }
ol.commentlist li.comment div.commentmetadata { }
ol.commentlist li.comment div.comment-meta { font-size: 10px; }
ol.commentlist li.comment div.comment-meta a { color: #ccc; }
ol.commentlist li.comment p { }
ol.commentlist li.comment ul { }
ol.commentlist li.comment div.reply { font-size: 11px; }
ol.commentlist li.comment div.reply a { font-weight: bold; }
ol.commentlist li.comment ul.children { list-style: none; margin: 10px 0 0; }
ol.commentlist li.comment ul.children li { }
ol.commentlist li.comment ul.children li.alt { }
ol.commentlist li.comment ul.children li.bypostauthor { }
ol.commentlist li.comment ul.children li.byuser { }
ol.commentlist li.comment ul.children li.comment { }
ol.commentlist li.comment ul.children li.comment-author-admin { }
ol.commentlist li.comment ul.children li.depth-2 { border-left: 5px solid #555; margin: 0 0 10px 10px; }
ol.commentlist li.comment ul.children li.depth-3 { border-left: 5px solid #999; margin: 0 0 10px 10px; }
ol.commentlist li.comment ul.children li.depth-4 { border-left: 5px solid #bbb; margin: 0 0 10px 10px; }
ol.commentlist li.comment ul.children li.depth-5 { }
ol.commentlist li.comment ul.children li.odd { }
ol.commentlist li.even { background: #fff; }
ol.commentlist li.odd { background: #f6f6f6; }
ol.commentlist li.parent { border-left: 5px solid #111; }
ol.commentlist li.thread-alt { }
ol.commentlist li.thread-even { }
ol.commentlist li.thread-odd { }

/* ---------------------{ Input }--------------------- */
form { }
input[type=text] { }
textarea { }

/* ---------------------{ Post Image }--------------------- */
img.centered { display:block; margin-left:auto; margin-right:auto; margin-bottom:10px; padding:0px; padding:5px; border: 1px solid #ddd;}
img.alignnone {  margin:0px 0px 10px 0px; display:inline; padding:5px; border: 1px solid #ddd;}
img.alignright {  margin:0px 0px 10px 10px; display:inline; padding:5px; border: 1px solid #ddd;}
img.alignleft { margin:0px 10px 10px 0px; display:inline; padding:5px; border: 1px solid #ddd;}
.aligncenter { display:block; margin-left:auto; margin-right:auto; margin-bottom:10px;  }
.alignright { float:right; margin:0px 0px 10px 10px; }
.alignleft { float:left; margin:0px 10px 10px 0px; }
.wp-caption { background:#F7F7F7; text-align:center; padding:4px 0px 5px 0px; border:1px solid #e6e6e6; }
.wp-caption img { margin:0px 0px 5px 0px; padding:0px; border:0px; }
.wp-caption p.wp-caption-text { margin:0px; padding:0px; font-size:11px; font-weight:normal; line-height:12px; }
.garis{height:1px; clear:both; background:#bbbbbb; width:100%; -webkit-box-shadow: 0px 3px 3px rgba(255, 255, 255, 0.7); -moz-box-shadow: 0px 3px 3px rgba(255, 255, 255, 0.7);box-shadow: 0px 3px 3px rgba(255, 255, 255, 0.7);}

/* CLEARFIX
----------------------------------------------- */

.clearboth {
	display: block;
	margin: 0;
	padding: 0;
	clear: both;
}

/* PORTFOLIO FILTER STYLE
----------------------------------------------- */

#portfolio-filter {
	list-style-type: none;
}

#portfolio-filter li {
	display: inline;
	padding-right: 10px;
}

#portfolio-filter li a {
	color: #777;
	text-decoration: none;
}

#portfolio-filter li .current,
#portfolio-filter li:hover {
	color: #084a9a;
}

/* PORTFOLIO LIST STYLE
----------------------------------------------- */

#portfolio-wrapper {
	padding-bottom: 25px;
}

#portfolio-list {
	list-style-type: none;

}

#portfolio-list .portfolio-item {
	width: 321px;
	height:420px;
	float: left;
	margin-right: 5px;
	background:url(images/portfolio-bg.png) top center no-repeat;
	margin-bottom:20px;
}


#portfolio-list .thumb{ padding:13px 0px 30px 25px;}
#portfolio-list .textbox{ padding:5px 25px 30px 25px;}
#portfolio-list .readmore{ padding:5px 0px 0px 160px;}




.theme{color:#ff6634;}

} /* END screen media */


@media print {

.do-not-print { display: none; }
#comments { page-break-before: always; }

body { width: 100% !important; margin: 0 !important; padding: 0 !important; line-height: 1.4; word-spacing: 1.1pt; letter-spacing: 0.2pt; font-family: Garamond,"Times New Roman", serif; color: #000; background: none; font-size: 12pt; }
h1,h2,h3,h4,h5,h6 { font-family: Helvetica, Arial, sans-serif; }
h1 { font-size: 19pt; }
h2 { font-size:17pt; }
h3 { font-size:15pt; }
h4,h5,h6 { font-size:12pt; }
code { font: 10pt Courier, monospace; } 
blockquote { margin: 1.3em; padding: 1em; }
img { display: block; margin: 1em 0; }
a img { border: none; }
table { margin: 1px; text-align:left; }
th { border-bottom: 1px solid #333;  font-weight: bold; }
td { border-bottom: 1px solid #333; }
th, td { padding: 4px 10px 4px 0; }
caption { background: #fff; margin-bottom: 2em; text-align: left; }
thead { display: table-header-group; }
tr { page-break-inside: avoid; } 
a { text-decoration: none; color: black; }
	
} /* END print media */