/* -----  [ 

GRAVHAUL TRAILERS 
DEFAULT WEB STYLESHEET
CREATED BY WILLIAM KNELSEN FOR PIXELS DESIGN COMPANY
WWW.PIXELSONLINE.CA
COPYRIGHT 2009, PIXELS DESIGN COMPANY

 ]  ----- */




/* -----  [ UNIVERSAL STYLES ]  ----- */

* {
	margin: 0;
	padding: 0;
}

#clearall {
	clear: both;
	height: 1px;
}

p a {
	color: #000;
}

p a:hover {
	text-decoration: none;
}

p a:visted {
	color: #333;
}


/* -----  [ LAYOUT STYLES ]  ----- */

body {
	background: url(../images/body-bgd.jpg) repeat-x #222;
	text-align: center;
	font-family: "Helvetica Neue", verdana, arial, sans-serif;
	font-size: 62.5%;
}

#wrapper {
	width: 1017px;
	margin: 20px auto;
	background: none;
}

#header {
	text-align: center;
}

#header img {
	margin-bottom: 15px;
}


/* -----  [ MAIN NAVIGATION STYLES ]  ----- */

#main-navigation {
	background: url(../images/navigation-bgd.png) no-repeat;
	height: 71px;
	padding-left: 10px;
}

#main-navigation ul {
	list-style: none;
}

#main-navigation ul li {
	display: inline;
}

#main-navigation ul li a {
	font-size: 1.8em;
	color: #555;
	text-transform: uppercase;
	line-height: 71px;
	height: 71px;
	text-decoration: none;
	padding: 0 50px;
	border-left: 1px solid #C9C9C9;
	border-right: 1px solid #E8E8E8;
	display: block;
	float: left;
}

#main-navigation ul li a:hover {
	color: #000;
}

#main-navigation ul li#indexLink a {
	border-left: none;
}

#main-navigation ul li#contactusLink a {
	border-right: none;
}


/* -----  [ CONTENT TOP STYLES ]  ----- */

#content-top {
	background: #fff;
	margin-bottom: 15px;
	padding: 15px;
}

#content {
	margin: 15px 0;
	text-align: left;
	padding-top: 15px;
}

#content p {
	font-size: 1.5em;
	line-height: 1.5;
}

#welcome {
	width: 540px;
	padding-left: 10px;
	float: left;
}

#welcome h1 {
	font-size: 2em;
	margin-top: 7px;
	margin-bottom: 4px;
}

#welcome h1 a {
	color: #000;
	text-decoration: none;
}

#events {
	width: 164px;
	float: right;
	padding-right: 20px;
}

#news {
	width: 164px;
	margin-left: 585px;
	border-right: 1px solid #555;
	padding-right: 30px;
}

#events p, #news p {
	font-size: 1.2em;
	margin-bottom: 5px;
}

#events h2, #news h2 {
	font-size: 1.4em;
}

#events h2 a, #news h2 a {
	color: #555;
	text-decoration: none;
	/*background: url(../images/button-rightarrow.png) no-repeat right;*/
	width: 174px;
	display: block;
	height: 32px;
	line-height: 32px;
	font-size: 1.8em;
	font-weight: normal;
	margin-bottom: 10px;
}

/*#events h2 a:hover, #news h2 a:hover {
	background: url(../images/button-rightarrow-hover.png) no-repeat right;
}*/


/* -----  [ CONTENT BOTTOM STYLES ]  ----- */

#content-bottom {
	background: #fff;
}

#content-bottom img {
	border: none;
}


/* -----  [ CONTENT NAVIGATION STYLES ]  ----- */

#content-navigation {
	width: 225px;
	float: left;
	text-align: right;
	padding-bottom: 15px;
}

#content-navigation h2 {
	font-size: 1.8em;
	padding: 15px 20px 10px 0;
}

#content-navigation img {
	padding: 15px 20px 5px 0;
}

#content-navigation ul {
	list-style: none;
	border-top: 1px solid #555;
	padding-top: 10px;
	padding-right: 15px;
	background: url(../images/content-navigation-bgd.jpg) repeat-x top;
	height: 160px;
}

#content-navigation ul li {
	background: url(../images/content-navigation-arrow.png) no-repeat right;
}

#content-navigation ul li:hover {
	background: url(../images/content-navigation-arrow-current.png) no-repeat right;
}

#content-navigation ul li a {
	display: block;
	height: 24px;
	line-height: 24px;
	color: #000;
	font-size: 1.5em !important;
	padding-right: 15px;
	text-decoration: none;
}


/* -----  [ MAIN CONTENT STYLES ]  ----- */

#content-main {
	padding: 20px;
	margin-left: 225px;
	border-left: 1px solid #555;
}

body#dealersPage.index #content-main,
body#contactPage #content-main {
	margin-left: 0;
	border-left: none;
}

#content-main a {
	color: #555;
}

#content-main a:hover {
	color: #000;
	text-decoration: none;
}

#content-main h2 {
	font-size: 2.5em;
	margin-bottom: 10px;
}

#content-main h3 {
	font-size: 2em;
	margin-bottom: 10px;
	color: #333;
}

#content-main h4 {
	font-size:1.5em;
	margin-top:10px;
}

