@media only screen and (min-width: 768px) {

    p,
    a,
    footer .top_foot .locatetext,
    .form-control,
    button,
    label, .customul li, ul li a, li {
        font-size: 14px;
    }

    .radius {
        border-radius: 25px;
    }

    .padding {
        padding: 55px 0;
    }

    .container-fluid {
        padding: 0 16px;
    }

    .header_nav {
        padding: 5px 19px;
    }

    .burgermenu>img {
        width: 28px;
    }

    .burgermenu {
        width: 47px;
        height: 47px;
    }

    header .offcanvas-body {
        padding-top: 52px;
        padding-left: 34px;
    }

    #menuoffcanvas .offdeco img {
        width: 362px;
    }

    .subheading {
        font-size: clamp(18px, 2vw, 27px);
        margin-bottom: -3px;
    }

    .mainbannerheading {
        font-size: clamp(30px, 4vw, 58px);
    }

    .bannerhead {
        display: flex;
        gap: 9px;
    }

    section.banner .card img {
        height: 40vh;
        object-position: right;
    }

    section.banner .card-img-overlay {
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 32.3%, #000000 112.16%);
    }

    section.banner .headingtextdiv {
        transform: translateY(0);
    }

    .txtlinediv {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;
        margin-bottom: 0;
    }

    .textdiv {
        writing-mode: vertical-rl;
        transform: rotate(180deg);
    }

    .textline {
        width: 1px;
        height: 74px;
        background-color: #ffffff;
    }

    .textline.darkline {
        height: 100%;
    }

    section.banner .card .headingtextdiv p {
        width: 100%;
    }

    /* section.aboutus .bannerhead,
    section.aboutus .aboutimgdiv {
        padding: 80px 0;
    } */

    section.aboutus {
        background-size: 780px;
    }

    section.aboutus .aboutimgdiv img {
        width: 87% !important;
        margin: 0 auto;
        display: flex;
        justify-content: center;
    }

    .parawidth {
        width: 84%;
    }

    section.activities .mandalaart .mandalaimg,
    section.workshop .mandalaart .mandalaimg, section.therapydetails .mandalaart .mandalaimg {
        width: 321px;
        width: 451px;
        top: -206px;
        left: -181px;
    }

    .linedecimg {
        width: 260px;
    }

    section.activities .activitydiv {
        padding: 36px 20px;
        border-radius: 25px;
    }

    section.activities .activitydiv .activity_icon {
        width: 47px;
    }

    .musicicondiv {
        display: block;
        position: absolute;
        right: -121px;
        z-index: 2;
        top: -203px;
    }

    .music-path {
        stroke-dasharray: 1000;
        stroke-dashoffset: 1000;
        transition: stroke-dashoffset 5.5s cubic-bezier(.4, 0, .2, 1);
    }

    section.therapy_work .box {
        width: 96%;
        padding: 26px 22px;
        border-radius: 20px;
    }

    section.therapy_work .pointer {
        width: 22px;
        height: 22px;
    }

    section.therapy_work .pointer::after {
        left: -30px;
        width: 12px;
        height: 12px;
    }

    section.therapy_work .pointer.second {
        left: -30px;
    }

    .musicnotes>img {
        bottom: -80px;
        width: 394px;
    }

    section.connectwithus .card .connectimg {
        height: 435px;
    }

    section.connectwithus .card-img-overlay .videoicon {
        width: 100px;
    }

    section.connectwithus {
        margin-top: -150px;
    }

    footer .top_foot {
        padding: 55px 0;
    }

    footer .top_foot .locatetext {
        width: 61%;
    }

    footer .top_foot .form-control {
        padding: 6px 14px;
    }

    section.other_banner .card img {
        height: 24vh;
        object-position: center;
    }

    .field-group {
        flex: 1;
    }

    .form_group {
        display: flex;
        gap: 10px;
    }

    section.contact_uspage .box {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 26px 29px;
    }

    .customul li {
    /* margin-left: 1rem; */
}
}

