html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; 
}

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

body {
  color: white;
  margin: 0;
  padding: 0;
  width: 100%; }



header {
    width: 100%;
}
header nav{
    background-color: rgba(255, 255, 255, 0);
    
}
nav ul a{
    color: black;
   padding-top: 30px;
    padding-right: 80px;
    font-size: 1.2em;
}


h2 {
  font-size: 1.2em;
  line-height: 30px;
  padding-top: 40px;
  text-align: center;
  color: darkgoldenrod;
font-family: helvetica;}

footer {
  background-color: #1e1f21;
  margin-top: 100px;
  background-size: cover; 
margin-top: 200px;}

footer#main {margin-top: 500px;}

footer#about {margin-top: 400px;}

main {
  height: 200px;
  width: 100%;
  padding-top: 20px; }

.box {width: 100%;
    height: 200px;
     background-color: white; 

}
.box1 {
    width: 100%;
    background-color: rgba(255, 255, 255, 0.63);
    margin: auto;
    margin-top: 140px; 
    padding: 5% 10%;
}


#wrapper {
    
  background-image: url(images/jet1.jpg);
  background-size: cover;
  width: 100%;
height: 750px;}

.f1 {
    width: 20%;
    
}
.f2 {
    
    width: 20%;
    
}

.input-field>label{
    color: #756a07;
}
.btn, .btn-large, .btn-small{
    background-color:  #756a07;
}
input:not([type]), input[type=text]:not(.browser-default), input[type=password]:not(.browser-default), input[type=email]:not(.browser-default), input[type=url]:not(.browser-default), input[type=time]:not(.browser-default), input[type=date]:not(.browser-default), input[type=datetime]:not(.browser-default), input[type=datetime-local]:not(.browser-default), input[type=tel]:not(.browser-default), input[type=number]:not(.browser-default), input[type=search]:not(.browser-default), textarea.materialize-textarea{
    border-bottom: 2px solid #756a07;
}
input.valid:not([type]), input.valid:not([type]):focus, input[type=text].valid:not(.browser-default), input[type=text].valid:not(.browser-default):focus, input[type=password].valid:not(.browser-default), input[type=password].valid:not(.browser-default):focus, input[type=email].valid:not(.browser-default), input[type=email].valid:not(.browser-default):focus, input[type=url].valid:not(.browser-default), input[type=url].valid:not(.browser-default):focus, input[type=time].valid:not(.browser-default), input[type=time].valid:not(.browser-default):focus, input[type=date].valid:not(.browser-default), input[type=date].valid:not(.browser-default):focus, input[type=datetime].valid:not(.browser-default), input[type=datetime].valid:not(.browser-default):focus, input[type=datetime-local].valid:not(.browser-default), input[type=datetime-local].valid:not(.browser-default):focus, input[type=tel].valid:not(.browser-default), input[type=tel].valid:not(.browser-default):focus, input[type=number].valid:not(.browser-default), input[type=number].valid:not(.browser-default):focus, input[type=search].valid:not(.browser-default), input[type=search].valid:not(.browser-default):focus, textarea.materialize-textarea.valid, textarea.materialize-textarea.valid:focus, .select-wrapper.valid>input.select-dropdown{
    
    border-bottom: 2px solid #756a07;
    box-shadow:2px solid #756a07;
}
lable.active{
    border-bottom: 2px solid #756a07;
    box-shadow:2px solid #756a07;
}
lable.hover{
    border-bottom: 2px solid #756a07;
    box-shadow:2px solid #756a07;
}

/**** page2about ****/


main#about {
  width: 100%;
  padding-top: 50px; }


h1 {color: darkgoldenrod;
    text-align: center;
    font-family: backerville;
    margin-top: 50px;
    margin-bottom: 0px;

}
p {color: black;
    text-align: center;
    font-size: 1.2em;
    font-family: baskerville;
    line-height: 1.3em;
  }

.box2 {width: 800px;
   margin-left: 220px;
  
    
}

.bottom {display: flex;
    width: 100%;
   
 
}

