h1 {text-align: center; font-style: italic; color:darkgoldenrod}
h2 {text-align: center; font-style: italic; color:darkgoldenrod}
h3 {text-align: center; font-style: italic; color:darkgoldenrod}
p {text-align: center; color:silver;} 
a {text-decoration:none; margin: 10px;}
footer{text-align: left; margin-bottom: 100px;text-decoration:underline; }
span{background-color:cornsilk}
input{text-align: center;}
  body {
    background-image: url('/media/background.jpg');
    background-size:auto;
    background-attachment: fixed;
  }

  button {
    background-color: silver;
    border: 10px inset goldenrod;
    color: black;
    padding: 15px 15px;
    font-size: 16px;
    justify-content: center;
    align-items: center;
    display: block;
    margin: 0 auto;
    }

  button:hover{
    transform: scale(1.5, 1.5);
    cursor: pointer;
  }

  video {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
  }

  img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
  }

  .slider{
    position: relative;
    width: 100%;
    margin: auto;
    overflow: hidden;
}

.slider img{
    width: 100%;
    display:none;
}

img.displaySlide{
    display: block;
    animation-name: fade;
    animation-duration: 1.5s;
    width:30%;
}

.slider button{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2rem;
    padding: 10px 15px;
    background-color: hsla(0, 0%, 0%, 0.5);
    color: white;
    border: none;
    cursor: pointer;
}

.prev{
    left: 0;
}

.next{
    right: 0;
}

@keyframes fade {
    from {opacity: .5}
    to {opacity: 1}
}

video{
  height: fit-content;
  width: fit-content;
}

.topnav {
  background-color: #333;
  overflow: auto;
}

.topnav a {
  float: left;
  color: silver;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: silver;
  border: 10px inset goldenrod;
  color: black;
}

.topnav a.active {
  background-color: silver;
  border: 10px inset goldenrod;
  color: black;
}