/* ------------------------------------------------------------------
	MAIN STYLESHEET
	
	Project: CP Industries
	Created: June 19, 2009
	Created by: Gianni @ RKD Web Studios --- gianni@rkd.ca
	
------------------------------------------------------------------- */

@import url("reset.css");

html { 
	overflow-y: scroll; /* keeps vertical scroll bar in firefox at all times so page doesn't jump around */
	height: 100%;
	}

body {
	background: #FFF;  /* background colour should be same as content area background colour to ensure WYSIWYG looks same as website */
	color: #000;
	font-family: Verdana, Geneva, sans-serif;
	}
	
.bodystyle { /* use this class to set body background colour so that it does not interfere with the WYSIWYG editor */
	color: #000;
	margin: 0 auto;
	padding: 0;
	background:url(../../images/mainsite_bg.png) top left repeat-x;
		}

:focus {outline: none; } /* removes dotted outline from links */

.clear {clear: both; } /* clears all floats; apply to empty divs */

img {outline:none;}


/* ---------------------
	GLOBAL STYLES - style as necessary
--------------------- */

a:link { color: #5377a4; text-decoration: underline; }
a:visited { color: #5377a4; text-decoration: underline; }
a:hover { color: #5377a4; text-decoration: none; }
a:active { color: #5377a4; text-decoration: none; }

p { 
	font-size: 13px;
	line-height: 20px;
	margin: 0 0 18px 0;
	}

strong, b {
	font-weight:bold;
	}

em, i {
	font-style: italic;
	}

h1 {
	border-bottom: 1px solid #5377a4;
	width:638px;
	display:block;
	margin: 15px 0 15px 0;
	font-size: 30px;
	}


h2 {
	font-size: 19px;
	color: #ca0903;
	margin: 25px 0 0 0;
	}
	
h3 {
	font-size: 13px;
	color: #5377a4;
	text-transform:uppercase;
}

h3 a {font-weight:bold; text-decoration:underline;}
h3 a:hover {text-decoration:none;}

	
h4 {
	font-size: 14px;
	}
h5 {
	font-size: 13px;
	}
h6 {
	font-size: 12px;
	}

ul {list-style:none; }

li {margin:0; padding:0;}

ol { }

hr {}

.floatright{float:right;}

/*--Search Field --*/

.searchfield {
	border-top: 1px #d9d9d9 solid;
	border-bottom: 1px #d9d9d9 solid;
	border-left: 1px #d9d9d9 solid;	
	margin: 0;
/*	padding: 4px;*/
	font-size: 16px;
}

form {
	margin: 0;
	padding: 0;
	border: none;
}

input {
	margin: 0;
	padding:  5px 5px 3px 5px;
	font-size: 12px;
	border-top: 1px #d9d9d9 solid;
	border-bottom: 1px #d9d9d9 solid;
	border-left: 1px #d9d9d9 solid;
	border-right: 0px;
	width: 455px;
}

.button {
	background: url(../../images/img_searcharrow.gif) center left no-repeat;
	width: 32px;
	height: 25px;
	border: 0;
	cursor:pointer;
	padding-top: 0.3em;
}

/*===================
HEADER
===================*/

#header {
	margin: 0 auto;	
	width: 921px;
	height: 136px;
	background:url(../../images/img_headerbg.jpg) top center no-repeat;
}

	#header .logo {}
	
/*===================
HOMEPAGE - SPLASH
===================*/

#splash {
	background: url(../../images/homepage_bluebg.png) top left repeat-x;
	height: 315px;
}

	#splash .splash-center {
		margin: 0 auto;
		width: 921px;
		padding: 33px 0 0 0;
	}

	#splash .text {
		padding: 25px 0 0 0;
		width: 515px;
	}
	
/*===================
MENU
===================*/

#navigation {}

#navigation ul {float: right; margin-top: 55px;}

#navigation li {float: left;}

#navigation li a {
	height: 30px;
	display: block;
	background-repeat: no-repeat;
	text-indent: -9000px;
	padding: 0;
	margin: 0;
	}

#navigation li#home a {background-image: url(../../images/menu_sprite.png); width: 87px;}
#navigation li#home a:hover {background-position: -0px -38px;}
/*current state*/
#navigation li#homecurrent a {background-image: url(../../images/menu_sprite.png); width: 87px; background-position: -0px -39px;}

