/* ---------------------------------------------------------------------------------------------------------



Trust Heartland Roofing

http://www.trustheartland.com/



Design, Code, Database Structure, Interactivity, and Management: Thomas Bright and Tony Scialdone

http://www.straightstreetdesign.com/



--------------------------------------------------------------------------------------------------------- */





/* Universal Declarations */



html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {

	margin: 0;

	padding: 0;

	border: 0;

	outline: 0;

	font-size: 100%;

	vertical-align: baseline;

	background: transparent; }

body * { position: relative; }

html { background : url(null) fixed no-repeat; } 			/* this fixes an IE problem. Scrolling some pages causes corruption in the rendering. */

:focus { outline: 0; background: #ccc; }					/* remember to define focus styles! */

table { border-collapse: collapse; border-spacing: 0; } 		/* tables still need cellspacing="0" in the markup */





/* Block Level Elements */



html, body {

	margin: 0;

	padding: 0 0 0 0;

	background: #242424;

	font-size: 100.01%; }



#headerwrap {

	float: left;

	width: 100%;

	height: 170px;

	background: #000; 

	overflow: auto; }



#header { 

	margin: 0px auto 0 auto;

	padding-top: 14px;

	width: 960px;

	height: 100%; }



#header #logo { 

	position: relative;

	display: block;

	float: left;

	left: 49px; 

	width: 400px;

	height: 140px; }



#header a#phones {

	display: block;

	top: 65px;

	right: 28px;

	float: right;

	width: 257px;

	height: 68px;

	background: url(../images/phone_number.gif) no-repeat left top; }



#topnav {

	clear: both;

	margin: 0 auto 0px auto;

	width: 100%;

	background: url(../images/bg_nav_full.jpg) repeat-x left top; }



#brandingwrap {

	clear: both;

	padding: 14px 0;

	width: 100%;

	height: 214px;

	background: #242424; }



#branding {

	margin: 0 auto;

	padding: 0;

	width: 960px;

	height: 207px; }



#branding #image {

	float: left;

	left: 7px;

	margin: 0 30px 0 0;

	width: 600px; }



#slider {

	float: right;

	width: 320px;

	height: 207px; }





#branding #video {

	float: left;

	width: 320px; }



#contentwrap {

	clear: both;

	margin: 14px auto 0 auto;

	padding: 0 0 77px 0;

	width: 960px;

	font: 0.7em/1.5em verdana, arial, sans-serif;

	color: #006;

	overflow: auto; }



#primary {

	float: left;

	left: 7px;

	margin: 0 30px 0 0;

	padding: 0 0 77px 0;

	width: 600px;

	background: #fff;

	font: 1.1em/1.5em verdana, arial, sans-serif;

	color: #333;

	border: 0px solid #fff;

	-webkit-border-radius: 10px;

	-moz-border-radius: 10px 10px 10px 10px;

	border-radius: 10px 10px 10px 10px;

	behavior: url(misc/PIE.htc); }





#secondary {

	float: left;

	width: 320px; }



#footer {

	clear: both;

	margin: 77px auto 0 auto;

	width: 100%;

	height: 170px;

	background: #000;

	font-size: 80%;

	line-height: 40px;

	border: 1px solid transparent;

	-webkit-border-radius: 3px;

	-moz-border-radius: 3px 3px 3px 3px;

	border-radius: 3px 3px 3px 3px;

	behavior: url(/misc/PIE.htc); }



#footer p {

	margin: 0;

	padding: 0;

	line-height: 40px;

	color: #ddd;

	text-align: center; }





#bottom {

	width: 100%;

	height: 100px;

	background: #000 url(../images/bgbottom.jpg) repeat-x left top; }





div.news {

	margin: 21px auto 28px auto;

	padding: 0 14px 0 0px;

	width: 85%;

	background: #eee;

	border: 1px solid #666; }



div.news h2 {

	margin: 14px 14px 7px 21px;

	line-height: 1.1em; }



p.newsdate {

	margin: 7px 0 0 0;

	padding: 0;

	font-size: 70%;

	color: #666;

	text-transform: uppercase;

	letter-spacing: 2px; }



div.news img {

	float: right;

	margin: 18px 0 21px 10px; }



div.news p { margin: 0 0 14px 21px; }



div.slides { margin: 0 0 35px 21px; }



/* Nav Styles */



#topnav ul {

	margin: 0 auto;

	width: 960px;

	height: 61px;

	background: url(../images/bgnav.jpg) no-repeat left top; }



* html #topnav ul  { width: 959px; }



