﻿/* ==========================================================================================
Title:		St. Anthony's Memorial Hospital - Effingham Illinois (default stylesheet)
Date:		June 2008
Author: 	Dan Trewartha, LRS Web Services
Document:	style.css

DOCUMENT ORGANIZATION:
	1.0 : HTML Elements
		1.1 Font Sizes
	2.0 : Layout Elements
	3.0 : Branding
	4.0 : Navigation
		4.1 : n1
	5.0 : Headings
		5.1 : h1
		5.2 : h2
	6.0 : Content
		6.1 : Page With No Sidebar
		6.2 : Page With Sidebar
			6.2.1 : Content Area
			6.2.2 : Sidebar Area
	7.0 : Footer
	8.0 : Misc

DOCUMENT ARRANGEMENT:
	-Order of appearance in HTML

ATTRIBUTE PROPERTY ORDER:
	-Box (width; height; margin; border; padding; outline;)
	-Backgrounds (color; image; repeat; position;)
	-Positioning (display; position; float; clear; z-index; direction; overflow; visibility;)
	-Font (color; family; size; style; weight;)
	-Text (letter-spacing; line-height; align; decoration; indent; transform; vertical-align;)
	-Misc (content; outline; cursor; table-layout;)

ATTRIBUTE LAYOUT:
	selector {
		property: value;
	}

COLOR PALETTE:
	-Content background:#fff;;
	-Main font:;
	-Link:;
	-Link hover:;
	-Link visited:;
	-<strong>:;
	-<em>:;
	-<h1>:;
	-<h2>:;
	-<h3>:;
	-<h4>:;
	-<h5>:;
	-sidebar text:;
	-sidebar <h2>:;
	-sidebar link:;
	-sidebar background:;
	-sidebar link hover:;
	-sidebar link visited:;
	
========================================================================================== */





/* ==========================================================================================
=1.0 HTML ELEMENTS
========================================================================================== */
*, html, body{
	margin:0;
	padding:0;
}
html, body{
	width:100%;	
	font-family:Arial;	
	position:relative;
}
html{
	background:#fff;
}
body{
	width:900px;
	margin:0 auto 0 auto;
	padding:0;
	color:#333333;
	background:#fff;
}
p{
	line-height:150%; /* 12 x 1.5 = 18px;*/
}
a{
	outline:none;
}
a img{
	border:0;
}
a, a:active{
	text-decoration:underline;
}
a:visited{
}
a:hover{
}
blockquote{
	margin:10px;
	line-height:1.5em;
}




	/* ======================================================================================
	=1.1 FONT SIZES
	====================================================================================== */
	html{
		font-size:16px;
	}
	body{
		font-size:75%; /* 16 x .75 = 12px */
	}	
	h1{
		font-size:150%; /* 12 x 1.50 = 18px */
	}
	h2{
		font-size:133%; /* 12 x 1.33 = 16px */
	}
	h3{
		font-size:116%; /* 12 x 1.16 = 14px */
	}
	h4{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	p{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	td p{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	ul{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	ul ul{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	#n1{
		font-size:116%; /* 12 x 1.16 = 14px; */
	}
	#footer p{
		font-size:91.67% /* 12 x .9167 = 11px; */
	}





/* ==========================================================================================
=2.0 LAYOUT ELEMENTS
========================================================================================== */
#page{
	width:900px;
	min-height:600px;
	height:auto !important;
	height:600px;
	margin:0px 0 0 0;
	background:url(/images/b-main.gif) repeat-y;
	position:relative;	
}
#page2{
	width:900px;
	min-height:600px;
	height:auto !important;
	height:600px;
	margin:0px 0 0 0;
	background:url(/images/b-main2.gif) repeat-y;	
	position:relative;
}
#header{
	width:710px;
	float:right;
	position:relative;
}
#sidebar{
	width:180px;
	margin:0 10px 0 0;	
	float:left;
	position:relative; 
}
#content{
	width:710px;
	float:right;
}





/* ==========================================================================================
=3.0 BRANDING
========================================================================================== */
#branding{
	width:710px;
}





