/*
Theme Name: Stationery
Theme URI: http://themes.bavotasan.com/our-themes/premium-themes/stationery
Description: A Premium Theme with a fully customizable layout. Theme options include site width, widgetized sidebars and footer bar, header logo, Google Analytics, multiple front page layouts and tons more. Also includes dynamic SEO keywords and page descriptions. Tested on WP 2.7.x and up, using Firefox 3.5, IE 7 & 8. Fully optimized for search engine ranking. 100% valid xHTML. Designed by <a href="http://themes.bavotasan.com">Themes by bavotasan.com</a>.
Version: 1.0.1
Author: c.bavota, Juan Gordillo
Author URI: http://themes.bavotasan.com/
Tags: right-sidebar,left-sidebar,fixed-width,three-columns,two-columns,white,custom-header,theme-options

	The CSS, XHTML and design is released under GPL:
	http://www.opensource.org/licenses/gpl-license.php

*/

/* Basic Tag Elements */

a {
	text-decoration: none;
	outline: none;
	color: #655B45;
	}
	
	a:hover {
		text-decoration: underline;
		}
	
img { 
	border: 0;
	height: auto;
	}

body {
	padding: 0; 
	margin: 0 auto;
	background: url(images/bg.jpg) no-repeat top center #F7E3BD;
	color: #111;
	}

#body { 
	font-size: 12px;
	background: #fff5e0;
	float: left;
	padding:  0 0 20px 20px;
	border: 1px solid #E8DCC1;
	border-top: 0;
	}

h1 a, h2 a, h3 a, h4 a, h5 a {
	color: #222;
	}

textarea {
	width: 94%;
	}
	
.fl {
	float: left;
	}
	
.fr { 
	float: right;
	}
	
div.clear {
	clear: both;
	margin: 0;
	padding: 0;
	}
	
/* Header Elements */

#header{
	clear: left;
	float: left;
	width: 98%;
	}

#headerad {
	width: 468px;
	padding: 0 20px;
	}	

#title {
	font-size: 48px;
	margin: 0;
	padding: 0;
	line-height: 50px;
	}
	
	#title a {
		color: #111;
		}		
	
	#title a:hover {
		color: #655B45;
		text-decoration: none;
		}
		
#description {
	font-size: 12px;
	margin: 0 10px 30px;
	padding: 0;
	}		
	
#topheader {
	width: 98%;
	float: left;
	border-bottom: 1px solid #ccc;
	margin-bottom: 20px;
	position: relative;
	}	
	
#navigation {
	border-bottom: 1px solid #111;
	float: left;
	width: 100%;
	}
/*
#navigation ul	{
	padding: 0; 
	margin: 0;
	}
	
	#navigation ul li {
		position:relative;
		list-style-type: none;
		float: left;
		font-size: 12px;
		line-height: 18px;
		padding: 0;
		margin: 0;
		position: relative;
		}
	
	#navigation ul a {
		display: block;
		margin: 0;
		padding: 20px 15px 5px;
		}
		
		#navigation ul a:hover {
			text-decoration: none;
			color: #fff;
			}

#navigation ul ul { position:absolute; top:43px; left:0; background: url(images/navbox.png) no-repeat left bottom; display:none; list-style:none; padding: 10px 0; width:161px; }
#navigation ul ul li {position:relative; border-top: 0;width:130px; margin:0; padding: 3px 15px; }
#navigation ul ul li a {display:block; padding:0;  border-right: 0; font-size: 12px; color: #fff; }
#navigation ul ul li a:hover { color: #aaa; }
*/
#s {
	float: left;
	border: 1px solid #ccc;
	background: #eee;
	padding: 5px;
	height: 20px;
	font-size: 16px;
	width: 56%;
	color: #111;
	margin-bottom: 20px;
	}
	
#searchsubmit {
	float: left;
	width: 30%;
	padding: 7px 0 6px;
	font-size: 12px;
	color: #fff;
	margin-left: 1%;
	}

/* Main Elements */

#leftcontent #slideshow img {
	max-width: none;
	}

#slideshow {
	position: relative;
	}