@media only screen and (min-width: 992px) {
    body {
        overflow-x: initial !important;
        /* overflow-y: initial !important; */
    }

    .container-fluid {
        padding: 0 44px;
    }

    .padding {
        padding: 100px 0;
    }

    .header_ul {
        display: flex;
        align-items: center;
        gap: 34px;
    }

    .main_header {
        margin-top: 20px;
    }

    .header_ul .nav__items {
        display: block;
    }

    .header_nav {
        padding: 5px 26px;
    }

    header nav .nav__items {
        font-size: 15px;
    }

    section.banner .card img {
        height: auto;
    }

    section.banner .headingtextdiv {
        transform: translateY(-7px);
    }

    section.aboutus {
        background: url(../images/about_bg.webp) no-repeat left top;
        background-size: 366px;
    }

    section.aboutus .bannerhead,
    section.aboutus .aboutimgdiv {
        padding: 80px 0;
    }

    section.aboutus .aboutimgdiv img {
        width: 100% !important;
    }

    .mandalaart {
        display: block;
    }

    .mandalaimg {
        position: absolute;
        right: -189px;
        top: -219px;
        animation: rotate 30s linear infinite;
        width: 402px;
    }

    @keyframes rotate {
        0% {
            rotate: 0deg;
        }

        100% {
            rotate: 360deg;
        }
    }

    /* section.activities {
        overflow: hidden;
    } */

    .parawidth {
        width: 50%;
    }

    section.activities .mandalaart .mandalaimg,
    section.workshop .mandalaart .mandalaimg, section.therapydetails .mandalaart .mandalaimg {
        right: auto;
        left: -234px;
        top: -99px;
    }

    section.activities .activitydiv {
        transition: all 0.6s ease;
    }

    section.activities .activitydiv:hover {
        box-shadow: 0px 0px 15px #864a001f;
        transform: translateY(-10px);
    }

    section.therapy_work .parawidth {
        width: 81%;
    }

    section.therapy_work .box {
        margin-bottom: 39px;
        transform: translateX(0);
        width: 100%;
    }

    section.therapy_work .timeline::before {
        left: -30px;
        height: 105%;
    }

    section.therapy_work .pointer {
        left: -42px;
        width: 26px;
        height: 26px;
    }

    section.therapy_work .pointer.second {
        left: -42px;
        top: 18px;
    }

    section.therapy_work .pointer::after {
        width: 15px;
        height: 15px;
        left: 50%;
    }

    section.conditions_support .conddiv {
        overflow: hidden;
        transition: all 3s ease;
    }

    section.conditions_support .conddiv .imgdiv {
        overflow: hidden;
    }

    section.conditions_support .conddiv .imgdiv img {
        transition: all 3s ease;
        height: auto;
    }

    section.conditions_support .conddiv:hover .imgdiv img {
        scale: 1.1;
    }

    section.workshop .card {
        overflow: hidden;
        transition: all 0.8s ease;
    }

    section.workshop .card:hover {
        transform: translateY(-20px);
    }

    section.workshop .card img {
        transition: all 7s ease;
        height: auto;
        object-position: center;
    }

    section.workshop .card:hover img {
        scale: 1.2;
    }

    section.workshop .card-img-overlay {
        padding: 10px 18px;
        padding-bottom: 15px;
    }

    section.testimonials .testirow {
        width: 100%;
    }

    section.testimonials .item {
        padding-top: 55px;
    }

    footer .top_foot {
        padding: 59px 0;
    }

    section.other_banner .card img {
        height: 52vh;
    }

    section.other_banner .card-img-overlay .contentbox {
        transform: translateY(15px);
    }

    .floating-label,
    .floating-field {
        font-size: 16px;
    }

    input.floating-field,
    select.floating-field {
        height: 54px;
    }

    .select-wrapper .floating-label {
        top: 50%;
    }
}

@media only screen and (min-width: 1200px) {

    p,
    a,
    .form-control,
    button,
    label, .customul li, ul li a, li {
        font-size: 15px;
    }

    .lightbtn,
    .darkbtn {
        padding: 10px 25px;
    }

    header nav .nav__items {
        font-size: 16px;
    }

    header nav .logo_img {
        width: 53px;
    }

    .container-fluid {
        padding: 0 60px;
    }

    .header_ul {
        gap: 53px;
    }

    .textline {
        height: 109px;
    }

    .subheading {
        font-size: clamp(18px, 3vw, 27px);
    }

    .mainbannerheading {
        font-size: clamp(30px, 3vw, 58px);
    }

    .mainheading {
        font-size: clamp(23px, 3vw, 40px);
    }

    section.aboutus {
        background-size: auto;
    }

    .mandalaimg {
        width: 480px;
    }

    section.therapy_work .textwidth {
        width: 66%;
    }

    section.connectwithus .textwidth {
        width: 94%;
    }

    section.testimonials .mandalaart .mandalaimg {
        width: 378px;
    }

    footer .top_foot .locatetext {
        font-size: 15px;
    }
}

@media only screen and (min-width: 1400px) {

    p,
    a,
    .form-control,
    button,
    label, .customul li, ul li a, li {
        font-size: 16px;
    }

    .container-fluid {
        padding: 0 71px;
    }

    header nav .nav__items {
        font-size: 18px;
    }

    header nav .logo_img {
        width: 60px;
    }

    .header_nav {
        padding: 5px 37px;
    }

    .burgermenu {
        width: 56px;
        height: 56px;
    }

    .burgermenu>img {
        width: 35px;
    }

    section.therapy_work .textwidth {
        width: 59%;
    }

    section.connectwithus .textwidth {
        width: 85%;
    }

    section.testimonials .mandalaart .mandalaimg {
        width: 413px;
    }

    .subtextheading {
        font-size: clamp(20px, 3vw, 27px);
    }

    .question__faqs.subtextheading {
        font-size: clamp(18px, 3vw, 22px);
    }

    section.conditions_support .conddiv .subtextheading {
        font-size: clamp(18px, 3vw, 24px);
    }
}

@media only screen and (min-width: 1600px) {
    .textwidth {
        width: 80%;
    }

    .parawidth {
        width: 39%;
    }
}