



#forum .grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
#forum .col-span-4 {
  grid-column: span 4 / span 4;
}
#forum .col-span-1 {
  grid-column: span 1 / span 1;
}



#forum .aside-fixed {
  position: sticky;
  top: 100px;
  align-self: start;
}
#forum main {
  margin:0;
  padding:0;
}


#forum .info-fixed {
  position: sticky;
  top: 100px;
  align-self: start;
}



#home-recom-forum-cat .grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 20px;
}

#home-recom-forum-cat .col-span-1 {
  grid-column: span 1 / span 1;
}

#home-recom-forum .grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

#home-recom-forum .col-span-3 {
  grid-column: span 1 / span 1;
}


#forum-cat-topic .grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
#forum-cat-topic .col-span-1 {
  grid-column: span 1 / span 1;
}

/* Phones */
@media (max-width: 768px) {

    #forum-cat-topic .grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
    }
    #forum-cat-topic .col-span-1 {
      grid-column: span 1 / span 1;
    }


}

/* Phones */
@media (max-width: 576px) {

    #forum-cat-topic .grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
    }
    #forum-cat-topic .col-span-1 {
      grid-column: span 1 / span 1;
    }


}


/* desktop */
.art-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.art-grid-item {
  grid-column: span 1 / span 1;
  background:white;
}



/* Small phones */
@media (max-width: 435px) {
  .art-grid {
     display: flex !important;
    flex-direction: column !important;
  }

  .art-grid-item {
      width: 100%; /* Ensure full width on small screens */
  }
}

/* Phones */
@media (max-width: 768px) {
    .art-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
    }

    .art-grid-item {
      grid-column: span 1 / span 1;
      background:white;
    }
}


#subMenuCat .grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

#subMenuCat .col-span-1 {
  grid-column: span 1 / span 1;
}

/* Phones */
@media (max-width: 640px) {
    #subMenuCat .grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }

    #subMenuCat .col-span-1 {
      grid-column: span 1 / span 1;
    }

}
/* Small phones */
@media (max-width: 435px) {
  #subMenuCat .grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }

  #subMenuCat .col-span-1 {
    grid-column: span 1 / span 1;
  }

}


