﻿/* GLOBAL STYLES */

* {
    box-sizing: border-box;
}

body {
    font-family: 'Fira Sans', sans-serif;
    margin: 0;
}

.aLINK {
    color: blue;
    font-weight: 300;
    letter-spacing: 2px;
    text-decoration: none;
    background-COLOR: ; /*  rgb(238, 13, 13)*/
    
    padding: 20px 5px;
    display: inline-block;
    width: 100%;
    text-align: center;
}

    .aLINK:hover {
        background-color: lightgray; /* rgba(238, 13, 13, 0.75);*/
    }

.main {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 3em 1.5em;
}

.navigation ul {
    border: 1px solid rgb(212, 20, 20);
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    color:blue;
}

.navigation li {
    flex: 3;
}

.navigation .user {
    flex: 1;
}

@media all and (max-width: 1000px) {
    .navigation ul {
        flex-wrap: wrap;
    }

    .navigation li {
        flex: 1 1 50%;
    }

    .navigation .user {
        flex: 1 1 33.33%;
    }
}

@media all and (max-width: 480px) {
    .navigation li {
        flex-basis: 100%;
    }

    .navigation .user {
        flex-basis: 50%;
    }
}

