/***** Designer: Peter P Schaefer *****/
/***** a Lautus Design Production *****/
/*****       version 2.0alpha     *****/
/***** http://www.lautusdesign.com ****/

/***** Reset *****/
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input, img { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
input { outline: none; border: none; margin: 0; padding: 0; }
caption,th { text-align: left; }
table, td, th { border-collapse: collapse; border-spacing: 0; padding: 0; margin: 0; }
a { text-decoration: underline; outline: none; color: #ff4200; border: none; }
a:hover { text-decoration: none; }
a.noHover { color: #000; text-decoration: none; }
a.noHover:hover { color: #000; }

.em {
font-style: italic;
}

.logoBlack {
font-family: Helvetica;
color: #000;
}

.logoGray {
font-family: Helvetica;
color: #808080;
}

body {
width: 100%;
height: 100%; 
font-family: "trebuchet MS", modern, sans-serif;
font-size: 0.8em;
line-height: 1.5em;
color: #313131;
text-align: center;
background: url(../img/bodyBKG.jpg) repeat-x #FFF;
}

html {  
height: 100%; 
}

#wrapper {
width: 1109px;
text-align: left;
background: url(../img/header_totalBKG.jpg) no-repeat top left;
margin: 0 auto;
position: relative;
padding: 0 0 0 30px;
}

	#container {
	width: 1053px;
	background: #eee url(../img/intro_containerBKG_body.jpg) repeat-y;
	position: relative;
	}
	
		#background {
		width: 1028px;
		background: #eee url(../img/intro_containerBKG_vertical.jpg) repeat-x;
		margin: 0 auto;
		padding: 0 0 0 23px;
		position: relative;
		z-index: 2;
		}

/************ HEADER STYLES ************/

			#header {
			width: 1051px;
			height: 537px;
			position: relative;
			}
		
				.logo {
				width: 266px;
				height: 110px;
				float: left;
				position: relative;
				top: 15px;
				}
				
				#navBar {
				width: 785px;
				height: 110px;
				float: left;
				position: relative;
				}
				
				ul.headerNav {
				position: absolute;
				top: 46px;
				left: 15px;
				z-index: 4;
				}
				
					ul.headerNav li {
					height: 26px;
					display: block;
					float: left;
					}
					
						ul.headerNav li a {
						height: 26px;
						width: 77px;
						font-family: "Myriad Pro", Tahoma, Arial, Sans-serif;
						font-size: 1.0em;
						color: #000;
						text-decoration: none;
						text-align: center;
						display: block;
						padding: 4px 0 0 0;
						}
					
						ul.headerNav li a:link, ul.headerNav li a:visited {
						color: #000;
						text-decoration: none;
						background: url(../img/headerNav_BKG_total.jpg) repeat-x;
						background-position: 0 0;
						} 
						
						ul.headerNav li a:hover, ul.headerNav li a:active {
						color: #000;
						text-decoration: none;
						background-position: 0 -36px;
						}
						
				.banner {
				width: 1011px;
				height: 399px;
				position: relative;
				clear: both;
				z-index: 3;
				}
				
					.bannerLink {
					position: absolute;
					top: 357px;
					left: 630px;
					z-index: 9999;
					}
					
						.bannerLink a {
						font-size: 1.5em;
						color: #fff;
						text-decoration: none;
					    letter-spacing: 0.05em;
						}
				
