/*
Theme Name: Granite Express	
Theme URI: http://www.granitexpress.com/
Description: Custom Wordpress Theme for Granite Express.
Version: 1.0
Author: Skyhook Internet Marketing
URI: http://www.skyhookinternetmarketing.com/

*/

/* global and wp classes */
/* see wp.css */

/* General Styles
-----------------------------------------*/
body {
	background: #050505 url(images/content-bg2.jpg) repeat-y center center;
	color: #FFFFFF;
	font-size: 11px;
	font-family:  Tahoma, Geneva, Sans-Serif;
	line-height: 18px;
	text-align: left;
}

h1, h2, h3 { }

h1 { }	
h2 { }
h3 { }	
h4 { font-size: 18px; color: #FFFFFF; }
h5 { font-size: 14px; font-weight: bold; line-height: 18px; color: #FFFFFF; }
h5.regular-title{ font-weight: normal; margin-bottom: 20px; text-transform: uppercase;  }

a { color: #7d0d01; cursor: pointer; outline: none; text-decoration: none; }
a:hover { text-decoration: underline; }

img { border:none; outline: none; }
p { }

table { border-collapse:collapse; }
input {	}
textarea { }
select { }

.line{
	margin:10px 0;
	padding:0 40px;
}
.black,
.grey{ display: block; }
.black{ border-bottom: 2px solid #000000; }
.grey{ border-top: 2px solid #1d1d1d; }	

ul{ list-style-type: none; }
ul li{ list-style-type: none; }
	
/* Structure 
-----------------------------------------*/
#wrapper {
	width:960px; /* set page width here */
	margin: 0 auto; /* centering page */
	text-align: left;
}

/* Header
-----------------------------------------*/
#header { padding: 15px 0px;  text-transform: uppercase; }

/* -- Badge --*/
#badge{ float: left; position: relative; width: 85px; }
#badge img{}

/* -- Main Header Piece --*/
#header-main{ float: right; position: relative; width: 875px; }
#header-main h1{ float: left; margin-bottom: 10px; width: 295px; }
#header-main h1 a{}
#header-main h1 a img{}

/* -- Nav -- */
ul#small-nav{ color: #808080; float: right; margin-top: 10px;  position: relative; width: auto; }
ul#small-nav li{ float: left; }
ul#small-nav li a{ color: #808080;  }
ul#small-nav li a:hover{ color: #7d0d01; }

ul#nav{ float: left; position: relative; width: 880px; }
ul#nav li{ float: left; position: relative; }
ul#nav li a{
	background-color: #808080;
	color: #FFFFFF;
	float:left;
	font-weight:bold;
	margin-right:10px;
	padding:3px 0px;
	text-align:center;
	width:117px;
}
ul#nav li a.last{ margin-right: 0px; }
ul#nav li a.current{ background-color: #444444; }
ul#nav li a:hover{ background-color: #7d0d01; text-decoration: none; }

/* -- Sub Nav --*/
ul#nav li ul#sub-nav{
	background-color:transparent;
	display:none;
	float:left;
	left:0;
	padding-top:5px;
	position:absolute;
	top:100%;
	width:145px;
	z-index: 100;
}
ul#nav li ul#sub-nav li{ float: none; position: relative; }
ul#nav li ul#sub-nav li a{ 
	background-color: #808080;
	display:block;
	float:none;
	font-weight:normal;
	margin-right:0;
	line-height: 15px;
	padding:3px 8px;
	text-align:left;
	width:129px;
}
ul#nav li ul#sub-nav li a.current{ background-color: #444444; }
ul#nav li ul#sub-nav li a:hover{ background-color: #7d0d01; }
ul#nav li#products:hover > ul#sub-nav{ display: block; }


/* Content 
-----------------------------------------*/
#content { float: left; height: auto; margin-bottom: 40px; width: 100%; }
#content h2.main-title{
	font-size:22px;
	margin-bottom: 10px; 
	text-transform:uppercase;
	width: 100%;
}

/*-- Default Page Layout --*/
#content .post{
	float: left;
	position: relative;
	width: 560px;
}
#content #main-content,
#content #sub-content{
	background-color: #111111;
	float:left;
	font-size:13px;
	min-height:300px;
	padding:9px 20px;
	width: 100%;
}

