aside nav {
    width: 300px;
    display: flex;
}
aside {
    font-size: 130%;
}
aside ul {
    padding-left: 1em;
    padding-right: .3em;
    font-size: 90%;
    padding-top: .5em;
    box-shadow: 1px 2px 3px #333;
}
aside li:hover {
    background-color: #fff3;
    
}

ul,li,div {
    border-radius: .25em;
}

h1 {
    padding: 1em;
    text-shadow: 1px 2px tan, 2px 3px 3px #999;
}

* {
    transition: 0.1s;
  
}
body {
    background: linear-gradient(to bottom, skyblue, tan);
    min-height: 100vh;
}
main {
    max-width: 1600px;
    margin: auto;
    
}

.item {
    border-radius: 1em;
    border: 1px solid black;
    background-color: #fff6;
    width: 360px;
    aspect-ratio: 1/1;
    object-fit: contain;
}
.item:hover{
    background-color: #fffa;
}

main {
    container-type: inline-size;
}
@media (max-width: 760px) {
    main {
	flex-direction: column;
    }
    aside nav
    {
        overflow: auto;
	width: 100%;
	
	&> * {
	display: flex;
	flex-direction: row;
	align-items: start;


    }
    }

}