/************ BODY STYLES ************/

			#body {
			width: 1011px;
			position: relative;
			}
			
				#design, .news, p.left {
				width: 321px;
				margin: 0 18px 0 0;
				position: relative;
				float: left;
				}
				
				#design a {
					color: #313131;	
					}
					
						#design a:hover {
						color: #ff4200;
						}
				
					.news {
					height: 1px;
					}
					
						.newsContent {
						width: 321px;
						position: relative;
						text-align: justify;
						float: left;
						}
						
							.newsContent img {
							display: none;
							}
						
							.newsContent .introImg a, .newsContent .introImg img {
							width: 100px;
							height: 100px;
							overflow: hidden;
							margin: 5px 14px 5px 0;
							float: left;
							position: relative;
							display: block;
							border: solid 1px #CCC;
							}
							
								.newsContent .introImg img {
								margin: 0;
								border: none;
								}
						
							.newsTitle a {
							font-size: 1.5em;
							color: #333;
							text-decoration: none;
							text-align: left;
							}
							
							.shortStory {
							padding: 5px 0 0 0px;
							} 
							
							.newsAuthor {
							font-size: 0.9em;
							color: #000;
							margin: 0 0 5px 0;
							position: relative;
							font-style: italic;
							top: 3px;
							left: 5px;
							}
					
				#seo, #graphic, .featuredWork, p.right {
				width: 331px;
				margin: 0 18px 0 0;
				position: relative;
				float: left;
				}
				
					#seo a, #graphic a {
					color: #313131;	
					}
					
						#seo a:hover, #graphic a:hover {
						color: #ff4200;
						}
				
					.contactLautus {
					width: 323px;
					float: left;
					position: relative;
					top: 5px;
					}
					
					/*
					.contactLautus {
					width: 331px;
					height: 181px;
					background: url(../img/contactLautusBKG.jpg) no-repeat;
					padding: 5px;
					}
					*/
						.contactLautus table {
						position: relative;
						top: 10px;
						}
					
						.contactLautus a {
						color: #333;
						text-decoration: none;
						}
							
							.contactLautus a:hover {
							text-decoration: underline;
							}
					
						.contactLautus td {
						padding: 0 5px 20px 0;
						font-size: 1.2em;
						}
							
							.contactLautus td img {
							margin: 5px 0 0 0;
							}
					
							.contactLautus td.pad {
							padding: 0 25px 20px 0;
							}
					
					.featuredWork img {
					margin: 0px 0 18px 0;
					}
				
				#hosting, #ads, .about {
				width: 321px;
				position: relative;		
				float: left;
				}
				
					#hosting a, #ads a {
					color: #313131;	
					}
					
						#hosting a:hover, #ads a:hover {
						color: #ff4200;
						}
				
						h1 {
						font-size: 2.0em;
						margin: 0 0 10px 0;
						float: left;
						position: relative;
						}
						
							a.about:link, a.about:active, a.about:hover, a.about:visited  {
							width: 270px;
							height: 29px;
							display: block;
							text-indent: -9999px;
							background: url(../img/intro_about.jpg) no-repeat top left;
							}
							
							a.contact:link, a.contact:active, a.contact:hover, a.contact:visited  {
							width: 327px;
							height: 29px;
							display: block;
							text-indent: -9999px;
							background: url(../img/intro_contact.jpg) no-repeat top left;
							}
						
						hr {
						border: none;
						border-top: solid 1px #CCC;
						position: relative;
						}
				
						#design a.header:link, #design a.header:active, #design a.header:hover, #design a.header:visited {
						width: 190px;
						height: 50px;
						display: block;
						text-indent: -9999px;
						background: url(../img/intro_websites.jpg) no-repeat top left;
						}
						
						#graphic a.header:link, #graphic a.header:active, #graphic a.header:hover, #graphic a.header:visited
						{
						width: 187px;
						height: 50px;
						display: block;
						text-indent: -9999px;
						background: url(../img/intro_graphics.jpg) no-repeat;
						}
						
						#ads a.header:link, #ads a.header:active, #ads a.header:hover, #ads a.header:visited
						{
						width: 80px;
						height: 50px;
						display: block;
						text-indent: -9999px;
						background: url(../img/intro_ads.jpg) no-repeat;
						}
						
					.spacer {
					clear: both;
					height: 10px;
					}
					
					h2 {
					font-size: 1.8em;
					color: #000;
					margin: 0 0 15px 0;
					position: relative;
					z-index: 9999;
					}
					
						h2 > a.blog {
						width: 120px;
						height: 23px;
						text-indent: -9999px;
						display: block;
						background: url(../img/intro_blog.jpg) no-repeat;
						}
						
						h2 > a.featured {
						width: 175px;
						height: 19px;
						text-indent: -9999px;
						display: block;
						background: url(../img/intro_featured.jpg) no-repeat;
						}
						
						h2 a.testimonials {
						width: 243px;
						height: 19px;
						text-indent: -9999px;
						display: block;
						background: url(../img/intro_testimonials.jpg) no-repeat;
						}
						
					p {
					text-align: justify;
					padding: 0 0 10px 0;
					}
					
					#featuredServices {
					height: 113px;
					width: 1011px;
					clear: both;
					position: relative;
					top: 5px;
					margin: 10px 0 25px 0;
					}
					
						#featuredServices  .leftBorder {
						width: 20px;
						height: 113px;
						background: url(../img/img_corner_left.gif) no-repeat;
						float: left;
						position: relative;
						}
						
						.featuredServicesBKG {
						width: 975px;
						height: 113px;
						background: url(../img/img_featured_line.jpg) repeat-x;
						float: left;
						position: relative;
						}
						
						.featuredServicesBKG table a {
						color: #FFF;
						font-family: "Trebuchet MS", Modern, Geneva, Verdana, sans-serif;
						text-decoration: none;
						}
						
							.featuredServicesBKG table a:hover {
							text-decoration: underline;	
							}
						
							.featuredServicesBKG th a {
							font-size: 1.4em;
							color: #ff8f31;
							color: #ff4200;
							padding: 15px 0 2px 0;
							text-decoration: none;
							display: block;
							}
						
						#featuredServices  .rightBorder {
						width: 16px;
						height: 113px;
						background: url(../img/img_corner_right.gif) no-repeat;
						float: right;
						position: relative;
						}
					
				.contextLinkClearer {
				clear: both;
				position: absolute;
				top: 342px;
				right: 0;
				width: 136px;
				}
				
					ul.services {
					float: right;
					text-align: right;
					}
						
						ul.services li {
						display: inline;
						}
						
							ul.services li a {
							margin: 0;
							}
							
				
				.contextLinkClearer2 {
				clear: both;
				position: absolute;
				top: 130px;
				left: 347px;
				width: 136px;
				}
				
					ul.about {
					text-align: right;
					}
						
						ul.about li {
						display: inline;
						}
						
							ul.services li a {
							margin: 0;
							}
							
				
				
				hr {
				border: none;
				border-top: solid 1px #CCC;
				margin: 0 0 15px 0;
				position: relative;
				clear: both;
				}
				
				.clearer {		
				height: 19px;
				position: relative;
				clear: both;
				}
				
					ul.categoryLink {
					float: right;
					}
						
						ul.categoryLink li {
						display: inline;
						float: right;
						position: relative;
						z-index: 9999;
						}
							
							ul.categoryLink li a {
							padding: 0 0 0 5px;
							}
							
							
				.blogLink, .portfolioLink, .aboutLink {
				float: left;
				position: relative;
				z-index: 9999;
				}
				
					.blogLink {
					width: 321px;
					margin: 0 18px 0 0;
					}
					
					.portfolioLink {
					width: 331px;
					margin: 0 18px 0 0;
					}
					
					.aboutLink {
					width: 321px;
					}
					
			
	.containerBKG_bottom {
	width: 1053px;
	height: 38px;
	background: url(../img/intro_containerBKG_bottom.jpg) no-repeat;
	position: relative;
	top: -1px;
	clear: both;
	}
		
