body {
    background-image: url('https://images.squarespace-cdn.com/content/v1/551ddcb9e4b0d9e1728a296d/1433989429263-00XQ63V3D2Q0GG50QJY8/ke17ZwdGBToddI8pDm48kAf-OpKpNsh_OjjU8JOdDKBZw-zPPgdn4jUwVcJE1ZvWQUxwkmyExglNqGp0IvTJZUJFbgE-7XRK3dMEBRBhUpxq_kr5JmUSWzdbeQhVZ8KGVEAfgr0ybhloMHNIqvT8SMftTfHgE5YY4gbHxAHibYY/hx_26-1.gif');
    background-color: rgb(0, 0, 0);
  }
  .head {
    background-color: black;
  }

  .main {
    padding: 1%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .main >video{
    display: inline;
    border: 5px;
    visibility: hidden;
  } 
  h1 {
    color: blue;
  }
  #gifs{
    padding: 1%;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: hidden;
  }
  .button1 {
    background-color: #537fdd; /* Green */
    border: none;
    color: rgb(255, 255, 255);
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 48px;
    transition-duration: 0.4s;
    border-radius: 8px;
  }
  .button:hover {
    background-color:rgb(255, 0, 0); /* Green */
    color: white;
  }
  .rotate {
    animation: rotation 8s infinite linear;
  }
  .rotate2 {
    animation: rotation 8s infinite linear;
  }
  
  @keyframes rotation {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(359deg);
    }
  }
  .rotate{
    position: fixed;
    top: 10px;
    left: 10px;
  }
  .rotate2{
    position: fixed;
    top: 10px;
    right: 10px;
  }

  .rotate3{
    position: fixed;
    bottom: 10px;
    right: 10px;
  }
  .rotate4{
    position: fixed;
    bottom: 10px;
    left: 10px;
  }