#slider {
	height: 300px;
	border: 1px solid #111;
	background: #111;
	position:relative;	
	overflow:hidden;
	}

#slider a.readmore {
	background: #444;
	padding: 5px 10px;
	border: 1px solid #555;
	color: #fff;
	}
	
#slider a:hover.readmore {
	background: #888;
	border: 1px solid #999;
	color: #000;
	text-decoration: none;
	}	

#mask-gallery {
	overflow:hidden;	
	}

#gallery {
	/* Clear the list style */
	list-style:none;
	margin:0;
	padding:0;
	}

	#gallery li {
		/* float left, so that the items are arrangged horizontally */
		float:left;
		}
		
#scrollerbuttons {
	position: absolute;
	right: 5px;
	bottom: 5px;
	}

#mask-excerpt {
	
	/* Set the position */
	position:absolute;	
	top:0;
	left:0;
	z-index:500;
	
	/* width should be lesser than #slider width */
	width:200px;
	overflow:hidden;	
	}
	
#excerpt {
	/* Opacity setting for different browsers */
	filter:alpha(opacity=70);
	-moz-opacity:0.7;  
	-khtml-opacity: 0.7;
	opacity: 0.7;  
	
	/* Clear the list style */
	list-style:none;
	margin:0;
	padding:0;
	
	/* Set the position */
	z-index:10;
	position:absolute;
	top:0;
	left:0;
	
	/* Set the style */
	width:200px;
	background-color:#000;
	overflow:hidden;
	font-family:arial;
	font-size:12px;
	line-height: 18px;
	color:#fff;	
}

	#excerpt li {
		padding:5px 10px;
	}
	


#sidebar {
	float: right;
	margin: 0;
	padding: 0;
	}

#secondsidebar {
	float: right;
	margin: 20px 20px 0 0;
	padding: 0;
	}
		
.side-widget {
	float: left;
	margin: 0 0 10px;
	padding: 0 0 15px;
	font-size: 12px;
	line-height: 18px;
	position: relative;
	}
	
	.side-widget ul {
		padding: 0;
		margin: 0;
		list-style-type: none;
		clear: left;
		}

	.side-widget ul li {
		padding: 0 10px 10px;
		margin: 10px 0;
		border-bottom: 1px solid #ccc;
		}
	
	#sidebar .side-widget h2 {
		font-size: 14px;
		float: left;
		padding: 0 25px 0 10px;
		text-transform: uppercase;
		margin: 0 0 10px;
		height: 40px;
		letter-spacing: 1px;
		line-height: 30px;
		color: #fff;
		}
		
		#sidebar .side-widget .h2-left {
			width: 10px;
			height: 8px;
			position: absolute;
			left: 10px;
			top: 30px;
			}
			
	#secondsidebar .side-widget h2 {
		font-size: 14px;
		float: left;
		padding: 0 10px 0 10px;
		text-transform: uppercase;
		margin: 0 0 10px;
		height: 40px;
		letter-spacing: 1px;
		line-height: 30px;
		color: #fff;
		}
		
		#secondsidebar .side-widget .h2-left {
			width: 10px;
			height: 8px;
			position: absolute;
			left: 10px;
			top: 30px;
			}
				
	.side-widget .sidebox {
		clear: left;
		float: left;
		margin-left: 15px;
		}	
		
	.side-widget #s {
		width: 90%;
		}
		
	.side-widget .rsswidget img {
		display: none;
		}	
		
	.side-widget .sideport {
		border: 3px solid #fff;
		margin: 3px;
		
		}
		
.side-widget .authorlist li {
	clear: left;
	float: left;
	margin: 0 0 15px 0;
	border: 0;
	padding: 0;
	}	

.side-widget .authorlist img.photo {
	width: 40px;
	height: 40px;
	float: left;
	}

.side-widget .authorlist div.authname {
	margin: 12px 0 0 10px;
	float: left;
	}		
	
/* Pagination */	
	
.pagination {
	margin: 30px 0 10px;
	float: left;
	background: #F7E3BD;
	width: 95%;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 12px 2% 10px;
	}	

