/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {
  --color-primary: #5557cc;
  --color-grey: #2C2121;
  --color-light-grey: ##BEBBB7;
  --color-white: #fff;
  --color-dark: #111111;
  --color-black: #000;
  --color-primary-light: #bfb286;
}



/* external Fonts */
@import url('https://fonts.googleapis.com/css2?family=Roboto@display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border-radius: 0 0 0 0;
}

body{
    /* margin: 0.5em; */
    font-family: "Roboto" , sans-serif;
    text-align: center;  
  /* font-family: "Open Sans", sans-serif; */
  /* font-family: "Raleway", sans-serif; */
  /* color: #444444; */
  color: var(--color-primary);

}


/* Menu */
nav {
    background-color: var(--color-primary);
    /* border: solid 2px #333;
    border-radius: 2rem;
    margin: 0 auto 1rem;
    max-width: 600px;
    font-size: 3rem; */
    line-height: 7rem; 
} 

ul{
    list-style-type:none;
    padding: 0,5em ;
    /* padding-left: 0; */
    text-align: right;
    margin: 0;
}

li{
    /* border-top: 2px solid #333; */
        display: inline-block;
        margin-inline: 0,5em;
}


li a{
    display: block;
}

li a,
li a:visited{
    text-decoration: none;
    color: #333;
}

li a:hover,
li a:focus {
    background: #333;
    color: whitesmoke;
    cursor: pointer;
}

li:last-child a {
    /* border-radius: 0 0 2rem 2rem; */
}

/* h2{
    padding: 1rem;
    background-color: gold;
    border-radius: 2rem 2rem 0 0;
} */