/* CSS Document */

body {
	background: url(../images/bg.jpg) #FFF repeat-x top left;
	margin: 0;
}

img {
	border: 0;
}

img.right {
	float: right;
	padding: 3px 0 10px 10px;
}

img.left {
	float: left;
	padding: 3px 10px 0 10px;
}

/* Header, Top Navigation and Masthead *************************/

.header {
	margin: 0 auto;
	background: url(../images/top-nav-bg.jpg) no-repeat top center;
	width: 910px;
	height: 111px;
}

.header img {
	 float: left;
	 margin: 35px 0 0 20px;
 }

.top-nav {
	width: 400px;
	float: right;
	padding: 0;
	margin: 0;
}

/* Masthead Declarations  *******************************/


.masthead {
	margin: 0 auto;
	width: 910px;
}

#home .masthead {
	background: url(../images/masthead-bg.jpg) no-repeat top center;
	height: 290px;
}

#michels .masthead {
	background: url(../images/masthead-michels.jpg) no-repeat top center;
	height: 260px;
}

#insight .masthead {
	background: url(../images/masthead-insight.jpg) no-repeat top center;
	height: 260px;
}

#amliner .masthead {
	background: url(../images/masthead-amliner.jpg) no-repeat top center;
	height: 260px;
}

#areas h1 span {
	display: none;
	line-height: 20px;
	padding: 5px 0;
	margin: 0;
}

.masthead p {
	font: normal 13px/135% Arial, Helvetica, sans-serif;
	color: #404040;
	text-align: left;
}

div.copy {
	width: 390px;
	float: right;
	margin: 0 45px 0 0;
	padding: 25px 0 0 0;
}


div.copy#home {
	width: 390px;
	float: right;
	margin: 0 45px 0 0;
	padding: 20px 0 0 0;
}

div.copy#areas {
	width: 390px;
	float: right;
	margin: 70px 45px 0 0;
	padding: 0;
}

/* Process Page  ***********************************************/

#process div.steps {
	padding: 1px 0 10px 55px;
	width: 450px;
	border-bottom: 1px dashed #CCC;
}

div.steps#one {
	background: url(../images/step-01.jpg) no-repeat 0 7px;
	margin-top: 20px;
}

div.steps#two {
	background: url(../images/step-02.jpg) no-repeat 0 7px;
	margin-top: 10px;
}

div.steps#three {
	background: url(../images/step-03.jpg) no-repeat 0 7px;
	margin-top: 10px;
}

div.steps#four {
	background: url(../images/step-04.jpg) no-repeat 0 7px;
	margin-top: 10px;
}

div.steps#five {
	background: url(../images/step-05.jpg) no-repeat 0 7px;
	margin-top: 10px;
	border-bottom: none;
}

div.steps h3 {
	color: #5F952F;
	padding-bottom: 2px;
	margin-bottom: 0;
}

div.steps p {
	font: normal 14px/130% Arial, Helvetica, sans-serif;
	padding-top: 5px;
	margin-top: 0;
	margin-bottom: 0;
}

div.flash {
	width: 600px;
	margin: 10px auto;
}

body#flash {
	background: none;
}

#flash p {
	width: 200px;
	clear: both;
	margin: 20px auto 0 auto;
	padding: 0;
	text-align: center;
}

p.demo {
	background: url(../images/play-demo.jpg)  no-repeat 80px 50%;
	padding: 5px 5px 5px 0;
	margin: 0;
	width: 100px;
}

p.demo a:link, p.demo a:visited, p.demo a:hover, p.demo a:active {
	display: block;
}

p.demo a:hover {
	background: url(../images/play-demo-on.jpg)  no-repeat 80px 50%;
	text-decoration: none;
}



/* Tables ********************************************/

table.specs {
	font: bold 13px/100% Arial, Helvetica, sans-serif;
	text-align: left;
	margin: 30px 0;
}

table.specs th, table.specs td {
	padding: 10px 15px 10px 10px;
	margin: 0;
	border-top: none;
	border-left: none;

}

table.specs th {
	color: #333333;
	border-right: 1px solid #666666;
	border-bottom: 1px solid #666666;
}

table.specs td {
	color: #666666;
	font-size: 12px;
	border-right: 1px solid #999999;
	border-bottom: 1px solid #999999;
}

/* Main Content Container and Columns  *******************************/

.content-container {
	width: 890px;
	margin: 3px auto 0 auto;
	padding: 0;
}

.col1 {
	width: 525px;
	float: left;
	padding: 0 0 0 10px;
}

.col2 {
	width: 305px;
	float: right;
	margin-right: 10px;
}

.spacer {
	width: 880px;
	height: 1px;
	clear: both;
}

/* Navigation links  *******************************/

.top-nav ul {
	font: bold 12px/135% Arial, Helvetica, sans-serif;
	color: #DEE9D5;
	padding: 0;
	margin: 15px 0 0 0;
	text-align: center;
}

.top-nav li {
	display: inline;
	padding: 0 17px;
	margin: 0;
}
.top-nav li#line {
	border-left: 1px solid #DEE9D5;
}

