* { margin: 0; padding: 0;  }

html { height: 100%; }

body {  
	background: url("../Images/body_bg.jpg") no-repeat 100% 100% #f4f6f8;
	text-align: center; font: 62.5% Arial, Verdana, sans-serif;  color: #666;
	overflow: hidden;
}
img { border: 0; }
ul { list-style: none; }

h1, h2, h3, h4, h5, h6 { font: 1.0em "Trebuchet MS", Times, serif; color: #4e93c0; font-weight: normal; }
table, th, td { font-size: 1.0em; border: 0; vertical-align: top; }
a, a:visited { color: #4e93c0; }
a:hover { color: #c33; }
div.clear { height: 0; line-height: 0px; clear: both; }

/* =============================================================================== WRAPPER AREA */

#container { width: 880px; margin: 0px auto;  position: relative; top: 30px; }

#logo { position: absolute; top: -54px; left: -25px; }

#wrapper { 
	width: 780px; height: 440px;  margin: 50px 50px 0 50px; 
	border: 1px solid #cecece; background: #fff;position: relative; 
}

/* =============================================================================== MASTHEAD AREA, WITH NEWS BUTTON */

#masthead {
	height: 45px; border-bottom: 1px solid #cecece;  
}

#masthead a { float: right; }
#masthead img { margin: 10px 5px; }

#newsButton, #newsButton:visited { 
	display: block; width: 60px; height: 25px; 
	background: url("../images/newsButton.gif"); 0% 0% no-repeat;
	overflow: hidden; line-height: 55px; margin: 10px 5px; 
}

#newsButton:hover { background-image: url("../images/newsButton_over.gif"); }

/* =============================================================================== */
#maincontent_wrapper {  }


/* =============================================================================== HOMEPAGE FLASH + MENU */

#maincontent_top { height: 275px; width: 615px; margin-left: 165px;  }
#maincontent_top #flashcontent { width: 100%; height: 100%; background: url("../images/flash/flashflateimage.jpg") 0% 0%; }

