@media (max-width: 500px) {
    body {
        font-size: 13px;
    }
    nav.navbar.mobile-active {
        font-size: 16px;
    }
    nav.navbar.mobile-active .create-appointment, nav.navbar.mobile-active .create-appointment a {
        width: 100%;
    }
    .section-title {
        font-size: 24px;
    }
    .btn {
        padding: 12px 18px;
        font-size: 18px;
    }
    .page-header {
        flex-direction: column;
    }
    .page-header .breadcrumb {
        position: relative;
        left: initial;
        top: initial;
        align-self: start;
    }
    .teshis-cta {
        padding: 20px;
        flex-direction: column;
        align-items: start;
    }
    .teshis-cta .texts {
        max-width: 100%;
    }
    .teshis-cta .texts:before {
        right: -5px;
        bottom: -30px;
        left: initial;
        top: initial;
        transform-origin: center;
        transform: rotate(180deg);
    }
    .teshis-cta .texts:after {
        top: -8px;
        right: 10px;
        bottom: initial;
        left: initial;
        transform: rotate(-90deg);
        transform-origin: center;
    }
    footer .content {
        flex-direction: column;
    }
    footer .content .footer-nav .cols {
        justify-content: space-between;
    }
    .app-content {
        padding: 20px 0;
    }

    /*** Home ***/
    .welcome .section-title {
        text-align: center;
    }
    .welcome .welcome-text {
        font-size: 16px;
    }
    .welcome-video {
        margin-top: 40px;
    }
    .online-seminar .info {
        font-size: 11px;
    }
    .online-seminar .info .headline, .online-seminar .actions {
        font-size: 13px;
    }
    .why-us .stats .item .number {
        font-size: 20px;
    }
    .why-us > .text {
        font-size: 16px;
    }
    .features {
        display: flex;
        flex-direction: column;
    }
    .features .item {
        max-width: 100%;
    }
    .therapists .action, .therapists .action a {
        width: 100%;
    }
    .most-cases .section-title, .most-cases .info-text {
        text-align: center;
    }
    .most-cases .info-text {
        font-size: 16px;
    }
    .most-cases .list {
        margin-top: 20px;
        display: flex;
        flex-direction: column;
    }
    .most-cases .list .items .item {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .most-cases .list .items .content, .most-cases .list .items .item .video {
        width: 100%;
    }
    .most-cases .list .items .item .video .player .title {
        font-size: 13px;
    }
    .most-cases .list .items .item .title {
        display: none;
    }
    /*.testimonials .list {*/
    /*    display: flex;*/
    /*    flex-direction: column;*/
    /*}*/
    /*.testimonials .list .item:nth-child(even) {*/
    /*    flex-direction: column;*/
    /*}*/
    /*.testimonials .action {*/
    /*    margin: 20px 0 0 0;*/
    /*    width: 100%;*/
    /*}*/
    /*.testimonials .action a {*/
    /*    width: 100%;*/
    /*}*/
    .faq {
        margin: 0;
    }
    .faq .section-title {
        text-align: left;
        position: relative;
    }
    .faq .section-title:after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 66px;
        height: 67px;
        background: url('/assets/img/icons/faq-title.svg') no-repeat;
    }
    .faq .action, .faq .action a {
        width: 100%;
    }
    .tests .list {
        margin-top: 20px;
        gap: 10px;
        display: flex;
        flex-direction: column;
    }
    .why-face {
        margin-bottom: 0;
    }
    .videos .mt-80x {
        margin-top: 40px !important;
    }
    .videos .slick-slide img {
        width: 50px;
    }
    .videos .list .item.slick-active .play-video {
        left: 50px;
        right: 50px;
        width: calc(100% - 100px);
    }
    .videos .list .item .arrows a {
        width: 50px;
    }
    .articles {
        margin-top: 40px;
    }
    .articles .slider {
        padding-left: calc(var(--bs-gutter-x)* .5);
    }
    .articles .list {
        margin-top: 20px;
        gap: 10px;
    }
    .branches {
        margin-top: 40px;
    }
    .branches .list {
        display: flex;
        flex-direction: column;
    }
    .branches .list .items .item .title {
        width: 100%;
    }
    .branches .list .items .item .data {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .home-cta {
        margin-top: 40px;
        margin-bottom: 40px;
    }
    .therapists {
        overflow: hidden;
    }



    /*** About Us ***/
    .milestones {
        margin-top: 20px;
    }
    .milestones .list {
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-top: 20px;
    }
    .vision {
        margin-top: 20px;
        font-size: 16px;
    }
    .values .list {
        display: flex;
        flex-direction: column;
    }
    .founders .list .item {
        flex-direction: column;
    }


    /*** Experts ***/
    .experts .list {
        grid-template-columns: repeat(2, 1fr);
    }


    /*** Service ***/
    .service-list {
        display: flex;
        flex-direction: column;
    }

    /*** Articles Page ***/
    .article-list {
        display: flex;
        flex-direction: column;
    }


    /*** Article Detail Page ***/
    .article {
        font-size: 16px;
    }
    .article > .title {
        font-size: 20px;
    }
    .article .meta {
        flex-direction: column;
        align-items: start;
        gap: 10px;
    }

    /*** Contact ***/
    .contact .result {
        width: 100%;
    }
    .contact .action, .contact .action a {
        width: 100%;
    }
    .contact .result > .text {
        font-size: 16px;
    }
    .contact .result .social a {
        padding: 12px 20px;
    }

    .videos .list .item .meta {
        left: 0;
        bottom: 10px;
    }
    .videos .list .item .title {
        font-size: 13px;
        padding: 8px 12px;
    }
    /*** Test ***/
    .test {
        padding-bottom: 50px;
    }
    .test .result {
        width: 100%;
    }

    .calendar-container {
        padding: 12px;
    }

    .appointment .result {
        width: 100%;
    }

    .videos .section-title, .videos .text, .branches .section-title, .branches .text, .tests .section-title {
        text-align: center;
    }

    .articles .list .item {
        font-size: 16px;
        width: 100vh;
    }

    .testimonials .list {
        display: inline-flex;
        white-space: nowrap;
        width: 100%;
    }
    .testimonials .list .item {
        width: 85%;
        position: relative;
        margin: 0 auto;
    }
    .testimonials .list .item:not(.active) {
        display: none;
    }
    .testimonials .list .item:nth-child(even) {
        flex-direction: column;
    }
    .testimonials .list .item .image {
        aspect-ratio: 1/1;
        width: 100%;
    }
    .testimonials .list .item .image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .testimonials .list .item .info {
        flex-wrap: wrap;
    }
    .testimonials .list .item .info > * {
        width: 100%;
        text-align: center;
    }
    .testimonials .list .item .info .text {
        white-space: normal;
    }

    .testimonials .list .item:nth-child(even) .info {
        margin-top: 20px;
    }

    .therapists .list {
        display: flex;
        flex-direction: column;
    }
    .therapists .list .item .image {
        aspect-ratio: 1;
    }
    .therapists .list .item:not(.active) {
        display: none;
    }
    .therapists .list .arrows {
        display: block;
    }

    .testimonials .list .arrows {
        display: block;
    }

    .mobile-horizontal-slider {
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        width: 100%;
        overflow-x: auto;
        position: relative;
    }

    .welcome-videos .arrows {
        width: 30px;
    }
    .welcome-videos .arrows img {
        width: 30px;
        height: 30px;
    }
    .welcome-videos .arrows a {
        width: 30px;
    }
    .welcome-videos .arrows a.prev {
        left: 0;
    }

    .page-tests .list .item {
        background-color: white;
        border: solid 1px #fff0e6;
    }
    .page-tests .list .item {
        width: 100%;
        flex-direction: column;
        background-color: transparent;
        border: none;
        justify-content: center;
        align-items: center;
    }
    .page-tests .list .item .name {
        font-weight: 600;
    }
    .page-tests .list .item .info {
        justify-content: center;
        align-items: center;
        gap: 12px;
    }
    .page-tests .list .item .actions {
        width: 100%;
    }
    .page-tests .list .item .actions a {
        border: 1px solid #E8E8E8;
        width: 100%;
        padding: 16px 0;
        font-size: 20px;
        font-weight: 600;
        display: block;
        text-align: center;
        text-decoration: none;
    }

    .therapists .action {
        flex-direction: column;
    }

    .app-content.bg-page:before {
        left: -130px;
        top: 10px;
        background-size: 80%;
    }

    .filters .filter-records a {
        padding: 8px 16px;
    }

    .video-list {
        display: flex;
        flex-direction: column;
    }

    .create-appointment a {
        width: 100%;
    }

    .page-single-terapi .video a:after {
        background-size: 100px 100px;
    }

}