/* 
----------------------------------------------------------------------------
Copyright Einstein Industries 2005. 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

// WARNING: Some ids/classes are sharing the same attributes such as floats/width/heights.
			It is an effort to make the css file size lightweight as much as possible.

CSS Document - styles.css
---------------------------------------------------------------------------- */

/* undo some default styling of common (X)HTML browsers
 * ------------------------------------------------------------------------- */

ul,ol { list-style: none; }
h1,h2,h3,h4,h5,h6,pre,code { font-size: 1em; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,div,dd,dt,dl { margin: 0; padding: 0; }
a img,:link img,:visited img { border: none; }

/* HTML
---------------------------------------------------------------------------- */
html,body { height: 100%; }

body {
	margin: 0 auto;
	text-align: center;
	font: 12px/17px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	height: 100%;
	background: #ecc867 url(../images/body-bg.jpg) repeat-x;
	color: #502508;
}

a { text-decoration: underline; color:#954208;}
a:hover { text-decoration: none; }
fieldset { border: none; }
em strong { display: block; visibility: hidden; }

/* Layout
---------------------------------------------------------------------------- */
#top, #mast, #mid-container, #nav, #actual-nav, #content-container, #pre-footer, #footer { width: 778px; }
#top {
	margin: 0 auto;
	text-align: left;
	background: url("../images/wrap-bg.jpg") repeat-y;
}
#mast, #mast-call, #mast-header { height: 80px; }
#mast { background: url(../images/mast-bg.jpg) repeat-x; }

#mast-call, #mast-header, #vert-nav, #splash-index, #left-col, #right-col, #panel-container, #div-index-bot, #hdr-practiced-proven, #hdr-meet-dr, #hdr-office-info { float: left; }

	#mast-call { width: 505px; background: url(../images/mast-call.jpg) no-repeat; }
	
#mast-header {
	position:relative;
	background:url("../images/mast-header.jpg");
	height:80px;
	width: 273px;
	}
	/* index page link within #masthead */		
	#mast-header a {
	position:absolute;
	left:0px;
	width:248px;
	top:36px;
	height:46px;
		}
	#mast-header a span {
		display:none;
		}
	
	
		#mast-call span, #mast-header span, .splash-default span, .hdr-default span, .hdr-default-2 span, #hdr-patient-gallery a span { display: none; }

#splash-index, .splash-default { width: 513px; height: 293px; }
	#splash-index { background: url(../images/splash-index.jpg); }

#left-col, #hdr-comp-consult, #hdr-office-info, #img-part, #hdr-patient-gallery, #div-patient-gallery-bg { width: 215px; }
#right-col, #hdr-personalized-care, #panel-container, #div-index-bot, .hdr-default-2 { width: 563px; }

#left-col p { text-align: center; margin: 0 18px 12px 32px; }
#img-part { height: 82px; background: url(../images/img-part.jpg); }

#div-patient-gallery { height: 216px; background: url(../images/div-patient-gallery-bg.jpg) no-repeat; }

#panel-container { height: auto; background: url(../images/div-index-bg.jpg) repeat-y; }

#right-col p { margin: 0 54px 12px 22px; }
#right-col h1 { margin: 0 54px 12px 22px; font-size: 14px; color: #954208}
#right-col h2 { margin: 0 54px 12px 22px; font-size: 13px;}
#right-col h3 { margin: 0 54px 12px 22px; font-size: 12px;}
#right-col ul { margin: 0 54px 12px 32px; list-style-position: inside; list-style-type: square; }


#pre-footer { height: 16px; background: url(../images/pre-footer.jpg); overflow: hidden; }
#footer { margin: 6px auto; text-align: center; padding-bottom: 18px; }
	#footer ul { margin-bottom: 11px; }
	#footer li { display: inline; padding: 0 5px 0 7px; border-left: 1px solid #000; }
	#footer p { margin: 0 24px 11px; }
	#footer li.first { border-left: none; }

/* left-col headers */
#hdr-comp-consult { height: 84px; background: url(../images/headers/hdr-comp-consult.jpg) no-repeat; }
#hdr-office-info{ height: 84px; background: url(../images/headers/hdr-office-info.jpg) no-repeat; }
#hdr-patient-gallery { height: 57px; background: url(../images/headers/hdr-patient-gallery.jpg); }
	#hdr-patient-gallery a { display: block; margin: 24px 0 0 44px; width: 139px; height: 12px; }

/* right-col headers */
#hdr-personalized-care { height: auto; background: url(../images/headers/hdr-personalized-care.jpg) no-repeat; }
#hdr-breast-recons { height: auto; background: url(../images/headers/hdr-breast-recons.jpg) no-repeat; }

