/*
Theme Name: Jasar Web Solutions
Theme URI: http://jasarwebsolutions.com
Description: The official site of Jasar Web Solutions.
Version: 2.8.5
Author: Jason Sandburg
Author URI: http://jasarwebsolutions.com
Tags: Jasar, web development
*/

/*@import "style/css/reset.css";
@import "style/css/typography.css";
@import "style/css/layout.css";*/

@charset "UTF-8";
/* CSS Document */

/*reset start*/
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;
	margin:0px;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: 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;
}
/*reset end*/

/*body and structure ================================================================================================= */
html{
	background:url(images/page_bg.jpg) repeat-x top  #F5F5F5 fixed;
}

body  {
	font-family: Arial, Helvetica, sans-serif;
	background: url(images/criss_cross_bg.png) no-repeat top center fixed;
	
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	font-size:13px;
	line-height:20px;
}
#container { 
	width: 936px; 
	padding:0;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */	
	text-align: left; /* this overrides the text-align: center on the body element. */
	/*border:#333333 thin solid;*/
}
#topcontainer{
	/*background: url(images/bg_glow.png) repeat-y top center;*/
}
#wrap{/*include everything except for the footer*/
	width:936px;
	margin: 0 auto;
	position:relative;
} 
#header { 	
	height:90px;
	background:url(images/jasar-web-solutions-logo.png) 10px 10px no-repeat;
	position: relative;
} 
#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
#phonenumber{
	text-align:right;
	font-size:20px;
	padding:10px 0 0 0;
}
.callus{
	color:#454545;
	font-size:15px;
}
.phone_number_colored{
	color:#d67434;
}
#searchform_wrap {	
	background:url(images/search_bg.jpg) no-repeat;
	width:308px;
	height:36px;
	position:absolute;
	top:40px;
	right:0px;
}
#searchform_container {
	color:#35547f;
	padding:8px 0 0 9px;		
}
#contentwrap_top{
	margin:50px 0 0 0;
	background: url(images/main_top.png) no-repeat top center;	
	height: 5px;
	width:936px;
}
#contentwrap{
/*	background:url(images/contentgrad.jpg) top center no-repeat;*/
	margin:0px 0 0 0;
	background: url(images/main_middle.png) repeat-y;
	padding:9px;
	
}
#contentwrap_bottom{
	margin:0px 0 0 0;
	background: url(images/main_bottom.png) no-repeat bottom center;	
	height: 5px;
	width:936px;
}
/*featured ============================================================================================== */
#featured_wrap{
	/*border: thin solid #333333;*/
}
#featured{
	height:272px;
	/*border: #999999 thin solid;	*/
	position:relative;	
}
#f_left_box{
	background:#000000;
	height:272px;
	width:570px;
	position:absolute;
	top:0;
	left:3px;
	overflow:visible;	
}
#f_right_box{	
	width:323px;
	height:252px;
	position:absolute;
	top:0px;
	right:0px;
	overflow: hidden;
	color:white;
	padding:10px;		
}
#f_right_box td.bottom_border{
	border-bottom: #CCCCCC thin solid;
}
#f_right_box td{
	line-height:13px;		
	padding:10px;	
	height:50px;
}
.featured_products_title{
	text-transform:uppercase;
	font-size:17px;
	color:#223c5f;
}


/*mainContent ============================================================================================== */
#mainContent { 	
	float: left;/*  since this element is floated, a width must be given */
	width: 622px;/*  the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	padding: 10px;	
	/*overflow:auto;*/
} 
#mainContent ol, #mainContent ul {
	list-style: outside;
	margin:0 0 0 20px;
	padding:20px;
}
#mainContent ol{
	list-style-type:decimal;
}
#mainContent p{
	color:#5a5959;
	padding:10px 0 0px 0;
}
#mainContent h1{
	color:#000000;
	font-size:16px;
}
#mainContent h2{
	color:#000000;
	font-size:14px;
	margin:30px 0 0 0;
}


