fediversity.eu/assets/scss/custom.scss

// Add your own custom styles here
.grid-container {
    display: flex;
    justify-content: space-between;
  }
  
  .column {
    flex-basis: calc(50% - 10px); /* Adjust width as necessary */
  }
  
  .list {
    list-style-type: none;
    padding: 0;
  }
  
  .list-item {
    margin-bottom: 10px;
  }
  
  .link {
    text-decoration: none;
    color: inherit;
  }
  
  .title {
    font-weight: bold;
  }
  
  .hr-list {
    border: 0;
    border-top: 1px solid #ccc;
    margin-top: 5px;
    margin-bottom: 5px;
  }
  
  .list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .content {
    flex: 1;
  }
  
  .link {
    text-align: left;
  }
  
  .time {
    text-align: right;
  }
  

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

  .grid-item {

    padding: 20px;
  }

  .header-with-image {
    display: flex;
    align-items: flex-start;
  }

  .header-with-image img {
    margin-right: 10px;
    max-width: 100px; /* Adjust as needed */
    max-height: 100px; /* Adjust as needed */
    align-items: center;
  }

  .read-more-link {
    color: #FF6E00; /* Use the variable defined in theme.json */
  }
  
  .center-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    
  }

  .grid-container-small {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .hr-list {
    margin-top: 0;
    margin-bottom: 0;
    margin-right: .5rem;
  }

  .center-layout {
    display: flex;
    justify-content: center;

    
  }

  .hr-list2 {
    border: 20;
    border-top: 1px solid #FF6E00;
    margin-top: 5px;
    margin-bottom: 5px;
  }

  .header-with-image2 {
    text-align: center;
  }
  
  .header-with-image2 img {
    display: inline-block;

  }

  .line {
    border-top: 1px solid #FF6E00; /* Change color and thickness as needed */
    margin: 10px 0; /* Adjust spacing between the line and the divs */
}

	
@media (max-width: 600px) {
  .grid-container {
    grid-template-columns: repeat(1, 1fr);
  }

  .grid-item {
    padding: 0;
    .header-with-image2 {
      text-align: start;
    }
  }

  .grid-container-small {
    grid-template-columns: repeat(1, 1fr);
  }

  .header-with-image2 {
    svg {
      width: 4px;
      height: 4px;
      margin: 0 0 8px 0;
    }
  }
}