/* ------------------------------------------------------------------
	MAIN STYLESHEET
	
	Project: Walco Ltd.
	Created: 2010-03-02
	Created by: RKD Web Studios info@rkd.ca
	
------------------------------------------------------------------- */

@import url("reset.css");
@import url("fancybox.css");

* {
	padding: 0;
	margin: 0;
}
/* keeps vertical scroll bar in firefox at all times so page doesn't jump around */
html {
	overflow-y: scroll;
	height: 100%;
	background-color:#d2e3f3;
}

/* background colour should be same as content area background colour to ensure WYSIWYG looks same as website */
body {
	background: #fff;
	font-size: 62.5%; /* from 16px browser default to useable 10px */
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	font-size:13px;
	/*height: 100%;*/
}
/* use this class to set body background colour so that it does not interfere with the WYSIWYG editor */
.bodystyle {
	color: #000;
	background:url(../../images/sitebg.jpg) top left repeat-x #ffffff;
}

/* clears all floats; apply to empty divs if needed. */
.clear {clear: both;}

:focus { outline: none; } /* removes dotted outline from links */

/*==Sicky Footer
=========================*/

.stickyfoot {
 min-height: 100%;
 height: auto !important;
 height: 100%;
 margin: 0 auto -128px;
}

.push {height:128px;}

/* ====================
GLOBAL STYLES - style as necessary
======================= */

p {
	font-size: 13px; /*14px*/
	line-height: 19px; /*18px*/
	margin: 2px 0 14px 0;
}
a:link {
	color: #0076a3;
	text-decoration:none;
}
a:visited {
	color: #767693;
	text-decoration:none;
}
.searchform a:visited 
{
    color: #0076a3;
}
a:hover {
	color: #0076a3;
	text-decoration:underline;
}
a:active {
	color: #d73347;
	text-decoration: none;
}
a[href$=".pdf"] {
    background:url("../../images/pdf-external-icon.png") no-repeat scroll right center transparent;
    display:inline-block;
    padding-right:40px;
}
strong {
	font-weight: bold;
}


em, i {
	font-style: italic;
}

h1 {
	font-size: 22px;
	color: #0076a3;
	margin: 10px 0 10px 0;
	font-weight: bold;
	border-bottom: 1px solid #0076a3;
	padding-bottom:5px;
}

h2 {
	font-size: 16px;
	color: #d73347;
	font-weight:bold;
}

h3 {
	font-size: 13px;
	font-weight: bold;
	color: #d73347;
	margin: 13px 0 7px 0;
}
h4 {
	font-size: 15px;
	color: #000;
}

h5 {
	font-size: 16px;
	color: #ab906e;
	margin-top:20px;
}
h6 {
	font-size: 12px;
}

.clear {clear:both;}

.floatleft {float:left;}
.floatright 
{
    float:right;
    padding-left:15px;
}


	
/*===Structure
===========================*/

.wrap {
	margin: 0 auto;
	width: 968px;
	padding: 13px 0 0 0;
}

.divider {background:url(../../images/line_divider.png) center left repeat-x;
height: 5px; margin:0 14px 0 15px;}

/*===Header
===========================*/

#head {
	background:url(../../images/headbg.png) top left no-repeat;
	height: 135px;
	margin: 0 auto;
}

#head .logo {
	float: left;
	position: relative;
	top: 25px;
	left: 23px;
}

#head .telnumbers {float:right; font-size:11px; margin: -8px 25px 0 0; color:#666;}
#head .telnumbers a {text-decoration:underline;}
#head .telnumbers a:hover {text-decoration:none;}


/*===Main Menu Navigation
===========================*/

.navigation {float: right; position:relative; top:71px; right:15px;}

.navigation ul{}

.navigation li {float: left; text-indent:-9999px;}

.navigation li a {height:48px; display:block; background-image:url(../../images/homepage_menu_03.png); background-repeat:no-repeat;}

.navigation li#home a {width: 77px; background-position:0 0; display:block;}
.navigation li#home a:hover {width: 77px; background-position:0 -50px;}

.navigation li#productcat a {width: 231px; background-position:-77px 0; display:block;}
.navigation li#productcat a:hover {width: 231px; background-position:-77px -50px;}

.navigation li#finddealer a {width: 176px; background-position:-308px 0; display:block;}
.navigation li#finddealer a:hover {width: 176px; background-position:-308px -50px;}

.navigation li#aboutus a {width: 103px; background-position:-484px 0; display:block;}
.navigation li#aboutus a:hover {width: 103px; background-position:-484px -50px;}

.navigation li#contact a {width: 101px; background-position:-588px 0; display:block;}
.navigation li#contact a:hover {width: 101px; background-position:-588px -50px;}


/*===Content Area
===========================*/

#content {
	background:url(../../images/contentbg.png) top left no-repeat;
	min-height:400px;
}

/*===Splash Area
===========================*/

#content .splash {
	background:url(../../images/splash_bg.png) top left repeat-x;
	height:294px;
	margin: 0 14px 0 14px;
}

#content .splashtext {
	float: left;
	position:relative;
	width: 480px;
	top: 40px;
	left: 30px;
}

.btn a:hover {
	/*-moz-opacity:0.7;
	opacity:0.7;
	filter:alpha(opacity = 70);*/
}

#content .splashtext p {font-size:14px; line-height:19px;}

#content .splashimage {
	float:right;
	position:relative;
	right: 25px;
	top: 10px;
	display:block;
}