#content-main p {
	font-size: 1.3em;
	margin-bottom: 10px;
}

#content-main ul {
	font-size: 1.3em;
	margin-left: 30px;
	margin-bottom: 15px;
	line-height: 1.5;
}

#content-main .trailer-box {
	width: 290px;
	float: left;
	text-align: center;
	margin: 15px;
	padding: 10px;
}

#content-main .trailer-box img {
	border: none;
}

.trailer-specs-left {
	width: 340px;
	float: left;
}

.trailer-specs-right {
	margin-left: 350px;
}

#content-main .trailer-specs {
	border: 1px solid #000;
	margin-bottom: 15px;
	width: 330px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#content-main .trailer-specs p {
	padding: 4px 10px;
	background: #333;
	-moz-border-radius-topleft: 7px;
	-webkit-border-radius-topright: 7px;
	-moz-border-radius-topright: 7px;
	-webkit-border-radius-topleft: 7px;
	color: #fff;
	margin-bottom: 0;
	font-size: 1.4em;
}

#content-main .trailer-specs ul {
	list-style: none;
	margin-left: 0;
	margin-bottom: 5px;
	margin-top: 5px;
}

#content-main .trailer-specs ul li {
	padding: 5px 20px;
	font-size: 110%;
}

#content-main .trailer-specs ul li:hover {
	background: #333;
	color: #fff;
}

#contactForm {
	width:520px;
	float:left;
}

#contactForm div, form div {
	height:40px;
	line-height:40px;
}

form .label {
	width:190px;
	float:left;
	font-size:1.3em;
}

.fText {
	padding:5px;
}

.fText, .fTextarea {
	width:250px;
	border: 1px solid #000;
	background: #999;
	padding:5px;
}

.fText:focus, .fTextarea:focus {
	background: #eee;
}

.fTextarea {
	height: 60px;
}

body#cmsPage .fTextarea {
	height: 110px;
	width: 350px;
}

/* -----  [ DEALER CONTENT STYLES ]  ----- */

.dealer-list {
	width: 300px;
	float: left;
}

table#dealer-order-status,
table#update-order-table,
table#add-order-table {
	border-collapse: collapse;
	border: 2px solid #555;
	width: 750px;
	font-size: 1.3em;
}

table#dealer-order-status thead,
table#update-order-table thead,
table#add-order-table thead {
	background: #c7c7c7;
}

table#dealer-order-status thead th,
table#update-order-table thead th,
table#add-order-table thead th {
	padding: 4px;
	border: 1px solid #555;
}

table#dealer-order-status tbody td,
table#update-order-table tbody td,
table#add-order-table tbody td {
	padding: 4px;
	border: 1px solid #a3a3a3;
}

td.order-description-label {
	border-bottom: none !important;
}

td.order-description {
	border-top: none !important;
}

table#dealer-order-status tbody tr.odd {
	background: #d5d5d5;
}

#login-form div, 
#add-order-form div, 
#add-dealer-form div,
#order-search-form div {
	height: 40px;
	line-height: 40px;
}

#login-form .label, 
#add-order-form .label, 
#add-dealer-form .label,
#order-search-form .label {
	width: 140px;
	float: left;
	text-align: left;
	border: none;
	font-size: 1.4em;
}

#login-form .fText, 
form .fTextArea, 
#add-order-form .fText, 
#add-dealer-form .fText,
#order-search-form .fText {
	width: 250px;
	border: 1px solid #000;
	background: #ccc;
	color: #000;
	padding: 4px;
}

table#update-order-table .fTextArea,
table#add-order-table .fTextArea {
	border: none;
	background: none;
	width: 95%;
	color: #333;
}

table#update-order-table .fText,
table#add-order-table .fText {
	border: none;
	background: none;
	width: 95%;
	color: #333;
}

#login-form .fText:focus,
#add-order-form .fText:focus,
#add-dealer-form .fText:focus,
#order-search-form .fText:focus {
	background: #999;
}

table#update-order-table .fText:focus,
table#update-order-table .fTextArea:focus,
table#add-order-table .fText:focus,
table#add-order-table .fTextArea:focus {
	background: #ccc;
}

ul#dealer-forms {
	list-style: none;
}

ul#dealer-forms li {
	display:inline;
}

ul#dealer-forms li a {
	text-decoration:none;
	display: block;
	float: left;
	width: 200px;
	border: 1px solid #000;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	height: 20px;
	line-height: 20px;
	padding-left: 5px;
	margin:5px;
}

ul#dealer-forms li a:hover {
	background:#dedede;
}

ul#dealer-forms li a:visited {
	color:#000;
}

/* -----  [ FOOTER STYLES ]  ----- */

#footer {
	background: url(../images/footer-bgd.jpg) no-repeat;
	height: 54px;
	font-size: 1.4em;
	line-height: 54px;
	color: #555;
}

#footer a {
	color: #555;
}

#footer a:hover {
	color: #000;
}

#footer-links {
	float: left;
	text-align: left;
	padding-left: 20px;
}

#footer-links ul {
	list-style: none;
}

#footer-links ul li {
	display: inline;
}

#footer-links ul li a {
	padding: 0 10px;
}

#footer-meta {
	text-align: right;
	padding-right: 30px;
	color: #555;
}