/*
Theme Name: Demo Reel
Description: The default theme for sjeditor.com
Author: Salvador Jaramillo
Version: 1.0
*/

/* BODY */
*{margin:0; padding:0;}
ol, ul {list-style: none;}
body {	
	color: #666;
	background-color: #222;
	background-image: url(images/demo_background.gif);
	background-repeat: repeat-x;
	font: 14px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
#container {width: 850px;text-align: left;margin: 0 auto 50px auto;}
a, a:visited, a:active {
	color: #a0b9eb;
	text-decoration: none;
	font-weight: bold;
}
a:hover {color: #4583ff; text-decoration: none;}

.center {text-align: center;}
.right {text-align: right;}
.clear {clear: both;}
.alignRight {
	float: right;
}
/* HEADER */
#header {
	margin: 0;
	padding: 20px 0px 50px 0px;height: 120px;}
#banner {
	background-image:url(images/DemoReelHeader.png);
	width:470px;
	height: 100px;
	margin: 50px auto 10px auto;
}
#topNav {float: right;}
#topNav ul {list-style: none;display: inline;}
#topNav li {
	float: left;
	border-right: 1px solid #656565;
	padding: 0 8px;
	font-size: .8em;
	letter-spacing: .05em;
	text-transform: uppercase;
}
#topNav li.current_page_item a {color: #666; border-left:medium; }


/* MAIN CONTENT */
#mainContent {
	background: #373737;
	border: 3px solid #6c6c6c;
	color:#b0b0b0;
	font-size: .9em;
	padding: 50px;
	border-bottom: 1px solid #222;
	
}
#demoReelSWF{width: 100%;margin: 0 auto; padding: 25px 0px;}

#mainContent p {
	margin: 1.2em 0;
	letter-spacing: .1em;
	line-height: 1.6em;
	text-align: justify;
}
#mainContent h2 {
	color: #a0b9eb;
	font-weight: bold;
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
}
blockquote {
	margin: 1em 3em;
	letter-spacing: .1em;
	line-height: 1.6em;
	border-left-style: solid;
	border-left-width: 1px;
	border-left: 2px solid #666;
	padding-left: 1em;
	
}
/* BLOG */
#blogContainer {
	border: 3px solid #6c6c6c;
	font-size: .9em;
	line-height: 1.6em;
	padding-top: 20px;
	border-bottom: 1px solid #222;
	background: #373737 url(images/blogBG.png) repeat-y;
	width: 844px;
}
#blogContent {
	text-align: justify;
	padding: 25px 25px 50px 50px;
	float:right;
	width: 550px;
}

#blogContent h2 {
	font-size: 1.8em;
	margin-bottom: .5em;
}

.blogEntry {
	color: #ddd;
	padding-bottom: 5px;
	background:url(images/blog_line.png) repeat-x scroll center bottom;
}
.blogEntry p {
	margin: 1.2em 0;
	letter-spacing: .1em;
	line-height: 1.6em;
	text-align: justify;
}

.blogEntry ol{
	list-style: decimal;
	margin-left: 3em;
}
.blogEntry ul{
	letter-spacing: .1em;
	line-height: 1.6em;
	list-style: disc;
	margin-left: 3em;
}

.postInfo {
	height:20px;
	font-size: .8em;
	background-color:#222;
	padding-left:10px;
	padding: 0 5px;
	margin-bottom: 10px;
	color: #999;
}


.footerInfo {
	height:20px;
	font-size: .8em;
	background-color:#222;
	padding-left:10px;
	padding: 0 5px;
	margin-bottom: 10px;
	color: #999;
}
.postInfo a {
	color:#4583ff; text-decoration: none;}

.postInfo a:hover {
	color: #a0b9eb; text-decoration: none;}
	
.tags {
	font-size: .9em;
	margin-bottom:30px;
	text-align: right;
	color: #ccc;
}

.wpcf7{
	width: 300px;
	float: left;
}
/* COMMENT BOX */
.gravs {margin-top:20px; padding:0 15px 0 15px;}
#commentsbox {color: #ccc;}
#comments {font-size:14px; border-top:5px solid #262626; font-family:Arial Bold;}
h2#respond {margin-top:10px; }
.commentlist{padding:20px; margin-top:10px;}
.comtop {background:#262626 url(images/comtop.gif) no-repeat top left; padding:5px 0px 0px 0px; width:524px;}
.combottom {background:url(images/combottom.gif) no-repeat top left; width:524px; height:10px; margin-bottom:25px;}
.commentlist p{ padding-top:5px;}
.commentmetadata {font-size:11px;}
#author, #email, #url {width:12em;font-size:13px; color:#000;font-weight:bold;padding:3px; margin-right:5px;border:1px solid #1b1b1b; background-color:#999;}
#submit{font:bold 1em Tahoma;margin-bottom:15px;margin-top:5px;padding:2px;}
#respond{padding-top:20px;padding-bottom:10px; font-weight:lighter;}
#comment{width:98%;border:1px solid #1b1b1b;font:13px Tahoma;color:#000;font-weight:bold; background-color:#999;}
h3 #comments {font-size:13px;}
#commentform h2 {font-size:14px; font-weight:normal;}

/* SIDEBAR  */
#sidebar {
	float:left;
	width: 205px;
	color: #ccc;
	}
.sideWidget {
	padding: 25px 20px;
}

.sideWidget ul {
	list-style:none;
	margin-bottom: 35px;
}
.sideWidget li {
	padding-bottom: 5px;
	background:url(images/sidebar_li.png) repeat-x scroll center bottom;
}
.sideWidget h2 {
	padding: 10px 0;
	margin:0;
	color:#fff;
	font-size: 1.4em;
	background:url(images/sidebar_li.png) repeat-x scroll center bottom;
}

/* FOOTER */
#footer {
	padding: 10px;
	background: #6c6c6c;
	text-align: center;
	margin-bottom: 20px;
}
#footer li{display: inline;}
.smallinfo {
	padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background: #6c6c6c;
	text-align: center;
	font: .8em Georgia, "Times New Roman", Times, serif;
	color: #cbcbcb;
} 
.smallinfo a{color: #FFF;}
smallinfo p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
#footbar img{padding: 5px 10px;}