﻿/*  
   Copyright Cardinus Risk Management Limited 2009 
   Description: Used for the homepage of the Cardinus redesigned JUNE site
   Author: J.White
   Template: cardinus.master
   Version: 1.1
 
=1 Global
=2 Links
=3 Headings
=4 Header
=5 Navigation
=6 Middle
=7 Form
=8 Hacks
=9 Table Styling
=10 Hacks
=11 New Manual Tab Control 



/* Sets element margins, padding, and border to 0 to even out browser differences when adding desired values later. */
/*html, body, div, p, h1, h2, h3, h4, h5, h6, blockquote, ol, ul, li, dl, dt, dd, td, form, fieldset, a, img, button {
     margin: 0;
     padding: 0;
     border: 0;
}
/* --------------------------------------------------------------------*/
/* =1 Global ----------------------------------------------------------*/
/* --------------------------------------------------------------------*/
/*body{
    background-color:white;
	font-family:Verdana, Arial, sans-serif;
	font-size:100%;
	color:#666666;
}
html{}

#wrapper
{
    width:981px !important;
    height:auto;
    margin:0px auto 10px auto;
    padding:0;
    background-color:White;
    font-size:90%;
    }
 
/* --------------------------------------------------------------------*/
/* =2 Links ----------------------------------------------------------*/
/* --------------------------------------------------------------------*/

/* --------------------------------------------------------------------*/
/* =3 Headings --------------------------------------------------------*/
/* --------------------------------------------------------------------*/
#news h1
{
	background-color: #AEAFAE;
	font-size: 105%;
	color: White;
	padding-left: 10px;
	text-transform: uppercase;
}

#news h2, h3
{
	font-size: 90%;
	padding-left: 5px;
	margin: 5px 0px 5px 0px;
	color: #f36629;
}
#video h1
{
	background-color: #aeafae;
	font-size: 90%;
	color: White;
	padding-left: 10px;
	text-transform: uppercase;
}
.heading /* for styling header tags as links */
{
	font-family: Verdana, Arial, sans-serif;
	font-size: 95%;
	font-weight: bold;
	color: #FC7E00;
	margin-bottom: 8px;
}
h2
{
	font-weight: bold;
	font-size: 100%;
	color: #f36629;
	margin-left: 110px;
}

/*----Gallery Styling ----*/
/*-----h2 tags are first in the gallery so that the h1 tag can be more SEO friendly---*/

.gallery h2
{
	text-transform: uppercase;
	color: White;
	font-weight: bold;
	font-size: 230%;
	float: left; /*margin:50px 100px 0px 0px;*/
	margin: 50px 0 0 450px;
}
.gallery h1
{
	color: #585958;
	font-weight: bold;
	font-size: 170%;
	float: left; /*margin-right:50px;*/
	margin: 0 0 0 450px;
	width: 50%;
	padding-left: 30px;
}

h2.UDC2, h2.CPC2, h2.REN2
{
	color: #656767;
}
h1.SFH1, h1.FSP1, h1.SDR1, h1.HSE1, h1.HSI1, h1.SLM1, h1.PRM1, h1.MSW1, h1.SLT1, h1.SLT11
{
	color: White;
}

/*--positions the call to action text ----*/

h1.FSP1, h1.SDR1
{
	margin-bottom: -30px;
}
h1.CPC1, h1.MHP1, h1.SAT1
{
	margin-bottom: 30px;
}
h1.SLT1
{
	font-size: 130%;
}
h2.ENV2 
{
	font-size:200%;
	color:black;
	}

/* postions the second sentence in the slt product */
h1.SLT11
{
	font-size: 130%;
	margin-top: 10px;
	margin-bottom: 5px;
}

h1.MSW1
{
	line-height: 1em;
	color: #DBEAB3;
	margin-bottom: 13px;
}
h1.REN1
{
	font-size: 105%;
}
h1.ENV1 
{
	color:White;
	font-size:150%;
	margin-top:10px;
	}
