@charset "utf-8";

body{
	font-family: Arial;
}
/* CSS Document */
#headerline{
	width: 100%;
	height: auto;
	display: inline-block;
}

#headerdiv{
	margin: auto;
	width: 65%;
}

#headerdivline{
	height: 8px;
	width: 100%;
	background-color: #2f4378;
}
.meunstyle{

}

.headerbanner{
	padding-top: 10px;
}

.bannerimage1{
	content:url(../images/01-banner-index.png?r=1);
	width: 100%;
}

.bannerimage2{
	content:url(../images/02-banner-index_new.png?r=1);
	width: 100%;
}
.indexbtn1 ,.indexbtn2{
	width: 19.5%;
	float: left;
	text-align: center;
}

.indexbtn1 > .indexbtnimage ,.indexbtn2 > .indexbtnimage{
	float: left;
	width: 85%;
	margin: 15%;
}

.indexbtn1 > h6, .indexbtn2 > h6{
	color: #3b4a84;
	font-weight: bold;
	margin-top: 5%;
}

#level2btn{
	position: absolute;
	top: 60%;
	left: 48%;
}

#level2title{
	position: absolute;
	top: 15%;
	left: 45%;
	background-color: white;
	font-size: 27px;
	color: #3c4980;
	padding: 0 10px;
	font-family: Arial Black; 
	font-weight: bold;
		
}

#level2info{
	position: absolute;
	top: 28%;
	left: 40%;
	font-size: 19px;
	color: #3c4980;
	padding: 0 10px;
	font-family: Arial Black; 
	text-align: center;
		
}

.btn{
	font: bold 13px Arial;
	text-decoration: none;
	background-color: #8fb1ca;
	color: white;
	padding: 10px 30px 10px 30px;;
}
.level3class{
	width:70%; 
	margin: auto;
}

.tablediv{
	width: 80%;
	margin: auto;
	display: inline-block;
	vertical-align: top;
}
.tablerrow{
	width: 48%;
	display: inline-block;
	vertical-align: top;
	margin-bottom: 10px;
}
.tableleftfont{
	color: white;
}
.tablerightfont{
	color: white;
}
#contactdiv{
	background-color: #474747; 
	width: 100%; 
	display: inline-block;
	height: auto;
	padding-bottom: 10%;
}
.footerclass{
	background-image: url(../images/footer-bg.jpg?r=1);
	background-repeat: no-repeat;
	height: 100px;
	position:relative;
	width: 80%;
	margin: 10px auto auto;
}


.footertext{
	font: normal 9px Arial;
}

.footerbtn{
	
	font: bold 11px Arial;
	text-decoration: none;
	border-right: 1px solid #47474747;

	padding: 5px 25px 5px 25px;
}
.headerbtn{
	
	font: bold 13px Arial;
	text-decoration: none;
	border-left: 1px solid #47474747;

	padding: 5px 25px 5px 25px;
}

.aboutimage1{
	content:url(../images/02-banner-about.png?r=1);
	width: 100%;
}

.infotext{
	width: 100%; 
	display: inline-block;
	height: auto;
	padding-bottom: 10%;
}

.treatmentimage{
	content:url(../images/03-banner-treatment.png?r=1);
	width: 100%;
}
.contactfont{
	color: black;
}
.contactinfoleft{
	width: 49%;
	float: left; 
	font: normal 15px Arial;
	margin-bottom: 50px;

}

.contactinforight{
	width: 45%;
	float: left; 
	padding-left: 4%;
	font: normal 15px Arial;
	margin-bottom: 50px;
}
.googlemap{
	width: 400px;
	height: 300px;
}
.bodytext{
	margin-top: 80px;
	width: 80%;
	padding: 0 0 50px 0;
	margin: auto;
}
.titlediv{
	width: 100%;
	display: inline-block; 
	padding-bottom: 60px; 
	padding-top:60px;
}
#mobile{
	display: none;
	text-align: center;
}

.treat1, .treat2{
	width: 100%;
	float: left;
	text-align: center;
	margin: auto;
	margin-bottom: 30px;
}

.indexbtn1a{
	width: 33%;
	margin: auto;
	float: left;
}

.indexbtn2a{
	width: 33%;
	margin: auto;
	float: left;
}

.treatcap > h6{
	color: #3b4a84;
	font-weight: bold;
	margin-top: 5%;
	display: block;
}

