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

   main.css
   
-------------------------------------------------------------- */


/* @Import
-------------------------------------------------------------- */
@import url('pact.css');
 
 
/* Structure
-------------------------------------------------------------- */
html { background: #f1f1f1 url('../img/html_bg.png'); }
body { background: url('../img/body_bg.png') repeat-x; }

ul { list-style: none; margin: 0; padding: 0; }


/* Typography
-------------------------------------------------------------- */
body { color: #1f1f1f; font-size: 81.25%; line-height: 1.4em; }

a { color: #3261a1; text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4, h5, h6 { font-family: Bebas, Arial, Tahoma, Verdana, Sans-serif; font-weight: bold; word-spacing:3px; }

blockquote { color: inherit; font-style: normal; margin: 0 0 60px; }
blockquote:before { background: url('../img/blockquote_before.png'); display: block; height: 20px; margin-bottom: 8px; width: 37px; }
blockquote:after { background: url('../img/blockquote_after.png'); display: block; float: right; height: 20px; margin-top: -8px; width: 37px; }

b{font-weight:700;}

/* Header
-------------------------------------------------------------- */
#pageHeader { background: url('../img/nav_right.png') no-repeat right 28px; height: 100px; margin: 0 auto 40px; text-align: left; width: 960px; }
#pageHeader h1 { float: left; margin: 25px 0 0; }
#pageHeader h1 a { background: url('../img/logo.png'); display: block; height: 41px; margin: 0; overflow: hidden; text-indent: -9999em; width: 369px; }

#pageHeader nav { background: url('../img/nav_bg.png'); float: right; font-size: .92em; font-weight:700; height: 32px; margin: 28px 10px 0 0; }
#pageHeader ul { background: url('../img/nav_left.png') no-repeat; float: left; padding: 0 9px 0 19px; }
#pageHeader li { float: left; line-height: 32px; padding: 0 15px; }
#pageHeader a { color: #202020; text-decoration: none; text-transform: lowercase; }
#pageHeader a:hover { color:#EF4423; text-decoration: underline; }
#pageHeader a:active{text-decoration:none;}


/* Body
-------------------------------------------------------------- */
#pageBody { margin: 0 auto; text-align: left; width: 960px; }

#pageBody .section-header { background: url('../img/header_bg.png') repeat-x center; height: 49px; margin-bottom: 36px; padding: 0 45px; }
#pageBody .section-header hgroup { background: url('../img/header_hgroup_bg.png') no-repeat; float: left; padding-left: 26px; }
#pageBody .section-header h1 { background: url('../img/header_h1_bg.png') no-repeat right; color: #ef4423; font-size: 1.84em; line-height: 49px; padding-right: 26px; text-transform: uppercase; }

#pageBody h2 { background: url('../img/h2_bg.png') repeat-x bottom; color: #356bb4; font-size: 1.38em; margin: 0 0 .75em; padding-bottom: .5em; text-transform: uppercase; word-spacing:0.2em;}
#pageBody h2 a:hover{text-decoration:none;}

#pageBody img.bordered { border: #fff solid 10px; }
#pageBody a:hover img.bordered {border-color:#f9f9f9;}

#pageBody section { float: left; padding-bottom: 40px; }
#pageBody .wide-column { width: 550px; }
#pageBody .narrow-column { width: 370px; }
#pageBody .quarter-column { margin: 0 10px; width: 220px; }
#pageBody .right { float: right; }


/* Home
-------------------------------------------------------------- */
#pageBody .location { padding-left: 10px; width: 540px; }
#pageBody .location header { margin-left: -10px; padding-left: 55px; }
#pageBody .map { margin-bottom: 1.75em; }

#pageBody .services img { margin-bottom: 2.4em; }


/* Portfolio
-------------------------------------------------------------- */
.portfolio article { padding: 10px 0 100px; }
.portfolio article header { float: left; margin-left: 10px; width: 170px; }
.portfolio article h2 { margin-left: -10px; }
.portfolio article ul { margin-bottom: 2em; }
.portfolio article .preview { float: left; margin: -10px 20px 0; }

/* Checklist
-------------------------------------------------------------- */
ul.checklist{margin-bottom: 10px;}
ul.checklist li {background:url("../img/checkmark.gif") no-repeat; padding:0px 0 5px 0; margin-bottom:5px;text-indent:20px;}

/* Articles List
-------------------------------------------------------------- */
ul.articles{margin-bottom: 25px;}
ul.articles li {margin-bottom:5px;}

/* Quote form
-------------------------------------------------------------- */

#quoteform label{font-size:13px; color:#1A1A1A; word-spacing:3px;}
form input[type="text"], form textarea {-moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px;  border-radius: 5px; width:90%;color: #333333; background: #f9f9f9; border: 1px solid #999999; padding:3px; font-family:Tahoma, Arial, Helvetica, sans-serif; font-size:12px;}
form input[type="text"]:focus, form textarea:focus {background:#fff; border:1px solid #EF4423;}
#quoteform .submitbutton{-moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px;  border-radius: 5px;color: #fff;background: #1A1A1A; border: 1px outset #999999; padding:3px; font-family:Tahoma, Arial, Helvetica, sans-serif;}
#quoteform .error{width:300px; padding:7px; background:#ff0000; color:#fff; font-size:130%;}
#quoteform div.postalcode{display:none;}

.formError{position:absolute;top:300px;left:300px;width:150px;padding-bottom:15px;display:block;z-index:5000;}
.formError .formErrorContent{width:100%;background:#000;color:#fff;font-family:tahoma;font-size:10px;box-shadow:1px 1px 6px #000;-moz-box-shadow:1px 1px 6px #000;-webkit-box-shadow:1px 1px 6px #000;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;padding:4px 10px;}
.formError .formErrorArrow{position:absolute;bottom:0;left:20px;width:15px;height:15px;}
.formError .formErrorArrow div{box-shadow:1px 4px 5px #000;-moz-box-shadow:1px 4px 5px #000;-webkit-box-shadow:1px 1px 5px #000;font-size:0;}
.formError .formErrorArrow .line10{width:15px;height:1px;background:#000;font-size:0;display:block;margin:0 auto;}
.formError .formErrorArrow .line9{width:13px;height:1px;background:#000;display:block;margin:0 auto;}
.formError .formErrorArrow .line8{width:11px;height:1px;background:#000;display:block;margin:0 auto;}
.formError .formErrorArrow .line7{width:9px;height:1px;background:#000;display:block;margin:0 auto;}
.formError .formErrorArrow .line6{width:7px;height:1px;background:#000;display:block;margin:0 auto;}
.formError .formErrorArrow .line5{width:5px;height:1px;background:#000;display:block;margin:0 auto;}
.formError .formErrorArrow .line4{width:3px;height:1px;background:#000;display:block;margin:0 auto;}
.formError .formErrorArrow .line3{width:1px;height:1px;background:#000;display:block;margin:0 auto;}

.spacebelow{margin-bottom:300px;}

/* Directions
-------------------------------------------------------------- */
.mapFormDiv{border:1px solid #999;margin:10px 0;padding:5px 10px 10px 10px; clear:both; background:#fff; width:90%;}
.mapFormDiv ul{list-style-type:none;margin:0;padding:0;}
.mapFormDiv li{padding-top:5px; font-size:13px;}
label.mapFormLabel{float:left;margin-right:5px;width:40px;}
input.mapFormInput{width:250px; border:1px solid #ddd; font-size:13px; padding:2px;}
input.submit{padding:3px; margin:5px 0; border:1px solid #333;}
.home #map{width:520px;height:215px; margin:-5px 0 25px; overflow:hidden;}
#map{width:940px;height:300px;border:10px solid #fff;margin:10px 0 10px 0; clear:both;}
#mapAdminControl{display:none;}
#directions{margin:10px 0px 0px 0px;text-align:left; float:right;}
#directions table{font-size:14px;}

/* Footer
-------------------------------------------------------------- */
#pageFooter { background: url('../img/footer_border.png') repeat-x; clear: both; color: #f0f0f0; margin-top: 40px
; padding-top: 14px; text-align: left; }
#pageFooter footer { background: #181818 url('../img/footer_bg.png'); padding-top: 46px; }
#pageFooter section, #pageFooter nav { width: 300px; }

#pageFooter #socialMedia { float: left;  left: 50%;  margin-left: -480px;  padding-bottom: 60px; position: relative; }
#pageFooter #quickLinks  { margin: 0 auto; padding-bottom: 60px; }
#pageFooter #ourInfo     { float: right; right: 50%; margin-right: -480px; padding-bottom: 60px; position: relative; }
#pageFooter #copyright   { color: #666; font-size: .833em; line-height: 3em; margin: 0 auto; text-align: center; width: 960px; }

#pageFooter h1 { color: #fff; font-size: 1.84em; margin-bottom: 1.25em; text-transform: uppercase; }
#pageFooter a { color: #f0f0f0; }
#pageFooter a:hover { color: #fff; }

#pageFooter #quickLinks ul { list-style: none; padding: 0 0 0 .77em; text-transform: lowercase; }
#pageFooter #socialMedia img { margin: 0 10px; }
#pageFooter #ourInfo p     { margin-left: .77em; }