/* =================================================================
   MASPETH ROOFING BASE STYLES
   ================================================================= */
   
/* GLOBAL RESET */
* {
	margin: 0;
	padding: 0;
}

/* DEFAULT BODY & TEXT */
body {
	background:gray url('http://maspethroofing.com//images/graphics/bg-gradient.png') repeat scroll;
}

body.iframe {
	background-image: none;
	background-color: #fff;
}

/* HEADER */
.full #header {
	height: 137px;
	width: 960px;
	margin: 10px auto 0;
	overflow: hidden;
	background:white url('http://maspethroofing.com//images/graphics/header-bg.png') no-repeat scroll center top;
	color: silver;
	position: relative;
}

/* Site Logo */
.full #site_id {
	position: absolute;
	left: 10px;
	top: 12px;
	width: 708px;
	height: 80px;
}

.full #company_name {
	display: block;
	width: 708px;
	height: 0;
	padding: 80px 0 0;
	overflow: hidden;
	background: transparent url('http://maspethroofing.com//images/graphics/site-logo-2.png') no-repeat scroll top left;
}

/* Contact Information */
.full #contact-info {
	position: absolute;
	top: 0;
	right: 10px;
	height: 100px;
	width: 450px;
}

.full #contact-phone {
	position: absolute;
	top: 0;
	right: 10px;
	height: 100px;
	width: 250px;
}

.full #contact-phone .label {
	position: absolute;
	top: 23px;
	right: 0;
	font-weight: bold;
	font-size: 18pt;
	text-transform: uppercase;
	font-family:Arial, Helvetica, sans-serif;
	color: #f26522;
	white-space: nowrap;
	width: 153px;
	padding: 19px 0 0;
	height: 0;
	overflow: hidden;
	display: block;
	background: transparent url('http://maspethroofing.com//images/graphics/call-today-bg.png') no-repeat scroll top left;
}

.full #contact-phone .value {
	position: absolute;
	bottom: 17px;
	right: 0;
	font-weight: bold;
	font-size: 19pt;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	white-space: nowrap;
	color: #767676;
}


/* Top Navigation */
.full ul#top-nav {
	position: absolute;
	bottom: 0;
	width: 960px;
	background-color: #898989;
	background-image: url('http://maspethroofing.com//images/graphics/nav-bg.png');
	background-repeat: repeat-x;
	height: 37px;
	background-position: center -5px;
	list-style: none outside;
}

.full ul#top-nav li {
	float: left;
	border-right: 2px #cacaca solid;
	height: 37px;
}

.full ul#top-nav li a {
	display: block;
	height: 15px;
	padding: 10px 13px 12px;
	font-weight: bold;
	font-size: 12pt;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	background-image: url('http://maspethroofing.com//images/graphics/nav-bg.png');
	background-repeat: repeat-x;
	background-position: center -5px;
	text-decoration: none;
}

.full ul#top-nav li a:hover,
#home ul#top-nav li.home a,
#commercial ul#top-nav li.commercial a,
.commercial ul#top-nav li.commercial a,
#residential ul#top-nav li.residential a,
.residential ul#top-nav li.residential a,
#products ul#top-nav li.products a,
#services ul#top-nav li.services a,
#about_maspeth ul#top-nav li.about_maspeth a,
#contact_us ul#top-nav li.contact_us a,
#get-estimate ul#top-nav li.get-estimate a
{
	background-position: center -47px;
}

/* FOOTER */
.full #footer {
	background-color: #fff;
	padding: 14px 10px;
	width: 940px;
	margin: 10px auto 60px;
	color: #666;
	font-family: Arial, Helvetica, sans-serif;
}

.full ul#bottom-nav {
	list-style: none outside;
	position: relative;
	width: 940px;
	height: 14px;
	overflow: hidden;
}

.full ul#bottom-nav li {
	float: left;
	display: block;
	padding: 0 10px;
	border-left: 1px #666 solid;
	font-size: 14px;
}

.full ul#bottom-nav li.home {
	padding-left: 0;
	border-left: none;
}

.full ul#bottom-nav li a {
	text-decoration: none;
	color: #666;
}

.full ul#bottom-nav li a:hover {
	color: #f26522;
}

/* CONTENT REGION */
.full #body {
	background-color: #fff;
	width: 920px;
	padding: 15px 20px;
	margin: 0 auto;
	font-family: Arial, Helvetica, sans-serif;
	color: #666;
	font-size: 14px;
}

body.home-page #body {
	width: 930px;
	padding: 10px 20px 10px 10px;
}