.treatimg > center> .indexbtnimage{
	width: 50%;
	display: block;
}
.treatimg2 > center > .indexbtnimage{

	width: 50%;
	display: block;
}

.treatimg{
	width: 100%;
	float: left;
}
.treatcap{
	width: 100%;
	float: left;
}
.treatmeun{
	width: 100%;
	float: left;
	display: inline-block;
}

.treatmeunline1{
	width: 50%;
	float: left;
}
.treatmeunline2{
	width: 50%;
	float: left;
}
.treatmeunline1 > .treatmeunbox1{
	width: 32%;
	float: left;
	display: inline-block;
}
.treatmeunline2 > .treatmeunbox2{
	width: 32%;
	float: left;
	display: inline-block;
}

.treatmeunbox1 > .treatmeunimg, .treatmeunbox2 > .treatmeunimg{
	width: 42%;
	margin-right: 3%;
	float: left;
}

.treatmeunimg > .indexbtnimage{
	width: 100%;
}

.treatmeunbox > .treatmeuntext{
	width: 44%;
	margin-right: 3%;
	float: right;
}

.treatmeuntext > h6{
	color: #3b4a84;
	font-weight: bold;
	display: block;
}

.title{
	color: #3b4a84;
	font:19px bold Arial;
	font-weight: bold;
}

.maininfo{
	margin-top: 120px;
	font:15px bold Arial;
	width: 100%;
	display: block;
}

.maininfo > .maintext{
	width: 100%;
	display: inline-block;
	margin-top: 9px;
}

p > .infoimage{
	width: 40%;
	float: left;
	margin-bottom: 10px;
}

.maintext > .infoimage{
	width: 40%;
	float: left;
	margin-bottom: 10px;
}

#css_table {
      display:table;
  }
.css_tr {
      display: table-row;
      height: 30px;
  }
.css_td {
      display: table-cell;
  }

.td_rowleft{width: 15%;}

.td_rowright{width: 84%;}

@media only screen and (max-width: 768px){
	#level2btn{
		top: 65%;
		left: 42%;
	}
	
	#level2title{
		display: none;
	}

	#level2info{
		display: none;
	}
	#headerdiv{
		width: 100%;
	}
	.bannerimage1{
		content:url(../images/mobile-01-banner.png?r=1);
	}
	.bannerimage2{
		content:url(../images/mobile-02-banner.png?r=1);
	}
	.indexbtn1m{
		width: 30%;
		margin: auto;
		margin-top: 5%;
	}
	.indexbtn2m{
		width: 33%;
		margin: auto;	
		margin-top: 5%;
		float: left;
	}
	
	.indexbtn1m > .indexbtnimage ,.indexbtn2m > .indexbtnimage{
		float: left;
		width: 85%;
		margin: 15%;
	}
	.level3class{
		width:95%; 
		margin: auto;
	}
	.tablerrow{
		width: 100%;
		display: inline-block;
	}
	.headerbtn{
		border-left: 0px solid #47474747;
	}
	.aboutimage1{
		content:url(../images/04-banner-contact_m.png?r=1);
		width: 100%;
	}
	
	.infotext{
		width: 80%;
	}
	
	.treatmentimage{
		content:url(../images/mobile-03-banner.png?r=1);
		width: 100%;
	}
	.contactinfoleft{
		width: 98%;
		padding-left: 0.1%;
	}

	.contactinforight{
		width: 90%; 
		padding-left: 1%;
	}
	.googlemap{
		width: 300px;
		height: 200px;
	}
	#desktop{
		display: none;
	}
	#mobile{
		display: flex;	
	}
	.mindex1{
		width: 100%;
	}
	
	.treatimg >  center>  .indexbtnimage{
		width: 60%;
	}
	.treatimg2 > center > .indexbtnimage{
		width: 45%;

	}
	.treatmeunline1{
		width: 99%;
		margin-bottom: 20px;
	}
	.treatmeunline2{
		width: 99%;
		margin-bottom: 20px;

	}
	.treatmeunline1 > .treatmeunbox1{
		width: 32%;
	}
	.treatmeunline2 > .treatmeunbox2{
		width: 32%;
	}
	.treatmeuntext > h6{
		font-size: 13px;
	}
	.maintext > .infoimage{
		width: 90%;
	}
	
	p > .infoimage{
		width: 90%;
	}
	
	.td_rowleft{width: 20%;}

	.td_rowright{width: 80%;}
}