/*-----------------------------------------------------------------------------
Seaside Creative Core Style Sheet

version:   1.0
author:    Flow Interactive, http://www.flowinteractive.net.au

/*----------------------------------------------------------------------------
COPYRIGHT, ALL RIGHTS RESERVED. THIS FILE MAY NOT BE COPIED OR ALTERED IN ANY WAY
-----------------------------------------------------------------------------*/

/* = General
--------------------------------------------------------*/
body {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 76%;
	color: #333;
	background: #fff url(../i/bodybg.jpg) top left repeat-x;
	margin: 0;
	line-height: 150%;
	text-align: center;
}
a {
	color: #D32D54
}
a img {border: none}
#foot a {color:#333 }
.cntr {text-align:center}
.mtop {margin-top: 5px}
.float {float: left}
.right {text-align:right}

/* = Typography
--------------------------------------------------------*/
h1 {font-weight: bold; color: #D32D54; font-size: 2.5em; margin: 5px 0}
#header h1 {position:relative; left:90px; top: 30px; text-indent: -9000px; background:transparent url(../i/logo.gif) left top no-repeat; width:173px; height:39px}
h2 {font-weight: bold;font-size: 1.3em; color: #D32D54}
#home #content h2{text-indent: -9000px; background:transparent url(../i/hometitle.gif) left top no-repeat; width:346px; height:36px}
#about #content h2 {text-indent: -9000px; background:transparent url(../i/abouttitle.gif) left top no-repeat; width:253px; height:34px}
#waxing #content h2 {text-indent: -9000px; background:transparent url(../i/waxingtitle.gif) left top no-repeat; width:190px; height:36px}
#beauty #content h2 {text-indent: -9000px; background:transparent url(../i/beautytitle.gif) left top no-repeat; width:190px; height:36px}
#contactus #content h2 {text-indent: -9000px; background:transparent url(../i/contactitle.gif) left top no-repeat; width:264px; height:34px}
h3 {font-size: 1em; color:#333; text-transform:uppercase; font-weight:bold}
.col2 h3 {text-indent: -9000px; background:transparent url(../i/gifttitle.gif) left top no-repeat; width:113px; height:27px; margin-left: 20px}
h4 {font-size: 1.2em; color:#D32D54; font-weight: bold; margin: 0}
ul {list-style: disc url(../i/discbul.gif); margin-left: 1.5em}
li {margin-bottom:0.6em}
p {font-size: 1em}
.col2 p {margin: -10px 0 0 20px}
#tel {font-size: 2em; font-weight: bold; text-indent: -9000px; background:transparent url(../i/phone.gif) top left no-repeat; width:124px; height: 20px; margin-top: -5px}
.hlight {font-weight: bold; color:#D32D54}
.big {font-size: 2em}
/* = Menu
----------------------------------------------*/
ul#menu {
	position: absolute; top: 10px; left: 0; width: 145px; margin: 0; padding: 0}
ul#menu li {display: block; list-style-type:none; margin:0}
ul#menu li a {
display:block;
width: 130px;
padding:0.5em 0 0.5em 1em;
color: #666;
font-size: 1em;
text-decoration:none;
border-bottom: 1px solid #ccc
}
ul#menu li a#first {border-top: 1px solid #ccc}
ul#menu li a:hover, ul#menu li a:active {
	font-weight:bold
}
ul#menu li a.sel {background: transparent url(../i/menusel.jpg) top left repeat-y; font-weight: bold}
/* = Containers
----------------------------------------------*/
#wrapper {position: relative; margin:30px auto 0 auto; width: 760px; text-align:left; background:#fff url(../i/wrapperbg.jpg) top left no-repeat}
#container {position: relative; margin:0 auto; width: 740px; text-align:left; background:transparent url(../i/containerbg.jpg) top left no-repeat; padding: 0 10px; border-left: 1px solid #ccc; border-right: 1px solid #ccc}
.col1 {float: left; width: 360px; margin: 10px 0 0 170px}
.col2 {float: right; width: 180px; background:#fff url(../i/col2bg.jpg) top left no-repeat; padding: 10px 0 0 0}
#header {
	position: relative;
	height: 135px;
	background: transparent url(../i/headerbg.jpg) bottom repeat-x;
	margin-bottom: 2px;
	border-bottom:1px solid  #D32D54
}
#logo {
	position: absolute;
	top: 100px;
	left: 40px;
}
#contact {position: absolute; right: 20px; top: 20px; width: 120px; text-align:center; color:#999}
#strapline {position: relative; top: 70px; left: 0; text-align:center; font-weight:bold; font-family:Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:1.4em; color: #D32D54; letter-spacing:0.2em}
#content {
	position: relative;
	width: 100%;
	background:transparent url(../i/contentbg.jpg) 0 10px no-repeat;
}
#wrapperfooter {position: relative; margin:0 auto 0 auto; width: 760px; height: 20px; background:transparent url(../i/contentfooter.png) top left no-repeat}
#footer {
	position:relative;
	margin:0 auto 0 auto; 
	width: 760px;
	font-size: 0.8em;
	color:#333;
	padding: 5px 10px 0 10px
}
#fl, #fr {float: left; width: 50%; top: 0; }
#fr {float: right; width: 45%; text-align:right}
.infoPanel {height: 158px}
#specialoffer {
	position: absolute; bottom: 30px; left: 10px}
/* = Forms
----------------------------------------------*/
form {width: 350px}
#contactform label {float: left; width: 15em; font-weight: bold; color:#333}
#contactform label.txtLabel {width: 7em}
#contactform input.txt {float: left; width: 14em; color:#333; margin: 0 10px 5px 0; border: 1px solid #ccc}
#contactform br {clear: both}
#contactform fieldset {font-weight: bold; color:#333; border: 1px solid #666; padding: 10px}
.err, .req {font-weight:bold; color:#f00; font-size: 1em; float:left}
.err {margin-right: 5px}
.hide {display:none}
textarea {font-family: Arial, helvetica, sans-serif; color:#333; font-size: 1em}
#sendForm {float: right}

/* = Tables
----------------------------------------------*/
.alt {background:#FFEAEA}

/* = Easy Clearing
----------------------------------------------*/
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */