/* HTML */
html { background-color: #f7f7f7; margin: 0; padding: 0; }
/* BODY */
body {font: 62.5%/1.2 "Lucida Sans", Lucida, Tahoma, Arial, Helvetica, "Nimbus Sans L", sans-serif; background-color: #e6e6e6; margin: 0; padding: 0;}

/* COMMON */
hr {display: none; }
a, a:visited {text-decoration: none; color: #039; outline: none; }
a:hover {text-decoration: underline;}
img { border: none;}
		
/* LAYOUT */
#header {clear: both; background-color: #fff; border-bottom: 5px solid #f7f7f7; padding: 10px 10px; }
#body {clear: both; width: 98em; min-width: 980px;  max-width: 95%; margin: 0 auto;  }

  #body .wrapper {width: 79.5%; float: right; background-color: #fff; padding: 0px; border: 1px solid #ccc; border-width: 1px 0; }
#footer {clear: both; margin: 15px 0 0; padding: 20px 10px; border-top: 31px solid #ccc; background-color: #f7f7f7; color: #666; }

#header:after, #body:after, #body .wrapper:after, #main:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

#header .wrapper, #footer .wrapper {width: 805px; min-width: 805px; }
#body {width: 805px; min-width: 805px; padding: 15px 0 10px; }
#body .wrapper {float: none; width: auto; }
#sidebar, #nav-primary {display: none;}

.wrapper h1 { font-size: 150%; margin: 0 0 15px; padding: 3px 0 7px; border-bottom: 1px solid #ccc; text-align: left; font-weight: bold; }
.wrapper h1 a:link, .wrapper h1 a:visited { text-decoration: none; }
.wrapper h2 { font-size: 140%; margin: 0;}
.wrapper h3 { font-size: 115%;}
.wrapper table { font-size: 100%; border: 0; }
.wrapper dt { font-weight: bold; }
.wrapper sup { font-size: 70%; }
.wrapper blockquote { margin: 0; }
.wrapper blockquote div { text-align: right; font-style: italic; }
.wrapper fieldset { border: 1px solid #ccc; margin-bottom: 20px; }

/* HEADER */
#header .wrapper { min-width: 760px; max-width: 98em; margin: 0 auto; }	
#header h1 { font-size: 100%; margin: 0; padding: 0; border: none; }
#header h1#logo img { border: none; }

/* FOOTER */
#footer .wrapper { min-width: 710px; max-width: 98em; margin: 0 auto; }	
#footer a {color: #069;}
#footer p {font-size: 110%; margin: 0; padding: 0;}
#nav-footer {clear: both; margin: 0 0 12px; padding: 0; list-style-type: none; }
#nav-footer li  {color: #3d3d3d; font-size: 120%; font-weight: bold; margin: 0 0.5em .5em 0; }

/* NAVIGATIONS */
/* TOP */
#topnav {float: right; clear: both; margin: -26px 0 0 0; padding: 0;}
#topnav {margin: -10px 0 0 0; }
#topnav li {display: inline; text-align:center; margin: 0; padding: 2px 0 2px 2px; font-size: 110%;}
#topnav a {color: #3d3d3d; padding-right: 5px; }
#topnav li#nav-utility-auth a {border: none; padding-right: 0;}

/* BREADCRUMB / INLINE */
#inlinenav {
	height:20px;
	line-height:20px;
	color: #ddd;
	font-size:9px;
	}


#inlinenav li {
	list-style-type: none;
	background-image: url(/images/arrow.gif);
	background-repeat: no-repeat;
	padding-right:10px;
	padding-left:3px;
	background-position: center right;
	float:left;
	color:#fff;
}


#inlinenav a {
	color:#333;
	text-decoration:none;
}


#inlinenav a:hover {
	color:#fff;
	text-decoration:underline;
}

	
#nav-footer li a {color: #3d3d3d; }
#nav-footer ul {list-style-type: none; padding: 0 0 0 5em; margin: -1.2em 0 0 0; }
#nav-footer ul li {font-weight: normal; display: inline; font-size: 100%; padding: 0 0 0 1em; margin: 0; }
#nav-bottom, #bottom {display: inline; margin: 0; padding: 0; }
#nav-bottom li {display: inline; font-size: 110%; padding: 0; margin: 0 0.2em 0 0; vertical-align:top;}
#nav-bottom li a, .bottom a {color: #666;}

/* BODY */
#body .wrapper { border: 1px solid #ccc; }
#main { width: 760px; padding:20px; font-size: 130%; margin: 0 auto; clear: both; display: inline-block; line-height:20px;}
#main h1 { border: 0; color: #069; font-size: 165%; font-weight:normal; padding: 0; margin:2px; }
#main h4 {
	margin: 0 0 10px 0;
	font-size:0.8em;
	color: #aaa;
	padding-left:5px;
}


#main .home h1.centered { text-align:center; }
#main .home ul { margin: 0; padding: 0; list-style: none; }
#main .home li { float: left; width: 245px; height:450px;}
#main .home li:hover {cursor:pointer;}
#main .home li h2 { height: 285px; margin: 25px 25px 10px; border:2px solid #ddd; text-align: center; background-repeat:no-repeat; }
#main .home li#webdesign h2 { background-image: url(/images/cow.jpg); }
#main .home li#programming h2 { background-image: url(/images/digger.jpg); }
#main .home li#techsupport h2 { background-image: url(/images/signs.jpg); }
#main .home li p { color: #666; line-height: 1.3; margin: 0 25px 30px; text-align: center; }
#main img { padding:13px; }
#main li.contact img { float:none; padding:1px; }
#main li.contact { list-style:none; }

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



/* ------
- FORMS -
------ */

form {width:96%; border:1px solid #333;}
.download {border:none;}

input, textarea, file {
	padding:2px;
	border-width:1px;
	width:98%;
}

img {border:0;}

textarea { height:120px;}

button, submit { width: 50px; }

.checkbox { width: 15px; } 

.checkbox:hover, input:hover {
	cursor:pointer;
}

input:focus, textarea:focus, .passwordPost label input:focus {
	background-color:#faf0e6;
}

.button  {
	background:#024;
	border-color:#357 #002 #002 #357;
	color:#fff;
	padding:0; margin:0;
	width:75px;
}

.required {color:maroon;}
.small {font-size:9px; }

input:hover, textarea:hover {
	background-color:#faf0e6;
	cursor:text;
}

.button:hover, .passwordPost input:hover {
	background:#246;
	cursor:pointer;
}


form.contact { background-color:#efefef; padding:5px;}
form.contact label { padding:3px; }

.centered { text-align:center; margin: 0 auto;}