fixed bill split calculatr heading& knowmore

tools/sip.html

@@ -1104,12 +1104,25 @@ <h5>Result:</h5>
  <!-- credeit card payoff calculator ends here -->
 
  <!-- Bill split calculator -->
- <div class="page-container shadow p-5 mb-5 bg-white rounded mt-5">
+ <div class="header" style="padding-top: 100px;">
+ <h3 class="text-center mb-4">Split Bill Calculator</h3>
+ <p class="cal-content">Calculate how much each person should pay when splitting a bill, including tips. Enter the bill subtotal, desired tip percentage, and the number of people to split the bill.</p>
+ <div class="know-more">
+ <button class="know-more-btn">Know More</button>
+ <div class="know-more-content">
+ <h6 style="text-align: left; margin: 2% 16%; padding-left: 5px;">Here's how it works:</h6>
+ <ol type="1" style="font-size: 1rem; text-align: left; margin-left: 17%; margin-bottom: 2rem;">
+ <li><b>Bill Subtotal</b>: Enter the total amount of the bill before the tip.</li>
+ <li><b>Tip Percentage</b>: Specify the percentage of the bill you would like to add as a tip.</li>
+ <li><b>Number of Persons</b>: Enter the number of people who will be splitting the bill.</li>
+ </ol>
+ </div>
+ </div>
+</div>
+
+<div class="page-container shadow p-5 mb-5 bg-white rounded mt-5">
  <div class="row">
  <div class="col-md-6 offset-md-3">
- <div class="header" style="padding-top: 100px;">
- <h3 class="text-center mb-4">Split Bill Calculator</h3>
- </div>
  <form id="split-bill-calculator-form" style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
  <div class="form-group">
  <label for="billSubtotal" class="income">Bill Subtotal:</label>
@@ -1136,7 +1149,10 @@ <h5>Result:</h5>
  </div>
  </div>
 </div>
- <script src="../tools/Billsplit.js"></script>
+
+<script src="../tools/Billsplit.js"></script>
+
+
 
  <!-- Bill split calculator end -->