/*side bar ============================================================================================== */
#sidebar1 {
	float:right;
	width:240px;	
	padding: 15px 10px;	
}
#sidebar1 a:link, #sidebar1 a:visited{
	color:#FFFFFF;
}
#sidebar1 a:hover{
	color: #E2EFDF;
	text-decoration:none;
}
#sidebar_wrap{
	border:#dedede thin solid;
	float:right;	
	margin:20px 0 0 0;
	width:240px;
}
#sidebar{	
	padding:10px;
	background: url(images/sidebar_backgrad.jpg) top repeat-x #FFFFFF;
	border:#ffffff 3px solid;	
}
#sidebar ul{ /*level 0*/	
	margin:0 0 0 0px;
}
#sidebar h2{ /*level 0*/	
	margin:0 0 0 0px;
}
#sidebar ul ul{ /*level 1*/
	margin:0 0 0 10px;
}
#sidebar ul ul li{
	background:url(images/bullet.png) no-repeat left 5px;
	padding:0px 0 0 10px;	
}

#sidebar ul ul ul{ /*level 2*/
	padding: 0px 0 0 5px;	
}
#sidebar ul li a{
	padding:3px;	
}
#sidebar a:link, #sidebar a:visited{
	color:#5C5C3E;
	text-decoration:none;
	cursor:pointer;
}
#sidebar a:hover{
	color: #000000;
	text-decoration:none;
	cursor:pointer;
}
.menu-arrow{
	cursor:pointer;
	background:url(images/blue_arrow_R.gif) no-repeat;
	width:6px;
	height:11px;
	display: inline-block;
	margin:0 0 0 -6px;
}
#sidebar li.current_page_item > a{
	font-weight:bold;
	color:#FF0000;
}
.pagenav ul li ul{
	/*display:none;*/
}
#sidebar hr{
	size:1px;
	width:100%;
	color: #CCCCCC;
	margin:10px 0 10px 0;
}
#sidebar div.decor01{
	text-align:center;
	background:url(images/decor01.png) no-repeat center 5px;
	
}

/*top nav ============================================================================================== */
#topnav{
	background: url(images/top_nav_bg.jpg) no-repeat top center;
	position:absolute;
	top: 88px;
	width:936px;
	height:43px;
	z-index:100;
}
#topnav ul{
	
}
#topnav ul  li{
	
}
/*#topnav a:visited, #topnav a:link{
	color: #FFFFFF;
	text-decoration:none;
	text-transform:uppercase;
	
}
#topnav li a:hover{
	color:#000000;
	text-decoration:none;
	text-transform:uppercase;
}*/
/*dropdown ================================================================================================= */
ul.dropdown, ul.dropdown li, ul.dropdown ul {
	margin:0;
	list-style:none;
}
/* 
	LEVEL ONE
*/
ul.dropdown{ 
	position: relative; 
	margin:0px 0 0 0;
	padding:0px 0 0 10px;
}
ul.dropdown li{ 
	float: left; 
	zoom: 1; 
	padding:0px 10px 0 10px;
	
}					
ul.dropdown > li{
	background:url(images/nav_vert_line.jpg) no-repeat right;
	height:43px; 
}	
ul.dropdown > li a:link, ul.dropdown > li a:visited{
	color:#ffffff;
	text-decoration:none;
	text-transform:uppercase;
}

