@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700italic,700);




.bg {
  /* The image used */
  background-image: url('img/info.jpg');

  /* Full height */
  height: 100%; 

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}



body{
	color:white;
	background:transparent;   
	margin:0;
	padding:0;
	text-align:center; 
}



body, html {
  height: 100%;
  margin: 0;
}

hr{
	border:none;
	height:80px;
	margin:10;
	padding:10;
	background:url(../img/divider-1.png) center no-repeat;
}

.tablink {
  background-color: #CD853F; 
  color: white;
  float: left;
  border: 2px solid white;
  outline: none;
  cursor: pointer;
  padding:15px 4px 15px 4px; 
  font-size: 17px;
  width: 11.10%;
  text-align: center; 
}




@media screen and (max-width: 500px) {
  .tablink {
    float: none;
	font-size: 16px;
    display: block;
    width: 100%;
	border: 1px solid white;
	padding:10px 4px 10px 4px; 
  }
}



.tablink:hover {
  background-color: orange;
}

/* Style the tab content */
.tabcontent {
  color: white;
  display: none;
  padding: 50px;
  text-align: center;
}

#Guide {background-color:#ff8093;}
#Beaches {background-color:#4d4dff;}
#Restaurants {background-color:#198d19; }
#Transportation {background-color:#ff3333; }
#Links {background-color:#CD853F;}
#Location {background-color:#4B0082; }
#Room {background-color:#e16b06; }
#Questions {background-color:#b300b3; }
#Covid {background-color:#808080;}


a:link {
  color: white;
font-weight: normal;
}


a:visited {
  color: white;

}

a:hover {
  color: black;
  font-weight: bold;
}

a:active {
  color: yellow;

}




@media screen and (max-width: 1000px) {
h1{ font-size:2.9vw; }
h2{ font-size:2.7vw; }
a{ font-size:2.7vw; }
p{ font-size:2.7vw; }
body {  font-size: 2.7vw;}
}


@media screen and (min-width: 1000px) {
h1{ font-size:1.9vw; }
h2{ font-size:1.7vw; }
a{ font-size:1.7vw; }
p{ font-size:1.7vw; }
body {  font-size: 1.7vw;}
}


@media screen and (min-width: 1500px) {
h1{ font-size:1.3vw; }
h2{ font-size:1.3vw; }
a{ font-size:1.1vw; }
p{ font-size:1.1vw; }
body {  font-size: 1.1vw;}
}



@media screen and (max-width: 1000px) {
.bus img {
width:90%;
height:auto;
  }
}


@media screen and (min-width: 1000px) {
.bus img {
width:60%;
height:auto;
  }
}


@media screen and (min-width: 1500px) {
.bus img {
width:40%;
height:auto;
  }
}




@media screen and (max-width: 1000px) {
.logo img {
width:40%;
height:auto;
padding:3px;
  }
}


@media screen and (min-width: 1000px) {
.logo img {
width:30%;
height:auto;
padding:3px;
  }
}


@media screen and (min-width: 1500px) {
.logo img {
width:20%;
height:auto;
padding:3px;
  }
}




@media screen and (max-width: 1000px) {
.map img {
width:90%;
height:auto;
  }
}


@media screen and (min-width: 1000px) {
.map img {
width:70%;
height:auto;
  }
}


@media screen and (min-width: 1500px) {
.map img {
width:50%;
height:auto;
  }
}




@media screen and (max-width: 1000px) {
.sign img {width:70%;  height:auto;  }
}


@media screen and (min-width: 1000px) {
.sign img {width:50%; height:auto;  }
}


@media screen and (min-width: 1500px) {
.sign img {width:30%; height:auto; }
}




@media screen and (max-width: 1000px) {
.taverna img {width:90%;  height:auto;  }
}


@media screen and (min-width: 1000px) {
.taverna img {width:70%; height:auto;  }
}


@media screen and (min-width: 1500px) {
.taverna img {width:50%; height:auto; }
}




	.flag img {
	height:35px;
    width:auto;
	padding:3px;
  }
    
		
   .flag select {
    width:200px;
	padding:3px;
  }