/* stevecantwell.co.uk index style sheet */
/* used in the following pages of stevecantwell.co.uk:
index; blog; faq; learning; links; pictures; site_map; videos
*/
/* Main difference is that the ID "column" here stretches the whole way along main frame.
It has ID "quote" replacing ID "arearight" (on stylesheet and source) to place the quotation at bottom left.
*/

body {
	background-color: #ccffff;
	font-family: "Times New Roman", Times, serif;
}

/* Main picture.  Could alternatively be placed as background picture of body */
#box {
	position:absolute;
	left: 0px;
	top: 0px;
	background-image: url(images/blog_image.jpg);
	background-repeat: no-repeat;
	width: 1780px;
	height: 1313px;
	z-index: 4;
}
#header {
	position:absolute;
	width:867px;
	height:198px;
	background-image: url(images/bannerphoto.jpg);
	background-repeat: no-repeat;
	background-position: center;
	margin-top: 5px;
	top: 22px;
	left: 38px;
}
#navbar {
	position: absolute;
	left: 38px;
	top:221px;
	width: 870px;
	height: 43px;
	background-image: url(images/navbar.jpg);
	background-repeat: no-repeat;
	z-index: 20;
}


/* Main area for text, quotes and pictures */
#mainarea {
	position:absolute;
	left:38px;
	top:254px;
	height: 1000px;
	width: 868px;
	
}
	
h1 {
	font: Tahoma, Geneva, sans-serif;
	font-size: 28px;
	color: #FFF;
	text-align:center;
	text-decoration:none;
	margin-top: .4em;
	line-height: .5em;
}
h1 a {
	color:#FFF;
}

.contact {
	margin-left: 6px;
	background-color: #666;
	font-size: x-large;
	line-height: 1.2;
	text-align: center;
	color: white;
	width: 867px;
}

h2 {
	font:Tahoma, Geneva, sans-serif;
	font-size:16px;
	color:#CCC;
	text-align:center;
	text-decoration:none;
	line-height:.8em;
	margin-top: -.6em;
}

h3 {
	font:Tahoma, Geneva, sans-serif;
	font-size:20px;
	color: #C00;
	text-align:center;
	text-decoration:none;
	line-height:1.2em;
	margin-top: 0;
}

/* Main column for blog */
#column1 {
	background-color: #000;
	width: 400px;
	height: 1300px;
	max-height:1500px;
	margin-left: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 10px;
	padding-top: 0px;
	line-height: 150%;
	overflow: auto;
	float: left;
	color: #CCC;
	border-color: #FC0;
	border-style: groove;
	border-width: thin;
}
#column1 p {
	font-family: "Times New Roman", Times, serif;
	font-size: larger;
	color: #CCC;
	line-height: 150%;
}
#column1 a {
	color: #FFF;
	text-decoration: underline;
}



/* comments column */
#column2 {
	position: absolute;
	top: 128px;
	left: 430px;
	background-color: #000;
	width: 400px;
	height: 1300px;
	max-height: 1500px;
	margin-left: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 10px;
	padding-top: 0px;
	line-height: 150%;
	overflow: auto;
	float: left;
	color: #CCC;
	border-color: #FC0;
	border-style: groove;
	border-width: thin;
}
#column2 p {
	font-family: "Times New Roman", Times, serif;
	font-size: 22px;
	color: #C00;
	line-height: 150%;
}
#column2 .tb-author, #column2 .tb-date {
	color:#F60;}
#column2 a {
	color: #FFF;
	text-decoration: underline;
}


#quote {
	position: absolute;
	bottom: 0px;
	left: 20px;
	font-size: xx-large;
	color:#C00;
	font-style:italic;
	text-indent: 0px;
	margin-top: 0px;
	margin-left: 0px;
}


/* text and links columns underneath main picture */
#extracolumn {
	position: absolute;
	left: 50px;
	top: 1200px;
	background-color: #666;
	width: 400px;
	height: auto;
	max-height: 1000px;
	margin-left: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 10px;
	padding-top: 0px;
	line-height: 150%;
	overflow: auto;
	float: left;
	border: thick ridge #C90;
}
#linkscolumn {
	position: absolute;
	left: 500px;
	top: 1200px;
	background-color: #666;
	width: 400px;
	height: auto;
	max-height: 1000px;
	margin-left: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 10px;
	padding-top: 0px;
	line-height: 150%;
	overflow: auto;
	float: left;
	border: thick ridge #C90;
}
ul.extralinks li {
	
}


/* Navigation links right at bottom of page */
#bottomnavigation {
	position: absolute;
	bottom:0;
	left:0;
	width: 1400px;
}
.bottomnavigation {
	position: absolute;
	top: 2000px;
	font:"Times New Roman", Times, serif;
	font-size:small;
	color: #000;
	list-style-type: square;
}
	
ul.bottomnavigation li {
	float:left;
	width:10em;
}


/* form CSS */
div.row {background: #000;border:1px groove #FC0;margin:0 0 5px 0;float:left;width:100%;padding:6px 0;}
div.row label {float:left;display:block;width:350px;font-weight:bold;padding:0 6px;}
div.row label:hover background:#FFFF66;cursor:pointer;}
div.row fieldset {border:1px solid gray;margin:0 6px;}
div.row fieldset span {display:block;}
div.row fieldset span label {float:none;display:inline;}
div.row fieldset legend {font-weight:bold;}
div.requiredRow {border:2px solid #049;}

.textfield {
	width: 394px;
	height: 50px;
	border:1px groove #FC0;
	margin: 2px;
}