@media (min-width:1023px) {
    body {
        padding-left: 250px;
    }

    .container {
        padding-inline: 40px;
    }

    header {
        position: fixed;
        width: 250px;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        z-index: 10;
        background-image: linear-gradient(270deg, rgba(46, 182, 151, .18), transparent);
        background-color: #e81e62;
    }

    header .logo {
        background-color: #fff;
        padding: 15px 10px;
        border-right: 1px solid #eee;
    }

    .navigation .menu ul {
        text-align: left;
    }

    .navigation .menu ul li {
        display: block;
    }

    .navigation .menu ul li a {
        color: white;
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    }

    .navigation .menu ul li.active a,
    .navigation .menu ul li:hover a {
        color: white;
        background: var(--pri);
    }

    .navigation ul li.cs-submenu a button svg,
    .navigation ul li.cs-submenu:hover svg {
        transform: rotate(-90deg);
    }

    .navigation ul li.cs-submenu a button {
        margin-right: 2px;
    }

    .navigation .menu ul li ul.cs-dropdown {
        top: 0;
        left: 100%;
    }

}

@media (max-width:1023px) {
    .logo {
        position: absolute;
        top: 1px;
        width: 220px;
        z-index: 2;
    }

    .navigation .navbar {
        display: block;
        width: 100%;
        padding: 13px 11px;
        text-align: right;
    }

    .navigation .menu {
        display: none;
        width: 100%;
        overflow: hidden;
        overflow-y: visible;
        position: relative;
        z-index: 9999;
        max-height: 480px;
        overflow-y: auto;
        position: absolute;
        top: 100%;
        background: var(--sec);
        left: 0;
        right: 0;
        text-align: left;
    }

    .navigation .menu ul li {
        padding: 0;
        width: 100%;
        display: block;
    }

    .navigation .menu ul li a {
        padding: 9px 15px;
        text-align: left;
        font-size: 14px;
        border-right: 1px dashed transparent;
        color: #fff;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        display: block;
    }

    .navigation .menu ul li.active a,
    .navigation .menu ul li:hover a {
        color: white;
    }

    .navigation .menu ul li ul.cs-dropdown {
        position: relative !important;
        opacity: 1 !important;
        visibility: visible !important;
        top: auto !important;
        left: auto !important;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        width: 100%;
        display: none;
        transition: none !important
    }

    .navigation .menu ul li ul.cs-dropdown,
    .navigation .menu ul li ul.cs-dropdown li .cs-dropdown {
        padding-top: 0;
        padding-left: 0;
        padding-bottom: 0;
        display: none;
        transition: none;
        padding-right: 0;
        width: 100%;
        background: transparent
    }

    .navigation .menu ul .cs-submenu a {
        position: relative
    }

    .navigation .menu ul li.cs-submenu a button {
        display: block;
        position: absolute;
        top: 0px;
        right: 15px;
        background: transparent;
        border: 0;
        color: #fff;
        font-size: 16px;
        height: 30px;
        outline: none;
        width: 30px;
        padding: 0;
        text-align: center;
        line-height: 18px
    }

    .navigation ul li.cs-submenu a button svg {
        width: 16px;
        height: 16px;
    }

    .navigation ul li.cs-submenu a button.rotated svg {
        transform: rotateZ(180deg);
        color: white;
    }

    .navigation ul li.cs-submenu:hover svg {
        color: white;
    }

    .navigation ul li.cs-submenu:hover svg {
        transform: rotateZ(0deg);
    }

    .navigation ul li.cs-submenu ul.cs-dropdown li a button svg {
        transform: rotateZ(0deg);
        color: #fff;
    }

    .navigation ul li.cs-submenu:hover ul.cs-dropdown li.cs-submenu svg {
        color: white;
    }

    .navigation ul li.cs-submenu ul.cs-dropdown li a button.rotated svg {
        transform: rotateZ(180deg);
    }

    .navigation .menu ul li ul.cs-dropdown,
    .navigation .menu ul li ul.cs-dropdown li .cs-dropdown li .cs-dropdown {
        padding-top: 0;
        padding-left: 0;
        padding-bottom: 0;
        display: none;
        transition: none;
        padding-right: 0;
        width: 100% !important;
        background: #444
    }

    .navigation .menu ul li ul.cs-dropdown li ul.cs-dropdown {
        left: 100%;
        margin-top: 0
    }

    .navigation .menu ul li ul.cs-dropdown li ul.cs-dropdown li ul.cs-dropdown {
        left: -100%;
        margin-top: 0
    }

    .navigation .menu ul li ul.cs-dropdown li {
        border-bottom: 0
    }

    .navigation .menu ul li ul.cs-dropdown li a {
        color: #fff;
        display: block;
        font-size: 14px;
        padding: 8px 15px;
        line-height: normal;
        border-bottom: 1px solid rgb(255 255 255 / 11%);
        background: var(--text-color);
    }

    .navigation .menu ul li ul.cs-dropdown li:hover a {
        background: #ddaf2f;
    }

    .navigation .menu ul li ul.cs-dropdown li ul.cs-dropdown li a,
    .navigation .menu ul li ul.cs-dropdown li:hover ul.cs-dropdown li a:hover {
        background: white;
        color: var(--text-color);
        border-bottom: 1px solid #e3e3e3;
    }

    .mobile_hide {
        display: none !important;
    }

    .navigation .menu ul li:hover ul.cs-dropdown {
        display: none;
    }

    .navigation .menu ul li ul.cs-dropdown li:hover ul.cs-dropdown {
        display: none;
    }
}