#content #main-content h2{ font-size: 20px; }
#content #main-content h3{ font-size: 18px; margin: 15px 0px;}
#content #main-content p{ margin: 10px 0px; }

#content #main-content table{}
#content #main-content table td{ padding: 10px 40px 10px 0; vertical-align: top; }
#content #main-content table.sub-table td{ padding: 0px; width: 300px; }
#content #main-content table.sub-table td ul{ padding: 0px; margin: 0px; margin-left: 20px;  }
#content #main-content table.sub-table td ul li ul li{ list-style-type: circle; }
#content #main-content table td.column1{ font-weight: bold; }

#content #main-content ul{ margin-top: 10px; margin-left: 30px; }
#content #main-content ul li{ margin: 3px 0px; }
#content #main-content ul li a{ text-decoration: underline; }

#content #sub-content{ margin: 20px 0px; min-height: 100px; position: relative; }

/*-- Home Page --*/
#content .post.home{ margin: 0 auto; float: none; width: 700px; } /* Home Page Only */

/*-- Charts & Reports Page --*/
#content .post.charts-reports{ background-color: transparent; padding: 9px 0px; width: 100%; }
#content .post.charts-reports{ width: 100%; }
#content .post.charts-reports table td{ padding: 0 16px 20px 0; }
#content .post.charts-reports table td.right{ padding-right: 0px; }
#content .post.charts-reports table td .leed{ 
	background: url(images/leed-bg.jpg) no-repeat center center transparent;
	height:204px;
	position: relative;
	width: auto;
}
#content .post.charts-reports table td .leed h2{ 
	font-size: 16px; 
	margin-top: 10px;
	margin-bottom: 5px; 
	text-transform: uppercase; 
}
#content .post.charts-reports table td .leed p{
	color:#333333;
	font-size:12px;
	line-height:18px;
	margin-left:90px;
	position: absolute;
	top:75px;
	width:352px;
}

#content .post.charts-reports #lower-content{ 
	background-color:#111111;
	margin:0 auto;
	min-height:200px;
	padding:10px 40px;
	width:600px;
}
#content .post.charts-reports #lower-content h2.sub-title{ margin: 10px 0px; }
#content .post.charts-reports #lower-content table td{ padding:0 50px 10px 25px; }
#content .post.charts-reports #lower-content table td.first{ padding-left:0; padding-right:260px;}


/*-- Products Page --*/
#content .post.products{ min-height: 500px; width: 100%; }

/*-- Individual Products Page --*/
#content .post.products div.long-image{ margin-bottom: 25px; }
#content .post.products ul.sub-product-list{ float: left; }
#content .post.products ul.sub-product-list li{ float: left; position: relative;}
#content .post.products ul.sub-product-list li a{ float: left; padding: 0px 15px 15px 0px; position: relative; }
#content .post.products ul.sub-product-list li a.right-column{ padding-right: 0px; }
#content .post.products ul.sub-product-list li a img{}
#content .post.products ul.sub-product-list li a span.see-more{ 
	background-color:#000000;
	color:#FFFFFF;
	display:none;
	margin-top:0;
	padding:10px 0;
	position:absolute;
	text-align:center;
	text-transform:uppercase;
	top:0px;
	opacity:0.75;
	filter:alpha(opacity=75);
	width:472px; 
	text-decoration: none;
}
#content .post.products ul.sub-product-list li a:hover{ text-decoration: none; }
#content .post.products ul.sub-product-list li a:hover > span.see-more{ display: block; text-decoration: none; }

/*-- Decorative Rock Page --*/
ul#decorative-rock-products{ float: left; }
ul#decorative-rock-products li{ float: left; position: relative;}
ul#decorative-rock-products li a{
	float:left;
	position: relative;
	padding-bottom:15px;
	padding-right:14px;
}
ul#decorative-rock-products li a.right-column{ padding-right: 0px; }
ul#decorative-rock-products li a img{}

