/* Copyright 2006-2007 James M. Nachbar, MD   All Rights Reserved */


ul,ol { list-style:none; }

h1,h2,h3,h4,h5,h6,pre,code,td { font-size:1em; }

ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,label,div,dd,dt,dl,table,tr,td { margin:0; padding:0; }

a img,:link img,:visited img,fieldset { border:none; }

body { 
	background: #6666ff url("../image/bg-viewport.jpg") top left repeat-x;
	text-align:center; 
	font:14px/20px Arial, Helvetica, sans-serif; 
	color:#333399; 
	}

p, ul, ol, dl, pre, blockquote	{ margin-bottom:10px; }

blockquote { 
	margin-left: 10px; 
	margin-right: 10px; 
	}

h1,h2,h3,h4 { margin-bottom:8px; }

h1	{ font-size:1.2em; color:#333399; }
h2	{ font-size:1.1em; color:#333399; }
h3	{ font-size:1.0em; color:#333399; }
h4	{ font-size:1.0em; color:#333399; }

a:link,a:visited	{ color:#333399; text-decoration:underline; }
a:hover,a:active	{ color:#000; text-decoration:underline; }


/* ----- classes ----- */

div.clear	{ 
	clear:both; 
	height:.01em; 
	overflow:hidden; 
	}

#page { 
	background:url("../image/content-solid.jpg") repeat-y; 
	width:820px; 
	margin:0 auto; 
	text-align:left; 
	}
	

div#pagebottom { background:url("../image/content-solid.jpg"); height: 5px; width: 820px}

div#masthead { background:url("../image/masthead.jpg"); height: 69px; position: relative} 

div#masthead a {width: 820px; height: 69px; position: absolute}

#nav { 
	background: url("../image/nav.jpg") no-repeat; 
	width:820px; 
	height:29px; 
	margin:0px; 
	padding:0px	}



#nav span { display: none; } 

#nav li {height: 29px; display: block; top: -29}

#nav LI {
	DISPLAY: inline; FLOAT: left; LIST-STYLE-TYPE: none
}

#nav-01  {	width:92px}
#nav-02  {	width:112px;}
#nav-03  {	width:81px;}
#nav-04  {	width:201px}
#nav-05  {	width:75px}
#nav-06  {	width:125px}
#nav-07  {	width:134px}

#nav a { height: 29px; display: block; }

#nav-01 a:hover {	background: url(../image/nav.jpg) no-repeat 0px -29px; width:92px}
#nav-02 a:hover {	background: url(../image/nav.jpg) no-repeat -92px -29px; width:112px}
#nav-03 a:hover {	background: url(../image/nav.jpg) no-repeat -204px -29px; width:81px}
#nav-04 a:hover {	background: url(../image/nav.jpg) no-repeat -285px -29px; width:201px}
#nav-05 a:hover {	background: url(../image/nav.jpg) no-repeat -486px -29px; width:75px}
#nav-06 a:hover {	background: url(../image/nav.jpg) no-repeat -561px -29px; width:125px}
#nav-07 a:hover {	background: url(../image/nav.jpg) no-repeat -686px -29px; width:134px}


/* set background color of drop down menus */
#nav LI UL {
	visibility:hidden; PADDING-RIGHT: 1px; POSITION: absolute; BACKGROUND-COLOR: #bfbfe2
}
#nav LI:hover UL {
	visibility:visible; PADDING-RIGHT: 1px; POSITION: absolute; BACKGROUND-COLOR: #bfbfe2
}
#nav LI.clHover UL {
	visibility:visible; PADDING-RIGHT: 1px; POSITION: absolute; BACKGROUND-COLOR: #bfbfe2
}

