/*
Theme Name: Yaro
Theme URI: http://yaro.com
Description: The WordPress theme for the Yaro website.
Author: Michael N. Kistler
*/

* {
	margin: 0;
	padding: 0;
}

a:link, a:visited, a:active, a:hover {
	color: #000084;
}

html {
	background-color: #4040A3;
}

body {
	background: #8080C2 url(images/bgBottom.gif) repeat-x center bottom;
	font-family: Verdana, Arial, Sans-Serif;
	font-size: 14px;
	min-width: 1000px;
}

form, fieldset {
	border: none 0px;
}
	
	form label span, form .button {
		display: block;
		margin-top: 0.7em;
	}
	
	form label.inline span {
		display: inline;
	}
	
	form label span.invalid {
		color: #CC0000;
	}

ol, p, ul {
	line-height: 1.4em;
	margin-bottom: 0.7em;
}

h1, h2, h3, h4, h5, h6 {
	color: #000084;
	font-family: Times New Roman, Serif;
	font-weight: normal;
	line-height: 1.4em;
}

h1 {
	font-size: 36px;
}

h2 {
	font-size: 24px;
}

h3 {
	font-size: 20px;
}

h4 {
	font-size: 18px;
}

h5 {
	font-size: 16px;
}

h6 {
	font-size: 14px;
}

img {
	border: solid 1px #000000;
}

ol, ul {
	margin-left: 2em;
}

