iframe {
    margin-top: 380px;
    transition-property: all;
    transition-property: transform;
    transition-duration: 5s;
    margin: 50vh;
    display: block;
    margin-bottom: 50px;
}

iframe:hover {
  transform: translate(20px, 20px);
  }


/*animações*/
/*wallpaper*/
@keyframes bounceIn {
    0% {
      transform: scale(0.1);
      opacity: 0;
    }
    60% {
      transform: scale(1.1);
      opacity: 1;
    }
    100% {
      transform: scale(1);
    }
  }
  
  
  @keyframes del {
    0% {
      opacity: 0;
    }
    50% {
      opacity: 0;
    }
    100% {
      opacity:1;
    }
  }
  
  strong {
    font-size: 50px;
  }
  
  d {
    font-size: 40px;
    color: rgb(200, 233, 200);
  }
  
  @keyframes up {
    
    100% {
      transform: translateY(0);
    }
    
  }
  
  @keyframes draw {
    
    100% {
      width: 100%;
    }
    
  }
  
  nav > ul {
    margin: 0;
    height: fit-content;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: top;
    text-align: center;
     -webkit-animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
            animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
  }
  
  nav > ul > li {
    display: inline-block;
    min-width: 10vw;
    line-height: 3rem;
  }
  
  f {
    font-size: 30px;
  }
  
  @keyframes float {
    50% {
       transform: translate(0, 20px);
    }
  }
  
  @-webkit-keyframes tracking-in-contract {
    0% {
      letter-spacing: 1em;
      opacity: 0;
    }
    40% {
      opacity: 0.6;
    }
    100% {
      letter-spacing: normal;
      opacity: 1;
    }
  }
  
  @keyframes tracking-in-contract {
    0% {
      letter-spacing: 1em;
      opacity: 0;
    }
    40% {
      opacity: 0.6;
    }
    100% {
      letter-spacing: normal;
      opacity: 1;
    }
  }
/*PAGINA INICIAL - roleta*/
  @keyframes anime {
    0% {
      transform: rotateX(0deg);
      animation-iteration-count: infinite;
      animation-delay: 0s;
    }

    5% {
      transform: rotateX(0deg);
    }

    10% {
      transform: rotateX(360deg);
    }

    15% {
      transform: rotateX(0deg);
    }

    20% {
      transform: rotateX(360deg);
    }

    25% {
      transform: rotateX(180deg);
    }
    30% {
      transform: rotateX(180deg);
    }

    45% {
      transform: rotateX(0deg);
    }

  }


@keyframes cor {
  0%{color: #ff0000;}
  4%{color: #ff4000;}
  8%{color: #ff8000;}
  12%{color: #ffbf00;}
  16%{color: #ffff00;}
  20%{color: #bfff00;}
  24%{color: #80ff00;}
  28%{color: #40ff00;}
  32%{color: #00ff00;}
  36%{color: #00ff40;}
  40%{color: #00ff80;}
  44%{color: #00ffbf;}
  48%{color: #00ffff;}
  52%{color: #00bfff;}
  56%{color: #0080ff;}
  60%{color: #0040ff;}
  64%{color: #0000ff;}
  68%{color: #4000ff;}
  72%{color: #8000ff;}
  76%{color: #bf00ff;}
  80%{color: #ff00ff;}
  84%{color: #ff00bf;}
  88%{color: #ff0080;}
  92%{color:#ff0040;}
  96%{color: #ff0000;}
  100%{color: #ff0000;}
}