@media (max-width:767px) {
    .add-banner .tt, .add-banner .tt2 { 
    font-size: 18px; 
}
.feature-bx { 
    padding: 14px 5px; 
}
.abt-sec .main-tt, .content-sec h1, .content-sec h2, .content-sec h3, .content-sec .tt, .cmTitle { 
    font-size: 20px; 
}
.services-sec .main-tt { 
    font-size: 20px; 
}
.services-sec .heading-sec p { 
    font-size: 15px;
    letter-spacing: 0.5px;
}
.section {
    padding: 30px 0;
}
.vidBx .txBx { 
    font-size: 16px; 
}
.head-sec .tt { 
    font-size: 22px !important;}
 .accordion-button { 
    font-size: 16px; 
}
footer { 
    padding: 30px 0 30px;
}
.swiper-button-next, .swiper-next {
    right: -7px; 
}
.swiper-button-prev, .swiper-prev {
    left: -7px; 
}
.img-breadcum { 
    padding: 25px 0 25px; 
}
.head-sec p {
    font-size: 15px;}
.img-breadcum .tt { 
    font-size: 20px;}
.cal-btn { 
    left: 10px;}
.whatapp_btn { 
    left: 10px;}
.business-enq { 
    bottom: 10px;
    left: 5px;}
    .blog-sec .main-tt { 
    font-size: 20px; 
}
.blog-bx.blog-card .tx-bx .tt a { 
    -webkit-line-clamp: 5;    margin-top: 10px;
}
.blog-bx.blog-card .tx-bx p {
    -webkit-line-clamp: 5;
    line-height: 1.5;
    font-size: 15px;
    margin-bottom: 0;
}
.breadcum-sec ul { 
    gap: 15px; 
    margin: 0;
    padding: 5px 0px;
    line-height: 0px;
}
.pr-li .tx-bx .info {
    max-height: max-content; 
}
.pr-li .tx-bx .title a {
    font-size: 18px;}
.main-btn {
    padding: 10px 7px; 
;
    gap: 2px; 
    font-size: 14px;}
.blog-bx.blog-card {
    display: block;}
.feature-bx .icon {
    max-width: 45px;
    margin: 0 auto 10px;
}
}