@media (max-width: 991.98px) {
    html {
        font-size: 14px;
    }
    .hero-section .content-box .title-box {
        font-size: 2rem;
    }
    .hero-section .content-box .title-box .title {
        font-size: 3rem;
    }
    .about-section .content-label {
        gap: 0.75rem;
        padding: 0.5rem 1rem 0.75rem;
    }
    .about-section .content-label.content-label-1 {
        width: 55%;
    }
    .about-section .content-label.content-label-2 {
        width: 50%;
        left: 5%;
        top: 85%;
    }
    .study-section .bg-2 {
        width: 20rem;
    }
    .news-section .tab-title {
        flex-wrap: wrap;
    }
  }
   
  @media (max-width: 767.98px) {
    html {
        font-size: 12px;
    }
    .title-box-icon .title {
        font-size: 1.5rem;
    }
    .container.haft-container-left {
        position: relative;
        left: unset;
        height: unset;
        transform: unset;
    }
    .hero-section .backgournd-circle .circle {
        width: 4rem;
        height: 4rem;
    }
    .hero-section .image-box {
        width: 60%;
        margin-left: 20%;
    }

    .hero-section .content-box {
        padding-top: 7rem;
        height: unset;
        position: relative;
        z-index: 2;
    }
    .hero-section .content-box .text-box {
        height: unset;
    }
    .about-section .container {
        padding-top: 5rem;
    }
    .about-section .line-border.right {
        height: 50%;
        margin-bottom: 30%;
    }
    .about-section .content-label .heading {
        font-size: 1.25rem;
    }
    .about-section .content-label p {
        font-size: 0.75rem;
    }
    .section-team {
        padding: 5rem 0;
    }
    .section-team .image-box {
        position: relative;
        width: 70%;
        margin-left: 15%;
        transform: unset;
        top: unset;
        right: unset;
        padding-top: 0%;
    }
    .section-team .image-box .image-circle {
        top: 0%;
    }
    .program-section {
        padding-top: 3rem;
    }
    .study-section .column-1::before {
        height: 20%;
    }
    .study-section .bg-3 {
        width: 20rem;
        max-width: 50%;
    }
  }
  @media (max-width: 575.98px) {
    html {
        font-size: 10px;
    }
    .title-box-icon {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .title-box-icon svg {
        width: 1.5rem;
        height: 1.5rem;
    }
    .title-box-icon .title {
        font-size: 1.5rem;
        font-weight: bold;
        color: black;
    }
    .hero-section {
        position: relative;
        border-radius: 0px 0px 0px 8rem;
        background: var(--backgournd-hero-color);
        box-shadow: 0px -8px 32px 0px rgba(219, 219, 219, 0.25) inset;
        margin-bottom: 30px;
    }
    .hero-section  .line-border {
        border-bottom-left-radius: 8rem;
    }
    .about-section {
        margin-bottom: 10%;
    }
    .about-section .title-box {
        position: relative;
        top: unset;
    }
    .about-section  .line-border.top {
        border-top-right-radius: 8rem;
    }
    .about-section  .line-border.right {
        border-bottom-right-radius: 8rem;
    }
    .about-section .content-label {
    backdrop-filter: unset;
    }
    .about-section .content-box {
        margin-bottom: 10%;
        margin-top: 10%;
    }
    .about-section .content-label.content-label-2, .about-section .content-label.content-label-1 , .about-section .content-label.content-label-3 {
        display: block;
        position: relative;
        top: unset;
        left: unset;
        width: 100%;
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
    .about-section .orbit-element > .content-label {
       display: none;
    }
    .about-section .orbit .orbit-element .content-label {
        display: none;
    }
    /* .about-section .content-label.content-label-3 {
        width: 80%;
    } */
    .section-team .content-box .degree-box {
        margin-bottom: 2rem;
    }
    .section-team {
        padding: 3rem 0;
    }
    .chapter-4 {
        padding-bottom: 3rem;
    }
    .study-section .bg-2 {
        width: 10rem;
    }
    .study-section .column-1 .content-box {
        padding-left: 1rem;
    }
    .study-section .row .column-2 .title-box::before {
        height: 10rem;
    }
    .tab-title .tab-item.active {
        color: var(--main-color);
        font-weight: bold;
        border-bottom-width: 2px;
        border-bottom-style: solid;
        all: unset;
    }
    .tab-title .tab-item.active .text {
     font-size: 1.25rem;
    }
  }