body, html {  /*  body, html tags should have 6 elements */
	margin:0;
	padding:0;
	font: normal normal normal 11px/18px Verdana, Arial, Helvetica, sans-serif;
	color:#333;
	background-color:#ffffff; /* browser window bg-color */
	background-image:url(images/bg.gif);
}
		
#wrapper_outer {   	/* should only have 3 elements, does not have background or borders because it's not floated and won't encompass any of the floated divs within in */ 
	width:950px;	/*  define the width of the webpage */
	padding:0;		/* padding is always 0 */
	margin:0 auto;}	/* margin is always 0 auto to center the page */
	
#wrapper {
	float:left;		/* wrapper floats left so that any background or border encompasses the other floated divs withing it*/
	padding:0;		/* can add padding if the actual page is a certain distance from the border of the wrapper. */
	margin:25px auto;	/* can specifyt top/btm margins so webpage does not butt-up against top or bottom of the browser window*/
	background-color:none}	/* can add bgColor or bgImg behsind the wrapper */

#header {			/* header */
	float:left;		/* always floats left */
	width:950px;	/* should match header.gif image width */
	height:220px;	/* should match header.gif image height */
	margin:0;		/* margin always = 0 */
	padding:0;		/* padding always = 0 */
	background-image:url(images/header.gif);}	/* image file should be header.gif */

.logo {
	float:left;
	width:195px;
	height:127px;
	margin:48px 0 0 63px;
	padding:0;
	border:none;}
.topphoto {
	float:right;
	width:140px;
	height:140px;
	margin:80px 20px 0 0;
	padding:0;
	border:none;}
.btmphoto {
	float:left;
	width:150px;
	height:140px;
	margin:35px 0 0 90px;
	padding:0;
	border:none;}	

#container {		/* holds the left navigation and main content divs */
	float:left;		/* always floats left */
	width:950px;	/* always equals width of the web page minus any border widths */
	margin:0;		/* margin always = 0 */
	padding:0;		/* padding always = 0 */
	background-color:#FFFFFF;	/* typically is white but not always */
	background-image:url(images/sidebdr.gif); /* define background image with elements to run the entire length of page - even if navigation is longer than content or vice versa */
	border:0px solid #000000; /* border will push container outside of the web page and cause inside content to shift; must subtract out of width of this #container */ 
	border-top:none;
	border-bottom:none;}	

#left {				/* left side box */
	float:left;		/* always float left */
	width:280px;	/* should be >= nav id width */
	margin:0;		/* margin always = 0 */
	padding:0;		/* padding always = 0 */	
	background-color:none;
	background-image:url(images/bgLeft.gif);
	background-repeat:no-repeat;
	background-position:top right;}
	
#nav {		/* navigation box goes inside of left box (DO NOT FLOAT THIS BOX!!!) */
	width:150px;		/* specify width */
	margin:15px 0 40px 3px;	/* margins move nav box elements around inside the left box (away from header or left border)*/
	padding:0;					/* padding = 0 */
	background-color:#f8dffe;	/* optional */
	border:0px solid #660000;}	/* optional */

.navbutton {
	padding:0px 0 2px 0px;
	border:none;}


/* for sub navigation items */
#nav ul {
	margin:0 0 10px 0; 		/* indents the menu list blocks */
	padding:0;				/* padding = 0 */
	list-style:none;}		/* get rid of the bullet point */
#nav li { 
	display: block;
	width: 125px;			/* always less than #nav width */
	padding:0;				/* padding = 0 */
	margin:0 0 0 30px; 		/* defines space below the main nav items or block of items if this is a heading */
	background-color:#f8dffe;	
	font: normal normal normal 11px/18px Verdana, Arial, Helvetica, sans-serif;	/* line height should ideally match image height */
	color:#666666;			/* text color if menu item is a heading, not a link */
	text-indent:10px;		/* indents menu text from edge of menu block */
	letter-spacing:0;}
#nav li a {	/* need to re-define for nav headers that are links */
	display: block;
	width: 125px;
	margin:0;		/* margin always = 0 */
	padding:0;		/* padding always = 0 */		
	background-color:#f8dffe;							
	font: normal normal normal 11px/18px Verdana, Arial, Helvetica, sans-serif; /* line height should ideally match image height */
	color:#993399; 			/* text color if menu item is a link */
	text-decoration: none;}
#nav li a:hover {		/* only need to define the background color/img, text color, and no underline for hover */
	background-color:#f8dffe;	
	color: #00cc00;
	text-decoration: none;}

	
#content_outer {	/* need this for IE doubling of margins */
	width:666px;	/* #container width minus #left width */
	float:left;
	margin:0;		/* margin always = 0 */
	padding:0;		/* padding always = 0 */}
