* {
    margin: 0; padding: 0; box-sizing: border-box;
}

body {
    background-color: rgb(144, 252, 205);
     font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 1.1rem;
    color: rgb(6, 6, 6);
}

header h1 {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
    padding: 24px 8px 8px 8px;
    margin: 15px;
}

header h1 span {
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: auto;
    background-color: rgb(0, 120, 190);
    color: aliceblue;
    text-align: center;
    padding: 24px 0;
    font-weight: normal;
    display: block;
    transform: rotate(-2deg);
    box-shadow: 2px 5px 0px black;
    min-width: 300px;
}
header h1 span:first-child {
    background-color: rgb(98, 204, 74);
    flex-grow: 2;
}

header h1 span:nth-child(2) {
    background-color: rgb(253, 131, 0);
}

nav.main_menu {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
    margin: 10px auto;
    width: clamp(200px, 80%, 700px);
    padding-top: 45px;
    text-indent: -9999px;
}

nav.main_menu a {
    background-color: rgb(167, 85, 244);
    flex-grow: 0;
    flex-basis: 25%;
    aspect-ratio: 1;
    text-indent: -9999px;
    
   
}

a img {
   flex-grow: 0;
    flex-basis: 25%;
    aspect-ratio: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    

}



