footer{
position: relative;
float: left;
width: 95%;
padding: 2.5%;
margin-top: 5%;
background: black;
}
footer .logo{
padding: 20px 0; 
height: 100px;
}
footer .logo img{
height: 100%;
}
footer #navs{
width: 15%;
padding: 20px;
}
footer #navs .nav{
width: 100%;
font-size: 17px;
line-height: 20px;
font-weight: 500;
color: white;
}
footer #navs .nav.selected{
color: var(--brand-color);
}
footer #info{
width: 25%;
padding: 20px;
}
footer #info .info{
width: 100%;
margin-bottom: 10px;
}
footer #info .info a{
color: white;
font-size: 17px;
line-height: 20px;
font-weight: 500;
text-decoration: none;
}
footer #info .info a .colored{
color: var(--brand-color);
}
footer #icons{
width: 20%;
padding: 0 20px;
}
footer #icons .icon{
width: 40px;
height: 40px;
border-radius: 100%;
background: var(--brand-color);
margin: 20px 10px 0 0;
}
footer #icons .icon img{
width: 60%;
height: 60%;
padding: 20%;
filter: invert(0);
}
footer #powered-by{
float: right;
padding: 30px 0; 
height: 80px;
}
footer #powered-by .img{
height: 100%;
}
footer #powered-by .img svg{
fill: white;
height: 100%;
}
footer #fiscal{
width: 90%;
padding: 0 5%;
color: white;
font-size: 17px;
line-height: 20px;
font-weight: 500;
text-align: center;
}
@media (max-width: 768px) {
footer{
width: 90%;
padding: 5% 5% 10%;
}
footer .logo{
padding: 10%; 
margin: 0 5% 0% 0%;
height: auto;
width: 30%;
}
footer .logo img{
width: 100%;
height: auto;
}
footer #navs{
width: 45%;
padding: 0;
margin-top: 4%;
}
footer #navs .nav{
font-size: 14px;
line-height: 16px;
}
footer #info{
width: 45%;
padding: 0px;
margin-top: 5%;
}
footer #info .info{
width: 100%;
margin-bottom: 2%;
}
footer #info .info a{
font-size: 14px;
line-height: 16px;
}
footer #icons{
width: 45%;
padding: 0;
margin: 0 5% 0% 5%;
margin-top: 10%;
}
footer #icons .icon{
width: calc(32% - 10px);
padding-top: calc(32% - 10px);
height: auto;
margin: 0px 10px 0 0;
}
footer #icons .icon img{
position: absolute;
top: 0;
}
footer #powered-by{
width: 45%;
margin-top: 10%;
padding: 0;
}
footer #powered-by .img{
float: left;
left: 50%;
transform: translateX(-50%);
}
footer #fiscal{
margin-top: 10%;
}
}