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

*{
	margin:0;
	padding: 0;
}

* h2, h3{
	font-weight: 400;
}

#blu-boy {
	margin: auto;
width: 90%;
height: auto;
padding: 10px 10px 10px 10px;

	display: block;
	border-top: solid 1px #999;
	border-bottom: solid 1px #999;


}

.ctr {
	margin: 0 auto;
	text-align: center;
}

.width{
	width: 100%;
	height: auto;
}

#hailst-new {
    margin: 0 auto;
    width: 200px;
    height: auto;
    padding-bottom: 20px;
    
}
* p{
	font-weight: 400;
}

body {
	background-color: #999;
	
}

#container {
	margin: 0 auto;
	width: 100%;
	height: auto;
	max-width: 960px;
	background-color: #000;
}

video { margin: 0 auto; 
		display: block;
}



#vid {
	background-image:;
	background-size: 100%;
	
	height: auto;
	background-repeat: no-repeat;
	max-width: 960px;
	
	background-color: #000;
	
}


#video-a {	
	margin-top:-36%;
	width: 332px;
	
	height: 283px;
	border: solid 1px #0F9;
	
	
	position: relative;
	z-index: 20;
	
	
}


#video {
	width: 100%;
	padding-left: 30%;
	padding-right: 30%;
	margin: 0 auto;
	max-width: 332px;
	height: 283px;
	border: solid 1px #0F9;
	margin-top: 3.15%;
	opacity: 0.5;
	
}



#blr-txt {
	margin: 0 auto;
	height: auto;
	width: 450px;
	margin-top: 10%;
	
}

#vid-reserv {
	margin: -10px auto 10px auto;	
	width: 200px;
	height: auto;
	display: block;
	
}

#blds-logo-vid {
	margin: 0 auto;
	width: 100%;
	height: auto;
	max-width: 300px;
	display: block;
	padding: 2px;
}

.blds-txt-vid {
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	font-size: 21px;
	letter-spacing: 1.5px;
	font-weight: 400;
	color: #C93;
	padding: 2% 3% 0 3%;
	display: block;
}


.txt-gry {
	color: #696969;
}
.up-20 {
	margin-top: -20%;
}

#btn-info {
	margin: 0 auto;
	width: 160px;
	height: auto;
	padding-bottom: 40px;
}

footer p{
	margin: 40px auto 20px auto;
	text-align: center;
	width: 70%;	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 1.5px;
	padding: 3px 10px 3px 10px;
	color: #036;
	background-color:#CCC;
			
	border: solid 1px #039;
	border-radius: 10px;
}

footer a:{
	
	color: #033;	
	
	text-decoration: none;
	
}
footer  a:hover {

  	color: red;
}

#truk-night-dive {
	margin: 0 auto;
	width: 100%;
	height: auto;
	max-width: 600px;
	display: block;
		padding: 0 2% 0 2%;
	
}

@media screen and (max-width: 650px) {
	
	
	.up-20 {
	margin-top: -30%;
}

#blu-boy {
	margin: auto;
width: 85%;
height: auto;
padding: 10px 10px 10px 10px;

	display: block;
	border-top: solid 1px #999;
	border-bottom: solid 1px #999;


}

#truk-night-dive {
	margin: 0 auto;
	width: 80%;
	height: auto;
	max-width: 600px;
	display: block;
		padding: 0 2% 0 2%;
	
}



	
}

/*

opacity: 0.5;

video {
  margin-left: 50vw;
  transform: translate(-50%);
}
or

<div class="video">  
  <video width="320" height="240" controls>
    <source src="video.mp4" type="video/mp4">
    <source src="video.ogg" type="video/ogg">
    <source src="video.webm" type="video/webm">
    Your browser does not support the video tag.
  </video>
</div>
*/