/*
Theme Name: On-Boxes(tm)
Theme URI: http://www.jonatanflores.com/
Version: 0.8b
Author: <a href="http://www.jonatanflores.com">(c) 2010 Jonatan Flores</a> based on a SuperB theme ;)
*/

* {
	margin:0;
	padding:0;
}

body {			
	background: #e2e2e2 url(images/background.jpg) no-repeat top right;
	color:#444;
	font-family: Helvetica,Arial, sans-serif;
	font-size:11px;
	line-height: 1.3;
	padding:0px;
	margin:0px;
	margin-top:150px;
}

.clear {
	clear:both;
}
#page-loading {
	background-color:#FFFFFF;
	padding:6px;
	text-align:left;
	filter:alpha(opacity=95);
	-moz-opacity:0.95;
	-khtml-opacity: 0.95;
	opacity: 0.95;
	 z-index: 999999;
	position:fixed;
	left:0px;
	top:0px;
	width: 100%;
	height: 100%;
	background: white;
}


#header { z-index: 999998; position: fixed; top: 0; padding: 60px 140px 58px; background-color: #fff; width: 100%; margin: 0;
	filter:alpha(opacity=95);
	-moz-opacity:0.95;
	-khtml-opacity: 0.95;
	opacity: 0.95;

}	

#logo a {
	font-size:12px;
	margin:0 0 30px 0;
	text-transform:uppercase;
	letter-spacing:2px;
	font-weight:bold;
}
#logo span {
	color: #CCC;
}

#menu { 
	z-index: 40000; 
	position: fixed; 
	top: 0px; left: 410px; 
	background-color:#EAEAEA; 
	padding: 53px 41px 45px 40px; 
	filter:alpha(opacity=90);
	-moz-opacity:0.90;
	-khtml-opacity: 0.90;
	opacity: 0.90;
	border-top: 5px solid #BBB;
}

#menu ul li a { 
	padding: 0 5px 10px; 
	margin: 0; 
	font-size:11px; 
	text-transform:uppercase; 
	letter-spacing:2px; 
	font-weight:bold;
	display:block;
}

#news { 
	z-index: 40000; 
	position: fixed; 
	top: 0px; right: 140px; 
	background-color:#EAEAEA; 
	width: 220px; 
	padding: 55px 40px 30px; 
	filter:alpha(opacity=90);
	-moz-opacity:0.90;
	-khtml-opacity: 0.90;
	opacity: 0.90;
	border-top: 5px solid #BBB;
}

#news .article {
	padding: 0 0 10px;
	margin: 0 0 20px;
}

#news .article a {
	background-color: #20f6f6;
	padding: 4px;
	color: #FFF;
}
#news a.title {
	font-size:11px;
	padding: 0;
	margin:0;
	text-transform:uppercase;
	letter-spacing:2px;
	font-weight:bold;
	background: none;
	color: #333;
}
#allposts { margin: 208px 470px 20px 140px; }