#topnav li {

	list-style-type: none;

	display: block;

	float: left;

	height: 61px; }



#topnav li.home { margin-left: 19px; width: 119px; }

#topnav li.about { width: 144px; }

#topnav li.estimate { width: 222px; }

#topnav li.photos { width: 161px; }

#topnav li.blog { width: 101px; }

#topnav li.contact { width: 176px; }



#topnav a:link,

#topnav a:visited,

#topnav a:active {

	display: block;

	float: left;

	width: 100%;

	height: 100%;

	text-decoration: none;

	font: normal 1.18em/91px verdana, arial, sans-serif;

	text-indent: -9999px;

	text-transform: uppercase;

	letter-spacing: -1px; }



#topnav li.home a:link,

#topnav li.home a:visited,

#topnav li.home a:active { background: url(../images/bg_nav.jpg) no-repeat -19px 0; }

#topnav li.home a:hover { background: url(../images/bg_nav.jpg) no-repeat -19px bottom; }



#topnav li.about a:link,

#topnav li.about a:visited,

#topnav li.about a:active { background: url(../images/bg_nav.jpg) no-repeat -138px top; }

#topnav li.about a:hover { background: url(../images/bg_nav.jpg) no-repeat -138px bottom; }



#topnav li.estimate a:link,

#topnav li.estimate a:visited,

#topnav li.estimate a:active { background: url(../images/bg_nav.jpg) no-repeat -282px top; }

#topnav li.estimate a:hover { background: url(../images/bg_nav.jpg) no-repeat -282px bottom; }



#topnav li.photos a:link,

#topnav li.photos a:visited,

#topnav li.photos a:active { background: url(../images/bg_nav.jpg) no-repeat -504px top; }

#topnav li.photos a:hover { background: url(../images/bg_nav.jpg) no-repeat -504px bottom; }



#topnav li.blog a:link,

#topnav li.blog a:visited,

#topnav li.blog a:active { background: url(../images/bg_nav.jpg) no-repeat -665px top; }

#topnav li.blog a:hover { background: url(../images/bg_nav.jpg) no-repeat -665px bottom; }



#topnav li.contact a:link,

#topnav li.contact a:visited,

#topnav li.contact a:active { background: url(../images/bg_nav.jpg) no-repeat -766px top; }

#topnav li.contact a:hover { background: url(../images/bg_nav.jpg) no-repeat -766px bottom; }





#secondarynav {

	margin: 0px 0 0 0;

	padding: 0;

	width: 100%; }



#secondarynav li {

	list-style-type: none;

	list-style-position: outside;

	margin: 0 0 7px 0;

	padding: 0;

	width: 320px;

	height: 25px;

	background: url(../images/bg_secondarynav.jpg) no-repeat left top; }





#secondarynav a:link,

#secondarynav a:visited,

#secondarynav a:active {

	display: block;

	width: 100%;

	height: 25px;

	font: bold 118%/22px verdana, arial, sans-serif;

	text-indent: 42px;

	text-decoration: none;

	color: #fff; }



#secondarynav a:hover {

	color: #fc3;

	background: url(../images/bg_secondarynav_a.jpg) no-repeat 25px 6px; }







#primary a:link,

#primary a:visited,

#primary a:active {

	text-decoration: none;

	font-size: 100%;

	color: #00f;

	border-bottom: 1px dotted #00f; }

#primary a:hover {

	text-decoration: none;

	color: #f00;

	border-bottom: 1px dotted #f00; }



#footer a:link,

#footer a:visited,

#footer a:active {

	color: #ddd;

	text-decoration: none;

	border-bottom: 1px dotted #ddd; }

#footer a:hover {

	color: #f00;

	border-bottom: 1px dotted #f00; }



#footer a#admin {

	color: #ddd;

	text-decoration: none;

	border: 0;

	cursor: inherit; }



#content_edit a { text-decoration: none; border: 0; }



/* Headlines */



h1 {

	margin: 0;

	padding: 14px 0 0 0;

	font: normal 218%/1.5em arial, sans-serif;

	color: #007;

	text-indent: 21px;

	letter-spacing: -1px; }



h2 {

	margin: 14px 0 0 21px;

	font: normal 200%/1.5em arial, sans-serif;

	color: #007;

	letter-spacing: -1px; }



#secondary h2 {

	margin: 0 0 0 49px;

	color: #fc3; }



h3 {

	margin: 14px 0 0 21px;

	font: normal 188%/1.5em arial, sans-serif;

	color: #007;

	letter-spacing: -1px; }