#subhead-tram-flap { height: auto; background: url(../images/subhead-tram-flap.jpg) no-repeat; }
#subhead-latissimus-flap { height: auto; background: url(../images/subhead-latissimus.jpg) no-repeat; }
#subhead-implants-tissue { height: auto; background: url(../images/subhead-implants-expansion.jpg) no-repeat; }
#subhead-diep { height: auto; background: url(../images/subhead-diep-flap.jpg) no-repeat; }
#subhead-nipple-reconstruct { height: auto; background: url(../images/subhead-nipple-reconstruct.jpg) no-repeat; }

#hdr-breast { height: auto; background: url(../images/headers/hdr-breast.jpg) no-repeat; }
#hdr-contact { height: auto; background: url(../images/headers/hdr-contact.jpg) no-repeat; }
#hdr-thankyou { height: auto; background: url(../images/headers/subhead-thankyou.jpg) no-repeat; }
#hdr-dr-passaretti { height: auto; background: url(../images/headers/hdr-dr-passaretti.jpg) no-repeat; }
#hdr-gallery { height: auto; background: url(../images/headers/hdr-gallery.jpg) no-repeat; }
#hdr-our-practice { height: auto; background: url(../images/headers/hdr-our-practice.jpg) no-repeat; }
#hdr-post-bariatric { height: auto; background: url(../images/headers/hdr-post-bariatric.jpg) no-repeat; }
#hdr-body { height: auto; background: url(../images/headers/hdr-body.jpg) no-repeat; }
#hdr-face { height: auto; background: url(../images/headers/hdr-face.jpg) no-repeat; }
#hdr-skin { height: auto; background: url(../images/headers/hdr-skin.jpg) no-repeat; }
#hdr-sitemap { height: auto; background: url(../images/headers/hdr-sitemap.jpg) no-repeat; }
	#hdr-personalized-care em strong, .hdr-default-2 em strong { height: 64px; }
	
#div-top-bot { background: url(../images/div-top-bot.jpg) no-repeat left bottom; }
	
#hdr-practiced-proven { width: 275px; background: url(../images/headers/hdr-practiced-proven.jpg) no-repeat; }
#hdr-meet-dr { width: 288px; background: url(../images/headers/hdr-meet-dr.jpg) no-repeat; }
	#hdr-practiced-proven em strong, #hdr-meet-dr em strong { height: 82px; }
	#hdr-practiced-proven p { margin: 0 24px 12px 34px; }
	#hdr-meet-dr p { margin: 0 52px 12px 18px; }

#div-index-bot { height: auto; background: url(../images/div-index-bot.jpg) no-repeat left bottom; }
	#div-index-bot li {
		margin-left: 25px;
		list-style: outside url(../images/bullet.gif);
		padding-left: 5px;
	}
	#div-index-bot li a { margin-bottom: 1px; }
	html>body #div-index-bot li { margin-left: 32px; padding-left: 0; }

/* Navigation
---------------------------------------------------------------------------- */
#vert-nav, #vert-actual-nav { padding: 0; margin: 0; width: 265px; height: 293px }
	#vert-actual-nav { background: url("../images/vert-nav.jpg") no-repeat left top; }
	#vert-actual-nav li { float: left; width: 265px; }
	#vert-actual-nav a { display: block; width: 214px; height: 50px; margin-left: 43px; }

#vert-actual-nav span, #actual-nav span { display: none; }

#v-btn-1 { margin-top: 12px; }
#v-btn-1, #v-btn-2, #v-btn-3, #v-btn-4, #v-btn-5 { width: 214px; /*margin-left: 43px;*/ }
#v-btn-1 a, #v-btn-2 a, #v-btn-3 a, #v-btn-4 a, #v-btn-5 a { width: 214px; /*margin-left: 43px;*/ }


#v-btn-1 a:hover { background: transparent url("../images/vert-nav.jpg") no-repeat -308px -12px; }
#v-btn-2 a:hover { background: transparent url("../images/vert-nav.jpg") no-repeat -308px -62px; }
#v-btn-3 a:hover { background: transparent url("../images/vert-nav.jpg") no-repeat -308px -112px; }
#v-btn-4 a:hover { background: transparent url("../images/vert-nav.jpg") no-repeat -308px -162px; }
#v-btn-5 a:hover { background: transparent url("../images/vert-nav.jpg") no-repeat -308px -212px; }

/*---------------main navigation-------------------------------------*/
#actual-nav { 
	width:778px;
	height: 42px;
	margin:0px;
	padding:0px; 
	background: url("../images/nav.jpg") no-repeat left top;
	  }
#actual-nav li, #actual-nav a { height: 42px; display: block; }
#actual-nav li { float: left; list-style: none; _display:inline; position:relative; }

