@charset "utf-8";
/* CSS Document */

     /*===================
  MOBILE HEADER
  ====================*/
  
.mobile-header-container{
	display:none;
	width: 100%;
	margin:0 auto;
	padding-top: 10px;
	background: #ffffff;
}
.mobile-header{
	text-align:center;
}
img.mobile-logo{
	width: 80%;
	max-width: 420px;
	margin-bottom: 15px;
}
p.mobile-ph{
	margin-bottom: 15px;
}
a.mobile-phone-number{
	font-family:Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style:normal;
	font-weight: normal;
	color: #fff;
	background-color: #6FACA6;
	padding: 3px 8px;
	border-radius:2px;
	text-decoration:none;
}
#nav-wrap{
	background: #FFFFFF;
}
.mobile-menu{
	position: relative;
	clear: both;
	width: 98%;
	margin:0 auto;
	background: #6FACA6;
	padding: 1px 0;
}
#menu-icon{
	color: #6FACA6;
	width: 37px;
	height: 27px;
	background: #ffffff url(../img/mobile-icon.png) no-repeat;
	padding: 2px 10px 0 43px;
	cursor: pointer;
	display: block;
	margin-left: 15px;
}
ul#nav{
	clear: both;
	position: absolute;
	top: 23px;
	width: 160px;
	z-index: 10000;
	padding: 5px;
	background: url(../img/menu-drop-bg.png);
	display: none;
}
ul#nav li{
	border-bottom: 1px solid #D9EAE8;
	padding: 5px 0;
}
ul#nav li:hover{
	background:#6FACA6;
}
ul#nav li.active{
	background: #ffffff;
}
ul#nav li a{
	font-family:'Open Sans', sans-serif;
	font-size: .875em;
	color: #333;
	text-decoration: none;
	padding-left: 15px;
}


/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
/*============
iPAD horizontal
=============*/
@media only screen and (max-width: 1075px) {
	.full-screen,.pad-hide{
	display:none;
}
.pad-show{
	width:100%;
}
.pad-screen{
	display:block;
}
.navigation{
	width: 96%;
}
.header,.content-block,.footer,.titles{
	width: 96%;
	max-width: 770px;
	margin: 0 auto;
}
.welcome{
	height:auto;
	padding: 15px 20px;
	background: #fff;
	margin-bottom: 10px;
}
/*-----------------------
PERIODONTICS
=======================*/
.perio-container{
	padding-top: 10px;
}
.perioT{
	width:100%;
	float:left;
	background: #6FACA6; 
	height: 100px;
}
.perioT h1{
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-size: 38px;
	font-style:italic;
	text-align: center;
	padding-top: 25px;
}
.perioB{
	width:100%;
	float:right;
	background: #D9EAE8; 
	height: 150px;
}
.perioB h3{
	color: #000;
	font-family: 'Open Sans', sans-serif;
	font-size: .875em;
	font-style:normal;
	text-align:left;
	padding: 30px 10px 0;
	line-height: 1.8em;
}


/*--------------------
 HOME IMPLANTS
=====================*/
.implant-container{
	padding-top: 10px;
	padding-bottom: 0;
}
.implantPL{
	width: 35.29411%;
	float: left;
	background: #6FACA6;
	height:auto;
	margin-bottom: 5px;
}
.implantPL h1{
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-size: 38px;
	font-style:italic;
	text-align: center;
	padding-top: 30px;
}
.implantPR{
	width:63.86554%;
	background: #D9EAE8;
	float: right;
	height:auto;
	padding-bottom: 15px;
}

.implantPR h3{
	color: #000;
	font-family: 'Open Sans', sans-serif;
	font-size: .875em;
	font-style:normal;
	text-align:left;
	padding: 30px 10px 0;
	line-height: 1.8em;
}
.messagePR{
	width: 27.272727%;
	max-width: 210px;
	float: right;
	margin:0;
	padding:0;
	
	height:285px; 
}
.messagePL{
	width: 71.42857%;
	max-width: 555px;
	float: left;
	height: 340px;
	background: #D9EAE8; 
}
.messagePL h2{
	color: #000;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.0625em;
	text-align:center;
	font-style:normal;
	padding-top: 20px;
	padding-bottom: 20px;
}
.messagePL hr{
	width: 80%;
	margin: 0 auto;
}
.messagePL p{
	color: #000;
	font-family: 'Open Sans', sans-serif;
	font-size: .875em;
	font-style:normal;
	text-align:left;
	font-style:italic;
	padding: 10px 20px 0;
	line-height: 1.5em;
}
.blog{
	background: #FFFFFF;
	height: auto;
	padding:-bottom: 15px;
}

/*---------------
MENU
 --------------- */
#jsddm
	{	display: table;
		margin: 0 auto;
		padding:0;
		z-index:500;
	}

	#jsddm li
	{	float: left;
		list-style: none;
		font: 10px  Arial, sans-serif;
		text-align: center;
	}

	#jsddm li a
	{	display: block;
		background: #FFFFFF;
		text-decoration: none;
		border-right: 1px solid #6FACA6;
		padding: 5px 5px;
		width: 80px;
		color: #333;
		white-space: nowrap;
	}

	#jsddm li a:hover
	{	background:#9EC7C2;
	color: #ffffff;
	}
		
	#jsddm li ul
	{	margin: 0;
		padding: 0;
		position: absolute;
		visibility: hidden;
		border-top: 1px solid white;
				z-index:500;

	}
	
	#jsddm li ul li
	{	float: none;
		display: inline;
		padding: 5px 0;
		z-index:500;
		text-align: left;

	}
	
	#jsddm li ul li a
	{	width: 200px;
		background: url(../img/menu-drop-bg.png);
		color: #333333;
		padding: 5px 10%;
	}
	
	#jsddm li ul li a:hover
	{	background: #6faca6;
	color: #ffffff;
	}
	
}
/*============
iPAD vertical
=============*/
@media only screen and (max-width: 800px) {

	
	
}

