/* ben.css */
/***************************************************** FOR THE SITE ***********************************************************/
* {
	margin: 0;
	padding: 0;
	font-size: 100%;
}



/*background colour for the site*/
body {
	background-color: #020202;
	color: #cbb4f9;
	font-size: 12px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
}

/*basic page setup for the site except 'biog.html'*/
div#container {
	position: relative;
	background: url(../assets/pageBg.png) no-repeat;
	width: 612px;
	height: 817px;
	margin: 10px auto;
}


a:link {
	color: #bda2e6;
	text-decoration: none;
}

a:visited {
	color: #8b77a9;
	text-decoration: none;
}

a:hover {
	color: #3fe0ff;
}

a:active {
	color: #dbcbf4;
}

ul, ol {
	list-style-type: none;
	
}

h1 {
	font-size: 22px;
}

/********** DIV#HEADER ***************/
/*containing <h1> and <span> for the strapline*/
div#header {
	position: relative;
	width: 350px;
	height: 100px;
	margin: 0 auto;
	padding: 20px 0 0 0;
}

/*image replacement of h1 header*/
div#header h1 {
	position: relative;
	margin: 0 auto;
	display: block;
	width: 290px;
	height: 72px;
	background: url(../assets/headerName.png) no-repeat;
	text-indent: -2000px;
}

/*image replacement of span strapline*/
div#header span#strapline {
	position: absolute;
	top: 75px;
	right: 0;
	width: 219px;
	height: 29px;
	background: url(../assets/strapline.png) no-repeat;
	text-indent: -2000px;
}


/************ DIV#NAV *******************/


div#nav ul {
	
	width: 80px;
	height:200px;
	margin: 70px 4px 0 30px;
	float: left; 	
}

div#nav li {
	font: 14px Tahoma, Arial, sans serif;
	color: #bda2e6;
}
/**************DIV#MAIN****************/



div#main img {
	margin: 20px 0 10px 0;
}

div#main blockquote p {
	width: 350px;
	margin: 0 131px;
}

div#main blockquote p span {
	color: #f3edfe;
}

/************ DIV#FOOTER **************/
/*benImp.png image, psuedo-class*/
div#footer img:first-child {
	position: absolute;
	left: 10px;
	bottom: 5px;
}

/*semiTrans.png image, 'psuedo-class' and 'adjacent sibling'*/
div#footer img:first-child + img {
	position: absolute;
	right: 15px;
	bottom: 85px;
}

/*bottom/sub menu*/
div#footer ul {
	position: absolute;
	width: 164px;
	left: 224px;
	bottom: 25px;
}

div#footer li {
	float: left;
	font-size: 10px;
}

div#footer span#copyright {
	position: absolute;
	width: 171px;
	left: 220.5px;
	bottom: 10px;
	font-size: 10px;
	
}

/*positioning text for music btn*/
div#footer span#musictxt {
	position: absolute;
	bottom: 57px;
	right: 30px;
}

/*positioning music btn*/
div#footer div#flash {
	position: absolute;
	bottom: 10px;
	right: 40px;
}

/******************************************************* BIOG.HTML ****************************************************************/

/*basic page setup for biog page*/
div#containerBiog {
	position: relative;
	background: url(../assets/pageBg_biog.png) no-repeat;
	width: 612px;
	height: 1020px;
	margin: 10px auto;
}

/*span to place Biog page confirmation image*/
div#header span#biogtxt {
	position: absolute;
	right: 110.5px;
	top: 80px;
	width: 129px;
	height: 34px;
}

/*paragraph for biog.html*/
div#main p {
	width: 350px;
	margin: 0 0 10px 131px;
}

div#main p span {
	color: #f3edfe;
}

/*----------------------------------------------------------------- CONTACT.HTML -------------------------------------------------------*/

/*span to place Contact page confirmation image*/
div#header span#contactxt {
	position: absolute;
	right: 123.5px;
	top: 80px;
	width: 103px;
	height: 34px;
}

/*for h1 in main section of page*/
div#main h1 {
	width: 340px;
	margin: 0 136px;
	text-align: center;
	color: #f3edfe;
}

