body {
  margin: 0;
  padding: 0;
  border: 0;
  
}

a:active,
a:hover {
  outline: 0;
}

a {
	text-decoration: underline;
	color: blue;
}

@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }

div.logo{
	width: 9em;
	float: left;
	position: absolute;
	top: 5px;
	left: 5px;
	
}

div.logo2{
	width: 9em;
	float: rigth;
	position: absolute;
	top: 5px;
	right: 5px;
	
}

h1.main-title {
	color: #00008b;
	text-align: center;
	font-size: 250%;
}

h1.main-2 {
	color: #00008b;
	text-align: center;
	font-size: 200%;
}

h3.main-3 {
	color: #00008b;
	text-align: center;
	font-size: 150%;
}

h3.main-3 a {
text-decoration: underline;
}

#logopic{
	width: 9em;
	
	opacity: 1.0;
}

div.nav-menu{
	text-align: center;
}
ul.menu{

	list-style-type: none;
    margin: 0;
margin-left: 9em;
margin-right: 9em;
    padding: 0;
    overflow: hidden;
    
 
    margin-top: -5px;
	text-align: center;
		top: 0;

    vertical-align:top;
}

ul.menu li.icon {display: none;}


li.menu-item {
	display: inline-block;
   border: 0px;

	
	width: 6em;
	
	
	
	padding: 0px;
		
text-align: center;
vertical-align:top;

	}

li.menu-item a {
    color: white;
    text-align: center;
    padding: 0px 0px 0px 0px;
    text-decoration: none;
vertical-align:top;
    
height: 6em;
	
display: flex;
  align-items: center;
  justify-content: center;
  
color: blue;

background-image: url("./images/bubble.png");
	background-repeat: no-repeat;
	ackground: url(img_flwr.gif);
    background-size: 100% 100%;
	
	margin: 6px;	
	margin-top: 6px;
}



li.menu-item a:hover {
    background-size: 100% 100%;
	font-size: 100%;
margin: 0px;
padding: 2px;

}


li.menu-home {
	display: inline-block;
   
	border-right: 1px solid #bbb;
	
	width: 6.5em;
	background-color: #191970;
	right: 0;
	top: 0;
	position: absolute;
	font-size: 16px;

	}
	

li.menu-home a {
	display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    
height: 2em;

float: rigth;
}




.backgrounds {
  z-index:-1;
  position: absolute;
  width: 100%;
  height: 7.2em;
  top: 0em;
}

#bgpic{
  width: 100%;
  height: auto;
  top: 0px;
}

.topbar{
	Background-color: #1E90FF;
	background-image: url("http://divetrip.davidht.pw/images/banner_background.jpg");	

	width: 100%;
	height: 6.3em;
    margin-left: auto;
    margin-right: auto;
	top: 0px;
padding: 0px 0px 0px 0px;
    position: fixed;
	
	z-index: 10;
}




div.body-content{
clear: left;
clear: right;
padding: 0px;
margin: 20px;
margin-top: 100px;
}

div.body-full{
	clear: left;
clear: right;
padding: 0px;
margin: 0px;
	margin-top: 100px;
	
}

footer{
Background-color: #1E90FF;
background-repeat: no-repeat;
background-size: 100% 100%;
clear: left;
clear: right;
text-align: center;	

}

.contact {
	padding-left: 7px;
	padding-right: 7px;
}

div.tinytext{

color: white;

	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: xx-small;
	
	
}

div.ifofooter{
	
	display: inline-block;
background: rgba(255, 255, 255, 0.3);
text-align: center;	
border-radius: 25px;
vertical-align: middle;
padding: 10px 10px 10px 10px;

margin: 10px 0 10px 0;


}

div.ifofooter a:link{
	
	color: #00008b;
	
}

div.footerlinks {
	
  /*width: auto;*/
  /*margin: 0 auto;*/
    text-align: center;
	padding-top: 10px;
	
}

div.footerlinks ul {
	
 list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;/*make this change*/
}

div.footerlinks ul li{
    float: none;/*make this change*/
    display:inline;/*make this change*/
    margin-left: 4px;
	margin-right: 4px;
 /* margin: 0 auto; */
}

