@charset "utf-8";
/* CSS Document */

header {
	width:100%;
}

.nav{ display:block; float:left; width:100%; font-size:16px;	padding:17px 0 3px 0; height:38px;background-image:url(images/navBG.png);}
.nav ul {margin:2px 0 0 -30px; text-align:center; background-color:#4f9bb8;}
.nav ul li{	list-style-position:inside;	list-style-type:none; height:20px; min-width:40px; margin-right:5px; margin-left:5px; float:left;}
.nav a, .nav a:visited{display:block; padding-top:10px; text-decoration:none; color:#FFF; padding:0px 26px 0px 20px;}
.nav ul li ul {	margin-left:-999em; position:absolute; color:#ffffff; font-size:14px; text-align:left; padding-bottom:0;}
html>body .nav ul li:hover ul{display:block; margin:0 0 2px 0px; padding:0em 0 .75em 0em;}
.nav ul li ul {	margin-top:5em;}
html>body .nav ul li ul {margin-top:-2em;}
.nav ul li ul li{float:none;  border:0;	padding-top:10px;}

body {
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;
	background-image:url(images/background-pattern-crossed.png);
}

.container {
	width:1100px;
	background-color:#FFF;
	margin:0 auto;
	-moz-box-shadow:0px 5px 15px #333333;
	-webkit-box-shadow:0px 5px 15px #333333;
	box-shadow:0px 5px 15px #333333;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=10, Direction=135,Color='#000000')";	
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=10, Direction=135, Color='#000000');
}

.footer {
	border-bottom:solid;
	border-width:15px;
	border-bottom-color:#4f9bb8;
	height:20px;
}

#leftrightbg {
	width:100%;
	height:500px;
}

#content {
	margin:0px 80px 0px 80px;
}

#contentleft {
	padding: 20px 0px 50px 45px;
	margin-right:20px;
	width: 44%;
	height: 35%;
	float: left;
}

#contentright {
	padding: 10px 10px 10px 20px;
	margin: 45px 27px 40px 10px;
	width: 42%;
	height: 75%;
	float: right;
	background-color:#15232c;
	color:#FFF;
}

#contentbottom {
	width:100%;
	height:485px;
	float:bottom;
	background-image:url(images/bottomBG.png);
	padding-top:2px;
}

#bottomright {
	padding:0px 0px .5px 540px;
	color:#FFF;
}

#contentbottom h2 {
	font-family:"Futura Std",Verdana, Geneva, sans-serif;
	color:#FFF;
	font-size:30px;
}

#contentbottom h3 {
	font-family:"Futura BT",Verdana, Geneva, sans-serif;
	color:#FFF;
}


/* ------------ 960 pixel wide version of the site ------------ */

@media only screen and (min-width:968px) and (max-width:1107px){
	.container{
		width:960px;
	}
	
	#nav ul li{	list-style-position:inside;	list-style-type:none;	 		height:20px; min-width:40px; margin-right:25px; 					        margin-left:25px; float:left;
	}
	
	.header{
		background-image:url(images/header960.png);
	}
	
	#nav ul{
		margin:2px 0px 0px -30px;	
	}
	
	.left{
	text-align:center;
	margin:30px 0px 0px 50px;
}

.center{
	position:relative;
	float:left;
	color:#ffffff;
	font-size:36px;
	margin:15px 0px 0px 185px;
}

.right{
	position:relative;
	float:left;
	text-align:center;
	font-size:32px;
	margin:30px 0px 0px 155px;	
}

#contentbottom {
	width:100%;
	height:399.01px;
	float:bottom;
	background-image:url(images/bottomBG960.png);
	padding-top:2px;
}

#bottomright {
	padding:0px 10px .5px 50px;
	color:#FFF;
}

#bottomright img{
	margin-top:-15px;
}

#contentright {
	padding: 10px 10px 10px 20px;
	margin: 45px 27px 50px 10px;
	width: 380px;
	float: right;
	background-color:#15232c;
	color:#FFF;
}
}

/* ------------ 800 pixel wide version of the site ------------ */

@media only screen and (min-width:808px) and (max-width:967px){
	.container{
		width:800px;
	}
	
	
	.header{
		background-image:url(header3.jpg);
	}
	#nav ul {
		margin:2px 0 0 -80px;
		text-align:center;
	}
	
	#nav ul li{	list-style-position:inside;	list-style-type:none;	 		height:20px; min-width:20px; margin-right:20px; 					        margin-left:25px; float:left;
	}
	
	.contentleft{
		margin:12px 0px 12px 8px;
		padding:12px;
	}
	.left{
	text-align:center;
	margin:30px 0px 0px 30px;
}
	
	.center{
	position:relative;
	float:left;
	color:#ffffff;
	font-size:36px;
	margin:15px 0px 0px 135px;
}

