/* Author Kerry Kingston, Bluesmith ltd.*/

/* Reset all margins, padding etc. to control visual appearance across different browsers */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,p,form,fieldset,table,input,blockquote,th,td,label { margin: 0; padding: 0;}
table {border-collapse: collapse; border-spacing:0;}
img { border: 0;}
ol,ul {list-style:none;}
caption,th {text-align:left; font-size: 1.2em; font-weight: bold;}
h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:normal;}


/* Now, specifically style the elements for this website.... */

/*------------------------------Basic Font Formatting----------------------------*/
body 	{
		font-family: arial, helvetica, sans-serif; 
		font-size: 0.77em; 
		line-height: 1.465em; 
		background-color: rgb(252,254,254);
		margin: 0.7692em;
		padding: 0.7692em;
		}

p 		{
		color: black;
		margin-bottom: 0.7692em;		
		}
		
h1 		{
		margin-top: 1.154em;
		color: rgb(0,66,130); 
		font-weight: bold; 
		font-size: 1.539em;
		line-height: 1.67em;
		font-family: "Trebuchet MS";
		}
		
h2 		{
		margin-top: 0.7692em; 
		color: rgb(255,170,0); 
		font-weight: bold; 
		font-size: 1.539em;
		line-height: 1.67em;
		font-family: "Trebuchet MS";
		}
		
h3 		{
		margin-top: 0.7692em; 
		color: rgb(255,170,0);
		font-weight: bold;
		font-size: 1.16em;
		}
h4		{
		color: rgb(0,66,130); 
		font-weight: bold; 
		font-size: 1.539em;
		line-height: 1.67em;
		font-family: "Trebuchet MS";
		}
		
h5 		{
		clear: left;
		margin-top: 2em; 
		color: rgb(0,66,130);
		font-size: 1.2em;
		text-align: right;
		font-family: "Trebuchet MS";
		}
		
h6 		{
		margin-top: 1.154em;
		color: rgb(0,66,130); 
		font-weight: bold; 
		font-size: 2em;
		line-height: 1.67em;
		font-family: "Trebuchet MS";
		}
		
td, th {padding: 0.25em;}	
strong {font-weight:bold;}
table {padding: 0.7692em; margin: 0.7692em;}

/* dividing image size by 12.30645 so that images will scale as text does in IE */

img.Bluesmith_256x35 { width: 20.802em; height: 2.844em;}
img.carlsberg { width: 37.785em; height: 50.380em;}
img.coffee { width: 23.615em; height: 28.461em;}
img.danielkafka_550x320 { width: 44.691em; height: 26.002em;}
img.Explode { width: 10.563em; height: 8.695em;}
img.explode_410x360 { width: 33.0em; height: 29.253em;} /* image size 410x360 */
img.Filmstrip_912x470 { width: 74.107em; height: 38.191em;} /* image size 912x470 */
img.Ilona { width: 37.785em; height: 51.355em;} /* image size 465x632 */
img.IlonaWire { width: 21.127em; height: 8.857em;} /* image size 260x109 */
img.logos { width: 75.164em; height: 19.502em;} /* image size 925x240 */
img.lynx { width: 21.533em; height: 16.251em;} /* image size 265x200 */
img.map_747x640 { width: 60.700em; height: 52.005em;} /* image size 747x640 */
img.phoneback { width: 37.785em; height: 49.324em;} /* image size 465x607 */
img.phoneback1 { width: 21.533em; height: 8.776em;} /* image size 265x108 */
img.Philips_500x625 { width: 40.6275em; height: 50.784em;} /* image size 325x620 */
img.Training1 { width: 23.565em; height: 23.565em;} /* image size 290x290 */
img.Training2 { width: 23.565em; height: 23.565em;} /* image size 290x290 */
img.Training3 { width: 23.565em; height: 23.565em;} /* image size 290x290 */
img.Unilever { width: 37.785em; height: 48.186em;} /* image size 465x593 */
img.xs_Alias { width: 36.972em; height: 19.746em;} /* image size 455x243 */
img.xs{ width: 62.00em; height: 26.815em;} /* image size 763x330 */


/*----------------------------------Div used for overall page, floating in the window ------------------------------------*/
#pagecontainer 	{
				position: relative;
				margin-left: auto;
				margin-right: auto;
				width: 75em;	
				height: 80em;					
				}
				