/* Text styles */
#body h1 {
	font: bold 24px Arial, Helvetica, sans-seric;
	color: #f26522;
	text-transform: uppercase;
	margin: 0 0 5px;
}

#body h2 {
	font-weight: normal;
	font-size: 24px;
	color: #f26522;
	margin: 0;
}

#about_maspeth #body h2,
.info-page #body h2 {
	font-weight: bold;
	font-size: 18px;
}

#services #body h2 {
	font-size: 18px;
	margin-top: 0.9em;
}

#body h2.specs {
	font-weight: normal;
	font-size: 12px;
	margin-top: 10px;
	color: #f26522;
	text-transform: uppercase;
}

#body p {
	margin: 0.9em 0;
	line-height: 1.3em;
}

#body ul {
	margin: 0 1em;
	list-style-image: url('http://maspethroofing.com//images/graphics/ul-bullet.png');
	list-style-position: outside;
	line-height: 1.3em;
}

#body a {
	color: #f26522;
	text-decoration: none;
}

#body a:hover {
	text-decoration: underline;
}

#body .boxout {
	margin: 0 20px 20px;
}

#body .left {
	float: left;
	margin-left: 0;
}

#body .right {
	margin-right: 0;
	float: right;
}

/* Content containers */
#body .content-region, #body .content-box {
	position: relative;
}

.full #body .dark {
	padding: 7px 9px;
	border: 1px solid #c4c4c4;
	background-color: #d7d7d7;
}


/* PROJECT PAGE SPECIAL STYLES
   --------------------------- */

/* PROJECT DETAILS */
.full #project-details {
	width: 359px;
	float: left;
}

/* Text styles */
.full #project-details span.header {
	display: block;
	font-size: 10pt;
	text-transform: uppercase;
	color: #f26522;
	font-weight: bold;
}
.full #project-details address,
.full #project-details ul#specs li .label {
	font-style:normal;
	font-weight: bold;
	color: #898989;
	display: inline;
	font-size: 13px;
}

.full #project-details ul#specs {
	list-style: none outside none;
	margin: 0;
}

.full #project-details ul#specs li {
	margin: 0.5em 0;
	font-weight: bold;
	color: #333;
	line-height: 17px;
}

.full #project-details ul#specs li p {
	display: inline;
}

.full #project-details ul#specs li#scope p {
	font-weight: normal;
	line-height: 20px;
}

/* PROJECT PHOTOS */
.full #project-photos {
	width: 550px;
	float: right;
}

.full #project-photos #selected-picture {
	width: 550px;
	text-align: center;
	height: 400px;
}

.full #project-photos #more-pictures {
	list-style-type: none;
	list-style-image: none;
	position: relative;
	margin: 10px 0;
}

.full #project-photos #more-pictures li {
	float: left;
	margin: 0 0 10px 10px;
	width: 102px;
	height: 102px;
	position: relative;
}

.full #project-photos #more-pictures li .border {
	border: 3px transparent solid;
	width: 96px;
	height: 96px;
	position: absolute;
	z-index: 20;
	left: 0;
	top: 0;
	cursor: pointer;
}

.full #project-photos #more-pictures li.selected .border,
.full #project-photos #more-pictures li .border:hover {
	border-color: #f26522;
}

.full #project-photos #more-pictures li img {
	cursor: pointer;
}

.full #project-photos #more-pictures li#img1,
.full #project-photos #more-pictures li#img6,
.full #project-photos #more-pictures li#img11,
.full #project-photos #more-pictures li#img16,
.full #project-photos #more-pictures li#img21 {
	margin-left: 0;
}

/* .full #project-photos #more-pictures li.selected {
	border-color: #f26522;
} */

.full #project-photos .caption {
	display: none;
}

/* GENERIC LIST STYLES
   ------------------- */

/* LARGE CATEGORY LIST */
.full #body ul.cat-list-large {
	list-style-type: none;
	list-style-image: none;
	margin: 0;
}

.full #body ul.cat-list-large li.category {
	position: relative;
	padding-left: 290px;
	min-height: 151px;
	margin: 5px 0 30px;
}

.full #body ul.cat-list-large li.category img.category-image {
	position: absolute;
	left: 0;
	top: 0;
}

/* PROJECT LIST */
.full #body ul.project-list li.project {
	font-weight: bold;
	color: #f26522;
}

.full #body ul.project-list li.project .address {
	font-weight: normal;
	color: #666;
}