/* ==========================================================================================
=4.0 NAVIGATION
========================================================================================== */





	/* ======================================================================================
	=4.1 N1
	====================================================================================== */
	#n1{
		width:710px;
		height:50px;
		background:url(/images/b-n1.gif) no-repeat;
		position:relative;
	}
	#n1 ul{
		width:710px;
		margin:0;
		padding:0;
		display:block;
		position:relative;
	}
	#n1 ul li{
		height:22px;
		margin:0 0 0 0;
		padding:3px 0 0 0;		
		display:block;
		float:left;
		text-align:center;
		list-style:none;
		position:relative;
	}
	#n1 ul li a{
		height:22px;
		display:block;
		color:#002d65;
		text-decoration:none;		
	}
	#n1 ul li:hover ul{
		visibility:visible;
	}
	#n1 ul ul{
		background:#d5c5a9;
		padding:0 0 15px 15px;
		position:absolute;
		top:25px;
		visibility:hidden;
		text-indent:0;	
		font-size:91.667%;
	}
	#n1 ul ul li{
		height:auto;
		margin:0;
		border:0;
		padding:0;
		display:block;
		text-align:left;
	}
	#n1 ul ul li a{
		width:199px;
		height:100%;
		padding:2px 0 2px 0;
		display:block;
		color:#002d65;
		font-size:1em;
		font-style:normal;
		text-decoration:none;
	}
	
	#n1 a:hover{
		color:#942653;
	}
		
	li#n1-home{
		width:73px;
	}	
	li#n1-aboutUs{
		width:92px;
	}
	li#n1-aboutUs ul{
		width:205px;
		left:0;
	}	
	li#n1-services{
		width:89px;
	}
	li#n1-services ul{
		width:192px;
		left:0;
	}	
	li#n1-findAPhysician{
		width:137px;
	}	
	li#n1-hospitalGuide{
		width:127px;
	}
	li#n1-hospitalGuide ul{
		width:159px;
		left:0;
	}	
	li#n1-contactUs{
		width:104px;
	}
	li#n1-contactUs ul{
		width:200px;
		left:-29px;
	}
	li#n1-search{
		width:81px;
	}	
	
	
	
	
	
	/* ======================================================================================
	=4.2 N2
	====================================================================================== */
	#n2{
		width:180px;
	}
	#n2 ul{
		width:180px;
		margin:10px 0 0 0;
		padding:0;	
	}
	#n2 ul li{
		padding:5px 10px 5px 10px;
		list-style:none;
	}
	#n2 ul li a{
		color:#002d65;
		text-decoration:none;
	}
	#n2 ul li a:hover{
		color:#942653;
		text-decoration:none;
	}




	
	/* ======================================================================================
	=4.3 N3
	====================================================================================== */
	#n3{
		width:180px;
		float:right;
	}
	#n3 ul{
		width:180px;
		margin:-5px 0 0 0;
		padding:0;	
	}
	#n3 ul li{
		padding:5px 10px 5px 10px;
		list-style:none;
	}
	#n3 h3{
		width:160px;
		margin:18px 10px 18px 10px;
	}	
	#n3 p{
		width:160px;
		margin:10px 10px 0 10px;
		line-height:1.33em;
	}
	#n3 a{
		color:#942653;
		text-decoration:none;
	}
	#n3 a:hover{
		color:#002d65;
		text-decoration:none;
	}
	




/* ==========================================================================================
=5.0 HEADINGS
========================================================================================== */





	/* ======================================================================================
	=5.1 H1
	====================================================================================== */
	h1{
		margin:0 0 0 0;
		color:#333399;
	}





	/* ======================================================================================
	=5.2 H2
	====================================================================================== */
	h2{
		margin:-2px 0 0 0;
		color:#333399;
	}





	/* ======================================================================================
	=5.2 H2
	====================================================================================== */
	h3{
		margin:18px 0 -8px 0;
		color:#990033;
	}





/* ==========================================================================================
=6.0 CONTENT
========================================================================================== */
#content-body{
	width:520px;
	padding:0 0 15px 0;
	float:left;
}
#content-body a{
	color:#942653;
	text-decoration:none;
}
#content-body a:hover{
	color:#002d65;
	text-decoration:none;
}
#content-body a:visited{
	
}
#content-body p{
	margin:8px 0 0 0;
}
#content-body ul, #content-body ol{
	padding:10px 30px;
	line-height:1.5em;
}
#content-body li{
	margin-bottom:8px;
}
#content-body table{
	width:520px;
}
#content-body table.employment{
	margin:18px 0 0 0;
}
#content-body table.employment{
	/*padding-bottom:18px;*/
}
#content-body table.employment td.label{
	width:150px;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
}
#content-body table.employment td.info{
	width:370px;
	padding-bottom:18px;
	font-weight:normal;
	text-align:left;
	vertical-align:top;
}
#content-body table.employment td.info2{
	width:370px;
	padding-bottom:0;
	font-weight:normal;
	font-style:italic;
	text-align:left;
	vertical-align:top;
}


#content-body table.newsitems{
	margin:18px 0 0 0;
}
#content-body table.newsitems td, #content-body table.newsitems th{	
	padding:5px 5px 10px 5px;
}


.form{
	width:520px;	
}

.formLabel{
	width:130px;
	padding-right:6px;
	padding-top:4px;
	text-align:right;
	vertical-align:top;
}
.formField{
	width:200px;
}
.formOutput{
	width:190px;
	text-align:left;
}
.textbox{
	width:190px;
	padding:1px;
	margin-right:6px;
	margin-bottom:3px;
	font-size:12px;
	font-family:Arial;
}
.textbox2{
	width:190px;
	height:72px;
	padding:1px;
	margin-right:6px;
	margin-bottom:3px;
	font-size:12px;
	font-family:Arial;
}
.listbox{
	width:194px;
	margin-top:3px;
	margin-right:6px;
	font-size:12px;
	font-family:Arial;
}
.dropdownlist{
	width:194px;
	margin-bottom:3px;
	margin-right:6px;
	font-size:12px;
	font-family:Arial;
}





	/* ======================================================================================
	=6.1 PAGE WITH NO SIDEBAR
	====================================================================================== */		





	/* ======================================================================================
	=6.2 PAGE WITH SIDEBAR
	====================================================================================== */





		/* =================================================================================
		=6.2.1 CONTENT AREA
		================================================================================== */





		/* =================================================================================
		=6.2.1 CONTENT AREA
		================================================================================== */





/* ==========================================================================================
=7.0 FOOTER
========================================================================================== */
#footer{
	width:900px;
	margin:10px 0 0 0; 
 	padding:10px 0 0 0;
	text-align:center;
	background:url(/images/div-gray.gif) repeat-x top;
}
#footer a{
	color:#942653;
}
#footer a:hover{
	color:#002d65;
}





/* ==========================================================================================
=8.0 MISC
========================================================================================== */
.clear{
	clear:both;
}
.mainImage{
	width:180px;
	height:225px;
	margin:25px 0 0 0;
	position:relative;
}

input{
	border:1px soild #000;
}


