new changes

middle_part/middle_part.css

@@ -0,0 +1,91 @@
+
+.department-section {
+  position: absolute;
+  top: 130%;
+}
+
+.department-title{
+    margin-left: 60px;
+}
+
+
+/* Style for the container of card items */
+.department-container {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    margin-right: 30px;
+    margin-left: 30px;
+}
+
+/* Style for each card */
+.department-card {
+  width: 30%;  /* 33.33% width for three cards with spacing */
+  margin-bottom: 20px;
+  padding: 5px;
+}
+
+.department-card img {
+    max-width: 100%;
+}
+
+.department-card h3 {
+    margin-left: 30px;
+}
+
+.department-card p {
+    margin-left: 30px;
+}
+
+.why-gg-section {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh; /* Full viewport height */
+    position: absolute;
+    top: 220%;
+    background-color: #EAF2FF;
+    margin-left: 60px;
+    margin-right: 60px;
+    margin-bottom: 100px;
+}
+
+/* Style for the card */
+.card {
+    position: relative;
+    max-width: 100%;
+}
+
+/* Style for the image */
+.card img {
+    width: 100%;
+    height: auto;
+}
+
+/* Style for the text on top of the image */
+.card-text {
+    position: absolute;
+    top: 20px; /* Adjust the top position as needed */
+    left: 70%; /* Adjust the left position as needed */
+    color: black;
+    font-size: 24px;
+    font-weight: bold;
+    padding: 10px;
+}
+
+ul.custom-bullet {
+    list-style-image: url('img/tick_icon.png');
+    padding-left: 20px;
+     /* Add padding to adjust the distance between the bullet image and text */
+}
+
+/* Style for list items */
+li {
+    margin: 10px 0; /* Adjust margin as needed */
+}
+
+.why-gg-list{
+    position:absolute;
+    left: 70%;
+    top: 80px;
+}