/* -- SF CSS    by Damian's Design - damian@damiansdesign.com	--	*/
/* 	  Created: 	Nov 2009         									*/


/* ---------- ::Defaults:: --------------------- */

@font-face {
    font-family: 'CenturyGothicRegular';
    src: url('../fonts/century_gothic-webfont.eot');
    src: url('../fonts/century_gothic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/century_gothic-webfont.woff') format('woff'),
         url('../fonts/century_gothic-webfont.ttf') format('truetype'),
         url('../fonts/century_gothic-webfont.svg#CenturyGothicRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html { font-size: 12px; }

body
{
	color: #2A52B4;
	font-family: 'CenturyGothicRegular';
	font-size: 12px;
	line-height: 15px;
	background-color: #C8D8E3;
	margin: 0px;
	padding: 0px;
	background-image: url(../images/main-bg.jpg);
	background-position: center top;
}

div.spacer {clear: both; height: 1px;}
div.spacer-med {clear: both; height: 30px;}


/* ---------- ::Typography:: ------------------- */


address, h1, h2, h3, h4, h5, h6, li, p, pre {padding: .3em ;}
h1 {font-size:2em; color: #9D854F; padding: 8px 0 0 0; }
h2
{
	font-size: 20px;
	line-height: 24px;
	margin: 10px 0 20px 25px;
	color: #366AE9;
	padding: 0 0 5px 0;
	background-image: url(../images/h-bg.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	text-transform: lowercase;
}

h3
{
	font-size: 16px;
	color: #AA5F00;
	margin: 20px 0 8px 25px;
	padding: 0;
	text-transform: lowercase;
}

#main h3 {	width: 400px;}

h4 {font-size:1.0em;}
address  {font-size:12px;}
pre {font-size: 12px;}
blockquote {font-size: 12px; margin-left: 10px; width: 90%; font-style: italic; text-align: center;}


p {
	font-size: 13px;
	margin: 0px 35px 15px 25px;
	padding: 0px;
	line-height: 15px;
	text-align: justify;
	text-transform: none;
}

#pane-right p {
	font-size: 13px;
	margin: 0px 0px 15px 20px;
	padding: 0px;
	line-height: 15px;
	text-align: justify;
	text-transform: none;
	width: 90%;
}

p.mission
{
	font-size: 16px;
	line-height: 19px;
	width: 550px;
	font-style: oblique;
}

p.mission-long
{
	font-size: 24px;
	line-height: 27px;
	width:900px;
	font-style: oblique;
	text-align: center;
	margin-bottom: 50px;
	margin-left: 0px;
	margin-top: 40px;
	padding: 0px;
}

.right p {text-align: right;}

.small
{
	font-size: 10px;
	width: 95%;
	line-height: 17px;
	margin: 0 5px 0 10px;
}
.lrg {font-size: 1.5em;}


a.back {
	text-align: right;
	color: #47881d;
	text-decoration: none;
	background-image: url(../images/back.gif);
	background-repeat: no-repeat;
	background-position: right center;
	padding-right: 18px;
	background-color: transparent;
}

a.back:hover {background-image: url(../images/back-over.gif); }

div.christine  {
	position: relative;
	width: 300px;
	height: 60px;
	float: left;
	margin: 10px 0 0 0;
	padding: 0;
}

div.christine p {margin-left: 5px;}

p.quote
{
	font-size: 16px;
	line-height: 18px;
	font-style: oblique;
	color: #62719C;
}

p.testimonial
{
	font-size: 14px;
	line-height: 18px;
	font-style: oblique;
	font-weight: bolder;
	color: #67567E;
	margin-right: 40px;
	margin-bottom: 50px;
	text-align: right;
}

p.note { color: #7F7F7F; margin-top: 30px;}

/* ---------- :: Tables :: --------------------- */

div.table-wrap {
	display: block;
	margin: 10px 0 10px 20px;
	padding: 0px;
	width: 410px;
	position: relative;
}

#main table, #main-grow-top table, #main-grow-mid table  {
	position: relative;
	width: 400px;
	border: none;
	padding-left: 10px;
}

#main table.contact, #main-grow-top table.contact, #main-grow-mid table.contact {width: 410px; margin: 30px 0 0 10px;}

#main table.right-pane, #main-grow-top table.right-pane, #main-grow-mid table.right-pane {margin-left: 30px;}

#main td, #main-grow-top td, #main-grow-mid td
{
	border-spacing: 1px;
	text-align: center;
	background-color: #F5F5F5;
	width: 200px;
	height: 20px;
	color: #0056AA;
	line-height: 18px;
	padding: 0 5px;
}

#main th, #main-grow-top th, #main-grow-mid th
{
	background-color: #0056AA;
	color: #fff;
	height: 25px;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
}

#main td, #main-grow-top td, #main-grow-mid tr.row-b td
{
	background-color: #E9E9FF;
	color: #0056AA;
	text-align: center;
}

#main td.col1, #main-grow-top td.col1, #main-grow-mid td.col1 {
	background-color: #0056AA;
	color: #fff;
	font-weight: bold;
	width: 100px;
	text-align: right;
	vertical-align: top;
}

#main td.col2, #main-grow-top td.col2, #main-grow-mid td.col2 {
	text-align: left;
	margin-left: 15px;
	width: 350px;
}

/* ---------- :: List Syles :: ----------------- */

#main ul, #pane-left ul
{
	list-style-image: url(../images/bullet.gif);
	list-style-type: none;
	width: 380px;
	margin: 20px 0 10px 10px;
}

#main ul.second, #pane-left ul.second { width: 90%; margin: 5px 0 0px 0px;}

#main li, #pane-left li {
	padding-left: 5px;
	line-height: 15px;
	font-size: 13px;
	text-align: left;
}

