/* CSS Document */

/* Normalises margin, padding */
body, div, dl, dt, dd, ul, ol, li, hi, h2, h3, h4, h5, h6, pre, form, fieldset, legend,
input, p, blockquote, caption, th, td
{ margin: 0; padding: 0; }

/* Normalises heading font sizes */
h1, h2, h3, h4, h5, h6
{ font-size: 100%; }

/* Removes list-style for lists */
ul li, ol li
{
	list-style: none;
}

/* Normalises table borders */
table
{
	border-collapse: collapse;
	border-spacing: 0;
	border: 1px solid;
}

/* Removes border from fieldset and img */
fieldset, img
{ border: 0; }

/* Centre-aligns text in caption and th */
caption, th
{ text-align: center; }

/* Removes quotation marks from q */
q:before, q:after
{ content: ''; }

body {
	margin: 0;
	padding: 0;
	text-align: center;
	color: #333333;
	font: 1em Verdana, Arial, Helvetica, sans-serif;
}

html, body, #wrapper {
	min-height: 100%;
}
html>body, html>body #wrapper {
	height: auto;
}
#wrapper {
	position: relative;
	text-align: left;
	width: 960px;
	margin-right: auto;
	margin-left: auto;
	border: 1px solid #0b3371;
}

/* header styles */
#header {
	height: 224px;
	background: #0b3371;
}
#titlebar {
	background: #74a1e2;
	height: 44px;
	text-align: right;
	padding-right: .5em;
}
#titlebar h1 {
	color: #FFFFFF;
	font-style: italic;
	margin-top: 0em;
	padding-top: .25em;
}


/* header styles */

/* Start main content styles */
#maincontent {
	margin-left: 210px;
	margin-right: 190px;
	color: #0a3370;
}
#maincontent h2 {
	font-size: 80%;
	margin-bottom: 0.75em;
	padding-top: .25em;
}
#maincontent h3 {
	font-size: 75%;
	margin-bottom: 0.5em;
	margin-top: .25em;
}
#maincontent p {
	padding-top: 0.25em;
	text-align: justify;
	margin-bottom: 1em;
	font-size: 70%;
}
#maincontent .test {
	margin-bottom: 1em;
}

#maincontent blockquote {
	font-size: 100%;
}
#maincontent blockquote p {
	margin: 0px;
}

#maincontent cite {
	font-size: 70%;
}
#maincontent address {
	font-size: 70%;
	font-style: normal;
	margin-bottom: 1em;
}
#maincontent ul {
	font-size: 65%;
	margin-left: 146px;
	margin-top: 0px;
}
#maincontent li {
	list-style: disc;
	margin-top: 0em;
}
#maincontent a:link, #maincontent a:visited {
	color: #0b3371;
}
#maincontent .price {
	font-size: 75%;
	font-style: italic;
	font-weight: bold;
	color: #74A1E2;
	margin-top: .5em;
}

/* Start submenu formatting */
#maincontent #submenu {
	clear: left;
	font-size: 100%;
	margin-left: 0px;
}
#maincontent #submenu li {
	float: left;	/* Puts list items in-line */
	display: block;
	height: 194px;
	width: 136px;
	margin-right: 2px;
	margin-left: 2px;
	font-size: 80%;
	font-weight: bold;
	text-align: center;
	margin-top: .75em;
	list-style: none;
}

/* Defines sub menus' list item size and base formatting */
li.aluminium #alumlink, li.concertina #conclink, li.telescopic #telelink, li.timber #timberlink, /* ladders */
li.modular #modlink, li.madetomeasure #mtomlink,	/* staircases */
li.centrep #centreplink, li.tophung #tophlink, li.fire #firelink, li.conservation #conslink {	/* windows */
	padding-top: 3px;
	height: 194px;
	display: block;
	text-decoration: none;
	color: #0b3371;
}

/* Defines sub menus' list item background properties for links and visited links */
li.aluminium a:link, li.aluminium a:visited {
	background: url(../images/aluminium-loft-ladders.jpg) no-repeat;
}
li.concertina a:link, li.concertina a:visited {
	background: url(../images/concertina-loft-ladders.jpg) no-repeat;
}
li.telescopic a:link, li.telescopic a:visited {
	background: url(../images/telescopic-loft-ladders.jpg) no-repeat;
}
li.timber a:link, li.timber a:visited {
	background: url(../images/timber-loft-ladders.jpg) no-repeat;
}
li.modular a:link, li.modular a:visited {
	background: url(../images/modular-staircases.jpg) no-repeat;
}
li.madetomeasure a:link, li.madetomeasure a:visited {
	background: url(../images/made-to-meas-staircases.jpg) no-repeat;
}
li.centrep a:link, li.centrep a:visited {
	background: url(../images/centre-pivot-roof-windows.jpg) no-repeat;
}
li.tophung a:link, li.tophung a:visited {
	background: url(../images/top-hung-roof-windows.jpg) no-repeat;
}
li.fire a:link, li.fire a:visited {
	background: url(../images/fire-escape-roof-windows.jpg) no-repeat;
}
li.conservation a:link, li.conservation a:visited {
	background: url(../images/conservation-roof-windows.jpg) no-repeat;
}

