/* --- Font Size Conversion Table From Base 16px --- */
/* ---  9px = 57% --- */
/* --- 10px = 63% --- */
/* --- 11px = 69% --- */
/* --- 12px = 75% --- */
/* --- 13px = 82% --- */
/* --- 14px = 88% --- */
/* --- 15px = 94% --- */
/* --- 16px = 100% --- */
/* --- 18px = 113% --- */
/* --- 20px = 125% --- */
/* --- 24px = 150% --- */


/* COLOURS:

Blue: #2C7BC7
Light Blue: #8AB1DA

Grey: #646464
Light Grey: #9B9B9B

*/



html, body {
	height: 100%;
	margin:0;padding:0;
}

/* ----- IDS ----- */

/* NB --- do NOT style base HTML tags
body{}
*/


#primaryContainer {
	/*height:100%;*/
}	

#bodyContainer { 
	background:#FFF;
	min-width:970px; /*height: 100%;*/
	text-align:center;
}


#container {
	margin: 40px auto 0; padding:0;
	position: relative;
	width: 956px; min-height: 578px; 			 /* IE 6 fix required */
	/*overflow:auto; allow content to scroll inside element */
	clear:left;
	text-align: left;
	background: #F3F7F6 url(/images/background/backgroundFade.jpg) repeat-y right top;
}


/* 1. header */


/* 2. navigation */
#navigation {
	position: absolute;
	left:0; top:0;
	z-index:2;
	display:block; float:left;
	width:215px;
	margin:69px 0 0 55px;
}

#topNavBox {
	display:block;
	position:relative;
	width:215px; height: 145px;
}

ul.navTop {
	display:block;
	position:absolute;
	bottom:0; left:0;
}

#logotypeBox {
	margin:18px 0 26px -4px;
	height:57px; width:84px;
}

#bottomNavBox {}

#secondaryNav {
	display:block; float:left;
	margin:0 0 0 15px;
	width:100px;
}

#secondaryNavTop {
	display:block; float:left;
	position:absolute;
	margin:0;
	width:100px;
	top:99px; right:0;
}

/* navCount3 is default (+-15px) */

.navCount2 #secondaryNavTop {
	top:114px;
}

.navCount4 #secondaryNavTop {
	top:84px;
}

.navCount5 #secondaryNavTop {
	top:69px;
}

.navCount6 #secondaryNavTop {
	top:54px;
}

.navCount7 #secondaryNavTop {
	top:39px;
}

.navCount8 #secondaryNavTop {
	top:24px;
} 

.navCount9 #secondaryNavTop, .navCount10 #secondaryNavTop {
	top:9px;
}


/* 3. Main Content */

#mainContentBox, #insideContentBox { 
	/*display:block; float:left;*/
	margin:0;
	width:956px; min-height: 578px; 			 /* IE 6 fix required */
	background-repeat: no-repeat;
	background-position: right bottom;
	/*background-color: #F3F7F6; */
}

#insideContentBox {
	margin-left:270px;
	padding:169px 140px 0 0;
	width: 546px; /* 956-140-270=546 */
	min-height:409px; /* 578-169=409 */ 			  /* IE 6 fix required */
}

/*
.Contactus #insideContentBox {
	background-color: transparent;
}
*/

#insideContentBox.logoVertAlign {
	padding-top: 235px;
	height:343px;
}

.navCount2 #insideContentBox {
	padding-top:184px;
}

.navCount4 #insideContentBox {
	padding-top:154px;
}

.navCount5 #insideContentBox {
	padding-top:139px;
}

.navCount6 #insideContentBox {
	padding-top:124px;
}

.navCount7 #insideContentBox {
	padding-top:109px;
}

.navCount8 #insideContentBox {
	padding-top:94px;
}

.navCount9 #insideContentBox, .navCount10 #insideContentBox {
	padding-top:79px;
}

.lhcol {
	display:block; float:left;
	padding:0 24px 0 0; margin:0;
	width:168px;
}

.midcol {
	display:block; float:left;
	padding:0 24px 0 0; margin:0;
	width:168px;
}

.rhcol {
	display:block; float:left;
	padding:0; margin:0;
	width:168px;
}

/* 3.1 sidePanel-left  */




/* 3.2 main content */
.mainContent {
	position: absolute;
	top:316px; left:348px;
	display:block; float:left;
	z-index:3;
	/*margin:180px 0 0 15px;*/
	width:570px;
	clear:right;
}


