.footer-main{
    width: 100%;
    height: 20%;
    background-color: none;
}


/* ########## CÍRCULO COM PREÇO DE PROMOÇÃO ########## */


.div-circulo { /* O círculo externo propriamente dito */
    width: 150px;
    height: 150px;
    position: relative;
    top: 1em;
    right: 1em;
    color: #fff;
    border-radius: 50%;
    border: 2px solid;
    background: linear-gradient(138deg, rgba(255,72,42,0.5) 0%, rgba(135,15,4,0.5) 100%);
}


.div-preco { /* O preço da sequencia de fondue */
    position: relative;
    top: 35%;
    width: 100%;
    background: linear-gradient(138deg, rgba(238,209,88,1) 0%, rgba(255,174,19,1) 100%);
    box-shadow: 0px 3px 5px 3px rgba(0,0,0,0.8); /* Sombreado */
    border-radius: 5px;
    font-family: Impact, sans-serif;
    font-size: 35px;
    text-transform: uppercase;
    text-align: center;
    color: black;
    animation: zoom 1.4s ease-in-out infinite;
    cursor: pointer;
}

.div-texto-rotativo { /* O texto promocional que gira ao redor do circulo */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
    font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: bold;
  text-transform: uppercase;
  animation: rotate 20s linear infinite;
  fill: #fff;
}

.div-preco:hover { /* Efeito sobre o preço do fondue */
    color: #000;
    background: #fff;
    border-color: #fff;
}

.div-preco a, .div-preco a:visited{ /* Não troca de cor depois de clicar no link do banner */
    text-decoration: none;
    color: black;
}


/* ########## DEPOIMENTOS ########## */

.div-depoimentos-principal{
    overflow: hidden;
    display: flex; /* É necessário pros alinhamentos funcionar */
    justify-content: center; /* Centraliza o conteúdo na horizontal */
    align-items: center; /* Centraliza o conteúdo na vertical */
    width: 100%;
    padding: 0;
    margin: 0;
}

.div-depoimentos{
    overflow: hidden;
    box-sizing: border-box;
    width: 33%;
    float: left;
    padding: 0;
    margin: 0 2px;
}

.ul-depoimentos{ /* UL que organiza os depoimentos individualmente */
    margin: 0;
    padding: 0;
    list-style: none;
    color: #6f6f6f;
}

.ul-depoimentos li{
    text-align: center; /* Centraliza todos os textos da UL */
}

.depo-icones{ /* Ícones das redes sociais nos depoimentos */
    color: #B99253;
    font-size: 30px;
    margin: 10px 0; /* Afasta do fim da página e do texto acima */
}

.depo-imagem-padrao{ /* Definições padrão da DIV redonda para as fotos de depoimentos */
    width: 100px;
    height: 100px;
    margin: 1em auto; /* Centraliza a imagem horizontalmente */
    color: #fff;
    border: 7px solid white;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
}

.depo-imagem-01{ /* Foto do primeiro depoimento */
    background-image: url("../img/depoimentos/depoimento-01.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}   

.depo-imagem-02{ /* Foto do segundo depoimento */
    background-image: url("../img/depoimentos/depoimento-02.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
} 

.depo-imagem-03{ /* Foto do terceiro depoimento */
    background-image: url("../img/depoimentos/depoimento-03.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
} 

.p-depoimento{ /* Depoimento propriamente dito */
    margin: 0;
    padding: 0 1em;
    overflow: auto;
    height: 150px;
}

.p-depo-nome{ /* Nome de quem fez o depoimento */
    font-weight: bold;
    text-transform: uppercase;
    color: #242424;
    margin: 1em 0 0 0;
    padding: 0;
}

.p-depo-data{ /* Data de quando foi feito o depoimento */
    margin: 0;
    padding: 0;
    font-size: 10px;
}

/* chamas para texto */
.fire{
    text-shadow:
    0px -2px 4px #fff, /* 0px -2px 4px #fff */
    0px -2px 10px #FF3, /* 0px -2px 10px #FF3 */
    0px -10px 20px #F90, /* 0px -10px 20px #F90 */
    0px -20px 40px #C33; /* 0px -20px 40px #C33 */
}