/* Defines sub menus' list item background properties for hover and active links */
li.aluminium a:hover, li.aluminium a:active {
	background: url(../images/aluminium-loft-ladders-r.jpg) no-repeat;
}
li.concertina a:hover, li.concertina a:active {
	background: url(../images/concertina-loft-ladders-r.jpg) no-repeat;
}
li.telescopic a:hover, li.telescopic a:active {
	background: url(../images/telescopic-loft-ladders-r.jpg) no-repeat;
}
li.timber a:hover, li.timber a:active {
	background: url(../images/timber-loft-ladders-r.jpg) no-repeat;
}
li.modular a:hover, li.modular a:active {
	background: url(../images/modular-staircases-r.jpg) no-repeat;
}
li.madetomeasure a:hover, li.madetomeasure a:active {
	background: url(../images/made-to-meas-staircases-r.jpg) no-repeat;
}
li.centrep a:hover, li.centrep a:active {
	background: url(../images/centre-pivot-roof-windows-r.jpg) no-repeat;
}
li.tophung a:hover, li.tophung a:active {
	background: url(../images/top-hung-roof-windows-r.jpg) no-repeat;
}
li.fire a:hover, li.fire a:active {
	background: url(../images/fire-escape-roof-windows-r.jpg) no-repeat;
}
li.conservation a:hover, li.conservation a:active {
	background: url(../images/conservation-roof-windows-r.jpg) no-repeat;
}
/* End submenu formatting */

#spacemaker, #easiway, #deluxe, #picolo, #junior, #juniorhatch, #wallaccess, #electric,
#twosection, #threesection,	/* Floats ladder pics left */
#centrep, #tophung {	/* Floats window pics left */
	float: left;
	margin-right: 1em;
	margin-left: 2px;
	margin-bottom: 7px;
	color: #0b3371;
}
#maincontent #vanphoto {
	text-align: center;
}
#maincontent #showroom {
	float: right;
	margin-bottom: 2em;
	margin-left: 1em;
	margin-top: .25em;
}

/* Start data tables */
#maincontent table {
	font-size: 65%;
	margin-right: 2px;
	margin-bottom: 1em;
	border: 1px solid #0B3371;
}
#maincontent  th {
	background: #0b3371;
	color: #FFFFFF;
	text-align: left;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 2px;
}
#maincontent .tdrow1 td {
	background: #86c8d4;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 2px;
}
#maincontent .tdrow2 td {
	background: #5890c4;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 2px;
}
#maincontent .width30 {
	width: 30%;
}
#maincontent .width25 {
	width: 25%;
}
#maincontent .width23 {
	width: 23%;
}
#maincontent .width20 {
	width: 20%;
}
#maincontent .width17 {
	width: 17%;
}
#maincontent .width15 {
	width: 15%;
}
#maincontent .width12 {
	width: 12%;
}
/* End data tables */

#maincontent .lmargin {
	margin-left: 2em;
}
#maincontent .clear {
	clear: left;
}
#maincontent .clearright {
	clear: right;
}
#maincontent #gallerymenu {
	font-size: 70%;
	font-weight: bold;
	margin-left: 3em;
}
#maincontent #gallerymenu li {
	list-style: none;
	margin-bottom: 1.75em;
}


/* End main con tent formatting */

/* Starts main left hand menu formatting */
#mainnav {
	background: url(../images/mainnav-bg.gif) no-repeat;
	display: block;
	position: absolute;
	left: 10px;
	top: 170px;
	width: 190px;
	padding-top: 98px;
}
#mainnav #mainnavlist li {
	font-size: 76%;
	font-weight: bold;
	margin-left: 31px;
	display: block;
	height: 21px;
	width: 126px;
	margin-bottom: 15px;
}
#mainnav #mainnavlist a:link, #mainnav #mainnavlist a:visited {
	text-decoration: none;
	background: #FFFFFF;
	display: block;
	height: 20px;
	width: 122px;
	padding-top: 5px;
	padding-left: 4px;
	color: #0b3371;
}
#mainnav #mainnavlist a:hover, #mainnav #mainnavlist a:active {
	background: #74A1E2;
}
#mainnav #ealogo {
	margin-top: 10px;
	margin-left: 9px;
}
#mainnav #fensalogo {
	margin-left: 15px;
	margin-top: 30px;
}

/* Ends main left hand menu formatting */

/* Starts right hand suppliers list */
#rightcol {
	width: 180px;
	position: absolute;
	left: 780px;
	top: 269px;
	text-align: center;
	padding-top: 0.25em;
	font-size: 70%;
}
#rightcol #logos li {
	margin-top: .25em;
	margin-bottom: 2em;
}
/* Ends right hand suppliers list */

/* footer styles */
#footer {
	font-size: 65%;
	color: #FFFFFF;
	background: #0B3371;
	padding-top: 1.5em;
	padding-bottom: 0.5em;
	padding-left: .5em;
}
#footer a:link, #footer a:visited {
	color: #FFFFFF;
}
#contactpage #maincontent p {	/* Aligns the contact details left */
	text-align: left;
}