/*=================
PHONE HORIZONTAL
=================*/
	@media only screen and (max-width:650px){
.hide,.bio-pic{
	display:none;
}
.page-titleL h1{
	font-size: 16px;
}
.page-titleR h2{
	font-size: 12px;
}
.show,.bio-text{
	width: 96%;
	padding:10px;
	margin:0 auto;
	border:none;
	float:none;
}
.bio-text p{
	font-size: 12px;
}
.p20{
	padding: 0;
}
p.large{
	font-size:.875em;
}
.blog{
	display: none;
}
		
.mobile-header-container{
	display: block;
}
.mobile-hide{
	display:none;
}
.welcome{
	margin-bottom: 10px;
}
.messagePL{
	height:auto;
	padding: 15px 0;
	width:auto;
}
.messagePL h2{
	color: #000;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.0625em;
	text-align:center;
	font-style:normal;
	padding-top: 0px;
	padding-bottom:10px;
}
.perio-container{
	padding:10px 0 0;
}

.perioT{
	width: auto;
	height: auto;
	padding: 15px 0;
}

.perioB{
	width: auto;
	height: auto;
	padding: 15px 0;
	margin:0;
}
.perioT h1{
	padding: 0;
	margin:0;
}
.implantPL{
	width:auto;
	float: none;
	background: #6FACA6;
	height:auto;
	margin:0;
	padding: 15px 0;
}
.implantPL h1{
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-size: 38px;
	font-style:italic;
	text-align: center;
	padding:0;
	margin:0;
}
.implantPR{
	width:auto;
	background: #D9EAE8;
	float:none;
	height:auto;
	padding: 15px 0;
}

.implantPR h3{
	color: #000;
	font-family: 'Open Sans', sans-serif;
	font-size: .875em;
	font-style:normal;
	text-align:left;
	padding: 30px 10px 0;
	line-height: 1.8em;
}
	

			
	}

/*=================
PHONE VERTICAL
==================*/
	@media only screen and (max-width:400px){
				.hide{
			display:none;
		}

			
	}