main {
    margin: 100px;
  }

  h1 {
    margin: 30px 0;
    font-family: "Luckiest Guy";
  }

  h5 {
    font-family: "Luckiest Guy";
    color: black;
  }

  .descricao {
    text-align: center;
    margin-bottom: 50px;
    font-size: 20px;
  }

  .cards {
    display: flex;
    flex-direction: column;
    margin: 20px;
    padding: 20px;
  }

  .cards-line {
    display: flex;
    margin: 20px;
    justify-content: space-evenly;
    flex-wrap: wrap;
  }

  .card{
    margin: 20px;
  }

  .card-title {
    color: black;
    font-family: "Luckiest Guy";
    margin-bottom: 20px;
  }

  .card-text {
    color: black;
  }

  .btn-modificador {
    background-color: var(--palette-blue);
    border-color: var(--palette-blue);
    animation: wiggle 2.2s linear infinite;
  }

  .carousel-background {
    background-color: var(--palette-orange);
    border-radius: 15px;
  }
  
  /* Tablet */
  @media screen and (min-width: 768px) and (max-width: 1023px){
    
  }
  
  /* Telas maiores */
  @media screen and (min-width: 1024px){
    
  }

  /* Telas maiores */
  @media screen and (max-width: 767px){
    
    main {
      margin: 100px 30px;
    }
    
    .cards{
      margin: 0px;
      padding: 0px;
    }

    .carousel {
      display: none;
    }
  }

  /* Animação do botão */
  @keyframes wiggle {
    0%,
    10% {
      transform: rotate(0);
    }
    15% {
      transform: rotate(-15deg);
    }
    20% {
      transform: rotate(10deg);
    }
    25% {
      transform: rotate(-10deg);
    }
    30% {
      transform: rotate(10deg);
    }
    35% {
      transform: rotate(-10deg);
    }
    40%,
    100% {
      transform: rotate(0);
    }
  }