.gallery p.RENPARA
{
	font-size: 170%;
	padding: 0;
	width: auto;
	margin: 5px 0 50px 470px;
	float: left;
}

#introText h2, #tabcontainer h2
{
	color: #f2672a;
	font-size: 100%;
	font-weight: bold;
	margin: 10px 0px 10px 0px;
}
#tabcontainer h3
{
	padding-left: 0px;
}

/* --------------------------------------------------------------------*/
/* =4 Header ----------------------------------------------------------*/
/* --------------------------------------------------------------------*/
/*.logo
{
	margin:5px 0px 0px 10px;}
/* --------------------------------------------------------------------*/
/* =5 Navigation ------------------------------------------------------*/
/* --------------------------------------------------------------------*/
/*#login 
{
	width:100%;
	margin:0;
	padding:0;
	height:90px;
	}
	
#ctl00_topNavBar_LoginMenu
{
	float:right;
	margin-top:30px;
	font-size:80%;
	}
#ctl00_topNavBar_LoginMenu li 
{
	display:block;}	
	
#ctl00_topNavBar_LoginMenu a
{
	color:#666666;
	font-weight:bold;}
	
#ctl00_topNavBar_LoginMenu a:hover
{
	color:#999999;
	font-weight:bold;}
	
#topnav
{
	background-image: url(../images/topnavSlice.jpg);
	background-repeat:repeat-x;
	background-position:0 0;
	width:100%;
	height:29px !important;
	margin-top:-20px;
	padding:0;
}*/
#ltmenu
{
	width: 25%;
	padding: 0px 0px 20px 0px;
	margin: 20px 0px 0px 0px; /*background-image:url(../images/ergltmenuBK.jpg); 	background-repeat:repeat-x; 	background-position:0 0;*/
	background-color: #aeafae;
	height: auto;
	color: White;
	float: left;
	font-size: 90%;
}
#ltmenu a
{
	color: White;
	text-decoration: none;
}
#ltmenu ul
{
	display: block;
	width: 100%;
	height: auto;
	margin: 10px 0px 0px 0px;
}
#ltmenu ul li
{
	list-style: none;
	border-bottom: 1px solid #656767;
	text-indent: 10px;
}
.nested1
{
	width: 40%;
}

/* --------------------------------------------------------------------*/
/* =6 Middle ----------------------------------------------------------*/
/* --------------------------------------------------------------------*/

.gallery
{
	height: 281px; /*background-image: url(../images/ergonomicsGallerybk.jpg);*/
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 100%;
}



.gallery p
{
	color: White;
	width: 20%;
	padding: 18px 30px 0px 750px;
	font-weight: bold;
	font-size: 90%;
	float: right;
}
.gallery a, #gallery a:link, #gallery a:visited
{
	color: white;
	font-weight: bold;
	text-decoration: none;
}
.gallery a:visited:hover, #gallery a:hover
{
	color: #666666;
	text-decoration: underline;
}

.galleryCTA /*positions the free evaluation button in the gallery*/
{
	/*position:absolute; 	left:760px; 	top:222px;*/
	float: left;
	margin-top: 34px;
	margin-left: 760px;
}

.galleryCTA a
{
	color: White;
	text-decoration: none;
}

.galleryCTA a:hover
{
	color: #666666;
}
#adverts
{
	margin: 10px 0px 0px 0px;
	background-color: #666666;
	height: 25px;
	color: White;
	font-size: 90%;
	padding: 3px 0px 0px 10px;
}

#bottomcontainer
{
	width: 100%;
	margin: 0 auto;
	height: auto;
	margin-top: 10px;
}
#ltcol
{
	margin: 0;
	padding: 0;
	float: left;
	width: 80%;
	height: auto;
}
#ltcol p
{
	margin-top: 10px;
}
#rtcol
{
	margin: 0;
	padding: 0;
	float: right;
	width: 20%;
	height: auto;
}

