@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Kaushan+Script&display=swap');
@font-face {
    font-family:'kaushan-script';
    src: url("../fontes/kaushan-Script/KaushanScript-Regular.ttf");
}
/* =================== RESET =================*/

*{margin: 0; padding: 0; font-size: 100%; box-sizing: border-box; font-family: 'Yeseva One', sans-serif;}
nav, ul {list-style: none;}
a {text-decoration: none; cursor: pointer; opacity: 0.9;}
a:hover{opacity: 1;}

/* =================== hr =================*/
hr {
    width: 280px; 
    height: 2px; 
    border: none; 
    margin-bottom: 70px;    
    background-color: black;    

}

/* ====================texto ===============*/
.texto {
    display: flex;
    flex-direction: column;    
    align-items: center;
    text-align: center;
    color: #191c03;
}

.texto h3 {font-size: 2rem; margin: 70px 0 20px 0;}
.texto p {font-size: 1.1rem; margin: 20px 0 40px 0; font-weight: bolder; padding: 0 30px 0 30px;}

/* =================== HEADER =================*/
header {
    width: 100%;
    background-color: white;
    font-size: 18px;
}
.menus {
    display: flex;
    justify-content:space-between;
    align-items: center;
    padding: 20px 50px;
    
}
#logo {
    border-radius: 50%;
    margin-left: 40px;
}
header li a {color: #191c03;}
header li {margin: 0 20px}
header li:first-child {margin-left: 0;}
header li:last-child {margin-right: 0;}
@media (max-width: 700px) {
    #logo {margin: 0;}
    header {flex-direction: column;}
    header img {margin-bottom: 15px;}
}
@media (max-width: 480px) {
   .menus{ 
    flex-direction: column;
    justify-content:center;   
   }
   header li {
       margin: 10px 0 0 0;
       font-size: 1.5rem;           
    }  
    
}

/* =================== Imagem Principal =================*/
/* https://www.pexels.com/pt-br/@matheushenrin // foto maquiagem 
Foto de zhugewala no Pexels https://www.instagram.com/zhugewala/
*/


.imagem-principal {
    background-image: url('../imagens/imagem-principal.jpg');
    background-size: cover;
    background-attachment:fixed;
    min-height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #f59750;
    
}
.imagem-principal {text-shadow: 3px 0px black;}
.imagem-principal h1 {font-size: 4rem; margin-bottom: 15px;}
.imagem-principal p {font-size: 2.8rem; margin-bottom: 15px;}
.imagem-principal span {font-family: kaushan-script;}


/* =================== Texto Principal =================*/

.texto-principal a {color: rgb(5, 77, 5);}

.texto-principal ul {
    width: 100%; 
    display: flex; 
    flex-wrap: wrap;
}
.texto-principal li {
    height: 350px; 
    padding: 20px; 
    border-radius: 4px;
    background-clip: content-box;
    background-size: cover;
    background-position: center;
}

.small {
    flex-basis:40% ;
}
.large {
    flex-basis:60% ;
}

@media (max-width: 700px) {
    .small, .large {
        flex-basis: 100%;
    }
}

/* =================== Texto Secundário =================*/

.texto-secundario {
    background-color: #191c03;
    padding: 100px 50px;
    color: #fff;
}
.texto-secundario ul 
{width: 100%; 
    display: flex;
}
.texto-secundario hr {background-color: #fff;}
.texto-secundario h3 { padding-top: 0; margin-top: 0; color: #f59750;}
.texto-secundario li {padding: 0 30px; text-align: center;}
.texto-secundario h4 {font-size: 1.5rem; color: #f59750;}

.texto-secundario i {
    font-size: 3rem;
    color: #f59750;
    padding-bottom: 10px;
}

@media (max-width: 850px) {
    .texto-secundario ul  {
        flex-direction: column;
    }
}

/* =================== Rodape =================*/
.rodape{
    background-image: url(../imagens/footer.png);
    text-align: center;
}
.rodape ul {
    display: flex;
   justify-content: center;
   padding-top: 20px;
}

.rodape li {
    margin: 0 10px 10px 10px;     
}
.rodape i {
    font-size: 2.5rem; 
    color: #f59750;
}
.rodape p {
    align-items: center;
    margin-top: 10px;
    padding-bottom: 20px;
    font-family: Arial, Helvetica, sans-serif;
    color: #f59750;

}