div.footerlinks ul li a{
    float: none;/*make this change*/
    display:inline;/*make this change*/
	

 /* margin: 0 auto; */
}



.risk-free {
	background-color: white;
	padding-top: 30px;
	margin-top: 30px;
	
}

.no_phone {display: inline;}
.phone {display: none;}

@media screen and (max-width: 118em) {
footer{
min-height: 333px;
}

footer{

clear: left;
clear: right;
text-align: center;	

}

div.ifofooter{
padding: 10px 10px 10px 10px;
margin: 20px 0 10px 0;
}



div.tinytext{
	padding-top: 10px;
	
}

}


@media screen and (max-width: 80em) {
	

	div.footerlinks li.bluebg{
	
  /*width: auto;*/
  /*margin: 0 auto;*/
	background: rgba(255, 255, 255, 0.3);

	float: left;
	border: 1px solid #bbb;
	width: 300px;
	padding: 14px 16px;
}



div.footerlinks li.bluebg a{
	
    text-align: center;
    text-decoration: none;	    
}

div.footerlinks li.redbg{
	
  /*width: auto;*/
  /*margin: 0 auto;*/
	background: rgba(255, 255, 255, 0.3);

	float: left;
	border: 1px solid #bbb;
	width: 300px;
	padding: 14px 16px;
}

div.footerlinks li.redbg a{
	
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;	    
}
	
	
	div.tinytext{
	padding-top: 30px;
}
	
	img {
		max-width: 90%;
		  height: auto;
		  clear: both;
	}

	.topbar{
	height: 13em;
}

main {
	clear: both;
	padding-top: 7em;
}


footer{
	background-image: url("");
clear: left;
clear: right;
text-align: center;	
	height: auto;
}

div.tinytext{
	padding-bottom: 60px;	
}


}

@media screen and (max-width:45em) {
	
li.menu-item a {
    color: white;
    text-align: center;
    padding: 0px 0px 0px 0px;
    text-decoration: none;
vertical-align:top;
    
height: 7em;
	
display: flex;
  align-items: center;
  justify-content: center;
  


background-image: url("");

	
	margin: 6px;	
	margin-top: 2px;
}	
	
.no_phone {display: none;}
.phone {display: inline;}


  ul.menu li:not(:first-child) {display: none;}
  li.menu-item {display: none;}
  
  ul.menu li.icon {

    display: inline-block;
	background-color: #4169e1;
     height:50px;
     width:100px;
     border-radius: 0px 0px 90px 90px;
     -moz-border-radius: 0px 0px 90px 90px;
     -webkit-border-radius: 0px 0px 90px 90px;
	 	padding-top: 10px;
  }
  
    ul.menu li.icon a{

	font-size: 30px;
	color: white;

	}
	
.topbar{
	Background-color: none;
	background-image: url("");	

	width: 100%;
	height: 3em;
    margin-left: auto;
    margin-right: auto;
	top: 0px;
padding: 0px 0px 0px 0px;
padding-top: 0px;
    position: relative;
	
	z-index: 10;
}

div.logo{
	width: 9em;
	float: left;
	position: absolute;
	top: 10px;
	left: 5px;
	
}

div.logo2{
	width: 9em;
	float: rigth;
	position: absolute;
	top: 10px;
	right: 5px;
	
}

main {
	clear: both;
	padding-top: 0em;
}
}

@media screen and (max-width:45em) {
		footer{
	height: auto;
}
	
  ul.menu.responsive {position: relative;
  width: 100%;
  margin: 0px;
  z-index: 1000;
  background-color: #4169e1;
  }
  ul.menu.responsive li.icon {
   

    top: 0;


  }
  ul.menu.responsive li {
    float: none;
    display: inline;
	margin: 0px;
	width: 100%;

	border: 1px;

	
  }
  ul.menu.responsive li a {
    display: block;
    text-align: center;
padding-top: 10px;
	width: 100%;
	height: 30px;	
	font-size: 20px;
			background-color: #4169e1;
			color: white;
  }
  
    ul.menu.responsive li a:hover{
	background-color: #f0f0e3;
	color: #4169e1;
	}
	
div.footerlinks ul li a{
    float: none;/*make this change*/
    display:inline;/*make this change*/
	color: #00008b;
}
}


