


.categorypanel {
   display: flex;
   flex-direction: column;
}

.categorypanel .thumbs {
   position: relative;
}

.categorypanel .thumbs ul,
.categorypanel .thumbs ul li {
   margin: 0;
   padding: 0;
}
.categorypanel .thumbs ul {
position: absolute;
height: 100%;
width: 100%;
   list-style: none;
   display: flex;
   overflow: auto;
}
.categorypanel .thumbs ul li {
   flex: 0 0 100%;
}
@media( min-width: 480px ) {
   .categorypanel .thumbs ul li {
      flex-basis: 50%;
   }
}
@media( min-width: 768px ) {
   .categorypanel .thumbs ul li {
      flex-basis: 25%;
   }
}
@media( min-width: 1024px ) {
   .categorypanel {
      flex-direction: row-reverse;
      justify-content: space-between;
      height: 100%;
   }
   .categorypanel .thumbs ul {
      flex-direction: column;
      max-width: 256px;

   }
   .categorypanel .thumbs ul li {
      flex-basis: auto;
   }
}
.categorypanel .thumbs ul img {
   display: block;
   width: 100%;
   height: auto;
   aspect-ratio: 1/1;
   object-fit: cover;
   cursor: pointer;
}