#content {
	/* if you don't specify the width, then the box will just get bigger and smaller depending on the margins */
	margin:5px 30px 15px 0px; /* moves the content box inside the container; left margin moves it away from left container  */
	padding:5px;  			/* creates a padding for the text and graphic elements inside the content div */
	border:0px solid #00cc00; 	/* border needs to be subtracted out of width */
	background-color:#FFFFFF;	/* typically is white but may not be */
	text-align:left;}
	
h1 {	/* should only have 4 elements below, other stuff can be in a class */
	padding:0;
	margin:5px 0 0 0;
	font: normal normal normal 28px/30px Verdana, Arial, Helvetica, sans-serif;
	color:#336699;}
h2 {	/* should only have 4 elements below, other stuff can be in a class */
	padding:0;
	margin:10px 0 0 0;
	font: normal normal normal 18px/20px Verdana, Arial, Helvetica, sans-serif;
	color:#000099;}	

.leftphoto {
	float:left;
	margin:5px 10px 5px 0;}
	
.rightphoto {
	float:right;
	margin:5px 0 5px 10px;}	

.backtotop {
	padding:0;
	margin:0px 2px 0px 540px;;
	width:80px;
	height:25px;
	border:0;}

.hp_subbox {
	float:left; 
	width:600px; 
	margin:10px 0 20px 0; 
	padding:0px; 
	border:0px solid #ff0000;}
.hp_subtitle {
	float:left; 
	width:190px; 
	margin:30px 0 0 0; 
	padding:0; 
	border:0px solid #00ff00;}
.hp_subcontent {
	float:left; 
	width:350px; 
	padding:0 10px 0 0;
	margin:0;
	border:0px solid #0000ff;}

.meetteam {	/*meet doctors and staff subnav imag */
	border:none;}
	
.dr_photo {		/* doctor photos on Meet Our Doctors page */
	float:left;
	width:150px;
	height:175px;
	margin:0 10px 10px 0;
	padding:0;
	border:0;}	
.staff_photo {	/* staff group photos on Meet Our Staff page */
	float:left;
	margin:0 5px 0 0;
	padding:0;
	border:0;}
.staff_title {	/* class for staff title on Meet Our Staff page */
	margin-top:80px; 
	font: normal normal normal 18px/20px Verdana, Arial, Helvetica, sans-serif; 
	color:#0066cc;}

.dentalinfo {	/* container for sections on main dental info page */
	clear:both;
	width:550px;
	margin:0 0 20px 40px;
	padding:0;}

.faqgroup { 	/* div that holds each faq group on the faq directory page */
	clear:left;
	width:600px;
	margin:10px 5px 10px 10px;
	padding:0;}
.faqphoto {		/* photos on main faq directory page */
	clear:left;
	float:left;
	width:160px;
	height:160px;
	margin:10px 0 0 0;
	padding:0;
	border:0;}

.faqtitle { 	/* title of the faq group on the faq directory page */
	float:left; 
	margin:5px 5px 0 20px; 
	padding:0; 
	width:380px;}
.faqlist {		/* list of questions under each faq group on the faq directory page */
	float:left; 
	margin:0 5px 10px 40px; 
	padding:0; 
	width:380px;}




#footertop {	/* footer top for the disclaimer */
	clear:both;
	float:left;
	width:946px;
	margin:0;		/* margin always = 0 */
	padding:0;		/* padding always = 0 */
	background-color:#FFFFFF;
	background-image:url(images/footer1.gif);	/* 	footer image must be really tall to accomodate multiple lines of text */
	background-repeat:no-repeat;
	background-position:bottom left;
	border:2px solid #000000; /* border must be 0 or else edge will push out! */
	border-top:none;
	border-bottom:none;
	text-align:center;
	font: normal normal normal 10px/12px Verdana, Arial, Helvetica, sans-serif;
	color: #555555;}
#disclaimer {
	float:right;
	width:620px;
	padding:0;
	margin:10px 40px 35px 0px;
	font: italic normal normal 10px/12px Verdana, Arial, Helvetica, sans-serif;
	color:#336699;
	text-align:left;}	
#footer {	/* footer for footer info */
	clear:both;
	float:left;
	width:946px;
	margin:0;		/* margin always = 0 */
	padding:0;		/* padding always = 0 */
	background-color:#FFFFFF;
	background-image:url(images/footer2.gif);	/* 	footer image must be really tall to accomodate multiple lines of text */
	background-repeat:no-repeat;
	background-position:top left;
	border:2px solid #000000; /* border must be 0 or else edge will push out! */
	border-top:none;
	text-align:center;
	font: normal normal normal 10px/12px Verdana, Arial, Helvetica, sans-serif;
	color: #555555;}
	
#footer h6 {
	float:right;
	width:620px;
	padding:0;
	margin:10px 40px 20px 0;
	font: normal normal normal 10px/12px Verdana, Arial, Helvetica, sans-serif;
	color:#336699;
	text-align:left;}	
	