#introText
{
	width: 95%;
	float: left;
	margin: 10px 0px 20px 0px;
	font-size: 90%;
}
#introText p
{
	margin-top: 10px;
}

.introTextlead
{
	font-size: 105%;
	font-weight: bold;
}


#introText ul
{
	width: 100%;
	margin: 10px 10px 10px 30px;
	display: block;
}

#introText ul li
{
}
#video
{
	width: 90%;
	height: 234px; /*background-image:url(../images/video.jpg);*/
	background-repeat: no-repeat;
	background-position: 0% 80%;
	margin-top: 20px;
}


#news
{
	width: 90%;
	height: 100px;
	font-size: 95%;
	margin: 20px 0px 10px 0px;
}
#news p
{
	margin-left: 5px;
}


#sme
{
	/*width:85%;*/
	float:left;
}
#sme p
{
	width: 100%;
	text-align: center;
}
#videoHolder
{
	width: auto;
}

#products
{
	width: 100%;
	height: auto;
}
#midcol h1
{
	background-color: #AEAFAE;
	font-size: 105%;
	color: White;
	padding-left: 10px;
	text-transform: uppercase;
}
#ergonomicsUK
{
	background-image: url(../images/ukergo.jpg);
	background-position: 0 50%;
	background-repeat: no-repeat;
	height: 80px;
	width: 100%;
	border-bottom: 1px solid #6ecddd;
	margin-top: 5px;
}
#ergonomicsUK p
{
	width: 80%;
	margin-left: 110px;
}

#ergonomicsUS
{
	background-image: url(../images/usergo.jpg);
	background-position: 0 50%;
	background-repeat: no-repeat;
	height: 80px;
	width: 100%;
	border-bottom: 1px solid #6ecddd;
	border-top: 1px solid #999999;
	margin: 0;
}
#ergonomicsUS p
{
	width: 80%;
	margin-left: 110px;
}
#roadRisk
{
	background-image: url(../images/roadrisk.jpg);
	background-position: 0 50%;
	background-repeat: no-repeat;
	height: 80px;
	width: 100%;
	border-bottom: 1px solid #6ecddd;
	border-top: 1px solid #999999;
	margin: 0;
}

#roadRisk p
{
	width: 80%;
	margin-left: 110px;
}

#hs
{
	background-image: url(../images/hs.jpg);
	background-position: 0 50%;
	background-repeat: no-repeat;
	height: 80px;
	width: 100%;
	border-bottom: 1px solid #6ecddd;
	border-top: 1px solid #999999;
	margin: 0;
}

#hs p
{
	width: 80%;
	margin-left: 110px;
}

#propertyRisk
{
	background-image: url(../images/property.jpg);
	background-position: 0 50%;
	background-repeat: no-repeat;
	height: 80px;
	width: 100%;
	border-bottom: 1px solid #6ecddd;
	border-top: 1px solid #999999;
	margin: 0;
}
#propertyRisk p
{
	width: 80%;
	margin-left: 110px;
}
#consultancy
{
	background-image: url(../images/consultancy.jpg);
	background-position: 0 50%;
	background-repeat: no-repeat;
	height: 80px;
	width: 100%;
	border-bottom: 1px solid #6ecddd;
	border-top: 1px solid #999999;
	margin: 0;
}
#consultancy p
{
	width: 80%;
	margin-left: 110px;
}
#safetyEL
{
	background-image: url(../images/safetyEL.jpg);
	background-position: 0 50%;
	background-repeat: no-repeat;
	height: 80px;
	width: 100%;
	border-top: 1px solid #999999;
	margin: 0;
}
#safetyEL p
{
	width: 80%;
	margin-left: 110px;
}


#contactForm
{
	/*width:85%;*/
	width: auto;
	margin-top: 30px;
	float:left;
}

.clear
{
	clear: both;
}
.smallImageLeft
{
	position: relative;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}