/*===Homepage Content Area
===========================*/

.splashselectors {
	clear:both;
	width: 700px;
	height: 50px;
	margin:0 0 0 16px;
	float: left;
}
#frontpagewrapper 
{
    margin:0 15px 0 0 ;
}

.arrowbtn {float: right; position:relative; top:7px; left:12px;}

.agselect { display:inline; }

.agselect a {
	width: 320px;
	border: 1px solid #c9c9c9;
	float: left;
	display:block;
	margin: 10px 8px 7px 0px;
	padding: 10px;
	color: #000;
}

.agselect a:link {color:#000;}

.agselect a:hover {text-decoration:none; background:url(../../images/splash_bg.png); border: 1px solid #d73347;}

.agselect p, .industrialselect p {font-size:11px; line-height:14px; margin:3px 0 0 0;} 
.agselect img, .industrialselect img  {margin:0 10px 0 0;}
.agselect h3 {margin:0px;}


.cargoselect, .tireselect {
	width: 320px;
	/*height: 95px;*/
	border: 1px solid #c9c9c9;
	float: left;
	display:block;
	margin: 10px 0 7px 10px;
	padding: 10px;
	background: url(../../images/splash_bg.png) bottom center no-repeat;
}

/*===Subpage Content Area
===========================*/

.breadcrumbs {background:#dddddd; display:block; padding: 5px; font-size: 11px;}

#contentcontainer 
{
    margin:0 14px;
}

#subcol1 {
	float: left;
	width: 220px;
	margin-left: 0px;
}

#subcol2 {
	float: right;
	width: 700px;
	margin-left: 0px;
	line-height:1.3;
}

#subcol2 ul {
	margin:0 0 19px 0;	
}

#subcol2 ul li {
	background-image:url(../../images/ul_bullet.gif);
	background-repeat:no-repeat;
	background-position:0 3px;
	padding:0 0 0 15px;
	margin:0 0 8px 0;
}

#subcol2 ol {
	margin:12px 0 19px 0;	
}

#subcol2 ol li {
	padding:3px 0 3px 0;
}

.regiondrop {
	width:189px;
	border-top: 1px solid #999;
	border-right: 1px solid #999;
	border-left: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
}

.productlist li {line-height:19px;}
.detailimage img {border: 1px solid #d6d6d6; padding:3px;}
.detailimage p {font-weight:bold; color:#d73347; padding:0; margin:0;}
.detailimage {margin:0 0 20px 0;}

.pdflisting li {line-height:18px;}

.address {
	float:left;
	width:270px;
	}
.map {
	float:right;
	width:430px;
	}
.clear {
	clear:both;
	}
.givespace {
	height:75px;
	}


/*===Search Area
===========================*/
.searcharea 
{   width:220px; 
    height:200px; 
    float: right; 
    margin:10px 0 0 0;
    }

.searchform {
	background: #fff;
	border: 1px solid #c9c9c9;
	padding: 3px;
	margin: 0 0 15px 0;
}

.searchform fieldset {
	width: 100%;
	margin: 0;
	clear: both;
	background: #ededed;
	font-weight:bold;
	line-height: 22px;
	padding: 0 0 10px 0;
}

.searchform fieldset ol {padding:5px 13px 0 13px;}

.searchform input {
	padding: 1px 0 1px 0; 
	width:187px;
	border-top: 1px solid #999;
	border-right: 1px solid #999;
	border-left: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
}

.searchform img {padding: 7px 0 0 0;}


/*===Footer
===========================*/

#footerbg {
	background:url(../../images/footerbg.jpg) bottom left repeat-x;
height:128px;
padding-top:12px;
}

#footerbg .wrap {
	width: 968px;
	background:url(../../images/footercontentbg.png) bottom left no-repeat;
	height: 109px;
	margin:0 auto ;
}

#footerbg .worktogether {
	float: left;
	top: 20px;
	left: 23px;
	position: relative;
}

#footerbg .gotop {
float: right;
position:relative;
top: 18px;
right: 20px;
}

#footerbg .footerlinks {
	float: left;
	top: 65px;
	left: -322px;
	position: relative;
	font-size:12px;
	color:#a4a4a4;
}

#footerbg .footerlinks a {text-decoration:none; color:#a4a4a4;}
#footerbg .footerlinks a:hover {text-decoration:underline; color:#a4a4a4;}

/*===Region Selector
===========================*/

.region {
	padding: 7px;
}

.region h2 {margin:0 0 10px 0;}


/*===Find a Dealer Form
===========================*/
.dealerform {
	padding: 3px;
	margin: 0 0 15px 0;
}

.dealerform fieldset {
	width: 100%;
	margin: 0;
	clear: both;
	font-weight:bold;
	line-height: 22px;
	padding: 0 0 10px 0;
}

.dealerform fieldset ol {padding:5px 13px 0 13px;}

.dealerform input {
	padding: 1px 0 1px 0; 
	width:354px;
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
}

.dealerform select {
	padding: 1px 0 1px 0; 
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
}

.dealerform textarea {
	padding: 1px 0 1px 0; 
	width:354px;
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
}

.dealerform img {padding: 7px 0 0 0;}

small 
{
    font-size:small;
    font-weight:normal;
}

/* Hack for Admin FCKEditor Lists */

#xEditingArea ul {padding:5px 20px 5px 20px;list-style:default;}
