html{
 	background-image: url("img/neutral.png");
 	
 	position: relative;
   /* min-width: 1024px;
    min-height: 768px;*/
   
}

 body{
 	  
  
   
 }

 img {
		
		clear: both;

} 

.banner_container{
	width: 100%;
	position: relative;
	clear: both;
	/*float: centre;*/

}

.banner img{

	background-size: contain;
	width: 100%;
	height: 20%;	
	
	 }



#nav a:hover{
	background-color: teal;
	
}

ul{
	list-style: none;
}

li{
	display: inline-block;
	float: right;
	padding-right: 10px;
}

a{
	text-decoration: none;
}


hr{
	margin-top: 30px;
	width: 90%;
	border: 0;
    height: 1px;
    background: #333;
    background-image: -webkit-linear-gradient(left, #ccc, teal, #ccc); 
    background-image:    -moz-linear-gradient(left, #ccc, teal, #ccc); 
    background-image:     -ms-linear-gradient(left, #ccc, teal, #ccc); 
    background-image:      -o-linear-gradient(left, #ccc, teal, #ccc); 
 
}

.vid_container{
	/*border: solid tomato;
	border-radius: 10px;
	background-color: teal; */
	
	height: 500px;
	padding-left: ;
		
	margin-top: 100px;

}


#vid_player{
	
	
	margin-right: ;
	margin-top: auto;
	
	text-align: center;	
	display: inline-block;
	width: 50%;
	


}

.links_contain{

	width: 70%;
	display: -webkit-flex;
	-webkit-flex-direction: row;
	-webkit-justify-content: space-between;
	-webkit-flex-wrap: wrap;
	border: solid teal;
	border-radius: 5px;
	background-color: #BCED91;

		
}

.thumbnail{
	float: left;	
	width: 200px;
	border-radius: 5px;
	margin-top: 20px;

}

.thumbnail img{
	width: 100px;
	height: 100px;
	border-left: 50px;
	clear: both;
	

}

p:hover{

}

/*

.trans:hover{
	-webkit-transform: rotate(2turn);
	-webkit-transform-origin: 100% 100%;
}

.trans{
	transition: 1s ease-in-out;
}
*/

.thumbnail a{
	font-family: Nunito;
	color:teal;

}

/*
.link_1 {
	
	border: solid 2px teal; 
	border-radius: 5px;
	height: 150px;
	width: 150px;
	display: table;
	text-align: center; 
	position: relative;
	float: left;


}



.link_2 {
	
	border: solid 2px teal; 
	border-radius: 5px;
	height: 150px;
	width: 150px;
	margin-left: 35%;

	text-align: center; 
	position: absolute;
	clear: both;
	
}


.link_3 {
	
	border: solid 2px teal; 
	border-radius: 5px;
	height: 150px;
	width: 150px;
	
	float: right;
	text-align: center; 
	margin-right: 0%;
	position: relative;
	
}

.link_3 {
	
	border: solid 2px teal; 
	border-radius: 5px;
	height: 150px;
	width: 150px;
	
	float: right;
	text-align: center; 
	margin-right: 0%;
	position: relative;
	
}
*/

#img1{
	border-radius: 0px;
}


.footer_border{
	margin-top: 80px;
	width: 100%;
	border-top: solid tomato;
	background-color: teal;
	clear: both;
	bottom: 0px;

}
.footer{

	width: 80%;
	margin-left: ;
	text-align: center;
	border:;
	position: relative;
	margin-top: 10px;

}

.footer img{
	height: 50px;
	width: 50px;
	border-radius: 10px;

}

.footer p{
	display: inline-block;
	margin: 10px;
}


/* CSS Style for Puzzle Page*/

.info_contain{
	border:tomato solid;
	width: 50%;
	height: 300px;
	float: left;
	margin-top: 0px;
	

}
#selec_contain{
	width: 100%;
	height:;
	padding-left: ;
	
	float: right;
	margin-top: 100px;
	border: teal solid;
	margin-bottom: 10%;
	 
}

#selector{

	float: left;
	margin-bottom: 20px;
	border: tomato solid;
	width: 20%;
	margin-left: 25%;
	
}

#ImgThumb{
	border: solid teal;
	width: 50%;
	height: 100px;
	margin-bottom: 20px;
	margin-left: 25%;
	
	
	position: relative;
}

#ImgThumb img{
	width: 100%;
	height: 100px;
	position: relative;
}

.img_info p{
	text-align: center;
}

/*CSS for Virtual Tour Page*/

.tour_container{
	width: 940 px;
	height: 90%;
	margin-bottom: 1%;
	margin-top: 1%;
	margin-left: 1%;
	margin-right: 1%;
	clear: both;
}


.tour_container2{
	width: 800 px;
	height: 90%;

}

.container{
	/*height: 90%;
	margin-top: 5%;
	margin-bottom: 5%;
	clear: both;*/
	width: 940 px;
	position: relative;
	clear: both;
}

#tour_player{
	height: 90%;
	width: 940 px;
	margin-bottom: 1%;
	margin-top: 1%;
	margin-left: 1%;
	margin-right: 1%;
	clear: both;
	
}


/*Introduction Page Css*/

#content{
/*border: solid teal;
margin-right: 1%;
padding-left: 1%;
float: right;*/


}
#content p{
	text-align: justify;
	margin-left: 3%;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 11pt;
	

}

#content h2{
	text-align: left;
	margin-left: 3%;

}
#content h4{
	text-align: left;
	margin-left: 3%;

}

.video{
	float: right;
	clear: both;
	margin-right: 2%;
	padding-left: 2%;
	position: relative;

}


/*iphone queries*/
@media screen and (max-width: 480px){
	.banner img{

	background-size: contain;
	width: 100%;
	height: 20%;	
	
	 }

	 li{

	 	font-size: 12px;
	 }

	 .vid_container {
	/*border: solid tomato;
	border-radius: 10px;
	background-color: teal; */
	display: -webkit-flex-wrap;
	background-size: contain;
	
}

#vid_player{
	
	display: -webkit-flex-wrap;
	background-size: contain; 
	

}

}