@charset "UTF-8";
@font-face {
    font-family: idroid;
    src: url(../assets/fontes/idroid.otf) format("opentype");
}

:root{
    --cor-primaria: #016321;
    --cor-secundaria: #00af3b;
    --cor-terciaria: #00521b;
    --cor-quarternaria:  #02dd4bbb;
    --cor-texto: black;
    --cor-fundo: rgb(255, 221, 221);
    --cor-fundo-header: linear-gradient(to bottom,#00af3b, #016321);
    --cor-fundo-main: white;
}

*{
    margin: 0;
    padding: 0;
}

body{
    margin:0;
    background-color: var(--cor-fundo);
}

header{
    background: var(--cor-fundo-header);
    margin: 0;
    padding: 10px;
    box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.2);
    font-family: pledge-regular, sans-serif;

}

.h1-header{
    text-align: center;
    color: var(--cor-fundo-main);
    font-size: 2.5em;
    padding: 10px;
}

.h2-header{
    text-align: center;
    color: var(--cor-fundo-main);
    font-size: 0.8em;
    padding-bottom: 20px;
}

ul{
    margin: 0;
    padding: 0;
    list-style: '\2714\00A0\00A0'; 
    list-style-position: inside;
}

ul > li:hover{
    text-decoration: underline;
}

a{
    text-decoration: none;
}

.nav-header{
    text-align: left;
    font-size: 0.8em;
    padding: 10px;
}

.link-header{
    display: inline-block;
    padding: 10px;

}

.a-header{
    color: var(--cor-fundo-main);
    font-weight: bold;
    padding: 10px;
}

.a-header:hover{
    background-color: var(--cor-quarternaria);
    color: var(--cor-fundo-main);
    font-weight: bold;
    text-decoration: underline;
    padding: 10px;
    border-radius: 5px;
    transition: 0.9s;
}

.a-header:active{
    color: var(--cor-secundaria);
    font-weight: bold;
    text-decoration: underline;
}

main{
    margin: auto;
    max-width: 800px;
    min-width: 300px;
    background-color: var(--cor-fundo-main);   
    padding: 0px;
    box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.2);
}

abbr{
    text-decoration: none;;
}

.h1-texto-1-main{
    text-align: center;
    font-family: idroid, sans-serif;
    font-size: 2.5em;
    color: var(--cor-primaria);
    margin: 0px;
    padding: 10px;
}

.p-texto-1-main{
    text-align: justify;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
    padding: 20px;
    text-indent: 20px;
}

.h2-texto-2-main{
    text-align: left;
    font-family: idroid, sans-serif;
    font-size: 1.3em;
    color: var(--cor-terciaria);
    margin: 0px;
    padding: 10px;
    background: linear-gradient(to right, var(--cor-secundaria), var(--cor-fundo-main));
    text-indent: 20px;
}

.p-texto-2-main{
    text-align: justify;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
    padding: 20px;
    text-indent: 20px;
}

.link-a-texto{
    color: var(--cor-primaria);
    font-weight: bold;
    background-color: var(--cor-quarternaria);
    padding: 2px;
}

.link-a-texto:visited{
    color: var(--cor-fundo-main);
    font-weight: bold;
    background-color: var(--cor-quarternaria);
    padding: 2px;
}

.link-a-texto:hover{
    color:var(--cor-fundo-main);
    font-weight: bold;
    text-decoration: underline;
}

.link-a-texto:active{
    color: var(--cor-primaria);
    font-weight: bold;
    background-color: var(--cor-quarternaria);
    padding: 2px;
}

main img{
    width: 100%;

}


.p-imagem-1{
    font-family: pledge-regular, sans-serif;
    font-size: 0.8em;
    color: var(--cor-texto);
    margin-bottom: 10px;
    padding: 10px;
}



.h2-texto-3-main{
    text-align: left;
    font-family: idroid, sans-serif;
    font-size: 1.3em;
    color: var(--cor-terciaria);
    margin: 0px;
    padding: 10px;
    background: linear-gradient(to right, var(--cor-secundaria), var(--cor-fundo-main));
    text-indent: 20px;
}

.p-texto-3-main{
    text-align: justify;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
    padding: 20px;
    text-indent: 20px;
}

.imagem-3-main{
    width: 50%;
    display: block;
    margin: auto;
}

.p-texto-4-main{
    text-align: justify;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
    padding: 20px;
    text-indent: 20px;
}

div.video-1-main{
    background-color: var(--cor-terciaria);
    margin: 0px 0px 30px 0px;
    padding: 20px;
    padding-bottom: 59%;
    position: relative;
}

div.video-1-main > iframe{
    position: absolute;
    top: 5%;
    left: 5%; 
    width: 90%;
    height: 90%;
}

.texto-5-main{
    margin: 10px;
    background-color: #02d448d5;
    border-radius: 20px;
}

.h2-texto-5-main{ 
    text-align: left;
    font-family: sans-serif;
    font-size: 1 em;
    color: var(--cor-fundo-main);
    padding: 10px;
    background-color: var(--cor-terciaria);
    text-indent: 20px;
    border-radius: 20px 20px 0px 0px;
    margin: 0px;
}

.p-texto-5-main{
    text-align: justify;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
    padding: 10px;
    text-indent: 20px;
}

.lista-texto-5-main{
    columns: 2;
    text-align: justify;
    text-indent: 20px;
    padding: 10px;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
}

.lista-texto-5-main-item{
    font-size: 0.8em;
    display: block;
}

.p1-texto-6-main{
    text-align: justify;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
    padding: 10px;
    text-indent: 20px;
}

.p-texto-7-main{
    text-align: justify;
    font-family: pledge-regular, sans-serif;
    font-size: 1em;
    margin: 0px;
    color: var(--cor-texto);
    padding: 10px;
    text-indent: 20px;
}

footer{
    background-color: var(--cor-terciaria);
    color: var(--cor-fundo-main);
    text-align: center;
    padding: 5px;
    font-family: pledge-regular, sans-serif;
    margin: 0;
}