/* Make menu more compact by using 18px instead of 20 for #nav LI UL LI and #nav LI UL LI A */
#nav LI UL LI {
	BORDER-RIGHT: #2a3a94 1px solid; BORDER-TOP: #2a3a94 1px; BORDER-LEFT: #2a3a94 1px solid; BORDER-BOTTOM: #2a3a94 1px solid; HEIGHT: 18px
}
#nav LI UL LI A {
	WIDTH: 100%; LINE-HEIGHT: 18px; HEIGHT: 18px
}
#nav LI UL LI A SPAN {
	DISPLAY: block; PADDING-LEFT: 5px; FONT-WEIGHT: bold
}
#nav A:link {
	FONT-SIZE: 1em; COLOR: #2a3a94; TEXT-DECORATION: none
}
#nav A:visited {
	FONT-SIZE: 1em; COLOR: #2a3a94; TEXT-DECORATION: none
}
#nav A:hover {
	FONT-SIZE: 1em; COLOR: #2a3a94; TEXT-DECORATION: none
}
#nav A:active {
	FONT-SIZE: 1em; COLOR: #2a3a94; TEXT-DECORATION: none
}
#nav-03 UL A:hover {
	BORDER-RIGHT: #bfbfe2 1px solid; BORDER-TOP: #bfbfe2 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #bfbfe2 1px solid; COLOR: #bfbfe2; BORDER-BOTTOM: #bfbfe2 1px solid; BACKGROUND-COLOR: #2a3a94; TEXT-DECORATION: none; width:100%;
}

#nav-03 UL {
	WIDTH: 30em
}
#nav-03 LI {
	WIDTH: 30em
}

#nav-04 UL A:hover {
	BORDER-RIGHT: #bfbfe2 1px solid; BORDER-TOP: #bfbfe2 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #bfbfe2 1px solid; COLOR: #bfbfe2; BORDER-BOTTOM: #bfbfe2 1px solid; BACKGROUND-COLOR: #2a3a94; TEXT-DECORATION: none; width:100%;
}

#nav-04 UL {
	WIDTH: 20em
}
#nav-04 LI {
	WIDTH: 20em
}

#nav-05 UL A:hover {
	BORDER-RIGHT: #bfbfe2 1px solid; BORDER-TOP: #bfbfe2 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #bfbfe2 1px solid; COLOR: #bfbfe2; BORDER-BOTTOM: #bfbfe2 1px solid; BACKGROUND-COLOR: #2a3a94; TEXT-DECORATION: none; width:100%;
}

#nav-05 UL {
	WIDTH: 15em
}
#nav-05 LI {
	WIDTH: 15em
}

/* #footer {
	MARGIN: 0px auto; WIDTH: 800px; TEXT-ALIGN: center; background: #fff url(../image/footer-background.jpg) repeat-y;
} */

#footer-bg {
	WIDTH: 820px; TEXT-ALIGN: center; background: #fff url(../image/footer-background.jpg) repeat-y;
}

#footer {
	MARGIN: 0px auto; WIDTH: 780px; TEXT-ALIGN: center;
}

#footer P {
	MARGIN-BOTTOM: 10px; COLOR: #818386
}
#footer A:link {
	COLOR: #818386
}
#footer A:visited {
	COLOR: #818386
}
#footer A:hover {
	COLOR: #818386; TEXT-DECORATION: none
}
#footer A:active {
	COLOR: #818386; TEXT-DECORATION: none
}
#footer UL {
	MARGIN-TOP: 10px
}
#footer LI {
	PADDING-RIGHT: 5px; DISPLAY: inline; PADDING-LEFT: 7px; PADDING-BOTTOM: 0px; BORDER-LEFT: #818386 1px solid; PADDING-TOP: 0px
}
#footer LI.firstlistitem {
	COLOR: #818386; BORDER-STYLE: none}

/* default header: - same for every page */
div#header {background: url(../image/header-main.jpg) no-repeat; height:245px; width: 820px}

/* contentandcontact is positioning source for contentheader */
/* body#index div#contentandcontact {position:relative; } */
body#index div#contentandcontact { background: url(../image/content-solid.jpg) repeat-y;}
body#index div#contentandcontactbg { position:relative;}
/* body#index div#contentandcontactbg { background: url(../image/header-main.jpg) repeat-y;} */

div#contentandcontact { background: url(../image/content-solid.jpg) repeat-y;}
div#contentandcontactbg { position:relative;}