.infoSection, .infoSectionSub
{
	clear: left;
	height: 78px;
}
.pace
{
	margin: 0px auto 0px 60px;
}

.requestInfo
{
	float: right;
	width: auto;
	margin: 20px 47px 0px 0px;
	background-color: #96BF0D;
	padding: 3px;
	border-top: 1px solid #f2f2f4;
	border-left: 1px solid #f2f2f4;
	border-bottom: 1px solid #8b8b8d;
	border-right: 1px solid #8b8b8d;
}
.requestInfo a
{
	color: white;
	text-decoration: none;
}
.requestInfo a:hover
{
	color: #656767;
	text-decoration: none;
}

.smallText
{
	font-size: 80%;
}

.whitePapers
{
	text-align: center;
}

.whitePaperHeading
{
	font-size: 110%;
	font-weight: bold;
}

.whitePapersSub
{
	font-size: 110%;
	color: #ff9900;
	font-weight: bold;
}

.whitePaperLink
{
	color: #656767;
}

.whitePaperLink:hover
{
	color: #AEAFAE;
}
#flashbox
{
	height: 220px;
	margin-top: 0px;
	width: auto;
}
.orange
{
	font-weight: bold;
	color: #f2672a;
}
#terms
{
	font-weight: bold;
	border: 1px solid #c7c7c7;
	width: 70%;
	padding: 0px 0px 20px 20px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	background-color: #F6F6F6;
}
#terms a, #terms a:link
{
	color: #545455;
	text-decoration: underline;
}

#terms a:hover
{
	text-decoration: none;
	color: #c7c7c7;
}
#terms p
{
	margin: 10px 0px 0px 0px;
}

/*#flashcontainer 
{
	
	margin:10px 0px 0px 0px;
	border:1px solid #e1e1e1;}*/

/*--------------------------------------------------------------*/
/*------#TAB Styling -------------------------------------------/
/*--------------------------------------------------------------*/
#tabcontainer
{
	width: 94%;
	float: left;
	height: auto; /*background-image:url("../images/ergmontage.jpg"); 	background-repeat:no-repeat; 	background-position:95% 20%;*/
}
#tabcontainer ul
{
	width: auto;
	margin: 10px 10px 0px 30px;
}
#tabcontainer li
{
}

#ctl00_TabContainer1_ergTraining
{
	margin: 0px 0px 0px 30px;
}
#tab_ctl00_tabcontent_tabCont_ctl01
{
}
#lefttext
{
	width: 100%;
	margin-left: 20px;
}
#rtpic
{
	float: right;
	width: 45%;
	height: 240px;
}


/* default layout */
.ajax__tab_default .ajax__tab_header
{
	white-space: normal !important;
	font-size: 10px !important;
}
/*------- JW was previously nowrap is to make the tabs wrap if they are to big for the div ----*/
.ajax__tab_default .ajax__tab_outer
{
	display: -moz-inline-box;
	display: inline-block;
}
.ajax__tab_default .ajax__tab_inner
{
	display: -moz-inline-box;
	display: inline-block;
}
.ajax__tab_default .ajax__tab_tab
{
	margin-right: 4px;
	overflow: hidden;
	text-align: center;
	cursor: pointer;
	display: -moz-inline-box;
	display: inline-block;
}

.ajax__tab_xp .ajax__tab_header
{
	font-family: "Trebuchet MS" ,Verdana,Arial,sans-serif !important;
	font-size: 72% !important;
	text-transform: lowercase !important;
	font-weight: bold;
}
/*----- JW to resize the tab titles ----- */

