
body{
	margin: 0px;  
}

a{

  font-weight: 700;
}

#logo {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	width: 231px;
	height: 70px;
	background-image: url('images/logo.png');
}


@media screen and (max-width: 800px) {
  #logo {
background-image: url('images/logo-small.png');
width: 132px;
height: 40px; 
  }
}


#footercontainer {
	background: #3B3B3B;
	margin-top: 20px;
	width: 100%;
	height: 100px;
	font-family: 'Open Sans', sans-serif;
 font-weight: 400;
 font-size: 10px;
 text-align: center;
 color: #EFEFEF;
	
}

#maincontainer {
	text-align: center;
}

#footercontent{
	padding-top: 30px;
}

#social {
	background: #EEEEEE;
	height: 25px;
	margin-bottom: 0px;
	}


	#header {
	text-align: center;
	margin-top: 15px;
	margin-bottom: 15px;
}

#topmenu {
width: 100%;
text-align: center;
margin-left: 0px;
padding: 0px;
}

#nav {
width: 800px;
max-width: 90%;
margin-left: auto;
margin-right: auto;
text-align: left;
}

@media screen and (max-width: 470px) {
  #nav {
width: 134px;
margin-left: auto;
margin-right: auto;
  }
}

#nav1 {
background: #EEEEEE;
width: 130px;
height: 25px;
display:inline-block;
text-align: center;
}

@media screen and (max-width: 470px) {
 #nav1 {
margin-bottom: 5px;
  }
}

#nav2 {
background: #EEEEEE;
width: 130px;
height: 25px;
margin-left: 1px;
display:inline-block;
text-align: center;
}

@media screen and (max-width: 470px) {
 #nav2 {
margin-bottom: 5px;
  }
}

#nav3 {
background: #EEEEEE;
width: 130px;
height: 25px;
margin-left: 1px;
display:inline-block;
text-align: center;
}

@media screen and (max-width: 470px) {
 #nav3 {
margin-bottom: 5px;
  }
}

a {
font-family: 'Open Sans', sans-serif;
font-weight: 700;
text-decoration: none;
color: #2F3030;
}


h3 {
 font-family: 'Open Sans', sans-serif;
 font-weight: 700;
 font-size: 48px;
display: inline;
text-align: center;
}

@media screen and (max-width: 800px) {
  h3 {
    font-size: 28px;
  }
}

h4 {
font-family: 'Open Sans', sans-serif;
font-weight: 500;
font-size: 18px;
display: inline;
text-align: center;
}

@media screen and (max-width: 800px) {
  h4 {
    font-size: 12px;
  }
}

h1 {
font-family: 'Open Sans', sans-serif;
font-weight: 300;
font-size: 23px;
display: inline;
text-align: center;
}

@media screen and (max-width: 800px) {
  h1 {
    font-size: 14px;
  }
}




#peppic-1 {
background-image: url('images/interior.png');
background-repeat: no-repeat;
background-position: center; 
height: 210px;
width: 210px;
margin-left: 20px;
float: left;
position: relative;
  top: 50%;
  transform: translateY(-50%);
  display:inline-block;
  }

    @media screen and (min-width:445px) and (max-width: 800px) {
#peppic-1 {
background-image: url('images/interior-s.png');
height: 100px;
width: 100px;
margin-left: 5px;
margin-right: 5px;
  }
}

  @media screen and (max-width: 445px) {
#peppic-1 {
width: 0px;
height: 0px;

  }
  }




#peppic-2 {
background-image: url('images/exterior.png');
background-repeat: no-repeat;
background-position: center; 
margin-right: 20px;
margin-left: 10px;
width: 210px;
height: 210px;
float: right;
position: relative;
  top: 50%;
  transform: translateY(-50%);
  display:inline-block;
}

    @media screen and (min-width:445px) and (max-width: 800px) {
#peppic-2 {
background-image: url('images/exterior-s.png');
height: 100px;
width: 100px;
margin-left: 5px;
margin-right: 5px;
  }
}

  @media screen and (max-width: 445px) {
#peppic-2 {
width: 0px;
height: 0px;

  }
  }



#buspic {
background-image: url('images/busmap.png');
width: 200px;
height: 200px;
margin-left: 20px;
float: left;
position: relative;
  top: 50%;
  transform: translateY(-50%);
  display:inline-block;
}

    @media screen and (min-width:445px) and (max-width: 800px) {
#buspic {
background-image: url('images/busmap-s.png');
height: 100px;
width: 100px;
margin-left: 5px;
margin-right: 5px;
  }
}

  @media screen and (max-width: 445px) {
#buspic {
width: 0px;
height: 0px;

  }
  }



#row-1 {
height: 250px; 
text-align: left;
}

#row-2 {
height: 250px;
text-align: right;
}

