/*****************************************************************************************************

This file should contain
1.) all site wide colour, background and font styles for html tags
2.) a selection of class(.) styles that can be used in the cms text editor

reasoning : so this style sheet could be used to re-style the website

*****************************************************************************************************/

/**************************************** Website Settings *******************************************/

body
{
	color: #4b4b4b;
	font: small/18px Arial, Verdana, Helvetica, sans-serif; /* Medium = 11 px - Small = 9px */
}

/**************************************** Text Settings **********************************************/

h1, h2, h3, h4, h5, h6
{
	font-weight: bold;
	line-height: 1.2em;
	margin: 0px 0px 1em 0px;
}
p
{
	margin: 0px 0px 1em 0px;
	line-height: 1.2em;
}
li
{
	margin: 0em;
	padding: 0em; 
	line-height: 1.2em;
}
a
{
	color:#50899c;
	text-decoration:none;
}
a:hover
{
	color:#3b627f;
	text-decoration:underline;
}
h1, h2, h3, h4, h5, strong {
	color:#50899c;
}
/************************************** Image Settings ***********************************************/

img { border:0px solid #000000; }

/********************************* Header ************************************/
#logo h1 a {
	position:absolute;
	left:0px;
	top:0px;
	width:137px;
	height:94px;
	background:url(../images/logo.gif) 0 0 no-repeat;
	text-indent:-9999px;
	display:block;
}
#top-menu {
	position:absolute;
	right:0px;
	bottom:0px;
	overflow:hidden;
}
div#top-menu ul
{
	list-style: none;
	margin: 0px;
	padding: 0px;
	border:none;
}	
div#top-menu li {
	float:left;
}
#menu-company-profile a, #menu-company-profile a:hover, #menu-products a, #menu-products a:hover, #menu-links a, #menu-links a:hover, #menu-case-studies a, #menu-case-studies a:hover, #menu-ventureclad a, #menu-ventureclad a:hover, #menu-contact a, #menu-contact a:hover {
	text-indent:-9999px;
	height:35px;
	display:block;
}
#menu-company-profile a {
	width:128px;
	background:url(../images/menu/company-profile.gif) 0 0 no-repeat;
}
#menu-company-profile a:hover {
	width:128px;
	background:url(../images/menu/company-profile.gif) 0 -35px no-repeat;
}
#menu-products a {
	width:86px;
	background:url(../images/menu/products.gif) 0 0 no-repeat;
}
#menu-products a:hover {
	width:86px;
	background:url(../images/menu/products.gif) 0 -35px no-repeat;
}
#menu-links a {
	width:59px;
	background:url(../images/menu/links.gif) 0 0 no-repeat;
}
#menu-links a:hover {
	width:59px;
	background:url(../images/menu/links.gif) 0 -35px no-repeat;
}
#menu-case-studies a {
	width:109px;
	background:url(../images/menu/case-studies.gif) 0 0 no-repeat;
}
#menu-case-studies a:hover {
	width:109px;
	background:url(../images/menu/case-studies.gif) 0 -35px no-repeat;
}
#menu-ventureclad a {
	width:105px;
	background:url(../images/menu/ventureclad.gif) 0 0 no-repeat;
}
#menu-ventureclad a:hover {
	width:105px;
	background:url(../images/menu/ventureclad.gif) 0 -35px no-repeat;
}
#menu-contact a {
	width:74px;
	background:url(../images/menu/contact.gif) 0 0 no-repeat;
}
#menu-contact a:hover {
	width:74px;
	background:url(../images/menu/contact.gif) 0 -35px no-repeat;
}
/************************************** Form Settings ************************************************/

form
{
	margin: 0px;
	padding: 0px; 
}
fieldset
{
	border: 1px solid #999;
	padding: 1em;
	margin: 0;
}
legend
{
	color: #000;
	font-size: 1.2em;
}
fieldset div
{
	clear: left;
	margin: 0.5em 0em 0em;
	padding: 0.1em 0.3em 0.1em 0em;
}
fieldset div label
{
	display: block;
	float:left;
	width: 180px;
	padding: 0em;
	margin: 0em 0.5em;
	text-align:right;
}
fieldset div input,
fieldset div textarea,
fieldset div select { border: 1px solid black; }
fieldset div input:focus,
fieldset div textarea:focus,
fieldset div select:focus { border: 1px dotted black; }
fieldset div input.error,
fieldset div textarea.error,
fieldset div select.error { border: 1px dotted red; }
fieldset div label.error
{
	/* remove the next line when you have trouble in IE6 with labels in list */
	padding-left:180px;
	margin-left: 1em;
}

