.header{
    background-image: url(DSC1690-2.webp);
    height: 850px;
    background-attachment: fixed;
    background-size:cover;
    background-position: center;
    
}
.bar{
    display:inline-block;
    padding-top: 1%;
    padding-left: 1%;
    right: 2%; 
}
.icon{
    height: 32px;
     width: 32px;
}
.menu{
    padding-left:1.5%;
    padding-top: 1.5%;
    color: aliceblue;
    left: 4%;
   
}
/* arrows down, up, left, and right*/
.arrow {
border: solid rgb(250, 247, 247);
border-width: 0 2px 2px 0;
display: inline-block;
padding: 2.5px;
margin: 1px;
margin-bottom: 3px;
}
.down {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.up {
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
padding: 3.5px;
margin-top: 6px;
border-width: 0 3px 3px 0;
}

.left {
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
color:rgb(5, 5, 5);
}
#myLinks {
display: block;
}
.fixed{
    position: fixed;
    z-index: 1;
}
.anav{
    padding: 5px;
    color: aliceblue;
}
form{
   width: 230px; height: 300px;
}
@media screen and (max-width: 800px) {
    #myLinks{
       display: none;   
    }
    .anav{
        padding: 3%;
        display: block;
       
    }
    .menu{
        background-color: #333;
        border: 2px solid white;
        right: 1%;
        left: 1%;
        margin-top: 8%; 
    }
    form{
        width: auto; height: auto;
        display: inline-block;
    }
    
}
#newform{
    padding: 1%; 
    
    margin-left: 1%;
}
footer{
padding-left: 2%; 
padding-right: 2%;
}
h1{
    color: aliceblue;
    text-align: center;
    font-size: 60px;
    padding-top: 15%;
}
h2{
    
    font-size: 30px;
    
}
h3{
    color: aqua;
    font-size:large;
    padding: auto;
}
.fontsize{
    text-align: center;
    font-size: xx-large;
    padding: 1%;

}
.titlephoto{
    max-width: 500px;
    max-height: 400px;
    overflow:scroll;
    background-image: url(file:///C:/Users/User/Documents/New%20web/DSC06476.jpg);
    background-size:cover;
    margin: auto;
    padding: 1.5%;
    
}
.titlephoto2{
    background-image:url(file:///C:/Users/User/Documents/New%20web/DSC05778.JPG);
    float: right;
}
.display{
    display:flex;
    text-align:center;
    overflow:auto;
    max-width:100%;
}
.size{
    max-width: 300px;
    max-height: 200px;
    
}
.margin{
    margin:0 auto;
    max-width: 100%;
}
footer{
    background-color: aquamarine;

}
.text{
    text-align: center;
    padding: 2%;
    
}
.float{
    float: right;
    margin: auto;
}
.float2{
    float: right;
    margin: auto;
}
.grid{
    display: grid;
    margin-top: 10%;
    
   
    
}
#formstyle{
    
    width:700px ;
    height:auto ;
    margin:auto; 
    
}
.widthform{
  width: 700px;
}
.widthform2{
  width: 350px;
  background-color: white;
  color: black;
  font-size: larger;
  font-weight: bolder;
  padding: 2%;
  
}
.widthsubmit{
  width: 200px;
}
.select{
  display: inline;
}
#paynow{
    border: #333 solid 1px;
    border-radius: 15px;
    background-color: rgb(224, 204, 24);
    max-width: fit-content;
    height:auto;
    padding: 2%;
    color: black;
    
}
#paylater{
    border: #333 solid 1px;
    border-radius: 15px;
    background-color: rgb(224, 204, 24);
    max-width: fit-content;
    height:auto;
    padding: 2%;
    color: black;
    
}

section{
    padding: 4%;
}
@media screen and (max-width: 1366px){
  #formstyle{
    margin-left: 28%;
}
.header{
    background-attachment: unset;
}
}

button{
   background-color: blue;
   border-style:groove;
   color: aliceblue;
   font-weight: bold;
    width: 130px;
    height: 35px;
   margin-left: 9%;
   margin-bottom: 5px;
   border-radius: 13px;
}

.logosize{
  width: 65px;
  height: auto;
}
.decoration{
    text-decoration: none;
}

.boxdiv{
display: flex;
flex-wrap: wrap;
width: 100%;
margin-top: 0;
margin-bottom: 0;
max-width: 100%;
}
.courses{
    margin:auto;
    text-align: center;
}
.section{
    display: table;
vertical-align: middle;
width: 100%;
table-layout: fixed;
position: relative;
}

