/* Layout Styling  ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------


This is the styling for the layout of your site. Changing anything in this section could stop your website working in some or all of your customers browsers. *PLEASE* ONLY MAKE CHANGES IF YOU KNOW WHAT YOU ARE DOING. Please ensure that you check any changes you make using IE7, IE8, Firefox, Opera and Safari to make sure that those changes don't affect your site in a bad way*/

body {			/*  Sets up the page in the browser and gives it a background*/
	height:100%;
	max-height:100%;
	overflow:hidden;
	padding:0; 
	margin:0; 
	border:0;
	background-image:url(../graphics/background.jpg);  /* this is the background  */
	background-position:top left;						/*  Starts at the top  */
	background-repeat:repeat;						/*  repeats down  */
	background-color:#ffff9a;						/*Background colour*/
	font-family: verdana, sans-serif;
	}
	
#watermark {
	position:absolute;
	z-index:5;
	top:10%;
	right:10%;
	height:473px;
	width:314px;
	background:url(../graphics/watermark.png);  /* link to the bottom right graphic  */
	background-position:top right;
	background-repeat:no-repeat;
	}

#right {           /*  Places the right graphic  */
	position:absolute; 
	bottom:0;
	right:0;
	width:111px;  
	height:139px; 
	background:url(../graphics/rightdragon.png);  /* link to the bottom right graphic  */
	background-position:bottom right;
	background-repeat:no-repeat;
	z-index:10;
	}
	
#left {           /*  Places the left graphic  */
	position:absolute; 
	bottom:0;
	left:0;
	width:114px;  
	height:132px; 
	background:url(../graphics/leftdragon.png);  /* link to the bottom right graphic  */
	background-position:bottom left;
	background-repeat:no-repeat;
	z-index:10;
	}
	
#head {				/*  Places the title graphic  */
	position:absolute;
	width:350px;
	height:179px;
	top:0px;
	left:10%;
	z-index:20;
	text-align:left;
	}
	
#footer {				/*		The box that holds the text at the bottom	*/
	position:absolute;
	text-align:center;
	bottom:0px;
	right:0px;
	left:0px;
	height:16px;
	z-index:10;
} 
	
#content{				/*  Places the main content  */
	position:absolute;
	top:150px;
	bottom:45px;
	left:25%;
	right:15%;
	padding:15px;
	max-width:650px;	/*  stops large resolutions showing one long line of content  */
	background:url(../graphics/contentback.png);  /* link to the bottom right graphic  */
	background-position:top left;
	background-repeat:repeat;
	overflow:auto;
	z-index:1000;
	}

	
#menucontainer {			/*Positions the menu on the page*/
	position:absolute;
	top:35%;
	left:5%;
	width:140px;
	height:250px;
	z-index:1100;
	cursor:pointer;
	border:none;
}


/* End of layout styling -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


/* Content Styling ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* This is the styling of the content of your site. If you look at the website pages (index.html etc.) you will see a tab ( <p> or <h1> etc. ) at the beginning of the website's content and a closing tab ( </p> or </h1> etc. ). To change the settings scroll down and find the corresponding styles. For p, which is normal paragraph text, find the styles for p.*/

p {
	text-indent:1em; 
	text-align:justify;
	color:#330000;
	font-weight:normal;
	font-size:11px;
	}


h1 {
	text-align:center;
	color:#330000;
	font-weight:bold;
	font-size:18px;
}

h2 {
	text-align:center;
	color:#330000;
	font-weight:bold;
	font-size:16px;
}

h3 {
	text-align:left;
	font-weight:bold;
	font-size:16px;
	color:#660000;
}

h4 {
	padding:5px;
	font-weight:bold;
	font-size:14px;
	color:#660000;
	text-align:center;
}

hr {
	width:70%;
	color:#660000;
	}

.lefttext {
	float:left; 
	width:47%;
	padding:5px;

}

.pricetext {
	padding:5px;
	width:80%;
	text-align:center;

}
	
.righttext {
	float:right; 
	width:47%;
	padding:5px; 

}

.clear {
	clear:both;
}

  
 .center {
	text-align:center;
	}
	
#tiny p {
	font-size:4px;
	}


img {
	border-style:none;
}

#content ul{
	list-style:none;
	text-align:left;
}
a {
	font-weight: normal;
	font-size:10px;
	margin: 0px;
	padding:0;
	color:#660000;
	text-decoration:none;
	
}


a:hover {
	color:#330000;
}


}
a:visited {
	color:#cccc66;
}

#content ul li{
	color:#660000;
	font-weight: bold;
	font-size:12px;
}

#footer a, a:visited, a:hover {
	font-size:9px;
	}

#content dt{
	
	text-align:left;
	font-weight:bold;
	font-size:12px;
	color:#660000;

}
#content dd{
	position:relative;
	text-align:center;
	left:60px;
	top:-15px;
	font-weight:bold;
	font-size:12px;
	color:#003333;
	
}


/* End of the content styling section -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/