.top-nav li a:link, .top-nav li a:visited, .top-nav li a:hover, .top-nav li a:active {
	color: #DEE9D5;
	text-decoration: none;
}

.top-nav li a:hover {
	color: #FFF;
	border-bottom: 1px dotted #DEE9D5;
}

/* Java Container  *********************************/

.java {
	float:left;
	width: 424px;
	height: 219px;
	margin: 11px 0 0 20px;
	padding: 0;
}

/* Text and Copy declarations *************************/

p {
	font: normal 13px/135% Arial, Helvetica, sans-serif;
	color: #666666;
	text-align: left;
}

h1 {
	font: normal 30px/50px Arial, Helvetica, sans-serif;
	color: #5F952F;
	margin: 7px 0 15px 0;
	padding: 0;
}

h2 {
	font: normal 24px/125% Arial, Helvetica, sans-serif;
	color: #1E558A;
	margin: 15px 0 5px 0;
	padding: 0;
}

h3 {
	font: normal 18px/125% Arial, Helvetica, sans-serif;
	color: #1E558A;
	margin: 15px 0 5px 0;
	padding: 0;
}

.col1 h1 {
	border-bottom: 1px dotted #5F952F;
}

.col2 h1 {
	background-color: #FFF;
	border-bottom: 1px dotted #5F952F;
	text-indent: 20px;
	width: 305px;
	margin: 7px 0 0 0;
}

.col2 h1.mini {
	font: normal 24px/50px Arial, Helvetica, sans-serif;
	background-color: #FFF;
	border-bottom: 1px dotted #5F952F;
	text-indent: 20px;
	width: 305px;
	margin: 7px 0 0 0;
}

.col2 h2, .col2 h3, .col2 p {
	padding-left: 25px;
	padding-right: 20px;
}

p.download {
	line-height: 18px;
	background: url(../images/download.jpg) no-repeat 0 1px;
	padding-left: 18px;
}

p.bump-down {
	padding-bottom: 30px;
}

.col2 .box {
	background: url(../images/col2-bg.jpg) repeat-y top center;
	width: 305px;
	padding: 10px 0 0 0;
	margin: 0;
}

/*  List declarations  ********************************/

ul {
	list-style-type: square;
	font: normal 13px/120% Arial, Helvetica, sans-serif;
	color: #454545;
	margin: 10px 10px 10px 35px;
	padding: 0;
}

li {
	text-align: left;
	padding: 4px 30px 4px 0;
}

.col2 ul {
	list-style-type: square;
	font: bold 13px/120% Arial, Helvetica, sans-serif;
	color: #454545;
	margin: 0 0 10px 45px;
	padding: 8px 0 0 0;
}

.col2 li {
	font-style: italic;
	text-align: left;
	padding: 3px 30px 5px 0;
}

ul#articles {
	list-style-type: none;
	margin-left: 10px;
}

ul#articles a:link, ul#articles a:visited, ul#articles a:active {
	text-decoration: none;
}

ul#articles a:hover {
	border-bottom: 1px dotted #5F952F;
}

/* New Releases  *****************************************/

#news h3 {
	font: normal 18px/125% Arial, Helvetica, sans-serif;
	color: #1E558A;
	margin: 20px 0 10px 0;
	padding: 0;
}

#news p.download {
	margin: 15px 0;
	padding-bottom: 20px;
	border-bottom: 1px solid #CCC;
}

p.download#last {
	border-bottom: none;
}

/* Contact Info in col1  *********************************/


.col1 div.contact p {
	background: url(../images/contact-phone.jpg) no-repeat top left;
	padding: 0 0 0 50px;
	margin: 0;
}

.col1 div.contact h2 {
	font: normal 24px/135% Arial, Helvetica, sans-serif;
	color: #5F952F;
	margin: 0;
	padding: 10px 0;
}

/* Contact Info in col2  *********************************/

.col2 p.phone {
	background: url(../images/contact-phone-gray.jpg) no-repeat 25px 22px;
	margin: 0;
	padding: 20px 0 20px 75px;
}

.col2 div.contact p {
}

/* Forms, field, etc. ************************************/

.field {
    display: block; 
    clear: both; 
}

div#contact-note p {
    overflow: hidden;
    margin: 0 0 10px 0;
}

#contact-note label {
	font: bold 12px/140% Arial, Helvetica, sans-serif;
	color: #666666;
    width: 80px;
    padding: 3px 0 0 20px;
    float: left; 
}

#contact-note input, #contact-note textarea  {
    width: 350px;
    float: left;
    background-color: #FFF;
    border: 1px solid #76A44D;
    float:left;
    height:18px;
    color: #333;
    padding:4px 4px 0 4px;
    font: normal 12px/130% Arial, Helvetica, sans-serif;
}

#contact-note input.req {
	background-color: #E8E8E8;
}

#contact-note p textarea {
    height: 100px;
}
#contact-note .buttons {
    padding-left: 75px;
}
#contact-note .captcha {
    display:block;
    margin:5px 0 0 75px;
    padding-bottom: 5px;
}
.field span {
	padding-left: 100px;
	line-height: 30px;
}

