/*Produced by MicroGraphix - Anno Domini 2008 - http://micrographix.co.uk*/

/* PNG fix which works without Javascript
 img, div, input { behavior: url("iepngfix.htc") }
*/

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->

<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->

/* -- Page properties --------------------------------------------*/

/* IE percentage error fix */
html { font-size: 100%;  }

/* Safari percentage fix, boosts to 16px, IE can't read this*/
/*html>body { font-size: 16px; }*/

/* ==YUI RESET (see: http://developer.yahoo.com/yui/reset/)*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}

body {
	background-color: #D1C4A2;
	font-size: 75%;
	font-family : "Trebuchet MS", arial, helvetica, sans-serif;
	line-height: 160%;
	text-align: left;
	color: #333333; 
}

/* -- h1 styles -------------------------------------------------*/

h1 {font-size: 1.4em;
	text-decoration: none;
	color: #CC0033;
	font-weight: bold;
	line-height: 160%;
	text-align: left;
}
h2 {font-size: 1.3em;
	text-decoration: none;
	color: #CC0033;
	font-weight: bold;
	line-height: 160%; 
	text-align: left;
}
h3 {font-size: 1.2em;
	text-decoration: none;
	color: #CC0033;
	font-weight: bold;
	line-height: 160%; 
	text-align: left;
}
h4 {font-size: 1.1em;
	text-decoration: none;
	color: #CC0033;
	font-weight: bold;
	line-height: 140%; 
	text-align: left;
}

/* -- Global Linking -------------------------------------------------*/

a {
	color:#333333;
	font-weight:bold;
	text-decoration:none;
	outline: none;
}

a:link {
}

a:visited {
}

a:hover {
	color: #CC0033;
	text-decoration: underline;
} 	

/* - Top Navigation Content CSS rollovers -------------------------------------------------*/

/* div rollover state using CSS - replaced with Javascript version*/
#topNav_container {
    position: relative;
	clear:both;
    padding: 0;
    margin: 0;
    voice-family: "\"}\"";
    voice-family: inherit;
    width: 990px;
    height: 30px;
}
html>body #topNav_container {
    width: 990px;
    height: 30px;
}
#topNav_list {
    float: left;
    position: relative;
    height: 30px;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
#topNav_list a {
	overflow: hidden;
    margin: 0;
    padding: 0;
    padding-top: 4px;
    display: block;
    float: left;
    line-height: 22px;
    text-align: center;
    voice-family: "\"}\"";
    voice-family: inherit;
    height: 26px;
    width: 164px;
	border-right: 1px solid #666;
}
html>body #topNav_list a {
    height: 26px;
}
#topNav_list a.topNav_btn {
  background-color: #333;
  font-size: 1.2em;
  font-weight: bold;
  text-decoration: none;
  color: #FFF;
}
#topNav_list a.topNav_btn:hover {
    background-color: #666;
  	font-size: 1.2em;
  	font-weight: bold;
  	text-decoration: none;
	color:#FFF;
}
#topNav_list a.topNav_active_btn {
  background-color: #666;
  font-size: 1.2em;
  font-weight: bold;
  text-decoration: none;
  color: #ffffff;
}
#topNav_list li {
    float: left;
    margin: 0;
    padding: 0;
}
#email_link{
}


/* -- General layout divs -------------------------------------------------*/

#wrapper {
	margin:10px auto 10px auto ;
	text-align: left;
	padding: 0px;
	border:0;
	width: 990px;
	_width: 990px;/* for IE to read properly */
	height: auto;
}
#container {
	float:left;
	width: 990px;
	_width: 990px;/* for IE to read properly */
	height: auto;
	background-color:#FFFFFF;
	text-align:left;
}
#container_frameset {
	float:left;
	width: 990px;
	_width: 990px;/* for IE to read properly */
	height: 625px;
	background-color:#333;
	text-align: center;
	padding-top:5px;
}
#header {
	height: 90px;
	width: 990px;
	background-image:url(../img/kennington_topnav.jpg);
	background-repeat:no-repeat;
}


/* - Center Column Content -------------------------------------------------*/
/* - Home page ----*/

