Fake FB Comment

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Floating Comment Boxes</title>
<style>
  body.unique-body-ABC123 {
    font-family: Arial, sans-serif;
    background-color: #f0f2f5;
    margin: 0;
    padding: 20px;
  }

  .unique-float-animation-container-DEF456 {
    overflow-x: auto;
    white-space: nowrap;
    max-width: 1280px;
    margin: 0 auto;
    padding: 10px;
  }

  .unique-float-animation-container-DEF456::-webkit-scrollbar {
    display: none;
  }

  .unique-comment-box-GHI789 {
    display: inline-block;
    background-color: white;
    border-radius: 15px;
    padding: 15px;
    width: 300px;
    max-width: 90%;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    font-family: Arial, sans-serif;
    margin-right: 10px;
    vertical-align: top;
    white-space: normal;
  }

  @keyframes unique-float-JKL012 {
    0% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-10px);
    }
    100% {
      transform: translateY(0);
    }
  }

  .unique-float-animation1-MNO345 {
    animation: unique-float-JKL012 4s ease-in-out infinite;
    animation-delay: 0s;
  }

  .unique-float-animation2-PQR678 {
    animation: unique-float-JKL012 4s ease-in-out infinite;
    animation-delay: 1s;
  }

  .unique-float-animation3-STU901 {
    animation: unique-float-JKL012 4s ease-in-out infinite;
    animation-delay: 2s;
  }

  .unique-float-animation4-VWX234 {
    animation: unique-float-JKL012 4s ease-in-out infinite;
    animation-delay: 3s;
  }
</style>
</head>
<body class="unique-body-ABC123">

<div class="unique-float-animation-container-DEF456">
  <!-- First Comment Box -->
  <div class="unique-comment-box-GHI789 unique-float-animation1-MNO345">
    <div style="display: flex; align-items: center;">
      <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Profile Picture" style="width: 50px; height: 50px; border-radius: 50%; margin-right: 10px;">
      <div>
        <div style="font-weight: bold; font-size: 16px;">John Doe</div>
        <div style="color: gray; font-size: 12px;">5h ago</div>
      </div>
    </div>
    <div style="margin-top: 10px; font-size: 14px; line-height: 1.5;">
      This product is fantastic! It has really made a positive difference in my daily routine. <span style="font-size: 16px;"></span>
    </div>
    <div style="display: flex; align-items: center; margin-top: 10px;">
      <div style="display: flex; align-items: center; margin-right: 15px;">
        <span style="font-size: 16px;">👍</span>
        <span style="font-size: 16px; margin-left: -10px;">❤️</span>
        <span style="font-size: 16px; margin-left: -10px;">😮</span>
        <span style="font-size: 14px; margin-left: 5px;">27</span>
      </div>
      <div style="font-size: 14px; margin-left: auto;">5 Comments</div>
    </div>
    <div style="border-top: 1px solid #e0e0e0; margin-top: 10px; padding-top: 10px; display: flex; justify-content: space-between; font-size: 14px; color: gray;">
      <div>Like</div>
      <div>Comment</div>
      <div>Share</div>
    </div>
  </div>

  <!-- Second Comment Box -->
  <div class="unique-comment-box-GHI789 unique-float-animation2-PQR678">
    <div style="display: flex; align-items: center;">
      <img src="https://randomuser.me/api/portraits/women/1.jpg" alt="Profile Picture" style="width: 50px; height: 50px; border-radius: 50%; margin-right: 10px;">
      <div>
        <div style="font-weight: bold; font-size: 16px;">Jane Smith</div>
        <div style="color: gray; font-size: 12px;">5h ago</div>
      </div>
    </div>
    <div style="margin-top: 10px; font-size: 14px; line-height: 1.5;">
      This product has changed my life! I can't believe how effective it is. <span style="font-size: 16px;">🌟</span>
    </div>
    <div style="display: flex; align-items: center; margin-top: 10px;">
      <div style="display: flex; align-items: center; margin-right: 15px;">
        <span style="font-size: 16px;">👍</span>
        <span style="font-size: 16px; margin-left: -10px;">❤️</span>
        <span style="font-size: 16px; margin-left: -10px;">😮</span>
        <span style="font-size: 14px; margin-left: 5px;">27</span>
      </div>
      <div style="font-size: 14px; margin-left: auto;">5 Comments</div>
    </div>
    <div style="border-top: 1px solid #e0e0e0; margin-top: 10px; padding-top: 10px; display: flex; justify-content: space-between; font-size: 14px; color: gray;">
      <div>Like</div>
      <div>Comment</div>
      <div>Share</div>
    </div>
  </div>

  <!-- Third Comment Box -->
  <div class="unique-comment-box-GHI789 unique-float-animation3-STU901">
    <div style="display: flex; align-items: center;">
      <img src="https://randomuser.me/api/portraits/men/2.jpg" alt="Profile Picture" style="width: 50px; height: 50px; border-radius: 50%; margin-right: 10px;">
      <div>
        <div style="font-weight: bold; font-size: 16px;">Michael Johnson</div>
        <div style="color: gray; font-size: 12px;">5h ago</div>
      </div>
    </div>
    <div style="margin-top: 10px; font-size: 14px; line-height: 1.5;">
      Absolutely love it! It's a game changer. <span style="font-size: 16px;">🔥</span>
    </div>
    <div style="display: flex; align-items: center; margin-top: 10px;">
      <div style="display: flex; align-items: center; margin-right: 15px;">
        <span style="font-size: 16px;">👍</span>
        <span style="font-size: 16px; margin-left: -10px;">❤️</span>
        <span style="font-size: 16px; margin-left: -10px;">😮</span>
        <span style="font-size: 14px; margin-left: 5px;">27</span>
      </div>
      <div style="font-size: 14px; margin-left: auto;">5 Comments</div>
    </div>
    <div style="border-top: 1px solid #e0e0e0; margin-top: 10px; padding-top: 10px; display: flex; justify-content: space-between; font-size: 14px; color: gray;">
      <div>Like</div>
      <div>Comment</div>
      <div>Share</div>
    </div>
  </div>

  <!-- Fourth Comment Box -->
  <div class="unique-comment-box-GHI789 unique-float-animation4-VWX234">
    <div style="display: flex; align-items: center;">
      <img src="https://randomuser.me/api/portraits/women/2.jpg" alt="Profile Picture" style="width: 50px; height: 50px; border-radius: 50%; margin-right: 10px;">
      <div>
        <div style="font-weight: bold; font-size: 16px;">Emily Davis</div>
        <div style="color: gray; font-size: 12px;">5h ago</div>
      </div>
    </div>
    <div style="margin-top: 10px; font-size: 14px; line-height: 1.5;">
      Highly recommend! Great quality and performance. <span style="font-size: 16px;">👍</span>
    </div>
    <div style="display: flex; align-items: center; margin-top: 10px;">
      <div style="display: flex; align-items: center; margin-right: 15px;">
        <span style="font-size: 16px;">👍</span>
        <span style="font-size: 16px; margin-left: -10px;">❤️</span>
        <span style="font-size: 16px; margin-left: -10px;">😮</span>
        <span style="font-size: 14px; margin-left: 5px;">27</span>
      </div>
      <div style="font-size: 14px; margin-left: auto;">5 Comments</div>
    </div>
    <div style="border-top: 1px solid #e0e0e0; margin-top: 10px; padding-top: 10px; display: flex; justify-content: space-between; font-size: 14px; color: gray;">
      <div>Like</div>
      <div>Comment</div>
      <div>Share</div>
    </div>
  </div>
</div>

</body>
</html>