.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; }