label.error
{
	/* remove the next line when you have trouble in IE6 with labels in list */
	color: red;
	font-style: italic;
	text-align:left;
	width:auto;
}

/* Button Style */

.button
{
	border:0px;
	color:#FFFFFF;
	font-weight:bold;
	background-color:#646464;
	padding:3px;
}

/* Message Style */

div#message
{
	border: 1px solid #ccc;
	background-color: #ffa;
	padding: 5px;
}

/*************************************** Page Settings ************************************************/

.pagetitle {}
.pagetitle h2 { }
.pagetitle h3 { text-transform:lowercase; font-size:1.5em; margin-top:-10px }
.pagetitle-company-profile h2 {
	margin-left:14px;
	background:url(../images/titles/company-profile.gif) 0 0 no-repeat;
	text-indent:-9999px;
}
.pagetitle-links h2 {
	margin-left:14px;
	background:url(../images/titles/links.gif) 0 0 no-repeat;
	text-indent:-9999px;
}
.pagetitle-contact h2 {
	margin-left:14px;
	background:url(../images/titles/contact.gif) 0 0 no-repeat;
	text-indent:-9999px;
}
.pagetitle-products h2 {
	margin-left:14px;
	background:url(../images/titles/products.gif) 0 0 no-repeat;
	text-indent:-9999px;
}
.pagetitle-case-studies h2 {
	margin-left:14px;
	background:url(../images/titles/case-studies.gif) 0 0 no-repeat;
	text-indent:-9999px;
}
.pagetitle-ventureclad h2 {
	margin-left:14px;
	background:url(../images/titles/ventureclad.gif) 0 0 no-repeat;
	text-indent:-9999px;
}
/*************************************** Content Settings *********************************************/
#products-home {
	position:relative;
	width:265px;
	min-height:200px;
	padding-top:80px;
	margin-left:14px;
	float:left;
	background:url(../images/products-homepage.jpg) top left no-repeat;
}
#casestudy-home {
	position:relative;
	width:265px;
	min-height:200px;
	padding-top:80px;
	margin-left:12px;
	float:left;
	background:url(../images/casestudy-homepage.jpg) top left no-repeat;
}
#ventureclad-home {
	position:relative;
	width:206px;
	min-height:200px;
	padding-top:80px;
	margin-left:12px;
	float:left;
	background:url(../images/ventureclad-homepage.jpg) top left no-repeat;
}
#ventureclad {
	position:relative;
	float:left;
	margin-left:14px;
	margin-bottom:14px;
	width:688px;
	height:320px;
}
#company-profile-banner, #case-studies-banner, #contact-banner, #links-banner, #products-banner {
	position:relative;
	float:left;
	margin-left:14px;
	margin-bottom:14px;
	width:688px;
	height:250px;
	text-indent:-9999px;
}
#products-banner {
	background:url(../images/banners/products.jpg) 0 0 no-repeat;
}
#contact-banner {
	background:url(../images/banners/contact.jpg) 0 0 no-repeat;
}
#links-banner {
	background:url(../images/banners/links.jpg) 0 0 no-repeat;
}
#case-studies-banner {
	background:url(../images/banners/case-studies.jpg) 0 0 no-repeat;
}
#company-profile-banner {
	background:url(../images/banners/company-profile.jpg) 0 0 no-repeat;
}
#products-top {
	position:relative;
	float:left;
	margin-left:14px;
	margin-bottom:14px;
	width:688px;
	height:50px;
	background:url(../images/banners/products-top.jpg) 0 0 no-repeat;
	text-indent:-9999px;
}
#product-range-right {
	position:relative;
	padding-top:35px;
	padding-left:8px;
	padding-right:14px;
	background: url(../images/product-ranges.gif) top left no-repeat;
}
#other-products-right {
	position:relative;
	padding-top:35px;
	padding-left:8px;
	padding-right:14px;
	padding-bottom:15px;
	background: url(../images/other-products.gif) top left no-repeat;
}
#contact-right {
	position:relative;
	padding-top:35px;
	padding-left:8px;
	padding-right:14px;
	padding-bottom:15px;
	background: url(../images/our-addresses.gif) top left no-repeat;
}
ul {
	list-style-image: url(../images/bulletpoint.gif);
	margin:0;
	padding:0 0 0 20px;
}
li {
	padding-bottom:0.5em;
	font-weight:bold;
}
.content
{
	-moz-column-count: 2;
	-moz-column-gap: 1em;
	-webkit-column-count: 2;
	-webkit-column-gap: 1em;
	column-count: 2;
	column-gap: 1em;
}
.contentfooter {}

/*************************************** List Settings ************************************************/

.categorymenu { margin-bottom:1em; }
.categorymenu li {}