/************ FOOTER STYLES ************/	

	#footer {
	width: 1053px;
	float: left;
	clear: both;
	}
	
		ul.footerNav {
		height: 15px;
		margin: 17px 0 0 30px;
		}
	
			ul.footerNav li {
			font-size: 0.9em;
			padding: 0 8px 4px 0;
			float: left;
			}
			
				u.footerNav li a {
				font-size: 0.9em;
				}
	
		#footer hr {
		clear: both;
		border: none;
		border-bottom: 1px solid #CCC;
		padding: 0;
		margin: 0;
		}
		
		.credits {
		font-size: 0.8em;
		margin: 4px 0 140px 30px;
		}


/********** IE HACKS ***********/
* html #wrapper {
width: 1109px;
text-align: left;
background: url(../img/header_totalBKG.jpg) no-repeat top left;
margin: 0 auto;
position: relative;
padding: 0 0 0 0px;
}

	* html #container {
	width: 1030px;
	background: #eee url(../img/intro_containerBKG_body.jpg) repeat-y;
	position: relative;
	padding: 0 0 0 23px;
	}
	
		* html #background {
		width: 982px;
		background: #eee url(../img/intro_containerBKG_vertical.jpg) repeat-x 0 -23px;
		margin: 0 auto;
		padding: 0 0 0 0px;
		position: relative;
		z-index: 2;
		}
