#check {
    display: none;
}

#icone {
    margin-top: 5px;
    cursor: pointer;
    padding: 15px;
}


#check:checked ~ #navi {
    transform: translateX(250px);
}

    #check:checked ~ #navi a ul .link {
        opacity: 1;
        transition-delay: .4s;
    }


#navi {
    width: 250px;
    height: 100%;
    background-color: rgba(40, 76, 100, .9);
    transition: all 0.4s linear;
    position: absolute;
    left: -250px;
    z-index: 21;
    margin-top:0px;
}

    #navi a {
        text-decoration: none;
        display: block;
        padding: 20px 5px;
        color: #cfcfcf;
    }

        #navi a:hover {
            background-color: rgb(30, 60, 80);
        }

    #navi ul {
        list-style: none;
        font-family: 'Arial';
        margin-top: 15px;
        padding: 50px 0px;
    }

.fonte {
    margin-left: 10px;
}

#titleNav{ font-size:x-large; 
           font-weight: bold; 
           margin-top:10px; 
           color: rgb(40, 76, 100);

}


.top-menu {
    background-color: rgb(220,245,250);
}

#loginBtn {
    background-color: rgb(40, 76, 100);
    margin-top: 5px;
}

#loginBtn2 {
    background-color: rgb(40, 76, 100);
    margin-top: 5px;
}


#alarmPanel {
    position: absolute;
    margin-top: 65px;
    margin-left: 16%;
    width: 80%;
    max-height: 70px;
    overflow-y: auto;
    z-index: 1;
}