Separating CSS to reduce LOC in the code

Solution taken was to remove font-awesome from the header and replace everything and use bootstrap with performs better than font-awesome as said by
https://downtimemonkey.com/blog/how-we-boosted-page-load-speed.php
font awesome is slow

Admin.php

@@ -7,7 +7,6 @@ $page = "admin";
 include 'Header.php';
 ?>
 
-
 <?php
 // Only Lecturer or Admin could access this page
 if ($_SESSION['user_type'] != "Lecturer" && $_SESSION['user_type'] != "Admin") {
@@ -15,7 +14,6 @@ if ($_SESSION['user_type'] != "Lecturer" && $_SESSION['user_type'] != "Admin") {
 }
 ?>
 
-
 <style>
   .col-md-4 {
     border-right: 1px solid skyblue;
@@ -45,7 +43,9 @@ if ($_SESSION['user_type'] != "Lecturer" && $_SESSION['user_type'] != "Admin") {
         <hr> " ;
         echo    "<b>TA Accounts </b><br>" ;
       }
+
   else if($_SESSION['user_type'] == "Admin"){
+         
         echo " <h4> Lecturer Account Management </h4> 
         <hr> ";
         echo "<b>Lecturer Accounts </b><br>";
@@ -83,19 +83,21 @@ if ($_SESSION['user_type'] != "Lecturer" && $_SESSION['user_type'] != "Admin") {
             echo "<b>Create TA Accounts </b>";
              
           }
+
         else if($_SESSION['user_type'] == "Admin"){
+              
            echo "<b>Create Lecturer Accounts </b>";
           }
     
       ?>
           <form method="post" action="Script.php" id="create_account_form">
             <input type="hidden" name="frm_createlecturrer" value="true" required="" />
-            Full Name
+            Full_Name
             <input type="text" name="fullname" placeholder="Full Name" class="form-control" required="">
             Email
             <input type="text" name="email" placeholder="Email / Student Number" class="form-control" required="">
 
-            Passport Number / ID (Used as Initial Password)
+            Passport_Number / ID (Used as Initial Password)
             <input type="text" class="form-control" name="passport" placeholder="Passport No./ID" required="">
             <br> User Type :
 
@@ -106,6 +108,7 @@ if ($_SESSION['user_type'] != "Lecturer" && $_SESSION['user_type'] != "Admin") {
                     echo ' <input type="radio" name="type" value="TA" required="" id="role_TA"> TA (Teaching Assistant) ';
 
                 }
+
               else if($_SESSION['user_type'] == "Admin"){
                     
                     echo " <input type='radio' name = 'type' value = 'Lecturer' required = '' id='role_lecturer' > Lecturer ";
@@ -158,6 +161,7 @@ if ($_SESSION['user_type'] != "Lecturer" && $_SESSION['user_type'] != "Admin") {
             }
 
           else if($_SESSION['user_type'] == "Admin"){
+                
                 $result = mysqli_query(
                   $con,
                   "SELECT * FROM Users_Table  WHERE UserType in ('Lecturer')"

Course.php

@@ -57,9 +57,9 @@ if(!empty($_GET["url"]))
     
 <?php
     
-if (isset($_SESSION['info_general'])) {
-    echo '<hr><div class="alert alert-info" role="alert" style="float:left;">' . $_SESSION['info_general'] . '</div>';
-    $_SESSION['info_general']=null;
+if (isset($_SESSION['info_ReMarking'])) {
+    echo '<hr><div class="alert alert-info" role="alert" style="float:left;">' . $_SESSION['info_ReMarking'] . '</div>';
+    $_SESSION['info_ReMarking']=null;
 }
    
 if (isset($_SESSION['info_courses'])) {
@@ -280,7 +280,7 @@ Lab_Report_ID not in (select Lab_Report_ID from lab_report_submissions where (St
             $id = $row['Lab_Report_ID'];
             if( $c_date < $deadline)
             {
-                $submittedx="<a  href='~\..\SubmitLab.php?id=$id&url=$url' class='btn-sm btn-default'><i class='fa fa-check-circle'></i> Re-Submit </a>";
+                $submittedx="<a  href='~\..\SubmitLab.php?id=$id&url=$url' class='btn-sm btn-default'><i class='bi bi-check-circle-fill'></i> Re-Submit </a>";
             }
             
             $full_link = "<a href='~\..\Lab_Report_Assignments\\$att1'>$att1</a>";
@@ -298,7 +298,7 @@ Lab_Report_ID not in (select Lab_Report_ID from lab_report_submissions where (St
    
             echo "   <k href='#'>   <div class='btn btn-default break-word' style='dislay:block; word-wrap: break-word; border: 1px solid #F0F0F0;border-left: 4px solid #03407B;'>
   $title <br> <span style='font-size:8pt'> $ins</span> 
-   <br> <span style='font-size:8pt'>Posted : $posted  Deadline :   $deadline  ($marks Marks) &nbsp; &nbsp;  $submittedx&nbsp; <span class='btn-sm btn-success' style='margin-left:50px;'><i class='fa fa-Edit-circle'></i>  Submitted </span>
+   <br> <span style='font-size:8pt'>Posted : $posted  Deadline :   $deadline  ($marks Marks) &nbsp; &nbsp;  $submittedx&nbsp; <span class='btn-sm btn-success' style='margin-left:50px;'><i class='bi bi-check-lg'></i>  Submitted </span>
 <br> Submitted files: ";
 
 
@@ -426,7 +426,7 @@ where Lab_Report_ID=$lab_repo_id and (lab_report_submissions.Student_id='$studen
             }
             if($status=='Remarking')
             {
-                $remarking="<span  style='color:orange'><i class='fa fa-info-circle'></i> Remarking Request sent </span> <br> Remarking Reason:<i>$remarking_reason </i> <br>";
+                $remarking="<span  style='color:orange'><i class='bi bi-info-circle-fill'></i> Remarking Request sent </span> <br> Remarking Reason:<i>$remarking_reason </i> <br>";
                               
             }
                               
@@ -529,37 +529,21 @@ course_groups_table.Course_Group_id=course_group_members_table.Course_Group_id W
                 $extra3="   <a href='#' class='' onclick='accept($id,0)'>Decline</a></small>"; 
                                 
             }
-
-            # Add "delete group" button and allow only group creator to delete it
-            $extra4 = "<button onclick='delete_group($id)' class='btn btn-danger' style='height: 25px; width: 90px; 
-                        line-height: 10px; font-size: 10px'>DELETE GROUP</button>";
-
-            echo "<div  class='btn-default'><small> $name ($status)  $extra  $extra2  $extra3" . 
-            (($status == "Created")? "$extra4": "")
-            ."</small></div>";
+            echo "<div  class='btn-default'><small> $name ($status)  $extra  $extra2  $extra3</small></div>";
                         
             $rs2=mysqli_query($con,"SELECT `ID`, `Course_Group_id`, course_group_members_table.Student_ID, 
                             course_group_members_table.`Status`,users_table.Full_Name FROM `course_group_members_table` 
 INNER JOIN users_table on users_table.Student_ID=course_group_members_table.Student_ID
 where course_group_members_table.Course_Group_id=$id");
-            
-            #Check whether the current user in session is the creator of the group
-            $rs3 = mysqli_query($con, "SELECT `Status` from course_group_members_table where Student_ID = $student_id");
-            $flag = mysqli_fetch_assoc($rs3)['Status'] == "Created";
-
+                        
             while($row = mysqli_fetch_assoc($rs2)) {
                 $name=$row['Full_Name'];
                 $id=$row['Course_Group_id'];
                 $status=$row['Status'];
                 $Student_ID=$row['Student_ID'];
                         
-                #Show group members + remove button next to each member except the creator of the group
-                if($flag){
-                    echo "<li><small> $name-$Student_ID ($status)</small>".(($status != "Created")?"<button onclick='remove_member($Student_ID, $id)' 
-                class='btn btn-danger' style='height: 25px; width: 80px; line-height: 10px;'>remove</button>":"")."</li>";
-                }else{
-                    echo "<li><small> $name-$Student_ID ($status)</small>";
-                } 
+                        
+                echo "<li><small> $name-$Student_ID ($status)</small></li>";
                         
             }
                         
@@ -586,7 +570,7 @@ where course_group_members_table.Course_Group_id=$id");
 
 <?php
 }
-include 'Footer.php';
+include 'Footer.html';
 ?>
 
 
@@ -704,62 +688,5 @@ function remarking(data)
     window.location.href = data+"&details="+details;
 }
   
-function remove_member(student_id, group_id) {
-    
-    try
-    {
-        
-
-        $('<form id="frm" method="get" action="Script.php"><input type="hidden" name="removemember" value="true">\n\
- <input type="hidden" name="student_id" value="'+student_id+'" > \n\
- <input type="hidden" name="group_id" value="'+group_id+'">\n\
-<input type="hidden" name="url" value="<?php echo $url; ?>"></form>').dialog({
-    modal: true,
-    title:'Remove '+student_id+'?',
-    buttons: {
-        'Confirm': function () {
-            $('#frm').submit();
-	    
-            $(this).dialog('close');
-        },
-        'X': function () {
-	    
-            $(this).dialog('close');
-        }
-	
-    }
-});
-
-    } catch(e){ alert(e); }
-}
-
-function delete_group(id) {
-    
-    try
-    {
-        
-
-        $('<form id="frm" method="get" action="Script.php"><input type="hidden" name="deletegroup" value="true">\n\
- <input type="hidden" name="group_id" value="'+id+'" > \n\
-<input type="hidden" name="url" value="<?php echo $url; ?>"></form>').dialog({
-    modal: true,
-    title:'Delete this group?',
-    buttons: {
-        'Confirm': function () {
-            $('#frm').submit();
-	    
-            $(this).dialog('close');
-        },
-        'X': function () {
-	    
-            $(this).dialog('close');
-        }
-	
-    }
-});
-
-    } catch(e){ alert(e); }
-}
-
 </script>
     

Courses.php

@@ -1,36 +1,18 @@
 <?php
 include 'NoDirectPhpAcess.php';
+require 'Header.php';
 ?>
 
 
 <?php
-
-
 $page='Courses';
-include 'Header.php';
 
 $user_d = $_SESSION['user_id'];
 
 if( $_SESSION['user_type']=="Lecturer" || $_SESSION['user_type']=="TA")
 {
-    ?>
-
-
-
-    <!--    FOR LECTURER-->
-
-
-        <div class="row" style="width:80%;margin:auto; text-align:left;">
-   
-
-    <script src="./css/jquery-1.11.1.min.js"></script>
-    <script src="./css/jquery-ui.min.js"></script>
-    <link rel="stylesheet" href="./css/jquery-ui.css" />
-
-
+?>
     <script>
-    
-
     function extend_deadline(id) {
     
         var dropstudents=$("#dropstudents").html();
@@ -154,7 +136,7 @@ New Date/Time <br><input type="date" name="date" required=""> <input type="time"
                     <input type='hidden' name='url' value='<?php echo ".$course_url." ?>' required=''/>
            
                     Deadline Date/Time
-                        <div class='row'> 
+                        Title <div class='row'>
                     <div class='col-md-7'><input type='date' id='date' name='deadlinedate' placeholder='' class='form-control' required='' value="<?php echo isset($_GET['act']) && $_GET['act']=="edit" ? $Date : ""; ?>"> </div>
                     <div class='col-md-5'> <input type='text' id='time' class='form-control' name='deadlinetime' value="<?php echo isset($_GET['act']) && $_GET['act']=="edit" ? $Time : ""; ?>"> </div> 
                     </div>
@@ -183,7 +165,7 @@ New Date/Time <br><input type="date" name="date" required=""> <input type="time"
                     if ($Type == "Individual") {
                         echo "Submission Type  <input type='radio' name='type' value='Individual' checked /> Individual  <input type='radio' name='type' value='Group' /> Group";
                     } else {
-                        echo "Submission Type  <input type='radio' name='type' value='Individual' /> Individual  <input type='radio' name='type' value='Group' checked> Group";
+                        echo "Submission Type  <input type='radio' name='type' value='Individual' /> Invidual  <input type='radio' name='type' value='Group' checked> Group";
                     }		 
                     ?>
 
@@ -213,14 +195,14 @@ New Date/Time <br><input type="date" name="date" required=""> <input type="time"
                     <input type='hidden' name='course_id' value='<?php echo "$id" ?>' required=''/>
                     <input type='hidden' name='url' value='<?php echo ".$course_url." ?>' required=''/>
                      
-                    Deadline Date/Time
+                    Dealine Date/Time
                         <div class='row'> 
                     <div class='col-md-7'><input type='date' id='date' name='deadlinedate' placeholder='' class='form-control' required='' value=""> </div>
                     <div class='col-md-5'> <input type='time' class='form-control' name='deadlinetime' value=""> </div> 
                     </div>
 
                     Title
-                        <input type='text'  name='title' placeholder='Title' class='form-control' required='' value="">
+                        <input type='text'  name='title' placeholder='Ttle' class='form-control' required='' value="">
                     Instructions
                         <textarea  name='instructions' placeholder='Assignment Instructions' class='form-control' required='' value=""></textarea>
                     Marks
@@ -238,7 +220,7 @@ New Date/Time <br><input type="date" name="date" required=""> <input type="time"
                     Attachment 4
                         <input type='file'  name='attachment4' placeholder='Attachment 4' class='form-control' >
                     <br>
-                    Submission Type  <input type='radio' name='type' value='Individual' required=''> Individual
+                    Submission Type  <input type='radio' name='type' value='Individual' required=''> Invidual
 
                                                 <input type='radio' name='type' value='Group' required=''> Group
                     <hr>
@@ -441,7 +423,7 @@ WHERE  Lecturer_User_ID=$lecturer_id and course_students_table.Status='Pending'"
     if(mysqli_num_rows($result)==0)
     {
      
-        echo "<br>  <i class='fa fa-info-circle'></i> No Course joining request so far for all your courses <hr>";
+        echo "<br>  <i class='bi bi-info-circle-fill'></i> No Course joining request so far for all your courses <hr>";
     } else { while($row = mysqli_fetch_assoc($result)) {
             $id=$row['ID'];	
         		
@@ -599,7 +581,7 @@ if( $_SESSION['user_type']=="Student")
                 $msg2="Join Course";
                 if($v>0)
                 {
-                    $msg="<i class='fa fa-exclamation-circle'></i> Lecturer verification required";
+                    $msg="<i class='bi bi-exclamation-circle-fill'></i> Lecturer verification required";
                     $msg2="Send Joining Request";
                 }
                
@@ -622,7 +604,7 @@ INNER JOIN course_students_table on course_students_table.Course_ID=courses_tabl
  
     if(mysqli_num_rows($result)==0)
     {
-        echo "<i class='fa fa-exclamation-circle'></i> You are not Enrolled in any Course";
+        echo "<i class='bi bi-exclamation-circle-fill'></i> You are not Enrolled in any Course";
     } else {
         while($row = mysqli_fetch_assoc($result)) {
 			$name=$row['Course_Name'];
@@ -637,7 +619,7 @@ INNER JOIN course_students_table on course_students_table.Course_ID=courses_tabl
             if($Status=="Joined")
             {
 	         echo "<a href='~\..\Course.php?url=$url'>   <div class='btn btn-default' style='word-wrap:break-word'>
-  ($code) - $name <br>($url)       &nbsp;&nbsp;&nbsp; <i class='fa fa-check-circle'></i> $Status   &nbsp;&nbsp;&nbsp;&nbsp; <a href='~\..\Course.php?url=$url' class='btn-sm btn-primary'> Open</a>
+  ($code) - $name <br>($url)       &nbsp;&nbsp;&nbsp; <i class='bi bi-check-circle-fill'></i> $Status   &nbsp;&nbsp;&nbsp;&nbsp; <a href='~\..\Course.php?url=$url' class='btn-sm btn-primary'> Open</a>
    <br> <span style='font-size:8pt'>Faculty : $faculty  Year :   $academic  Lecturer  :$lecturer </span></div></a>
                         ";  
             }

Footer.html

@@ -0,0 +1,3 @@
+<div id="footer">
+    LRR was originally developed as a <a href="http://lanlab.org/course/2018f/se/homepage.html" style="color:white;">software engineering course project</a> by Mohamed Nor and Elmahdi Houzi. Please submit your suggestions or bug reports to lanhui. Last updated on 18/04/2020 by Ashly. <a href="./homepage" style="color:white;">More information ...</a>
+</div>

Footer.php

@@ -1,4 +0,0 @@
-<br><br><br><br><br><br><br><br><br>
-<div style="background-color:white;width:100%di">
-
-</div>

Header.php

@@ -4,7 +4,7 @@ error_reporting(0);
 date_default_timezone_set('Asia/Shanghai');
 
 include "get_mysql_credentials.php";
-$con = mysqli_connect("localhost", $mysql_username, $mysql_password, "lrr");
+$con = mysqli_connect("localhost", "root", "", "lrr");
 
 // Check database connection
 if (mysqli_connect_errno()) {
@@ -19,16 +19,13 @@ if (mysqli_connect_errno()) {
 
 <head>
 
-  <link href="./css/bootstrap.min.css" rel="stylesheet" type="text/css" />
-  <link href="./font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
-  <link href="./css/bootstrap.min.css" rel="stylesheet" type="text/css" />
-  <!-- *this css file can be used across all the websites 
-  and any new css class can be added there.
-  * The reason is to make the css code reusable.
-  * the css file is used by submissions.php
--->
-  <link href = "./css/main.css" rel = "stylesheet" type = "text/css" />
-
+  <link href="./css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
+    <link href=" https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"/>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">
+   <link href = "./css/main.css" rel = "stylesheet" type = "text/css" />
+    <script src="./css/jquery-1.11.1.min.js"></script>
+    <script src="./css/jquery-ui.min.js"></script>
+    <link rel="stylesheet" href="./css/jquery-ui.css"/>
   <script src="./css/jquery.min.js" type="text/javascript"></script>
   <script src="./css/bootsrap.min.js" type="text/javascript"></script>
   <script src="./css/jquery.datetimepicker.min.js" type="text/javascript"></script>
@@ -37,8 +34,10 @@ if (mysqli_connect_errno()) {
 
 <body>
 
-  <nav class="navbar navbar-expand-lg navbar-dark bg-dark" style="padding-left:150px;padding-right:150px;margin:auto;">
-    <a class="navbar-brand" href="~\..\index.php"> <img src="logo.png" style="width:30px;height:30px;"> LRR </a>
+  <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+      <a class="navbar-brand" href="#">
+          <label>LRR</label>
+        <img src="logo.png" class = "navlogoimage"style="width:30px;height:30px; padding-left: 6px" alt="LRR Logo"> </a>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor02" aria-controls="navbarColor02" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
     </button>
@@ -53,7 +52,7 @@ if (mysqli_connect_errno()) {
         <?php
         if (isset($_SESSION["user_fullname"])) {
 
-          echo "       <a class='nav-link' href='~\..\Courses.php'><i class='fa fa-book'></i> Courses <span class='sr-only'>(current)</span></a>";
+          echo "       <a class='nav-link' href='~\..\Courses.php'><i class='bi bi-book-fill'></i> Courses <span class='sr-only'>(current)</span></a>";
         ?>
           </li>
       </ul>
@@ -70,13 +69,13 @@ if (mysqli_connect_errno()) {
 
         <?php
           if ($_SESSION['user_type'] == "Lecturer") {
-            echo  "&nbsp;&nbsp;&nbsp;  <i class=\"fa fa-cog\" style=\"color:#fff;\"> </i> &nbsp;<a style='color:#fff !important' href=\"~\..\Admin.php\" id=\"admin_tab\">Admin </a>";
+            echo  "&nbsp;&nbsp;&nbsp;  <i class=\"bi bi-gear-fill\" style=\"color:#fff;\"> </i> &nbsp;<a style='color:#fff !important' href=\"~\..\Admin.php\" id=\"admin_tab\">Admin </a>";
           }
         ?>
 
-        &nbsp;&nbsp;&nbsp; <i class="fa fa-user" style="color:#fff;"> </i>
+        &nbsp;&nbsp;&nbsp; <i class="bi bi-person-fill" style="color:#fff;"> </i>
         &nbsp;<a href="#" style='color:#fff !important' onclick="updatePass(<?php echo $_SESSION['user_id']; ?>)">Update password</a>
-        &nbsp;&nbsp;&nbsp; <i class="fa fa-lock" style="color:#fff;"> </i> &nbsp;<a style='color:#fff !important' href="~\..\logout.php">Logout </a>
+        &nbsp;&nbsp;&nbsp; <i class="bi bi-lock-fill" style="color:#fff;"> </i> &nbsp;<a style='color:#fff !important' href="~\..\logout.php">Logout </a>
 
       <?php
         }
@@ -85,76 +84,7 @@ if (mysqli_connect_errno()) {
     </div>
   </nav>
 
-  <style>
-    .nav-item {
-      border-color: #00ff66;
-    }
 
-    .nav-tabs {
-      border-color: #00ff66;
-    }
-
-    .btn-default {
-      border: 2px solid #00ff66;
-      width: 100%;
-      text-align: left;
-      margin: 3px auto;
-      font-weight: bold;
-      font-size: 13pt;
-    }
-
-    .table-bordered {
-      padding: 5px !important;
-    }
-
-    .alert {
-      font-weight: bold;
-    }
-
-    h1,
-    h2,
-    h3,
-    h4 {
-      color: #03407B;
-    }
-
-    a {
-      color: #03407B;
-    }
-
-    .break-word {
-      word-wrap: break-word;
-      white-space: -moz-pre-wrap !important;
-      /* Mozilla, since 1999 */
-      white-space: -pre-wrap;
-      /* Opera 4-6 */
-      white-space: -o-pre-wrap;
-      /* Opera 7 */
-      white-space: pre-wrap;
-      /* css-3 */
-      word-wrap: break-word;
-      /* Internet Explorer 5.5+ */
-      white-space: -webkit-pre-wrap;
-      /* Newer versions of Chrome/Safari*/
-      word-break: break-all;
-      white-space: normal;
-    }
-
-    .ui-widget-content.ui-dialog {
-      border: 2px solid #03488B;
-
-    }
-
-    .ui-dialog>.ui-widget-header {
-      background: #03488B;
-      color: white
-    }
-
-    .ui-button {
-      background: #03488B;
-      color: white
-    }
-  </style>
 
   <script>
     function updatePass(id) {

README.md

@@ -18,17 +18,15 @@ Our mission is to make the experience of submitting assignments great for tens o
 # Installation Instructions
 
 
-## Hui steps
+## Hui's steps
 
 I spent about two hours installing LRR to a bare, remote Ubuntu server (Ubuntu 20.04 LTS).
 
-LRR needs Apache and MySQL to run.  I followed [How To Install Linux, Apache, MySQL, PHP (LAMP) stack on Ubuntu 20.04](https://www.digitalocean.com/community/tutorials/how-to-install-linux-apache-mysql-php-lamp-stack-on-ubuntu-20-04) to set up these server applications.  [How to install and configure PHP](https://ubuntu.com/server/docs/programming-php) is also a good guide.
+LRR needs Apache and MySQL to run.  I followed [How To Install Linux, Apache, MySQL, PHP (LAMP) stack on Ubuntu 20.04](https://www.digitalocean.com/community/tutorials/how-to-install-linux-apache-mysql-php-lamp-stack-on-ubuntu-20-04) to set up these server applications.
 
-LRR uses a database called `lrr`.  So create this database using MySQL root account.  Open MySQL's prompt using `sudo mysql`.  Create the database using command `CREATE DATABASE lrr;`, and grant all privileges to MySQL user `lrr` using command `GRANT ALL PRIVILEGES ON lrr.* TO 'mnc'@'localhost' WITH GRANT OPTION;`.   If MySQL user mnc does not exist, create it using command `CREATE USER 'mnc'@'localhost' IDENTIFIED BY 'password'`.
-
-To facilitate data migration, I need to export the existing `lrr` to a plain text file (including many sql commands) and import that text file to the newly created `lrr` database on the new server.
-The command for exporting the database is `mysqldump -u mnc -p lrr > lrr_database_dump.txt`, where mnc after -u is MySQL's username, and lrr after -p is the database name.
-The command for importing is `mysql -u mnc -p lrr < lrr_database_dump.txt`.  Read [How to Import and Export MySQL Databases in Linux](https://phoenixnap.com/kb/import-and-export-mysql-database) for more detail. Do not have lrr_database_dump.txt?  You can use lrr_database.sql in this repo instead.
+LRR uses a database called `lrr`.  I need to export the existing `lrr` to a plain text file (including many sql commands) and import that text file to the newly created `lrr` database on the new server.
+The command for exporting the database is `mysqldump -u mnc -p lrr > lrr_database_dump.txt`.
+The command for importing is `mysql -u mnc -p lrr < lrr_database_dump.txt`.  Read [How to Import and Export MySQL Databases in Linux](https://phoenixnap.com/kb/import-and-export-mysql-database) for more detail.
 
 LRR also needs to store assignment submissions.  We store them in a folder called `../../lrr_submission`.  Note that `lrr_submission` is two levels above the project folder (where many PHP files reside).  I copied this folder from the existing one.  I think it is also OK if you create an empty folder.   
 We need to set a proper owner and accessibility for `lrr_submission` using the following two commands:
@@ -51,7 +49,7 @@ Enable the site lrr: `sudo a2ensite lrr`.  Restart the apache server: `sudo syst
 Visit the LRR application by entering this URL in a web browser: http://121.4.94.30/.
 
 
-## Enock steps
+## Enock's steps
 
 Enock, a graduate student here, has made a tutorial about how he deployed LRR to a remote server (http://lanlab.org/course/2021s/spm/PuTTY-Server.txt).
 

Script.php

@@ -57,14 +57,14 @@ if (!empty($_POST["form_signup"])) {
 
     $student_result = mysqli_query($con, "SELECT * FROM `users_table` WHERE Student_ID='$student_id'");
     if (mysqli_num_rows($student_result) > 0) {
-        $_SESSION["info_signup"] = "This Student ID is already in use! Please contact Student Management Office <lanhui at zjnu.edu.cn> for help.";
+        $_SESSION["info_signup"] = "This Student ID is already in use! Please contact Student Management Office <lanhui at zjnu.edu.cn> for help.";        
         header("Location: signup.php");
         return;
     }
 }
 
 // ############################### CREATE STUDENT USER ##################################
-if (!empty($_POST["form_signup"])) {
+if (!empty($_POST["form_signup"])) {    
     $fullname = mysqli_real_escape_string($con, $_POST["fullname"]);
     $student_id = mysqli_real_escape_string($con, $_POST["user_student_id"]);
     $email = mysqli_real_escape_string($con, $_POST["email"]);
@@ -105,8 +105,9 @@ if (!empty($_POST["form_signup"])) {
 
     // check if email is taken
     $result = mysqli_query($con, "SELECT * FROM users_table WHERE email='$email'");
-    if (mysqli_num_rows($result) != 0) {
-        $_SESSION["info_signup"] = "Email address " . $email . "  is already in use.";
+    if(mysqli_num_rows($result) != 0)
+    {
+        $_SESSION["info_signup"]="Email address ".$email."  is already in use.";
         $_SESSION['user_fullname'] = null;
         header("Location: signup.php");
         return;
@@ -195,6 +196,7 @@ if (!empty($_POST["frm_recover_password"])) {
     // validate student number
     if (strlen($student_id) != 12  || is_numeric($student_id) == FALSE) {
         $_SESSION["info_recover_password"] = "Invalid student number.";
+        #echo "Invalid student number.";
         header("Location: recover_password.php");
         return;
     }
@@ -270,20 +272,18 @@ if (!empty($_POST["frm_createlecturrer"])) {
     $type = mysqli_real_escape_string($con, $_POST["type"]);
     $password = mysqli_real_escape_string($con, $_POST["passport"]);
     // check if email is taken
-    $result = mysqli_query(
-        $con,
-        "SELECT * FROM Users_Table WHERE email='$email'"
-    );
-    if (mysqli_num_rows($result) != 0) {
-        $_SESSION["info_Admin_Users"] = "Email address : " . $email . " is already in use.";
-        header("Location: Admin.php");
+    $result = mysqli_query($con,
+                           "SELECT * FROM Users_Table WHERE email='$email'");
+    if(mysqli_num_rows($result)!=0)
+    {
+        $_SESSION["info_Admin_Users"]="Email address : ".$email." is already in use.";
+        header("Location: Admin.php");        
     }
-    $password_hash = password_hash("$password", PASSWORD_DEFAULT);
-    $sql = "INSERT INTO `users_table`(`Email`, `Password`, `Full_Name`, `UserType`) VALUES "
-        . "('$email','$password_hash','$fullname','$type')";
+    $sql= "INSERT INTO `users_table`(`Email`, `Password`, `Full_Name`, `UserType`) VALUES "
+        . "('$email','$password','$fullname','$type')";
 
     if ($con->query($sql) === TRUE) {
-        $_SESSION["info_Admin_Users"] = $type . " user created successfully. Use email " . $email . " as account name and $password as password.";
+        $_SESSION["info_Admin_Users"] = $type . " user created successfully. Use email " . $email . " as accout name and $password as password.";
         header("Location: Admin.php");
     } else {
         echo "Error: " . $sql . "<br>" . $con->error;
@@ -692,7 +692,7 @@ if (!empty($_GET["remarking"])) {
 
     if ($con->query($sql) === TRUE) {
 
-        $_SESSION["info_general"] = "Remarking Request Sent";
+        $_SESSION["info_ReMarking"] = "Remarking Request Sent";
         header("Location: Course.php?url=" . $url);
     } else {
         echo "Error: " . $sql . "<br>" . $con->error;
@@ -721,7 +721,7 @@ if (!empty($_GET["creategroup"])) {
         $sql = "INSERT INTO `course_group_members_table`( `Course_Group_id`, `Student_ID`, `Status`) 
                           VALUES ('$gid','$student_id','Created')";
         if ($con->query($sql) === TRUE) {
-            $_SESSION["info_general"] = "Course group Created";
+            $_SESSION["info_ReMarking"] = "Course group Created";
             header("Location: Course.php?url=" . $url);
         } else {
             echo "Error: " . $sql . "<br>" . $con->error;
@@ -739,21 +739,14 @@ if (!empty($_GET["groupinvite"])) {
     $url = mysqli_real_escape_string($con, $_GET["url"]);
     $courseid = mysqli_real_escape_string($con, $_GET["courseid"]);
     $groupid = mysqli_real_escape_string($con, $_GET["groupid"]);
-    $student = mysqli_query($con, "SELECT * FROM students_data WHERE Student_ID = '$student_id'  ");
 
-    if (mysqli_num_rows($student) > 0) {
-
-        $result = mysqli_query($con, "SELECT * FROM course_group_members_table where Course_Group_id = '$groupid' and Student_ID = '$student_id'");
-        if (mysqli_num_rows($result) > 0) {
-            $_SESSION["info_general"] = $student_id . " has already been invited.";
-            header("Location: Course.php?url=" . $url);
-        } else {
-            $sql = "INSERT INTO `course_group_members_table`( `Course_Group_id`, `Student_ID`, `Status`)
-                        VALUES ('$groupid','$student_id','Invited')";
-        }
-    } else {
-        $_SESSION["info_general"] = $student_id . " is an invalid student number.";
+    $result = mysqli_query($con, "SELECT * FROM course_group_members_table where Course_Group_id = '$groupid' and Student_ID = '$student_id'");
+    if (mysqli_num_rows($result) > 0) {
+        $_SESSION["info_ReMarking"] = $student_id . " has already been invited";
         header("Location: Course.php?url=" . $url);
+    } else {
+        $sql = "INSERT INTO `course_group_members_table`( `Course_Group_id`, `Student_ID`, `Status`)
+                      VALUES ('$groupid','$student_id','Invited')";
     }
 
     if ($con->query($sql) === TRUE) {
@@ -771,26 +764,26 @@ if (!empty($_GET["groupinvite"])) {
 
             if ($Group_Member == '0') {
                 mysqli_query($con, "UPDATE `course_groups_table` SET `Group_Member` = ('" . $student_id . "') WHERE `course_groups_table`.`Course_Group_id` = '$groupid'");
-                $_SESSION["info_general"] = $student_id . " was invited to the group.";
+                $_SESSION["info_ReMarking"] = $student_id . " was invited to the group";
                 header("Location: Course.php?url=" . $url);
             } elseif ($Group_Member2 == '0') {
                 mysqli_query($con, "UPDATE `course_groups_table` SET `Group_Member2` = ('" . $student_id . "') WHERE `course_groups_table`.`Course_Group_id` = '$groupid'");
-                $_SESSION["info_general"] = $student_id . " was invited to the group.";
+                $_SESSION["info_ReMarking"] = $student_id . " was invited to the group";
                 header("Location: Course.php?url=" . $url);
             } elseif ($Group_Member3 == '0') {
                 mysqli_query($con, "UPDATE `course_groups_table` SET `Group_Member3` = ('" . $student_id . "') WHERE `course_groups_table`.`Course_Group_id` = '$groupid'");
-                $_SESSION["info_general"] = $student_id . " was invited to the group.";
+                $_SESSION["info_ReMarking"] = $student_id . " was invited to the group";
                 header("Location: Course.php?url=" . $url);
             } elseif ($Group_Member4 == '0') {
                 mysqli_query($con, "UPDATE `course_groups_table` SET `Group_Member4` = ('" . $student_id . "') WHERE `course_groups_table`.`Course_Group_id` = '$groupid'");
-                $_SESSION["info_general"] = $student_id . " was invited to the group.";
+                $_SESSION["info_ReMarking"] = $student_id . " was invited to the group";
                 header("Location: Course.php?url=" . $url);
             } else {
-                $_SESSION["info_general"] = " You cannot add any more members";
+                $_SESSION["info_ReMarking"] = " You cant add any more members";
                 header("Location: Course.php?url=" . $url);
             }
         }
-        $_SESSION["info_general"] = $student_id . " was invited to the group.";
+        $_SESSION["info_ReMarking"] = $student_id . " was invited to the group";
         header("Location: Course.php?url=" . $url);
     } else {
         echo "Error: " . $sql . "<br>" . $con->error;
@@ -815,43 +808,7 @@ if (!empty($_GET["acceptinvite"])) {
     }
 
     if ($con->query($sql) === TRUE) {
-        $_SESSION["info_general"] = " Group Invite Updated";
-        header("Location: Course.php?url=" . $url);
-    } else {
-        echo "Error: " . $sql . "<br>" . $con->error;
-    }
-}
-
-#Remove a member from group
-
-if (!empty($_GET["removemember"])) {
-
-    $student_id = mysqli_real_escape_string($con, $_GET["student_id"]);
-    $group_id = mysqli_real_escape_string($con, $_GET["group_id"]);
-    $url = mysqli_real_escape_string($con, $_GET["url"]);
-
-    $sql = "Delete from  `course_group_members_table`  where  student_id=$student_id and Course_Group_id=$group_id";
-
-    if ($con->query($sql) === TRUE) {
-        $_SESSION["info_general"] = " Member " . $student_id . " removed from the group";
-        header("Location: Course.php?url=" . $url);
-    } else {
-        echo "Error: " . $sql . "<br>" . $con->error;
-    }
-}
-
-#Delete a whole group
-
-if (!empty($_GET["deletegroup"])) {
-
-    $group_id = mysqli_real_escape_string($con, $_GET["group_id"]);
-    $url = mysqli_real_escape_string($con, $_GET["url"]);
-
-    $sql1 = "Delete from  `course_group_members_table`  where  Course_Group_id=$group_id";
-    $sql2 = "Delete from `course_groups_table` where Course_Group_id=$group_id";
-
-    if ($con->query($sql1) === TRUE && $con->query($sql2) === TRUE) {
-        $_SESSION["info_general"] = " Group has been deleted successfully. ";
+        $_SESSION["info_ReMarking"] = " Group Invite Updated";
         header("Location: Course.php?url=" . $url);
     } else {
         echo "Error: " . $sql . "<br>" . $con->error;

Student.php

@@ -9,7 +9,7 @@ include 'Header.php';
 <div class="row" style="width:80%;margin:auto;">
 
     <div class="col-md-6">
-        <h1> Student Account Created. Now you can Browse Course Portals </h1>
+        <h1> STUDENT Account Created , Now you can Browse Course Portals </h1>
     </div>
 
 </div>

Submissions.php

@@ -220,7 +220,7 @@ where Lab_Report_ID=$id and lab_report_submissions.Status='Marked'  Order by lab
                         echo "No Marked submissions for this lab";
                     } else {
 
-                        echo "<h3><a href='~\..\Script.php?exportgrade=true&lab=$id&lab_name=$Report_Title'><i class='fa fa-book'></i> Export Grade Sheet </a></h3>";
+                        echo "<h3><a href='~\..\Script.php?exportgrade=true&lab=$id&lab_name=$Report_Title'><i class='bi bi-book-fill'></i> Export Grade Sheet </a></h3>";
 
                         while ($row = mysqli_fetch_assoc($result)) {
                             $title = $row['Title'];
@@ -409,7 +409,7 @@ where course_group_members_table.Course_Group_id=$id");
 
 <?php
     }
-    include 'Footer.php';
+    include 'Footer.html';
 ?>
 
 <script src="http://118.25.96.118/nor/css/jquery-1.11.1.min.js"></script>

css/main.css

@@ -8,4 +8,165 @@
     user-select: text;
     cursor:auto
   
-   }
+   }
+
+/* This is the CSS for the Header. */
+
+.navbar navbar-expand-lg navbar-dark bg-dark{
+    padding-left:150px;
+    padding-right:150px;
+    margin:auto;
+}
+navlogoimage {
+    max-width:100%;
+    height: auto;
+    position:relative;
+    right:-95px;
+    top:1px;
+}
+
+ .nav-item {
+     border-color: #00ff66;
+ }
+
+.nav-tabs {
+    border-color: #00ff66;
+}
+
+.btn-default {
+    border: 2px solid #00ff66;
+    width: 100%;
+    text-align: left;
+    margin: 3px auto;
+    font-weight: bold;
+    font-size: 13pt;
+}
+
+.table-bordered {
+    padding: 5px !important;
+}
+
+.alert {
+    font-weight: bold;
+}
+
+h1,
+h2,
+h3,
+h4 {
+    color: #03407B;
+    font-weight:normal;
+    font-family: Poppins-Regular,serif;
+}
+
+a {
+    color: #03407B;
+}
+
+.break-word {
+    word-wrap: break-word;
+
+    /*CSS property sets how white space inside an element is handled.*/
+     white-space: pre-wrap;
+    word-break: break-all;
+}
+
+.ui-widget-content.ui-dialog {
+    border: 2px solid #03488B;
+
+}
+
+.ui-dialog>.ui-widget-header {
+    background: #03488B;
+    color: white
+}
+
+.ui-button {
+    background: #03488B;
+    color: white
+}
+
+.btn-primary {
+    color: white;
+    border-radius: 5px;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+    background: #04519b;
+    padding:5px 100px;
+    font-family: Poppins-Regular, serif;;
+    font-size: 23px;
+    line-height: 1.5;
+}
+
+#footer{
+    position:fixed;
+    bottom:0;
+    left:0;
+    background-color:#03417C;
+    color:#FFF;
+    text-align:center;
+    width:100%;
+}
+.txt1 {
+    font-family: Poppins-Regular, serif;
+    font-size: 18px;
+    line-height: 1.5;
+    color: #666666;
+}
+.txt2 {
+    font-family: Poppins-Regular, serif;
+    font-size: 19px;
+    line-height: 1.5;
+    color: #2471A3;
+}
+
+/* CSS for the footer */
+.footer{
+    font-weight:normal;
+    color:#2471A3;
+    font-family: Poppins-Regular, Serif, serif;
+    font-size: 17px;
+}
+/* CSS for index Page */
+
+
+/* CSS for LRR Word Logo */
+.logolabel {
+    padding-top: 30%;
+
+}
+
+.lrrwordlog {
+    width:20%;
+    position:relative;
+    right:-90px;
+    font-family: Poppins-Regular, serif;
+    color: #03407B;
+}
+
+.img_lrr_logo_home {
+    max-width:100%;
+    height: auto;
+    position:relative;
+    right:-95px;
+    top:1px;
+}
+/* CSS for Signup */
+.signup-form{
+    margin: 20px;
+}
+/* Footer */
+.footer{
+    background-color:white;width:100%
+}
+
+/* Recover Passwords */
+.btn-primary {
+    color: white;
+    border-radius: 5px;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+    background: rgb(75, 184, 240);
+    padding:5px 102px;
+    font-family: Poppins-Regular;
+    font-size: 23px;
+    line-height: 1.5;
+}

get_mysql_credentials.php

@@ -1,5 +1,4 @@
 <?php
-$csv = array_map('str_getcsv', file('./../../lrr_submission/KeepItSafe.txt'));
-$mysql_username = $csv[0][0];
-$mysql_password = $csv[0][1];
+$mysql_username = 'root';
+$mysql_password = '';
 ?>

index.php

@@ -1,128 +1,86 @@
 <?php
-  $page='Home';
-  require 'Header.php';
-  session_start();
+$page = 'Home';
+require 'Header.php';
+session_start();
 ?>
 
 <?php
-  // if the user has already logged in, then clicking the LRRS icon should not display the login page (i.e., index.php).
+// if the user has already logged in, then clicking the LRR icon should not display the login page (i.e., index.php).
 if (isset($_SESSION["user_fullname"])) {
     header("Location: Courses.php");
 }
 ?>
+<!--Container for the logo label and Signup Form split into two 6columns-->
+<div class="container">
+    <div class="row">
+        <!--Divide the page by 6 columns for the first section-->
+        <div class="col">
 
-<br><br><br>
+            <!---Index Page Logo and Labeling on the left hand side -->
+            <section class="logolabel">
+                <div>
+                    <img class="img_lrr_logo_home" src="logo.png" alt="LRR Logo">
+                </div>
+                <div>
+                    <h1 class="lrrwordlog">Lab Report Repository</h1>
+                </div>
+            </section>
+        </div>
 
-<div class="row" style="width:85%;margin:auto;">
-  <div class="col-md-4">
-    <br><br>
-    <img src="logo.png" style="width:40%; position:relative; right:-95px; top:1px;">
-    <br><br>
-    <div style="width:20%; position:relative; right:-90px; font-family: Poppins-Regular;">
-    <h1>Lab Report Repository</h1>
-    <br><br>
-    </div>
-    </div>
-    <br>
-    <div style = "position:relative; left:240px; top:-2px;">
-    <h4 class="list-group-item active" style="font-weight:normal;font-family: Poppins-Regular;"> Sign in </h4>
-    <div class="list-group-item">
+        <!--Divide the page by 6 columns for the last section-->
+        <div class="col">
 
-    <div class="panel-body">
+            <!--Index Page Signup form on the right hand side-->
+            <section class="signup-form">
+                <h4 class="list-group-item active"> Sign in </h4>
+                <div class="list-group-item">
+                    <div class="panel-body">
+                        <form method="post" action="Script.php" name="frm_login">
+                            <input type="hidden" name="frm_login" value="true" />
+                            <label>Student ID / Instructor Email</label>
+                            <input type="text" name="user" placeholder="Email / Student Number" class="form-control" required="required" id="user_name" />
+                            <label>Password</label>
+                            <input type="password" class="form-control" name="password" placeholder="password" required="required" id="user_password" />
+                            <div class="text-center">
+                                <button type="submit" class="btn-primary" name="Login" id="login_btn" style="margin: 20px">Login</button>
+                                <label>
+                                    <!---Warning labels-->
+                                    <?php
+
+                                    if (isset($_SESSION['wrong_pass'])) {
+                                        echo  '<hr><div class="alert alert-danger" role="alert">' . $_SESSION['wrong_pass'] . '</div>';
+                                        $_SESSION['wrong_pass'] = null;
+                                    }
+
+                                    error_reporting(E_ALL);
+                                    if (isset($_SESSION['info_login'])) {
+                                        echo  '<hr><div class="alert alert-danger" role="alert">' . $_SESSION['info_login'] . '</div>';
+                                        $_SESSION['info_login'] = null;
+                                    }
+
+                                    if (isset($_SESSION['infoChangePassword'])) {
+                                        echo  '<hr><div class="alert alert-danger" role="alert">' . $_SESSION['infoChangePassword'] . '</div>';
+                                        $_SESSION['infoChangePassword'] = null;
+                                    }
+                                    ?>
+                                </label>
+
+                            </div>
+
+                            <label class="footer" href="recover_password.php" ">Reset my password</label>
+                            <div class=" text-center">
+                                <br><span class="txt1">Don't have an account?</span>
+                                <a class="txt2" href="signup.php" style="font-weight:normal" id="signup_link">Sign Up</a>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+            </section>
+        </div>
 
-    <form method="post" action="Script.php" name="frm_login">
-    <input type="hidden" name="frm_login" value="true"/>
-    Student ID / Instructor Email
-    <input type="text" name="user" placeholder="Email / Student Number" class="form-control" required="required" id="user_name" />
-    <br>
-    Password
-    <input type="password" class="form-control"  name="password" placeholder="password" required="required" id="user_password" />
-    <div class="text-center">
-    <br><input type="submit" class="btn-primary" value="Login" id="login_btn">
-    </div>
-    <br> <a href="recover_password.php" style="font-weight:normal;color:#2471A3; font-family: Poppins-Regular;
-    font-size: 17px;">Reset my password</a>
-    <div class="text-center">
-    <br><span class="txt1">Don't have an account?</span>
-         <a class="txt2" href="signup.php" style="font-weight:normal" id="signup_link">Sign Up</a>
-        </a>
     </div>
 
-    <?php 
-    
-    error_reporting(E_ALL);
-    
-    if(isset($_SESSION['info_login'])) {
-        echo  '<hr><div class="alert alert-danger" role="alert">'.$_SESSION['info_login'].'</div>';
-        $_SESSION['info_login']=null;
-    }
-    
-    
-    // wrong pass
-    if(isset($_SESSION['wrong_pass'])) {
-        echo  '<hr><div class="alert alert-danger" role="alert">'.$_SESSION['wrong_pass'].'</div>';
-        $_SESSION['wrong_pass']=null;
-    }
-    
-    
-    if(isset($_SESSION['infoChangePassword'])) {
-        echo  '<hr><div class="alert alert-danger" role="alert">'.$_SESSION['infoChangePassword'].'</div>';
-        $_SESSION['infoChangePassword']=null;
-    }
-    ?>
-      
-    </div>
-    </form>
-    </div>
-</div>
-</div>
-</div>
 
-</div>
-
-
-<div id="footer">
-    LRR was originally developed as a <a href="http://lanlab.org/course/2018f/se/homepage.html" style="color:white;">software engineering course project</a> by Mohamed Nor and Elmahdi Houzi.  Please submit your suggestions or bug reports to  lanhui.  Last updated on 18/04/2020 by Ashly. <a href="./homepage" style="color:white;">More information ...</a>
-    </div>
-
-</body>
-
-<style>
-    /*------------------------------------------------------------------
-[ Login Button ]*/
-.btn-primary {
-            color: white;
-            border-radius: 5px;
-            text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-            background: rgb(75, 184, 240);
-            padding:5px 100px;
-            font-family: Poppins-Regular;
-            font-size: 23px;
-            line-height: 1.5;
-        }
-
-#footer{
-position:fixed;
-bottom:0;
-left:0;
-background-color:#03417C;
-color:#FFF;
-text-align:center;
-width:100%;
-}
-.txt1 {
-  font-family: Poppins-Regular;
-  font-size: 18px;
-  line-height: 1.5;
-  color: #666666;
-}
-.txt2 {
-  font-family: Poppins-Regular;
-  font-size: 19px;
-  line-height: 1.5;
-  color: #2471A3;
-}
-
-</style>
-
-</html>
+<?php
+include 'footer.html'
+?>

recover_password.php

@@ -43,18 +43,3 @@ if(isset($_SESSION['info_recover_password'])) {
 }
 
 ?>
-
-<style>
-   /*------------------------------------------------------------------
-[ Login Button ]*/
-.btn-primary {
-            color: white;
-            border-radius: 5px;
-            text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-            background: rgb(75, 184, 240);
-            padding:5px 102px;
-            font-family: Poppins-Regular;
-            font-size: 23px;
-            line-height: 1.5;
-        }
-</style>

signup.php

@@ -48,17 +48,3 @@ include 'Header.php';
         </div>
     </div>
 </div>
-<style>
-    /*------------------------------------------------------------------
-[ Login Button ]*/
-    .btn-primary {
-        color: white;
-        border-radius: 5px;
-        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-        background: rgb(75, 184, 240);
-        padding: 5px 105px;
-        font-family: Poppins-Regular;
-        font-size: 23px;
-        line-height: 1.5;
-    }
-</style>