.column {
    
    width: 30%;
    
}
.column2 {
    
    width: 30%;
    
}
.column img, .column2 img{
    width:90%;
    
}
.row3 {
    width: 100%;
    display: flex;
    justify-content: center;
    
}

.row4 {
    width: 100%;
    display: flex;
    justify-content: center;
    
}



#wrapper2 {}
nav#about {
   }








/******* page3 ******/
#wrapper3 {
  background-image: url(images/map.jpg);
  background-size: cover;
    background-position: center;
  width: 100%;


}


.column3 {
    text-align: left;
    width: 30%;
    
}



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

.row2 {
    margin-top: 10%;
    width: 100%;
    display: flex;
    justify-content: center;
    
}




/******* page4 *******/
#wrapper4 {
  height: 100%;
  width: 100%; }

.box4 {padding: 1%;
     
}













/******* tablet ***********/
@media screen and (min-width: 481px) and (max-width: 950px) {
  body {
    width: 100%; }

  #wrapper {
    }

  ul {
    font-size: 1.4em;
    width: 500px; }
    ul li {
      padding-right: 50px; }

  

  p {
   
    margin-bottom: -20px; }

  

  /******* page2 ********/
  #wrapper2 {
    width: 100%;
    background-position: center;
    background-position: right; }

  header#about {
    border-right: none;
    width: 20%; }

  li#about {
    padding: 20px; }

  .box2 {width: 50%;
        margin-top: -20%
     }

  

  /******* page3 ********/
  #wrapper3 {
    width: 100%;
    background-position: center;
    background-position: right; }

  

  .box3 {
    width: 830px; }

  /******* page4 ********/
  

  .box4 {
    margin-left: 100px;
    margin-top: 130px; }

 
}

 






    
/******mobile*****/    
    
@media screen and (max-width: 480px) {
  body {
    width: 100%;
    }
    .row2{
        display: inline-block;
    }
    
    
    footer#main {margin-top: 700px;}
    
  .row3 {padding: 20px;}  

  header {

    margin-left: 0px; }
  ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    padding-top: 300px;
    margin-right: 50px; }

  

  #wrapper {width: 100%;
          /*height: 50%;*/
   
     }
    
  .box1 {
    width: 100%;
    position: absolute;
    }

 

  p {
    width: 80%;
    height: auto;
    margin: auto;
    text-align: center;
    font-size: 1.4em;
 }
    
    .row{
        
        display: inline-block;
    }
  .f1 {
      display: inline-block;
      width:100%; }
    
    .f2 {
        display: inline-block;
        width: 100%;}

  /******* page2 ********/
    h1 {height: auto;
     padding-bottom: 30px;
    }
    
   
    
    main {
  height: auto; }

    #about .box2 {
        margin: 0px;
        width: 100%;
        padding: 0px;
    }
    
    .box2 p {width: 100%;
     padding-top: 0px; 
        margin: 0px;
        padding: 20px;
    }

  ul#about {height: auto;

    }

  

  .box2 {margin: auto;
    width: 100%;
  
     }
    
   .column {
    height: auto;
    width: 50%;
    
   }
    
    
    
    .column img {
        width: 100%;
    }

    .column2 {
        width: 100%;
    }
    
    .column2 img{
    width:100%;
    
    }
    
    
    .bottom {flex: auto;
    width: 100%;
   
 
     }

     .row4 {display: inline-block;
    
    
    }
    
    footer#about {margin-top:auto;
    margin-top:40px;
    }
    
    
    
  /******* page3 *********/
 
  form {margin-top: 100px}
    
  #wrapper3 {background-image: none;}
    
    .column { 
        width: 100%;}
    
  .column3 {margin-top: 90px;
        width: 100%;
    }

  .box3 {
    }
    .row {margin-top: 70px;}
    
   
  

  /******** page4 *********/
  #wrapper4 {

    background-position: left; }

  

  .box4 {
    margin-left: 0;
    width: 290px;
    background-image: url(images/photset2.png);
    background-repeat: no-repeat;
    background-position: center; }

  .ps {
    display: none; }
    
    }