body, html {
  margin: 0;
  height: 100%;
}
.content{
	width: 100%;
	margin: 0%;
	overflow: hidden;
	margin-bottom: 6%;

}
.content-body{
	margin: 2% 5%;
}
.content-header{
	width: 100%;
	margin: 0%;
	padding: 0%;
	overflow: hidden;
	height: 23vw;
}
.header-body{
		position: absolute;
		margin-top: 12%;
		width: 97%;
		margin-left: 3%;
		overflow: hidden;
		z-index: 0;
}

	.header-body h1{
		margin: 0%;
		color: white;
		text-align: center	;
        font-size: 3vw;
	}

.content-header img{
	width: 100%;
	max-width: 100%;
	height: auto;
	margin: 0;
}
.prof-det{
  float: left;
  width: 40%;
  height: auto;
  padding: 2% 5%;
}
.prof-det h3{
  font-size: 3vw;
  color: black;
  font-weight: bolder;
}
.prof-det input[type='submit'], .prof-det input[type='text'], .prof-det input[type='email']{
    width: 100%;
    height: 3vw;
    padding: 1%;
    margin-top: 2%; 
    color:black;
    border: none;
    border-bottom: 1px solid #999999;
    background: white;


}
.prof-det input[type='submit']{
  width: 100%;
    height:3vw;
    padding: 1%;
    margin-top: 2%; 
    color:white;
    border: none;
    background: #ffb700;
 
}
.prof-det textarea{
  resize: none;
  width: 100%;
    height: 6.5vw;
    padding: 1%;
    margin-top: 2%; 
    color:black;
     border: none;
    border-bottom: 1px solid #999999;
    background: white;
}
.prof-det ::placeholder {
  color: #999999;
  margin-left: 5%;
  font-size: 1vw;
}


.prof-map{
  float: left;
  width: 100%;
  height: auto;
  margin-top:2.5%;
   padding: 5%;
  height: 600px;
}
.prof-map iframe{
    width: 100%;
    height: 100%;
}
.prof-img{
  float: left;
  width: 40%;
  height: auto;
   padding: 2% 5%;
  height: 400px;
}
.prof-img h4{
  color: black;
  font-size: 1.5vw;
  font-weight: bold;
 
    margin: 0;
     margin-top: 3%;
}
.prof-img h3{
  color: black;
  font-size: 3vw;
  font-weight: bolder;
  margin: 0;
   margin-top: 8.5%;
}
.prof-img p{
  color: black;
  font-size: 1vw;
  margin-top: 1%; 
  line-height: 1.5vw;
}

  .bgimg-1, .bgimg-2, .bgimg-3 {
  position: relative;

  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}

#pc{
  display: block;
}
#cp{
  display: none;
}
@media only screen and (max-width: 768px) {
 .content-header{
  height: 40vw;
}
.header-body{
      margin-top: 19%;
}
  .header-body h1{
        font-size: 8vw;
  }
  #pc{
  display: none;
}
#cp{
  display:block;
}
    .container{
  margin:0% 0% 0% 0%;
  padding:0% 0%;
  overflow: hidden;
}
.prof-det{
  width: 90%;
  height: auto;
}
.prof-det h3{
  font-size: 8vw;
  color: black;
  font-weight: bolder;
}
.prof-det input[type='submit'], .prof-det input[type='text'], .prof-det input[type='email']{
    width: 100%;
    height: 8vw;
    padding: 1%;
    margin-top: 4%; 
    color:black;
       border-bottom: 1px solid #999999;
    background: white;


}
.prof-det input[type='submit']{
  width: 100%;
    height: 8vw;
    padding: 1%;
    margin-top: 4%; 
    color:white;
    border: none;
    background: #ffb700;
}
.prof-det textarea{
  resize: none;
  width: 100%;
    height: 16vw;
    padding: 1%;
    margin-top: 4%; 
    color:black;
       border-bottom: 1px solid #999999;
    background: white;
}
.prof-det ::placeholder {
  color: #999999;
  margin-left: 5%;
  font-size: 2.5vw;
}
.prof-img{
  float: left;
  width: 100%;
  height: auto;
  margin-top: 1%;
  padding: 0% 5%;

}
.prof-img h4{
  color: black;
  font-size: 4vw;
  font-weight: bold;

}
.prof-img h3{
  color: black;
  font-size: 8vw;
  font-weight: bolder;
}
.prof-img p{
  color: black;
  font-size: 3vw;
  margin-top: 1%; 
  line-height: 4.5vw;
}
.prof-map{
  float: left;
  width: 100%;
  height: auto;
  padding: 5%;
  height: 300px;
}
.prof-map iframe{
    width: 100%;
    height: 100%;
}
  }