/* -- Specialty Products --*/
ul#specialty-products{ float: left; }
ul#specialty-products li{ float: left; position: relative;}
ul#specialty-products li a{
	float:left;
	position: relative;
	padding-bottom:15px;
	padding-right:14px;
}
ul#specialty-products li a.right-column{ padding-right: 0px; }
ul#specialty-products li a img{}
ul#specialty-products li a span.see-more{ 
	background-color:#000000;
	color:#FFFFFF;
	display:none;
	margin-top:0;
	padding:10px 0;
	position:absolute;
	text-align:center;
	text-transform:uppercase;
	top:0px;
	opacity:0.75;
	filter:alpha(opacity=75);
	width:473px; 
	text-decoration: none;
}
ul#specialty-products li a:hover{ text-decoration: none; }
ul#specialty-products li a:hover > span.see-more{ display: block; text-decoration: none; }
/*-- Tek Products --*/
ul#tek-products{ float: left; }
ul#tek-products li{ float: left; position: relative;}
ul#tek-products li a{
	float:left;
	position: relative;
	padding-bottom:15px;
	padding-right:14px;
}
ul#tek-products li a.right-column{ padding-right: 0px; }
ul#tek-products li a span.see-more{ 
	background-color:#000000;
	color:#FFFFFF;
	display:none;
	margin-top:0;
	padding:10px 0;
	position:absolute;
	text-align:center;
	text-transform:uppercase;
	top:0px;
	opacity:0.75;
	filter:alpha(opacity=75);
	width:473px; 
	text-decoration: none;
}
ul#tek-products li a:hover{ text-decoration: none; }
ul#tek-products li a:hover > span.see-more{ display: block; text-decoration: none; }

/*-- Maps Page --*/
#content .post.maps{ }
#content .post.maps #main-content{ 
	background:none repeat scroll 0 0 transparent;
	margin: 0px; 
	padding: 0px;
	width:528px;
}

/*-- Operations Page --*/
#content .post.operations{
	width: 100%;
}
#content .post.operations table{}
#content .post.operations table td{ padding: 0px 35px; vertical-align: top; }
#content .post.operations table td #video{ margin-bottom: 20px; }
#content .post.operations table td #small-content{ background-color: #111111; min-height: 200px; padding: 5px 0px;  }
#content .post.operations table td #small-content p{ font-size: 12px; padding: 10px; }
#content .post.operations table td #small-content p a{ text-transform: uppercase; text-decoration: underline; }
#content .post.operations table td #see-the-trucks{ margin-bottom: 20px; }
#content .post.operations table td #crushing-equipment{}

#content .post.trucks{ width: 100%; }
#content .post.trucks #types{ float: left; width: 700px; }
#content .post.trucks #types .truck-item{ float: left; margin-bottom: 20px;  }
#content .post.trucks #types .truck-item img{ float: left; width: 293px; }
#content .post.trucks #types .truck-item .truck-info{ background-color: #111111; height: 196px; float: right; width: 395px;  }
#content .post.trucks #types .truck-item .truck-info table{ margin: 40px 0px 0px 25px; }
#content .post.trucks #types .truck-item .truck-info table td{ padding: 10px 15px; }
#content .post.trucks #types .truck-item .truck-info table td.bold{ font-weight: bold; text-transform: uppercase;}
#content .post.trucks #specialty-trucks{ float: right; width: 235px;}
#content .post.trucks #specialty-trucks img{ margin-bottom: 20px; }

#content .post.crushing-equipment{ width: 100%; }

/*-- Contact Page Layout --*/
#content .post.large{ width: 425px; }
#content #main-content.contact{ min-height: 150px; }
#content #main-content.contact h4{ margin-left: 60px; margin-top: 10px;  }
#content #main-content.contact p{ margin-bottom: 20px; margin-left: 60px; font-size: 16px; }

#content #sub-content p.title{ text-align: center; }
#content #sub-content table#member-information{ width: 94%; }
#content #sub-content table td{ padding-left: 20px; position: relative; vertical-align: top; }
#content #sub-content table td table{}
#content #sub-content table td table td{}
#content #sub-content table td a.hover{ text-decoration: underline; }
#content #sub-content table td .contact-info{
	background:url("images/hover-bg.png") no-repeat scroll center center transparent;
	display:none;
	height:95px;
	left:-205px;
	position:absolute;
	width:270px;
	top: 20px;
	z-index: 100;
}
#content #sub-content table td .contact-info.left{ 
	background: url("images/hover-bg-left.png") no-repeat center center transparent; 
	position: absolute; 
}
#content #sub-content table td:hover > .contact-info{ display: block;  }

