@charset "UTF-8";

@media screen and (max-width: 768px) {
    span#burger{
        position: sticky;
        top:0;
        background-color: var(--cor3); 
        box-shadow: 0 5px 15px 0 rgb(50 50 50 / 50%);
        font-size: 25px;
    }

    nav > ul > li{
        border: 1px solid #414141;
    }

    .social-media-container > img{
        display:none;
    }
    #time{
        display: block;
        text-align: center;
        padding-bottom: 5px;
    }
    header > section > h1{
        text-align: center;
        font-size:1.5em;
    }
    #date{
        display: block;
        text-align: center;
        font-size: 90%;
    }

    .container{
       max-height: 510px;
       }
   

    footer{
        padding: 25px;
    }
    
}

@media screen and (min-width: 768px) and (max-width: 992px){
    span#burger{
        position: sticky;
        top:0;
        background-color: var(--cor3); 
        box-shadow: 0 5px 15px 0 rgb(50 50 50 / 50%);
        font-size: 25px;
    }

    nav > ul > li{
        border: 1px solid #414141;
    }

    .social-media-container > img{
        display:none;
    }
    #time{
        display: block;
        text-align: center;
        padding-bottom: 5px;
    }
    header > section > h1{
        text-align: center;
        font-size:1.5em;
    
    }
    #date{
        display: block;
        text-align: center;
        font-size: 90%;
    }

    .container{
       min-height: 710px;
       }
   

    footer{
        padding: 25px;
    }
     .image > img{
        max-width: 80%;
        height: auto;
     }
}

@media screen and (min-width: 992px) and (max-width: 1024px){
    span#burger{
        display: none;
    }
    nav.navbar{
        display: block; 
    }

    nav > ul{
        text-align: center;
    }

    nav > ul > li{
        display: inline-block;
        
        border-right: 1px solid #414141;
    }

    li.last{
        border-right:none ;
    }
    
}

@media screen and (min-width: 1025px){
    span#burger{
        display: none;
    }
    nav.navbar{
        display: block; 
    }

    nav > ul{
        text-align: center;
    }

    nav > ul > li{
        display: inline-block;
        border-right: 1px solid #414141;
    }

    li.last{
        border-right:none;
    }

    .text-box  h1{
        font-size: 3.2em;
    }
}