* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: inter, sans-serif;
}

:root {
  --primary-color: #460007;
  --secondary-color: #FFEFBD;
  --accent-color: #252525;
  --dark-shade: #604B40;
  --light-shade: #F1F1F1;
  --yellow-shade: #F4C94F;
}

a,
button {
  cursor: pointer;
  text-decoration: none;
  font-family: inter;
}

.tayyibat_button {
  width: 216px;
  height: 32px;
  border-radius: 56px;
  background-color: var(--accent-color);
  color: #F5F5F5;
  border: none;
  outline: none;
}

h1 {
  font-size: 48px;
  font-weight: bold;
}



.header .top {
  background-color: var(--secondary-color);
  height: 44px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 20px;
}
.header .top a {
  text-decoration: none;
  color: var(--accent-color);
}
.header .top .left {
  display: flex;
  gap: 20px;
  align-items: center;
}
.header .top .left a {
  display: flex;
  align-items: center;
}
.header .top .left img {
  margin: 5px;
}
.header .top .right {
  display: flex;
  gap: 40px;
}
.header .top .right .icons {
  display: flex;
  align-items: center;
}
.header .top .right .call {
  display: flex;
  align-items: center;
}
.header .top .right .call a {
  display: flex;
  align-items: center;
}
.header .navbar {
  background-color: #F5F5F5;
  height: 76px;
  display: flex;
  justify-content: space-between;
  padding: 0px 100px;
  align-items: center;
}
.header .navbar .menu_options {
  display: flex;
  gap: 30px;
  text-decoration: none;
  color: #252525;
  text-decoration: none;
}
.header .navbar .menu_options a {
  text-decoration: none;
  color: #252525;
}