#content #sub-content table td #Summer.contact-info{ top: 12px; left: 217px;  }
#content #sub-content table td #Paul.contact-info{ top: 30px; left: 187px;  }
#content #sub-content table td #Bobbi.contact-info{ top: 49px; left: 217px;  }
#content #sub-content table td #Kelly.contact-info{ top: 16px; left: -2px; }
#content #sub-content table td #Haley.contact-info{ top: 34px; left: -2px;  }
#content #sub-content table td #Ashley.contact-info{ top: 52px; left: -5px;  }

#content #sub-content table td .contact-info img.profile-photo{ float: left; margin: 15px 10px 0px 10px; }
#content #sub-content table td .contact-info.left img.profile-photo{ margin: 15px 10px 0 27px; }
#content #sub-content table td .contact-info .info{ float: right; margin-top: 15px; width: 190px; }
#content #sub-content table td .contact-info .info{ width: 170px; }
#content #sub-content table td .contact-info .info h3{ 
	color: #111111; 
	font-family: Tahoma; 
	font-weight: bold; 
	font-size: 20px; 
	margin-bottom: 5px; 
}
#content #sub-content table td .contact-info .info span{ display: block; color: #111111; font-size: 13px; }




/* Sidebar
-----------------------------------------*/
#sidebar { 
	float: right; 
	font-size: 13px; 
	position: relative; 
	width: 320px; 
}

#sidebar .box{ 
	background-color:#111111;
	margin:25px 0;
	min-height:200px;
	padding: 10px 5px;
	position: relative;
	width:100%;
	text-align: center;
}

.box table#member-information{ margin: 0 auto; width: auto; }
.box table#member-information td{ position: relative; padding:3px 20px; text-align:left; z-index: 1; }
.box table#member-information td a{ text-decoration: underline; }

.box table#member-information td .contact-info{
	background:url("images/hover-bg.png") no-repeat scroll center center transparent;
	display:none;
	height:95px;
	left:-205px;
	position:absolute;
	width:270px;
	top: 20px; 
	z-index: 2;
}
.box table#member-information td #Summer.contact-info{ top:21px; left: -205px;  }
.box table#member-information td #Paul.contact-info{ top: 45px; left: -205px;  }
.box table#member-information td #Bobbi.contact-info{ top: 68px; left: -205px;  }
.box table#member-information td #Kelly.contact-info{ top: 92px; left: -205px;  }
.box table#member-information td #Haley.contact-info{ top: 116px; left: -205px; }
.box table#member-information td #Ashley.contact-info{ top: 139px; left: -205px; }
.box table#member-information td:hover > .contact-info{ display: block; }

.box table#member-information td .contact-info img.profile-photo{ float: left; margin: 15px 10px 0px 10px; }
.box table#member-information td .contact-info .info{ float: right; margin-top: 15px; width: 190px; }
.box table#member-information td .contact-info .info h3{ 
	color: #111111; 
	font-family: Tahoma; 
	font-weight: bold; 
	font-size: 20px; 
	margin-bottom: 5px; 
}
.box table#member-information td .contact-info .info span{ display: block; color: #111111; font-size: 13px; }
.box table#member-information td .contact-info .info span.email{}
.box table#member-information td .contact-info .info span.phone{}

/* Sidebar - Maps */
#sidebar.right.maps-sidebar{ width: 400px; }
#sidebar.right.maps-sidebar table{}
#sidebar.right.maps-sidebar table td{ padding-bottom: 10px; }
#sidebar.right.maps-sidebar table td h5{ margin-bottom: 6px; text-transform: uppercase; }
#sidebar.right.maps-sidebar table td a{ float: left; }
#sidebar.right.maps-sidebar table td img{}
/* Sidebar - Contact */
#sidebar.right.large{ width: 480px; }

/* Footer 
-----------------------------------------*/
#footer { background-color: #111111; float: left; padding: 15px 20px; text-transform: uppercase; width: 920px; }

#footer-left{ float: left; position: relative; }
#footer-left #address{ font-weight: bold; margin-bottom: 10px; }
#footer-left #copyright{ color: #808080; }
#footer-left #copyright a{ color: #808080; }
#footer-left #copyright a:hover{ color: #7d0d01; text-decoration: underline; }


#footer-right{ float: right; position: relative; text-align: right; }
#footer-right a#small-logo{ display: block; margin-bottom: 8px; }
#footer-right a#small-logo img{}
#footer-right #credit{color: #808080; }
#footer-right #credit a{ color: #808080; }
#footer-right #credit a:hover{ color: #7d0d01; text-decoration: underline; }