@font-face {
    font-family: 'aqua_grotesqueregular';
    src: url('fonts/aqua-webfont.eot');
    src: url('fonts/aqua-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/aqua-webfont.woff2') format('woff2'),
         url('fonts/aqua-webfont.woff') format('woff'),
         url('fonts/aqua-webfont.ttf') format('truetype'),
         url('fonts/aqua-webfont.svg#aqua_grotesqueregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'blackoutmidnight';
    src: url('fonts/blackout-midnight-webfont.woff2') format('woff2'),
         url('fonts/blackout-midnight-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
  }

  @font-face {
    font-family: 'bellotaregular';
    src: url('fonts/Bellota-Regular-webfont.eot');
    src: url('fonts/Bellota-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Bellota-Regular-webfont.woff2') format('woff2'),
         url('fonts/Bellota-Regular-webfont.woff') format('woff'),
         url('fonts/Bellota-Regular-webfont.ttf') format('truetype'),
         url('fonts/Bellota-Regular-webfont.svg#bellotaregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'black_jackregular';
    src: url('fonts/blackjack-webfont.eot');
    src: url('fonts/blackjack-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/blackjack-webfont.woff2') format('woff2'),
         url('fonts/blackjack-webfont.woff') format('woff'),
         url('fonts/blackjack-webfont.ttf') format('truetype'),
         url('fonts/blackjack-webfont.svg#black_jackregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

#screen{
}

#main{
background: #1c566c;
width:100%;
height:45vh;
color: white;
margin-top:-10%;
}


#jps{
  background-image:url('images/jps.png');
Width:60%;
height:80%;
  background-size: cover;
margin: auto;
margin-top:10%;
}

.photo{
float: left;
background-position: center;
}

#pic1{

  background-image:url('images/pic1.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}

#pic2{
  background-image:url('images/pic2.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}

#pic3{
  float: left;
  background-image:url('images/pic3.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}

#pic4{
    float: left;
  background-image:url('images/pic4.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}

#pic5{
  float: left;
  background-image:url('images/pic5.jpg');
  background-size: cover;
  background-position: center;
  width:50%;
  height:30vh;
}

#pic6{
  float: left;
  background-image:url('images/pic6.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic7{
  float: left;
  background-image:url('images/pic7.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic8{
  float: left;
  background-image:url('images/pic8.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic9{
  float: left;
  background-image:url('images/pic9.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}

#pic10{
  float: left;
  background-image:url('images/pic10.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}

#pic11{
  float: left;
  background-image:url('images/pic11.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}

#pic12{
  float: left;
  background-image:url('images/pic12.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic13{
  float: left;
  background-image:url('images/pic13.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic14{
  float: left;
  background-image:url('images/pic14.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic15{
  float: left;
  background-image:url('images/pic15.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic16{
  float: left;
  background-image:url('images/pic16.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic17{
  float: left;
  background-image:url('images/pic17.jpg');
  background-size: cover;
  width:50%;
  height:30vh;
}
#pic18{
  float: left;
  background-image:url('images/pic18.tif');
  background-size: cover;
  width:50%;
  height:30vh;
}

.description{
  width:90%;
  font-size:3vw;
  font-family: sans-serif;
  margin-left:5%;
  height:100%;
}

.title{
  font-size:5vw;
  font-family: 'blackoutmidnight';
  width:90%;
  text-align: center;
}

#desc1{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}

#desc2{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}

#desc3{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}

#desc4{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}

#desc5{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc6{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc7{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc8{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc9{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc10{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc11{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc12{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc13{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc14{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}
#desc15{
  background-color: white;
  padding-top:15%;
  padding-bottom:10%;
  opacity:0;
}

#footer{
  background: #1c566c;
  width:100%;
  height:10vh;
  color: white;
  float: left;
}

#footicons{
float:right;
  margin-top:3%;
  margin-right:5%;
}

#mail{
    background-image:url('images/mail2.png');
    background-size: cover;
    width:45px;
    height:40px;
    float:left;
}

#insta{
    background-image:url('images/gram.png');
    background-size: cover;
    width:45px;
    height:40px;
    float:left;
}

#facebook{
    background-image:url('images/facebook.png');
    background-size: cover;
    width:45px;
    height:40px;
    float:left;
}