body#index div#contactuswhole {height: 474px; width: 296px; float:left}
body#index div#contactustop {background: url(../image/contactustop-main.jpg) no-repeat; height: 107px; width: 296px} 
body#index div#contactusbottom {background: url(../image/contactusbottom-main.jpg) no-repeat; height: 367px; width: 296px}

div#contactuswhole {height: 311px; width: 228px; float:left}
div#contactustop {background: url(../image/contactustop-other.jpg) no-repeat; height: 128px; width: 228px} 
div#contactusbottom {height: 183px; width: 228px; background: url(../image/contactusbottom-other.jpg) no-repeat;}

/* Firefox needs right: 0 in order for the contentheader not to be positioned all the way to the left.  Note that, with right: 0,
IE 6 (but not IE 7) now needs something (even just a period) AFTER the div.clear, and needs the div.clear too, in order for
the contentheader not to be positioned all the way to the right.  Only an issue for index and check pages */

body#index div#contentheader {background: url(../image/contentheader-main.jpg) no-repeat; height: 107px; width: 524px; position: absolute; top: 0; right: 0; margin: 0px; padding: 0px;}

/* body#breast div#contentheader {background: url(../image/contentheader-breast.jpg) no-repeat; height: 128px; width: 592px; position: absolute; left: 0px; top: 0px; margin: 0px; padding: 0px;} */

body#breast div#contentheader {background: url(../image/contentheader-breast.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0;  right: 0; margin: 0px; padding: 0px;}
body#rhino div#contentheader {background: url(../image/contentheader-rhino.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#PostBabyInfo div#contentheader {background: url(../image/contentheader-PostBabyInfo.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#postbaby div#contentheader {background: url(../image/contentheader-postbaby.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#pect div#contentheader {background: url(../image/contentheader-pect.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#oto div#contentheader {background: url(../image/contentheader-oto.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#masto div#contentheader {background: url(../image/contentheader-masto.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#manosqueayudan div#contentheader {background: url(../image/contentheader-manosqueayudan.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#LipoInfo div#contentheader {background: url(../image/contentheader-LipoInfo.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#lipo div#contentheader {background: url(../image/contentheader-lipo.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#face div#contentheader {background: url(../image/contentheader-face.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#directions div#contentheader {background: url(../image/contentheader-directions.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#cv div#contentheader {background: url(../image/contentheader-cv.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#comments div#contentheader {background: url(../image/contentheader-comments.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#check div#contentheader {background: url(../image/contentheader-check.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#brred div#contentheader {background: url(../image/contentheader-brred.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#breastptotic div#contentheader {background: url(../image/contentheader-breastptotic.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#breastdifficult div#contentheader {background: url(../image/contentheader-breastdifficult.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#BrAugInfo div#contentheader {background: url(../image/contentheader-BrAugInfo.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#botox div#contentheader {background: url(../image/contentheader-botox.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#bleph div#contentheader {background: url(../image/contentheader-bleph.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#about div#contentheader {background: url(../image/contentheader-about.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#HowLongDoSalineImplantsLast div#contentheader {background: url(../image/contentheader-howlong1.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#MoreInterimResultsFromMulti div#contentheader {background: url(../image/contentheader-howlong2.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#gel div#contentheader {background: url(../image/contentheader-gel.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#bodyprocs div#contentheader {background: url(../image/contentheader-bodyprocs.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#faceprocs div#contentheader {background: url(../image/contentheader-faceprocs.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#contact div#contentheader {background: url(../image/contentheader-contact.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}
body#abd div#contentheader {background: url(../image/contentheader-abd.jpg) no-repeat right top; height: 128px; width: 592px; position:absolute; top: 0; right: 0;  margin: 0px; padding: 0px;}


/*body#index div#contentspacer {background: #ffffff url(../image/contentheader-main.jpg) no-repeat; height: 500px; width: 300px; position: relative; left: 0px; top: 0px;}*/
body#index div#contentspacer {height: 107px; width: 300px;}

div#contentspacer {height: 128px; width: 300px;}