/* xp theme */
.ajax__tab_xp2 .ajax__tab_header
{
	font-family: verdana,tahoma,helvetica;
	font-size: 11px;
	font-weight: bold;
	background: url(  "../images/tab-line1.gif" ) repeat-x bottom;
}
/*.ajax__tab_xp2 .ajax__tab_outer {background:url("../images/tab-right1.gif") no-repeat right;height:21px;}
.ajax__tab_xp2 .ajax__tab_inner {padding-left:3px;background:url("../images/tab-left1.gif") no-repeat;}
.ajax__tab_xp2 .ajax__tab_tab {height:13px;padding:4px;margin:0;background:url("../images/tab1.gif") repeat-x;}
.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_outer {background:url("../images/tab-hover-right1.gif") no-repeat right;}
.ajax__tab_xp2.ajax__tab_hover .ajax__tab_inner {background:url("../images/tab-hover-left1.gif") no-repeat;}
.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_tab {background:url("../images/tab-hover1.gif") repeat-x;}
.ajax__tab_xp2 .ajax__tab_active .ajax__tab_outer {background:url("../images/tab-active-right1.gif") no-repeat right;}
.ajax__tab_xp2 .ajax__tab_active .ajax__tab_inner {background:url("../images/tab-active-left1.gif") no-repeat;}
.ajax__tab_xp2 .ajax__tab_active .ajax__tab_tab {background:url("../images/tab-active1.gif") repeat-x;}
.ajax__tab_xp2 .ajax__tab_body {font-family:verdana,tahoma,helvetica;font-size:10pt;border:1px solid #e1e1e1;border-top:0;padding:8px;background-color:transparent;}

#ctl00_tabcontent_TabContainer1_ergAdmin{margin:0px 10px 0px 10px;}

/* scrolling */
.ajax__scroll_horiz
{
	overflow-x: scroll;
}
.ajax__scroll_vert
{
	overflow-y: scroll;
}
.ajax__scroll_both
{
	overflow: scroll;
}
.ajax__scroll_auto
{
	overflow: auto;
}


/* --------------------------------------------------------------------*/
/* =7 Form ----------------------------------------------------------*/
/* --------------------------------------------------------------------*/
.submit
{
	background-color: #96BF0D;
	color: White;
}

table.lhcontact
{
	width: 100%;
	position: relative;
}

#ctl00_contactForm1_txtName, #ctl00_contactForm1_txtOrg, #ctl00_contactForm1_txtTel, #ctl00_contactForm1_txtEmail
{
	width: 100px;
}
/* --------------------------------------------------------------------*/
/* =8 Hacks ----------------------------------------------------------*/
/* --------------------------------------------------------------------*/

/*ie hacks*/

*html #wrapper
{
}

*html .gallery h1
{
	margin-left: 225px;
	width: 55%;
}
*html .gallery h2
{
	margin-left: 225px;
}

*html .galleryCTA
{
	margin-left: 378px;
}
*html .gallery p
{
}

.ListSpacing
{
	/*border-bottom:1px solid #AEAFAE; 	padding-bottom:10px;*/
}

.ListSpacing .productList
{
	color: #F2672A;
	font-weight: bold;
}

.ListSpacing a
{
	color: #656767;
	text-decoration: none;
	font-weight: bold;
}

.ListSpacing a:hover
{
	color: #AEAFAE;
	text-decoration: underline;
}

.productListItem
{
	border-bottom: 1px solid #AEAFAE;
	padding-bottom: 10px;
	height: 60px;
}

.productListItem img
{
	float: left;
	padding-right: 10px;
}

/* --------------------------------------------------------------------*/
/* =9 TABLE STYLING----------------------------------------------------*/
/* --------------------------------------------------------------------*/

table.cpc
{
	margin-top: 20px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 20px;
	width: auto;
	border-collapse: collapse;
	border: 1px solid #E1E1E1;
}
tr.venue
{
	background-color: #AEAFAE;
	font-weight: bold;
	color: White;
}
td.venue1
{
	border: 1px solid #e1e1e1;
	padding: 3px;
}

