body {
      margin: 0;
      font-family: Arial, sans-serif;
      display: flex;
      flex-direction: column;
      min-height: 100vh;
      background-color: #3e3e42
    }

    header {
      background-color: #360269;
      color: white;
      padding: 20px;
      text-align: center;
      font-size: 2rem;
    }

    main {
      display: block;
      padding: 20px;
      flex: 1;
      color: white
    }


    .image-container {
      flex: 0 0 300px;
    }

    .image-container img {
      width: 100%;
      height: auto;
      object-fit: cover;
      filter: drop-shadow(5px 5px 10px #000000);
    }

    .post {
      display: flex;
      flex-direction: row;
      gap: 20px;
      margin-bottom: 40px;
    }

    @media (max-width: 768px) {
      .post {
        flex-direction: column;
        align-items: center;
      }
    }

    .text-container {
      flex: 1;
      color: #FFFFFF;
      filter: drop-shadow(5px 5px 10px #000000);
    }

  .pride-strip {
    background: #3e3e42;
    overflow: hidden;
    white-space: nowrap;
  }

  .scrolling-hearts {
    display: inline-block;
    font-size: 1.2rem;
    padding: 4px 0;
    animation: scroll-hearts 160s linear infinite;
    will-change: transform;
    filter: drop-shadow(0px 0px 4px white)
  }

  @keyframes scroll-hearts {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(-50%);
    }
  }

    footer {
      background-color: #252526;
      text-align: center;
      padding: 10px;
      font-size: 0.9rem;
      color: #FFFFFF;
    }

    footer a {
      color: #FFFFFF;
      text-decoration: none;
    }

    @media (max-width: 768px) {
      main {
        flex-direction: column;
        align-items: center;
      }

      .image-container {
        width: 100%;
        max-width: 300px;
      }
    }