a {	color:#333333; text-decoration:none; }

a:hover	{ color:#666666; text-decoration:none; }

img, a img		{ border: 0; padding: 0; margin: 0; }

.contentIndex p img { display:none; }

.eachpost { 	
	background: #fff;
	position:absolute;
	width: 220px;
	margin: 0 30px 30px 0;
	padding:10px;
}
				
.eachpost a.title { 				
	font-size:11px;
	font-weight:bold;
	letter-spacing:2px;
	margin:10px 0;
	text-transform:uppercase;
	display:block;
}			

.eachpost > small { color: #888888;  }
.eachpost > small a:hover { background-color: #7efdc6; color: #FFF; padding: 3px; }
	
.eachpost .author { padding-right: 3em; }

.author, .comment { text-decoration:none; }

.eachpost .signature { margin-top:1.5em; }

il, ul, ol { list-style-type: none; list-style: none; }



#mainContent img { display: none }
#mainContent {  -moz-border-radius:3px;
				-webkit-border-radius:3px;
  				-khtml-border-radius: 3px;
				border: 0;
				background: #fff;
				padding: 0 10px;
				margin-right: 10px;
				margin-bottom: 10px;
				width: 430px;
				float: left;
}
.main { font-size: 0px !important; }
.main p img {	
				border: 0;
				background: #fff;
				padding: 10px;
				margin-right: 10px;
				margin-bottom: 10px;
				display: inline; }

.twocols { 
	background: #fff;
	position:absolute;
	width: 490px;
	margin: 0 30px 30px 0;
	padding:10px;
}
.threecols { background: #ff3333 }

input, textarea, select, button{
				background-color:#white;
				padding: 3px;
				border:0px;
				margin-top: 5px;
				color:#666;
				font-size:11px;
				font-family: Arial, sans-serif;
				background-color: #F0F0F0; }
				
textarea { width: 420px; padding: 5px; }

input { padding: 5px; width: 240px; }

.bubble { width: 430px; margin-bottom: 10px; }

.bubble blockquote { background: #fff;
				margin: 0px;
   				padding: 3px;
				background: white; }

.bubble blockquote p { margin: 3px; padding: 0px; }

.bubble cite { 	position: relative;
				margin: -7px;
				padding: 7px 0px 13px 18px;
				top: 5px;
				background: transparent;
				font-style: normal;
				display: block; }

.commentmetadata { margin: 0; display: block; }

#commentBox a { text-decoration: none; }

small a { text-decoration: none; }

#footer {
	color:#999;
	padding:10px 11px;
	margin: 20px 0 0;
}

#running {
	position:fixed;
	bottom: 0;
	left: 0;
	color:#999;
	background-color:#FFF;
	padding:10px 11px;
}
#social {
	position:fixed;
	bottom: 0;
	right: 30px;
	color:#999;
	background-color:#FFF;
	padding:10px;
}

/* debut infinite scroll */

/* page blocking loading spinner 
#page-loading { z-index: 50000;
position:fixed;
width: 100%;
height: 100%;
background: #E2E2E2; }
*/

/*loading spinner*/
  #infscr-loading {
  background-color:#FFFFFF;
  padding:6px;
  position:fixed;
  bottom:60px;
  right:30px;
  text-align:left;
}
#infscr-loading span { display:none;}

/*navigation buttons (needed for infinite scroll) */
.prev {	padding:6px;
  background-color: #fffef0;
  width: 70px;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  margin-bottom: 20px;
}
.next {	padding:6px;
  background-color: #fffef0;
  width: 70px;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  margin-bottom: 5px;
}

/* end infinite scroll */


/* 6.2 Info Boxes */
p.alert, p.download, p.info, p.note, p.tick {  margin:10px 0 20px 0; padding:9px 10px 9px 50px; }
p.alert { border-top:1px solid #f0baa2; border-bottom:1px solid #f0baa2; background:#ffd9c8 url(images/ico-alert.png) no-repeat 20px 13px; }
p.download { border-top:1px solid #d4ebaf; border-bottom:1px solid #d4ebaf; background:#edfcd5 url(images/ico-download.png) no-repeat 20px 13px; }
p.tick { border-top:1px solid #d4ebaf; border-bottom:1px solid #d4ebaf; background:#edfcd5 url(images/ico-tick.png) no-repeat 20px 13px; }
p.info { border-top:1px solid #ccc; border-bottom:1px solid #ccc; background:#eee url(images/ico-info.png) no-repeat 20px 13px; }
p.note { border-top:1px solid #efe3ae; border-bottom:1px solid #efe3ae; background:#fef6d2 url(images/ico-note.png) no-repeat 20px 13px; }

/* 6.3 Contact Form */
#contactForm .screenReader { left: -9999px; position: absolute; top: -9999px; }
#contactForm ol.forms{float:left;list-style:none;width:100%;margin:10px 0 0;}
#contactForm ol.forms li{clear:both;float:left;margin-bottom:18px;position:relative;width:100%}
#contactForm ol.forms label{cursor:pointer;display:block;float:left;font-weight:700;padding-right:20px;width:100px;}
#contactForm ol.forms input.txt{width:214px;}
#contactForm ol.forms input#sendCopy{border:none;}
#contactForm ol.forms textarea{height:300px;width:70%;}
#contactForm ol.forms li .error{font-size:12px;display:block;margin-left:120px;color:red;}
#contactForm ol.forms li.textarea .error{display:block; margin-left:120px}
#contactForm ol.forms li.screenReader{margin-bottom:0;}
#contactForm ol.forms li.buttons .submit{margin: 15px 0 0 120px; }
#contactForm ol.forms li.inline input{width:auto;margin-left:120px;}
#contactForm ol.forms li.inline label{display:inline;float:none;width:auto;}

/* Photo Slider */
.container, #loopedSlider,#newsSlider, div.slides div,ul.slides li { width:490px; }
.container { height:320px; overflow:hidden; position:relative; cursor:pointer; }
div.slides { position:absolute; top:0; left:0; }
ul.slides { position:absolute; top:0; left:0; list-style:none; padding:0; margin:0; }
div.slides div,ul.slides li { position:absolute; top:0; display:none; padding:0; margin:0; }
#loopedSlider,#newsSlider { margin:0 0 20px; position:relative; clear:both; }
ul.pagination { list-style:none; padding:0; margin:10px 0 0; }
ul.pagination li { float:left; }
ul.pagination li a { padding:2px 4px 2px 0; opacity:0.7;}
ul.pagination li a:hover { opacity:1;}
ul.pagination li.active a { opacity:1;}
#loopedSlider a.next { position:absolute; top:200px; right:30px; opacity:0.5;}
#loopedSlider a.previous { position:absolute; top:200px; left:30px; opacity:0.5;}
#loopedSlider a.next:hover, #loopedSlider a.previous:hover { opacity:1; }
#loopedSlider .photo-caption { position:absolute; bottom:15px; right:20px; background:#222; color:#fff; padding:5px 10px;font-family:Georgia, "Times New Roman", Times, serif; font-size:14px; font-style:italic; border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px; opacity:0.7; }