/* 
----------------------------------------------------------------------------
Copyright Einstein Industries 2004. Used with Permission.                             
May not be duplicated or reproduced.

Please check for cross-browser compatibility prior to making changes
MINIMUM BROWSER CHECK :: IE5.x/IE6/Op7/NS7/Safari

CSS Document - layout.css
---------------------------------------------------------------------------- */


/* undo some default styling of common (X)HTML browsers
 * ------------------------------------------------------------------------- */

/* remove default link styles */
:link,:visited { text-decoration:none; }

/* No list-markers by default - must redefine bullets w/ bg graphics */
ul,ol { list-style:none; }

/* Avoid browser default inconsistent heading font-sizes and pre/code */
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }

/* Remove inconsistent (among browsers) default padding or margin */
html,body,div,h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ul,ol,li,pre,form,fieldset,input { margin:0; padding:0; }

/* prevent blue linked image borders */
a img,:link img,:visited img { border:none; }


/* basic elements
 * ------------------------------------------------------------------------- */

/* global */ 
body { 
    background:url("../images/index/bg-body.gif") repeat-x top left #AAA78B;	 
	font:12px/16px "Trebuchet MS", Arial, Helvetica, sans-serif; 
	color:#000;
	}
p,a:link,a:visited,ul,ol,li,dl,dt,dd, h2, h3 { font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#42402B; text-decoration:none; text-align:left; }
p,dl,dt,dd,ul,ol,li { line-height: 14px; }
p,pre,blockquote { margin-bottom:7px; }
a:link,a:visited { color:#5E332A; text-decoration:underline; }
a:hover,a:active { text-decoration:none; }
h1 span,h2 span,h3 span { display:none; }

/* classes */
.thumbs-left { margin:2px 8px 0 0; }
.thumbs-right { margin:2px 0 0 8px; }
.right { text-align:right; }


/* contact forms
 * ------------------------------------------------------------------------- */

/* quick contact */

.submit, .submit-big-contact { width:60px; height:25px;  cursor:pointer; vertical-align:top; margin-left:40px;}

/* main contact */
#big-contact form, #big-contact label, #big-contact input, #big-contact textarea { font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#42402B; }
#big-contact label { position:relative; display:block; text-align:right; color:#42402B; width:150px; }
#big-contact label input, #big-contact label textarea { background-color:#fff; border:0; position:absolute; left:110%; top:-2px; }
#big-contact label input { width:200px; }
#big-contact label textarea { top:0; width:200px; height:100px; }
.submit-big-contact { margin:85px 0 0 165px; }

form {
	width:137px;
	margin:10px 0 15px 0; /* set margin left and right below */
	padding:10px 0 15px 43px;
	}

form label	{ font-size:.95em; } 

input, textarea, select { 
	background-color:#FFFEFA !important; /* to prevent highlighting by Google Toolbar */
	color:#000;
	width:132px; /* 5 pixles smaller than form width !important */
	height:18px;
	line-height:18px;
	vertical-align: middle;
	margin-bottom:4px; /* sets vertical spacing between fields */
	padding-top:1px; /* vertically position text in input/textarea field */
	padding-left:4px; /* horizontally position text in input/textarea field */
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; 
	font-size:1.0em;
	}
fieldset {border:none;}
select { width:150px; padding:0; } /* same width as form - !important */

textarea { height:90px; overflow:auto; }

#contact_business { display: none; } /* do not remove */ 


/* skeleton
 * ------------------------------------------------------------------------- */
#wrap { background:url("../images/index/bg-index.gif") repeat-y; width:760px; margin:0 auto; }
 #top { position:relative; background:url("../images/index/top.jpg") no-repeat; height:143px; position:relative; }
 #top a{ position:absolute; top:50px; left:46px; height:82px; width:280px;}
 #top a span {display:none;}
 
 #column-left { width:207px; float:left; }
 #column-left p { padding-left:43px; padding-right:25px; }
  #header-quick-contact { background:url("../images/index/header-quick-contact.gif") no-repeat; height:50px; }
  #header-locate-contact { background:url("../images/inside/locate.jpg") no-repeat; height:50px; }
 #column-right { width:553px; float:left; }
 #column-right p,#column-right h2,#column-right h3{ padding-left:24px; padding-right:49px; padding-bottom:5px;} 
 #about_ul {padding-left:24px; padding-bottom:30px;}
  #banner { background:url("../images/index/banner.jpg") no-repeat; width:553px; height:196px; }
  #noflash { width:533px; height:196px; }
  #header-welcome{ background:url("../images/index/header-welcome.jpg") no-repeat; height:50px; }
  
  #wrap-feautre-procedures { background:url("../images/index/bg-feature-procedures.jpg") repeat-y; margin-top:30px; }
   #header-feature-procedures { background:url("../images/index/header-feature-procedures.jpg") no-repeat; height:56px; position:relative; }
   #column-one { width:187px; float:left; }
   #column-one ul { padding-left: 51px; }
   #column-two { width:321px; float:left; padding-left:26px; }
   #bottom-feature-procedures { background:url("../images/index/bottom-feature-procedures.jpg") no-repeat; height:14px; clear:both; overflow:hidden; }
  
  #wrap-feature-gallery { background:url("../images/index/bg-girl.jpg") bottom right no-repeat; padding-bottom:10px; }
  #wrap-feature-gallery p { padding-right:150px; } 
   #header-feature-gallery { background:url("../images/index/header-feature-gallery.jpg") no-repeat; height:58px; }
  
 #bottom { background:url("../images/index/bottom.gif") no-repeat; width:760px; height:11px; clear:both; overflow:hidden; }

  

/* skeleton inside
 * ------------------------------------------------------------------------- */
 #header-about-the-practice { background:url("../images/inside/header-about-the-practice.jpg") no-repeat; height:50px; }
 #header-contact { background:url("../images/inside/header-contact.jpg") no-repeat; height:50px; }
 #header-thanks { background:url("../images/inside/header-thankyou.jpg") no-repeat; height:50px; }
 #header-cosmetic { background:url("../images/inside/header-cosmetic.jpg") no-repeat; height:50px; }
 #header-gallery { background:url("../images/inside/header-gallery.jpg") no-repeat; height:50px; }
 #header-procedures { background:url("../images/inside/header-procedures.jpg") no-repeat; height:50px; }
 #header-sitemap { background:url("../images/inside/header-sitemap.jpg") no-repeat; height:50px; }
 #bna { width:542px; height:440px; }
 h1 {font-size:1.2em;color:#696544; padding-left:24px; padding-right:49px; margin-bottom:5px; text-align:left;}
 h2{font-size:1.1em;}
 #home_ul {list-style-image:url(../images/index/list_img.gif); padding-left: 15px; margin-left:17px;}
 .inside_ul {list-style-image:url(../images/index/list_img.gif); padding-left: 25px; margin-left:17px; padding-bottom:15px;}
 .img_break{ 
 	background: url(../images/img_break.gif)  left center no-repeat;
	width:553px;
	height:35px;
	padding-bottom:10px;
 }
 .img_break_repeat{ 
 	background: url(../images/img_break_repeatable.gif)  left top repeat-x;
	width:373px;
	height:2px;
	margin:10px 0;
	margin-left:24px;
	padding:0px;
 }
 .img_break a { background:url(../images/index/list_img.gif) left center no-repeat; padding-left:15px;margin-right:50px;}
 .img_align {padding-bottom:10px;float:right; margin-right:50px;}
 .doc_img { margin:0 10px 5px 23px; float:left; border:2px solid #aaa78b;}
 .doc_bio { margin-bottom: 0px;}
 li.doctor-margin {margin-left:20px;}
/* -----footer ------------------------------------------------------------------------- */
#footer { width:726px; text-align:center; margin:0 auto; }
#footer a:visited, #footer p {  color:#fff; text-align:center; }
#footer a:link,#footer a:visited, #footer a:hover, #footer a:active {text-decoration:underline;color:#fff; text-align:center; }

#footer ul {margin:10px; text-align:center;}
	#footer li { /* if your li's float, you can adjust border height w/ line-height */
		padding:0 5px 0 7px; /* adjusts the spacing between each li display and border-left */
		display:inline;
		border-left: 1px solid #fff;
		}
	#footer li a{text-decoration:none;}
	#footer li.first { border: none; }


/* vertical navigation
 * ------------------------------------------------------------------------- */

#nav { background:url("../images/index/nav.gif") no-repeat; width:207px; height:196px; position:relative; }
#nav li { position:absolute; }
#nav li, #nav a { height:29px; display:block; }
#nav a { margin-left:20px; }
#nav span { display: none; }

#nav-01, #nav-02, #nav-03, #nav-04, #nav-05, #nav-06 { width:207px; }

#nav-01 { top:8px; }
#nav-02 { top:36px; }
#nav-03 { top:67px; }
#nav-04 { top:98px; }
#nav-05 { top:129px; }
#nav-06 { top:160px; }

#nav-01 a:hover { background: transparent url("../images/index/nav.gif") -227px  -5px  no-repeat;}
#nav-02 a:hover { background: transparent url("../images/index/nav.gif") -227px  -36px  no-repeat;}
#nav-03 a:hover { background: transparent url("../images/index/nav.gif") -227px  -67px  no-repeat;}
#nav-04 a:hover { background: transparent url("../images/index/nav.gif") -227px  -98px  no-repeat;}
#nav-05 a:hover { background: transparent url("../images/index/nav.gif") -227px  -129px  no-repeat;}
#nav-06 a:hover { background: transparent url("../images/index/nav.gif") -227px  -160px  no-repeat;}

/* -------------- use hover state on page being viewed ---------------------------- */
body#home #nav-01 a { background: transparent url("../images/index/nav.gif") -227px  -5px  no-repeat;}
body#about #nav-02 a { background: transparent url("../images/index/nav.gif") -227px  -36px  no-repeat;}
body#procedures #nav-03 a { background: transparent url("../images/index/nav.gif") -227px  -67px  no-repeat;}
body#cosmetic #nav-04 a { background: transparent url("../images/index/nav.gif") -227px  -98px  no-repeat;}
body#gallery #nav-05 a { background: transparent url("../images/index/nav.gif") -227px  -129px  no-repeat;}
body#contact #nav-06 a { background: transparent url("../images/index/nav.gif") -227px  -160px  no-repeat;}