/* Height is 2 pixels less than 275px standard so borders line up properly*/
#mainnavigation { 		
		width: 165px; height: 273px; background: url("../images/mainnav_bg.gif") repeat-y 0% 0%; 
		border-right: 1px solid #cecece; border-bottom: 1px solid #cecece;
		position: absolute; top: 46px; left: 0; z-index: 9;
		font-size: 1.2em; text-align: left;
}
div.subsection { height: 273px !important; } 
#mainnavigation a, #mainnavigation a:visited {  
	text-decoration: none; color: #666; 
	display: block; padding: 8px 0 8px 35px;  border-top: 1px solid #cecece;
	
}
#mainnavigation a:hover { color: #4e93c0; background-color: #fff;  }
#mainnavigation li { width: 165px; float:left; }
a.hasChildren { background: url("../images/mainnav_link_off.gif") no-repeat 99% 50%; }
a.hasChildren:hover { background: url("../images/mainnav_link_on.gif") #fff no-repeat 99% 50%; }

#nav { position: absolute; bottom: 0; }


.dropdown_wrapper {  position: relative;  }
.dropdown_menu ul { position: absolute; bottom: 0; }
.dropdown_menu ul.notbottom { position: absolute; bottom: 105px; }
/* This inner div ensures that links on the transparent dropdown work in IE5.5, 6 */
.innerwrap { background: url("../images/png/gray-40.png"); width: 140px; height: 275px; font-size: 0.9em;  }
.innerwrap ul li { width: 140px !important; padding: 0;  margin: 0; float: left; }
div.innerwrap a, div.innerwrap a:visited { 
	background: #fff; display: block; border: 0 !important;
	padding: 3px 3px 3px 20px !important; margin: 2px 5px !important; 
}
.innerwrap a:hover { color: #4e93c0; background-image: none;  }

/* second-level lists */
li .dropdown_wrapper { display: none;  }

/* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
li>.dropdown_wrapper { top: auto; left: auto; }

/* lists nested under hovered list items */
li:hover .dropdown_wrapper, li.over .dropdown_wrapper { display: block;position: absolute; bottom: 0; left: 165px; }

/* =============================================================================== SUBSECTIONS WHERE THE LARGE TOP RIGHT PANEL HAS CONTENT */


#subnavigation {  
		width: 165px; height: 273px; background: url("../images/mainnav_bg.gif") repeat-y 0% 0%; 
		border-right: 1px solid #cecece; border-bottom: 1px solid #cecece;
		position: absolute; top: 46px; left: 0; z-index: 9;
		font-size: 1.2em; text-align: left;
}
#subnav { position: absolute; top: 0; }
#subnavigation a, #subnavigation a:visited { color: #666; text-decoration: none; }
li.homepagelink { border-bottom: 1px solid #cecece; padding: 10px 0 10px 30px !important; }
li.overviewlink { padding: 5px 0 5px 30px !important; }

#subnavigation ul { width: 165px; }
#subnavigation li { padding: 10px 0 10px 30px;  }
#subnavigation .flooring li { padding: 5px 0 5px 30px; }
#subnavigation .flooring li ul li { width: auto; padding: 2px 0; font-size: 0.9em; }
#subnavigation .flooring li ul.overview li { width: auto; padding: 5px 0 5px 0; font-size: 1.0em; }

li.currentPage { list-style-image: url("../images/subnav_currentpage.gif"); }
li.currentPage a  { color: #4e93c0 !important; }

#subnavigation li ul { margin: 5px 20px 0 20px; }
#subnavigation li ul li { width: auto; padding: 3px 0; font-size: 0.9em; }
#subnavigation li ul li a:hover { text-decoration: underline; }

/* ------------------------------------------------------------------------------- STANDARD TEXT/RANGE CONTENT */

#subsection_content {
	border-bottom: 1px solid #cecece; width: 100%; height: 273px; 
	font-size: 1.1em; overflow: auto; text-align: left;
}
#subsection_content h1 { font-size: 1.4em; padding: 20px 20px 10px 20px; }
#subsection_content h2 { font-size: 1.2em; padding: 10px 10px 5px 20px;}
#subsection_content p { margin: 10px 10px; line-height: 1.5em; }
#subsection_content p.brochures { margin: 10px 10px 10px 20px; line-height: 1.5em; text-align:justify; }
#subsection_content table { width: 565px; margin: 0 20px;  }
#subsection_content td { width: 50%; line-height: 1.6em;}
img.misc_image { margin: 15px; }

#range_currentImage { float: right; width: 310px; height: 273px; text-align: center; background: url("../images/pagecontent_loading.gif") no-repeat 50% 50%; }
#range_currentImage img { margin: 10px auto; }

div.range_details p { 
	width: 260px; float: left; padding: 0 20px 8px 20px; margin: 0 !important;
	 text-align: justify;
}

div.project_details p { 
	width: 400px; float: left; padding: 0 20px 8px 20px; margin: 0 !important;
	 text-align: justify;
}


div.services_details p { 
	width: 300px; float: left; padding: 0; margin: 0 !important;
	line-height: 2.0em; text-align: justify;
}

#range_thumbs { text-align: center; width: 561px; position: relative; top: 10px;   }
#range_thumbs td { text-align: center; }
img.range_thumb {  margin: 0 2px; padding: 0;}

td.brochure_1 { background: url("/images/brochures/Bearfoot_catalogue.jpg") no-repeat 0 0; }
td.brochure_2 { background: url("/images/brochures/Bearfoot_installation.jpg") no-repeat 0 0; }
td.brochure_3 { background: url("/images/brochures/Doras.jpg") no-repeat 0 0; }
td.brochure_4 { background: url("/images/brochures/Proma_Style.jpg") no-repeat 0 0; }
td.brochure_5 { background: url("/images/brochures/Vega.jpg") no-repeat 0 0; }
td.brochure_6 { background: url("/images/brochures/hayburn.jpg") no-repeat 0 0; }

table.tooltip td { width: 70px; position: relative; text-align: left; }
table.tooltip td a { display: block; width: 64px; height: 64px;  }
table.tooltip td a img { display: inline; z-index: 1;  }
table.tooltip td strong { display: block; margin: 5px 0; color: #4e93c0; font-size: 1.2em; }
table.tooltip td em { color: #4e93c0; position: absolute; bottom: 5px; left: 5px; display: block; font-style:normal; font-weight:bold; width: 100%; }
table.tooltip td a b {display:none;}
table.tooltip td a:hover {border:0; position:relative; z-index:500; text-decoration:none;}
table.tooltip td a:hover b { 
	display:block; position:absolute; top: -162px; left:-25px; 
	padding:5px; 
	font-size: 0.9em; font-weight:normal; text-align: left; color:#000; 
	border:1px solid #888; background:#fff; width:200px; height: 150px;
	cursor: hand;
}

/* ------------------------------------------------------------------------------- THE NEWS PAGE */

.newsdate { display: block; color: #4e93c0;  }
#subsection_newsevents {  margin: 0 20px; }
#subsection_newsevents li { margin: 0 0 10px 0; }
#subsection_newsevents a { font: 1.2em "Trebuchet MS", sans-serif; font-weight: bold; text-decoration: none; text-transform: lowercase; }
#subsection_newsevents p { font-size: 0.9em; line-height: normal; margin: 3px 0 0 0; }
#subsection_newsevents p a { font: 1.1em Arial, Verdana, sans-serif; font-weight: normal; }

/* ------------------------------------------------------------------------------- CONTACT FORM */
 .extra { text-align: left; float: right; font-size: 0.8em; }
#subsection_contactform { }
#subsection_contactform span { display: block; }
#subsection_contactform strong { color: #4e93c0; text-align: right; display: block; float: left; width: 100px; }
#subsection_contactform input { width: 150px; margin: 2px; }
#subsection_contactform textarea { width: 150px; margin: 2px; }
#subsection_contactform input.submitbutton { width: auto; margin: 10px 0 0 2px; }

/* ------------------------------------------------------------------------------- SITEMAP */

#subsection_sitemap {   }
#subsection_sitemap td { width: 20%;  }
#subsection_sitemap ul { margin: 5px; }
#subsection_sitemap li ul { border-left: 1px solid #ccc;  }
#subsection_sitemap li ul li { margin: 0 5px; }

#subsection_projects_intro {  height: 75px; text-align: center; margin: 0 auto; font-size: 1.2em; }
#subsection_projects_intro td {  background: url("../images/pagecontent_bearfoot.gif") no-repeat 50% 50%; vertical-align: middle; }

/* =============================================================================== THE BOTTOM 2 PANELS - PROJECTS + TEXTUAL/INFO AREA */

#maincontent_bottom { height: 90px;}


#maincontent_projects { 
	float: left; width: 165px; height: 90px; 
	font-size: 1.2em; text-align: left;
	border-right: 1px solid #cecece; 
	background: url("../images/mainnav_projects_bg.gif") no-repeat 20px 40%;
}
#maincontent_projects a, #maincontent_projects a:hover { 
	color: #666; text-decoration: none; 
	display: block; padding: 30px 35px;
}
#maincontent_projects a:hover { color: #4e93c0; }

/* =============================================================================== PAGECONTENT - PRESENT IN THE BOTTOM PANELS */

#pagecontent { font-size: 1.1em; margin: 0 25px 0 190px; padding: 0;  text-align: left; }

#pagecontent h1 { font-size: 1.3em; padding: 5px 0;}
#pagecontent p { background: url("../images/pagecontent_dot.gif") no-repeat 0% 5px; padding: 0 0 0 10px; }
#pagecontent p.home { background: url("../images/pagecontent_dot.gif") no-repeat 0% 5px; padding: 0 0 0 10px; text-align: justify; }
#pagecontent a, #pagecontent a:visited { color: #4e93c0; }
#pagecontent a:hover { color: #c33; }

/* =============================================================================== UTILITIES LINKS */

#utilities { border-top: 1px solid #cecece; clear: both;padding: 5px 0 5px 160px; text-align: center; font-size: 1.2em; }
#utilities a, #utilities a:visited { display:block; float:left; width: 123px; color: #666; text-align: center; text-decoration: none; }
#utilities a:hover { color: #4e93c0; text-decoration: underline; }

/* =============================================================================== FOOTER AREA WITH CONTACTS */

#footer { margin: 15px 50px 0 50px; font-size: 1.1em; color: #999; }
#footer strong { color: #666; }
#footer a, #footer a:visited { color: #999; text-decoration: none; }
#footer a:hover { text-decoration: underline; }

#continuum { margin: 10px 50px; text-align: left; color: #bbb; }
#continuum img { float: left; }
#continuum p { margin: 4px 0; float: left;}
#continuum a, #continuum a:visited { color: #bbb; }

.iframe h1 { font-size: 1.4em; padding: 20px 20px 10px 26px;
}