.pagination a {
	padding: 3px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #ccc;
	color: #666;
	background-color: #FFFFFF;	
}

.pagination a:hover {	
	border: 1px solid #444;
	color: #444;
	background-color: #FFFFFF;
}

.pagination span.pages {
	padding: 3px 4px 2px 4px; 
	margin: 2px 2px 2px 2px;
	color: #666;
	border: 1px solid #ccc;
	background-color: #FFFFFF;
}
.pagination span.current {
	padding: 3px 4px 2px 4px; 
	margin: 2px;
	border: 1px solid #666;
	color: #444;
	background-color: #FFFFFF;
}
.pagination span.extend {
	padding: 3px 4px 2px 4px; 
	margin: 2px;	
	border: 1px solid #ccc;
	color: #444;
	background-color: #FFFFFF;
}	
		
/* contact */

.contactmain {
	clear: both;
	padding: 5px 0 0 0;
	}		
	
	.contactmain p {
		line-height: 30px;
		}
		
	.contactmain input, .contactmain textarea {
		padding: 5px;
		}
		
	.contactmain input#submit {
		border: 0;
		padding: 5px 20px;
		cursor: pointer;
		color: #fff;
		}
	
	.contactmain #contactform {
		clear: left;
		padding-top: 20px;
		}
		
	.contactmain #contactform label {
		font-size: 11px;
		}
		
	.contactmain .map {
		float: right;
		padding-bottom: 5px;
		}
		
		.contactmain .map a {
			color: #655B45 !important;
			}
		
/* sideads */


.sideads {
	clear: left;
	float: left;
	padding: 0 0 0 2%;
	width: 100%;
	}
	
	.sideads img {
		float: left;
		margin: 6px;
		}
		
	.sideads img.clear {
		clear: left;
		}

.readmore {
	color: #655B45;
	}
	
.catheader {
	margin: 0;
	font-size: 30px;
	line-height: 32px;
	letter-spacing: 1px;
	}
	
	.catdesc {
		margin: 15px 2% 0;
		padding: 5px 15px;
		color: #111;
		font-size: 11px;
		background: #fff;
		border: 1px solid #eee;
		}
		
#footer {
	clear: both;
	float: left;
	width: 100%;
	padding: 0;
	font-size: 12px;
	background: #F7E3BD;
	}


		#footer .text {
			margin: 0;
			padding: 0;
			clear: both;
			}
			
		#footer .text p {
			clear: both;
			margin: 15px 0;
			}

		#footer .text span.backtotop {
			float: right;
			cursor: pointer;
			background: url(images/backtotop.png) no-repeat right;
			padding-right: 20px;
			}

		#footer .text ul {
			padding: 0;
			margin: 0;
			float: none;
			}


		#footer .text ul li {
			display: inline;
			list-style-type: none;
			padding: 0 10px;
			font-size: 12px;
			}
			
			#footer .text ul li a {
				}

#bottombar {
	margin: -1px auto 0;
	font-size: 13px;
	padding: 20px 0 20px 3%;
	color: #fff;
	float: left;
	width: 97%;
	}
	
	#bottombar a {
		color: #B2A68B;
		}
	
	#bottombar h3 {
		letter-spacing: 1px;
		}
		
		#bottombar ul {
			padding: 0 0 20px;
			margin: 0;
			}	
			
			#bottombar ul li {
				list-style-type: none;
				padding: 10px 0;
				border-bottom: 1px solid #ccc;
				}
	
	#bottombar .bottom-widget {
		float: left;
		width: 30%;
		margin-right: 3%;
		}
	
	#bottombar .rsswidget img {
		display: none;
		}		
	
/* Left Content Elements */

