/* CSS Document */

body, html
{	margin:0px; padding:0px; position:relative; height:100%;	}

body
{
	font-family: 'Raleway',sans-serif;
	font-size:10px;
	color:#333;
	font-weight:400;
}

strong
{	font-weight:700;	}

#HeaderContainer
{
	width:100%;	 
	height:44%;
	min-height:210px;
	margin:0px 0px 30px 0px; padding:0px;
	position:relative;
}

#slides, #slides ul, #slides li
{	
	margin:0px; padding:0px; list-style:none;
}

.container
{	
	width:1000px; margin:0px auto;	position:relative;
}

.purpleWrapper
{
	background-color:#E6E5EF; padding:30px 0px; margin:30px 0px;	
}
.purpleWrapper.bottom
{
	margin:30px 0px -30px 0px;	
}

#Header
{
	background:#344552;
	position:absolute;
	top:0px;
	left:0px; 	
	width:100%;
	z-index:999;	
}

.blue
{
	color:#344552;	
}


#Sections
{
	position:absolute; top:27px; right:0px;
	display:none;
	color:#344552;
	background:#fff;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	font-size:1.5em;
	padding:8px;
	cursor:pointer;
	z-index:400;
	text-transform:uppercase;
}

img.logo
{	
	max-width:40%; height:auto; float:left; padding:10px 0px;
}


#Menu
{	
	width:60%; text-align:justify; position:absolute;
	top:58px;
	right:0px; 	
	color:#fff;
	z-index:999;	
}

#Menu ul
{
	margin:0px 0px;
	list-style:none;
	padding:0px;
	text-align:justify;
	width:100%;
	
}

#Menu li
{
	font-size:1.6em;
	line-height:1em;
	margin:0px 0px;
	list-style:none;
	padding:0px 10px;
	color:#fff; 
	text-align:center;
	display: inline-block;
	position:relative;
	text-transform:uppercase;
	vertical-align:top;
}
#Menu li a
{	color:#fff; text-decoration:none;	}

#Menu li a:hover
{	text-decoration:underline;	}


#Menu ul:after {
  content: '';
  width: 100%; /* Ensures there are at least 2 lines of text, so justification works */
  display: inline-block;
}



.twoCol
{
	width:48%;
	display:inline-table;
	vertical-align:top;
	margin-right:1.5%;
}

.threeCol
{
	width:33.3%;
	display:inline-table;
	vertical-align:top;
}



.wrapper
{
	margin:10px 10px;
	padding:20px;
	background-color:#EEE9EE;
	overflow:auto;	
}

.clinic .wrapper
{	padding:5px;	}

.wrapper.white
{
	background-color:#fff;
}