ul.dropdown > li a:hover{
	color:#8ba3c4;
	text-decoration:none;
	text-transform:uppercase;
}								
ul.dropdown a:hover	{ 
	color: #a7a7a0; 
	text-decoration:none; 
}
ul.dropdown a:active { 
	color: #a7a7a0; 
}
ul.dropdown li a{ 
	display: block; 
	padding: 0px 0px;
	/*border-right: 1px solid #333;*/ 
	color: #222; 
}
ul.dropdown > li > a{ 
	padding:11px 0 0 0;
}		 								          
/*Doesn't work in IE
ul.dropdown li:last-child a { 
	border-right: none; 
}*/
ul.dropdown li:hover { 
	color: black; 
	position: relative;
}
ul.dropdown li.hover a{ 
	color: black; 
}

		/* 
			LEVEL TWO
		*/
		ul.dropdown ul{
			 /*width: 220px;*/
			 background:#5D7EAB;
			 visibility: hidden; 
			 position: absolute; 
			 padding:0;
			 /*top: 100%; */
			 top: 43px; 
			 left: 0; 
			 /*right: 0;*/
		}
		ul.dropdown ul li:first-child{
			margin-top:0px; 
		}
				ul.dropdown ul li a:link, ul.dropdown ul li a:hover{
					color:#ffffff;
					text-decoration:none;
					text-transform:uppercase;
				}
				
				ul.dropdown ul li a:hover{
					color:#000000;
					text-decoration:none;
					text-transform:uppercase;
				}
		ul.dropdown ul li{
			padding:2px 10px 2px 10px; 
			white-space:nowrap; 
			background:#5D7EAB; 
			float: none;
			border-bottom:#8ba3c4 thin solid;
		}
		ul.dropdown ul li:hover{
			background: #8ba3c4; 
		}							  
											
		ul.dropdown ul li a	{/* IE 6 & 7 Needs Inline Block */
			border-right: none; 
			width: 100%; 
			display: inline-block; 
		} 

				/* 
					LEVEL THREE
				*/
				ul.dropdown ul ul{
					left: 100%; 
					/*right: 100%;*/
					/* top: 0; */  
					top: 0px; 
				}
				ul.dropdown li:hover > ul{
					visibility: visible;
				}


/*text =================================================================================================== */
/**/

p{
	padding:10px 0 0 0;	
	font-size: 12px;
	line-height:21px;
	color:#424854;		
}
dd{
	padding:2px 0 0 0;	
	font-size: 12px;
	line-height:21px;
	color:#424854;		
}
dd.wp-caption-dd{
	text-align:center;
}
.wp-caption-text{
	text-align:center;
}
h1{
	color:#091632;
	padding:15px 0 10px 0;	
	font-size: 25px;
	
}
h2{
	color:#091632;
	padding:0px 0 0 0;	
	font-size: 13px;
	
}
h3{
	color:#091632;	
	font-size: 16px;
	font-weight:normal;
	margin:0;
	
}
a:link, a:visited{
	color:#295f98;
	text-decoration:none;
}
a:hover{
	color: #86acd4;
	text-decoration:none;
	cursor:pointer;
}
.search_date{
	font-size:10px;
	color: #666666;
}
.search_info{
	font-size:11px;
	color:#666666;
	margin:15px 0 0 0;
}
#footer_links{
	text-align:right;
	width:500px;
	float:right;	
}
.message_box{
	border: #54830c 1px solid;
	background: #cee9a5;
	padding:10px;
	margin:5px 0 5px 0
}
.error_box{
	border: #990000 1px solid;
	background:#FFCCCC;
	padding:10px;
	margin:5px 0 5px 0;
}


/*footer ================================================================================================= */
#footer { 	
/*	background: url(images/footer.png) no-repeat;*/
	height:63px;
	margin:5px 0 0 0;
	
	/*border:#000000 thin solid;*/
} 
#footer p {
	margin: 0 0 0 10px; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding:0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	color:#a7a7a0;
	font-size:10px;
}

.floatright { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;	
}
.floatleft { /* this class can be used to float an element left in your page */
	float: left;	
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;    
}

