/* css for site 24 column*/
body{
    margin: 0;
    background-image: url("../images/fluff.png");
    background-repeat:no-repeat;

}
.col-half{width: 2.08%; }
.col-1 { width: 4.1%; }
.col-2 { width: 8.3%; }
.col-3 { width: 12.5%; }
.col-4 { width: 16.6%; }
.col-5 { width: 20.8%; }
.col-6 { width: 25%; }
.col-7 { width: 29.1%; }
.col-8 { width: 33.3%; }
.col-9 { width: 37.5%; }
.col-10{ width: 41.6%; }
.col-11{ width: 45.8%; }
.col-12{ width: 50%; }
.col-13{ width:51.4%;}
.col-14{ width:58.3%;}
.col-15{ width:62.5%;}
.col-16{ width:66.6%;}
.col-17{ width:70.8%;}
.col-18{ width:75%;}
.col-19{ width:79.1%;}
.col-20{ width:83.3%;}
.col-21{ width:87.5%;}
.col-22{ width:91.6%;}
.col-23{ width:95.8%;}
.col-24{ width:100%;}

.header{
    border: 0px solid #000;
    height: 50px;
    float: left;
    margin:10px 0 10px 3%;
    color:#10597a;
    text-align: center; 
    font-size: 1.5vw;
    font-family: monospace;
    text-decoration: none;
}

.header ul {
  padding: 0;
  list-style: none;
  text-decoration: none;
 

}


.header ul li {
  list-style: none;
  display:inline;
  font-family: monospace;
  margin:10px 0 10px 2%;
  color:#10597a;
  text-align: center; 
  font-size: 1.5vw;
  font-family: monospace;
  text-decoration: none;
}

.main-image{
    border: 0px solid #000;
    height: 700px;
    float: left;
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 30px;
    font-size: 3vh;
    color:#10597a;
    text-align: center;

}

.video {
  border: 0px solid #000;
  height: 700px;
  float: left;
  margin: 2% 0 0 1%;

}

.information {
  border: 0px solid #000;
  height: 450px;
  float: left;
  margin: 10% 0 0 1%;
  color:#10597a;
  text-align: left; 
  font-size: 1vw;
  font-family: monospace;
  text-decoration:none;
  line-height: 3vh;


}

.click {
    border: 0px solid #000;
    height: 30px;
    float: left;
    margin: 0 0 0 15%;
    color:#10597a;
    text-align: center; 
    font-size: 1.5vw;
    font-family: monospace;
    text-decoration:none;
}

.click ul {
  padding: 0;
  list-style: none;
  text-decoration: none;
 

}

.click ul li {
  list-style: none;
  display: inline;
  color:#10597a;
  text-align: center; 
  font-size: 1.5vw;
  font-family: monospace;
  text-decoration: none;
}


.header-second {
    border: 0px solid #000;
    height: 50px;
    float: left;
    margin: 10px 9px 10px 70%;
    color:#10597a;
    text-align: center; 
    font-size: 1.5vw;
    font-family: monospace;
    text-decoration: none;
    
}

.header-second ul {
  padding: 0;
  list-style: none;
  text-decoration: none;
 

}

.header-second ul li {
  list-style: none;
  display: inline;
  margin: 10px 9px 10px 20%;
  color:#10597a;
  text-align: center; 
  font-size: 1.5vw;
  font-family: monospace;
  text-decoration: none;
}

.container-one{
    border: 0px solid #000;
    height: 720px;
    float: left;
    
}

.image-one{
  background-color:white;
  border: 0px solid #000;
  height: 300px;
  z-index: 6;
  float: left;
  margin: 2% 0 0 1%;
  position: relative;
}

.image-one .pixel img {
 position: absolute;
 top: 0;
 left: 0;
 width: auto;
 height: 90%;
 image-rendering: pixelated;
}

.image-one .pixel img:last-child {
  transition: 2s;
}

.image-one .pixel:hover img:last-child{
 opacity: 0;
}

.image-two {
    border: 0px solid #000;
    height: 300px;
    margin: 10% 0% 0 2%;
    z-index: 1;
    float: left;
    position: absolute;
   
}