.hidecolour{  
			color:rgb(240,240,255);
			font-weight: bold; 
			} 
							
				
			
/*---------------------------------Div for the 'Bluesmith' banner.  --------------------------------------------------------*/
#banner 	{
		border-bottom: solid gray 1px;
		text-align: left;
		padding-bottom: 5px;
		padding-top: 30px;
		height: 40px;
		}
	
/*-------------------------------------Top menu navigation--------------------------------------*/
		
#topnav 	{
		margin-bottom: 0em;
		padding-bottom: 0.769em;
		padding-top: 0.769em;
		text-align: right;
		font-size: 1em;
		font-weight: bold; 
		}
		
#topnav ul	{display:inline;}

#topnav a	{
			width:6em;
			text-decoration:none;
			padding-left: 3em;
			color: rgb(0,66,130);
			}

#topnav a:hover {color: rgb(140,66,150); text-decoration:underline;}

#topnav a.current 	{
					color: rgb(255,170,0);
					}		

#topnav li {display:inline}

/*--------------------------------Sub menu navigation used in Alias Training---------------------------------*/

#subnav 	{
		margin-bottom: 1em;
		margin-left: 48em;
		padding-bottom: 0em;
		padding-top: 0em;
		text-align: left;
		font-size: 0.7em;
		font-weight: bold;
		}

#subnav ul {display:inline;}

#subnav li {display:inline;}

#subnav a	{
			width:6em;
			text-decoration:none;
			padding-left: 1.5em;
			padding-right: 1.5em;
			color: rgb(130,130,130);
			border-right: solid gray 1px;
			border-left: solid gray 1px;
			}

#subnav a:hover {color: rgb(140,66,150); text-decoration:underline;}

#subnav a.current 	{
					color: rgb(255,170,0);
					}	

/*----------------------------Left narrow column used in each case study page -------------------------*/

#leftcol	{
			margin-top: 0.19em;
			margin-right: 0em;
			float: left;
			width: 11em;
			padding-right: 2em;
			}
			
/* must be presented in the order : link, visited, hover, active */
#leftcol a:hover	{
				color: rgb(255,170,0);
				text-decoration:underline;
				}
			
#leftcol li a	{
			font-size: 1.6em;
			font-family: "Trebuchet MS";
			display: block;
			margin-top: 0.5em;
			padding-top: 2.1em;
			padding-left: 0;
			padding-right: 0.769em;
			height: 2em;
			text-decoration: none;
			font-weight: bold;
			color: rgb(0,66,130);
			text-align: left;
			}
	
#leftcol li a#pickeda	{
					background-repeat: repeat-y;
					font-weight: bold; 
					color: rgb(255,170,0);
					}

					
/*----------------------------Two column page : About Us Content Section - Column 1------------------------------ */

#maincol	{  
			float: left;
			width: 42em;
			margin-top: 1em;
			}
			
/*----------------------------Two column page : CAD Services Content Section - Column 1------------------------------ */

#cadcol	{  
			float: left;
			width: 33em;
			margin-top: 1em;
			}
			
/*----------------------------used in scheduled courses page------------------------------ */
			
#courseleft	{  
				float: left;
				width: 42em;
				margin-top: 1em;
				}
				
#courseleft li 	{
				margin-left: 2em;
				margin-bottom: 1em;
				font-weight: bold;
				}
				
#courseright	{  
				float: right;
				width: 20em;
				margin-top: 5em;
				background-color: rgb(240,240,255);
				padding: 0em 1.5em 1em 2em;
				}
				
/*----------------------------used in training page------------------------------ */		

#trainingmain	{  
				float: left;
				width: 26.5em;
				margin-top: 2em;
				padding-bottom: 2em;
				}
			
#trainingleft	{  
				clear: left;
				width: 19.3em;
				float: left;
				padding: 0em 2em 1em 2em;
				margin: 2em 1em 0em 0em;
				border: solid 1px #e6e6e6;
				height: 275px;
				background-image: url(images/Training1.jpg);
				}
#trainingcentre	{  
				width: 19.3em;
				float: left;
				padding: 0em 2em 1em 2em;
				margin: 2em 1em 0em 1em;
				border: solid 1px #e6e6e6;
				height: 275px;
				background-image: url(images/Training2.jpg);
				}
			