#content { 
	float: left; 
	padding: 30px;
	width: 600px;
	_width: 600px;/* for IE to read properly */
	height: auto;
	background-image:url(../img/contentbg.jpg);
	background-repeat:no-repeat;
}
#contentBox1{/*Home template*/
	height:390px;
	margin: 0px auto; /* bug fix for FF*/
}
#contentBox2{/*Products template*/
	clear: both;
	height:auto;
	margin: 0px auto; /* bug fix for FF*/
}
#contentBox3{/*Blank template*/
	height: 630px;
	margin: 0px auto; /* bug fix for FF*/
}
#contentBox4{/*Product_long template*/
	height: auto;
	width: 600px;
		_width: 600px;/* for IE to read properly */
	margin: 0px auto; /* bug fix for FF*/
}
#contentBox5{/*Showrooms page template*/
	height:600px;
	width:620px;
	_width: 590px;/* for IE to read properly */
	margin: 0px auto; /* bug fix for FF*/
}
#contentBottom{/*Products template*/
	height:auto;
	margin: 0px auto; /* bug fix for FF*/
}
#google_map{
	float:right;
	margin-top: 5px;
	width:350px;
	_width:350px; /* for IE to read properly */
}

/* -- Image layout divs -------------------------------------------------*/

img.articleImage1wide{
	float:left;
	width:600px;
	height:220px;
	margin-bottom: 10px;
}
img.articleImage1{
	float:left;
	margin-right:10px;
	width:310px;
	height:380px;
}
.articleImage1{
	float:left;
	margin-right:10px;
	width:310px;
	height:380px;
}
img.articleImage2{
	float: right;
	margin-left:5px;
}
img.articleImage3{
	float: right;
	clear:right;
	margin-left: 5px;
}
img.articleImage3_pad{
	float: right;
	clear:right;
	margin-top: 10px;
	margin-left: 5px;
}
img.articleLogo{
	float:right;
	clear: right;
	margin-left: 5px;
}
img.articleIcon{
	float: left;
	clear: left;
}

/* -- Image Title div ---------------*/

div#mainImageTitle{
	position:relative;
	top: 200px;
	color:#FFF;
	font-size: 2em;
	font-weight:bold;
	padding: 0 0 0 10px;
}
div#nonslipImageTitle{
	background-image: url(../img/safety_flooring_img.jpg);
	background-repeat:no-repeat;
	position:relative;
	height: 34px;
	width:590px;
	color:#FFF;
	font-size: 2em;
	font-weight:bold;
	padding: 192px 0 0 10px;
	margin-bottom: 10px;
}

/* -- Showrooms page divs -------------------------------------------------*/

#videoBox{
	float:left;
	margin: 20px 10px 0 0;
	width:620px;
	_width: 600px;/* for IE to read properly */
	height:180px;
}
#galleryBox{
	float:left;
	clear:both;
	margin: 20px 10px 0 0;
	width:620px;
	_width: 600px;/* for IE to read properly */
	height:280px; 
}
#galleryContent1{
	float:left;
	width:59px;
	height:138px;
	margin-bottom:10px;
}
#galleryContent2{
	float:left;
	width:59px;
	height:138px;
	margin-left:10px;
	margin-bottom:10px;
}
#galleryContent3{
	float:left;
	width:59px;
	height:138px;
	margin-left:10px;
	margin-bottom:10px;
}
.galleryContentFirst{
	float:left;
	width:59px;
	height:138px;
	margin-bottom:10px;
}
.galleryContent{
	float:left;
	width:59px;
	height:138px;
	margin-bottom:10px;
	margin-left:9px;
}

/* -- Intro Template layout divs -------------------------------------------------*/

#brandCol1{
	float:left;
	margin-top: 20px;
	margin-right: 20px;
	top:30px;
	_top:30px; /* for IE to read properly */
	width:290px;
	_width:280px; /* for IE to read properly */
}
#brandCol2{
	float:left;
	margin-top: 20px;
	top:30px;
	_top:30px; /* for IE to read properly */
	width:290px;
	_width:280px; /* for IE to read properly */
}

/* -- Text layout divs -------------------------------------------------*/

