@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');

@font-face {
    font-family:'android';
    src: url(fontes/idroid.otf) format(opentype);
}

*{
    margin: 0px;
    padding: 0px;
}


:root{

    --cor0: #c5ebd6;
    --cor1: #83e1ad;
    --cor2: #3ddc84;
    --cor3: #2fa866;
    --cor4: #1a5c37;
    --cor5: #063d1e;

    --font-padrao: 'Arial, Verdana< helvetica, dans-serif';
    --font-destaque: 'bebas-neue' cursive;
    --font-android: 'android', cursive;

}


body{
    background-color: var(--cor0);
    font-family:var(--font-padrao);}


header{ background-image: linear-gradient(to right, #2fa866,#1a5c37);
min-height: 150px;
text-align: center;}


header > h1{
    font-family: var(--font-destaque);
    color: white;
    padding-top: 30px;
    text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.651);
    font-size: 3em;}

header > p{
    color: white;
    padding-top: 10px;
    font-family: var(--font-padrao);
    font-size: 1.3em;
    max-width: 500px;
    margin: auto;
    padding-right: 10px;
    padding-left: 10px;
    text-shadow: 5px 5px 5rgba(0, 0, 0, 0.752)ack;
    padding-bottom: 15px;}


   main p{
        text-indent: 30px;
        text-align: justify;
        line-height: 1.5em;
        padding: 20px;
        margin: 15px 0px ;
        font-size: 1.1em;
        font-weight: bold;
        
    }

 
 nav{ background-color: var(--cor4);
    padding: 7px;
    box-shadow: 1px 12px 20px rgba(0, 0, 0, 0.518) ;
    padding-bottom: 10px;}
 
 nav> a{ 
    color: white;
    padding: 5px;
    font-size: 1.1em;
    text-decoration: none;
    font-weight: bold;
}

nav > a:hover{
    background-color:rgba(255, 255, 255, 0.591);
    color: black;
    transition-duration: 0.9s;
}


main{
    background-color: white;
    max-width:950px;
    min-width: 300px;;
    margin: auto;
    margin-bottom: 20px;
    padding: 20px ;
    box-shadow: 4px 0px 15px rgba(0, 0, 0, 0.616);
    border-radius: 0px 0px 10px 10px;
}


 main h1{
        font-family: var(--font-android);
        font-weight: normal;
        padding: 15px;
        background-image: linear-gradient(to right, #1a5c37, #2fa866, transparent);
        color: white ;}


 main h2{
        font-family: var(--font-android);
        font-weight: normal;
        padding: 15px;
        background-image: linear-gradient(to right, #1a5c37, #2fa866, transparent);
        color: white;}



aside{
    background-color: #2fa866;
    padding: 10px;
    border-radius: 15px 15px 0px 0px;
    box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.59);
}


aside > ul{
    list-style-position: inside;
    columns: 2;
    list-style-type: '\2714\00A0\00A0';
    
    
}


h3{ background-color: #063d1ecc;
    color: white;
    font-size: 1.8em;
    padding: 10px;
    padding-bottom: 10px;
    text-indent: 5px;
    margin: -10px -10px  0px -10px;
    border-radius: 15px 15px 0px 0px ;}
    


footer{ background-color: var(--cor5);
        color: white;
        text-align: center;}

.link1{ color: white;}



img{
    width: 100%;
    margin: auto;
    display: block;
}
.bugdroid{
    display: block;
    max-width: 450px; }


    strong{ color: #2fa866;
    font-weight: bolder;}


    main a{ color: #2fa866;
            font-weight: bolder;
        text-decoration: none;}

    a:hover{
        background-color:#1a5c3762;
        transition-duration: 0.7s;
    }
    

    .video{
        background-color: #1a5c37;
        margin: 0px -20px 30px -20px;
        padding: 20px;
        position: relative;
        padding-bottom: 57%;}

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