.right{
	position:relative;
	float:left;
	text-align:center;
	font-size:32px;
	margin:30px 0px 0px 105px;	
}
	
	.contentright{
		margin:12px 8px 12px 0px;
		padding:12px;
	}
	.header{
		background-image:url(header2.jpg);
		height:182px;	
	}
	
	#appointment{
		width:200px;
	}

#leftrightbg {
	width:100%;
	height:900px;
}
	
#contentleft {
	position:relative;
	margin: 0px 150px 50px 100px;
	width:500px;
}

#contentright {
	padding: 10px 10px 10px 20px;
	margin: 15px 150px 50px 100px;
	width: 500px;
	height:380px;
	background-color:#15232c;
	color:#FFF;
}

#contentbottom {
	width:100%;
	height:399.01px;
	float:bottom;
	background-image:url(images/bottomBG800.png);
	padding-top:2px;
}

#bottomright {
	padding:0px 0px .5px 50px;
	color:#FFF;
}

#bottomright img{
	margin-bottom:130px;
	margin-top:-20px;
}

}

/* ------------ 600 pixel wide version of the site ------------ */

@media only screen and (min-width:608px) and (max-width:807px){
	.container{
		width:600px;
	}
	
	.header{
		display:block;
		background-image:url(header4.jpg);
		height:137px;
	}
	
	#toggleNav{
		display:block;
	}
	
	#appointment{
		width:175px;
		display:block;
	}
	
	.left{
			font-size:20px;
	text-align:center;
	margin:38px 0px 0px 15px;
}
	
	.center{
	position:relative;
	float:left;
	color:#ffffff;
	font-size:36px;
	margin:15px 0px 0px 95px;
}

.right{
	position:relative;
	font-size:20px;
	float:left;
	text-align:center;
	margin:38px 0px 0px 105px;	
}


	/* -------------------- Start Navigation -------------------- */
#nav{ display:none; float:left; width:100%; background-color:#88d4aa; height:30px; padding:0px 0px 0px 0px; font-size:16px; height:100%; border-top:10px solid #0152c5;}
#nav ul {margin:2px 0 0 0px; text-align:center;}
#nav ul li{float:none;list-style-position:inside; display:block;list-style-type:none; margin-left:0px; padding:3px 0px 3px 0px; position:relative; z-index:100;}
#nav ul li a{padding:2px 0px 2px 0px;}
#nav a, #nav a:visited{display:block; text-decoration:none;}
#nav ul li ul {	margin-left:-999em; background:none; position:relative; color:#ffffff;  font-size:14px; text-align:left; padding-bottom:0; }
html>body #nav ul li:hover ul{ margin-left:-999em; background:none; position:relative; color:#ffffff;  font-size:14px; text-align:left; padding:0px;}
#nav ul li ul {	margin-top:0em; z-index:0; visibility:hidden;}
html>body #nav ul li ul {margin-top:-3em;}
#nav ul li ul li{margin-left:-998em;}
	/*End Navigation*/
	#subnav{
		display:none;
	}
	
	#subnav a{
		margin-top:5px;
		
	}
	.contentleft{
		width:96%;
		margin:0px;
		padding:12px;
	}
	
	.contentright{
		width:96%;
		margin:0px;
		padding:12px;
	}
	
	.footer{
		height:35px;
		text-align:center;
		padding-top:2.0%;
	}
	
	#leftrightbg {
		width:100%;
		height:1000px;
	}
	
	.footleft{
		padding:10px 0px 0px 0px;
		display:block;
		float:none;
	}
	
	.footright{
		padding:8px 0px 0px 0px;
		display:block;
		float:none;
	}
	
#leftrightbg {
	width:100%;
	height:900px;
}

#contentright {
	padding: 10px 10px 10px 20px;
	margin: 60px 35px 10px 20px;
	width: 500px;
	height:380px;
	background-color:#15232c;
	color:#FFF;
}

#contentleft {
	padding: 20px 0px 50px 45px;
	margin-right:20px;
	width: 80%;
	height: 35%;
	float: left;
}
	
}

/* ------------ 400 pixel wide version of the site ------------ */

@media only screen and (min-width:408px) and (max-width:607px){
	.container{
		width:400px;
	}
	
	.header{
		display:block;
		background-image:url(header5.jpg);
		height:137px;
	}
	
	#toggleNav{
		display:block;
	}
	
	/* -------------------- Start Navigation -------------------- */
