/***********************************************/
/* threeColumnLeftTopNaviCentered.css                       */
/* Use with template threeColumnLeftTopNaviCentered.htm     */
/* Source: http://www.justfigures.co.uk/       */
/* Refer to source for CSS tutorials           */
/***********************************************/

/* body, block-level and list styles */
body{
/* a fix will require us to center the body element, see wrapper division below */
	text-align:center;
	background:#CCCCCC;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 18px;	
	margin: 0px;
	padding: 0px;
	}
h1{
	font-size: 24px;
	font-style: italic;
	font-weight: bold;
	color: #000000;
	background-color: #CCCCCC;
	}
h2{
	font-size: 20px;
	font-style: italic;
	font-weight: bold;
	color: #000000;
	background-color: #CCCCCC;
	}
h3{
	font-size: 18px;
	font-style: normal;
	color: #000000;
	}
h4,h5,h6{
	font-size: 18px;
	font-style: normal;
	color: #000000;
	}
p,ul {
	font-size: 18px;
	font-weight: normal;
	color: #000000;
	}

/* list bullet style */
ul{
 list-style-type: square;
	}

/* link styles */
a:link{
	color: #000099;
	text-decoration: none;
	}
a:visited{
	color: #6666CC;
	text-decoration: none;
	}
a:hover{
	text-decoration: underline;
	}
a:active{
	color: #FF0000;
	text-decoration: none;
	}

/* main layout divisions */
#wrapper {
/* and then setting back to left-align for the wrapper */
	text-align:left;
	margin-left:auto;
	margin-right:auto;
	background:#FFFFFF;
	border:2px solid #000000;
	top:0px;
	width:955px;
	}
#header{
	margin-bottom: 5px;
	padding: 5px 0px 5px 0px;
	border-bottom: 1px solid #000000;
	width: 100%;
	height:60px;
	background-color:#FF3366;
	}
#navBarTop{
	text-align:center;
	margin-bottom: 5px;
	padding: 5px 0px 5px 0px;
	border:0px solid #000000;
	width:100%;
	height:25px;
	background-color:#CCCCCC;
	}
/* add innerWrapper as a reference for aligning the top
of the 3 columns of the template */
#innerWrapper {
	/* the use here of relative positioning does not take the division out 
	of the document	flow but allows us to shift the division from its natural 
	position on the page if required */
	/* in fact if we do not provide co-ordinates then the division will occupy its
	natural position on the page */
	/* however we will of created a position reference for the nested
	divisions */
	position:relative;
	margin-top:20px;
	width:100%;
	}
#navBarSide{
	float:left;
	width:200px;
	background-color:#CC33FF;
	border-top:1px solid #000000;
	border-right:1px solid #000000;
	border-bottom:1px solid #000000;
	}
#content{
	width:500px;
	/* add a margin to allow space for navBarSide */
	margin-left:215px;
	background-color:#6699CC;
	border:2px solid #000000;
	padding:0px 10px 0px 10px;
	}
#rightDivision {
	position:absolute;
	/* here we can position rightDivision to the top of the innerWrapper */
	top:0px;
	/* use absolute positioning of 0px so that the rightDivision lines up 
	with the header and footer on the right-hand side */
	right:0px;
	width:200px;
	background-color:#9999FF;
	}
#footer{
	text-align:center;
	/* use clear to be sure that the footer appears below the 3 divisions */
	clear: both;
	border: 1px solid #CCCCCC;
	font-size: 14px;
	color: #CCCCCC;
	padding: 10px 10px 10px 10px;
	margin-top: 0px;
	}

/* site name and site logo styles */
#siteName{
	float:left;
	display:inline;
	margin: 0px;
	padding: 0px 10px 10px 10px;
	}
#siteLogo{
	float:right;
	}

/* search form styles */
#search{
	padding: 5px 1px 5px 1px;
	border-bottom: 1px solid #CCCCCC;
	font-size: 90%;
	}
#search form{
 margin: 0px;
 padding: 0px;
	}

/* navigation bar link styles */
/* top navigation bar */
#mainLinks{
	margin: 0px;
	padding: 3px;
	font-size: 18px;
	}
#mainLinks a:link,#mainLinks a:visited {
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	background-color: #CCCCCC;
	font-weight: bold;
	margin: 2px;
	padding: 1px 3px 2px 3px;
	color: #9900CC;
	}
#mainLinks a:hover{
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #000000;
	border-left: 1px solid #CCCCCC;
	border-bottom: 1px solid #000000;
	background-color: #6699CC; 
	font-weight: bold;
	text-decoration: none;
	}
/* navigation bar link styles */
/* side navigation bar */
#siteLinks{
	margin: 0px;
	padding: 3px;
	border-bottom: 1px solid #CCCCCC;
	font-size: 18px;
	}
#siteLinks h3{
	padding: 5px 0px 0px 5px;
	}
#siteLinks a:link,#siteLinks a:visited {
	display: block;
	border-top: 1px solid #000000;
	border-right: 1px solid #000000;
	border-left: 1px solid #000000;
	border-bottom: 1px solid #000000;
	background-color: #CC99FF;
	font-weight: bold;
	margin: 2px;
	padding: 1px 3px 2px 3px;
	color: #9900CC;
	}
#siteLinks a:hover{
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #000000;
	border-left: 1px solid #CCCCCC;
	border-bottom: 1px solid #000000;
	background-color: #6699CC; 
	font-weight: bold;
	text-decoration: none;
	}

/* associated link styles */
.associatedLinks{
	margin: 0px;
	padding: 3px;
	border-bottom: 1px solid #CCCCCC;
	font-size: 18px;
	}
.associatedLinks h3{
	padding: 5px 0px 0px 5px;
	}
.associatedLinks a:link,.associatedLinks a:visited{
	display:block;
	padding: 1px 3px 2px 3px;
	}

/* advert styles */
.advert{
	padding: 10px 0px 0px 10px;
	font-size: 18px;
	}

.advert img{
	padding-top:20px;
	display: block;
	}

/* page name styles */
#pageName{
	padding: 5px 5px 5px 5px;
	}

/* subject styles */
.subject{
	padding: 10px 0px 0px 10px;
	font-size: 18px;
	}
.subject p{
	padding: 0px 0px 10px 0px;
	}
.subject img{
	float: right;
	padding: 0px 0px 0px 10px;
	margin: 5px 5px 5px 5px;
	}

/* story styles */
.story{
	padding: 10px 0px 0px 10px;
	font-size: 18px;
	}
.story p{
	padding: 0px 0px 10px 0px;
	}

/* end of style sheet */