/*
Theme Name: Opfocus Wordpress Theme
Theme URI: http://www.opfocus.com
Description: The Opfocus theme is a custom designed and custom built theme in support of the OpFocus online business.
Version: 0.1
Author: Joel Oliveira & Conor Feely
Author URI: http://exurbaninc.com
Tags: blue, green, 2column, fixed


/* =================================================== */
/* = reset.css courtesy of Eric Meyer - meyerweb.com = */
/* =================================================== */

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 {
	list-style: none;
}

ul {
clear:both;
display:block;
list-style:disc;
}

blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* -------------------------------------------------
     BASIC FORMATTING 
------------------------------------------------- */

body{ font-family:"Trebuchet MS", Trebuchet, Helvetica, Verdana, Tahoma, Arial, sans-serif; font-size:62.5%; line-height:2.2em; background:#185190 url('images/bg.gif') top left repeat; }

h1 {font-size: 2em;}
h2 {font-size: 1.4em; margin-top:10px;}
h3 {font-size: 1.2em; margin-top:10px;}
h4 {font-size: 1em;}

a{ color:#666; text-decoration:none;}
a:visited, a:active{color:#999;}
a:hover{color:#333; text-decoration:none;}
a img{border:none;}
a.PDF { padding-left:23px; background:transparent url('images/icon_pdf.gif') no-repeat scroll 0px 0px; }
a.DOC { padding-left:23px; background:transparent url('images/icon_doc.png') no-repeat scroll 0px 0px; }
a.XLS { padding-left:23px; background:transparent url('images/icon_xls.png') no-repeat scroll 0px 0px; }
a.PPT { padding-left:23px; background:transparent url('images/icon_ppt.png') no-repeat scroll 0px 0px; }


ul{margin:5px 0 5px 20px;}
ol{margin:5px 0 5px 20px;}

blockquote{
margin:10px 0 10px 20px;
padding:10px;
font-size:1.4em;
font-style: italic;
color:#999;}

pre, code{ margin:10px; font-family:"Courier New", Courier, monospace; }
.alignleft {float:left;}
.alignright {float:right;}

/* -------------------------------------------------
WRAP
------------------------------------------------- */
#dropshadowed { margin:0 auto; width:770px; padding:0 22px; background:transparent url('images/bg_shadow.png') repeat-y scroll top left; }
#pagewrap{width:770px;color:#666;background-color:#fff;}

/* -------------------------------------------------
HEADER
------------------------------------------------- */
#header {
	background: url('images/header_bg.jpg') no-repeat scroll top left;
	width: 770px;
	height: 148px;
	padding:0;
	overflow:hidden;
	position:relative;
}
#header h1 {
	width: 187px;
	height: 62px;
	padding:0;
	position:absolute;
	left:65px;
	top:16px;
}
#header h1 a {
	background: url('images/logo.png') no-repeat scroll top left;
	width: 187px;
	height: 62px;
	padding:0;
	text-indent:-9999px;
	display:block;
}
#header img {}
#header h2 {
	padding:0;
	color:#fff;
	font-family:"Trebuchet MS", Trebuchet, Helvetica, Verdana, Tahoma, Arial, sans-serif;
	font-weight:normal;
	position:absolute;
	top:29px; 
	left:510px;
	font-size:1.6em;
}

/* -------------------------------------------------
NAVIGATION
------------------------------------------------- */
#nav { position:absolute; bottom:29px; left:20px; }
#nav ul {
	clear:both;
	margin:0px;
	padding:0px;
	list-style:none;
	background: url('images/nav_bg.gif') repeat-x scroll top left;
	height: 28px;
}

#nav ul li {
	padding:0;
	margin:0;
	font-size:1.3em;
	font-weight: bold;
	font-family:"Trebuchet MS", Trebuchet, Helvetica, Verdana, Tahoma, Arial, sans-serif;
  width: 113px;
	display:block; 
	float:left;
	background:transparent url('images/nav_divide.gif') no-repeat bottom left;
}
#nav ul li.first { background:none; }
#nav ul li div { background:transparent url('images/nav_arrow.gif') no-repeat 93px center; }
#nav ul li a { color:#fff; line-height:28px; display:block; padding-left:20px; }
#nav ul li a:hover { color:#fff; background:transparent url('images/nav_divide_active.gif') no-repeat 1px bottom; }