.textBox1{
	width:300px;
	_width:290px; /* for IE to read properly */
}
div#textBox1wide{
	float:left;
	/*width:620px;
	_width:620px;  for IE to read properly */
	height: auto;
	text-align:left;
}
div#textBox1wide p{
	margin-bottom:5px;
}
.textBox2{
	height:auto;
	width: auto;
}
p.textBox2{
	margin-bottom:5px;
}
.textBox2 a{
	font-weight:bold;
	color:#333;
	text-decoration:none;
}
.textBox2 a:hover{
	font-weight:bold;
	color:#CC0033;
	text-decoration: underline;
}
div#textBox2wide{
	float:left;
	/*width:620px;
	_width:620px;  for IE to read properly */
	height:auto;
}
div#textBox2wide p{
	margin-bottom: 5px;
}
div#textBox2wide a{
	font-weight:bold;
	color:#333;
	text-decoration:none;
}
div#textBox2wide a:hover{
	font-weight:bold;
	color:#CC0033;
	text-decoration: underline;
}
.textBox3{
	width:300px;
	_width:290px; /* for IE to read properly */
}

#textBox3wide{
	float:left;
	margin: 20px 0 0 0;
	width:600px;
	_width:600px;  /*for IE to read properly */
}
p.textBox3wide{
	margin-bottom:5px;
}
#callToAction{
	float:left;
	clear:both;
	background-image:url(../img/black_fade.jpg);
	background-repeat:no-repeat;
	width: 310px;
	_width: 310px;  /*for IE to read properly */
	margin-top:15px;
	height: 50px;
	padding:5px 5px 5px 10px;
}
#callToActionLong{
	float:left;
	clear:both;
	background-image:url(../img/black_fade_long.jpg);
	background-repeat:no-repeat;
	width: 585px;
	_width: 585px; /* for IE to read properly */
	margin-top:15px;
	height: 25px;
	padding:5px 5px 5px 10px;
}
.callToAction{
	font-size:1.7em;
	color:#FFFFFF;
	font-weight: normal;
	line-height:100%;	
}


/* - Left Hand Navigation -------------------------------------------------*/

#left-sidebar {
	float: left;
	height: auto;
	padding:10px;
	padding-top:20px;
	background-color:#FFFFFF;
	width: 145px;
	_width: 135px; /* for IE to read properly */
	top: 100px;
	_top: 100px; /* for IE to read properly */
}
.leftNav{
	font-size:1.2em;
	line-height:140%;
}
.leftNav a{
	float:left;
	width:135px;
	_width:125px; /* for IE to read properly */
	text-decoration:none;
	color:#333333;
	font-weight:bold;
}

.leftNav ul{
	padding:0;
	margin:0;
}
/* tried this rollover to highlight all list items. It works but it looks stupid.
.leftNav ul:hover > li{
	background-color:#CCCCCC;
	color:#CC0033;
	text-decoration: none;
}
*/
.leftNav li{
	float:left;
	list-style:none;
	color:#999999;
	font-weight:bold;
	margin-left:10px;
}
.leftNav li a{
	color:#999999;
	font-weight:bold;
	text-decoration:none;
}
.leftNav li.head{
	margin-left:0;
	color:#333333;
	font-weight:normal;
	letter-spacing:-0.5px;
}
.leftNav li.head a{
	color:#333333;
	font-weight:normal;
}
.leftNav li.head a:hover{
	background-color:#CCCCCC;
	color:#CC0033;
	text-decoration: none;
}

/* - Right Hand Navigation -------------------------------------------------*/

#right-sidebar {
	float:right;
	height: auto;
	padding:10px;
	padding-top:20px;
	background-color:#FFFFFF;
	width: 145px;
	_width: 135px; /* for IE to read properly */
	top: 100px;
	_top: 100px; /* for IE to read properly */
}
.rightNav{
	font-size:1.2em;
}
.rightNav a{
	float:left;
	width:135px;
	_width: 125px; /* for IE to read properly */
	text-decoration:none;
	color:#333333;
	font-weight:bold;
}
.rightNav a:hover{
	background-color:#CCCCCC;
	color:#CC0033;
	text-decoration: none;
}
.rightNav ul{
	padding:0;
	margin:0;
}
.rightNav li{
	float:left;
	list-style:none;
	color:#999999;
	font-weight:bold;
	margin-left:10px;
}
.rightNav li a{
	color:#999999;
	font-weight:bold;
	text-decoration: none;
}
.rightNav li.head{
	margin-left:0;
}
.rightNav li.head a{
	color:#333333;
	font-weight:normal;
}

/* -- Three Button Row divs -------------------------------------------------*/