#nav{ display:none; float:left; width:100%; background-color:#88d4aa; height:30px; padding:10px 0px 10px 0px; font-size:16px; height:100%; border-top:10px solid #0152c5;}
#nav ul {margin:2px 0 0 -35px; text-align:center;}
#nav ul li{float:none;list-style-position:inside; display:block;list-style-type:none; margin-left:0px; padding:3px 0px 3px 0px; position:relative; z-index:100;}
#nav ul li a{padding:2px 0px 2px 0px;}
#nav a, #nav a:visited{display:block; text-decoration:none;}
#nav ul li ul {	margin-left:-999em; background:none; position:relative; color:#ffffff;  font-size:14px; text-align:left; padding-bottom:0; }
html>body #nav ul li:hover ul{ margin-left:-999em; background:none; position:relative; color:#ffffff;  font-size:14px; text-align:left; padding:0px;}
#nav ul li ul {	margin-top:0em; z-index:0; visibility:hidden;}
html>body #nav ul li ul {margin-top:-3em;}
#nav ul li ul li{margin-left:-998em;}
	/*End Navigation*/
	#subnav{
		display:none;
	}
	.contentleft{
		width:96%;
		margin:0px;
		padding:8px;
	}
	
	.left{
		width:100%;
		color:#ffffff;
			font-size:20px;
	text-align:center;
	margin:2px 0px 0px 0px;
}
	
	.center{
	position:relative;
	text-align:center;
	float:left;
	color:#ffffff;
	width:100%;
	margin:-34px 0px 0px 0px;
}

.right{
	position:relative;
	font-size:20px;
	width:100%;
	float:left;
	text-align:center;
	margin:-34px 0px 0px 0px;	
}
	
	.contentright{
		width:96%;
		margin:0px;
		padding:8px;
	}
	
	.footer{
		height:35px;
		text-align:center;
	}
	
	.footleft{
		padding:10px 0px 0px 0px;
		display:block;
		float:none;
	}
	
	.footright{
		padding:15px 0px 0px 0px;
		font-size:14px;
		display:block;
		float:none;
	}
	
	#appointment{
		width:150px;
	}
}

/* ------------ 300 pixel wide version of the site ------------ */

@media only screen and (max-width:407px){
	.container{
		width:300px;
	}
	
	.header{
		display:block;
		background-image:url(header6.jpg);
		height:137px;
	}

	#toggleNav{
		display:block;
	}
	
	/* -------------------- Start Navigation -------------------- */
#nav{ display:none; float:left; width:100%; background-color:#88d4aa; height:30px; padding:10px 0px 10px 0px; font-size:16px; height:100%; border-top:10px solid #0152c5;}
#nav ul {margin:2px 0 0 -38px; text-align:center;}
#nav ul li{float:none;list-style-position:inside; display:block;list-style-type:none; margin-left:0px; padding:3px 0px 3px 0px; position:relative; z-index:100;}
#nav ul li a{padding:2px 0px 2px 0px;}
#nav a, #nav a:visited{display:block; text-decoration:none;}
#nav ul li ul {	margin-left:-999em; background:none; position:relative; color:#ffffff;  font-size:14px; text-align:left; padding-bottom:0; }
html>body #nav ul li:hover ul{ margin-left:-999em; background:none; position:relative; color:#ffffff;  font-size:14px; text-align:left; padding:0px;}
#nav ul li ul {	margin-top:0em; z-index:0; visibility:hidden;}
html>body #nav ul li ul {margin-top:-3em;}
#nav ul li ul li{margin-left:-998em;}
	/*End Navigation*/
	#subnav{
		display:none;
	}
	.contentleft{
		width:96%;
		margin:0px;
		padding:6px;
	}
	
		.left{
		width:100%;
		color:#ffffff;
			font-size:20px;
	text-align:center;
	margin:4px 0px 0px 0px;
}
	
	.center{
	position:relative;
	text-align:center;
	float:left;
	color:#ffffff;
	width:100%;
	font-size:25px;
	margin:-23px 0px 0px 0px;
}

.right{
	position:relative;
	font-size:20px;
	width:100%;
	float:left;
	text-align:center;
	margin:-20px 0px 0px 0px;	
}
	
	.contentright{
		width:96%;
		margin:0px;
		padding:6px;
	}
	
	.footer{
		height:35px;
		text-align:center;
	}
	
	.footleft{
		padding:10px 0px 0px 0px;
		display:block;
		float:none;
	}
	
	.footright{
		padding:15px 0px 0px 0px;
		font-size:14px;
		display:block;
		float:none;
	}
}