/*
Author:         Robbii
Author URI:     http://www.rabbitroyalty.com/
Version:	   	1.6
Project:		Tripark Derm
Description:
*/

/*
---------------------------------------------------------------------------------------
TABLE OF CONTENTS
	-- RESETS
	-- BASICS
	-- STRUCTURE
	-- CUSTOM
---------------------------------------------------------------------------------------
*/

/*__  TOOLS __

border:solid 1px red;


*/




/*---------------------------------------------------------------------------------------
--- RESETS
---------------------------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
	p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	b, u, i, center,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td { 
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-size: 100%;
		vertical-align: baseline;
		background: transparent;
		text-align:left;
	}
	body {
		line-height: 1;
	}
	ol, ul {
		list-style: none;
	}
	blockquote, q {
		quotes: none;
	}
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
	}
	:focus {
		outline: 0;
	}
	ins {
		text-decoration: none;
	}
	del {
		text-decoration: line-through;
	}
	table {
		border-collapse: collapse;
		border-spacing: 0;
	}

@font-face {font-family: 'futura02'; src: url('../files/futura02.ttf'), url('../files/futura02.eot');}


/*---------------------------------------------------------------------------------------
--- BASICS / CONTROLS
---------------------------------------------------------------------------------------*/

html{		font-size:100%;	min-height:100%;}
body{		font-size:62.5%; color:#666; background-color:#939695;}

a{ text-decoration:none; color:#5f6062;}
a:hover{ color:#fff;}
a:active{ color:#414143; }
a:visited{ }

.left{	float:left; }
.right{	float:right; }
.clear{	clear:both; }
.padding{	padding:10px; }
.alignRight{ text-align:right;}

.test {border: solid 1px red;}
.block{ display:block; width:auto;}
.button{ width:194px; height:35px;}

.hidden{display:none; visibility:hidden;}
.hidden2{position: absolute; top: -10000px;}

.indent { margin-left:25px;}
.indenta { margin-left:10px;}
.indent1 { margin-left: 50px;}
.indent2 { margin-left: 60px;}
.indent2b { margin-left: 70px;}
.indent3 { margin-left: 100px;}
.indent3b { margin-left: 125px;}
.indent3c { margin-left: 140px;}
.indent4 { margin-left: 150px;}
.indent4b { margin-left: 160px;}
.indent4c { margin-left: 170px;}
.indent5 { margin-left: 200px;}
.indent5a { margin-left: 225px;}
.indent5b { margin-left: 245px;}

.em { color:#5f6062; }
.em2 { color:#fff;}

.top{ margin-top:50px;}
.topa{ margin-top:35px;}
.topa2{ margin-top:25px;}
.topb{ margin-top:70px;}
.topb2{ margin-top:80px;}
.topc{ margin-top:90px;}
.top1{ margin-top:100px;}
.top1b{ margin-top:125px;}
.top1c{ margin-top:140px;}
.top2{ margin-top:150px;}
.top2b{ margin-top:175px;}
.top3{ margin-top: 200px;}
.top3b{ margin-top: 218px;}
.top3c{ margin-top: 240px;}
.top4{ margin-top: 250px;}
.top4b{ margin-top: 260px;}
.top4c{ margin-top: 275px;}
.top5{ margin-top: 300px;}
.top5b{ margin-top: 325px;}
.top5c{ margin-top: 340px;}
.top6 { margin-top:350px;}
.top6b { margin-top:365px;}
.top6c { margin-top:385px;}

#content p{	margin:0; }



/*---------------------------------------------------------------------------------------
--- STRUCTURE					 
---------------------------------------------------------------------------------------*/

#container{ width:990px; height:auto; margin: 0 auto; position:relative; display:block;}
#content{height:auto; width:auto; display:block; position:absolute; top: 0px;}

#nav{display:block; padding-left:67px; padding-top:15px; text-transform:uppercase;}

#header{ width:300px; height:500px; position:relative; display:block; left:50px; top:50px;}
#header2{ width:300px; height:500px; position:relative; display:block; left:50px; top:50px;}
#footer{ bottom:10px; right:0px; z-index:-10; padding-right:40px; display:block; position:absolute; clear:both;}


/*---------------------------------------------------------------------------------------
---CUSTOM [ STYLING FOR TEXT AND STRUCTURE ]
---------------------------------------------------------------------------------------*/
#logo{ display:block; width:291px; height:106px;background:url(../images/logo.png) no-repeat;}
#logo:hover{ cursor:pointer;}
#logo h1{ text-indent:-999em; width:291px; height:106px;}

#header ul{ font:normal 12pt/25px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; }
#header2 ul{ font:normal 12pt/25px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; }

#header li a:hover { color:#fff;}
#header2 li a:hover { color:#fff;}

.active{ color:#fff;}
a.active{ color:#fff !important;}

#content a:visited{ }

#nav li{ margin-top:5px; font-size:13px;letter-spacing:1px;}
/*OLD SELECTION color:#5f6062; color:#464849;*/
#nav li a{ color:#464849;}
h1{ color:#5f6062; text-transform:uppercase; font-size:20pt;}
h2{ color:#fff; margin-bottom:5px; text-transform:uppercase; font-size:18pt;}
h3{ color:#5f6062; text-transform:uppercase;}
h4{ color:#fff; text-transform:uppercase;}

.back{ display:block; position:absolute; bottom:10px;}
div .back p:first-child { position:absolute;  width:170px; left:360px;}
.abso{ display:block; position:absolute;}
.ztop{ z-index:100;}
.nudge{ padding-top:20px;}


/* HOME */


.home{ display: block; position: absolute; top: 170px; left: 253px;}
.home2{ display:none; background:url(../images/pages/home_pic_2.jpg) no-repeat; width:706px; height:446px;}
.home2 span img{ z-index:3; position: absolute; left: 15px; top: 387px;}
.homeNav{ display: block; }
.imgHome1{ display:none; width:706px; height:446px; background:url(../images/pages/home_pic_1.jpg) no-repeat;}

.hope { display:none; position:absolute; width: 80px; top: 151px; left: 889px; font-size:9pt;}

#logoWrap{display:none; width:291px; height:106px;}

#nav2{display:none; padding-left:67px; padding-top:15px; text-transform:uppercase;}
#nav2 li{ margin-top:5px; font-size:13px; letter-spacing:1px;}
#nav2 li a{ color:#464849;}

/* PROFILE */

.profile{ display: block; position: absolute; width: 587px; height: 100%; top: 170px; left:328px;}
.profile img{ float:left;}
.profileImg { float:left; display:block; width:109px; height:136px; background:#a8a8a8;}
.profilePost{ display:block; position: relative; padding-left:122px; padding-bottom:3em;}
.profile p{ padding-top:1.1em; font-size:14px; line-height:18px; color:#5f6062;}
.profile p span{ margin-bottom:20px; display:block;}

/* MEDICAL */

.medical{ position:absolute; width:482px; top:56px; left:380px; }
.medical img{ z-index:-2; position:absolute;}

.medical ul{ font-size:13pt; text-indent:-10px; display:block; margin-top:-70px; line-height:1.5em;}
.medical ol{ font-size:14px; display:block;line-height:1.35em;}
.medSec { display:block; float:left; width:200px;}
#medSecWrapper { margin-left:10px;}

.medical h2{ text-transform:uppercase; font-size:16pt;}
.medicalTextWrap{ margin-top:60px;}
.medicalTextWrap p{ font-size:14px; line-height:1.5em;}
.medical div{ clear:both; width:453px; padding-left:10px; padding-top:10px; position: relative; top: 0px; display:block;}
.medical div p a{ color:#fff;}
.medical div p a:hover{ color:#5f6062;}

			/* MEDICAL TREATMENTS */
			.medical dl.this{ display:block; padding-left:10px; padding-top:175px;}
			.medical dt{ font-size:13pt; text-transform:uppercase; letter-spacing:1px; color:#fff !important; line-height:2.75em;}
			.medical dt a{ color:#fff;}
			.medical dt a:hover{ color:#5f6062;}

			.medical2{ position:absolute; width:545px; height:537px; top:146px; left: 270px; }
			.medical2 img.bk{ position:absolute; z-index:-100;}
			.medical2 div{ padding-left:10px;}
			.medical2 h2{ text-transform:uppercase; font-size:16pt;}
			.medicalTextWrap2{ margin-top: 30px;}
			.medicalTextWrap2 p{ font-size:14px; line-height:1.5em;}
			
			.medicalTextWrap2 p a{ display:block; font-size:8pt;}
			.medical2 q{ text-transform:uppercase; font-size:19pt; color:#fff; padding-top:36px; display:block; letter-spacing:1px;}
			
			.medicalImg{ width:482px; height:632px; background: url(../images/pages/medical_pic.jpg) no-repeat; position:absolute; z-index:-2;}
			.medical div.medicalImg{ padding-left:10px; padding-top:13px; position:absolute; top: 0px; display:block;}
 
			.free{ display:block; position:absolute; z-index:2; width: 600px; text-transform:uppercase; font-size:19pt; color:#fff; padding-top:55px; display:block; letter-spacing:1px; top: 320px; left: 400px;}
			.free2{ display:block; position:absolute; z-index:2; width: 626px; text-transform:uppercase; font-size:19pt; color:#fff; padding-top:55px; display:block; letter-spacing:1px; top: 320px; left: 325px;}
			.free3{ display:block; position:absolute; z-index:2; width: 626px; text-transform:uppercase; font-size:19pt; color:#fff; padding-top:55px; display:block; letter-spacing:1px; top: 320px; left: 290px;}


/* COSMETIC */
.medicalCosmoWrap{ padding-top:50px;}

.cosmeticTextWrap{ display:block; margin-top:-50px;}
.cosmeticTextWrap p{ font-size:13pt; line-height:1.5em;}
.medical div.cosmeticImg{ padding-left:10px; padding-top:13px; position:absolute; top: 0px; display:block;}
.cosmeticImg{ width:482px; height:587px; background: url(../images/pages/cosmetic.jpg) no-repeat; position:absolute; z-index:-2;}

.medical div ul{ display:block; padding-left:10px; padding-top:140px;}
.medical div li a{ display:block; color:#fff; font-size:13pt; text-transform:uppercase; color:#fff; margin-bottom:28px; height:22px; width:100%;}
.medical div li a:hover{ color:#5f6062;}

.medicalTextWrap2 p span{ margin-bottom:1px; display:block;}


/* PRODUCTS */
.product{ display: block; position: absolute; top: 182px; left: 280px;}
.productImg{ width:642px; height:475px; background: url(../images/pages/products.jpg) no-repeat;}
.product img{ z-index:-2; position:absolute;}
.product h2{ margin-bottom:14px; width:642px; font-size:17pt;}
.product h3{ font-size:18pt; margin-bottom:4px;}
.product p{ font-size:10pt; line-height:1.25em;}
.landing{ width:194px; height:272px; position:absolute; left:260px; top:160px;}
.productInfo{ width:160px; height:272px; margin-left:470px; margin-top:30px;}
.productInfo2{ width:180px; height:140px; margin-left:10px;}
.product address{ text-transform:uppercase; font-size:8pt; line-height:1.25em;}
.productInfo p{ text-transform:uppercase; font-size:8pt; line-height:1.25em;}

.landing ul{ margin-top:30px; color:#fff;}
.landing li{ font-size:13pt; text-transform:uppercase; letter-spacing:1px; color:#fff !important; line-height:2.75em;}
.landing li a{ color:#fff;}
.landing li a:hover{ color:#5f6062;}
.landing li a:visited{ }


/* INSURANCE */
.insurance{ margin-top:220px; margin-left:10px; display:block;}
.insurance h3{ color:#5f6062; font-size:14pt; text-transform:uppercase; letter-spacing:1px;}
.insurance ul li{ color:#fff; font-size:12pt; text-transform:uppercase; margin-bottom:11px; letter-spacing:1px;}
.medical div.insurance ul{ font-size:14px; text-indent:-10px; display:block; margin-top:-10px; line-height:1.2em;}


/* REGISTRATION */

.register{ display: block; position: absolute; width: 370px; height: 100%; top: 170px; left:328px;}
.register p{ font-size:14px; line-height:1.5em;}
.register h3{ display:block; margin-bottom:10px; font-size:13pt;}
.register h6{ color:#fff; text-transform: uppercase; font-size:18pt; display:block; margin:10px 0 20px 0;}
.register a:hover{ color:#ced1d6;}
.register a{ display:block; width:113px; text-align:center; float:left; margin:10px 50px 26px 0;}
.register a span{ clear:both; display:block; margin:0 auto; text-align:center;}
.register img{ margin-bottom:4px;}
.register img:hover{ cursor:pointer; opacity:.7;}

/* SCHEDULE */

.schedule{ display: block; position: absolute; width: 670px; height: 100%; top: 170px; left:328px;}
.schedule p{ font-size:14px; line-height:1.5em;}
.schedule h3{ display:block; margin-bottom:10px; font-size:14pt;}
.schedule a{ color:#fff; text-transform: uppercase; font-size:20pt; display:block; margin:10px 0 20px 0;}
.schedule a:hover{ color:#5f6062;}


/* LINKS */

.links{ display: block; position: absolute; width: 587px; height: 100%; top: 170px; left:328px; }
.links h3{ display:block; margin-bottom:10px; font-size:11pt; letter-spacing:1px; text-align:right;}
.links div p{ color:#fff; padding-bottom:20px; display:block; font-size:10pt; line-height: 1.5em; text-align:right;}
.links a{color:#fff;}
.links a:hover{color:#5f6062;}
.medical div.insurance ul{ display:block; padding-left:10px; padding-top:4px;}


/* CONTACT */

.contact{ position:absolute; width:545px; top:146px; left: 270px; color:#fff; font-size:11pt;}

.contact div{ display:block; padding-left:25px; margin-top:190px; letter-spacing:1px;}

.contact p{ display:block; padding-bottom:20px;}
.contact img{ position:absolute; z-index:-2;}
.contact h4{ display:block; margin-bottom:2px; font-size:14pt; letter-spacing:1px;}
.contact a{ color:#fff;}
.contact a:hover{ color:#5f6062;}
#footer p{ font:normal 7pt "Times New Roman", Times, serif; text-transform:uppercase;}

/* HOURS */

.hours{position:absolute; width:545px; top:187px; left: 270px; color:#fff; font-size:11pt;}

.hoursBig{ display:block; padding-left:25px; margin-top:280px; height:160px; letter-spacing:1px;}
.hours img{ position:absolute; z-index:-2;}
.hours h4{ letter-spacing:1px; margin-bottom:5px;}
.hoursBox{ padding-top:6px; width:270px; height:130px; margin-left:2px;}

.hoursBox li:first-child{ margin-top:0;}
.hoursBox li{ font-size:12px; text-transform:uppercase; margin-top:8px;}
.hoursBox span{ position:absolute; left:130px;}


/* LOCATION */
.location{ display: block; position: absolute; top: 175px; left: 280px; width:558px; height:290px;}
.location2{line-height:1.25em; font-size:10pt; color:#fff;}
.location span{ display:block; height:2px;}
.location dt{ text-transform:uppercase; font-size:10px;}
.location .location2 a{ text-transform:uppercase; font-size:10px; float:left; color:#5f6062 !important;}
.location .location2 a:hover{ color:#fff !important;}
.location address{ text-transform:none; padding:0;}
.location img{ float:right;}