#pane-right  ul {
	list-style-image: none;
	list-style-type: none;
	width: 180px;
	margin: 0px 0 0 0px;
}

#pane-right li {
	padding: 5px;
	line-height: 16px;
}


#pane-right .content ul
{
	list-style-image: url(../images/bullet.gif);
	list-style-type: none;
	width: 80%;
	margin: 20px 0 20px 20px;
}


#pane-right .content li {
	padding-left: 5px;
	line-height: 14px;
	font-size: 13px;
	text-align: left;
}



/* ---------- ::Links:: ------------------------ */

a 			{text-decoration: underline; color: #3B74FF;}
a:hover 	{text-decoration: none; color: #3B74FF;}
a:visited 	{text-decoration: underline; }
a img 		{border:none;}
a img.logo {
	-webkit-transition:	all .2s ease-in;
	-moz-transition:	all .2s ease-in;
	-o-transition:		all .2s ease-in;
	transition:			all .2s ease-in;	
}
a img.logo:hover {
	box-shadow: 		0 0 8px #3B74FF;
	-moz-box-shadow: 	0 0 8px #3B74FF;
	-webkit-box-shadow: 0 0 8px #3B74FF;
	-webkit-transition:	all .2s ease-in;
	-moz-transition:	all .2s ease-in;
	-o-transition:		all .2s ease-in;
	transition:			all .2s ease-in;	
}
a.link 
{
	color: #3B74FF;
	text-decoration: underline;
	background-image: url(../images/go.png);
	background-repeat: no-repeat;
	background-position: right center;
	padding-right: 20px;
	font-size: 14px;
}

a.link:hover {background-image: url(../images/go-over.png); text-decoration: none;}

a img.logo {
	margin: 10px 5px 0 5px;
}
a img.logo:first-child {margin-left: 20px;}
a img.logo:last-child {margin-bottom: 15px;}
/* ---------- ::Layout:: --------------------- */


#wrap {
	position: relative;
	width: 910px;
	top: 0px;
	margin: 0 auto;
}


/* ---------- :: layout images :: ------------ */

div#client-info-img {
	width: 350px;
	height: 450px;
	position: absolute;
	z-index: 25;
	left: 500px;
	top: 80px;
	display: block;
}

div#client-records-img {
	width: 400px;
	height: 450px;
	position: absolute;
	z-index: 25;
	left: 460px;
	top: 80px;
}

div#remedial-img {
	width: 410px;
	height: 308px;
	position: relative;
	z-index: 25;
	left: 17px;
	top: 20px;
	margin-bottom: 40px;
}

div#infant-info-img {
	width: 380px;
	height: 280px;
	position: absolute;
	z-index: 25;
	left: 490px;
	top: 210px;
}

#swim_school {
	margin-left: 20px;
}
#swim_school img {
	margin-right: 10px;
}
#right-pane img {
	display: block;
	margin: 0 auto;
	padding: 10px;
}


.portrait  {
	margin-left: 40px;
}

.portrait-thin {
	margin-left: 60px;
}

.left-pane {
	margin-left: 20px;
}

.pad {
	margin-top: 20px;
}

.landscape {
	margin: 20px 0 0 20px;
}

.landscape-right {
	margin: 20px 0 0 0px;
}

.left {
	margin-left: 40px;
}

.mission {
	display: block;
	position: relative;
	margin: 20px auto;
	width: 850px;
}

/* ---------- :: Header :: ------------------- */

#header
{
	position: relative;
	top: 0px;
	margin: 0 auto;
	z-index: 15;
	height: 180px;
	width: 910px;
	background-image: url(../images/header-bg.png);
	background-repeat: no-repeat;
	background-position: center top;
	padding: 0px;
}

#header-logo {
	position: relative;
	width: 300px;
	height: 109px;
	top: 5px;
	left: 10px;
}