.main {
  position: relative;
  height: 100vh;
  width: 100%;
  background-image: url(/static/images/WhatsApp\ Image\ 2025-01-29\ at\ 1.11.50\ PM\(1\).png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.main .shape {
  width: 857px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-image: url(/static/images/Rectangle\ 66.png);
}
.main .shape h1 {
  color: #fff;
}
.main .shape p {
  width: 461px;
  color: #fff;
}
.main .shape .line {
  border-top: 2px solid #fff;
  padding: 5px;
}
.main .shape .btn {
  background-color: var(--yellow-shade) !important;
  color: #252525;
}
.main .box {
  position: absolute;
  height: 161px;
  width: 761px;
  background-color: var(--yellow-shade);
  left: 300px;
  bottom: -80px;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main .box h1 {
  font-size: 35px;
}
.main .box .btn {
  height: 66px;
  width: 189px;
  background: #460007;
  color: #fff;
}

.featured_courses {
  padding: 150px;
}
.featured_courses .section_inner h1 {
  font-size: 48px;
}
.featured_courses .section_inner .surah_hajra {
  padding: 30px;
  width: 100%;
  height: 354px;
  display: flex;
  justify-content: end;
  background-image: url(/static/images/2148611776\ 1.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 30px;
}
.featured_courses .section_inner .surah_hajra h1 {
  font-weight: bold;
  font-size: 76px;
}
.featured_courses .section_inner .surah_hajra .btn {
  width: 203px;
  height: 56px;
}
.featured_courses .section_inner .surah_hajra p {
  width: 469px;
}
.featured_courses .section_inner .flex {
  display: flex;
  gap: 50px;
}
.featured_courses .section_inner .suran_noor {
  padding: 20px;
  height: 307px;
  width: 357px;
  background: #FFF9F5;
  border-radius: 20px;
  border: 1px solid #F4F4F4;
}
.featured_courses .section_inner .suran_noor .btn-img {
  display: flex;
  gap: 40px;
  align-items: center;
}
.featured_courses .section_inner .suran_noor .btn-img .bnt {
  width: 80px;
}
.featured_courses .section_inner .suran_noor .btn-img img {
  width: 170px;
  height: 170px;
}
.featured_courses .section_inner .suran_hujrat {
  padding: 20px;
  height: 307px;
  width: 357px;
  background-image: url(/static/images/hujrat.png);
  border-radius: 20px;
  display: flex;
  justify-content: end;
}
.featured_courses .section_inner .suran_maidah {
  padding: 20px;
  height: 307px;
  width: 357px;
  background: #F9E7DB;
  border-radius: 20px;
  border: 1px solid #F4F4F4;
}
.featured_courses .section_inner .suran_maidah .btn-img {
  display: flex;
  gap: 40px;
  align-items: center;
}
.featured_courses .section_inner .button {
  width: 100%;
  display: flex;
  justify-content: center;
}

.register {
  text-align: center;
  width: 100%;
  height: 383px;
  background: #FFD050;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url(/static/images/bggg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.register .btn {
  background: #460007 !important;
  color: #fff !important;
}
.register .content h1 {
  width: 740px;
}

.education_services {
  padding: 80px;
}
.education_services .section_inner .top {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.education_services .section_inner .upper_services {
  display: flex;
  justify-content: center;
  gap: 30px;
}
.education_services .section_inner .upper_services .service {
  border-radius: 20px;
  padding: 20px;
  height: 449px;
  width: 364px;
  box-shadow: 2px 4px 6px 0px rgba(0, 0, 0, 0.2);
}
.education_services .section_inner .upper_services .service p {
  width: 312px;
}
.education_services .section_inner .lower_services {
  display: flex;
  justify-content: center;
  gap: 30px;
}
.education_services .section_inner .lower_services .service {
  border-radius: 20px;
  padding: 20px;
  height: 449px;
  width: 384px;
  box-shadow: 2px 4px 6px 0px rgba(0, 0, 0, 0.2);
}
.education_services .section_inner .lower_services .service p {
  width: 312px;
}

.ustaza {
  height: 718px;
  padding: 80px;
  background: #F7F7F7;
}
.ustaza .section_inner {
  display: flex;
  justify-content: center;
  gap: 40px;
}
.ustaza .section_inner .left p {
  width: 390px;
}
.ustaza .section_inner .right_image img {
  height: 541px;
  width: 457px;
}

.new_events {
  padding: 80px;
}
.new_events .section_inner .button {
  display: flex;
  justify-content: center;
}
.new_events .section_inner .top {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.new_events .section_inner .news {
  display: flex;
  justify-content: center;
  gap: 40px;
}
.new_events .section_inner .news .new {
  height: 423px;
  width: 363px;
  position: relative;
}
.new_events .section_inner .news .new .title {
  padding-top: 10px;
  padding-left: 10px;
  width: 299px;
  height: 84px;
  border: 2px solid rgba(0, 0, 0, 0.2117647059);
  border-radius: 20px;
  position: absolute;
  background: #fff;
  left: 35px;
  bottom: -35px;
}

.contact {
  margin: 100px;
  height: 423px;
  background-image: url(/static/images/bggg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.contact .btn {
  background: #460007 !important;
  color: #fff !important;
}

.footer {
  height: 291px;
  background-color: #460007;
}
.footer .footer_inner {
  margin: 30px 40px;
  height: 90%;
  background-color: #460007;
  display: flex;
  justify-content: center;
  gap: 100px;
  align-items: center;
  border-bottom: 1px solid #F1F1F1;
}
.footer .footer_inner .logo {
  display: flex;
  gap: 20px;
}
.footer .footer_inner .logo h2 {
  color: #F1F1F1;
}
.footer .footer_inner .logo p {
  color: #F1F1F1;
}
.footer .footer_inner .logo a {
  text-decoration: none;
  color: #F1F1F1;
}
.footer .footer_inner .contact_info {
  display: flex;
  flex-direction: column;
  text-align: center;
  gap: 10px;
}
.footer .footer_inner .contact_info h2 {
  color: #F1F1F1;
  border-left: 1px solid #F1F1F1;
  padding-left: 20px;
}
.footer .footer_inner .contact_info a {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: #F1F1F1;
}
.footer .footer_inner .support_links {
  display: flex;
  flex-direction: column;
  gap: 30px;
  text-align: center;
}
.footer .footer_inner .support_links h2 {
  color: #F1F1F1;
  border-left: 1px solid #F1F1F1;
  padding-left: 20px;
}
.footer .footer_inner .support_links a {
  text-decoration: none;
  color: #F1F1F1;
}

.sidebar {
  width: 310px;
}
.sidebar .logo {
  background-color: #fff;
  display: flex;
  justify-content: center;
  height: 123px;
  gap: 15px;
  align-items: center;
  border-radius: 8px;
}
.sidebar .logo img {
  height: 70px;
  width: 70px;
}
.sidebar .menu {
  border-radius: 8px;
  padding: 30px 5px;
  background-color: #fff;
}
.sidebar .menu .top_links a,
.sidebar .menu .middle_links a,
.sidebar .menu .lower_links a {
  display: flex;
  gap: 5px;
  align-items: center;
  width: 301px;
  height: 53px;
  padding-left: 20px;
  text-decoration: none;
  color: #595959;
  border-radius: 8px;
}
.sidebar .menu .top_links a p,
.sidebar .menu .middle_links a p,
.sidebar .menu .lower_links a p {
  font-size: 24px;
}
.sidebar .menu .top_links a:hover,
.sidebar .menu .middle_links a:hover,
.sidebar .menu .lower_links a:hover {
  background-color: #460007;
  color: #fff;
}
.sidebar .menu .top_links {
  height: 235px;
}
.sidebar .menu .middle_links {
  height: 117px;
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
}

.register_container {
  margin: 50px auto;
  max-width: 1000px;
  width: 100%;
}
.register_container .head {
  color: white;
  background-color: #531419;
  padding: 20px 60px;
}
.register_container .designed_form input,
.register_container .designed_form textarea,
.register_container .designed_form select {
  width: 100%;
  border: 1px solid #dadada;
  padding: 10px;
  border-radius: 4px;
  color: #686767;
}
.register_container .designed_form label {
  display: none;
}
.register_container .designed_form .helptext {
  display: none;
}
.register_container .designed_form .border_box {
  border-radius: 4px;
  border: 1px solid #dadada;
  display: grid;
  grid-template-columns: 1fr 1fr;
  -moz-column-gap: 70px;
       column-gap: 70px;
  row-gap: 10px;
  padding: 20px 60px;
  margin: 20px 0px;
}

.sidebar {
  width: 25%;
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  background-color: #EEEEEE;
  padding: 10px;
}
.sidebar .header {
  display: flex;
  padding: 20px;
  gap: 20px;
  background-color: #fff;
  border-radius: 5px;
  margin-bottom: 10px;
  align-items: center;
}
.sidebar .header h2 {
  font-size: 18px;
  font-weight: 700;
}
.sidebar .header img {
  width: 70px;
  -o-object-fit: cover;
     object-fit: cover;
}
.sidebar .sidebar_items {
  background-color: #fff;
  height: 80%;
  display: flex;
  flex-direction: column;
  border-radius: 5px;
  justify-content: space-between;
}
.sidebar .sidebar_items .link {
  display: flex;
  gap: 10px;
  padding: 10px;
  align-items: center;
  text-decoration: none;
  color: #000;
}
.sidebar .sidebar_items .link svg {
  width: 20px;
}
.sidebar .sidebar_items .links {
  border-bottom: 1px solid #686767;
}
.sidebar .sidebar_items .settings {
  margin-top: 75px;
}



.dashboard_page {
  background-color: #EEEEEE;
  position: relative;
}

.dashboard_page .mainDashboard {
  position: absolute;
  width: 75%;
  right: 0;
}

.mainDashboard.index {
  display: flex;
  gap: 10px;
}
.mainDashboard.index .content {
  width: 70%;
  padding: 20px;
  color: #fff;
}
.mainDashboard.index .content .head {
  background-color: #460007;
  padding: 20px;
  border-radius: 5px;
}
.mainDashboard.index .content .head h1 {
  font-size: 20px;
  gap: 20px;
  display: flex;
  align-items: center;
}
.mainDashboard.index .content .head .des {
  display: flex;
  gap: 5px;
  align-items: center;
}
.mainDashboard.index .content .head .des a {
  background-color: #FFEFBD;
  color: #333;
  border-radius: 5px;
  padding: 10px;
  display: flex;
  gap: 5px;
  align-items: center;
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.mainDashboard.index .content .announcements {
  margin-top: 20px;
  border-radius: 5px;
  color: #252525;
  background-color: #F4C94F !important;
}
.mainDashboard.index .content .announcements .head {
  background-color: #F4C94F !important;
  display: flex;
  gap: 10px;
  align-items: center;
}
.mainDashboard.index .content .courses_div {
  margin: 10px 0px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.mainDashboard.index .content .courses_div .course_div {
  border: 1px solid #eee;
  background-color: #FFF9F5;
  padding: 20px;
  color: #531419;
}
.mainDashboard.index .content .courses_div .course_div h2 {
  margin-bottom: 20px;
}
.mainDashboard.index .content .courses_div .course_div a {
  background-color: #531419;
  color: #FFF9F5;
  border-radius: 5px;
  padding: 10px;
  display: flex;
  align-items: center;
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.mainDashboard.index .content .explore_courses {
  background-color: #531419;
  color: #fff;
  border-radius: 5px;
}
.mainDashboard.index .content .explore_courses h1 {
  display: flex;
  justify-content: space-between;
  font-size: 30px;
  align-items: center;
  padding: 10px;
}
.mainDashboard.index .events {
  margin: 10px;
  background-color: #F4C94F;
  text-align: center;
}
.mainDashboard.index .events h2 {
  text-transform: uppercase;
  margin: 50px;
  font-size: 20px;
}
.mainDashboard.index .events .socials {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.dashboard_page .container {
  width: 70%;
  position: absolute;
  right: 0;
}
.dashboard_page .container .card-body .card {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.dashboard_page .container .card-body .change_pass_button a {
  background-color: #FFD050;
  color: var(--secondary-color);
  height: 36px;
  width: -moz-fit-content;
  width: fit-content;
  color: #000;
  border: none;
  outline: none;
  font-size: 20px;
  display: flex;
  align-items: center;
}

.dashboard_page .container input,
.dashboard_page .container textarea,
.dashboard_page .container select {
  width: 25%;
  border: 1px solid #dadada;
  padding: 10px;
  border-radius: 4px;
  color: #686767;
}
.dashboard_page .container h1 {
  color: #000;
  margin-bottom: 20px;
}
.dashboard_page .container label {
  display: none;
}
.dashboard_page .container .helptext {
  display: none;
}
.dashboard_page .container .border_box {
  border-radius: 4px;
  border: 1px solid #dadada;
  display: grid;
  grid-template-columns: 1fr 1fr;
  -moz-column-gap: 70px;
       column-gap: 70px;
  row-gap: 10px;
  padding: 20px 60px;
  margin: 20px 0px;
}
.dashboard_page .container .btn {
  background-color: #FFD050;
  color: var(--secondary-color);
  height: 36px;
  width: -moz-fit-content;
  width: fit-content;
  color: #000;
  border: none;
  outline: none;
  font-size: 20px;
  display: flex;
  align-items: center;
  border-radius: 5px;
}

.dashboard_page .course-container {
  width: 70%;
  position: absolute;
  right: 0;
  padding: 60px;
}

.dashboard_page .contact-us input,
.dashboard_page .contact-us textarea,
.dashboard_page .contact-us select {
  width: 25%;
  border: 1px solid #dadada;
  padding: 10px;
  border-radius: 4px;
  color: #686767;
}
.dashboard_page .contact-us h1 {
  color: #000;
  margin-bottom: 20px;
}
.dashboard_page .contact-us label {
  display: none;
}
.dashboard_page .contact-us .helptext {
  display: none;
}
.dashboard_page .contact-us .border_box {
  border-radius: 4px;
  border: 1px solid #dadada;
  display: grid;
  grid-template-columns: 1fr 1fr;
  -moz-column-gap: 70px;
       column-gap: 70px;
  row-gap: 10px;
  padding: 20px 60px;
  margin: 20px 0px;
}
.dashboard_page .contact-us .btn {
  background-color: #FFD050;
  color: var(--secondary-color);
  height: 36px;
  width: -moz-fit-content;
  width: fit-content;
  color: #000;
  border: none;
  outline: none;
  font-size: 20px;
  display: flex;
  align-items: center;
  border-radius: 5px;
}/*# sourceMappingURL=style.css.map */