/* So that I can put a small, invisible character to avoid IE 6 bug */
div.invisiblecontent {height: 1px; font-size:0.1em; COLOR: #FFFFFF;}

/* with spacer, top padding is redundant div.content {padding-left: 2em; padding-right: 2em; padding-top: 2em} */
/* div.content {padding-left: 2em; padding-right: 2em; padding-top: 0} */

body#index div.content {background: url(../image/content-gradient.jpg) no-repeat top right;padding-left: 2em; padding-right: 2em; padding-top: 0}

div.content {background: url(../image/content-gradient-other.jpg) no-repeat top right;padding-left: 2em; padding-right: 2em; padding-top: 0}

/* Internet Explorer 6 blocks out part of inline image by _underlying_ background!  Eliminate background for the about page */
body#about div.content {background-image:none; padding-left: 2em; padding-right: 2em; padding-top: 0}


/* 
body#index div#header {background: url(../image/header-main.jpg) no-repeat; height:245px; width: 820px} 
body#breast div#header {background: url(../image/header-breast.jpg) no-repeat; height:245px; width: 820px} 
body#rhino div#header {background: url(../image/header-rhino.jpg) no-repeat; height:245px; width: 820px}
body#PostBabyInfo div#header {background: url(../image/header-PostBabyInfo.jpg) no-repeat; height:245px; width: 820px}
body#postbaby div#header {background: url(../image/header-postbaby.jpg) no-repeat; height:245px; width: 820px}
body#pect div#header {background: url(../image/header-pect.jpg) no-repeat; height:245px; width: 820px}
body#oto div#header {background: url(../image/header-oto.jpg) no-repeat; height:245px; width: 820px}
body#masto div#header {background: url(../image/header-masto.jpg) no-repeat; height:245px; width: 820px}
body#manosqueayudan div#header {background: url(../image/header-manosqueayudan.jpg) no-repeat; height:245px; width: 820px}
body#LipoInfo div#header {background: url(../image/header-LipoInfo.jpg) no-repeat; height:245px; width: 820px}
body#lipo div#header {background: url(../image/header-lipo.jpg) no-repeat; height:245px; width: 820px}
body#face div#header {background: url(../image/header-face.jpg) no-repeat; height:245px; width: 820px}
body#directions div#header {background: url(../image/header-directions.jpg) no-repeat; height:360px; width: 740px}
body#cv div#header {background: url(../image/header-cv.jpg) no-repeat; height:360px; width: 740px}
body#comments div#header {background: url(../image/header-comments.jpg) no-repeat; height:360px; width: 740px}
body#check div#header {background: url(../image/header-check.jpg) no-repeat; height:360px; width: 740px}
body#brred div#header {background: url(../image/header-brred.jpg) no-repeat; height:360px; width: 740px}
body#breastptotic div#header {background: url(../image/header-breastptotic.jpg) no-repeat; height:360px; width: 740px}
body#breastdifficult div#header {background: url(../image/header-breastdifficult.jpg) no-repeat; height:360px; width: 740px}
body#BrAugInfo div#header {background: url(../image/header-BrAugInfo.jpg) no-repeat; height:360px; width: 740px}
body#botox div#header {background: url(../image/header-botox.jpg) no-repeat; height:360px; width: 740px}
body#bleph div#header {background: url(../image/header-bleph.jpg) no-repeat; height:360px; width: 740px}
body#about div#header {background: url(../image/header-about.jpg) no-repeat; height:360px; width: 740px}
body#abd div#header {background: url(../image/header-abd.jpg) no-repeat; height:360px; width: 740px}
body#HowLongDoSalineImplantsLast div#header {background: url(../image/header-howlong1.jpg) no-repeat; height:360px; width: 740px}
body#MoreInterimResultsFromMulti div#header {background: url(../image/header-howlong2.jpg) no-repeat; height:360px; width: 740px}
*/

img.img-left {float: left; margin:2px 10px 10px 0;}
img.img-right {float: right; margin:2px 0px 1em 1em;}
img.spacer {margin: 0; padding: 0; border: 0}

/* center examples */
div.example table {margin: 0 auto}