#footer_boxes_wrap{
	width:936px;
	height:208px;
	margin:0 auto;
	padding:0;

}
.footer_box{
	float: left;
	background: url(images/box_bg.png) no-repeat;
	/*background:#3300FF;*/
	/*border:#0066FF 1px solid;*/
	width:234px;
	height:208px;
	margin:0 0px;	
}
.footer_box_content{
	padding: 10px 10px 10px 25px;
	color:#5a5959;
	position:relative;
}
.footer_box_content h3{
	padding: 0 0 10px 0;
	text-transform:uppercase;
	color:#000000;
}
.footer_box_content ul, .footer_box_content ol, .footer_box_content li{
	list-style:none;
}
.footer_box_content ul.recentwork li{
	padding: 2px 0 2px 10px ;
	background:url(images/red_arrow.jpg) left no-repeat;
}
#footer1 ul li{
	padding: 2px 0 2px 10px ;
	background:url(images/red_arrow.jpg) left no-repeat;
}
#footer4 ul li{
	padding: 2px 0 2px 10px ;
	background:url(images/red_arrow.jpg) left no-repeat;
}
#hostingseal{
	width:76px;
	height:77px;
	background:url(http://www.jasarwebsolutions.com/wp-content/uploads/2010/02/599seal.png) no-repeat;
	position:absolute;
	top:6px;
	right:3px;
}
#websitethumbs{
	width:211px;
	height:130px;
	background:url(http://www.jasarwebsolutions.com/wp-content/uploads/2011/02/need-a-website-small.jpg) no-repeat;
	position:absolute;
	top:81px;
	left:17px;
}

ul.websitesolution li{
	font-size:12px;
}




/*images ================================================================================================= */

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left;
	}
/* End Images */

img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}


/*comments ================================================================================================= */
ol.commentlist li{
	border:#dedede thin solid;		
	margin:5px;
	position:relative;
	padding:5px 7px 15px 70px;
}
ol.commentlist ul.children{
	padding:10px 0 0 30px;	
}
ol.commentlist ul.children li{	
	
}
ol.commentlist li div.vcard img.avatar {
	left:11px;
	position:absolute;
	top:9px;
}
ol.commentlist li p {
	font-size:13px;
}
.commentmetadata{
	padding:5px 0 0 0;
}
.comment-author{
	font-weight:bold;
	
}
#respond{
	padding:20px;
	background:#E6E6E6;
	margin:10px;
	border:#666666 thin solid;
}

/*breadcrumbs ================================================================================================= */
ul.breadcrumbs {
	list-style: none;
	padding: 0 0 10px 0;
	margin: 0;
	font-size:12px;
	display: inline-block;
	
	
}
#mainContent ol.breadcrumbs, #mainContent ul.breadcrumbs{
	list-style: none;
	padding: 0 0 10px 0;
	margin: 0;
}
ul.breadcrumbs li {
	float: left;
	margin: 0 5px 0 0;
	padding: 0;
	
}
ul.breadcrumbs li a:link,  ul.breadcrumbs li a:visited{	
	color:#295F98;
}
ul.breadcrumbs li a:hover{	
	color: #86ACD4;
	text-decoration:underline;
}

/*wordpress ================================================================================================= */


#mainContent ol.commentlist{
	list-style:none;

}
.list_post_thumbnail{
	float:left;
	width:100px;
	height:100px;
	padding:0 10px 0 0;
}
.post_list{
	padding:15px 0 0 0;
}
.post_list h3{
	padding:0px 0 0 0;
}

/*for safari*/
ul{
-webkit-padding-start: 0px;
}

iframe#facebook-like { border:none; overflow:hidden; width:450px; margin: 0 0 -100px 0; padding: 0; }




/* code */
/*pre { 
  background: #eee; 
  padding: 10px; 
  border: 2px solid #c94a29; 
 overflow: hidden;
  margin: 0 0 15px 0; 
  width: 563px; 
  font-family: Courier, Monospace;
}*/

code {

background:#F3F7FB none repeat scroll 0 0;
border-left:2px solid #0A577F;
display:block;
font-family:'Courier New',Courier,Fixed;
font-size:1em;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:normal;
line-height:normal;
margin:2px 15px;
overflow:auto;
padding:6px 3px 6px 10px;
text-align:left;
}