.astyle{
    text-decoration: none;
    color: aliceblue;
    color:black;
    position: relative;
    right: 1%;
    bottom: 1%;
    border-radius: 20%;
    width: 30px;
    height: 20px;
    text-align: center;
    background-color:blue ;
    position: fixed;
    padding: 0.4%;
}
.p{
    font-weight:bold;
}
.color{
    color: silver;
}
#reservation{
    text-align: start;
    padding: 0%;
    margin: 0%;
}
#style{
    color: black;
    text-align: center;
    padding: 3%;
}
a:hover{
    text-transform:uppercase;
    color: black;
}
/* The container <div> - needed to position the dropdown content */
.dropdown {
position: relative;
display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
display: none;
position: absolute;
background-color: #f1f1f1;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
/* Dropdown Button */
.dropbtn {
color: white;
border: none;
}

/* Links inside the dropdown */
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

.navbar {
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 99%;
z-index: 1;
}

.navbar a {
float: right;
display: block;
text-align: center;
padding: 7px 8px;
text-decoration: none;
}
#floatleft{
float: left;
}
#floatleft1{
float: left;
}

.color{
color: #f1f1f1;
}
.color:hover{
color: aqua;
position: relative;
}
#anohover {
text-transform: none;
color: white;
display: block;
text-decoration: none;
background-color: #333;
padding-left: 45%;
}
#anohover1{
text-transform: none;
color: black;
text-decoration: none;
margin: 5px;
}
#anohover2{
text-transform: none;
color: black;
text-decoration: none;
margin: 5px;
}
#anohover3{
text-transform: none;
color: black;
text-decoration: none;
margin: 5px;
}
#anohover5{
text-transform: none;
color: black;
text-decoration: none;
}
.right{
padding-right: 21%;
font-weight: bold;
font-size: large;

}
.font{
font-weight: bold;
font-size: large;
}
.divmenu {
width: 25px;
height: 4px;
background-color: rgb(245, 234, 234);
margin: 4px 0 0 4px;

}
.divmenudisply{
display: none;
}
span{
color: antiquewhite;
}
@media screen and (max-width: 800px){
    .header{
        background-attachment: unset;
    }
.trip{
    margin-left: 10%;
}
.right{
padding-right: auto;
}
.font{
display: none;
}
.divmenudisply{
display: block;
margin-top: 3px;
}
#anohover{
margin: 2%;
}

#formstyle{
    max-width: 350px;
    height: auto;
    margin: auto;
    margin-left: 2%;
    margin-top: 15%;
  
}
.widthform{
  max-width: 350px;
}
.widthform2{
  max-width: 150px;
}
.widthsubmit{
  max-width: 100px;
}
.select{
  display: inline;
}
}
.error {
color: #FF0000;
}
.formstyle{
left: 95%;
}
#topbtn{
display: none;
}
.robot{
border: solid 2px black;
width: 300px;
height: 50px;
background :rgb(196, 248, 241);
box-shadow: #333;
color: black;
padding: 5%;


}
.check{
width: 25px;
height: 25px;
float: right;
}
.hr{
    max-width: 700px;
    margin-left: 1%;
}
.sectionform{
    background-image: url(event7.jpg);
    background-size:cover;
    background-position: center;
    background-attachment: fixed;

}
.imgstyle{
    display: inline-block;
    width: 99%;
}
.img{
    float: right;
    display: inline;
    margin-right: 3%;
}
@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.w3-modal-content{
    margin:auto;
    background-color:#fff;
    position:relative;
    padding:0;
    outline:0;
    width:600px;
    
}

.w3-animate-zoom {
    animation:animatezoom 0.6s;
}
.w3-modal{
    z-index:3;
    display:none;
    padding-top:40px;
    position:fixed;left:0;
    top:0;width:100%;
    height:100%;
    overflow:auto;
    background-color:rgb(0,0,0);
    background-color:rgba(0,0,0,0.4);
    
}
@media (max-width:600px){
    .w3-modal-content{
        margin:auto;
        max-width:400px!important;
        max-height: auto!important;
        
    }.w3-modal{
        padding-top:30px;
    }
    .float2{
        float: none;
        margin-left: 20%;
    }
    .imgstyle{
        display: inline-block;
        max-width: 99%;
    }
    .img{
        float: none;
        display: block;
        margin-right: 0%;
    }
    .navbar {
        max-width:96.5%;
        
        }
}
@media (min-width:993px){
    .w3-modal-content{
        width:900px;
    }
}