#register a 
{
	position: absolute;
	width: 250px;
	height: 55px;
	top: 60px;
	left: 605px;

	background-image: url(../images/register.png);
	background-repeat: no-repeat;
	background-position: top left;

	cursor:pointer; cursor:hand;
}


#register a:hover {
	background-image: url(../images/register-over.png);
	background-repeat: no-repeat;
	background-position: top left;
	cursor:pointer; cursor:hand;
}



/* ---------- :: Nav :: ---------------------- */

#nav
{
	position: absolute;
	width: 900px;
	height: 46px;
	top: 122px;
	left: 5px;
	z-index: 15;
	background-color: none;
	padding: 0 35px 0 35px;
}

#nav a {
	text-decoration: none;

}

/* ---------- :: Main :: ---------------------- */

#main, #main-grow-top, #main-grow-mid, #main-grow-bot, #main-lrg-bottom
{
	position: relative;
	width: 910px;
	height: 670px;
	margin: 10px auto ;
	background-image: url(../images/main-bg.png);
	background-repeat: no-repeat;
	background-position: center center;
	z-index: 5;
}
#main-grow-top {
	display: block;
	background-image: url(../images/main-bg-top.png);
	background-position: center center;
	height: 572px;
	margin-bottom: 0;
}
#main-grow-mid {
	display: block;
	background-image: url(../images/main-bg-mid.png);
	background-position: center top;
	background-repeat: repeat-y;
	margin: 0 auto ;
	height: auto;
}
#main-grow-bot {
	display: block;
	background-image: url(../images/main-bg-bot.png);
	background-position: center top;
	height: 91px;
	margin: 0 auto ;
}
#main-lrg-bottom
{
	display: block;
	margin-top: 0 ;
	background-image: url(../images/main-bottom-lrg.png);
	background-position: center top;
	height: 330px;
	background-repeat: no-repeat;
	z-index: 4;
}
#main-images {
	position: relative;
	left: 30px;
	width: 360px;
	padding: 0px;
	margin: 0px;
}

#main-right {
	width: 480px;
	position: reltive;
	float: right;
	margin-left: 10px;
}

#main-right h3
{
	font-size: 16px;
	line-height: 50px;
	color: #2A52B4;
	margin: 10px 0 8px 0px;
	padding: 5px 0 0 60px;
	background-image: url(../images/hand.png);
	background-repeat: no-repeat;
	background-position: left center;
}
#main-right img {	
	display: inline-block;
	margin-top: 5px;
	position: relative;
	top: 5px;
}
#pane-left {
	width: 438px;
	height: 500px;
	position: relative;
	padding: 0px;
	margin: 0px;
}

#pane-right {
	width: 438px;
	height: 520px;
	position: reltive;
	float: right;
	margin-left: 20px;
	margin-top: -20px;
}

#pane-right .side-nav-wrap {
	margin-left: 70px;
	margin-top: 0px;
}

#pane-right .side-nav-top
{
	position: relative;
	margin: 0px;
	padding: 0px;
	width: 230px;
	height: 15px;
	background-image: url(../images/side-nav-top.png);
	background-repeat: no-repeat;
	background-position: center bottom;
}

#pane-right .side-nav-mid
{
	position: relative;
	margin: 0px;
	padding: 0px;
	width: 230px;
	height: auto;
	background-image: url(../images/side-nav-mid.png);
	background-repeat: repeat-y;
	background-position: center top;
}

#pane-right .side-nav-bott
{
	position: relative;
	margin: 0px 0 20px 0;
	padding: 0px;
	width: 230px;
	height: 15px;
	background-image: url(../images/side-nav-bott.png);
	background-repeat: no-repeat;
	background-position: center top;
}


div.left-img {
	width: 146px;
	height: 250px;
	position: relative;
	margin: 0 0 0 30px;
	display: inline-block;
	float: left;
}

/* ---------- :: accordion :: ------------------- */

#accordion {
	width: 870px;
	margin: 20px 0 20px 20px;
}

#accordion h3 { width: auto; }

#accordion p {
	color: #2A52B4;
}

/* ---------- :: Footer :: ---------------------- */

#footer {
	position: absolute;
	bottom: 20px;
	width: 910px;
	margin: 0 auto;
}

#footer p {
	color: #fff;
	margin: 8px 0 0 80px;
	font-size: 12px;
	width: 450px;
	line-height: 14px;
}

#footer a {color: #fff; }

#footer p.right {
	float: right;
	width: 250px;
	text-align: right;
	margin-right: 20px;
}

/* ------------- :: form :: ---------------- */

div#register-form
{
	position: relative;
	width: 900px;
	height: 750px;
	background-position: center center;
	background-image: url(../images/register-bg.jpg);
	background-repeat: no-repeat;
	display: none;
}


