@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@900&display=swap');

body{
    background-color: rgb(250,250,130);
}

.header{
    text-align: center;
    font-family: 'Frank Ruhl Libre', serif
}

ul{
    list-style-type: none;
    margin: 0;
    padding:0;
    overflow: hidden;
    background-color: rgb(250,250,130);
    border-style:solid;
    border-radius: 8px;

   
    
    margin: 10px;
}

li{
    float: left;
    border-right: 1px solid #bbb;
    border-color: black;
}

li a{
    display: block;
    color: black;
    text-align: center ;
    padding:14px 16px ;
    text-decoration: none ;

    font-size: larger;
}

li a:hover:not(.active){
    background-color: rgb(250,180,10);
}

.active{
    background-color: skyblue;
}

a {
    text-decoration: none;
    color: black;
}


.grid-even-columns{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.window{
    font-size: 20px;
    text-align: center;
    margin:10px;
    padding: 5px;
    border-style: solid;
    border-radius:8px;
}

.window:hover {
    color: rgb(10,10,10);
    background-color:rgb(250,180,10);
}