/* CSS styles for Samuel David Hair Salon */
/* coded by DJENAN KOZIC :: 20/12/2007 */

/* ------ THE BASICS ------ */


* { margin:0; padding:0; }

body {
	background-color:#000;
	font-family:Verdana, Helvetica, Arial, sans-serif;
}

a, a:hover, a:active, a img, a, a:hover img, a:active img { outline:none; border:none; }
a { text-decoration:underline; }
a:hover { text-decoration:none; }


/* ------ HEADER ------ */


#header {
	position:relative;
	margin:0 auto;
	background:#000 url('images/header_bg.jpg') no-repeat top left;
	width:900px;
	height:250px;
	border-left:15px solid #fff;
	border-right:15px solid #fff;
	}

h1.logo {
	position:absolute;
	top:18px;
	left:256px;
	}
a.logo {
	display:block;
	text-indent:-5000em;
	background:transparent url('images/logo.gif') no-repeat top left;
	width:609px;
	height:87px;
	}
h2.review {
	background:transparent url('images/rated.gif') no-repeat top left;
	position:absolute;
	top:114px;
	left:418px;
	width:436px;
	height:26px;
	text-indent:-9000em;
	}
h2.contactdetails {
	background:transparent url('images/contact_details.gif') no-repeat top left;
	position:absolute;
	top:182px;
	left:418px;
	width:436px;
	height:54px;
	text-indent:-9000em;
	}


/* ------ NAVIGAITON ------ */


#navigation {
	position:relative;
	width:877px;
	background-color:#fe0269;
	height:36px;
	margin:0 auto;
	padding:11px 0 0 23px;
	border-left:15px solid #fff;
	border-right:15px solid #fff;
	}

	#navigation ul { list-style:none; margin:0; padding:0;}
	#navigation li { display:inline; margin:0; padding:0;}
		#navigation li a { background-image:url('images/nav.gif'); float:left; height:0; padding-top:25px; overflow:hidden; margin-right:23px; }

		#navigation li#nav-1 a { background-position:0 0; width:84px; }
		#navigation li#nav-1 a:hover { background-position:0 -25px; }

		#navigation li#nav-2 a { background-position:-107px 0; width:104px; }
		#navigation li#nav-2 a:hover { background-position:-107px -25px; }

		#navigation li#nav-3 a { background-position:-234px 0; width:84px; }
		#navigation li#nav-3 a:hover { background-position:-234px -25px; }

		#navigation li#nav-4 a { background-position:-342px 0; width:91px; }
		#navigation li#nav-4 a:hover { background-position:-342px -25px; }

		#navigation li#nav-5 a { background-position:-457px 0; width:123px; padding-right:0; margin-right:0; border:none; }
		#navigation li#nav-5 a:hover { background-position:-457px -25px; }


/* ------ CONTENT ------ */


#contentwrapper {
	position:relative;
	width:877px;
	background-color:#dedcdc;
	margin:0 auto 40px auto;
	padding:15px 0 0 23px;
	border-left:15px solid #fff;
	border-right:15px solid #fff;
	border-bottom:15px solid #fff;
	}
div.index {background:#dedcdc url('images/egimg.jpg') no-repeat bottom right}
div.services {background:#dedcdc url('images/services.jpg') no-repeat 633px 20px;}
div.prices {background:#dedcdc url('images/pricesbg.jpg') no-repeat 633px 20px;}
div.gallery {background-image:none}
div.contactus {background:#dedcdc url('images/contactusbg.jpg') no-repeat 633px 20px;}


#gallery {
	width: 850px;
}

div.content {
	float:left;
	padding:0;
	width:583px;
	}

	div.content p {
		color:#2e2c2c;
		font-size:12px;
		font-weight:normal;
		line-height:1.6em;
		padding-top:0.8em;
	}
	
	div.content img {
		margin:0 10px 10px 0;
		border:1px solid #000;
	}

	div.content h2 {
		color:#fe0269;
		font-size:16px;
		font-weight:bold;
		line-height:1.6em;
	}
	div.content h3 {
		color:#2e2c2c;
		font-size:13px;
		font-weight:bold;
		line-height:1.6em;
		padding-top:0.8em;
	}
	div.content h4 {
		color:#2e2c2c;
		font-size:13px;
		font-weight:bold;
		line-height:1.6em;
		padding-top:0.8em;
		padding-bottom:0.8em;
		border-bottom:1px solid #000;
		width:838px;
		margin-bottom:10px;
	}
	div.content h5 {}
	div.content h6 {}

	div.content ol, div.content ul {
		padding-top:0.8em;
		margin-left:16px;
	}
	div.content li {
		color:#2e2c2c;
		font-size:12px;
		font-weight:normal;
		line-height:1.6em;
		}

	div.content a {
		color:#fe0269;
		text-decoration:underline;
		}
	div.content a:hover {
		text-decoration:none;
		}
	div.content a:active {}

#images {
	float:right;
	padding:6px 20px 20px 0;
	width:250px;
	}

	div.images img {}

div.clear { clear:both; }


/* ------ FOOTER ------ */


#footer {
	position:relative;
	margin:20px auto 20px auto;	
	float:left;
	padding:15px 0 0 0;
	width:580px;
	border-top:2px dotted #fe0269;
	}

	#footer p {
		color:#2e2c2c;
		font-size:12px;
		font-weight:normal;
		line-height:1.6em;
	}

	#footer a {
		color:#fe0269;
		text-decoration:underline;
		}
	#footer a:hover {
		text-decoration:none;
		}


/* ------ TABLES ------ */

td.item {
	width:200px;
	color:#2e2c2c;
	font-size:12px;
	font-weight:normal;
	line-height:1.6em;
	border-bottom:1px solid #ccc;
	padding:0 0 0 5px;
	}
td.from {
	width:50px;
	color:#2e2c2c;
	font-size:12px;
	font-weight:normal;
	line-height:1.6em;
	border-bottom:1px solid #ccc;
	padding:0 0 0 5px;
	}
td.price {
	width:105px;
	color:#2e2c2c;
	font-size:12px;
	font-weight:normal;
	line-height:1.6em;
	border-bottom:1px solid #ccc;
	}
td.extra {
	width:50px;
	color:#2e2c2c;
	font-size:12px;
	font-weight:normal;
	line-height:1.6em;
	}