div#main h1 + ul {
	text-align: center;
	width: 350px;
	margin: 10px 131px;
	color: #f3edfe;
}

/*highlight text advertising activities*/
div#main li span#advert {
	display: block;
	font-weight: bold;
	margin: 5px 0;
}

/******************************************start FORM start******************/
div#main form {
	width: 355px;
	margin-top: 10px;
	
}

div#main form fieldset {
	width: 345px;
	padding: 15px 0 15px 0;
	margin: 0 0 0 20px;
	border: 2px solid #a3a1a1;
}

div#main form ul {
	margin-left: 39px;
	width: 277px;
}

div#main form label {
	color: #f3edfe;
}

/*to create 2 col look to <label> and <input>tags in <li>'s holding 'name' and 'email'*/
div#main form label.indent {
	float: left;
	width: 50px;
	color: #f3edfe;
}

div#main form input, div#main form textarea {
	background-color: #a0a0a4;
	color: #020202;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

div#main form li.lift {
	margin-bottom: 8px;
}

div#main form legend {
	color: #f3edfe;
	text-transform: uppercase;
	font-size: 10px;
	margin-left: 10px;
}

/* to put distance between submit and reset buttons*/
div#main form input[type="submit"] {
	margin-right: 5px;
}
/************************************************end FORM end**************/


/*---------------------------------------------------------- THANKYOU.HTML -----------------------------------------------------*/
/*container for both 'thankyou.html' and 'error.html'*/
div#containerror {
	position: relative;
	margin: 200px auto;
	background: url(../assets/pageBgsmall.png) no-repeat;
	width: 492px;
	height: 150px;
}

div#thanks {
	width: 180px;
	margin: 0 auto 15px;
	padding: 15px;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #cbb4f9;
}

/*used for text in both 'error.html' and 'thankyou.html'*/
div#goback {
	text-align: center;
	width: 450px;
	margin: 0px auto;
	padding: 0px;
	color: #f3edfe;
}

/*used for <p> division in both 'error.html' and 'thankyou.html'*/
div#goback p {
	margin-bottom: 10px;
}

/*to emphasise <a> for return back to site in both 'error.html' and 'thankyou.html'*/
div#goback span#return {
	font-weight: bold;
}

/*---------------------------------------------------------------- ERROR.HTML ------------------------------------------------------------*/


div#error {
	width: 100px;
	margin: 0 auto 15px;
	padding: 15px;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #aa0000;
}


/*------------------------------------------------------------------  REVIEWS.HTML  --------------------------------------------------------*/

/*span to place Reviews page confirmation image*/
div#header span#reviewstxt {
	position: absolute;
	right: 123.5px;
	top: 80px;
	width: 103px;
	height: 34px;
}

div#main p#title {
	margin: 30px 0 0 140px;
	width: 250px;
}

/*position review headings*/
div#main ul#reviews {
	width: 400px;
	margin: 0 0 0 120px;
}

/*define review headings*/
div#main ul#reviews li {
	border: 1px inset #000;
	padding: 2px 0 4px 5px;
	background-color: #525252;
}

/*pointer hand reveals on hovering over each review heading*/
div#main ul#reviews .sItem {
	margin:10px;
	cursor:pointer;
	cursor:hand;
	display:block;
}

/*colouring blockquote and cite text*/
div#main ul#reviews blockquote {
	color: #f3edfe;
}


/*positioning cited authors*/
div#main ul#reviews cite {
	margin-left: 10px;
	color: #f3edfe;	
}

/*----------------------------------------------------------- PHOTOS.HTML -------------------------------------------------------------*/

/*span to place Photos page confirmation image*/
div#header span#photostxt {
	position: absolute;
	right: 131px;
	top: 80px;
	width: 88px;
	height: 34px;
}

div#main div#flashphotos {
	position: absolute;
	top: 170px;
	left: 80px;
	z-index: 100;
}

div#main p#flashdir {
	margin: 20px 0 0 180px;
	width: 250px;
}