body::-webkit-scrollbar { display: none; }

#slide-window
  {
  position:fixed;
  width:100%;
  height:100%;
  overflow:hidden;
  top:0px;
  left:0px;
  }

#slides
  {
  height:100%;  
  position:absolute;
  margin:0px;
  padding:0px;
  
  -webkit-transform: translate3d(0px,0px,0px);
  transform: translate3d(0px,0px,0px);
    
  transition: all 0.66s ease; -webkit-transition: all 0.66s ease; 
  
  }

.slide 
  {
  list-style:none;
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  width: 500px;
  height: 100%;
  background: #ccc;
  text-align: center;
  line-height: 300px; 
  background-size: cover; 
  background-position:50% 50%;
  color:#fff;
  -webkit-transform: translate3d(0px,0px,0px);
  visibility:hidden;
  -webkit-transform-style: preserve-3d;
  }

.alive { visibility:visible; }

.nav 
  { 
  position:fixed; 
  z-index:9; 
  top:50%; 
  cursor:pointer; 
  color:#fff; 
  opacity:0.7; 
  transition: all 0.66s ease; -webkit-transition: all 0.66s ease; 
  }

.nav:hover { opacity:1.0; }
#left { left:3%; }
#right { right:3%; }


#credit 
  { 
  position: fixed;
  bottom: 0px;
  margin-right: auto;
  margin-left: auto; 
  top:80%; 
  left:60%; 
  color:#eaeaea; 
  font-family: 'Courier New', Courier, monospace;  
  }


/*button animation*/

.button-container {
  margin: 60px auto 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;

}
@media screen and (max-width: 930px) {
  .button-container {
    flex-direction: column;
  }
}

.button {
  position: fixed;
  color: #ff0000;
  text-decoration: none;
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: 1px;
  border: 2px solid #ff0000;
  border-radius: 1000px;
  padding: 10px 20px;
  margin: 40px;
  top:80%;
  left: 60%;
  box-shadow: 0 2px 5px 0 rgba(3, 6, 26, 0.15);
  transition: 0.5s all ease-in-out;
}
.button:hover {
  cursor: pointer;
  background: #ff0000;
  color: #fff;
  -webkit-animation: none;
          animation: none;
}

.button-wiggle {
  -webkit-animation: wiggle 4s 2s infinite;
          animation: wiggle 4s 2s infinite;
}

@-webkit-keyframes wiggle {
  5%, 50% {
    transform: scale(1);
  }
  10% {
    transform: scale(0.9);
  }
  15% {
    transform: scale(1.15);
  }
  20% {
    transform: scale(1.15) rotate(-5deg);
  }
  25% {
    transform: scale(1.15) rotate(5deg);
  }
  30% {
    transform: scale(1.15) rotate(-3deg);
  }
  35% {
    transform: scale(1.15) rotate(2deg);
  }
  40% {
    transform: scale(1.15) rotate(0);
  }
}

@keyframes wiggle {
  5%, 50% {
    transform: scale(1);
  }
  10% {
    transform: scale(0.9);
  }
  15% {
    transform: scale(1.15);
  }
  20% {
    transform: scale(1.15) rotate(-5deg);
  }
  25% {
    transform: scale(1.15) rotate(5deg);
  }
  30% {
    transform: scale(1.15) rotate(-3deg);
  }
  35% {
    transform: scale(1.15) rotate(2deg);
  }
  40% {
    transform: scale(1.15) rotate(0);
  }
}
.button-pulse {
  -webkit-animation: pulse 2s infinite 3s cubic-bezier(0.25, 0, 0, 1);
          animation: pulse 2s infinite 3s cubic-bezier(0.25, 0, 0, 1);
  box-shadow: 0 0 0 0 white;
}

@-webkit-keyframes pulse {
  to {
    box-shadow: 0 0 0 18px rgba(255, 255, 255, 0);
  }
}

@keyframes pulse {
  to {
    box-shadow: 0 0 0 18px rgba(255, 255, 255, 0);
  }
}
.button-float {
  -webkit-animation: float 1.5s linear alternate infinite;
          animation: float 1.5s linear alternate infinite;
}

@-webkit-keyframes float {
  50% {
    transform: translateY(-px);
  }
  100% {
    transform: translateY(-18px);
  }
}

@keyframes float {
  50% {
    transform: translateY(-px);
  }
  100% {
    transform: translateY(-18px);
  }
}