#location-detail-1 {
background-image: url('images/rbgb.png');
width: 800px;
min-width: 300px; 
max-width: 90%;
height: 500px;
margin-left: auto;
margin-right: auto;
display:inline-block;
text-align: center;
}


#content-1 {  
  background: #FFFFFF;
  height: 200px;
  width: 535px; 
  min-width: 284px; 
  max-width: 64%;  
  margin-left: 10px;
  margin-bottom: 25px;
  padding-left: 6px;
  padding-right: 6px;
 font-family: 'Open Sans', sans-serif;
font-weight: 400;
font-size: 12px;
text-align: justify;
float: left;
position: relative;
  top: 50%;
  transform: translateY(-50%);
  display:inline-block;
  }


  @media screen and (max-width: 800px) {
#content-1 {
font-size: 9px;
margin-left: 2px;
margin-right: 2px;
  }
}

#content-2 {	
	background: #FFFFFF;
  height: 120px;
  width: 535px; 
  min-width: 284px; 
  max-width: 64%;   
  margin-bottom: 25px;
  padding-left: 6px;
  padding-right: 6px;
 font-family: 'Open Sans', sans-serif;
font-weight: 400;
font-size: 12px;
text-align: justify;
float: right;
position: relative;
  top: 50%;
  transform: translateY(-50%);
  display:inline-block;

	}

	@media screen and (max-width: 800px) {
#content-2 {
font-size: 9px;
margin-left: 2px;
margin-right: 4px;
  }
}

#location-detail-2 {
background-image: url('images/rbgy.png');
width: 800px;
min-width: 300px; 
max-width: 90%;
height: 250px;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
display:inline-block;
}

#content-3 {  
  background: #FFFFFF;
  height: 200px;
  width: 535px; 
  min-width: 284px; 
 max-width: 64%;  
  margin-left: 10px;
  margin-bottom: 25px;
  padding-left: 6px;
  padding-right: 6px;
 font-family: 'Open Sans', sans-serif;
font-weight: 400;
font-size: 12px;
text-align: justify;
float: left;
position: relative;
  top: 50%;
  transform: translateY(-50%);
  display:inline-block;
  }

  @media screen and (max-width: 800px) {
#content-3 {
font-size: 9px;
margin-left: 2px;
margin-right: 4px;
  }
}


#registerbar {
background-image: url('images/rbgr.png');
width: 800px;
min-width: 300px; 
max-width: 90%;
height: 200px;
margin-top: 0px;
margin-bottom:20px;
margin-left: auto;
margin-right: auto;
display:inline-block;
text-align: center;
}

#content-4 {  
  background: #FFFFFF;
  height: 150px;
  width: 665px; 
  min-width: 284px; 
  max-width: 85%;  
  margin-left: 10px;  
  padding-left: 6px;
  padding-right: 6px;
 font-family: 'Open Sans', sans-serif;
font-weight: 400;
font-size: 12px;
text-align: justify;
position: relative;
  top: 50%;
  transform: translateY(-50%);
  display:inline-block;
  text-align: center;
  }

  @media screen and (max-width: 800px) {
#content-3 {
font-size: 9px;
margin-left: 2px;
margin-right: 4px;
  }
}


.name {
	font-size: 20px;
	font-weight: 700;
}

.bold {  
  font-weight: 700;
}

.credential {
	font-size: 20px;	
}


h2 { 
   position: absolute; 
   top: 20px; 
   left: 0; 
   width: 100%; 
}

@media screen and (max-width: 800px) {
  h2 {
    top: -8px;
    
  }
}
    
h2 span { 
   color: white; 
   font: bold 24px/48px Helvetica, Sans-Serif; 
   letter-spacing: -1px;  
   background: rgb(0, 0, 0); /* fallback color */
   background: rgba(0, 0, 0, 0.7);
   padding: 10px;    
}

@media screen and (max-width: 700px) {
  h2 span{
    color: white; 
   font: bold 16px/19px Helvetica, Sans-Serif;   
    padding: 5px;
  }
}


.image { 
   position: relative; 
   width: 100%; /* for IE 6 */
}

h5 { 
   position: absolute; 
   top: 20px; 
   left: 0; 
   width: 100%; 
   font-family: 'Open Sans', sans-serif;
   font-weight: 400;
   font-size: 18px;    
   margin-top: 120px;
   margin-left: 10px;
   margin-right:10px;
}

@media screen and (max-width: 700px) {
  h5 {
       font-weight: 400;
   font-size: 12px;    
   margin-top: 70px;
   margin-left: 10px;
   margin-right:10px;
  }
}
    
h5 span { 

}
#bgband {
	width: 100%;
	height: 500px;
	background-color: #EEEEEE;	
	margin-top: 0px;	
}