table.safetyLead
{
	width: auto;
	border-collapse: collapse;
	border: 1px solid #e1e1e1;
	margin-top: 10px;
}
td.safetyLead1
{
	border: 1px solid #e1e1e1;
	font-weight: bold;
	padding: 3px;
}

td.safetyLead2
{
	border: 1px solid #e1e1e1;
	padding: 3px;
}

.management
{
	border: 0 none;
	clear: both;
	float: left;
	height: 150px;
	margin-right: 10px;
	vertical-align: top;
	width: 150px;
}

/* --------------------------------------------------------------------*/
/* =10 HACKS ----------------------------------------------------------*/
/* --------------------------------------------------------------------*/

/*ie 6 hacks */

*html #ltcol
{
	width: 79%;
}
*html #contactForm
{
	margin-top: 10px;
}

*html h1.UDC1, *html h1.CPC1, *html h1.WSP1, *html h1.MHP1, *html h1.PRM1, *html h1.MSW1, *html h1.HSE1, *html h1.HSI1, *html h1.ERA1, *html h1.SFH1, *html h1.SEL1, *html h1.WSPUS1
{
	width: 50%;
}
*html h1.SLM1
{
	width: 40%;
}
*html h1.ENV1{width:50%;}




/* SAFARI HACKS */

@media screen and (-webkit-min-device-pixel-ratio:0)
{

	#ctl00_gallery
	{
		font-size: 90%;
	}

	.gallery h2
	{
		margin-bottom: 30px;
	}

	h1.CPC1
	{
		margin-bottom: 20px;
	}
	h1.FSP1
	{
		margin-bottom: -25px;
	}
	h1.MHP1
	{
		margin-bottom: 22px;
	}
	h1.SDR1
	{
		margin-bottom: 3px;
	}
	h1.SAT1
	{
		margin-bottom: 22px;
	}
	h2.SDR2
	{
		margin-bottom: 5px;
	}
	h2.SEL2
	{
		margin-bottom: 12px;
	}

}
/*ie7 hacks */
*:first-child + html #contactForm
{
	margin-top: 40px;

}

/* --------------------------------------------------------------------*/
/* =11 New Manual Tab Control -----------------------------------------*/
/* --------------------------------------------------------------------*/

/* styling for the div containing the tabs */
.tabHeader
{
	font-weight:bold;
}

/* styling for the div containing the tab content  */
.tabContent
{
	border: solid 1px #999999;
	font-family: verdana,tahoma,helvetica;
	font-size: 10pt;
	padding: 8px;
	margin-top: -1px;
}

/* common styling for an unselected tab and a selected tab */
.tabUnselected, .tabSelected
{
    font-family: Trebuchet MS,Verdana,Arial,sans-serif !important;
	font-size: 72% !important;	
	cursor: pointer;
    overflow: visible;
    margin-right: 2px;
    font-weight:bold;
    text-transform: lowercase !important;
    text-align: center;
    
    border-top: solid 1px #999999;
    border-left: solid 1px #999999;
    border-right: solid 1px #999999;
    background-image:url("../images/tab_bkg.jpg");
    background-repeat:repeat-x;
    background-position: 0 0;
    background-color:#EEEEEE;
    color: #656767;
    padding-top: 1px;
    padding-bottom: 0px;
    padding-left: 4px;
    padding-right: 4px;
}
/* common styling for an unselected tab and a selected tab upon focus (removes default focus border) */
.tabUnselected, .tabSelected:focus
{
	outline:none;
	-moz-outline-style: none;
}

/* additional styling for an unselected tab */
.tabUnselected
{
   margin-bottom: -0px;
   border-bottom: solid 1px #999999; 
}
/* additional styling for an selected tab */
.tabSelected
{
	border-top: solid 3px orange;
	border-bottom: 1px solid #ffffff;
	background-image:none;
	border-top:1px solid #999999;
	background-color:White;
}
/* additional styling for hovering over an unselected tab */
.tabUnselected:hover
{
	border-top: solid 1px #999999;
}