#nav .current_page_item,
#nav .current_page_parent  { background: url('images/nav_bg_active.gif') repeat-x scroll top left; } 
#nav .current_page_item  div,
#nav .current_page_parent  div { background:transparent url('images/nav_arrow_active.gif') no-repeat 93px center; } 
#nav .current_page_item  a:hover,
#nav .current_page_parent  a:hover { background:transparent; }

#nav ul ul { display:none; background:transparent none repeat scroll 0 0;height:20px;left:3px;margin-top:7px;position:absolute;top:100%;z-index:200;}
#nav .current_page_item ul,
#nav .current_page_parent ul,
#nav li.over ul { display:block; }
#nav ul ul li { background:none !important; height:20px; width:auto; margin-right:14px; }
#nav ul ul li div { background:none !important; }
#nav ul ul li div a { background:transparent url('images/nav_subnav_divider.gif') no-repeat scroll right center !important; color:#fff; font-size:10px; line-height:20px; padding:0px 25px 0 0; }
#nav ul ul li div a:hover { color:#fff; text-decoration:underline; }
#nav ul ul li.last div a { background:none !important; }
#nav ul ul li.current_page_item a { font-style:italic; }

#supporting { position:absolute; top:0px; left:586px;}
#supporting ul {
	clear:both;
	margin:0px;
	padding:0px;
	list-style:none;
	height: 21px;
}
#supporting ul li { display:block; float:left; background: url('images/nav_support.gif') no-repeat scroll top center; }
#supporting ul li.first { background: url('images/nav_support.gif') no-repeat scroll top left; }
#supporting ul li.last { background: url('images/nav_support.gif') no-repeat scroll top right;  }
#supporting ul li a { display:block; padding:0px 10px; background: url('images/nav_support_divide.gif') no-repeat scroll top right; font-size:.9em; line-height: 21px; color:#336699; font-weight:bold;}
#supporting ul li.last a { background:none; }
#home #supporting ul li.first a { color:#6699cc; }

#subnav { height:23px; background:transparent url('images/header_subnav_bg.gif') repeat-x top left; position:absolute; bottom:0px; left:0px; width:100%;}
#subnav form { display:block; height:23px; float:right;}
#subnav form label { font-size:1em; color:#99ccff; padding-right:10px; }
#subnav form #s { border:none; height:14px; width:100px; }
#subnav form #Go { border:none; background:transparent; color:#99ccff; font-size:1em; padding:0 20px 0 0; background: url('images/search_button_bg.gif') no-repeat scroll 27px center;}

/* ============ */
/* = HOMEPAGE = */
/* ============ */

#splash { height:188px; overflow:hidden; width:100%; background:#99ccff; margin:14px 0; position:relative; }
#splash img.mega_uber_super_duper_ultra_mecha_splash { margin:0 21px; float:left; display:block; }
#splash h1,
#splash h2,
#splash h3 {
	background: url('images/home_splash_title.gif') no-repeat scroll top left;
	width: 226px;
	height: 24px;
	text-indent:-9999px;
	display:block;
	position:absolute;
	left:482px;
	top:40px;
}
	#splash p {
		display:block;
		position:absolute;
		left:482px;
		top:70px;
		font-size:1.3em;
		color:#fff;
		padding-right:10px;
	}