#bgTop {
	background: url(images/bgTop.gif) repeat-x center top;
	padding-bottom: 49px;
	padding-top: 50px;
}
	
	#header {
		height: 100px;
		width: 1000px;
		margin-left: auto;
		margin-right: auto;
		position: relative;
	}
		
		#navWrap {
			background: url(images/bgNav.gif) repeat-x center center;
			height: 100px;
			width: 952px;
			position: absolute;
			left: 48px;
		}
		
		#nav {
			background: url(images/bgNavRight.jpg) no-repeat right center;
			display: block;
			height: 100px;
			width: 952px;
			line-height: 1em;
			list-style-type: none;
			margin-bottom: 0;
			margin-left: 0;
			position: relative;
		}
			
			#nav li {
				text-indent: -9999px;
			}
				
				#nav li a:link, #nav li a:visited, #nav li a:active, #nav li a:hover {
					display: block;
					position: absolute;
				}
				
				#nav li a:link {
					background-position: left top;
				}
				
				#nav li a:visited {
					background-position: right top;
				}
				
				#nav li a:active, #nav li a:hover {
					background-position: left bottom;
				}
				
				#nav li.here a:link, #nav li.here a:visited, #nav li.here a:active, #nav li.here a:hover {
					background-position: right bottom;
				}
			
			#navHome a:link, #navHome a:visited, #navHome a:active, #navHome a:hover {
				background: url(images/logo.gif) no-repeat;
				height: 84px;
				width: 244px;
				left: 0;
				top: 8px;
			}
			
			#navAbout a:link, #navAbout a:visited, #navAbout a:active, #navAbout a:hover {
				background: url(images/navAbout.gif);
				height: 30px;
				width: 125px;
				left: 252px;
				top: 35px;
			}
			
			#navProducts a:link, #navProducts a:visited, #navProducts a:active, #navProducts a:hover {
				background: url(images/navProducts.gif);
				height: 30px;
				width: 125px;
				left: 382px;
				top: 35px;
			}
			
			#navServices a:link, #navServices a:visited, #navServices a:active, #navServices a:hover {
				background: url(images/navServices.gif);
				height: 30px;
				width: 125px;
				left: 512px;
				top: 35px;
			}
			
			#navContracts a:link, #navContracts a:visited, #navContracts a:active, #navContracts a:hover {
				background: url(images/navContracts.gif);
				height: 30px;
				width: 125px;
				left: 642px;
				top: 35px;
			}
			
			#navContact a:link, #navContact a:visited, #navContact a:active, #navContact a:hover {
				background: url(images/navContact.gif);
				height: 30px;
				width: 125px;
				left: 772px;
				top: 35px;
			}
	
	#bgContentMiddle {
		background: url(images/bgContentMiddle.gif) repeat-y center top;
		margin-left: auto;
		margin-right: auto;
		width: 920px;
	}
		
		#bgContentTop {
			background: url(images/bgContentTop.jpg) no-repeat center top;
			width: 920px;
		}
			
			#bgContentBottom {
				background: url(images/bgContentBottom.jpg) no-repeat center bottom;
				min-height: 441px;
			}
				
				#side {
					color: #FFFFFF;
					float: left;
					width: 240px;
					padding: 50px 10px 0 10px;
				}
					
					#side a:link, #side a:visited, #side a:active, #side a:hover {
						color: #FFFFFF;
					}
					
					#side h1, #side h2, #side h3, #side h4, #side h5, #side h6, #side ol, #side p, #side ul {
						padding-left: 20px;
						padding-right: 20px;
					}
					
					#side #subnav {
						list-style-type: none;
						margin-left: 0;
						padding-left: 0;
						padding-right: 0;
					}
						
						#subnav li a:link, #subnav li a:visited, #subnav li a:active, #subnav li a:hover {
							background: url(images/subnav.gif);
							display: block;
							font-family: Times New Roman, Serif;
							height: 15px;
							width: 200px;
							overflow: hidden;
							padding: 15px 20px 0 20px;
							text-decoration: none;
							vertical-align: middle;
							white-space: nowrap;
						}
						
						#subnav li a:link {
							background-position: left top;
							color: #FFFFFF;
						}
						
						#subnav li a:visited {
							background-position: left top;
							color: #CCCCCC;
						}
						
						#subnav li a:active, #subnav li a:hover {
							background-position: left bottom;
							color: #FFFFFF;
						}
							
							#subnav li a .verticalCenter {
								display: block;
								line-height: 1em;
								margin-top: -0.5em;
							}
						
						#subnav li.here a:link, #subnav li.here a:visited, #subnav li.here a:active, #subnav li.here a:hover {
							background-position: right top;
						}
				
				#main {
					margin-left: 260px;
					padding: 10px 60px 50px 40px;
				}
					
					#pageTitle {
						border-bottom: solid 2px #000000;
						line-height: 1em;
						padding-top: 9px;
						text-align: right;
					}
					
					#breadcrumb {
						font-size: 10px;
						line-height: 1.1em;
						margin-bottom: 2.8em;
					}
				
				#main.home {
					padding: 55px 60px 50px 40px;
				}
				
				#footer {
					clear: both;
					color: #FFFFFF;
					font-size: 9px;
					height: 117px;
					position: relative;
				}
					
					#footer #returnToTheTop {
						border-top: solid 2px #000000;
						margin-left: 300px;
						margin-right: 60px;
						text-align: right;
					}
						
						#footer #returnToTheTop a:link, #footer #returnToTheTop a:visited, #footer #returnToTheTop a:active, #footer #returnToTheTop a:hover {
							color: #000084;
							font-size: 12px;
						}
					
					#footer a:link, #footer a:visited, #footer a:active, #footer a:hover {
						color: #FFFFFF;
					}
					
					#footer #sidefoot {
						position: absolute;
						bottom: 10px;
						left: 20px;
					}
					
					#footer #textnav {
						position: absolute;
						bottom: 10px;
						right: 60px;
						text-align: center;
						width: 560px;
					}

/* Begin Images */
p img {
	padding: 0;
	max-width: 100%;
	}

/*	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.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	margin: 0.4em 0 0 1.4em;
	display: inline;
	}

img.alignleft {
	margin: 0.4em 1.4em 0 0;
	display: inline;
	}

.alignright {
	float: right;
	}

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