.image-two .smoke img {
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-two .smoke img:last-child {
   transition: 2s;
 }
 
 .image-two .smoke:hover img:last-child{
  opacity: 0;
 }



.image-three{
   background-color: #000;
   border: 0px solid #000;
   margin-top: 5%;
   height: 350px;
   z-index: 3;
   float: left;
   position: relative;

}

.image-three .hands img {
  position: absolute;
  border:#1a1a1a 10px solid;
  top: 0;
  left: 0;
  width: auto;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-three .hands img:last-child {
   transition: 2s;
 }
 
 .image-three .hands:hover img:last-child{
  opacity: 0;
 }

.image-four {
   border: 0px solid #000;
   height: 250px;
   float: left;
   z-index: 7;
   position: absolute;
   margin: 33% 0% 0% 3%;
}

.image-four .concrete img {
  position: absolute;
  top: 0;
  left: 0;
  width: 92%;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-four .concrete img:last-child {
   transition: 2s;
 }
 
 .image-four .concrete:hover img:last-child{
  opacity: 0;
 }

.container-two{
    border: 0px solid #000;
    height: 720px;
    float: left;

}

.container-twoandhalf{
  border: 0px solid #000;
  height: 475px;
  float: right;
  position: relative;
}
.image-five{
  background-color: white;
  border: 0px solid #000;
  height: 50px;
  float: left;
  margin: 1% 0 0 9%;
  z-index: 23;
  position: absolute;
}

.image-five .bubble img {
  position: absolute;
  top: 0;
  left: 0;
  width: 99%;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-five .bubble img:last-child {
   transition: 2s;
 }
 
 .image-five .bubble:hover img:last-child{
  opacity: 0;
 }


.image-six{
  background-color: white;
  border: 0px solid #000;
  height: 350px;
  float: left;
  z-index: 18;
  position: absolute;
  margin: 1% 0 0 1%;

}


.image-six .mouse img {
  position: absolute;
  top: 0;
  left: 0;
  width: 99%;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-six .mouse img:last-child {
   transition: 2s;
 }
 
 .image-six .mouse:hover img:last-child{
  opacity: 0;
 }


.image-seven{
  background-color: white;
  border: 0px solid #000;
  height: 400px;
  float: left;
  z-index: 25;
  position: absolute;
  margin: 13% 0 0 3%;
}

.image-seven .shirt img {
  position: absolute;
  top: 0;
  left: 0;
  width: 99%;
  height: 99%;
  image-rendering: pixelated;
  
 }
 
 .image-seven .shirt img:last-child {
   transition: 2s;
 }
 
 .image-seven .shirt:hover img:last-child{
  opacity: 0;
 }

.image-eight{
  border: 0px solid #000;
  height: 30px;
  float: left;
  z-index: 26;
  position: absolute;
  margin: 45% 0 0 4%;
  color:#10597a;
  text-align: center; 
  font-size: 1.75vh;
  font-family: monospace;
}

.container-three{
    border: 0px solid #000;
    height: 750px;
    float: right;
}
.image-nine{
    background-color: white;
    border: 0px solid #000;
    height: 100px;
    z-index: 30;
    position: absolute;
    margin: 10% 0 0 4%;
    float:right;
   
}

.image-nine .writing img {
  position: absolute;
  top: 0;
  left: 0;
  width: 99%;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-nine .writing img:last-child {
   transition: 2s;
 }
 
 .image-nine .writing:hover img:last-child{
  opacity: 0;
 }

.image-ten {
  border: 0px solid #000;
  height: 250px;
  z-index: 31;
  position: absolute;
  margin: 15% 0 0 4%;
  float:right;
}

.image-ten .fuggler img {
  position: absolute;
  top: 0;
  left: 0;
  width:auto;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-ten .fuggler img:last-child {
   transition: 2s;
 }
 
 .image-ten .fuggler:hover img:last-child{
  opacity: 0;
 }

.image-eleven{
  background-color: white;
  border: 0px solid #000;
  height: 195px;
  z-index: 35;
  position: absolute;
  margin: 33% 0 0 4%;
  float:right;
}

.image-eleven .nachos img {
  position: absolute;
  top: 0;
  left: 0;
  width:auto;
  height: 99%;
  image-rendering: pixelated;
 }
 
 .image-eleven .nachos img:last-child {
   transition: 2s;
 }
 
 .image-eleven .nachos:hover img:last-child{
  opacity: 0;
 }

.bottom {
  background-color: aquamarine;
  border: 1px solid #000;
  height: 50px;
}

.spacer {
  height: 720px;
  float: left;
  border: 0px solid #000;
 
}

.a {
  text-decoration-line: none;
}