#leftcontent {
	clear: left;
	float: left;
	}
		
	.indexposts, .posts, .single {
		width: 100%;
		float: left;
		margin: 0;
		padding: 20px 3% 0 0;
		}	
		
		.single {
			padding-top: 0;
			}
			
		.single .postby {
			margin: 10px 0 5px;
			}	
		
	.highlight {
		float: left;
		width: 100%;
		}	
			
	.indexposts img, .posts img {
		margin-top: 15px;
		}	

	#leftcontent h1.posttitle {
		margin: 0;
		padding: 0 2%;
		font-size: 20px;
		line-height: 32px;
		font-weight: normal;
		clear: left;
		height: 40px;
		letter-spacing: 1px;
		position: relative;
		color: #fff;
		}
			
		#leftcontent h1.posttitle span.blackarrow {
			height: 8px;
			width: 10px;
			position: absolute;
			left: 10px;
			bottom: 2px;
			}
		
		#leftcontent h1.posttitle a {
			color: #fff;
			}
			
			#leftcontent h1.posttitle span.title {
				overflow: hidden;
				height: 30px;
				}

	#leftcontent h1.posttitle a:hover {
			text-decoration: none;
			}
		
	#leftcontent .postby {
		float: left;
		width: 96%;
		padding: 0 2%;
		}
		
		#leftcontent .postby div.comm {
			float: right;
			}
		
	#leftcontent .postentry {
		clear: left;
		margin: 0;
		float: left;
		font-size: 12px;
		line-height: 17px;
		width: 96%;
		padding: 0 2%;
		}
	
	div.comments-link {
		background: url(images/commentbox-r.png) no-repeat right top;
		padding: 0 7px 5px 0;
		text-align: right;
		float: left;
		margin: 0 10px 0 0;
		line-height: 18px;
		}
		
		.commentbox-l {
			background: url(images/commentbox-l.png) no-repeat left;
			float: left;
			height: 22px;
			width: 8px;
			margin: 0;
			}
		
#imagebar {
	clear: both;
	float: left;
	width: 100%;
	margin: 30px 0 10px;
	}

	#imagebar ul {
		padding: 0;
		margin: 0;
		}
		
		#imagebar ul li {
			float: left;
			list-style-type: none;
			margin: 0 2.4%;
			text-align: center;
			}

		#imagebar ul img {
			margin-bottom: 10px;
			}
			
		#imagebar ul li span a {
			padding: 5px 10px;
			color: #fff;
			display: block;
			}
			
/* Other Elements */

#tagcloud {
	width: 400px;
	text-align: center;
	margin: auto;
	padding: 20px;
	}	
	
#tagcloud a {
	color: #655B45;
	}

/* Comment Elements */

#comments {
	padding: 10px;
	float: left;
	clear: both;
	}