#homeContentBox {
	position:absolute;
	top:0; left:350px;
	display:block; float:left;
	z-index:3;
	width:600px; height:214px;
	clear:right;
}

.alignBottom {
	position:relative;
	display:block;
	width:100%; height:100%;
}


.homeContent {
	position: absolute;
	bottom:0; left:0;
	display:block;
	width:600px;
}


/* 4. control strip */
#clientControl {
	position: absolute;
	top: 530px; left:156px;
	z-index:3;
	width: 800px; height:18px;
	margin: 0; padding: 6px 4px 0 0;
	background-color: #FFF;
}

.controlBox {
	display: block; float:left;
	width: 300px; height:12px;
	margin: 0 0 0 12px; padding:0;
}

.slideshowBox {
	float:right;
	width: 275px;
	text-align:right;
}


/* 5. footer */
	
#footer { 
	clear:both; display:block; 
	margin: 0 auto; padding:7px 0 0;
	width: 956px;
}
#poweredByBox {  display:block; width: 120px; height:20px; float:right; }


/* ----- CLASSES ----- */

.content { margin: 0; padding:0;}
.loading { background: transparent url(/images/ajax-loader.gif) no-repeat center center }

/* ----- HEADINGS ----- */

/* NB --- do NOT style base HTML tags
h1{}
h2{}
h3{}
h4{}
h5{}
*/

#logotypeBox h2, #logotypeBox h2 a {
	display:block;
	height:57px; width:84px;
	text-indent:-500em;
}

#logotypeBox h2 a {
	background: transparent url(/images/smartworksLogo.gif) no-repeat left top;
	outline:none;
}

.mainContent h2 { display:block; }

.slideshowBox h4 { 
	float:left;
	width:15.5em;
	margin:0; padding:0;
	font-size: 100%;
	text-align:right;
	color:#646464;
}


/* ----- LISTS ----- */

#navigation ul, #secondaryNav ul, #secondaryNavTop ul, #clientControl ul {
	list-style-type:none;
	margin:0; padding:0;
	font-size:69%;
}

#clientControl ul {
	font-size:100%;
}

#clientControl div.slideshowBox ul {
	float:left;
	margin:0 5px;
}

#topNavBox ul {
	float:left;
	width:100px;
}

#bottomNavBox ul {
	float:left;
	width:100px;
}

#navigation li, #secondaryNavTop li, #secondaryNav li {
	margin:0; padding:2px 0;
	line-height:1em;
}

#clientControl li {
	display:inline;
	margin:0; padding:0;
}

#navigation li a, #secondaryNavTop li a, #secondaryNav li a, #clientControl li a {
	outline-style:none;
	text-decoration:none;
}

#clientControl li a { line-height: 1em;}

ul.navTop li a, ul.navTopSec li a {
	color: #8AB1DA;
}

ul.navTop li a:hover, ul.navTop li a.active, ul.navTopSec li a:hover, ul.navTopSec li a.active  {
	color: #2C7BC7;
}

ul.navBottom li a, ul.navBottomSec li a,
div.controlBox ul li a{
	color: #9B9B9B;
}

div.slideshowBox ul li a { color: #8AB1DA; }

ul.navBottom li a:hover, ul.navBottomSec li a:hover,
ul.navBottom li a.active, ul.navBottomSec li a.active,
div.controlBox ul li a:hover,
div.controlBox ul li a.active{
	color: #646464;	
}

div.slideshowBox ul li a:hover, div.slideshowBox ul li a.active {
	color: #2C7BC7;
}

div.slideshowBox ul li.firstNav a {
	padding-right:5px;
	margin-right:2px;
	border-right: 1px solid #CCC;
}

div.controlBox ul li.firstNav a {
	padding-right:5px;
	margin-right:5px;
	border-right: 1px solid #CCC;
}


/* ----- IMAGES ----- */

/* NB --- do NOT style base HTML tags
img{ }
img a{ }
img a:hover{ }
*/



/* ----- BREAK ----- */

.clearer hr { display:none; }



/* ----- LINKS ----- */

p.breadcrumbs a { }
p.breadcrumbs a:hover { }

a img { border-width:0;}

.controlBox p a { color:#2C7BC7; text-decoration:none; }
.controlBox p a:hover { color:#646464; }

/* ----- FORMS ----- */