body {
    background-color: #1d1e1a;
    font-family: 'Roboto', sans-serif;
    color: #DFEBE6;
}

.navbar {
    display: inline-block;
    vertical-align: top;
    padding: 7px 170px;
}

.logo2 {
    position: absolute;
    left: 13.06%;
    top: 15px;
}

.home {
    position: absolute;
    left: 72.85%;
    right: 23.68%;
    top: 15px;
    bottom: 22.5%;
}

.categorias {
    position: absolute;
    width: 47px;
    height: 48px;
    left: 79.89%;
    top: 15px;
}

.ajuda {
    position: absolute;
    left: 86.94%;
    right: 9.58%;
    top: 15px;
    bottom: 15%;
}

footer {
    width: auto;
    height: 440px;
    text-align: center;
    align-items: center;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    background: #1C1D19;
    box-shadow: 0px -20px 60px rgba(0, 0, 0, 0.25);
}

.botoes {
    border-color: #09B0E5;
    border-radius: 0;
    color: #DFEBE6;
    position: relative;
    overflow: hidden;
    z-index: 1;
    -webkit-transition: color 200ms ease-in-out;
    transition: color 200ms ease-in-out;
}

.botoes:after {
    content: '';
    position: absolute;
    display: block;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0;
    height: 100%;
    background: #09B0E5;
    z-index: -1;
    -webkit-transition: width 200ms ease-in-out;
    transition: width 200ms ease-in-out;
}

.botoes:hover {
    color: #DFEBE6;
}

.botoes:hover:after {
    width: 110%;
}

.botoes {
    width: 400px;
    height: 100px;
    display: inline-block;
    margin: 0 0 100px 470px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 40px;
    background-color: #1d1e1a;
    border: 3px 3px 3px 3px;
    border-color: #09B0E5;
}