Restructure the homepage code (#387)

* Restructure the homepage code

* Updated

* Update with a new line at the end of the code

index.html

@@ -7,20 +7,16 @@
 <div class="page-header header-filter" data-parallax="true"
   style="background-image: url('assets/img/header-image.webp')">
   <div class="container">
-    <div class="row">
-      <div class="col-md-12 ml-auto mr-auto">
-        <div class="title text-left">
-          <h1>St. Anthony's College</h1>
-          <p style="font-family: 'Roboto'; font-size: 20px; font-weight: 400;">
-            Since 1854
-          </p>
-        </div>
-        <a href="{{ site.baseurl }}/history" class="btn btn-primary btn-sm">OUR HISTORY</a>
-      </div>
+    <div class="title text-left">
+      <h1>St. Anthony's College</h1>
+      <p style="font-family: 'Roboto'; font-size: 20px; font-weight: 400;">
+        Since 1854
+      </p>
     </div>
+    <a href="{{ site.baseurl }}/history" class="btn btn-primary btn-sm">OUR HISTORY</a>
   </div>
 </div>
-<!-- //Header -->
+<!-- End of Header -->
 
 <!-- Resource Section -->
 <div id="resource-section">
@@ -68,10 +64,10 @@ <h4 class="card-title">Nam aliquam bibendum ullamcorper. Praesent tempor</h4>
             <button type="button" class="btn btn-class btn-sm">SEE MORE</button>
           </div>
         </div>
-        //News section -->
+        End of News section -->
 
       <!-- Quick Access section -->
-      <div class="section pt-0 ">
+      <div class="section pt-0">
         <h2 class="section-name"> Quick Access </h2>
         <div class="d-flex justify-content-center">
           <div class="row" style="width: 71rem;">
@@ -119,7 +115,7 @@ <h4 class="card-title mt-2">Google Classroom</h4>
           </div>
         </div>
       </div>
-      <!-- //Quick Access section -->
+      <!-- End of Quick Access section -->
 
       <!-- Calendar section-->
       <!--Temporary-->
@@ -143,7 +139,7 @@ <h4 class="card-title mt-2">Google Classroom</h4>
         <h2 class="section-name">What’s happening this week?</h2>
         <div id='calendar'></div>
       </div>
-      <!-- //Calendar section-->
+      <!-- End of Calendar section-->
     </div>
     <!-- Contact section-->
     <div class="contact-section">
@@ -154,7 +150,7 @@ <h2 class="section-name">
         </a>
       </h2>
     </div>
-    <!-- //Contact section-->
+    <!-- End of Contact section-->
   </div>
 </div>
-<!-- //Resource Section -->
+<!-- End of Resource Section -->