@media only screen and (max-width: 419px) {
    .barre-container {
        height: 550px !important;
    }

    .barre-container img {
        height: 100%;
        object-fit: cover;
    }

    #studios img {
        min-height: 840px;
    }
}

@media only screen and (max-width: 575px) {
    .overlaytext {
        font-size: 20px !important;
    }

}

@media only screen and (max-width: 767px) {
    .lagree-area-container {
        height: max-content;
    }

    .last-lagree-container {
        height: max-content;
    }

    .lagree-area-container h2 {
        font-size: 34px;
        height: 170px;
        line-height: 34px;
    }

    .last-lagree-container h2 {
        font-size: 34px;
        line-height: 34px;
    }

    .sticky {
        height: fit-content;
        position: relative;
        top: 0;
    }

    .about-area-container {
        padding: 20px;
    }

    .redirection-arrow {
        display: none;
    }

    .banner-video {
        height: 75vh;
    }

    .navbar-area {
        background-color: transparent;
    }

    #testimonials-slider.owl-carousel .owl-item.active.center .testimonials-card-two {
        border: 1px solid #E10F00;
        transform: scale(1);
        height: 300px;
    }

    .testimonials-card-two.card-hovered {
        border: 1px solid #E10F00;
        height: 300px;
        transform: scale(1);

    }

    .testimonials-card-two {
        margin-bottom: 0;
        height: 300px;
    }

    .line-gradient-sidebar-rotate {
        height: 1px;
        background-color: #E10F00;
        transform: rotate(0deg);
        margin-top: 0;

    }

    #my-link[href] {
        visibility: visible;
        pointer-events: auto;
    }

    #my-link:not([href])::before {
        content: attr(data-href);
        visibility: hidden;
        pointer-events: none;
    }

    :root {
        background-color: black;
    }

    .mobile-version {
        display: block;
    }

    .mobile-version2 {
        display: flex;
    }

    .desktop-version {
        display: none;
    }

    .mt-40 {
        margin-top: 20px;
    }

    .mb-25 {
        margin-bottom: 20px;
    }

    .mb-45 {
        margin-bottom: 20px;
    }

    .mb-20 {
        margin-bottom: 20px;
    }

    .pt-45 {
        padding-top: 25px;
    }

    .pb-70 {
        padding-bottom: 50px;
    }

    .pt-70 {
        padding-top: 50px;
    }

    .ptb-70 {
        padding-bottom: 50px;
        padding-top: 50px;
    }

    .pb-100 {
        padding-bottom: 50px !important;
    }

    .pt-150 {
        padding-top: 120px;
    }

    .section-title h2 {
        font-size: 38px;
    }

    .section-title h1 {
        font-size: 38px;
    }

    .single-content h3 {
        font-size: 16px;
    }

    /*================================
Packages Area
===================================*/
    .packages-card-gradient h3 {
        font-size: 28px;
        height: 60px;
    }

    .packages-card-gradient span {
        height: 30px;
        font-size: 18px;
    }

    .packages-card-gradient h5 {
        font-size: 14px;
        margin-top: 10px;
    }

    .packages-card h5 {
        font-size: 14px;
        margin-top: 10px;
    }

    .packages-card-gradient h2 {
        font-size: 32px;
    }

    .packages-card-gradient h4 {
        margin-bottom: 30px;
        font-size: 16px;
    }

    .packages-card-gradient ul li {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .packages-card-gradient .default-btn {
        font-size: 15px;
        width: 80px;
    }

    .healcode-link.healcode-contract-text-link {
        font-size: 15px;
        width: 80px;
    }

    .packages-card h3 {
        font-size: 28px;
        height: 60px;
    }

    .packages-card span {
        height: 30px;
        font-size: 18px;
    }

    .packages-card h2 {
        font-size: 32px;
    }

    .packages-card h4 {
        margin-bottom: 30px;
        font-size: 16px;
    }

    .packages-card ul li {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .packages-card .default-btn {
        font-size: 15px;
        width: 80px;
    }

    /*================================
Navbar Area
===================================*/
    .sidebarmodal .modal-content .modal-body {
        padding: 0 30px;
    }

    .sidebarmodal .modal-content .modal-body .sidebar-about h2 {
        padding-right: 0;
    }

    .centered {
        top: 35vh;
        width: 95%;
    }

    .desktop-nav .navbar {
        padding-right: 10px;
    }

    #nav-icon1 {
        margin: 0;
        font-size: 35px;
        right: 0;
        position: absolute;
        top: 10px;

    }

    .nav-icon-open {
        padding: 10px 25px 25px 0px;
        font-size: 35px;
    }

    .signup-btn {
        margin: 20px 0px 50px 0px;
    }

    .healcode-link.loginRegister {
        font-size: 14px;
    }

    .sidebarmodal .modal-content .modal-body .sidebar-about h3 {
        font-size: 14px;
        padding: 15px 25px 15px 0px;
    }

    .login-btn {
        margin: 15px 25px 15px 0px;
        font-size: 14px;
    }

    .sidebarmodal.modal .modal-dialog,
    .sidebarmodal.right .modal-dialog {
        width: 101%;
    }

    .sidebarmodal.modal.fade.show .modal-dialog,
    .sidebarmodal.right.fade.show .modal-dialog {
        height: 101%;
    }

    .sidebarmodal.modal .modal-content,
    .sidebarmodal.right .modal-content {
        overflow: hidden;
    }

    .social-media-icons {
        position: relative;
        bottom: 0;
        margin-top: 50px;
        margin-left: 0px;
        margin-bottom: 50px;
        width: 100%;
    }

    .header-logo img {
        width: 120px;
        margin-top: 25px;
    }

    .navbar-area.is-sticky {
        height: 70px;
    }

    .black-bg {
        height: 70px;
    }

    /*================================
Achieve-Goals Area
===================================*/
    .machine-image {
        margin-top: 20px;
    }

    .achieve-goals-image-rotate img {
        width: 100px;
    }

    .centered-text {
        position: absolute;
        top: 22%;
        left: auto;
        transform: initial;
        max-width: 540px !important;
    }

    .scroll-rotate {
        margin-bottom: 100px;
        margin-top: -30px;
    }

    .achieve-goals-area p {
        font-size: 14px;
        line-height: 20px;
        max-width: 100%;
        margin-top: 20px;
    }

    .achieve-goals-area .default-btn {
        font-size: 15px;
    }

    /*================================
Our Classes Area
===================================*/
    .our-classes-section h3 {
        font-size: 14px;
        line-height: 20px;
        max-width: 100%;
        text-align: left;
    }

    .our-classes-section .default-btn {
        font-size: 15px;
        margin-top: 20px;
        margin-bottom: 40px;
    }

    .our-classes-container {
        height: 100%;
    }

    .packages-card {
        margin-bottom: 0;
    }

    .packages-card-gradient {
        margin-bottom: 0;
    }

    /*================================
About Us Area
===================================*/
    .area-main-mobile {
        background-position: top;
        background-repeat: no-repeat;
        margin-top: 70px;
        padding: 50% 0;
        height: 100%;
        position: relative;
        background-size: 100% 100%;
    }

    .area-main {
        background-image: none !important;
        background-color: black;
        margin-top: -10px;
        padding: 20px 0 50px 0;
        height: auto;
    }

    .centered-text2 {
        position: relative;
        transform: initial;
        top: initial;
        left: inherit;
    }

    .area-main p {
        font-size: 14px;
        line-height: 20px;
        text-align: left;
        max-width: 100%;
    }

    .about-area-container h2 {
        font-size: 30px;
        line-height: 32px;
    }

    .last-about-container h2 {
        font-size: 30px;
    }

    .last-about-container p {
        font-size: 16px;
        line-height: 20px;
    }

    .last-about-container .default-btn {
        font-size: 15px;
    }

    .about-area-container p {
        height: max-content;
        line-height: 20px;
        font-size: 16px;
    }

    .last-about-container {
        height: max-content;
    }

    .area-main .default-btn {
        font-size: 15px;
        margin-top: 30px;
    }

    /*================================
Classes Page Area
===================================*/
    .classes-area-mobile {
        background-image: url(/assets/mad-classes-banner-mobile.jpg);
        background-position: top;
        background-repeat: no-repeat;
        margin-top: 70px;
        padding: 50% 0;
        height: 100%;
        position: relative;
        background-size: 100% 100%;
    }

    .classes-area {
        background-image: none;
        background-color: black;
        margin-top: -10px;
        padding: 20px 0 50px 0;
        height: auto;
    }

    .classes-area p {
        font-size: 14px;
        line-height: 20px;
        text-align: left;
        max-width: 100%;
    }

    .classes-area .default-btn {
        font-size: 15px;
        margin-top: 30px;
    }

    .text-container h4 {
        font-size: 28px;
    }

    .text-container p {
        font-size: 15px;
        display: none;
    }

    .text-container h5 {
        top: auto;
        margin-right: 15px;
        display: none;
    }

    .description {
        top: 76% !important;
    }

    .description2 {
        top: 82% !important;
    }

    .our-classes-container.active .description2 {
        top: 14% !important;
    }

    .our-classes-container.active .text-container p {
        display: block;
    }

    .our-classes-container.active .text-container h5 {
        display: block;
    }

    .our-classes-container.active .description {
        top: 15% !important;
    }

    .description3 {
        top: 86% !important;
    }

    .our-classes-container.active .description3 {
        top: 40% !important;
    }

    .add-circle {
        display: flex;
    }

    .our-classes-container.active .add-circle {
        display: none;
    }

    .our-classes-container:hover img {
        filter: brightness(0.5);
    }

    /*================================
Gift cards Page Area
===================================*/
    .giftcards-area-mobile {
        background-image: url(/assets/mad-gift-cards-banner-mobile.jpg);
    }

    /*================================
PT Page Area
===================================*/
    .pt-area-mobile {
        background-image: url(/assets/mad-pt-banner-mobile.jpg);
        background-position: top;
        background-repeat: no-repeat;
        margin-top: 70px;
        padding: 50% 0;
        height: 100%;
        position: relative;
        background-size: 100% 100%;
        filter: brightness(50%);
    }

    .pt-area {
        background-image: none;
        background-color: black;
        margin-top: -10px;
        padding: 20px 0 50px 0;
        height: auto;
    }

    .pt-area p {
        font-size: 14px;
        line-height: 20px;
        text-align: left;
        max-width: 100%;
    }

    .pt-area .default-btn {
        font-size: 15px;
        margin-top: 30px;
    }

    .pre-filters {
        grid-template-columns: auto;
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        padding: 0;
    }


    .pre-filters>:first-child {
        grid-column: 1;
        grid-row: 1;
    }

    .pre-filters>:nth-child(2) {
        grid-column: 1;
        grid-row: 2;
    }

    .pre-filters>:nth-child(3) {
        grid-column: 1;
        grid-row: 3;
    }

    .pre-filters>:nth-child(4) {
        grid-column: 1;
        grid-row: 4;
        padding-top: 0px;
    }

    div.healcode .ui-datepicker .ui-datepicker-next span,
    div.healcode .ui-datepicker .ui-datepicker-prev span {
        background-position: initial !important;
        top: 50% !important;
        left: 50% !important;
    }

    .pre-filters>* select {
        font-size: 14px !important;

    }

    .pre-filters>* select optgroup {
        font-size: 14px !important;
    }

    div.healcode.appointments a.hc-button {
        font-size: 15px;
    }

    .ui-datepicker-calendar td a,
    .ui-datepicker-calendar td span,
    .ui-datepicker-calendar th a,
    .ui-datepicker-calendar th span {
        padding: 10px;

    }

    div.healcode.appointments .healcode-appointments {
        margin-top: 20px !important;
    }

    #book-pt {
        scroll-margin-top: 50px;
    }

    #classes-packages {
        scroll-margin-top: 50px;
    }

    #schedule {
        scroll-margin-top: 50px;
    }

    #gifts {
        scroll-margin-top: 50px;
    }

    .packages-row {
        display: flex !important;
        flex-direction: row;
        overflow: scroll;
        flex-wrap: nowrap !important;
    }

    /*================================
Trianers Area
===================================*/
    .team-area-main-mobile {
        background-image: url(/assets/mad-team-banner-mobile.jpg);
        background-position: top;
        background-repeat: no-repeat;
        margin-top: 70px;
        padding: 50% 0;
        height: 100%;
        position: relative;
        background-size: 100% 100%;
        filter: brightness(80%);
    }

    .team-area-main {
        background-image: none;
        background-color: black;
        margin-top: -10px;
        padding: 20px 0 50px 0;
        height: auto;
    }

    .team-area-main p {
        font-size: 14px;
        line-height: 20px;
        text-align: left;
        max-width: 100%;
    }

    .team-area-main .default-btn {
        font-size: 15px;
        margin-top: 30px;
    }

    /*================================
FAQ Area
===================================*/
    .faq-area-main-mobile {
        background-image: url(/assets/mad-faq-banner-mobile.jpg);
        background-position: top;
        background-repeat: no-repeat;
        margin-top: 70px;
        padding: 50% 0;
        height: 100%;
        position: relative;
        background-size: 100% 100%;
        filter: brightness(80%);
    }

    .faq-area-main {
        background-image: none;
        background-color: black;
        margin-top: -10px;
        padding: 20px 0 50px 0;
        height: auto;
    }

    .faq-area-main p {
        font-size: 14px;
        line-height: 20px;
        text-align: left;
        max-width: 100%;
    }

    .faq-area-main .default-btn {
        font-size: 15px;
        position: relative;
        bottom: auto;
        margin-top: 30px;
    }

    .faq-accordion {
        margin-bottom: 0;
        margin-top: 0;
    }

    .faq-accordion .accordion .accordion-title {
        font-size: 18px;
    }

    .faq-accordion .accordion .accordion-content p {
        line-height: 20px;
        font-size: 14px;
        max-width: 100%;
    }

    /*================================
Conatct Page Area
===================================*/
    .contact-area-mobile {
        background-image: url(/assets/mad-contact-banner-mobile.jpg);
        background-position: top;
        background-repeat: no-repeat;
        margin-top: 70px;
        padding: 50% 0;
        height: 100%;
        position: relative;
        background-size: 100% 100%;
        filter: brightness(90%);
    }

    .contact-area {
        background-image: none;
        background-color: black;
        margin-top: -10px;
        padding: 20px 0 50px 0;
        height: auto;
    }

    .contact-area p {
        font-size: 14px;
        line-height: 20px;
        text-align: left;
        max-width: 100%;
    }

    .contact-form .default-btn {
        font-size: 15px;
    }

    .contact-form {
        margin-bottom: 0;
        margin-right: 0;
    }

    .location-area span {
        font-size: 16px;
    }

    .location-area h3 {
        line-height: unset;
        font-size: 16px;
        max-width: 400px;
        margin-bottom: 0;
    }

    .location-area a {
        font-size: 16px;
    }

    .location-area .section-title h2 {
        font-size: 30px;
    }

    /*================================
Privacy Policy Area
===================================*/

    .privacy-policy-area {
        margin-top: 70px;
    }

    .single-content h3 {
        font-size: 16px;
    }

    /*================================
Footer Area
===================================*/
    footer.main-footer {
        padding-top: 50px;
    }

    .widget.footer-logo {
        justify-content: left;
    }

    .widget.footer-logo img {
        width: 120px;
    }

    .footerflex {
        flex-direction: column;
        margin-top: 40px !important;
    }

    div.healcode.prospect form .hc-prospect-field>input {
        height: 40px !important;
        width: 100% !important;
    }

    div.healcode.prospect form .hc_prospect input.submit.hc-prospect-submit {
        height: 38px !important;
    }

    .footer-widgets-section {
        padding-bottom: 0;
    }

    h2.widget-title {
        font-size: 14px;
        margin-left: 0;
    }

    .healcode-prospect-promo-text {
        font-size: 14px !important;
        margin-left: 0;
    }

    .social-media-icons i {
        margin-right: 0;
        margin-left: 30px;
    }

    .overlaytext {
        font-size: 14px;
    }


}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .lagree-area-container h2 {
        font-size: 36px;
        line-height: 36px;
        height: 180px;
    }

    .last-lagree-container h2 {
        font-size: 36px;
    }

    .sticky {
        height: fit-content;
        position: relative;
        top: 0;
    }

    .line-gradient-sidebar-rotate {
        height: 1px;
        background-color: #E10F00;
        transform: rotate(0deg);
        margin-top: 0;

    }

    .description2 {
        top: 89%;
    }

    .our-classes-container:hover .description2 {
        top: 60%;
    }

    .section-title h2 {
        font-size: 58px;
    }

    .section-title h1 {
        font-size: 58px;
    }


    .header-logo {
        width: 150px;
    }

    .desktop-nav .navbar .navbar-nav .nav-item a {
        margin-right: 10px;
        padding-left: 0;
        padding-right: 0;
    }

    .desktop-nav .navbar .navbar-nav .nav-item:last-child a {
        margin-left: 0px;
    }

    .achieve-goals-image-rotate img {
        width: 150px;
    }

    .scroll-rotate {
        margin-bottom: 20px;
    }

    .achieve-goals-area p {
        font-size: 16px;
    }

    .text-container h4 {
        font-size: 28px;
    }

    .text-container h5 {
        top: 260px;
    }

    .description {
        top: 77%;
    }

    .our-classes-container:hover .description {
        top: 8%;
    }

    .description3 {
        top: 85%;
    }

    .our-classes-container:hover .description3 {
        top: 40%;
    }

    .pre-filters>* select {
        font-size: 16px;
    }

    .pre-filters>* select optgroup {
        font-size: 16px !important;
    }

    .faq-area-main {
        height: 120vh;
    }

    .faq-accordion {
        margin-top: 0;
    }

    .faq-area-main .default-btn {
        position: relative;
        bottom: 0;
    }

    .area-main p {
        max-width: 100%;
    }

    .classes-area p {
        max-width: 100%;
    }

    .pt-area p {
        max-width: 100%;
    }

    .team-area-main p {
        max-width: 100%;
    }

    .faq-area-main p {
        max-width: 100%;
    }

    .footerflex {
        margin-top: 40px !important;
    }

    .overlaytext {
        font-size: 18px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .lagree-area-container h2 {
        font-size: 36px;
        line-height: 36px;
        height: 195px;
    }

    .lagree-area-container {
        height: 444px;
    }

    .last-lagree-container {
        height: 444px;
    }

    .last-lagree-container h2 {
        font-size: 36px;
    }

    .desktop-nav .navbar .navbar-nav .nav-item a {
        margin-right: 5px;
        margin-left: 5px;
    }

    .overlaytext {
        font-size: 13px;
    }

    .our-classes-container:hover .description2 {
        top: 36%;
    }

    .description2 {
        top: 83%;
    }

    .our-classes-container:hover .description3 {
        top: 36%;
    }

    .description3 {
        top: 83%;
    }

    .centered-text {
        max-width: 450px !important;
    }

    .achieve-goals-image-rotate img {
        width: 160px;
    }

    .our-classes-section h3 {
        max-width: 620px;
    }

    .area-main p {
        max-width: 620px;
    }

    .about-area-container {
        padding: 40px 20px 80px;
    }

    .last-about-container {
        padding: 40px 20px 80px;
        height: 494px;
    }

    .classes-area p {
        max-width: 620px;
    }

    .text-container p {
        font-size: 14px;
    }

    .text-container h5 {
        top: 270px;
    }

    .description {
        top: 74%;
    }

    .our-classes-container:hover .description {
        top: -10px;
    }
}

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

    .lagree-area-container {
        height: 450px;
    }

    .last-lagree-container {
        height: 450px;
    }

    .centered-text {
        max-width: 450px !important;
    }

    .our-classes-container:hover .description2 {
        top: 45%;
    }

    .description2 {
        top: 86%;
    }

    .our-classes-container:hover .description3 {
        top: 45%;
    }

    .description3 {
        top: 86%;
    }

    .achieve-goals-image-rotate img {
        width: 180px;
    }

    .our-classes-section h3 {
        max-width: 730px;
    }

    .area-main p {
        max-width: 730px;
    }

    .classes-area p {
        max-width: 730px;
    }

    .text-container h5 {
        top: 250px;
    }

    .our-classes-container:hover .description {
        top: 18%;
    }

    .description {
        top: 78%;
    }

    .pt-area p {
        max-width: 730px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 991px) {
    .text-container-center h4 {
        font-size: 24px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .text-container-center h4 {
        font-size: 32px;
    }
}