.wrapper.problems 
{	text-align:center; font-size:1.8em; color:#344552; 	}

.wrapper.problems img
{	display:block; max-width:100%; height:auto; margin:0px auto 10px auto;	}

.quotes p
{	margin:0px;	}

p.author
{	background:url(../media/images/common/quote-author.jpg) left top no-repeat;	padding-left:70px; margin-top:-10px; padding-top:10px; font-weight:700;	}

a.blockButton
{
	background-color:#344552;
	text-decoration:none;
	color:#fff;
	font-size:2.5em;
	padding:5px 10px;
	margin-top:20px;
	text-transform:uppercase;
}



h1,h3,h4, .title, .h1Style
{	font-weight:400; line-height:1em; 	margin:0px;  color:#344552;  	}


h1, .h1Style
{	font-size:3.2em; margin:0px 0px 25px 0px; text-align:center;	}
h2, .h2Style
{	font-size:1.8em; margin:15px 0px; font-weight:400; color:#344552; 		}
h2.title
{	font-size:2.5em; margin:15px 0px; font-weight:400; 	}

h3
{	font-size:2.2em; margin:25px 0px 10px 0px; line-height:1.2em; color:#BF1E2E;	}
h4
{	font-size:1.8em; margin:15px 0px;		}

p, li, table
{	font-size:1.5em; line-height:1.3em; margin:10px 0px; 	}

li
{	margin:8px 0px;	}

li p, table p
{	font-size:1em; line-height:1em; margin:0px;	}

.container ul
{	overflow:hidden;	}

.section
{
	margin-bottom:20px;
	padding:10px 20px;
	border:1px solid #D5B4A2;	
}

.section img
{
	width:100% !important; height:auto !important;
}


#recaptcha_table p, table#recaptcha_table
{	font-size:1em;	}

table#recaptcha_table a
{	font-size:0.8em;	}

a
{	color:#344552;	}

#Footer
{
	background-color:#BF1E2E;
	color:#fff;
	margin:30px 0px 0px 0px;
	padding:25px 0px 10px 0px;	
}
#Footer a
{	color:#fff;	}

#Footer p
{	font-size:1.4em;	}

#Footer p.title
{	color:#fff; font-size:3em; margin-bottom:15px;	}

#Footer p.copy
{	font-size:1.2em; text-align:right; margin-bottom:0px;	}

#Clinics
{	text-align:justify;	}

#Clinics div
{
	display: inline-block;
	position:relative;
	vertical-align:top;
}

#Clinics:after {
  content: '';
  width: 100%; /* Ensures there are at least 2 lines of text, so justification works */
  display: inline-block;
}

#End
{	clear:both;	}

.mapcontainer iframe
{	width:100% !important;	}


.video-container
{	width:100%; height:0px; padding-bottom:56.25%; position:relative;	}


.video-container iframe
{	width:100% !important; height:100% !important; position:absolute; top:0px;	}


img.right
{	float:right; margin:0px 0px 20px 20px;	}
img.left
{	float:left; margin:0px 20px 20px 0px;	}

@media only screen and (max-width:1024px)
{
	
	body
	{	width:100%;	}
	
	#Header, #PicArea, #HeadPic , #Footer, img.bannerPic
	{	width:100%; 	}
	
	.container
	{	width:95%; }
	
	
}

@media only screen and (max-width:800px)
{
	.threeCol, .threeCol.twothirds
	{	width:50%;	}
	
	img.right, img.left
	{	max-width:50% !important; height:auto !important;	}

}
@media only screen and (min-width:701px)
{
	#Menu.clicked
	{	display:block;	}	
	
	.section
	{
		width:44%;
		display:inline-table;
		vertical-align:top;
		margin-right:1.5%;
		padding:15px 2%;
	}
	
	.mapcontainer
	{	float:right; margin-left:20px; width:60%;	}
	
	
}
@media only screen and (min-width:601px)
{
	
	#Footer .right
	{	float:right;	 text-align:right;	}
	
	
	.video-container.half
	{	width:48%; height:0px; padding-bottom:27%; float:right; margin:5px 0px 20px 20px;	}

	
}

@media only screen and (min-width:701px) and (max-width:1024px)
{
	#Header .container
	{	text-align:center;	}
	img.logo
	{	float:none;
		max-width:60%; 
	}
	#Menu
	{	
		width:100%; text-align:justify; position:relative;
		top:inherit;
		right:inherit;
		margin-top:-5px;
		padding-bottom:10px;
	}
	
	#HeaderContainer
	{	height:60%;	}
	
}
@media only screen and (max-width:700px)
{
	#Sections
	{	display:block;	}

	#Menu 
	{	height:auto; display:none;  	}
	
	#Menu.clicked
	{	display:block;	}	
	
	#Menu
	{	
		text-align:left; 
		position:absolute;
		top:0;
		padding:10px 0px;
		left:-2.6%; 	
		color:#344552;
		background-color:#E6E5EF;
		z-index:10;	
		width:105.2%;
		
	}
	
	img.logo
	{	
		max-width:60%; 
	}
	
	#Menu ul
	{	text-align:left;	width:80%;	}
	
	#Menu li
	{
		margin:0px 0px;
		padding:5px 25px;
		display: block;
		text-align:left;
		color:#344552;
	}
	
	#Menu li a
	{	display:block; color:#344552;	}
	
	
	
	
}
@media only screen and (max-width:600px)
{	
	

	.twoCol
	{	width:100%; margin:0px 0px 10px 0px;	}
	
	p.author
	{	 margin-top:0px; }

	
	
	.twoCol .wrapper
	{
		margin:0px;
	}
	.threeCol, .threeCol.twothirds
	{	width:100%;	}

}
@media only screen and (max-width:500px)
{
	.container
	{	width:90%; }
	
	#Menu
	{	
		left:-5.4%; 	
		width:110.8%;
		
	}
	
	.recaptcha_image_cell
	{	width:auto;	}
}
@media only screen and (max-width:479px)
{
	
	img.logo
	{	
		max-width:none; width:200px; 
	}
	
	img.right, img.left
	{	float:none; margin:15px 0px; max-width:100% !important; width:100% !important; height:auto !important;	}


}