﻿/*  *******************************
    Layout CSS Code

    *******************************  */
    
#Container
{
    /* CSS to centre website */    
    margin: 0 auto;
    text-align: left;
    
    width: 800px;
    
    /*
    Increase line height for readability.
    */    
    line-height: 100%;
    height:1000px;
    
    
}

body 
{
	font-family: Verdana, "trebuchet MS", Helvetica, sans-serif;
	
	/*
    The base font size of the TT is 10px, which means 1em is 10px, 
    1.2em is 12px and so on.

    The ems for the screen are actually multipliers of the document’s
     base font size. The good practice is to set document’s font size
     to 10px (or if you want it to be resizable by the Internet
     Explorer users, set it to 62.5%).
    */
	font-size:62.5%;
	background-color:White;
	
	/* IE Hack to centre website */
	text-align: center
}

#Header
{
    height:90px;
}


/* 3 column layout equal width */
.ContentLeft222
{
    float: left;
    width: 266px;   
}

.ContentRight222
{
    float: right;
    margin-right: 2px;  
    width: 266px;  
}

.ContentCentre222
{
    margin-left: 266px;  
    width: 266px;
}

/* 2 column layout 4:2 width */
.ContentLeft42
{
    float: left;
    width: 532px;
    /*border:  solid 1px #D3D3D3;*/
}

.ContentRight42
{
    margin-left: 532px; 
    /* Removed for IE Hack 
    width: 266px;  */
    
    /*border:  solid 1px #D3D3D3;*/
}

/* 2 column layout 2:4 width */
.ContentLeft24
{
    float: left;
    width: 266px;   
}

.ContentRight24
{
    margin-left: 266px; 
    width: 532px;
}

/* 2 column layout 3:8 width */
.ContentLeft38
{
    float: left;
    width: 216px;   
}

.ContentRight38
{
    margin-left: 220px; 
    width: 580px;
}

/* 3 column layout 1:4:1 width */
.ContentLeft141
{
    float: left;
    width: 133px;     
}

.ContentRight141
{
    float: right;
    margin-right: 2px; 
    width: 133px;      
}

.ContentCentre141
{
    margin-left: 133px; 
    width: 532px;          
}

/* 3 column layout 1:1:4 width */
.ContentLeft114
{
    float: left;
    width: 133px;     
}

.ContentRight114
{
    float: right;
    margin-right: 2px; 
    width: 532px;      
}

.ContentCentre114
{
    margin-left: 133px; 
    width: 133px;          
}

/* 3 column layout 4:1:1 width */
.ContentLeft411
{
    float: left;
    width: 532px;    
}

.ContentRight411
{
    float: right;
    margin-right: 2px;
    width: 133px;     
}

.ContentCentre411
{
    margin-left: 532px; 
    width: 133px;          
}

/* 3 column layout 1:3:2 width */
.ContentLeft132
{
    float: left;
    width: 133px;    
}

.ContentRight132
{
    float: right;
    margin-right: 2px; 
    width: 266px;     
}

.ContentCentre132
{
    margin-left: 133px; 
    width: 399px;          
}

/* 3 column layout 1:3:2 width */
.ContentLeft123
{
    float: left;
    width: 133px;    
}

.ContentRight123
{
    float: right;
    margin-right: 2px; 
    width: 399px;     
}

.ContentCentre123
{
    margin-left: 133px; 
    width: 266px;         
}

/* 3 column layout 3:2:1 width */
.ContentLeft321
{
    float: left;
    width: 399px;     
}

.ContentRight321
{
    float: right;
    margin-right: 2px; 
    width: 133px;      
}

.ContentCentre321
{
    margin-left: 399px; 
    width: 266px;          
}

/* 3 column layout 3:1:2 width */
.ContentLeft312
{
    float: left;
    width: 399px;    
}

.ContentRight312
{
    float: right;
    margin-right: 2px; 
    width: 266px;      
}

.ContentCentre312
{
    margin-left: 399px; 
    width: 133px;          
}

/* 3 column layout 2:1:3 width */
.ContentLeft213
{
    float: left;
    width: 266px;   
}

.ContentRight213
{
    float: right;
    margin-right: 2px; 
    width: 399px;    
}

.ContentCentre213
{
    margin-left: 266px; 
    width: 133px;         
}

/* 3 column layout 2:3:1 width */
.ContentLeft231
{
    float: left;
    width: 266px;     
}

.ContentRight231
{
    float: right;
    margin-right: 2px; 
    width: 133px;      
}

.ContentCentre231
{
    margin-left: 266px; 
    width: 399px;        
}

/* 3 column layout 2:3:3 width */
.ContentLeft233
{
    float: left;
    width: 200px;  
    
}

.ContentRight233
{
    float: right;
    width: 300px; 
    
}

.ContentCentre233
{
    margin-left: 200px; 
    width: 300px;     
    
}

/* 3 column layout 1:3:1 width */
.ContentLeft131
{
    float: left;
    width: 160px;     
}

.ContentRight131
{
    float: right;
    width: 160px;      
}

.ContentCentre131
{
    margin-left: 160px; 
    width: 478px;          
}

/* 3 column layout 3:6:2 width */
.ContentLeft362
{
    float: left;
    width: 216px;     
}

.ContentRight362
{
    float: right;
    width: 184px;      
}

.ContentCentre362
{
    margin-left: 216px; 
    width: 400px;         
}

.ContentCentreL3332
{
    margin-left: 216px; 
    width: 219px;
}

.ContentCentreR3332
{
    margin-left: 446px; 
    width: 219px;  
    margin-top:-660px;  
    
}



/* 2 column layout 1:5 width */
.ContentLeft15
{
    width: 133px; 
    float: Left;  
}

.ContentRight15
{
    width: 665px;
    margin-left:133px; 
}

/* 2 column layout 5:1 width */
.ContentLeft51
{
    width: 665px; 
    float: Left;  
}

.ContentRight51
{
    width: 133px;
    margin-left:665px; 
}

/* 2 column layout 3:3 width */
.ContentLeft33
{
    width: 399px; 
    float: Left;  
}

.ContentRight33
{
    width: 399px;
    margin-left:399px; 
}

/* 2 column Split layout 50:50 width */
.ContentSplitLeft
{
    width: 50%; 
    float: Left;  
}

.ContentSplitRight
{
    width: 50%; 
    float: right;  
}

/* 2 column layout 2:6 width */
.ContentLeft26
{
    width: 200px; 
    float: Left;      
}

.ContentRight26
{
    width: 600px;
    margin-left:200px;    
}

/* 1 column layout 6 width */
.Content6
{
    width: 798px;
    height:45px;
}

.ContentLayer
{
    clear:both;
    padding-top:10px;   
}

.ContentLayer div
{
    padding-top:10px;   
}

#Footer
{
    clear:both;    
}


*
{
    /*
    Use the universal selector to remove all
    padding/margins from HTML element by default.
    */    
    padding: 0px;
	margin:0px;
}

ul
{
    /*
    Remove all bullets from ul element by default.
    */    
    list-style:none;
}

li
{
    /*
    Remove all underlines from li elements by default.
    */    
    text-decoration:none;
}

a
{
    /*
    Remove all underlines from a elements by default.
    */  
    text-decoration: none;
}

img
{
    border-style: none;
}