#register-form form {
 	margin: 0 auto;
}


span.req {
	color: red;
	font-size: 12px;
	padding-left: 10px;
}

.required-text {
	color: red;
	font-size: 12px;
	padding-left: 10px;
}



#register-form  label.long {width: 400px;}

#register-form  label.left {text-align: left; padding-left: 10px; display: inline;}

fieldset
{
	margin: 10px 0;
	border: 1px solid #2A52B4;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}


label.error {
	color: red;
	display: inline-block;
	float: right;
	position: relative;
	left: -120px;
	z-index: 50;
	top: 5px;
	text-align: left !important;
}

#register-form .label {
	position: relative;
	display: inline-block;
	width: 150px;
	text-align: right;
	margin-right: 10px;
}


#register-form input.hide {
	display: none;
}


#register-form .label-long {
	position: relative;
	display: inline-block;
	width: 350px;
	text-align: left;
	margin-left: 0px;
}

#register-form .radio {
	width: 200px;
	display: inline-block;
	float: left;
	margin-left: 10px;
}

#register-form .check {
	display: inline-block;
	float: left;
	margin-left: 20px;
}

#register-form .rowElem {
	margin-bottom: 5px;
}

#register-form .buttons {
	margin-top: 10px;
}

#register-form .field,.textfield
{
	position: relative;
	display: inline-block;
	padding: 0 0 5px 0;
	width: 200px;
	border: 1px #C3C3C3 solid;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}

#register-form .textfield {
	width: 100%;
	height: 50px;
}
#register-form input,
#register-form textarea {
	-webkit-transition:	all .2s ease-in;
	-moz-transition:	all .2s ease-in;
	-o-transition:		all .2s ease-in;
	transition:			all .2s ease-in;	

}
#register-form input:hover
{
	border: 1px #3A73FB solid;
	background-color: #F0F5FF;
	box-shadow: 		0 0 8px #3B74FF;
	-moz-box-shadow: 	0 0 8px #3B74FF;
	-webkit-box-shadow: 0 0 8px #3B74FF;
	-webkit-transition: all .2s ease-in;
	-moz-transition: 	all .2s ease-in;
	-o-transition: 		all .2s ease-in;
	transition: 		all .2s ease-in;
}

#register-form input:focus
{
	border: 1px #0063A6 solid;
	background-color: #EEEDFF;
	-webkit-transition:	all .2s ease-in;
	-moz-transition:	all .2s ease-in;
	-o-transition:		all .2s ease-in;
	transition:			all .2s ease-in;	
}

#register-form textarea:hover
{
	border: 1px #3A73FB solid;
	background-color: #F0F5FF;
	box-shadow: 		0 0 8px #3B74FF;
	-moz-box-shadow: 	0 0 8px #3B74FF;
	-webkit-box-shadow: 0 0 8px #3B74FF;
	-webkit-transition: all .2s ease-in;
	-moz-transition: 	all .2s ease-in;
	-o-transition: 		all .2s ease-in;
	transition: 		all .2s ease-in;
}
#register-form textarea:focus
{
	border: 1px #0063A6 solid;
	background-color: #EEEDFF;
	-webkit-transition:	all .2s ease-in;
	-moz-transition:	all .2s ease-in;
	-o-transition:		all .2s ease-in;
	transition:			all .2s ease-in;	
}

#register-form .submit {
	width: 90px;
	height: 20px;
	padding: 0 0 7px 0;
	left: 200px;
}

#register-form .reset {margin-right: 30px;}

div.custom-checkbox {width: 300px; }

#capcha div {
	display: relative;
	margin-top: 0px;
	float: left;
	width: 33px;
/*
	width: 570px;
	height: 38px;
*/
}

#capcha p {
	margin-top: 10px;
	width: 380px;
	float: left;
}

.captchaImage { margin: 2px; border 2px solid white; }
.simpleCaptchaSelected { border: 2px solid #393; }

/********************************************/
/** ----------:: jQuery slides ::--------- **/
/********************************************/

#contact_side_slider,
#masage_side_slider,
#aquatics_pricing_slider,
#aquatics_side_slider {
	display: block;
	position: absolute;
	top: 230px;
	left: 455px;
	width: 420px;
	height: 300px;
	background-color: #000;
	z-index: 1000;
	box-shadow: 0 0 2px rgba(0,0,0,0.5);
}

#aquatics_pricing_slider {
	position: relative;
	top: 0px;
	left: 20px;
	width: 400px;
	height: 220px;
	margin-bottom: 50px;
}
#contact_side_slider,
#masage_side_slider {
	position: relative;
	top: 40px;
	left: 60px;
	width: 320px;
	height: 480px;
	margin-bottom: 50px;
}
#contact_side_slider {
	top: 00px;
	left: 20px;
	width: 400px;
	height: 300px;

}