@charset "utf-8";
/* CSS Document */

/*

YOUR PERSONAL HAIRSYLIST

---------------- TABLE OF CONTENTS ----------------

		- general, resets and headings
		- Layout
		- Content
		- Form Styles
		- Menus - sitemap, main, footer
		
		Home Page styles found in home.css
			
		
--------------------- COLOURS ---------------------

		background colour - #
		body text - #
		headings  - #
		
/*
		
/* ------- GENERAL ------- */

body{
	margin:0;
	background-color:#030303;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#898989;
	}

a:link, a:active, a:visited{
	color:#f06eaa;
	text-decoration:none;
	}
a:hover{
	text-decoration:underline;
	}

form, h1, h2, h3{
	margin:0;
	padding:0;
	}
h1{
	margin-bottom:24px;
	font-size:24px;
	font-weight:normal;
	color:#dc449e;
	text-transform:uppercase;
	line-height:18px;
	}
h2{
	font-size:24px;
	font-weight:normal;
	color:#dc449e;
	line-height:normal;
	}
h3{
	margin-bottom:10px;
	font-size:14px;
	font-weight:normal;
	color:#ec008c;
	}

img{
	border:0;
	}
img.border{}

.clear{
	clear:left;
	}
.smalltext{
	font-size:10px;
	}
.smalltext2{
	font-size:10px;
	color:#898989;
	line-height:normal;
	}
.title{
	font-size:14px;
	font-weight:normal;
	color:#ec008c;
	}
	
/* -------- LAYOUT ------- */

#container{
	width:955px;
	margin:auto;
	background-image:url(/images/background-glow.jpg);
	background-repeat:no-repeat;
	background-position:0 108px;
	}
#header{
	height:65px;
	background-image:url(/images/flash-place-holder.jpg);
	background-repeat:no-repeat;
	}
	
#content{
	margin:0 88px 0 87px;
	border:2px solid #030303;
	}
#top{ /* contains the main menu with the flash background */
	height:209px;
	position:relative;
	}
#flash{
	position:absolute;
	top:0;
	left:0;
	z-index:0;
	}


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

.points{
	height:75px;
	border-top:2px solid #030303;
	border-bottom:2px solid #030303;
	}
.points a{
	width:259px;
	height:75px;
	background-repeat:no-repeat;
	background-position:left;
	display:block;
	float:left;
	}
.points a:hover{
	background-position:right;
	}
.points span{
	display:none;
	}
.points a.bridal{
	background-image:url(/images/points-sm-bridal-formal.gif);
	}
.points a.extensions{
	background-image:url(/images/points-sm-hair-extensions.gif);
	border-left:2px solid #030303;
	border-right:2px solid #030303;
	}
.points a.shop{
	width:254px;
	background-image:url(/images/points-sm-shop.gif);
	}
	
	
#page-content{
	margin-bottom:20px;
	padding:35px 31px 20px 31px;
	line-height:18px;
	background-image:url(/images/phone.gif);
	background-repeat:no-repeat;
	background-position:bottom left;
	}
.page-column{
	width:325px;
	margin-right: 5px;
	padding-right: 10px;
	padding-bottom:20px;
	margin-bottom:20px;
	float:left;
	}
	
.page-image, .page-gallery{
	width:328px;
	margin-left:46px;
	padding-top:63px;
	float:left;
	}
.page-image img{
	margin-bottom:17px;
	}
	
.page-gallery{
	width:350px;
	margin-left:24px;
	background-image:url(/images/heading-gallery.gif);
	background-repeat:no-repeat;
	background-position:22px 6px;
	}
.page-gallery img{
	margin:0 0 17px 22px;
	}
.pgprevious, a.pgnext{
	width:55px;
	height:21px;
	background-image:url(/images/gallery-next.gif);
	background-repeat:no-repeat;
	background-position:left;
	display:block;
	}
a.pgnext{
	float:right;
	}
a.pgprevious{
	width:100px;
	margin-left:22px;
	background-image:url(/images/gallery-previous.gif);
	}
a.pgprevious:hover, a.pgnext:hover{
	background-position:right;
	}
a.pgprevious span, a.pgnext span{
	display:none;
	}
	
.contact{
	clear:left;
	padding: 10px 0;
	}


/* ----- FORM STYLES ----- */

input, textarea{
	padding:2px;
	background-color:#111111;
	border:1px solid #9e005d;
	color:#f06eaa;
	}
textarea{
	
	font-family:Verdana, Arial, Helvetica, sans-serif;
	}
select{
	padding:1px;
	background-color:#111111;
	border:1px solid #9e005d;
	color:#f06eaa;
	}
.btn{
	border:none;
	padding:0;
	}
input.field{
	width:95px;
	margin-left:3px;
	}
.form{
	margin-bottom:10px;
	}
.form th{
	font-weight:normal;
	color:#f06eaa;
	text-align:left;
	padding-right:10px;
	text-align:right;
	font-size:12px;
	}
.form td{
	padding:3px 0;
	}

.form td.required{
	background-image:url(/images/required.gif);
	background-repeat:no-repeat;
	background-position:right;
}


/* -------- MENUS -------- */

/* Site Map */

#sitemap{
	margin:20px 0 10px 0;
	padding:0 87px;
	color:#464646;
	text-align:right;
	}
#sitemap a:link, #sitemap a:active, #sitemap a:visited{
	padding:0 20px;
	color:#464646;
	}
#sitemap a:hover{
	color:#f06eaa;
	text-decoration:none;
	}

/* Main menu */

#mainmenu{
	width:229px;
	padding:5px 17px 17px 17px;
	font-size:14px;
	z-index:5;
	position:absolute;
	}
#mainmenu a:link, #mainmenu a:active, #mainmenu a:visited{
	padding:4px 0 3px 14px;
	color:#ffffff;
	display:block;
	}
#mainmenu a:hover{
	text-decoration:none;
	background-image:url(/images/menu-bullet.gif);
	background-repeat:no-repeat;
	background-position:left;
	}

/* Footer */

#footer{
	padding:10px 0;
	background-image:url(/images/background-footer.jpg);
	background-repeat:no-repeat;
	background-position:top;
	color:#c2c2c2;
	text-align:center;
	}
#footer a:link, #footer a:active, #footer a:visited{
	padding-left:10px;
	color:#c2c2c2;
	}
#footer a:hover{
	color:#ec008c;
	text-decoration:none;
	}

.notification {
	margin: 10px 0 10px 0;
	padding: 5px 5px 5px 20px;
	display:block;
	background-image:url(/images/icon-tick.gif);
	background-repeat:no-repeat;
	background-position:top left;
	background-color:#111111;
	border:1px dotted #9e005d;
	color:#f06eaa;
}
.error {
	margin: 10px 0 10px 0;
	padding: 5px 5px 5px 20px;
	display:block;
	background-image:url(/images/icon-cross.gif);
	background-repeat:no-repeat;
	background-position:top left;
	background-color:#111111;
	border:1px solid #9e005d;
	color:#f06eaa;
}