h4 {

	margin: 14px 0 0 21px;

	font: normal 160%/1.5em arial, sans-serif;

	color: #007;

	letter-spacing: -1px; }



h5 {

	margin: 14px 0 0 21px;

	font: normal 154%/1.5em arial, sans-serif;

	color: #007;

	letter-spacing: -1px; }





/* Paragraphs */



p {

	margin: 14px 21px 0 21px;

	line-height: 1.5em;

	text-align: justify; }



div#address {

	margin: 10px 0 0 0;

	padding: 0;

	background: url(../images/bb.jpg) no-repeat 230px 10px; }



div#address p {

	margin: 0 0 21px 77px;

	padding: 0;

	font-size: 118%;

	color: #fff; }



div#address strong { color: #fff; }





.bbb { 

	float: left; 

	margin: 21px 0 0 21px;

	width: 134px;

	height: 105px; 

	overflow: none; }

	

.bbb p {  

	display: block;

	float: left; 

	margin: 0 7px 0 0;

	padding: 0;

	width: 60px;

	height: 105px; 

	font-weight: bold;

	color: #fff; 

	text-align: center; }



.bbb a:link,

.bbb a:visited,

.bbb a:active {

	display: block;

	width: 100%;

	height: 100%;

	background: url(../images/bbb_link.gif) no-repeat left bottom; }

.bbb a:hover { background: url(../images/bbb_link.gif) no-repeat right bottom; }





body#photos h1+p { margin-top: 0; }





p.servicearea {

	font-size: 80%;

	color: #eee; }









/* Definition Lists */



dl {

	list-style-position: inside;

	margin: 14px 28px 0 42px; }



dt {

	font-weight: bold;

	font-size: 118%; }



dd {

	margin-left: 14px; }



/* Ordered Lists */



ol {

	list-style-position: outside;

	margin: 14px 28px 0 42px; }



ol li { text-align: justify; }





/* Unordered Lists */



ul {

	list-style-position: outside;

	margin: 14px 28px 0 42px; }



ul li { text-align: justify; }



ul#gallerypics {

	margin: 28px auto;

	padding: 0;

	width: 100%; }



ul#gallerypics li {

	list-style-type: none;

	display: inline;

	float: left;

	left: 20px;

	width: 140px;

	height: 140px;

	background: url(../images/shadow_thumb.jpg) no-repeat left top; }



ul#gallerypics li img {

	display: block;

	margin: 0;

	top: 3px;

	left: 5px;

	padding: 5px;

	background: #fff; }



#primary ul#gallerypics li a { border: 0; }



/* Images */



.pic {

	display: block;

	margin: 14px auto;

	padding: 4px;

	background: #fff;

	border: 1px solid #000; }



img#bb {

	display: block;

	margin: 28px 0 0 77px; }



img#mitch {

	display: block;

	margin: 14px 0 21px 21px; }



img#bbbcompanypic {

	display: block;

	margin: 21px auto; }

	

	

div object {

	display: block;

	margin: 21px auto; }



/* Blockquotes */