.listintro {}
.list {}
.listcategory {  }
.listcategorytitle { text-transform:lowercase; font-size:1.5em; }
.listrow {}
.listdetails {}
.listtitle { margin-bottom:0em; }
.listcaption { margin-bottom:1em; }
.listselect {}
.listmore { padding: 0em; margin:0em; text-align:right; }
.listfooter {}
.listunavailable {}
 
.pagenavigation {}

.selectedtitle {}
.selectedtext {}
.selectedunavailable {}
.selectedpreviouspage {}
.selectedfooter {}

/************************************** Left Navigation ***********************************************/

div#leftcolumn div
{
	overflow:hidden;
	width: 100%;
	border-right: 1px solid #000;
	padding: 0px;
	margin: 10px 0px 10px 0px;
	background-color: #90bade;
	color: #333;
}
div#leftcolumn div ul
{
	list-style: none;
	margin: 0px;
	padding: 0px;
	border:none;
}		
div#leftcolumn div ul li
{
	border-bottom: 1px solid #000000;
	padding: 0px;
	margin: 0px;
}

/* style for top level menu */
div#leftcolumn div ul li a
{
	display: block;
	padding: 5px 5px 5px 0.5em;
	border-left: 10px solid #1958b7;
	border-right: 10px solid #508fc4;
	background-color: #2175bc;
	color: #fff;
	text-decoration: none;
	width:auto;
}
div#leftcolumn div ul li a:hover
{
	border-left: 10px solid #1c64d1;
	border-right: 10px solid #5ba3e0;
	background-color: #2586d7;
	color: #fff;
}

/* style for second level menu */
div#leftcolumn div ul li ul li a
{
	display: block;
	padding: 5px 5px 5px 1em;
	border-left: 10px solid #555555;
	border-right: 10px solid #888888;
	background-color: #666666;
	color: #fff;
	text-decoration: none;
	width:auto;
}
div#leftcolumn div ul li ul li a:hover
{
	border-left: 10px solid #666666;
	border-right: 10px solid #999999;
	background-color: #777777;
	color: #fff;
}

/* style for third level menu */
div#leftcolumn div ul li ul li ul li a
{
	display: block;
	padding: 5px 5px 5px 1.5em;
	border-left: 10px solid #AAAA00;
	border-right: 10px solid #DDDD00;
	background-color: #BBBB00;
	color: #fff;
	text-decoration: none;
	width:auto;
}
div#leftcolumn div ul li ul li ul li a:hover
{
	border-left: 10px solid #BBBB00;
	border-right: 10px solid #EEEE00;
	background-color: #CCCC00;
	color: #fff;
}

/* style for selected option */
div#leftcolumn div ul li a.selected
{
	color:#FFFF00;
	font-weight:bold;
}
/*************************************** Footer *************************************/
div#footertext {
	top:0;
	height:66px;
	position:absolute;
	left:0;
	padding:25px 15px;
}
#ams a {
	display:block;
	overflow:hidden;
	position:absolute;
	height:47px;
	width:47px;
	top:25px;
	right:57px;
	text-indent:-9999px;
	background:url(../images/footer_01.gif) 0 0 no-repeat;
}
#shm a {
	display:block;
	overflow:hidden;
	position:absolute;
	height:47px;
	width:42px;
	top:25px;
	right:15px;
	text-indent:-9999px;
	background:url(../images/footer_02.gif) 0 0 no-repeat;
}
/******************* Homepage ***************************/
#homepage-right {
	background:url(../images/homepage-top-rightcolumn.gif) top left no-repeat;
	padding: 25px 20px 10px 10px; 
}
#partner-site-right a {
	position:relative;
	width:220px;
	height:100px;
	display:block;
	text-indent:-9999px;
	background:url(../images/partner-site.gif) 0 0 no-repeat;
}
#banner-home {
	position:relative;
	float:left;
	margin-left:14px;
	width:540px;
	height:246px;
/*	background:url(../images/banners/homepage.jpg) 0 0 no-repeat;
	text-indent:-9999px;*/
}
#banner-home ul {
	list-style:none;
	padding:0;
	margin:0;
}
#quote-home {
	position:relative;
	float:right;
	margin:0px;
	width:230px;
	height:246px;
	background:url(../images/homepage-quote.gif) top right no-repeat;
	text-indent:-9999px;
}
.read-more a {
	display:block;
	clear:both;
	width:206px;
	height:18px;
	background:url(../images/read-more.gif) top right no-repeat;
	text-indent:-9999px;
}
.view-all a {
	display:block;
	clear:both;
	width:260px;
	height:18px;
	background:url(../images/view-all.gif) top right no-repeat;
	text-indent:-9999px;
}