/* CSS Document for milwaukiewellnesscenter.com */
/* Initially created September 14, 2009  */

/* ***************************** LAYOUT ***************************** */

html { height: 100%; margin-bottom: 1px; }	/* adds scroll bar to fix "shifting" */

body {						
    width: 850px;
    margin-left: auto;		/* need these two margins as auto so it floats left & right */
    margin-right: auto; 	/* need these two margins as auto so it floats left & right */
	padding-left: 40px;		/* want 50px on left if browser reduced */
	background-color: #FFFFFF;
	background-image: url(assets/banner.jpg);
	background-repeat: repeat-x;	/* repeats images across only (not down) */
	color: #666666;					/* color of main font */
}

/* ********** MAIN SECTIONS ********** */


/* HEADER */

/* #header contains the h1 (text replaced with image) for SEO */

/*************** NEVER MIND. H1 NO USED FOR GRAPHIC AFTERALL ***************/
/*************** BUT IF IT WERE, THIS IS HOW YOU WOULD DO IT ***************/

/* #header {						/* anything needed here?? */
/* }

/* .hidden { display: none; }		/* for h1 - for printing purposes? */

/* #header h1 a {				/* graphic info that replaces hidden text */
/*  display: block;
/*   background: url(assets/milwaukie_header.gif) no-repeat 0 0;
/*   height: 37px;
/*   width: 492px;
/*   margin-bottom: 15px;
/* }

/*************** ABOVE NOT USED. SEE REGULAR H1 BELOW ***************/
/************************************************************/

/* MAIN */

#main {				
	padding: 20px 0 30px 3px;		
}


/* ********** SUB SECTIONS ********** */


/* HEADER SUBSECTIONS */

#headerLeft {
	float: left;
	width: 173px; 			/* logo.gif is 173px */
	padding-top: 6px;
}

#headerRight {
	padding-top: 50px;
	padding-left: 24px; 	/* space between logo and rest of header */
	margin-left: 173px; 	/* margin for logo width. For it to float in. */
}

/* MAIN SUBSECTIONS */

#left {
	float: left;
	width: 164px;			/* actual width 180 = 164 + 16 */
	padding-left: 16px;
}

#content {
	float: left;
	padding-left: 15px; 	/* to align with headerRight padding-left */
	width: 375px;			/* Is this needed?  MSttt: Yes, because you float it.*/	
}

#content2 {		/* for calendar page */
	float: left;
	padding-left: 15px; 	/* to align with headerRight padding-left */
	width: 650px;
}

#right {
	margin-left: 575px;		/* left 180 + content 375 + 15 + 30 */	/* S/B 600?? 575 seems to work... */
	padding-left: 30px;		
}

/* "CONTACT US" TABLE MARGINS & PADDING */
/************** in future, make sure general table settingsare not for only 
one type of table, as they seem to be here for "contact us" **************/

table {
	margin-bottom: 15px;
}

td {
  vertical-align: top;
  padding-bottom: 15px;
}

th {						/* SSw: see th text formatting below */
  vertical-align: top;
  text-align: right;
  padding: 2px 10px 0 0;
}

/* MISCELLANEOUS FORMATTING */

.offer {
/*	margin: 0 20px 15px 20px;	*/
	margin-bottom: 15px;
	padding: 15px;		
	border: solid thin #878700;	
}

hr {
	width: 350px;
	height: .5px;
	margin-bottom: 15px;	
	text-align: left;
	display: block; float: left;		/* Firefox workaround apparently, to float HRs left */

}

/* YOGA CLASSES TABLE */

td.yogaDay {
	font-weight: bold;
	text-align: left;		/* to offset the th above */
	padding: 5px 0 5px 5px;	/* to offset the th above */
	vertical-align: middle;
	background-color: #D2CFB1;
}

td.yogaHours {
	padding: 3px 0 8px 15px;
	vertical-align: middle;
}

td.yogaStaff {
	vertical-align: middle;
	padding: 3px 0 8px 0;			/* to offset the "contact us" table td */
}