#buttonWrapper{
	padding-top:20px;
	clear:both; 
	height:170px;
}
.buttonTitle{
	background-color:#333333;
	text-align:left;
	font-weight:bold;
	color:#FFFFFF;
	padding-left:3px;
	padding-top:7px;
	vertical-align:middle;
	border-bottom: 1px solid white;
}
#buttonContent1{
	float:left;
	width:179px;
	height:164px;
}
#buttonContent2{
	float:left;
	width:179px;
	height:164px;
	margin-left:30px;
}
#buttonContent3{
	float:left;
	width:179px;
	height:164px;
	margin-left:30px;
}

/* --Footer layout divs and styles -------------------------------------------------*/

#footerWrapper {
	clear: both; /* this pushes this div down as the page expands */
	float:left;
	vertical-align: top;
	height: 60px;
	width:990px;
}
#footer {
	clear: both; /* this pushes this div down as the page expands */
	float:left;
	background-color: #D1C4A2;
	vertical-align: top;
	padding:10px;
	height: 40px;
	width:720px;
	position:relative;  /*so we can position #siteMeta to the right easily */
}
/* to position footer element RH */
#siteDev{
	float:right;
	text-align:right;
	padding:10px; 
	width:230px;
	vertical-align:top;
}

/* --Footerlinks -------------------------------------------------*/

.footerbar {
	background-color: #D1C4A2;
	vertical-align: top;
	height: 31px; 
}
.footertext {
	font-size: 0.9em;
	text-decoration: none;
	color: #FFFFFF;
	font-weight: normal;
	line-height: 140%; 
	padding: 5px;
	text-align: left;
	vertical-align: bottom;
 }
.footertext a{
	color: #FFFFFF;
	font-weight: normal;
	text-decoration: none; 
}
.footertext a:hover{
	color: #CC0033;
	font-weight: normal;
	text-decoration: underline;
}

/* --Site Map -------------------------------------------------*/

.sitemap {
	color: #CC0033;
	background-image:url(../img/copy.png);
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 10px 10px 10px 30px;
	font-weight: bold;
	text-decoration: none; }

a:hover.sitemap {
	color: #999999;
	text-decoration: underline; }

.sitemaplinks {font-size: 1.2em;
	text-decoration: none;
	color: #CC0033;
	font-weight: bold;
	line-height: 140%; 
	text-align: left; }

a:hover.sitemaplinks {color: #999999;
	text-decoration: underline; }

.smdescription {font-size: 1.1em;
	text-decoration: none;
	color: #999999;
	font-weight: normal;
	line-height: 140%; 
	text-align: left;
	margin-right: 100px;
	margin-bottom:4px; }

/* --Form Elements -------------------------------------------------*/

.formarea {padding-left: 30px; }

.buttonarea {padding-bottom: 10px;
	padding-top: 20px;
	text-align: center; }

.titletabs {font-size: 1em;
	color: #666666;
	font-weight: bold;
	text-align: right;
	background-color: #e9e9e9;
	line-height: 120%;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 5px; }

.yourdetails {font-size: 1em;
	color: #666666;
	font-weight: normal;
	line-height: 110%; 
	background-color: #ffffff;
	text-align: right;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	border: 1px #cccccc solid; }

.formfields {background-color: #ffffff;
	text-align: left;
}

.note {font-size: 1em;
	color: #999999;
	font-weight: normal;
	line-height: 110%; 
	background-color: #ffffff;
	font-style: italic;
	text-align: right; }

.error  {font-size: 1em;
	color: #cc0000; }


input,
textarea { 
	padding: 0.1em 5px 0.1em 5px;
	vertical-align: bottom;
}

input:hover,
textarea:hover {
	background-color: #e2ecf6;
}

input:focus,
textarea:focus {
	background-color: #e2ecf6;}


/* --PDF downloads -------------------------------------------------*/

.pdf-download {
	background-image:url(../img/pdf.jpg);
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 10px 10px 10px 42px;
	font-weight: bold;
	text-decoration: none; }

a:hover.pdf-download {color: #666666;
	text-decoration: underline; }

.getreader {
	background-image:url(../img/getreader_button.jpg);
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 30px 10px 30px 42px;
	padding-top: 10px;}


/* --Image Module -------------------------------------------------*/
img {
	border: none;
	vertical-align: bottom;
	margin: 0;
}

a img {
	border: none;
}

a:hover.img {
	border: none;
}