footer{
    background-color: #212D40;
    padding: 20px;
    width: 100%;
    text-align: left !important;
}

footer .logoFooter{
    width: 70%;
}

footer .slogan{
    font-size: 7pt;
    color: #D8DADE;
    font-family: Avenir-Next-Regular;
    text-align: justify;
}
footer .subtituloFooter{
    color: #FCD168;
    font-size: 11pt;
    font-family: Avenir-Next-Demi;
}

footer .email{
    height: 25px;
    width: 100%;
    font-family: Avenir-Next-Regular;
    padding: 2px 10px;
    font-size: 8pt;
}

footer hr{
    color: #fff;
    size: 8px;
    width: 100%;
}
footer ul{
    list-style-type: none !important;
    overflow-x: hidden;
    justify-content: center;
    padding: 0;
}

footer ul li{
    margin: 5px;
}

footer ul li img{
width: 60%;
}
footer .derechos{
    font-family: Avenir-Next-Demi;
    font-size: 6pt;
    text-align: center;
    color: #fff;
    margin: 15px 0px 0px 0px;
}

.btn-grad {background-image: linear-gradient(to right, #F09819 0%, #EDDE5D  51%, #F09819  100%)}
.btn-grad {
   font-family: Avenir-Next-Bold;
   font-size: 10pt;
   margin: 10px 0px;
   padding: 5px 30px;
   text-align: center;
   transition: 0.5s;
   background-size: 200% auto;
   color: white;            
   border-radius: 5px;
   display: block;
   border-color: transparent;
 }

 .btn-grad:hover {
   background-position: right center; /* change the direction of the change here */
   color: #fff;
   text-decoration: none;
 }

/*Celulares*/
@media (min-width: 576px) { 
    footer .logoFooter{
        width: 60%;
        margin: 0px 30px;
    }
}
/*Tablets*/

@media (min-width: 768px) { 
    footer .slogan{
        font-size: 8pt;
    }
    footer .logoFooter{
        width: 100%;
        margin: 0px 30px;
    }
    
}

/*Desktops */
@media (min-width: 992px) { 
  
    footer .slogan{
        font-size: 10pt;
        margin: 0px 100px 0px 30px; 
    }
    footer .logoFooter{
        width: 60%;
        margin: 0px 30px;
    }
    footer .subtituloFooter{
        margin-top: 15px;
    }
    footer .email{
        width: 80%;
    }
    footer ul li{
        margin: 0px 20px;
    }
    
    footer ul li img{
    width: 60%;
    }
    footer .derechos{
        font-size: 8pt;
        margin: 5px 0px 0px 0px;
    }
}

/*Large desktops*/
@media (min-width: 1200px) { 
  
    footer .slogan{
        font-size: 10pt;
        margin: 0px 150px 0px 50px; 
    }
    footer .logoFooter{
        width: 40%;
        margin: 0px 50px;
    }
    footer .subtituloFooter{
        margin-top: 35px;
    }
    footer .email{
        width: 60%;
        float: left;
  clear: both;
    }
    footer ul li{
        margin: 0px 20px;
    }
    
    footer ul li img{
    width: 60%;
    }
    footer .derechos{
        font-size: 8pt;
        margin: 5px 0px 0px 0px;
    }
}

/*Larger desktops*/
@media (min-width: 1400px) { 
   
}