#navigation li#aboutus a {background-image: url(../../images/menu_sprite.png); width: 96px; background-position: -90px 0;}
#navigation li#aboutus a:hover {background-position: -90px -38px;}
/*current state*/
#navigation li#aboutuscurrent a {background-image: url(../../images/menu_sprite.png); width: 96px; background-position: -90px -39px;}

#navigation li#divisions a {background-image: url(../../images/menu_sprite.png); width: 110px; background-position: -190px 0;}
#navigation li#divisions a:hover {background-position: -190px -38px;}
/*current state*/
#navigation li#divisionscurrent a {background-image: url(../../images/menu_sprite.png); width: 110px; background-position: -190px -39px;}

#navigation li#msds a {background-image: url(../../images/menu_sprite.png); width: 69px; background-position: -303px 0;}
#navigation li#msds a:hover {background-position: -303px -38px;}
/*current state*/
#navigation li#msdscurrent a {background-image: url(../../images/menu_sprite.png); width: 69px; background-position: -303px -39px;}

#navigation li#contact a {background-image: url(../../images/menu_sprite.png); width: 119px; background-position: -378px 0;}
#navigation li#contact a:hover {background-position: -378px -38px;}
/*cuurent state*/
#navigation li#contactcurrent a {background-image: url(../../images/menu_sprite.png); width: 119px; background-position: -378px -39px;}



	
/*===================
Division Selection
===================*/

#division {
	margin: 0 auto;
	width: 921px;
	clear:both;
	padding: 0;
}

	#division .selections img {
		padding: 0;
		margin: 15px 2px 0 2px;
	}
	
/*================
FOOTER
================*/

#footer {
	clear: both;	
	background:url(../../images/footer_bg.png) top left repeat-x;
	height: 100px;
	margin: 25px 0 0 0;
	color: #5377a4;
}

	#footer .bgimage {
		background:url(../../images/img_footerbg.png) top center no-repeat;
		height: 146px;
		width: 920px;
		margin: 0 auto;
		padding: 9px 0 0 0;
	}
	
	#footer .links {
		color: #5377a4;
		float: right;
		font-size: 13px;
	}
	
/*================
CONTENT AREA SUBPAGES
================*/
#contentarea {
	width: 921px;
	margin: 15px auto;
}

#wrapper {
	float: left;
	width: 100%;
	background:url(../../images/content_bg.gif) top left repeat-y;
	margin-bottom: 15px;
	
}

#content {margin: 0 0 0 283px;}


/*==================
BREADCRUMBS
==================*/

#breadcrumb {
	background: #ededed;
	width: 624px;
	font-size: 10px;
	padding: 7px;
	line-height: 15px;
}

#breadcrumb a {color:#ca0903; text-decoration:underline;}
#breadcrumb a:hover {color:#ca0903; text-decoration:none;}

/*==================
CONTENT
==================*/

.imgfloatright {
	border: 1px solid #d9d9d9;
	padding: 5px;
	background: #fff;
	float: right;
	margin: 0 0 0 15px;
}

.points {
	color: #858585;	
	font-size: 13px;
	line-height: 18px;
}

.points li {
	margin: 0 0 18px 0;
	background: url(../../images/pointform_arrow.gif) left center no-repeat;
	padding: 0 0 0 35px;
	}
	
/* Home Radios */

.radiobtnshome {
	font-size: 10px;
	color: #787878;
	position:relative;
	*top: 5px;
}

.radiobtnshome input {
	width: 20px;
	padding: 0;
	font-size: 10px;
	position:relative;
	top: 5px;
	*top: 0px;
	border: 0;
	outline: none;
}

.radiobtnshome input:focus {outline:none;}

/*==================
PRODUCTLIST
==================*/

#productlist {overflow: hidden;}

#productlist .mcol {overflow: hidden;}

#productlist ul {margin: 25px 0 25px 0;}

#productlist li {
	color: #5377a4;
	font-size: 13px;
	font-weight: bold;

	}
	
#productlist li ul {
	margin: 5px 0 25px 25px;
	line-height: 21px;

}

#productlist li ul li {
	font-weight: normal;
	color: #656565;

}

#productlist li ul li a {color: #656565; text-decoration:underline;}
#productlist li ul li a:hover {text-decoration:none;}

/*==================
SUBCATEGORY LISTINGS
==================*/

#listing {clear: left; margin: 0 0 80px 0;}

#listing .listingimage {
	float: left;
	padding: 5px;
	border: 1px solid #d9d9d9;
	margin: 0 15px 0 0;
	}
	
#listing .listingimageright {
	float: right;
	padding: 5px;
	border: 1px solid #d9d9d9;
	margin: 0 0 0 25px;
	}
	
