<!DOCTYPE html>
<html>
  <head>
    <style>
      body {
        font-family: Arial, sans-serif;
        color: #333;
        background-color: #ffffff;
        padding: 20px;
      }
      .email-container {
        max-width: 700px;
        margin: auto;
        background: #ffffff;
        border: 1px solid #e0e0e0;
        box-shadow: 0 0 10px rgba(0,0,0,0.05);
      }
      .header {
        text-align: center;
        padding: 20px;
      }
      .header img {
        max-height: 60px;
      }
      .content {
        padding: 20px;
      }
      .section {
        background-color: #fff8e6;
        border-left: 4px solid #ff8a00;
        padding: 15px;
        border-radius: 5px;
        margin: 20px 0;
      }
      .section p {
        margin: 5px 0;
      }
     .details {
        background-color: #f2f7ff;
        border: 1px solid #004aad;
        border-radius: 6px;
        padding: 15px;
        margin: 20px 0;
      }
      .details p {
        margin: 6px 0;
      }
      .footer {
        font-size: 12px;
        color: #777;
        text-align: center;
        padding: 20px;
        border-top: 2px solid #ff8a00;
        background-color: #f9f9f9;
      }
      .social-icons {
        margin: 10px 0;
      }
      .social-icons a {
        display: inline-block;
        margin: 0 6px;
      }
      .social-icons img {
        height: 24px;
        width: 24px;
        vertical-align: middle;
      }
    </style>
  </head>
  <body>
    <div class="email-container">
      <div class="header">
        {SITELOGO}
      </div>
       <div class="content">
        <h2>Hey,</h2>
        <p>Thank you for contacting us. Our team will reach out to you soon.</p>

        <div class="details">
          <p><strong>Name:</strong> {NAME}</p>
          <p><strong>Email:</strong> {EMAIL}</p>
          <p><strong>Phone:</strong> {PHONE}</p>
          <p><strong>Message:</strong></p>
          <p>{MESSAGE}</p>
        </div>

       
      </div>

      <div class="footer">
        <div class="social-icons">
          {SOCIALICONS} </div>
        <!--<p>This is an automated system email. Do not reply.</p>-->
        <p>{COPYRIGHT}</p>
      </div>
    </div>
  </body>
</html>