#respond {
	clear: both;
	padding: 10px;
	}
	
	#respond input, #respond textarea {
		border: 1px solid #B2A68B;
		padding: 10px;
		}
		
		#respond input#submit {
			cursor: pointer;
			border: 0;
			color: #fff;
			}
		
	 #respond p { font-size:11px; margin:0 0 1em; }	

	 ol.commentlist { list-style:none; margin:0; padding:0; }

	 ol.commentlist li { margin:0 0 20px; padding:10px; clear: both; float: left; width: 92%; background: #fff; }

	 ol.commentlist li.alt { background: #f6f6f6;  }


	ol.commentlist li ul li {
		border: 0;
		}

	 ol.commentlist li.pingback comment-author { padding:0 170px 0 0; }

	 ol.commentlist li div.vcard { font-size: 11px; line-height: 16px; width: 25%; float: left; margin-bottom: 10px;}

	 ol.commentlist li div.vcard .fn { font-style:normal; font-size: 11px; clear: both; }

	 ol.commentlist li div.vcard .fn a.url, .cancel-comment-reply a { color:#655B45; text-decoration:none; }

	 ol.commentlist li div.vcard .fn a.url:hover, .cancel-comment-reply a:hover { text-decoration: underline; }

	.cancel-comment-reply { clear: left; }

	 ol.commentlist li div.vcard img.avatar { margin-bottom: 5px; }

	 ol.commentlist li p { font-weight:normal; font-size: 12px; line-height: 16px; margin:5px 0 12px; width: 100%; }

	 ol.commentlist li ul { font-weight:normal; font-size: 12px; line-height: 16px; list-style:square; margin:0 0 12px; padding:0; }

	 ol.commentlist li div.reply { background:#B2A68B; border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; color:#fff; font:bold 9px/1 helvetica,arial,sans-serif; padding:6px 5px 4px;  text-align:center; width:36px; clear: left; float: left; }

	 ol.commentlist li div.reply:hover { background:#655B45;}

	 ol.commentlist li div.reply a { color:#fff; text-decoration:none; text-transform:uppercase; }

	 ol.commentlist li ul.children { list-style:none; margin:12px 0 0; text-indent:0; float: left; padding: 10px; }

	 ol.commentlist li ul.children li.depth-2 { margin:0 0 3px; }

	 ol.commentlist li ul.children li.depth-3 { margin:0 0 3px; }

	 ol.commentlist li ul.children li.depth-4 { margin:0 0 3px; }

	 ol.commentlist li ul.children li.depth-5 { margin:0 0 3px; }

/* Ad Space */

.footerad {
	clear: both;
	width: 100%;
	float: left;
	margin: 15px 0;
	text-align: center;
	}	
	
/* Superfish */


/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
	font-size: 		12px;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			4em; /* match top ul list item height */
	z-index:		1000;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	.0em;
}
.sf-menu a {
	padding: 		2.25em 1em .75em;
	text-decoration:none;
}

.sf-menu li li a {
	padding: 		.75em 1em;
	text-decoration:none;
}

.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#111;
}
.sf-menu li {
	background:		#fff5e0;
}

.sf-menu li:hover a, .sf-menu li.sfHover a,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline:		0;
	color: 			#fff;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url(images/arrows-ffffff.png) no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
li .sf-sub-indicator {
	margin-top: 1.5em;
}

li li .sf-sub-indicator {
	margin-top: 0;
}

a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url(images/shadow.png) no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}
		
/* WordPress Required Elements */

.aligncenter,
div.aligncenter {
   display: block;
   margin: 5px auto;
	border: 1px solid #3c5d79;
}

.alignleft, div.alignleft {
   float: left;
   margin: 5px 15px 5px 0;
	border: 1px solid #3c5d79;
}

.alignright, div.alignright {
   float: right;
   margin: 5px 0 5px 15px;
	border: 1px solid #3c5d79;
}

.alignnone {
	margin: 5px 0;
	border: 1px solid #3c5d79;
	}

.navigation .alignright, .navigation .alignleft {
	border: 0;
	margin: 0 10px;
	}
	
	.navigation a {
		color: #fff;
		font-size: 12px;
		padding: 5px 10px;
		background: #B2A68B;
		display: block;
		}

	.navigation a:hover {
		text-decoration: none;
		}

.navigation {
	clear: both;
	}


.wp-caption {
   border: 1px solid #ddd !important;
   text-align: center;
   background-color: #f3f3f3;
   padding-top: 4px;
   margin: 0;
   /* optional rounded corners for browsers that support it */
   -moz-border-radius: 3px;
   -khtml-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
}

.wp-caption img {
   margin: 0;
   padding: 0;
   border: 0 none;
}

.wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
   color: #444;
}

#today {
	color: #655B45;
	}

#wp-calendar {
	margin: auto;
	}
	
#colorchange ul {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 20px;
	right: 10px;
	}
	
	#colorchange ul li {
		float: left;
		list-style-type: none;
		}	
	
	#colorchange ul li a {
		border: 1px solid #aaa;
		width: 20px;
		height: 20px;
		margin-right: 3px;
		display: block;
		}
		
	#colorchange .black a {
		background: #111;
		}
		
	#colorchange .brown a {
		background: #361D12;
		}	
		
	#colorchange .blue a {
		background: #16406a;
		}
		
	#colorchange .red a {
		background: #9E2626;
		}	
	
#widthchange ul {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 20px;
	right: 110px;
	}
	
	#widthchange ul li {
		float: left;
		list-style-type: none;
		}	
	
	#widthchange ul li a {
		border: 1px solid #aaa;
		padding: 3px 8px;
		margin-right: 3px;
		display: block;
		color: #fff;
		background: #111;
		}