#trainingright	{  
				width: 19.3em;
				float: left;
				padding: 0em 2em 1em 2em;
				margin: 2em 0em 0em 1em;
				border: solid 1px #e6e6e6;
				height: 275px;
				background-image: url(images/Training3.jpg);
				}
#trainingfooter	{
				clear: both;
				text-align: left;
				}
				
/*----------------------------featureright used in workshops page to list industries and in about page and in cadservices------------------------------ */
			
#featureright	{  
				float: right;
				margin-top: 2em;
				}
				
/*----------------------------used on index.htm----------------------------- */
				
#frontpage	{  
				width: 30.2em;
				float: left;
				padding: 7em 40em 32em 5em;
				background-image: url(images/stives.jpg); 
				background-repeat: no-repeat;				
				}
				
/*----------------------------used in contact us page----------------------------- */	
			
#mapleft	{  
				clear: left;
				width: 10em;
				float: left;
				padding: 0em 4% 1em 0%;
				margin-top: 2em;
				}
				
#mapright		{  
				float: right;
				margin-top: 2em;
				}
				
p.feature  {clear: left;}
						
p.credit 	{
			text-align: right;
			font-style: italic;
			color: rgb(128,128,128); 
			font-size: smaller;
			}
p.address 	{
			text-align: left;
			margin: 0px;
			padding: 0px
			}
p.cover	 	{
			/*font-weight: bold;*/
			font-size: larger;
			}
/*----------------------------used in portfolio page------------------------------ */	
		
#portfoliomain	{  
				float: left;
				width: 21em;
				margin-top: 2em;
				padding-bottom: 2em;
				}
			
#portfoliopix	{
				float: right;
				width: 38em;
				padding-left: 0.769em;
				margin-top: 3em;
				text-align: right;
				}

/*----------------------------pub and web used in the publications page------------------------------ */
			
#pubcol	{  
			float: left;
			width: 50em;
			margin-top: 1em;
			}
	
.tutlist	{  
			margin: 0.5em 5em 1.5em 3em;
			}
	
.pubtext	{  
			float: left;
			width: 32em;
			margin-top: 1em;
			}
			
.publink	{ 
			clear: left;
			float: left;
			width: 18em;
			margin-top: 3.4em;
			}
			
.webtop	{
			float: right;
			width: 17em;
			padding: 1em 2em 0.5em 0em;
			margin-top: 2em;
			text-align: right;
			background-color: rgb(240,240,255);
			}
			
.webtop2	{
			float: right;
			width: 17em;
			padding: 0em 2em 0.5em 0em;
			margin-top: 0em;
			text-align: right;
			background-color: rgb(240,240,255);
			}
			
.webbottom	{
			float: right;
			width: 17em;
			padding: 1em 2em 2em 0em;
			padding-bottom: 2em;
			text-align: right;
			background-color: rgb(240,240,255);
			}
			
.webtitletop	{
			float: right;
			width: 19em;
			padding: 0em;
			text-align: right;
			margin-top: 4em;
			background-color: rgb(120,120,140);
			}
			
			
.webtitle	{
			float: right;
			width: 19em;
			padding: 0em;
			text-align: right;
			background-color: rgb(120,120,140);
			}
			
.webtitle h2	{
			font-size: 1.6em;
			line-height: 0.6em; 
			padding-bottom: 0.6em;
			padding-right: 1em;
			}
			
.webbottom li	{
			padding-top: 0.3em;
			}
			
.webbottom li a		{
					padding-top: 1em;
					font-size: 1em;
					font-weight: bold;
					text-decoration:none;
					color: rgb(100,100,120);
					}
					
.tutfrontpage	{
			margin-top: 4em;
			float: left;
			width: 30em;
			padding: 0em 1em 2em 1em;
			padding-bottom: 2em;
			text-align: left;
			background-color: rgb(256,256,180);
			}
			
.webbottom a:visited {color: rgb(20,20,150);}
			
.webbottom a:hover {color: rgb(20,20,150); text-decoration:underline;}	

/*------------------Footer ---------------------------------------------*/
#footer	{
		margin-top: 4em;
		padding-top: 4em;
		font-size: smaller;
		clear: both;
		text-align: left;
		}

#footer ul	{
			padding: 0;
			margin: 0;
			list-style-type: none;
			text-decoration: none;
			}

#footer li	{
			display: inline;
			margin-right: 1em;
			}