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

/*
  
 * Filename		 		style.css
 * Website				
 * Author				InMotion Hosting - http://inmotionhosting.com 

 */

html, body {margin:0;padding:0;}

body {
	font-family: 'Lato', sans-serif;
	background:#B5B7B8;}

h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
h6 {}

p {
	text-align:justify;	
	font-family: 'Lato', sans-serif;
	}

a:link, a:visited {text-decoration:none; outline:none;}
a:hover, a:focus {text-decoration:underline; outline:none;}


/* want rounded corners?  Add this class to your containers for instant gratification -- adjust the curve as needed */

.rounded-corners {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
}


/* insert this class where you need to clear inline items */
.clearall {clear:both;}


/* float images left or right - adjust margins as needed */
.left-img {float:left; margin:21px 15px 0 0;}
.right-img {float:right; margin:0 0 0 10px;}

.left{
	float:left;}
.right{
	float:right;}

.border{
	border-bottom:2px solid #362F2D;}
/*** LAYOUT STYLES ***/

#header-wrap, #leaderboard-wrap, #nav-wrap, #content-wrap, #footer-wrap, #topwrap {width:100%;}
#header, #leaderboard, #nav, #content, #footer, #top, #copyright  {margin:0 auto; width:960px;}

#topwrap{
	background:url(../_img/topBG.jpg) repeat-x;
	height:30px;}
#top p{
	color:#FFF;
	font-size:18px;
	padding:6px 0;}

/* HEADER */

#header-wrap {
	height:275px;
	background:url(../_img/headerBG.jpg) repeat-x;}

#header {}
#header h1{
	text-align:center;
	font-size:18px;
	color:#42210B;
	font-weight:400;
	line-height:22px;}

#logo {
	margin-top:30px;
	width:268px;
	float:left;}

#rotator {
	float:right;
	padding-top:12px;
	}

.slideshow {
	overflow:hidden; 
	height: 251px; 
	width: 612px;
	 }

/* NAVIGATION */
#nav-wrap{
	position:relative;
	z-index:50;
	background:url(../_img/navBG.png) repeat-x;
	height:48px;}
#nav {
	
	height: 40px;	/*height of nav to be shown  look for all height and change should be 4*/
}


#nav ul {
	height:40px;    /*height of nav to be shown*/
	background:url(../_img/navLinks.png) no-repeat; 
	position:absolute;}
#nav li {
	float:left;
	list-style-type:none;}

#nav li a {height:40px; display:block; position:absolute; text-indent:-9999px; outline:none}

li#navHome a, li#navAbout a, li#navService a, li#navBlog a, li#navContact a, li#navTest a{background:url(../_img/navLinks.png) no-repeat; height:40px; }

/*insert all widths and change where says 36px to height mention before-->
to figure out next "background-postion and left" on nav3 add nav2 backpostion and width togeather  ie 97 + 129 = 226*/


li#navHome a 		{ background-position:0 0; width:160px; left:0;}
li#navHome a:hover		{ background-position:0 -40px;   }

li#navAbout a 		{ background-position:-160px 0; width:160px; left:160px}
li#navAbout a:hover		{ background-position:-160px -40px }

li#navService a 		{ background-position:-320px 0; width:160px; left:320px }
li#navService a:hover		{ background-position:-320px -40px }

li#navTest a    { background-position:-480px 0; width:160px; left:480px }
li#navTest a:hover  { background-position:-480px -40px }

li#navBlog a 		{ background-position:-640px 0; width:160px; left:640px }
li#navBlog a:hover		{ background-position:-640px -40px }

li#navContact a 		{ background-position:-800px 0; width:160px;; left:800px }
li#navContact a:hover		{ background-position:-800px -40px }




/* CONTENT */

#content-wrap {
	margin-top:-8px;}
	
#content {
	padding:20px;
	background:url(../_img/contentBG.png);
	width:932px;
	overflow:hidden;
	margin-top:-8px;}
	
#content-left {
	width:620px;
	float:left;}
	
#content-left h1 {
    font-size:36px; 
    font-weight:200; 
    text-transform: uppercase; 
    color:#524741; 
    padding:10px 0; 
    font-family: trajan-pro-3, serif;
}
	
#content-left h2 {
    font-size:28px; 
    font-weight:200; 
    text-transform: uppercase; 
    color:#524741; 
    padding:20px 0; 
    font-family: trajan-pro-3, serif;
}

#content-left ul{
	padding:0 20px;}
	
#content-left ul li{
	list-style-type:disc;
	line-height:20px;
	color:#362F2D;
	font-size:14px;
	}	
	
#content-left p{
	margin-top:21px;
	line-height:22px;
	color:#362F2D;
	font-size:16px;}

#content-left p.referral {
	text-align: right;
}

#content-right {
	width:263px;
	float:right;}

#content-right h2{
	padding:10px 0 10px 10px;
	font-size:18px;
	font-weight:400;
	color:#22272F;
	line-height:21px;}

#content-right p{
    margin-top: 21px;
    line-height: 22px;
    color: #362F2D;
    font-size: 16px;
}

/* FOOTER */

#footer {
	height:79px;
	padding:10px 20px 0 20px;
	background:url(../_img/footerBG.png) no-repeat;
	width:932px;}
#footer p {}
#footer ul{
	padding:15px 0;
	clear:both;
	margin:0 200px;
	display:block;}
	#footer ul li{
		color:#22272F;
		display:inline;
		padding:0 10px;}
#footer a, #footer a:visited {
	color:#22272F;}
#footer a:hover, #footer a:focus {}

#contact {}
#contact p {
	color:#22272F;
	font-size:18px;}

#social {}

#copyright {}
#copyright p {
	padding-top:10px;
	font-size:10px;
	color:#534741;
	text-align:center;}
#copyright a, #copyright a:visited {
	color:#534741;}
#copyright a:hover, #copyright a:focus {
	text-decoration:underline;}



/* Errors */

#404wrap {margin:20px auto; width:800px; height:400px; background:#f2f2f2; border:1px solid #e3e3e3; font-family:Verdana, Geneva, sans-serif; font-size:12px;}
#404wrap h1 {font-size:18px; margin:20px; text-align:center;}
#404wrap p {margin:20px; text-align:center;}
#404wrap ol {margin:40px;}
#404wrap ul {margin:40px;}
#404wrap li {padding-bottom:8px;}
#404wrap a:link, #404wrap a:visited {color:#01759d; text-decoration:none; outline:none;}
#404wrap a:hover, #404wrap a:focus {color:#e26c1d; text-decoration:underline; outline:none;}