blockquote {

	margin: 21px 21px 0 21px;

	border-top: 1px solid #666; border-bottom: 1px solid #666; }



blockquote p {

	margin: 0;

	padding: 14px;

	background: url(../images/quotes.gif) no-repeat 5px 10px;

	font-weight: bold;

	color: #fff; }



/* Forms */



form {

	margin: 21px; }



label {

	clear: both;

	display: block;

	margin: 0;

	font-weight: bold;

	color: #4071a9;

	text-transform: uppercase; }



input {

	display: block;

	margin: 0 0 14px 0;

	padding: 3px 4px;

	width: 200px;

	background: #fff;

	font: bold 100%/1.3em tahoma, verdana, arial, sans-serif;

	color: #00448d;

	border: 1px solid #c2c2c2; }



input[type $='hidden'] { display: none; }



textarea {

	clear: both;

	display: block;

	overflow: auto;

	margin: 0 0 7px 0;

	padding: 4px 4px 0 4px;

	width: 400px;

	height: 100px;

	background: #fff;

	font: normal 100%/1.3em tahoma, verdana, arial, sans-serif;

	color: #00448d;

	border: 1px solid #c2c2c2; }



select {

	margin: 0px 0 7px 0;

	background: #fff;

	border: 1px solid #c2c2c2; }



input.button {

	clear: both;

	display: block;

	margin: 14px 0 0 0;

	padding: 2px 7px;

	width: auto;

	background: #00448d;

	font-weight: bold;

	color: #fff;

	text-align: center;

	text-transform: uppercase; }



input[type $='submit'] {

	clear: both;

	display: block;

	margin: 14px 0 0 0;

	padding: 2px 7px;

	width: auto;

	background: #00448d;

	font-weight: bold;

	color: #fff;

	text-align: center;

	text-transform: uppercase; }



input.check {

	display: inline;

	top: 3px;

	margin: 0 7px 21px 0;

	width: auto;

	border: 0; }



label.captcha { color: #f00; }



input.captcha {

	display: inline;

	width: 35px;

	text-align: center;

	border: 1px solid #f00; }





label#zip input { display: block; width: 100px; }



#citystatezip {

	margin: 0 0 21px 0;

	width: 100%; }



#city, #state, #zip {

	clear: none;

	width: 150px;

	height: auto;

	display: inline;

	float: left; }



#city input, #state select, #zip input {	display: inline; float: left; width: 130px; }





label#checks { vertical-align: middle; margin-bottom: 21px; }



label#phone input { text-align: center;  margin-right: 2px; }





/* Tables */



table {

	table-layout: fixed;

	width: 100%;

	overflow: hidden; }





/* Blog styles */



div.post { margin-bottom: 77px; }



div.postbody { margin-bottom: 35px; }



div.postbody ul { margin-left: 63px; }



div.postbody img {

	display: block;

	margin: 14px auto;

	padding: 4px;

	background: #fff;

	border: 1px solid #000; }





#categories {

	margin: 14px 0 0 0;

	padding: 0;

	width: 100%; }



#categories li {

	list-style-type: none;

	list-style-position: outside;

	margin: 0 0 7px 0;

	padding: 0;

	width: 320px;

	height: 25px;

	background: url(../images/bg_secondarynav.jpg) no-repeat left top; }



#categories li.catspacer, #secondarynav li.catspacer {

	height: auto;

	background: none;

	font-weight: bold;

	font-size: 107%;

	color: #fc3;

	text-indent: 21px;

	text-transform: uppercase;

	letter-spacing: 6px; }

#categories li.home  a { color: #ccc; }

#categories li.estimate a { color: #ccc; }

#categories li.contact { margin-bottom: 25px; }

#categories li.contact a { color: #ccc; }

#categories li.bloghome { margin-bottom: 25px; }

#categories li.bloghome a, #categories li.blogarchive a { color: #ccc; }

#categories li.blogarchive { margin-top: 25px; }





#categories a:link,

#categories a:visited,

#categories a:active {

	display: block;

	width: 100%;

	height: 100%;

	font: bold 118%/22px verdana, arial, sans-serif;

	text-indent: 42px;

	text-decoration: none;

	color: #fff; }

#categories a:hover {

	color: #f00;

	background: url(../images/bg_secondarynav_a.jpg) no-repeat 25px 6px; }









/* Classes and Stuff */



.bold { font-weight: bold; }

strong { font-weight: bold; }

em { font-style: italic; }

.right { text-align: right; }

.left { text-align: left; }

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

.red { color: #f00; }





/* Intelligent Navigation */



body#Welcome #topnav li.hme a { background: url(../images/bg_nav.jpg) no-repeat -19px bottom;  }

body#About_Us #topnav li.about a { background: url(../images/bg_nav.jpg) no-repeat -138px bottom; }

body#Go_Mitch_Go #topnav li.about a { background: url(../images/bg_nav.jpg) no-repeat -138px bottom; }

body#Free_Estimate #topnav li.estimate a { background: url(../images/bg_nav.jpg) no-repeat -282px bottom; }

body#Photos #topnav li.photos a { background: url(../images/bg_nav.jpg) no-repeat -504px bottom; }

body.blog #topnav li.blog a { background: url(../images/bg_nav.jpg) no-repeat -665px bottom; }

body#Contact_Us #topnav li.contact a { background: url(../images/bg_nav.jpg) no-repeat -766px bottom; }

body#Angies #topnav li.angies a { background: url(../images/bg_nav.jpg) no-repeat -766px bottom; }





body#Free_Estimate #secondarynav li.estimate a,

body#Products_and_Services #secondarynav li.products a,

body#Heartland_Roofing_In_the_News #secondarynav li.news a,

body#Go_Mitch_Go #secondarynav li.gomitchgo a,

body#Angies #secondarynav li.angies a,

body#Videos #secondarynav li.videos a,

body#Contact_Us #secondarynav li.contact a {

	color: #f00;

	background: url(../images/bg_secondarynav_a.jpg) no-repeat 25px 6px; }