/* PRODUCT LIST */
ul#products-list {
	list-style-image: none;
	list-style-type: none;
	margin: 0.5em 0;
}

ul#products-list li {
	float: left;
	margin-right: 50px;
}

div#products a.more {
	text-align: right;
	display: block;
}

/* LOGO GALLERY */
.full #body table.icon-gallery td {
	padding: 0 0 20px 0;
	text-align: center;
}

/* ESTIMATE FORM
   -------------  */
.full form.contact-form div.formelement {
	margin: 0.5em 0;
}

.full form.contact-form div.formelement label {
	display: block;
	margin: 0;
}

.full form.contact-form div.formelement #submitrequest {
	background-color: #d7d7d7;
	border: 1px #c4c4c4 solid;
	color: #f26522;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
	padding: 2px 5px;
	margin: 15px 0 0;
}

.full form.contact-form div.formelement .LV_validation_message {
	margin: 0;
	font-size: smaller;
}

.full form.contact-form div.formelement .LV_valid {
	color: green;
}

.full form.contact-form div.formelement .LV_invalid {
	color: red;
}

.full form.contact-form div.formelement .LV_invalid_field {
	border: 2px red solid;
}

/* GENERIC LAYOUTS
   --------------- */

/* TWO-COLUMN LAYOUT */
.full div.two-col #main-content-container {
	float: left;
	width: 470px;
}

.full div.two-col #additional-content-container {
	float: right;
	width: 450px;
}

/* CONTACT FORM LAYOUT */
.full div.two-col-wide-sidebar #main-content-container {
	float: left;
	width: 370px;
}

.full div.two-col-wide-sidebar #additional-content-container {
	float: right;
	width: 550px;
}

/* FRONT PAGE SPECIAL STYLES
   ------------------------- */
.full .home-page #featured-project {
	margin-bottom: 10px;
	position: relative;
	height: 463px;
}

.iframe .home-page #featured-project {
	width: 930px;
	margin: 0;
	height: 500px;
}

.full .home-page #featured-project #project-details {
	width: 359px;
	padding-left: 0;
	padding-right: 0;
	float: right;
	height: 463px;
	position: relative;
}

.full .home-page #featured-project #project-details span.header {
	display: block;
	font-size: 7pt;
	letter-spacing:1px;
	text-transform: uppercase;
	color: #f26522;
}

.full .home-page #featured-project #project-details h1 {
	color: #898989;
}

.full .home-page #featured-project #project-photos {
	width: 550px;
	float: left;
}

.full .home-page #featured-project #project-photos #selected-picture {
	width: 550px;
	text-align: center;
	height: 350px;
}

.full .home-page #featured-project .project-nav {
	margin: 0;
	position: absolute;
	left: 571px;
	bottom: 0;
}

.full .home-page #featured-project .project-nav #prev-btn,
.full .home-page #featured-project .project-nav #next-btn {
	display: block;
	float: left;
	padding: 5px;
	font-size: 16px;
	font-weight: bold;
	background-color: #d7d7d7;
	border: 1px solid #c4c4c4;
	margin-right: 10px;
	cursor: pointer;
}

.full .home-page #featured-project .project-nav #prev-btn:hover,
.full .home-page #featured-project .project-nav #next-btn:hover {
	color: #f26522;
	border-color: #f26522;
}

.full .home-page #about-maspeth {
	width: 530px;
	float: left;
	height: 110px
}

.full .home-page #about-maspeth h3 {
	color: #f26522;
	font-size: 18px;
}

.full .home-page #about-maspeth p {
	font-weight: bold;
	line-height: 20px;
	margin: 0;
	font-size: 13px;
}

.full .home-page #quotebox {
	width: 339px;
	float: right;
	height: 110px;
}

.full .home-page #quotebox em {
	color: #f26522;
	font-style: normal;
}

.full .home-page #quotebox p {
	font-size: 18px;
	font-weight: bold;
	margin: 0;
}

.full .home-page #quotebox cite {
	font-weight: bold;
	text-align: right;
	display: block;
	font-style: normal;
}

.full .home-page #products {
	margin-top: 10px;
	clear: both;
}

/* OTHER
   ----- */
.full #body ul#tradeorgs {
	margin: 0;
}

.full #body ul#tradeorgs li {
	float: left;
	margin: 0 10px 10px 0;
	list-style-image: none;
	list-style-type: none;
}

.details, .more
 {
	font-weight: bold;
}

/* Clearfix Hack */
/* slightly enhanced, universal clearfix hack */
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */