/* Footer */

.container_footer{
    max-width: none;
}

footer {
    display: flex !important;
    background-color: rgb(53, 51, 51);
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.637);
    width: 100%;
    margin-top: 8vh;
    padding-bottom: 3vh;
    font-size: calc(.2px + 1vw);
}

.title-footer{
    color: white;
    padding-top: 3vh;
    font-size: calc(3.5px + 1vw);
    margin-bottom: 5px;
    text-transform: uppercase;
}

#redes-footer{
    display: flex;
}

#redes-footer > a{
    padding: 1vh;
    border-radius: 6px;
    margin-top: 5vh;
    border: 2px solid white;
    transition: .5s
}

#redes-footer > a:hover{
    transform: translateY(-2px);
}

#redes-footer > a > img{
    width: 2vw;
    height: 2vw;
    filter: invert();
}

#sub-footer{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgb(2, 114, 2);
    width: 100%;
    height: 4vh;
    color: white;
    font-size: calc(3px + 1vw);
}

#questions{
    display: inline-block;
    font-size: calc(4px + 1.2vw);
    color: white;
    padding-top: 5vh;
    text-decoration: none;
}

#questions > img{
    filter: invert();
    width: 20px;
    height: 20px;
    transition: .5s;
    width: 1.6vw;
    height: 1.6vw;
}


#questions:hover > img{
    transform:translateY(-3px);
}


@media screen and (max-width:769px){

    footer {
        font-size: calc(4px + 1vw);
    }

    
    .title-footer{
        font-size: calc(6px + 1.3vw);
    }

    #redes-footer > a > img{
        width: 4vw;
        height: 4vw;
    }

    #sub-footer{
        font-size: calc(6px + 1vw);
    }

    #questions{
        font-size: calc(8px + 1vw);
    }

    #questions > img{
        width: 3vw;
        height: 3vw;
    }
    
}

@media screen and (max-width:500px){

    .title-footer{
        font-size: calc(10px + 1vw);
    }

}

@media screen and (max-width:400px){

    footer {
        font-size: calc(7px + 1.5vw);
    }

    
    .title-footer{
        font-size: calc(10px + 1vw);
    }

    #redes-footer > a > img{
        width: 6vw;
        height: 6vw;
    }

    #sub-footer{
        font-size: calc(8px + 1vw);
    }

    #questions{
        font-size: calc(10px + 1vw);
    }

    #questions > img{
        width: 5vw;
        height: 5vw;
    }
    
}


.float {
    position: fixed;
    width: 60px;  
    bottom: 40px;
    right: 40px;     
    border-radius: 50px;
    text-align: center;
    font-size: 30px;  
    z-index: 100;
}

.float:hover {
    text-decoration: none;
  
}

.my-float {
    margin-top: 16px;
}