td.yogaLevel {
	vertical-align: middle;
	padding: 3px 0 8px 0;			/* to offset the "contact us" table td */
} 


/* ***************************** FONT FORMATTING ***************************** */

/* 
Blue  = 5D93AD
Gold = 878700
Dark grey text = 666666
*/

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;		
}

p {
	padding-bottom: 15px;		/* 15px between paragraphs */
}

strong {
	font-weight: bold;
}

a {
	color: #5d93ad;
	text-decoration: none;
}

a:hover, a:active {
	color: #878700;
	text-decoration: underline;
}


/* HEADER STYLES */

h1 {		/* main page header */
	font-weight: bold;
	font-size: 18px;		
	padding-bottom: 20px;
}

h2 {		/* blue subheader */
	font-weight: bold;
	font-size: 15px;
	color: #5D93AD;	
	padding-bottom: 15px;	
}

h3 {		/* gold subheader */
	font-weight: bold;
	font-size: 15px;	
	color: #878700;	
	padding-bottom: 15px;	
}

h4 {		/* gold italic text */
	color: #878700;
	font-style: italic;
	font-size: 14px;
	padding: 5px 0 20px 0;
}

h5 {		/* Contact Us form blue header text */
	font-size: 16px;	 		/*MSttt made this a bit bigger */ 
	color: #5D93AD;
	font-style: italic;
	/* padding-bottom: 5px;		SSw edit: removed this padding */
}

h6 {		/* Contact Us form GOLD header text */
	font-size: 16px;	 		
	color: #878700;
	font-style: italic;
	font-weight: bold;
	padding-bottom: 0;
}



/* LISTS */

/* ***** for the navigation link list */

#left ul li, #left ul li a {	
	color: #878700;
	font-size: 14px;
	text-decoration: none;		
	padding-bottom: 21px;	
}

#left ul li a:hover, #left ul li a:active {
	color: #5D93AD;
}

/* ***** lists with bullets, indented, padding between each bullet */

#content ul.bullet {
	list-style: disc;
}

#content ul.bullet li {
	margin-left: 35px;	
	padding-bottom: 20px;	
}

/* ***** lists with bullets, indented, no padding between each bullet */

#content ul.bullet2 {
	list-style: disc;
	padding-bottom: 15px;
}

#content ul.bullet2 li {
	margin-left: 35px;	
}

/* ***** lists indented, no bullet */

#content ul.indent {
	list-style: none;
	padding-bottom: 15px;
}

#content ul.indent li {
	padding-left: 25px;		
}

/* ***** lists with no bullet, no indent */

#content ul.plain {
  list-style: none;
}

/* padding below each list for all types of lists */

#content ul.plain li, ul.bullet li, ul.indent li {
  padding-bottom: 5px;		
}  


/* MISCELLANEOUS FORMATTING */

th {				/* formatting for contact us table, see above */
	font-size: 10px;
	line-height: 16px;
}

.crumbNav, .crumbNav a {
	font-size: 10px;
	text-decoration: none;
}


.crumbNav a:hover, .crumbNav a:active {
	font-size: 10px;
	text-decoration: underline;
}

.redText {
	color: #F00;	
}

.blueText, .blueText a {		/* for text in actual header */
	color: #5D93AD;
	font-size: 12px;
	text-decoration: none;
}

.blueText a:hover, .headerInfo a:active {
	color: #878700;
	text-decoration: underline;		
}

.boldBlue {
	font-size: 14px;
	font-weight: bold;
	color: #5D93AD;
	font-style: italic;
}

.smaller {
	font-size: 10px;
}


/* ************************* IMAGE STUFF ************************* */

.floatLeft {
	float: left;
	border: 0;
	padding-right: 10px;
	padding-bottom: 10px;
}

.floatRight {
	float: right;
	border: 0;
	padding-bottom: 10px;
	padding-left: 10px;
}

/* ********************* BROWSER FIXES FOR AFTER FLOATS ********************* */

.clear { clear: both; }

