Upload New File

style.css

+body {
+  font-family: "Raleway", sans-serif;
+  background-color: yellow;
+}
+
+.layout_padding {
+  padding: 75px 0;
+}
+
+.layout_padding2 {
+  padding: 45px 0;
+}
+
+.layout_padding2-top {
+  padding-top: 45px;
+}
+
+.layout_padding-top {
+  padding-top: 75px;
+}
+
+.layout_padding-bottom {
+  padding-bottom: 75px;
+}
+
+.call_to-btn {
+  display: inline-block;
+  padding: 15px 45px;
+  border-radius: 10px;
+  font-size: 15px;
+  background-color: #ffffff;
+  color: #262627;
+  font-weight: 600;
+  transition: all 0.3s ease 0s;
+}
+
+.call_to-btn img {
+  width: 18px;
+  margin-left: 10px;
+}
+
+.btn_on-hover {
+  transition: all 0.3s ease 0s;
+}
+
+.call_to-btn:hover,
+.btn_on-hover:hover {
+  -webkit-box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.7);
+  -moz-box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.7);
+  box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.7);
+  transform: translateY(-7px);
+}
+
+.main-heading {
+  color: #082465;
+  font-weight: bold;
+  text-align: center;
+}
+
+/*header section*/
+
+.header_section {
+  padding-top: 10px;
+  font-family: "Poppins", sans-serif;
+}
+
+nav.navbar.navbar-expand-lg {
+  padding: 10px 0;
+}
+
+.custom_nav-container.navbar-expand-lg .navbar-nav .nav-link {
+  padding: 20px 20px;
+  color: black;
+  text-align: center;
+  border-color: blue;
+}
+
+h3 {
+  font-family: "Poppins", sans-serif;
+  font-size: 30px;
+  font-weight: 600;
+  color: #082465;
+}
+
+a,
+a:hover,
+a:focus {
+  text-decoration: none;
+}
+
+a:hover,
+a:focus {
+  color: initial;
+}
+
+.btn,
+.btn:focus {
+  outline: none !important;
+  box-shadow: none;
+}
+
+.top_container {
+  position: relative;
+}
+
+.top_container::before {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  background: url(../images/hero-bg.png);
+  background-size: 100% 100%;
+  background-position: right bottom;
+  background-repeat: no-repeat;
+  z-index: -1;
+}
+
+.sub_page .top_container::before {
+  background-color: #fdd31d;
+  background-image: none;
+}
+
+.sub_page .top_container::after {
+  display: none;
+}
+
+.navbar-brand img {
+  width: 25px;
+  margin-right: 7px;
+}
+
+.custom_nav-container .nav_search-btn {
+  background-image: url(../images/search-icon.png);
+  background-size: 22px;
+  background-repeat: no-repeat;
+  background-position-y: 7px;
+  width: 35px;
+  height: 35px;
+  padding: 0;
+  border: none;
+}
+
+.navbar-brand {
+  display: flex;
+  align-items: center;
+}
+
+.navbar-brand span {
+  font-size: 22px;
+  font-weight: 700;
+  color: black;
+}
+
+.custom_nav-container {
+  z-index: 99999;
+  padding: 15px 0;
+}
+
+.custom_nav-container .navbar-toggler {
+  outline: none;
+}
+
+.custom_nav-container .navbar-toggler .navbar-toggler-icon {
+  background-image: url(../images/menu.png);
+  background-size: 40px;
+}
+
+/* about section */
+
+.about_section {
+  text-align: right;
+}
+
+.about_section a {
+  background-color: #6ebca8;
+  color: #fefeff;
+}
+
+/* end about section */
+
+/* admission section */
+
+.admission_section a {
+  background-color: #fdd31d;
+  color: #fefeff;
+}
+
+/* end admission section */
+
+/* why section */
+
+.why_section {
+  text-align: right;
+}
+
+.why_section a {
+  background-color: #6ebca8;
+  color: #fefeff;
+}
+
+/* end why section */
+
+/* determine section */
+
+.determine_section a {
+  background-color: #fdd31d;
+  color: #fefeff;
+}
+
+/* end determine section */
+
+/* client section */
+
+.client_section h2,
+.client_section h5,
+.client_section p {
+  font-weight: 600;
+}
+
+.client_section h2 {
+  text-align: center;
+}
+
+.client_section h5 {
+  font-size: 24px;
+  color: #fdd31d;
+}
+
+.client_section .row {
+  align-items: center;
+  padding: 75px 0;
+  margin: 0 15px;
+}
+
+.client_section img {
+  width: 100%;
+}
+
+.client_img-box::before,
+.client_img-box::after {
+  content: "";
+  position: absolute;
+  width: 100px;
+  height: 30px;
+  border-radius: 20px;
+  background-color: #fdd31d;
+}
+
+.client_img-box::before {
+  top: -15px;
+  transform: rotate(139deg);
+  left: -15px;
+  animation: beforeanimate 1s;
+  animation-delay: 0.1s;
+}
+
+.client_img-box::after {
+  bottom: -15px;
+  transform: rotate(142deg);
+  right: -15px;
+  animation: afteranimate 1s;
+  animation-delay: 0.1s;
+}
+
+@keyframes beforeanimate {
+  0% {
+    top: 43%;
+    transform: rotate(142deg);
+    left: 31%;
+  }
+
+  100% {
+    top: -15px;
+    transform: rotate(139deg);
+    left: -15px;
+  }
+}
+
+@keyframes afteranimate {
+  0% {
+    bottom: 46%;
+    transform: rotate(142deg);
+    right: 35%;
+  }
+
+  100% {
+    bottom: -15px;
+    transform: rotate(142deg);
+    right: -15px;
+  }
+}
+
+.client_section .carousel-indicators {
+  margin: 0;
+  justify-content: flex-end;
+  padding-right: 15px;
+  bottom: 20px;
+}
+
+.client_section .carousel-indicators li {
+  width: 25px;
+  height: 25px;
+  background-color: #6bd1bd;
+  border-radius: 100%;
+  opacity: 1;
+}
+
+.client_section .carousel-indicators li.active {
+  background-color: #fdd31d;
+}
+
+/* end client section */
+
+/* contact section */
+
+.contact_section {
+  padding: 75px 45px;
+  font-family: "Poppins", sans-serif;
+}
+
+.contact_section .row {
+  align-items: center;
+}
+
+.contact_section input {
+  border: none;
+  outline: none;
+  border-bottom: 1px solid #000;
+  width: 90%;
+  margin: 15px 0;
+}
+
+.contact_form-container button {
+  border: none;
+  background-color: #6bd1bd;
+  color: #fff;
+  font-size: 15px;
+  padding: 15px 45px;
+  border-radius: 30px;
+  text-transform: uppercase;
+  font-weight: bold;
+}
+
+.contact_img-box {
+  display: flex;
+  align-items: center;
+}
+
+.contact_img-box img {
+  width: 100%;
+}
+
+.contact_section h2 {
+  font-size: 26px;
+  color: #010103;
+  font-weight: 600;
+  font-family: "Raleway", sans-serif;
+  margin-bottom: 35px;
+}
+
+/* end contact section */
+
+/*category animations */
+.image-container {
+  position: relative;
+  width: 58%;
+  height: fit-content;
+}
+
+.image-container img {
+  width: 58%;
+  height: 80%;
+}
+
+#nextButton {
+  display: block;
+  margin: 0 auto; /* Center the 'Next' button */
+}
+/* Additional styles to center pronunciation options and iframe */
+
+#greetingsPronunciation {
+  text-align: center; /* Center the pronunciation options */
+}
+
+#signLangIframe {
+  display: block;
+  margin: 0 auto; /* Center the iframe */
+}
+.main-heading {
+  font-size: 34px; /* Adjust the font size as needed */
+}
+
+.call_to-btn {
+  font-size: 18px; /* Adjust the font size as needed */
+}
+
+#signLangIframe {
+  display: block;
+  margin: 10px auto 0; /* Move the iframe down by 10px and center horizontally */
+}
+#game {
+  display: flex;
+  justify-content: space-between;
+}
+#cards,
+#answers {
+  flex-basis: 45%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+.card,
+.answer {
+  background-color: #f7f7f7;
+  border: 1px solid #ddd;
+  padding: 10px;
+  margin: 10px;
+  width: calc(50% - 20px);
+  text-align: center;
+}
+.card:hover,
+.answer:hover {
+  background-color: #eee;
+  cursor: pointer;
+}
+#message {
+  margin-top: 20px;
+  padding: 10px;
+  background-color: #f0f0f0;
+  border: 1px solid #ccc;
+  text-align: center;
+}
+.container {
+  position: relative;
+  width: 100%;
+}