#btn-1 { width: 70px; margin-left: 16px; }
#btn-2, #btn-3, #btn-4, #btn-5, #btn-6, #btn-7 { margin-left: 1px; }    
#btn-2 { width: 99px; }
#btn-3 { width: 97px; }
#btn-4 { width: 156px; }
#btn-5 { width: 176px; }
#btn-6 { width: 60px; }
#btn-7 { width: 83px; }

/* Changed values should match "width" numbers specified above */
#btn-1 a:hover { background:url("../images/nav.jpg") no-repeat -16px -42px; }
#btn-2 a:hover { background:url("../images/nav.jpg") no-repeat -87px -42px; }
#btn-3 a:hover { background:url("../images/nav.jpg") no-repeat -187px -42px;  }
#btn-4 a:hover { background:url("../images/nav.jpg") no-repeat -285px -42px;  }
#btn-5 a:hover { background:url("../images/nav.jpg") no-repeat -442px -42px;  }
#btn-6 a:hover { background:url("../images/nav.jpg") no-repeat -619px -42px;  }
#btn-7 a:hover { background:url("../images/nav.jpg") no-repeat -680px -42px;  }
/* ------------------------ son of suckerfish: horizontal sprite nav ------------------------ */
#actual-nav li ul {
	position: absolute;
	left: -9999px;
	background-color: #720000;	/* Background color of drop down menu - add more styles (i.e. background image) if you want */
}
#actual-nav li ul li { height: 20px; }	/* Height of each drop down menu item */
#actual-nav li ul li a { width: 100%; height: 20px; line-height: 20px; }
#actual-nav li ul li a span { display: block; padding-left: 5px; }

/* Drop down link styles */
#actual-nav a:link, #actual-nav a:visited, #actual-nav a:hover, #actual-nav a:active {
	font-size: 11px;
	color: #fff;
	text-decoration: none;
}
#actual-nav li:hover ul, #actual-nav li.sfHover ul	{ left: auto; }
/* Hover styles for drop down items */
#btn-4 ul a:hover { 
	background-image: none;
	background-color: #AA0000; 
}
/* width of drop down menu - choose width that allows items to display on one line */
#btn-4 ul, #btn-4 li { width: 157px; }
/* Quick Contact---------------------------------------------------------------------------- */
#left-col form { margin: 0 18px 12px 36px; }

#left-col form p {margin:0; padding:0; text-align:left; font-size:10px; }

#left-col input, #left-col textarea {
	width: 144px;
	padding: 1px 2px;
	margin-bottom: 2px;
	font: 11px/11px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background-color: #f8e2a3;
	color: #502508;
	border: 1px solid #502508;
}
#left-col textarea { height: 64px; overflow: auto; }

#left-col input.hidden, #right-col input.hidden { display: none; }
#left-col input.btn-send, #right-col input.btn-send { width: 64px; }

/* Main Contact
---------------------------------------------------------------------------- */
#right-col form { margin: 0 54px 12px 42px; }
#right-col fieldset { line-height: normal; }
#right-col fieldset.fieldset-custom div { height: 39px; margin-top: 5px; }
#right-col fieldset div { float: left; width: 200px; margin-bottom: 3px; }
#right-col fieldset div.field-item { text-align: right; padding-right: 12px; }
#right-col div.clear { clear: both; text-align: center; padding-top: 12px; }

#right-col input, #right-col select {
	padding: 1px 2px;
	margin-bottom: 2px;
	font: 11px/11px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background-color: #f8e2a3;
	color: #502508;
	border: 1px solid #502508;
}

#right-col select { width: 159px; }
#right-col input { width: 144px; }

#right-col textarea {
	width: 344px; height: 88px;
	padding: 1px 2px;
	margin-bottom: 2px;
	font: 11px/11px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background-color: #f8e2a3;
	color: #502508;
	border: 1px solid #502508;
	overflow: auto;
}
#bna-align {width:563px; }
#bna-align p {margin: 0 0 0 0;}
/* Classes
---------------------------------------------------------------------------- */
.clear { clear: both; }
.img-right { padding: 2px 4px 2px 8px; float: right; }
.img-left { padding: 2px 8px 0 0; float: left; }
.img-right-2 { padding: 2px 4px 2px 8px; margin-right: 14px; float: right; }
.bna-align {float:left; width:200px; margin-left:25px; text-align:center;}
.topofpage { text-align: right; font-size: 10px;}
img.bna-left {margin:10px 15px 10px 0px; }
p.text-left {margin:-50px 0 0 0; float:left; }
p.text-right {margin:-50px 0 0 0; float:left;  }
img.bna-right {margin:10px 0px 10px 15px; }
p.inset {text-align:center; }