input#sendit {
    width: 80px;
    height: 35px;
    background: url(../images/btn-submit.gif) top center;
    text-indent:  -9999px;
    color:#CCC;
    letter-spacing:-8px;
    font-size: 0px;
    cursor: pointer;
    border: 0px;
    float: left;
	margin-left: 100px;
}

input#sendit:hover {
    background: url(../images/btn-submit.gif) bottom center;
}

/* Installers Container  *********************************/

.installers {
	background: url(../images/installers-bg.jpg) no-repeat top center;
	width: 890px;
	height: 215px;
	margin: 3px auto 0 auto;
	padding: 0;
}

.installers h1 {
	background: url(../images/nationwide-installers.gif) no-repeat bottom left;
	width: 240px;
	height: 35px;
	margin: 0 0 0 25px;
	padding: 20px 0 0 0;
}

.installers p {
	font: normal 13px/180% Arial, Helvetica, sans-serif;
	float: left;
	width: 340px;
	margin: 15px 0 0 27px;
	padding: 0;
}

.installers h1 span {
	display: none;
}

.installers-logo {
	float: left;
	width: 151px;
	margin: 7px 0 0 0;
	padding: 0;
}

.installers-logo p {
	font: bold 13px/110% Arial, Helvetica, sans-serif;
	color: #333;
	text-align: center;
	font-style: italic;
	width: 151px;
	margin: 5px 0 0 0;
	padding: 0;
}

#first {
	margin-left: 40px;
}

/* Owners - "Chief" container  ***********************/

.chief {
	width: 505px;
	border-top: 1px dotted #666666;
	border-right: none;
	border-bottom: 1px dotted #666666;
	border-left: none;
	padding: 0;
	margin: 30px 0 20px 0;
}

#michels .chief {
	background: url(../images/kelly.jpg) #F6F6F6 no-repeat top left;
	height: 130px;
	padding: 15px 20px 0 0;
}

#insight .chief {
	background: url(../images/insight-owners.jpg) #F6F6F6 no-repeat top left;
	height: 120px;
	padding: 25px 20px 0 0;
}

#amliner .chief {
	background: url(../images/am-liner-owners.jpg) #F6F6F6 no-repeat top left;
	height: 110px;
	padding: 35px 20px 0 0;
}


.chief p {
	font: normal 12px/135% Arial, Helvetica, sans-serif;
	color: #666666;
	text-align: left;
	padding-left: 230px;
}

/* Link Declarations  ********************************/

a:link, a:visited, a:hover, a:active {
	color: #5F952F;
	text-decoration: underline;
}

.installers-logo a:link, .installers-logo a:visited, .installers-logo a:hover, .installers-logo a:active {
	color: #333;
	text-decoration: none;
}

.installers-logo a:hover {
	color: #666666;
}


/* Main Navigation  ********************************/

.main-nav {
	background: url(../images/main-nav-bg.jpg) no-repeat top center;
	margin: 0 auto 15px auto;
	width: 910px;
	height: 41px;
	padding: 0;
}

.main-nav ul {
	font: bold 13px/43px Arial, Helvetica, sans-serif;
	height: 44px;
	color: #FFF;
	padding: 0;
	margin: 0 auto;
	text-align: center;
}

.main-nav li {
	display: inline;
	padding: 0;
	margin: 0;
}

.main-nav li a:link, .main-nav li a:visited, .main-nav li a:hover, .main-nav li a:active {
	color: #FFF;
	text-decoration: none;
	padding: 14px 13px 13px 13px;
	margin: 0;
}

.main-nav li a:hover {
	background: url(../images/nav-arrow.jpg) no-repeat center top;
}

body#home a#homenav, body#install a#installnav, body#amliner a#amlinernav, body#insight a#insightnav,
body#michels a#michelsnav, body#process a#processnav, body#tech a#technav, body#contact a#contactnav {
	background: url(../images/nav-arrow.jpg) no-repeat center top;
}

/*  Footer  ****************************************/

.footer-container {
	background: url(../images/footer-bg.jpg) repeat-x 0 0;
	height: 260px;
	width: 100%;
	margin: 30px 0 0 0;
}

.footer {
	background: url(../images/footer.jpg) no-repeat top left;
	width: 980px;
	height: 260px;
	margin: 0 auto;
}

.footer ul {
	list-style-type: square;
	font: bold 12px/135% Arial, Helvetica, sans-serif;
	color: #CFDFC0;
	padding: 53px 0 0 20px;
	margin: 0;
	float: left;
	text-align: left;
	width: 200px;
}

.footer ul#left {
	padding-left: 82px;
}

.footer li {
	padding: 5px 0;
	margin: 0;
	text-align: left;
}

.footer li a:link, .footer li a:visited, .footer li a:hover, .footer li a:active {
	color: #CFDFC0;
	text-decoration: none;
	border: none;
}

.footer li a:hover {
	color: #FFF;
	border-bottom: 1px dotted #CFDFC0;
}

.footer p {
	font: bold 11px/135% Arial, Helvetica, sans-serif;
	clear: left;
	color: #A8CB8A;
	padding: 48px 0 0 0;
	margin: 0 0 0 70px;
}