.innernav {
    margin: 0;
    padding: 0 2em;
    background: #4e4e4e;
    color: #fff;
    text-transform: uppercase;
    font-weight: 900;
    display: flex;
    margin-bottom: 1.5em;
}

.innernav a {
    display: block;
    padding: 1.5em;
    border-left: 1px solid gray;
    text-align: center;
    color: #fff;
    transition: background 500ms
}

.innernav a:hover {
    background: #c7c7c7
}

.innernav a.active {
    background: #373737
}

.innernav span {
    position: relative
}

.innernav span:before {
    font-family: CertifiedScales;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    top: -.25em;
    left: -1.15em;
    font-size: 2.15em;
    color: #71c7f8;
    transition: color 500ms
}

.innernav a:hover span:before {
    color: #40b4f6
}

.innernav .service span:before {
    content: "\e806"
}

.innernav .software span:before {
    content: "\e805"
}

.innernav .fabrication span:before {
    content: "\e801";
    top: -.15em
}

.innernav .request span:before {
    content: "\e91d"
}

@media (max-width: 767px) {

    .innernav a {
        border-right: 1px solid gray;
        width: 100%
    }
}

@media (min-width: 768px) and (max-width:1159px) {

    .innernav a {
        float: left;
        width: 50%
    }

    .innernav a:nth-child(2),.innernav a:last-child {
        border-right: 1px solid gray
    }
}

@media (min-width: 1160px) {

    .innernav a {
        float: left;
        width: 25%
    }

    .innernav a:last-child {
        border-right: 1px solid gray
    }
}