nav {
    background-color: #474747;
    padding: 5px 45px 5px 0;
    font-family: 'Baskerville Old Face';
    border-bottom: 1px solid #5696D8;
}

ul {
    list-style-type: none;
}

.logo a {
    color: #878D8D;
    text-decoration: none;
}

.logo a:hover {
    color: white;
    text-decoration: none;
}

.menu li {
    font-size: 18px;
    padding: 15px 5px;
    white-space: nowrap;
}

.toggle a {
    color: white;
}

.logo a,
.toggle a {
    font-size: 25px;
}

.button.secondary {
    border-bottom: 1px #5696D8 solid;
}

/* Mobile menu */
.menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.toggle {
    order: 1;
}

.item.button {
    order: 2;
}

.item {
    width: 100%;
    text-align: center;
    order: 3;
    display: none;
}

.item.active {
    display: block;
}

.item a {
    color: white;
    text-decoration: none;
}

.item a:hover {
    color: #878D8D;
    text-decoration: none;
}

/* Tablet menu */
@media all and (min-width: 600px) {
    .menu {
        justify-content: center;
    }

    .logo {
        flex: 1;
    }

    .toggle {
        flex: 1;
        text-align: right;
    }

    .item.button {
        width: auto;
        order: 1;
        display: block;
    }

    .toggle {
        order: 2;
    }

    .button.secondary {
        border: 0;
    }

    .button a {
        color:white;
        background-color: #5696D8;
        padding: 8px 15px;
        border: 1px white solid;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
    }

        .button a:hover {
            color: white;
            background-color: #5696D8;
            border: 1px white solid;
            text-decoration: none;
        }
}

/* Desktop menu */
@media all and (min-width: 900px) {
    .item {
        display: block;
        width: auto;
    }

    .toggle {
        display: none;
    }

    .logo {
        order: 0;
    }

    .item {
        order: 1;
    }

    .button {
        order: 2;
    }

    .menu li {
        padding: 15px 10px;
    }

    .menu li.button {
        padding-right: 0;
    }
}