.dropped_and_bordered h1,
.dropped_and_bordered h2,
.dropped_and_bordered h3 { color:#006699; font-size:1.3em; padding:.5em 0; margin:0;}
.dropped_and_bordered h1 a,
.dropped_and_bordered h2 a,
.dropped_and_bordered h3 a,
.dropped_and_bordered h1 a:visited,
.dropped_and_bordered h2 a:visited,
.dropped_and_bordered h3 a:visited { background: url('images/home_title_arrow.gif') no-repeat scroll right center; color:#006699; padding-right:22px;}

.dropped_and_bordered p { color:#333333; font-size:.95em; line-height:1.3em; margin-bottom:1em;}

#home #content { float:none; width:100%; margin-top:0px; }
.wide_content { background: url('images/home_drop_wide.gif') no-repeat scroll bottom left; padding:0 16px 11px; width:730px; margin:0 0 20px 4px; }
.wide_content div { border:solid 1px #fff; }
.wide_content div div { padding:10px 20px 0; background:#fff url('images/home_content_gradient.gif') top left repeat-x; }

.med_content { background: url('images/home_drop_medium.gif') no-repeat scroll bottom left; padding:0 16px 11px; width:465px; margin:0 0 20px 4px; }
.med_content div { background:#fff url('images/home_border_gradient.gif') top left repeat-x; padding:1px; }
.med_content div div { padding:10px 20px 0; background:#fff url('images/home_content_gradient.gif') top left repeat-x; }

.narrow_content { background: url('images/home_drop_narrow.gif') no-repeat scroll bottom left; padding:0 16px 11px; width:233px; margin:0 0 20px 4px; }
.narrow_content div { background:#fff url('images/home_border_gradient.gif') top left repeat-x; padding:1px; }
.narrow_content div div { padding:10px 20px 0; background:#fff url('images/home_content_gradient.gif') top left repeat-x; }

#home .wide_content p { color:#000; font-size:1em; }
#home .narrow_content { float:right;  margin:0 4px 10px 0px; }
#home .med_content div div { height:164px; }
#home .narrow_content div div { height:371px; padding-right:4px; }
#home .narrow_content div div div { height:316px; padding:0; background:none; overflow:hidden; }
#home .narrow_content div div div h3,
#home .narrow_content div div div h3 a,
#home .narrow_content div div div h3 a:visited { color:#669933; background:none; }
#home .narrow_content div div div .meta { padding-left:20px; background: url('images/icon_tag.gif') no-repeat scroll top left; }
#home .narrow_content h2 { font-size:1.1em;}
#home .narrow_content h2 span { font-weight:normal; }

/* -------------------------------------------------
MAIN CONTENT - BLOG
------------------------------------------------- */
#contentwrap{ width: 100%; min-height:780px; height:auto !important; height:780px; }
#content { float:left; font-size:1.2em; margin:10px 0; width:502px; overflow:auto; }

/* archives page */
.archivetitle{font-size:1.2em; border-bottom: solid 1px #ddd;}
ul.archivelist{margin: 0; list-style: none;}
ul.archivelist li{padding:2px 0;}

.posts h1 { color:#003366; font-size:2em; font-weight:bold; line-height:2.4em; margin-left:57px; }
.posts h1 span { font-weight:normal; } 

.post { font-size:1.1em; margin-bottom:3em; }
.post .title { position:relative; width:502px;}
.post .title .date { background:#dae6cb; width:42px; height:50px; text-align:center; position:absolute; top:0px; left:0px;}
.post .title .date .month { color:#fff; font-size:16px; display:block; }
.post .title .date .day { color:#669933; display:block; font-size:24px; font-weight:bold; }
.post .title h2 { border:dotted 1px #669933; border-left:none; border-right:none; margin-left:57px; height:48px; overflow: hidden; position: relative; margin-top:0px; font-size:1.6em; width:445px;}
.post .title h2[class] {display:table; position:static;}
.post .title h2 span { position: absolute; top: 50%; }
.post .title h2 span[class] {display: table-cell; vertical-align: middle; position: static;}
.post .title h2 span a { color:#669933; position: relative; top: -50%; font-size:1em;}
.post .title h2 span a[title]{position: static;}
.post .title h2 span a:hover { color:#355c0e; text-decoration:underline; }
.post .title .by { margin:0 0 1em 57px; border-bottom:dotted 1px #669933; display:block; font-size:1em; background:transparent url('images/icon_tag_on_white.gif') no-repeat scroll center left; padding-left:20px; }
.post .title .by strong { color:#000;}
.post .title .comments { font-size:1em; position:absolute; right:25px; top:50px; margin:0;  background:transparent url('images/icon_comment.gif') no-repeat scroll center left; padding-left:20px; }
.post .post_content { margin-left:57px; width:445px; }
.post .post_content p { color:#464646; font-size:1.1em; line-height:1.4em; margin:0 0 1.6em 0; }
.post .post_content a { text-decoration:underline; color:#669933; }
.postmetadata { border-top:dotted 1px #ddd; margin-left:57px;  width:445px; /* background:transparent url('images/icon_tag_on_white.gif') no-repeat scroll center left; padding-left:20px; */}
.postmetadata a { text-decoration: none; color:#000; }
.postmetadata a:hover { color:#333; text-decoration:underline; }

/* style for table of icons  */
table.icon_view td { padding:0 20px 0px 0; }

/* single post nav for previous/next entries */
.navigation{ font-size:.9em; margin-left:57px; width:445px; clear:both; }

/* styling for 'continued' page links */
p.continued{padding:5px; background:#f0f0f0;}
p.continued a{padding:5px; font-weight:bold;}

/* -------------------------------------------------
MAIN CONTENT - PAGE
------------------------------------------------- */
.page { background:#fff url('images/sidebar_larger_arrow.gif') no-repeat scroll 96% 96%; }
.page #content { padding-left:20px; width:482px; overflow:hidden;}
.page #content h1 { color:#006699;font-size:2em;font-weight:bold; height:34px; line-height:1.4em; border-bottom:solid 1px #7aa744; padding-top:14px; }
.page #content .post { border-bottom:solid 1px #7aa744; padding-top:1em; }
.page #content .post p { margin-bottom:1em; }
/* -------------------------------------------------
COMMENTS
------------------------------------------------- */
#comments { margin-left:57px; width:445px; clear:both; padding:0 0 10px 0px; border-top:1px dotted #DDDDDD; }
#comments h3 { color:#669933; }
ol.commentlist {margin:0; padding:0; overflow: hidden;}
ol.commentlist li{ background:#fff; margin:10px 0;padding:10px;}
ol.commentlist li.alt { background:#f2f6ec; }
ol.commentlist a { color:#333; text-decoration:underline; }
ol.commentlist p { font-size:.9em; }
ol.commentlist p a { text-decoration:none; }
ol.commentlist a:hover { text-decoration:underline; }
ol.commentlist .commentmetadata a { text-decoration:none;}
cite {font-style: normal; font-weight: bold;}
small.commentmetadata {}

/* -------------------------------------------------
COMMENT FORM
------------------------------------------------- */
#commentform{margin-left:57px; width:445px; clear:both; padding:0 0 10px 0px; border-top:1px dotted #DDDDDD;}
#commentform h3 { color:#669933; }
#commentbox{width:75%;min-width:400px;margin:5px 5px 0 0;}
#author, #email, #url, textarea, #submit{border:solid 1px #ccc; margin:5px 5px 0 0;}
#submit{cursor:pointer;}

/* -------------------------------------------------
SIDEBAR
------------------------------------------------- */		
#pagewrap .blog { background:transparent url('images/sidebar_bg_green.gif') repeat-y scroll top right; }
#sidebar_left { float:right; width:220px; padding:16px 20px 10px 20px; color:#666666;}
#sidebar_left h2 { margin-top:20px; color:#669933; border-bottom:dotted 1px #669933; padding-bottom:10px; }
#sidebar_left p {}
#sidebar_left a {color:#666;}
#sidebar_left a:hover {color:#999;}
#sidebar_left ul{margin:0;padding:0;list-style:none;}
#sidebar_left ul li { padding: 2px; padding-top:0; }
#sidebar_left ul li a { display:block; }
#sidebar_left ul ul {}
#sidebar_left ul ul li { border-bottom:dotted 1px #669933; }
#sidebar_left .cat-item a { padding-left:20px; background:transparent url('images/icon_folder.gif') no-repeat scroll left 5px; }
#sidebar_left .widget_archive a { padding-left:20px; background:transparent url('images/icon_tag.gif') no-repeat scroll left 5px; }
#sidebar_left .recentcomments { padding-left:20px; background:transparent url('images/icon_comment_on_green.gif') no-repeat scroll left 5px; }

#sidebar_right { float:right; color:#666666; padding:58px 0 100px;}
#sidebar_right ul { margin:0; } /* entire sidebar wrapper */
#sidebar_right ul li { background: url('images/home_drop_narrow.gif') no-repeat scroll bottom left; padding:0 16px 11px; width:233px; margin:0; } 	/* each widget's container */
#sidebar_right ul li div { background:#fff url('images/home_border_gradient.gif') top left repeat-x; padding:1px; width:233px; } 					/* each widget's container // EXTRA tag for styling purposes */
#sidebar_right ul li div div { padding:10px 14px; width:205px; background:#fff url('images/home_content_gradient.gif') top left repeat-x; } 			/* each widget's container // EXTRA EXTRA tag for styling purposes */
#sidebar_right ul li div div h2 { color:#185190; font-size:1.5em; margin:0;} 																		/* each widget's title */
#sidebar_right ul li div div ul,
#sidebar_right ul li div div ul li,
#sidebar_right ul li div div div { padding:0; background:transparent; margin:0; width:auto; font-size:11px;} 														/* each widget's content */
#sidebar_right ul li div div ul { margin-top:1em; }
#sidebar_right ul li div div div p { margin-top:1em; }
#sidebar_right ul li div div div a { color:#6a943e; }
#sidebar_right .blogroll li { margin:8px 0 0; }
#sidebar_right .blogroll li a { display:block;  color:#6a943e; }

/* Quote Widget Style */
#sidebar_right ul li div.quote { background:#dae6cb; } 		
#sidebar_right ul li div.quote .qwrap { display:none; }
#sidebar_right ul li div.quote div { background:transparent; padding:0px; width:100%; }
#sidebar_right ul li div.quote div h2 { display:none; }
#sidebar_right ul li div.quote div p { margin:0; color:#333333; line-height:1.2em; padding:10px 14px; }
#sidebar_right ul li div.quote div p.client_info { background:#fbfdfe url('images/icon_bubble_arrow.gif') no-repeat scroll 14px top; padding:20px 14px 11px; }
#sidebar_right ul li div.quote div p.client_info cite { display:block; clear:both;}



/* -------------------------------------------------
FEATURE LINKS
------------------------------------------------- */
.rss, .archive{
font-size: 1.2em;
font-weight: bold;
line-height: 1.4em;
background: #f0f0f0;
padding-left: 5px !important;
margin-top:10px;}
.rss a { padding-left:25px; background: transparent  url(images/feed-icon-16x16.png) left no-repeat; }
.archive a{ padding-left:25px; background: transparent  url(images/square.png) left no-repeat;}

/* -------------------------------------------------
FOOTER
------------------------------------------------- */
#footer { clear:both; background:#003366; border-bottom:solid #6a943e 24px; padding:15px 20px; }
#footer p { padding:0px 0; color:#cccc66;} 
#footer .copy { color:#99ccff;}
#footer .subscribe { float:right; }
#footer .subscribe a { background: url('images/feed-icon-16x16.png') no-repeat scroll top left; padding-left:20px; font-size:1em; color:#cccc66;}

/* ============= */
/* = SCROLLBAR = */
/* ============= */
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #e4edd8 !important;
}
.jScrollPaneDrag {
	position: absolute;
	background: #d1e1be !important;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}

/* -------------------------------------------------
CLEARS (if needed with further customizations)
------------------------------------------------- */
.clear{clear:both;}
.clearfix{display:inline-block;}
.noborder{border:none !important; vertical-align:middle;}
.left{float:left; border:none !important; margin:5px;}
.right{float:right; border:none !important; margin:5px;}