/*this set the top margin of the body to 0 so there was no white space above the main body*/

html, body {
	margin:0px;
	padding:0px;
}
/******************main body conditions********************/
body {
	font-family:Arial, Helvetica, sans-serif;
	font-size:small;
	color:#666666;
	background-color:#FFFFFF;
}
/*********************************************/
	/*this class allocated to a section will hide it*/

.hidden {
	display:none;
}

/*this gets rid ony space above headings 1 and 2 and paragraphs*/
h1, h2, p {
	margin:0px;
	padding:0px;
}

/*this set main menu area (at the top of the page on this site)- note auto centred it*/

#page-container {
	width:874px;
	margin:auto;
}

/*rules for the vaious sections of header, left(sidebar-b) and right (sidebar-a)and footer- float moves items side by side can be from left or right*/

#main-nav {
	height:50px;
	
}

#main-nav dl {
	margin:0px; padding:0px; padding-left:11px;
}

#main-nav dt {
	float:left;
}

#main-nav dt a {
	display:block;
	height:0px!important;
	height /**/:50px;/*IE 5/win hack */
	padding: 50px 0 0 0;
	overflow:hidden;
	background-repeat:no-repeat;
}

#main-nav dt a:hover { 
	background-position:0 -50px;
}

/* sets the background to move up 50px when link is hovered*/
#main-nav dt#about,
#main-nav dt#about a { width: 71px; background-image: url(images/nav/about.gif); }

#main-nav dt#workshops,
#main-nav dt#workshops a { width: 95px; background-image: url(images/nav/workshops.gif); }

#main-nav dt#online_shop,
#main-nav dt#online_shop a { width: 120px; background-image: url(images/nav/online_shop.gif); }

#main-nav dt#theplace,
#main-nav dt#theplace a { width: 88px; background-image:  url("images/nav/theplace.gif"); }

#main-nav dt#no12theplace,
#main-nav dt#no12theplace a { width: 160px; background-image: url(images/nav/no12theplace.gif); }

#main-nav dt#contact,
#main-nav dt#contact a { width: 106px; background-image: url(images/nav/contact.gif); }

/*    creating sub classes  if the div is found on that page the back ground position movees as below  */
body.about dt#about,
body.about dt#about a,
body.about dt#about a:hover,
body.workshops dt#workshops,
body.workshops dt#workshops a,
body.workshops dt#workshops a:hover,
body.online_shop dt#online_shop,
body.online_shop dt#online_shop a,
body.online_shop dt#online_shop a:hover,
body.theplace dt#theplace,
body.theplace dt#theplace a,
body.theplace dt#theplace a:hover,
body.no12theplace dt#no12theplace,
body.no12theplace dt#no12theplace a,
body.no12theplace dt#no12theplace a:hover,
body.contact dt#contact,
body.contact dt#contact a, 
body.contact dt#contact a:hover {
	background-position: 0 -100px;
}

#header {
	height:177px;
	background-image:url(images/about2.jpg);
}
/*  this jsut targets the h1 in the header*/
#header h1 {
	float:left;
	margin-top:110px;
	padding-left:4px;
}

#sidebar-a {
		float:right;
		width:450px;
		line-height:18px;
		height:350px;
		overflow:scroll;
		/*to hide horizontal scroll bar*/
		overflow-x:hidden;
}

#sidebar-b {
		margin-right:450px;
		line-height:18px;
}

/*this adds padding to heading 2 and paragraphs*/
#sidebar-b h2, p{
	padding-bottom:15px;
}

/*a class to pad the sidebar-b 9ALL THE WAY ROUND UNLESS SPECIFY LEFT OR RIGHT) with no influence to other sections*/
.padding {
	padding:25px;
}
	
/*clear made footer go below all the previos section- clear both put footer under both sidebars****
the tree items for border top appear when border top selected - same for padding*/
#footer {
	height:66px;
	clear:both;
	font-family: Tahoma, Arial, Helvetica;
	font-size:10px;
	color:#c9c9c9;
	border-top: 1px solid #efefef;
	padding: 13px 25px;
	line-height:18px;
}

/**** text decoration none sets the text to no underlines or colour when variations when linked*/
#footer a {
	color:#c9c9c9;
	text-decoration:none;
}

#footer a:hover {
	color:#003300;
}
/*   this will move the footers navigation to the right   */
#altnav {
	float:right;
}