.texto{
    margin-top: 20px;
}
.texto p {
    color: #333;
    padding-left: 2rem;
    padding-right: 2rem;

}

.texto h2 {
    text-align: center;
    color: #022723;
    font-size: 2.8rem;
}


.texto-encurtador {
    text-align: center;

}

.container-corpo {
    display: flex;
    justify-content: space-between;
    padding: 20px;
    width: 90%;
    background-color: #166b64;
    margin: auto;
    margin-top: 50px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.formulario {

    width: 50%;
    background-color: #ffffff;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);


}


.formulario h1 {
    margin-bottom: 20px;
}

.formulario p {
    margin-top: 20px;
    color: #022723;
}

.texto-lateral h1 {
    color: #ffffff;
}
 .texto-lateral p {
        
        color: #F7D917;
    }



form {
    margin-top: 20px;

}

label {
    display: block;
    margin-bottom: 5px;
    color: #333;
}

.container input[type="text"] {
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    border: 1px solid #cccccc;
    border-radius: 5px;
}

.container input[type="submit"] {
    background-color: #009688;
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    width: 90%;


}

.container input[type="submit"]:hover {
    background-color: #00796b;
}


.resposta {
    display: none;

}

.resposta h3 {
    margin-top: 10px;

    padding: 10px;
    color: red;
}

.container button[type="button"] {
    background-color: #b99009;
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: none;
    width: 90%;
}

.container button:hover {
    background-color: #109787;
}




.texto-lateral {
    width: 60%;
    padding: 1.5rem;
}

.anuncio {
    display: flex;
    justify-content:flex-start;
    padding: 20px;
    text-align: center;
    height: 360px;
    flex-direction: row;
    
    }
   
  .anuncio div {
    padding: 20px;
    margin-bottom: 20px;
    
    

  }


footer {
    width: 100%;
    color: white;
    text-align: center;
    padding: 10px 0;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    background-color: #166b64;
}

.limited-width {
    max-width: 100%;
    /* Defina a largura máxima desejada */
    overflow: hidden;
    /* Impede que o texto ultrapasse a largura máxima */
    white-space: nowrap;
    /* Impede que o texto quebre em várias linhas */
    text-overflow: ellipsis;
    /* Adiciona reticências (...) quando o texto ultrapassa a largura máxima */
}

.clear-link {
    float:right;
    color:#333;
    margin-top: 10px;
    font-weight: bold;
    display: none;
}

/* Adição de responsividade usando uma consulta de mídia */

@media only screen and (max-width: 600px) {

  
    header {
      
        background-color: #166b64;
        color: white;
        padding: 10px 20px;
        text-align: center;
        display: flex;
        flex-direction:row;
        align-items: center;
       


    }

    .logo {
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 10px;
        color: #ffffff;
        text-decoration: none;
        /* Adicionei um espaço abaixo do logotipo */
    }
    .logo a{
        text-decoration: none;
        color: #fff;
    }

    nav ul {
        color: #fff;
        list-style: none;
        padding: 0;
        margin: 0;
        
    }
    
    nav ul li {
        display: inline-block;
        position: relative;
      
        
    }
    
    nav ul li a {
        display: block;
        padding: 10px 15px;
        text-decoration: none;
        color: #ffffff;
        
    }
    
    nav ul li:hover {
        background-color: #07682c;
    }
    
    nav ul li:hover .sub-menu {
        display: block;
    }
    
    .sub-menu {
        display: none;
        position: absolute;
        font-size: 14px;
        top: 100%;
        left: 0;
        background-color: #fff;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    }
    
    .sub-menu li {
        display: block;
    }
    
    .sub-menu li a {
        padding: 10px 15px;
        color: #333;
        text-decoration: none;
    }
    
    .sub-menu li:hover {
        background-color: #f0f0f0;
    }
    
    
    nav a:hover {
        color: #ffcc00;
        /* Cor do texto nos links ao passar o mouse */
    }
    
    a {
        text-decoration: none;
           
    }
    
    .texto-lateral {
        width: 97%;
        padding: 1.5rem;
        color: #F7D917;
    }

    .texto-lateral p{
        width: 90%;
        padding: 1.5rem;
        color: #F7D917;
    }

    .texto p {
        color: #333;
        padding: 0 1rem;
        /* Adaptação para dispositivos menores */
    }

    .texto h2 {
        text-align: center;
        color: #022723;
        font-size: 22px;
    }

    .container-corpo {
        display: flex;
        flex-direction: column;
        /* Empilha os elementos verticalmente em dispositivos menores */
        padding: 10px;
        width: 95%;
        background-color: #166b64;
        margin: auto;
        margin-top: 50px;
        border-radius: 10px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }

    
    .formulario {
        display: flex;
        flex-direction: column;
        width: 85%;
        background-color: #ffffff;
        padding: 10px;
        border-radius: 10px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        
    
    }
    .clear-link {
        
        color:#333;
        margin-top: 10px;
        font-weight: bold;
        display: none;
    }
      
    footer {
        width: 100%;
        color: white;
        text-align: center;
        padding: 10px 0;
        display: block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        background-color: #166b64;
    }

    .anuncio {
        display: flex;
        flex-direction: column; /* Muda para empilhar verticalmente */
        height: auto; /* Altura automática para acomodar o conteúdo verticalmente */
        padding: 10px; /* Ajuste conforme necessário */
        width: 90%;
    }
    .anuncio div {
        padding: 20px;
        margin-bottom: 20px; 
    }  
    
    }