/* Mobile-first base (phones) */
/* h1.fs-100 {
  font-size: 28px;
}
.banner-section p {
  font-size: 16px;
  width: 100%;
  line-height: 1.2;
}
.banner-section .mt-10 {
  margin-top: 20px;
}
.banner-section a.mr-3,
.mr-3 {
  margin-right: 0;
} */

/* Extra small devices (phones, up to 575.98px) */
@media (max-width: 575.98px) {
  /* override if needed for very small phones */
  h1.fs-100 {
    font-size: 3.75rem !important;
  }
  .banner-section p {
    font-size: 18px !important;
    line-height: normal;
  }
  .banner-section h1 {
    font-size: 3.5rem !important;
  }
  #landingFooter {
    position: fixed;
  }
  .navbar-light .nav-link {
    color: #fff;
  }
  .navbar-light .nav-link.active,
  a.nav-link.active,
  a.nav-link.dropdown-toggle:focus,
  .navbar-light .nav-link:focus,
  a.nav-link.dropdown-toggle:active,
  .navbar-light .nav-link:active {
    color: #ffe3a2 !important;
  }
  .navbar-toggler-icon {
    filter: brightness(0) invert(1);
  }
  .banner-section p.w-70 {
    width: 100% !important;
  }
  .mt-10 {
    margin-top: 25px !important;
  }
  .banner-section a {
    margin-bottom: 15px;
  }
  .navbar-light .nav-link:hover {
    color: #fff !important;
  }
  #landingFooter,
  footer.bg-dark {
    padding: 0.5rem !important;
  }
  #landingFooter .mb-8,
  footer.bg-dark .mb-8 {
    margin-bottom: 0 !important;
  }
  #landingFooter a,
  footer.bg-dark a {
    display: inline-block;
    font-weight: 300;
  }
  #landingFooter p,
  footer.bg-dark p {
    text-align: center;
    display: block;
  }
  #landingFooter .pl-25,
  footer.bg-dark .pl-25 {
    padding-left: 0;
  }
  ul.navbar-nav.p-4.p-lg-0 {
    padding-bottom: 1rem !important;
  }
  .navbar-toggler {
    background-color: #4e806a;
  }
  div#navbarCollapse {
    background-color: #4e806a;
    padding-bottom: 15px;
  }
  .nav-item.dropdown[aria-expanded="true"] #aboutus.collapse.show {
    display: block;
    /* pointer-events: none; */
  }

  .nav-item.dropdown[aria-expanded="false"].collapsed #aboutus.collapse {
    display: none !important;
    /* pointer-events: none; */
  }
  .nav-item.dropdown[aria-expanded="true"] #curriculum.collapse {
    display: block;
    /* pointer-events: none; */
  }

  .nav-item.dropdown[aria-expanded="false"].collapsed #curriculum.collapse {
    display: none !important;
    /* pointer-events: none; */
  }

  .event-slider.px-3 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .modal-body {
    padding: 15px 0;
  }
  .modal-body .container {
    padding-top: 25px;
  }
  .customModalCloseBtn {
    top: 1%;
  }
  .past-event {
    padding-top: 10rem !important;
  }
  .past-event .offset-1 {
    margin-left: 0;
  }
  .text-right {
    text-align: right;
  }
  .past-event .pasteventWrap hr {
    display: none;
  }
  .past-event .pasteventWrap .date {
    width: 100% !important;
    font-size: 14px;
  }
  .past-event .pasteventWrap.d-flex {
    display: block !important;
    padding: 0 !important;
  }

  .the_essence_core_section,
  .school-rooted,
  .teacher-profile,
  .waldorf_education_section,
  .hiringSection,
  .enrolSection,
  .communitySection {
    padding-top: 8rem !important;
  }
  .hiringSection,
  .communitySection {
    padding-bottom: 5rem !important;
  }
  .waldorf_education_section {
    padding-bottom: 4rem !important;
  }
  #ourBelief {
    padding-top: 4rem !important;
  }
  .we_imageHolder {
    height: 415px;
    background-size: auto;
  }
  .we_imageHolder .contentHolder {
    width: 90%;
    height: 230px;
  }

  .we_imgHolder-vertical,
  .sensory_imgHolder-vertical {
    width: 85%;
    height: 605px;
    background: url(../images/waldorf_edu_img.png) no-repeat center center;
    background-size: contain;
    align-items: center;
    display: inline-flex;
  }
  .sensory_imgHolder-vertical {
    background: url(../images/sensory_img.png) no-repeat center center;
    background-size: contain;
  }
  .we_imgHolder-vertical .contentHolder,
  .sensory_imgHolder-vertical .contentHolder {
    width: 80%;
    height: 100px;
    display: block;
    margin: 0 auto;
  }

  .oc_imgHolder-vertical {
    width: 85%;
    height: 600px;
    background: url(../images/community_img_ver.png) no-repeat center center;
    background-size: contain;
    align-items: center;
    display: inline-flex;
  }
  .oc_imgHolder-vertical .contentHolder {
    width: 80%;
    height: 200px;
    display: block;
    margin: 0 auto;
  }
  .oc_imageHolder .contentHolder {
    height: 165px;
  }
  .contentHolder h4 {
    font-size: 24px;
  }
  .we_imageHolder h3,
  .oc_imageHolder h3,
  .oc_imgHolder-vertical h3 {
    font-size: 36px;
  }
  .we_imageHolder p {
    margin-bottom: 0;
  }
  .school-rooted {
    padding-bottom: 100px !important;
  }
  .why-earth h3 {
    padding-top: 0 !important;
  }
  .teacher-profile p.fs-5.mb-0.pt-10,
  .pri-teacher.py-5,
  .kinder-teacher.py-5 {
    padding-top: 0 !important;
  }
  .kinder-teacher .col-6,
  .pri-teacher .col-6 {
    width: 49%;
  }
  #teacherGroup.gap-7 {
    gap: 0 !important;
  }
  .profileImg::after {
    background-size: 180px 180px;
  }
  .waldorf_education_section p.fs-5.mb-0.pt-10 {
    padding-top: 0 !important;
  }
  .the_essence_core_section p.fs-5.pt-10 {
    padding-top: 0 !important;
  }
  .navsoc {
    filter: brightness(0) invert(1);
    padding: 0 15px 15px;
    margin-bottom: 15px;
  }
  .nav-item.nav-link {
    position: relative;
    z-index: 222;
  }
  .hiringSection p.fs-5.mb-0.pt-10 {
    padding-top: 0 !important;
  }
  #hiringImgTab img,
  #communityImgTab img {
    max-width: 100%;
    border-radius: 15px;
    overflow: hidden;
  }
  .enrolSection p.fs-5.pt-10 {
    padding-top: 0 !important;
    margin-bottom: 5rem !important;
  }
  .downloadBtn {
    margin-bottom: 1rem;
    display: block;
    text-align: center;
  }
  .enrollStep {
    height: 220px;
    background-size: 100% 100%;
  }
  .enrollStep span,
  .enrollStep-brown span,
  .enrollStep-long span {
    top: 16px;
    left: 7%;
  }
  .enrollStep-brown {
    height: 200px;
  }
  .enrollStep-long {
    height: 275px;
    background-size: 100% 100%;
  }
  .enrolSection .leafUL {
    margin-top: 20px;
  }
  .feeUL {
    margin-top: -25px;
  }
  .feeWrap.general {
    padding: 20px;
    margin-bottom: 25px;
    height: 390px;
  }
  .feeWrap:before {
    height: 512px;
    width: 400px;
    top: -65px;
    left: -18px;
    background-size: 100% 100%;
    position: absolute;
  }
  .bg-paper-bg-contact:before {
    background: url(../images/paper_top_bg.jpg) no-repeat top left;
    left: 0px;
  }
  #planAvisit {
    padding-top: 0px;
  }

  .planVisit.bg-paper-bg-contact {
    top: 72px;
  }

  .contactAdmissionSection .row.mt-5.pt-4 {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
  .contactAdmissionSection {
    padding-bottom: 200px !important;
  }
  .contactAdmissionSection .contactDetailWrap.mt-5.pt-5.py-xxl-5,
  .contactAdmissionSection p.pt-10,
  #planAvisit p.fs-5.pt-10 {
    padding-top: 0 !important;
  }
  .accordion-button[aria-expanded="false"] {
    background: transparent;
    border: 1px solid #4e806a;
    color: #8a8a8a;
    padding: 10px 10px;
    text-transform: none;
  }
  .accordion-button[aria-expanded="true"] {
    background: #4e806a;
    border: 1px solid #4e806a;
    color: #fff;
    padding: 10px 10px;
    text-transform: none;
  }
  .accordion-button::after {
    content: "";
    width: 35px;
    height: 35px;
    border-radius: 0 30px;
    background-color: #4e806a;
    transform: rotate(0deg);
    background-size: 50%;
  }
  .accordion-button:not(.collapsed)::after,
  .accordion-button[aria-expanded="true"]::after {
    content: "";
    width: 35px;
    height: 35px;
    border-radius: 0 30px;
    background-size: 50%;
    background-color: #fff;
    transform: rotate(0deg);
  }

  .waldorf_education_section .accordion img {
    max-width: 100%;
  }

  .badgeWrap {
    position: relative;
    width: auto;
    margin-bottom: 15px;
  }
  .eventThumbnail li {
    width: 62px;
    margin: 5px;
    overflow: hidden;
    height: 62px;
    position: relative;
    border-radius: 15px;
  }
  .eventThumbnail li img.active {
    border: 0px solid #074509 !important;
    opacity: 1;
    height: 100%;
  }
  .eventThumbnail li img {
    border-radius: 15px;
    border: 0px solid #fff !important;
    opacity: 0.5;
    transition: all 0.2s ease;
    position: absolute;
    height: 100%;
    width: 100%;
  }
  .eventDetailsSection {
    padding: 90px 0 50px;
  }
  #eventGallery img {
    border-radius: 15px;
  }
  #frequentlyAskedQuestions .accordion-body {
    padding: 10px;
    color: #2e2e2e;
  }
  #frequentlyAskedQuestions p {
    width: 100% !important;
  }
  #frequentlyAskedQuestions .leafUL {
    width: 100% !important;
  }
  .leafUL li:before {
    content: "";
    display: inline-block;
    height: 25px;
    width: 30px;
    position: relative;
    background-image: url(../images/astriceal.svg);
    background-size: 18px;
    top: 10px;
    background-repeat: no-repeat;
    /* margin-top: 11px; */
    margin-left: -34px;
  }
  #cookieBanner .btn-wrap {
    top: 0px;
  }
  .enrollStep h6,
  .enrollStep-brown h6,
  .enrollStep-long h6 {
    top: 54px;
    font-size: 35px;
  }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
  h1.fs-100 {
    font-size: 36px;
  }
  .banner-section p {
    font-size: 18px;
    width: 95%;
    line-height: 1.3;
  }
  .banner-section .mt-10 {
    margin-top: 30px;
  }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  h1.fs-100 {
    font-size: 44px;
  }
  .banner-section p {
    font-size: 20px;
    width: 90%;
    line-height: 1.4;
  }
  .banner-section .mt-10 {
    margin-top: 35px;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .container {
    max-width: 990px;
  }
  body {
    font-size: 16px !important;
  }
  h1.fs-100 {
    font-size: 50px;
  }
  .banner-section p {
    font-size: 20px;
    width: 75%;
    line-height: normal;
  }
  .banner-section .mt-10 {
    margin-top: 40px;
  }
  .banner-section p {
    width: 70%;
  }

  #timeTable {
    width: 90%;
    height: 325px;
  }
  .nav-link {
    padding-right: 20px !important;
    color: #fff;
    font-size: 16px;
  }
  a.navbar-brand.d-flex.align-items-center.px-4.px-lg-5 {
    padding-left: 0 !important;
    padding-right: 15px !important;
  }
  .dropdown-menu a {
    font-size: 16px;
  }
  .school-rooted {
    padding-bottom: 120px !important;
  }
  .teacher-profile {
    padding-bottom: 0 !important;
  }
  .profileImg::after {
    background-size: 220px 220px;
  }
  /* p,
  p.fs-5 {
    font-size: 1rem !important;
  } */
  .we_imgHolder-vertical {
    height: 430px;
  }
  .we_imgHolder-vertical .contentHolder {
    height: 315px;
  }
  .badgeESKL {
    font-size: 13px;
  }
  .guidingPrinciples {
    margin-top: -70px;
    padding-top: 0;
    padding-bottom: 160px;
  }
  .tt_horiline {
    top: 50px;
  }
  #timeTable {
    width: 100%;
    height: 280px;
  }
  #ttContent {
    margin-top: 60px;
  }
  #timeTable .ttItem {
    font-size: 12px;
  }
  #timeTable .ttItem span {
    font-size: 10px;
    display: block;
  }
  .dropdownselect {
    float: right;
  }
  .date {
    font-size: 12px;
  }
  /* #eventWrap,
  .hiringSection,
  .the_essence_core_section,
  .waldorf_education_section,
  .why-earth,
  .school-rooted,
  .teacher-profile {
    padding-top: 8rem;
  } */
  .banner-section p {
    width: 90%;
  }
  .enrollStep-long {
    height: 300px;
    background-size: 100% 100%;
  }
  /* .enrolSection {
    padding-bottom: 50px !important;
    padding-top: 8rem !important;
  } */
  .feeWrap:before {
    width: 465px;
    height: 465px;
    top: -30px;
    left: -3%;
    background-size: 100% 100%;
    position: absolute;
  }
  /* #planAvisit {
    padding-top: 160px;
  } */
  .esklBtn2::after {
    background-size: 335px 70px;
  }
  hr.border-line.bg-white {
    position: relative;
    top: -20px;
  }
  .pasteventWrap hr.border-line.bg-white {
    position: relative;
    top: 0px;
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  body {
    font-size: 1.125rem !important;
  }
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container {
    max-width: 1320px;
    font-size: 18px;
    line-height: 1.4;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: "earth_tonebold";
  }

  h1 {
    font-size: 4.6rem;
  }
  h2 {
    font-size: 2.5rem;
  }

  .body {
    font-family: "Nunito Sans", sans-serif !important;
    font-optical-sizing: auto;
    font-weight: 300 !important;
    font-style: normal;
    font-size: 18px !important;
    color: #2e2e2e !important;
  }
  p {
    font-weight: 300 !important;
  }
  .banner-section p {
    width: 70%;
  }
  .secondary-font {
    font-family: "Nunito Sans", sans-serif;
    font-optical-sizing: auto;
  }
  .fancy-font {
    font-family: "Ganttlets", sans-serif;
  }
  h3.fancy-font {
    font-size: 2.8rem;
  }

  .header {
    padding: 0;
    background-color: #fff;
  }
  .header.fixed-header {
    padding: 0;
    background: #fff;
  }

  .navbar {
    border-bottom: 1px solid #fff;
  }

  .navbar-light.navbar {
    border-bottom: 1px solid #614e22;
  }
  .navbar-light .nav-link {
    color: #614e22;
    transition: all ease 0.2s;
  }

  .navbar-light .nav-link:hover {
    color: #4e806a !important;
  }
  .nav-link {
    padding-right: 30px !important;
    color: #fff;
    font-size: 18px;
  }
  a.nav-link.dropdown-toggle.active,
  a.nav-link.active {
    color: #4e806a;
    font-weight: 700;
  }

  .fs-100 {
    font-size: 6.25rem !important;
  }

  .navbar-light .white-scale {
    filter: brightness(0) invert(0);
  }
  .navbar-dark a.nav-link.dropdown-toggle.active,
  .navbar-dark a.nav-link:hover {
    color: #ffe3a2 !important;
  }
  .navbar-dark img {
    filter: brightness(0) invert(1);
  }
  .white-scale {
    filter: brightness(0) invert(1);
  }

  .italic {
    font-style: italic;
  }

  footer.bg-dark {
    background: #4e806a !important;
  }

  footer.bg-dark a {
    margin: auto 5px;
    font-size: 0.625rem;
    color: #fff;
    transition: all 0.3s ease;
  }
  footer.bg-dark a:hover {
    color: #ffe3a2;
  }
  footer.bg-dark p {
    display: inline-block;
  }
  .pl-15 {
    padding-left: 15px;
  }
  .pl-25 {
    padding-left: 25px;
  }
  .mr-5 {
    margin-right: 5rem !important;
  }
  .mr-4 {
    margin-right: 4rem !important;
  }
  .mr-3 {
    margin-right: 3rem !important;
  }
  .mr-2 {
    margin-right: 2rem !important;
  }
  .mr-1 {
    margin-right: 1rem !important;
  }

  .esklBtn,
  .esklBtn-long,
  .esklBtn2 {
    position: relative;
    background: rgba(255, 227, 162, 0.8);
    font-weight: 600 !important;
    text-transform: uppercase;
    color: #074509;
    border: 0 !important;
    overflow: visible;
    transition: all 0.3s ease;
    padding: 0.2rem 1.5rem;
    min-width: 337.5px;
  }

  /* .esklBtn::after {
  background: url(../images/btn_outline-white.png) no-repeat center center;
  content: "";
  position: absolute;
  top: -6px;
  left: 0;
  width: 100%;
  height: 120%;
  background-size: 245px 80px;
  z-index: 1;
} */
  .esklBtn2::after {
    background: url(../images/btn_outline-green.png) no-repeat center center;
    content: "";
    position: absolute;
    top: -5px;
    left: 0;
    width: 100%;
    height: 115%;
    background-size: 337.5px 70px;
    z-index: 1;
  }
  .esklBtn::after {
    background: url(../images/btn_outline-white.png) no-repeat center center;
    content: "";
    position: absolute;
    top: -5px;
    left: 0;
    width: 100%;
    height: 115%;
    background-size: 337.5px 70px;
    z-index: 1;
  }

  .eventsOverlayWrap .esklBtn {
    min-width: 300px;
  }
  .eventsOverlayWrap .esklBtn::after {
    width: 100%;
    height: 130%;
    background-size: 290px 80px !important;
  }
  .btn .btn-text {
    font-weight: 700;
    color: #074509;
    text-align: left;
  }

  .btn-check:checked + .btn,
  :not(.btn-check) + .btn:active,
  .btn:first-child:active,
  .btn.active,
  .btn.show,
  .btn:hover {
    background: rgba(7, 69, 9, 0.8) !important;
    color: #fff !important;
    border: 0 !important;
  }

  .btn:hover .btn-text {
    color: var(--bs-white);
    transform: translateX(0.5rem);
  }
  .btn i {
    transition: all 0.3s ease;
  }
  .btn:hover i {
    background: #ffe3a2 !important;
    color: #074509;
  }
  .downloadBtn {
    background: #e9e9e9;
    color: #4e806a;
    font-weight: 800 !important;
    border: 0 !important;
    overflow: visible;
    transition: all 0.3s ease;
    padding: 0.5rem 1.5rem;
    min-width: 150px;
    font-size: 16px;
  }

  .downloadBtn:hover path {
    fill: #ffffff !important;
  }

  .downloadBtn:hover {
    background: rgba(7, 69, 9, 0.8) !important;
    color: #fff !important;
    border: 0 !important;
  }

  .bg-darkGreen {
    background-color: #074509 !important;
  }

  .text-yellow {
    color: #ffe3a2;
  }

  #landingFooter {
    position: absolute;
    bottom: 0;
    width: 100%;
    z-index: 9;
  }

  .navbar-dark .nav-item.dropdown .show {
    color: #fff;
    font-weight: 600;
  }
  .dropdown-menu {
    min-width: 280px;
    border: 1px solid #614e22;
    padding: 15px;
  }
  .dropdown-menu a {
    transition: all 0.2s ease;
    font-size: 18px;
  }
  .dropdown-menu a:hover {
    text-decoration: underline;
    background: transparent;
    color: #4e806a;
  }

  .dropdown-item.current {
    text-decoration: underline !important;
    color: #4e806a;
    font-weight: 600;
  }
  .badgeWrap {
    position: relative;
    width: auto;
    margin-bottom: 32px;
  }
  .badgeESKL {
    background: url(../images/badge_content.png) no-repeat center center;
    /* margin-left: 47px; */
    width: auto;
    /* position: absolute; */
    vertical-align: middle;
    /* height: 50px; */
    text-align: center;
    /* margin-left: 50px; */
    padding: 0;
    border-radius: 0;
    display: inline-block;
    /* vertical-align: middle; */
    justify-content: center;
    align-items: center;
    display: table-cell;
    font-size: 16px;
  }
  .badgeWrap::before {
    content: "";
    background: url(../images/badge_start.png) no-repeat center center;
    width: 22px;
    height: 50px;
    /* position: absolute; */
    display: table-cell;
    /* left: 0; */
    /* text-align: center; */
  }
  .badgeWrap::after {
    content: "";
    background: url(../images/badge_end.png) no-repeat center center;
    display: table-cell;
    width: 23px;
    padding: 0;
    margin: 0;
    height: 50px;
    /* top: 0; */
    /* right: -10px;
    z-index: -1; */
    /* position: absolute;*/
  }

  .badgeESKL p {
    margin: 0;
    left: -22px;
    position: absolute;
    width: 214px;
  }

  .we_imageHolder,
  .oc_imageHolder {
    width: 100%;
    height: 350px;
    background: url(../images/why_earth-img.jpg) no-repeat center center;
    background-size: contain;
    align-items: center;
    display: inline-flex;
  }
  .oc_imageHolder {
    background: url(../images/waldorf_edu_img-hori.png) no-repeat center center;
    background-size: contain;
    height: 360px;
  }
  .contentHolder {
    width: 85%;
    height: 155px;
    display: block;
    margin: 0 auto;
  }
  .we_imageHolder h3,
  .oc_imageHolder h3 {
    font-weight: normal;
  }
  .we_imgHolder-vertical,
  .sensory_imgHolder-vertical {
    width: 85%;
    height: 605px;
    background: url(../images/waldorf_edu_img.png) no-repeat center center;
    background-size: contain;
    align-items: center;
    display: inline-flex;
  }
  .sensory_imgHolder-vertical {
    background: url(../images/sensory_img.png) no-repeat center center;
    background-size: contain;
  }
  .we_imgHolder-vertical .contentHolder,
  .sensory_imgHolder-vertical .contentHolder {
    width: 80%;
    height: 100px;
    display: block;
    margin: 0 auto;
  }
  .oc_imgHolder-vertical {
    width: 85%;
    height: 600px;
    background: url(../images/community_img_ver.png) no-repeat center center;
    background-size: contain;
    align-items: center;
    display: inline-flex;
  }
  .oc_imgHolder-vertical .contentHolder {
    width: 80%;
    height: 200px;
    display: block;
    margin: 0 auto;
  }

  .highlightStar {
    font-weight: 500 !important;
    position: relative;
    display: flex;
  }
  .highlightStar:before {
    content: "";
    background: url(../images/astriceal.svg) no-repeat top left;
    width: 40px;
    height: 50px;
    display: flex;
    padding-right: 55px;
  }
  .text-green {
    color: #074509;
  }
  .text-light-green {
    color: #4e806a;
  }
  .top-40 {
    top: 40%;
  }
  strong {
    font-weight: 700;
  }

  .top-10 {
    top: 10%;
  }
  .top-15 {
    top: 15%;
  }
  .top-20 {
    top: 20%;
  }

  .top-35 {
    top: 35%;
  }
  .end-6 {
    right: 6%;
  }
  .end-10 {
    right: 10%;
  }
  .dropdown:hover > .dropdown-menu {
    display: block;
  }

  /* .dropdown > .dropdown-toggle:active {
 
  pointer-events: none;
} */

  .subNav {
    font-size: 16px;
  }

  .subNav li a {
    padding: 0px 15px 10px;
    display: block;
    font-size: 16px;
    margin-left: 35px;
  }
  .dropdown-item:hover {
    background-color: transparent;
  }
  .subNav li {
    position: relative;
  }
  .subNav li:before {
    content: "";
    border-top: 1px solid #707070;
    height: 1px;
    width: 20px;
    top: 10px;
    position: absolute;
    left: 15px;
    display: inline-block;
  }

  .subNav li a.current {
    text-decoration: underline;
    color: #4e806a;
  }

  .waldorf_education_section {
    min-height: 100vh;
  }
  a {
    transition: all ease 0.2s;
  }
  a:hover {
    color: #4e806a;
  }

  .bg-paper-bg {
    background: url(../images/paper_bg.jpg) repeat-y center center;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: relative;
  }

  .bg-paper-bg:before {
    content: "";
    height: 150px;
    background: url(../images/paper_top_bg.jpg) no-repeat center center;
    background-size: cover;
    width: 100%;
    display: block;
    position: absolute;
    top: -150px;
    z-index: -1;
  }
  .bg-paper-bg:after {
    content: "";
    height: 150px;
    background: url(../images/paper_bottom_bg.jpg) no-repeat center center;
    background-size: cover;
    width: 100%;
    display: block;
    position: absolute;
    bottom: -150px;
    z-index: -1;
  }

  .enrolSection .leafUL {
    padding: 0;
    margin: 0 auto;
  }

  .the_essence_core_section,
  .enrolSection {
    min-height: 100vh;
    /* padding-bottom: 160px !important; */
  }
  .table-responsive-stack {
    border: 0;
    background: transparent;
    width: 93%;
    margin: 0 auto;
  }
  .table-responsive-stack tr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
  .table-responsive-stack th {
    font-weight: normal;
    font-size: 13px;
  }
  .table-responsive-stack td {
    font-weight: bold;
    font-size: 13px;
    padding-top: 35px;
  }
  .table-responsive-stack td,
  .table-responsive-stack th {
    display: block;
    background: transparent;
    border-bottom: 0;
    /*      
   flex-grow | flex-shrink | flex-basis   */
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
  }

  .table-responsive-stack .table-responsive-stack-thead {
    font-weight: bold;
  }

  @media screen and (max-width: 768px) {
    .table-responsive-stack tr {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      border-bottom: 3px solid #ccc;
      display: block;
    }
    /*  IE9 FIX   */
    .table-responsive-stack td {
      float: left\9;
      width: 100%;
    }
  }

  .oclTitle {
    font-size: 22px !important;
    font-weight: 800 !important;
  }

  #timeTable {
    font-size: 16px;
    background: url("../images/childhood_timetable_bg.png") no-repeat center center;
    background-size: cover;
    width: 100%;
    height: 317px;
  }
  #timeTable img {
    max-width: 100%;
  }
  .ttbg {
    background: url("../images/tt_bg.png") no-repeat center center;
    background-size: cover;
    width: 100%;
    height: auto;
    min-height: 315px;
    padding: 75px 0;
  }

  .tt_horiline {
    position: absolute;
    top: 40%;
  }
  #timeTable .ttItem {
    padding-top: 15px;
  }

  #timeTable .border-end {
    border-right: 32px solid orange;
    border-image: url(../images/tt_verline.png);
    border-image-slice: 11;
    border-image-width: 7px 7px 7px 0px;
    border-image-outset: 0px;
    height: 200px;
  }

  @media screen and (min-width: 1400px) {
    #timeTable {
      width: 90%;
      height: 400px;
    }
    .tt_horiline {
      position: absolute;
      top: 35%;
    }
  }
  .accordion-button {
    text-transform: none;
  }
  .accordion-button[aria-expanded="true"] {
    background: #4e806a;
    border: 1px solid #4e806a;
    color: #fff;
    padding: 10px 30px;
  }
  .accordion-button[aria-expanded="false"] {
    background: transparent;
    border: 1px solid #4e806a;
    color: #8a8a8a;
    padding: 10px 30px;
  }
  .accordion-flush > .accordion-item {
    margin-bottom: 5px;
  }
  .accordion-item {
    border-bottom: 0;
  }
  /* .accordion-button:not(.collapsed)::after {
  background: transparent;
  color: white;
} */

  .services-tab .nav-tabs .nav-item .nav-link.active {
    color: #4e806a;
    text-decoration: underline;
  }
  .services-tab .nav-tabs .nav-item .nav-link {
    color: #8a8a8a;
  }
  .nav-tabs {
    border-bottom: 0;
  }

  #hiringImgTab img {
    border-radius: 15px;
    max-width: 85%;
  }

  #communityImgTab img {
    border-radius: 15px;
    max-width: 100%;
  }

  .accordion-button:not(.collapsed)::after,
  .accordion-button[aria-expanded="true"]::after {
    content: "";
    width: 44px;
    height: 44px;
    border-radius: 0 30px;
    background-size: 50%;
    background-color: #fff;
    transform: rotate(0deg);
  }
  .accordion-button::after {
    content: "";
    width: 44px;
    height: 44px;
    border-radius: 0 30px;
    background-color: #4e806a;
    transform: rotate(0deg);
    background-size: 50%;
  }

  .accordion-button[aria-expanded="true"]::after {
    background-image: var(--bs-accordion-btn-active-icon);
  }

  .guidingPrinciples {
    margin-top: 0px;
  }

  .guidingNumber {
    font-size: 5rem;
    font-weight: 100;
    display: inline-block;
    line-height: 1;
    margin-right: 5%;
    color: #8c8938;
  }

  .guidingTilteNumberWrap h3 {
    display: inline-block;
  }
  .guidingTilteNumberWrap {
    display: flex;
  }
  .text-brownGreen {
    color: #8c8938;
  }

  #ourBelief {
    overflow: clip !important;
  }
  .profImg img {
    max-width: 60%;
  }

  .leafUL {
    width: 80%;
    padding-left: 10%;
    color: rgba(78, 128, 106, 0.86);
  }

  .leafUL li:before {
    content: "";
    display: inline-block;
    height: 25px;
    width: 30px;
    position: relative;
    background-image: url(../images/astriceal.svg);
    background-size: 18px;
    top: 10px;
    background-repeat: no-repeat;
    /* margin-top: 11px; */
    margin-left: -34px;
  }
  .brownleafUL li:before {
    content: "";
    display: inline-block;
    height: 25px;
    width: 30px;
    position: relative;
    background-image: url(../images/leaf-browngreen.png);
    background-size: 18px;
    top: 10px;
    background-repeat: no-repeat;
    /* margin-top: 11px; */
    margin-left: -30px;
  }

  .enlarge_icon {
    top: 2%;
    right: 6%;
  }
  .new_icon {
    top: 2%;
    right: 6%;
    z-index: 2;
  }
  .eventsOverlayWrap {
    background: rgba(78, 128, 106, 0.86);
    width: 100%;
    height: 100%;
    justify-items: center;
    align-content: center;
    z-index: 1;
    left: 0;
    top: 0;
    visibility: hidden;
    transform: translateY(100%);
    transition: all 0.3s ease-in-out;
    position: absolute;
    text-align: center;
  }
  .eventImgWrap {
    border-radius: 15px;
    overflow: hidden;
    transition: all 0.2s linear;
    position: relative;
    cursor: pointer;
  }
  .eventImgWrap:hover .eventsOverlayWrap {
    visibility: visible;
    transform: translateY(0);
  }
  .customModalCloseBtn {
    right: 2%;
  }
  .tb_sb__b_cont {
    background-color: transparent !important;
  }

  .date {
    font-size: 18px;
  }
  .pasteventWrap h5 {
    font-family: "Nunito Sans", sans-serif;
    transition: all 0.2s ease;
  }

  a:hover .pasteventWrap h5 {
    color: #4e806a;
  }

  .dropdownselect {
    border: 1px solid #707070;
    border-radius: 50px;
    font-size: 14px;
    padding: 5px 10px;
    background-color: transparent;
  }
  .eventdropMenu {
    font-size: 14px;
    min-width: 100px;
  }
  .eventdropMenu a {
    font-size: 14px;
  }
  .eventdropMenu a.dropdown-item {
    padding: 5px;
  }

  .bg-brown {
    background-color: #614e22;
  }

  .eventThumbnail li {
    width: 70px;
    margin: 5px;
    overflow: hidden;
    height: 70px;
    position: relative;
    border-radius: 15px;
  }

  .eventThumbnail li img.active {
    border: 0px solid #074509 !important;
    opacity: 1;
  }
  .eventThumbnail li img {
    border-radius: 15px;
    border: 0px solid #fff !important;
    opacity: 0.5;
    transition: all 0.2s ease;
    position: absolute;
  }
  .eventDetailsSection {
    padding: 0 0 100px;
  }

  .profileImg img {
    border-radius: 15px;
    max-width: 100%;
  }
  .profileImg {
    border-radius: 15px;
    position: relative;
  }
  .profileImg::after {
    content: "";
    position: absolute;
    background: url(../images/profile-outline.png) no-repeat center center;
    width: 110%;
    height: 110%;
    z-index: 2;
    top: -5%;
    left: -5%;
    background-size: 200px 200px;
  }
  .teacherName {
    margin-top: 5px;
  }
  .teacherPosition {
    font-style: italic;
  }
  .teacherProfileOverlay {
    background: rgba(160, 203, 191, 0.86);
    width: 100%;
    height: 100%;
    justify-items: center;
    align-content: center;
    z-index: 1;
    left: 0;
    top: 0;
    visibility: hidden;
    transition: all 0.2s ease-in-out;
    transform: scale(0);
    position: absolute;
    text-align: center;
    border-radius: 15px;
    opacity: 0;
  }

  .profileWrap {
    transition: all 0.2s linear;
    position: relative;
    cursor: pointer;
  }

  .profileWrap:hover .teacherProfileOverlay {
    visibility: visible;
    transform: scale(1);
    opacity: 1;
  }
  .enrollStep {
    width: 100%;
    height: 250px;
    background: url(../images/enroll_green2.png) no-repeat center center;
    background-size: 100%;
    position: relative;
  }
  .enrollStep-long {
    width: 100%;
    height: 250px;
    background: url(../images/enroll_green3.png) no-repeat center center;
    background-size: 100%;
    position: relative;
  }
  .enrollStep-brown {
    width: 100%;
    height: 250px;
    background: url(../images/enroll_brown2.png) no-repeat center center;
    background-size: 100% 94%;
    position: relative;
  }

  .enrollStep h6 {
    position: absolute;
    top: 70px;
    left: 25px;
    font-weight: normal;
    width: 85%;
    font-size: 34px;
    color: #4e806a;
  }

  .enrollStep p {
    position: absolute;
    top: 110px;
    left: 25px;
    font-weight: normal;
    width: 85%;
    font-size: 15px;
    color: #2e2e2e;
  }

  .enrollStep-long h6 {
    position: absolute;
    top: 70px;
    left: 25px;
    font-weight: normal;
    width: 85%;
    font-size: 34px;
    color: #4e806a;
  }

  .enrollStep-long p {
    position: absolute;
    top: 110px;
    left: 25px;
    font-weight: normal;
    width: 85%;
    font-size: 15px;
    color: #2e2e2e;
  }

  .enrollStep span {
    position: absolute;
    top: 30px;
    left: 10%;
    font-family: "earth_tonebold";
    font-size: 22px;
    color: #4e806a;
  }
  .enrollStep-long span {
    position: absolute;
    top: 30px;
    left: 10%;
    font-family: "earth_tonebold";
    font-size: 22px;
    color: #4e806a;
  }
  .enrollStep-brown span {
    position: absolute;
    top: 30px;
    left: 10%;
    font-family: "earth_tonebold";
    font-size: 22px;
    color: #614e22;
  }
  .enrollStep-brown p {
    position: absolute;
    top: 110px;
    left: 25px;
    font-weight: normal;
    width: 85%;
    font-size: 15px;
    color: #2e2e2e;
  }
  .enrollStep-brown h6 {
    position: absolute;
    top: 70px;
    left: 25px;
    font-weight: normal;
    width: 85%;
    font-size: 34px;
    color: #614e22 !important;
  }

  .fs-35 {
    font-size: 35px;
  }
  #enrollmentBg {
    background: url(../images/enrollment_bg_long.png) no-repeat center center;
    width: 100%;
    background-size: cover;
    margin: 0 auto;
    height: 868px;
    position: relative;
    padding: 115px 0px;
    top: -232px;
  }

  .bg-paper-bg-contact {
    background: url(../images/paper_bg.jpg) repeat-y center center;
    background-size: cover;
    width: 100%;
    height: 100%;
    top: 100px;
    position: relative;
  }
  .planVisit.bg-paper-bg-contact {
    top: -8px;
  }

  .bg-paper-bg-contact:before {
    content: "";
    height: 150px;
    background: url(../images/paper_top_bg.jpg) no-repeat center center;
    background-size: cover;
    width: 100%;
    display: block;
    position: absolute;
    top: -150px;
    z-index: -1;
  }

  .bg-paper-bg-contact:after {
    content: "";
    height: 150px;
    background: url(../images/paper_bottom_bg.jpg) no-repeat center center;
    background-size: cover;
    width: 100%;
    display: block;
    position: absolute;
    bottom: -150px;
    z-index: -1;
  }

  .feeWrap {
    background: #fff;
    border-radius: 15px;
    position: relative;
    width: 100%;
    height: 410px;
    padding: 25px;
    position: relative;
    font-size: 18px;
  }
  .feeWrap:before {
    content: "";
    background: url(../images/fee_outline_long.svg) no-repeat center center;
    width: 435px;
    height: 445px;
    top: -20px;
    left: -15px;
    background-size: contain;
    position: absolute;
  }

  .enrollTitle {
    font-size: 1.75rem;
  }
  .feeUL {
    padding-left: 50px;
  }
  .feeUL li:before {
    content: "";
    display: inline-block;
    height: 50px;
    width: 50px;
    position: relative;
    background-image: url(../images/fee_li_img.png);
    background-size: 40px;
    top: 30px;
    background-repeat: no-repeat;
    /* margin-top: 11px; */
    margin-left: -50px;
  }

  .discountBadge {
    position: absolute;
    font-family: "ganttlets";
    color: #4e806a;
    top: 6%;
    font-size: 25px;
    right: 7%;
  }
  .discountBadge::after {
    content: "";
    background: url(../images/discountwrap_bg.png) no-repeat center center;
    width: 210px;
    height: 50px;
    display: block;
    position: absolute;
    background-size: cover;
    top: -11px;
    left: -24px;
  }

  .lh-0 {
    line-height: 0;
  }

  .planvisitTitle {
    font-size: 24px;
    font-weight: bold !important;
    color: #4e806a;
    font-family: "Nunito Sans", sans-serif;
    margin-bottom: 0;
    line-height: 1.2;
  }
  .contactAdmissionSection {
    padding: 200px 0 50px;
    min-height: 100vh;
    position: relative;
    top: 100px;
  }

  #bookingFormBg {
    background: url(../images/paper_bg_img_visit_form.jpg) no-repeat center center;
    width: 100%;
    height: 100%;
    background-size: cover;
    border-radius: 15px;
  }

  /* small icon sizing for input-group */
  .input-group .input-group-text svg {
    width: 1rem;
    height: 1rem;
  }
  .input-group-text {
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #2e2e2e;
    padding-right: 15px;
  }
  #endTime:disabled,
  #endTime2:disabled {
    background-color: transparent;
  }

  .form-check-input:checked {
    background-color: #4e806a;
    border-color: #4e806a;
  }

  .owl-theme .owl-nav {
    position: absolute;
    top: 50%;
    width: 100%;
  }

  .owl-carousel .owl-nav button.owl-next {
    position: absolute;
    right: 0;
    font-size: 65px;
    line-height: 0;
    color: #4e806a !important;
  }
  .owl-carousel .owl-nav button.owl-prev {
    left: 0;
    position: absolute;
    font-size: 65px;
    line-height: 0;
    color: #4e806a;
  }
  .owl-theme .owl-dots .owl-dot.active span {
    background-color: #4e806a;
  }

  .modal p {
    font-size: 16px;
    color: #2e2e2e;
  }

  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
  }

  input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield; /* Firefox */
  }

  input.form-control,
  input.form-control:focus,
  select.form-control,
  select.form-control:focus,
  textarea.form-control,
  textarea.form-control:focus {
    color: #2e2e2e;
  }

  .head-0 {
    background: transparent;
  }
  .owl-carousel .owl-stage-outer {
    border-radius: 15px;
  }

  .waldorf_education_section .accordion img {
    max-width: 50%;
  }

  .tb_wall_header__ {
    z-index: 1 !important;
  }
  .tt_horiline {
    top: 70px;
  }
  #timeTable {
    width: 90%;
    height: 385px;
  }
  #ttContent {
    margin-top: 80px;
  }
  #timeTable .ttItem {
    font-size: 16px;
  }
  #timeTable .ttItem span {
    font-size: 14px;
    display: block;
  }
}

/* Utility: force zero right-margin for small screens if needed */
@media (max-width: 991.98px) {
  .banner-section a.mr-3,
  .mr-3 {
    margin-right: 0 !important;
  }
}