@media screen and (max-width:25em) {
	
	footer{
	height: auto;

}


  ul.menu.responsive {
  position: relative;
  width: 100%;
  margin: 0px;
  z-index: 1000;
  background-color: #4169e1;
  }
  ul.menu.responsive li.icon {
   

    top: 0;


  }
  ul.menu.responsive li {
    float: none;
    display: inline;
	margin: 0px;
	width: 100%;

	border: 1px;

	
  }
  ul.menu.responsive li a {
    display: block;
    text-align: center;
padding-top: 10px;
	width: 100%;
	height: 30px;	
	font-size: 20px;
			background-color: #4169e1;
			color: white;
			}
  
    ul.menu.responsive li a:hover{
	background-color: #f0f0e3;
	color: #4169e1;
	}
	
div.footerlinks ul li a{
    float: none;/*make this change*/
    display:inline;/*make this change*/
	
 
}

div.logo{
	width: 7em;
	float: left;
	position: absolute;
	top: 5px;
	left: 5px;
	
}

div.logo2{
	width: 7em;
	float: rigth;
	position: absolute;
	top: 5px;
	right: 5px;
	
}

#logopic{
	width: 7em;
	
	opacity: 1.0;
}

ul.menu{

	list-style-type: none;
    margin: 0;
margin-left: 5em;
margin-right: 5em;
    padding: 0;
    overflow: hidden;
    
 
    margin-top: -5px;
	text-align: center;
		top: 0;

    vertical-align:top;
}
}

@media screen and (max-width:17em) {
	div.logo{
	width: 5em;
	float: left;
	position: absolute;
	top: 30px;
	left: 0px;
	
}

div.logo2{
	width: 5em;
	float: rigth;
	position: absolute;
	top: 30px;
	right: 0px;
	
}

#logopic{
	width: 5em;
	
	opacity: 1.0;
	
}



}

li.redbg a {
color: #FF0000;

}

li.bluebg a {
	color: #00008b;
	
}

ul { 
   list-style-type: disc; 
   list-style-position: inside;
   margin-left: 15px; 
}

table {

	margin-top: 10px;
	margin-bottom: 10px;
}

.content-table {
	border: 2px solid black;
	border-top: 2px solid black;
	background-color: #FFFDD7;
	width: 600px;
	 border-collapse: collapse;
}

.content-table tr{
		border-top: 2px solid black;

}




@media print {
    .topbar {
    position: relative;
    display: none;
    }
	
	div.logo{
		display: block;
	}

	div.logo2{
		display: block;
	}

	
}



#BGblack { background-color: #000000;}
#BGsilver { background-color: #c0c0c0;}
#BGgray { background-color: #808080;}
#BGwhite { background-color: #ffffff;}
#BGmaroon { background-color: #800000;}
#BGred { background-color: #ff0000;}
#BGlightpink { background-color: #ffb6c1;}
#BGpurple { background-color: #800080;}
#BGfuchsia { background-color: #ff00ff;}
#BGgreen { background-color: #008000;}
#BGlime { background-color: #00ff00;}
#BGolive { background-color: #808000;}
#BGyellow { background-color: #ffff00;}
#BGyellowchiffon { background-color: #fffacd;}
#BGgold { background-color: #ffd700;}
#BGnavy { background-color: #000080;}
#BGblue { background-color: #0000ff;}
#BGteal { background-color: #008080;}
#BGaqua { background-color: #00ffff;}
#BGorange { background-color: #ffa500;}
#BGaliceblue { background-color: #f0f8ff;}
#BGantiquewhite { background-color: #faebd7;}
#BGaquamarine { background-color: #7fffd4;}
#BGazure { background-color: #f0ffff;}
#BGbeige { background-color: #f5f5dc;}
#BGbisque { background-color: #ffe4c4;}
#BGlightblue { background-color: #add8e6;}
#BGlightcyan { background-color: #e0ffff;}
#BGlightgreen { background-color: #90ee90;}
#BGmediumturquoise { background-color: #48d1cc;}

#Cblack { color: black;}
#Cred { color: red;}
#Cblue { color: blue;}
#Cyellow { color: yellow;}
#Cgreen { color: green;}
#Cwhite { color: white;}
#Cmidnightblue { color: midnightblue;}
#Csilver { color: silver;}