#listing small {
	font-size: 10px;
	color: #979797;
	line-height: 26px;
}

#listing br {clear: right;}


/*================
LEFT COLUMN
================*/

#leftcol {
	float: left;
	width: 220px;
	margin-left: -905px;
	margin-bottom: 20px;
}

/*Search*/

#leftcol input {
	margin: 0;
	padding:  5px 5px 3px 5px;
	/*height: 15px;*/
	font-size: 12px;
	border-top: 1px #d9d9d9 solid;
	border-bottom: 1px #d9d9d9 solid;
	border-left: 1px #d9d9d9 solid;
	border-right: 0px;
	width: 163px;
}

#leftcol .button {
	background: url(../../images/img_searcharrow.gif) middle left no-repeat;
	width: 32px;
	height: 25px;
	border: 0;
	cursor:pointer;
	padding-top: 0.3em;

}

#leftcol .searcharea {
	background: #ededed;
	border: solid 1px #d9d9d9;
	padding: 6px;
	*padding: 6px 6px 0 6px;
	margin: 0 0 22px 0;
	height: 52px;
}

.radiobtns {
	font-size: 10px;
	color: #787878;
	position:relative;
	*top: 5px;

}
.radiobtns input {
	width: 20px;
	padding: 0;
	font-size: 10px;
	position:relative;
	top: 5px;
	*top: 0px;
	border: 0;
}




#leftcol .radiobtns input {
	width: 20px;
	padding: 0;
	font-size: 10px;
	position:relative;
	top: 5px;
	*top: 0px;
	border: 0;
}

/*Left Menu Category Heading*/
#leftcol .catheading {
	font-size: 13px;
	font-weight: bold;
	margin-bottom: 10px;
	
}

/*Left Menu Selectors*/

#leftcol ul {font-size: 13px; margin:0 0 18px 0; padding:0;}

#leftcol li {
	list-style-image:none;
	padding: 0;
	margin: 0;
	_height: 12px;
	}

#leftcol li a {
	display: block; 
	background:url(../../images/arrow_bullet.gif) center left no-repeat;
	padding: 7px 0 7px 25px;
	margin: 0 0 5px 0;
	text-decoration:none;
	}

#leftcol li a:hover {background-color:#dfe7f0;}

#leftcol li .current {background-color:#dfe7f0;}

/*Item Sub-Menu*/

#leftcol li ul {
	font-size: 11px;
	margin-left: 25px;
	margin-bottom: 10px;
	line-height: 18px;
	color: #5377a4;
}

#leftcol li ul li a {
	list-style: none;
	background: none;
	padding: 0;
	margin: 0;
	display: inline;
	color: #999;
}


#leftcol li ul li a:hover {
	text-decoration: underline;
	background: none;
	cursor:pointer;
	}

#leftcol li ul li.current {font-weight:bold; background:none;}

/*Back Arrow*/
#leftcol li.back a {
	display: block; 
	background:url(../../images/arrow_bullet_back.gif) center left no-repeat;
	padding: 7px 0 7px 25px;
	margin: 0 0 5px 0;
	text-decoration:none;
	}

#leftcol li.back a:hover {background-color:#dfe7f0;}

#leftcol li.back ul li a {
	list-style: none;
	background: none;
	padding: 0;
	margin: 0;
	display: inline;
	color: #999;	
}

#leftcol li.back ul li a:hover {
	background: none;
}


/*=====================
TEXT REPLACE
======================*/

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
}

/*==================
SEARCH RESULTSS
==================*/

#results {clear: left; margin: 0 0 80px 0;}

#results table {
	width: 100%;
	border-top:1px solid #CCC;
}

#results td {
	border-bottom:1px solid #CCC;
	padding: 8px;
	}
	
#results small {
	font-size: 10px;
	color: #979797;
	line-height: 18px;
}

#results .alt {
	background:#ededed;	
}

.refine {
	font-size: 10px;
	color: #ca0903;
	line-height: 18px;
}
	
/*==============
PRODUCT ICON
==============*/

.producttype {
	margin: 20px 0 10px 0;
}

/*==============
CONTACT MAP
==============*/

.map {
	margin-top: 10px;
	border: 1px solid #CCC;
	width: 300px;
}

/*==============
RKD SIG
==============*/

.rkd {
	width: 100%;
	text-align:center;
	font-size: 10px;
	color:#CCC;
}

.rkd a {color:#CCC; text-decoration:underline;}
.rkd a:hover {color:#CCC; text-decoration:none;}