/* Base styles */
		ul#categoriesTabs li:first-child a:first-child {
            color: white;
            background-color: #0d8c60;
        }
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 15px;
        }
        
        .row {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
        }
        
        .row.no-gutter {
            margin-left: 0;
            margin-right: 0;
        }
        
        .row.no-gutter [class*='col-']:not(:first-child),
        .row.no-gutter [class*='col-']:not(:last-child) {
            padding-right: 0;
            padding-left: 0;
        }
        
        .col-lg-12, .col-12 {
            width: 100%;
        }
        
        .col-lg-3 {
            width: 25%;
            padding: 0 15px;
        }
        
        .col-md-6 {
            width: 50%;
            padding: 0 15px;
        }
        
        .col-sm-3 {
            width: 25%;
        }
        
        .col-sm-1 {
            width: 8.333333%;
        }
        
        .leftmenu {
            display: none !important;
        }
        
        .main_conts {
            width: 100% !important;
            padding-bottom: 20px;
            min-height: 437px;
            margin-left: 0% !important;
        }
        
        .animation {
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }
        
        /* Categories and Navigation */
        .product-details-area {
            padding: 20px 0;
        }
        
        .tabs {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-wrap: wrap;
            border: 1px solid #ddd;
            border-radius: 20px;
        }
        
        .tabs li {
            margin-right: 10px;
            cursor: pointer;
            padding: 10px;
            background-color: #f8f9fa;
            /* border: 1px solid #ddd; */
            border-bottom: none;
            border-radius: 5px 5px 0 0;
            transition: all 0.3s ease;
        }
        
        .tabs li:hover {
            background-color: #e9ecef;
        }
        
        .tabs li.current {
            background-color: #007bff;
            color: white;
            border-color: #007bff;
        }
        
        .tabs li a {
            text-decoration: none;
            color: inherit;
            display: block;
        }
        
        .tabs li.current a {
            color: white;
        }
        
        .cat_brief {
            display: none !important;
        }
        
        /* Subcategories styles */
        .page-section {
            padding-top: 0rem;
            margin-bottom: 0;
            padding-bottom: 0;
        }
        
        .moh-details-tab-content {
            background-color: #f8f9fa;
            padding: 20px;
            border-radius: 20px;
            border: 1px solid #ddd;
            margin-bottom: 19px;
        }
        
        .shorting-menu {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            align-items: center;
        }
        
        .shorting-menu a.filter {
            padding: 8px 16px;
            background-color: #fff;
            border: 1px solid #ddd;
            border-radius: 20px;
            text-decoration: none;
            color: #333;
            transition: all 0.3s ease;
            cursor: pointer;
        }
        
        .shorting-menu a.filter:hover {
            background-color: #0E8B5F;
            color: white;
            border-color: #0E8B5F;
        }
        
        .shorting-menu a.filter.active {
            background-color: #0E8B5F;
            color: white;
            border-color: #0E8B5F;
        }
        
        /* Search and sorting styles */
        .conSarchFilter {
            margin: 20px 0;
        }
        
        .justify-content-center {
            justify-content: center;
        }
        
        .has-search {
            position: relative;
        }
        
        .has-search .form-control-feedback {
            position: absolute;
            z-index: 2;
            display: block;
            width: 1.375rem;
            height: 60px;
            line-height: 1.375rem;
            text-align: center;
            pointer-events: none;
            color: #aaa;
            padding-top: 8px;
            padding-left: 5px;
        }
        
        .has-search input[type="text"] {
            width: 100%;
            font-size: 14px !important;
            color: #404040 !important;
            background-color: #eee !important;
            border-radius: 3px !important;
            border: 1px solid #ddd !important;
            margin: 0% !important;
            padding-left: 40px !important;
            height: 36px !important;
        }
        
        .form-group {
            margin-bottom: 1rem;
        }
        
        .SortingService {
            text-align: center;
        }
        
        .filter-btn {
            cursor: pointer !important;
            color: #0D8C60 !important;
            position: relative;
            padding: 5px 8px;
            background: #f5f5f6;
            margin: 0 4px 0 0;
            display: inline-block;
            text-align: center;
            border-radius: 5px;
            transition: all .5s ease;
            border: 1px solid #ddd !important;
            font-size: 12px;
            text-decoration: none;
        }
        
        .filter-btn:hover {
            color: #ffffff !important;
            background-color: #958A5F !important;
        }
        
        .display-4 {
            font-size: 17px;
        }
        
        /* eServices Cards Styles */
        .cardContainer {
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -ms-transition: all 1s ease;
            transition: all 1s ease;
            -webkit-perspective: 800px;
            -moz-perspective: 800px;
            -o-perspective: 800px;
            perspective: 800px;
            padding-left: 1%;
            margin-bottom: 30px;
        }
        
        .secondRow {
            margin-top: -1.4%;
        }
        
        .cardSer {
            width: 99%;
            height: 300px;
            cursor: pointer;
            -webkit-transition: -webkit-transform 1.2s;
            -moz-transition: -moz-transform 1.2s;
            -o-transition: -o-transform 1.2s;
            transition: transform 1.2s;
            -webkit-transform-style: preserve-3d;
            -moz-transform-style: preserve-3d;
            -o-transform-style: preserve-3d;
            transform-style: preserve-3d;
        }
        
        .cardSer.flipped {
            -webkit-transform: rotateY(180deg);
            -moz-transform: rotateY(180deg);
            -o-transform: rotateY(180deg);
            transform: rotateY(180deg);
            display: block;
        }
        
        .cardSer.flipped:hover {
            display: block;
        }
        
        .cardSer .front,
        .cardSer .back {
            display: block;
            height: 100%;
            width: 100%;
            line-height: 60px;
            color: white;
            text-align: center;
            font-size: 4em;
            position: absolute;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            -o-backface-visibility: hidden;
            backface-visibility: hidden;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
            -webkit-box-shadow:  0 1px 4px rgba(0, 0, 0, 0.08);
            border-radius: 20px;
            border: 1px solid #ddd;
        }
        
        .cardSer .front {
            padding: 6%;
            background-color: #fff;
        }
        
        .cardSer .back {
            width: 100%;
            padding-left: 3%;
            padding-right: 3%;
            font-size: 16px;
            text-align: left;
            line-height: 25px;
            background: #9d915d;
            -webkit-transform: rotateY(180deg);
            -moz-transform: rotateY(180deg);
            -o-transform: rotateY(180deg);
            transform: rotateY(180deg);
        }
        
        .cardSer .front .icon {
            width: 50%;
            margin-top: 20%;
            margin-bottom: 8%;
        }
        
        .cardSer .front h6.cardTitle {
            line-height: 1.2em;
            margin-top: 10px;
            font-weight: bold;
            color: #3e8863;
            text-align: center;
            margin-bottom: 0px;
            min-height: 60px;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            display: -webkit-box !important;
            -webkit-line-clamp: 3 !important;
            -webkit-box-orient: vertical !important;
        }
        
        .cardSer .back h6.cardTitle {
            line-height: 1.2em;
            margin-top: 15px;
            font-weight: 600;
            color: #ffffff;
            text-align: center;
            margin-bottom: 0px;
            min-height: 60px;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            display: -webkit-box !important;
            -webkit-line-clamp: 3 !important;
            -webkit-box-orient: vertical !important;
        }
        
        .content {
            padding: 4%;
            font-weight: 100;
            text-align: left;
            font-weight: bold;
        }
        
        .content p {
            line-height: 1.4em;
            margin-top: 20px;
            font-weight: normal;
            color: #ffffff;
            text-align: center;
            margin-bottom: 0px;
            min-height: 90px;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            display: -webkit-box !important;
            -webkit-line-clamp: 5 !important;
            -webkit-box-orient: vertical !important;
            margin-bottom: 20px;
        }
        
        .content .divBut {
            text-align: center;
            position: absolute;
            bottom: 20px;
            width: 90%;
        }
        
        .content .butSerCard {
            -moz-box-shadow: 7px;
            -webkit-box-shadow: 7px;
            box-shadow: 7px;
            background-color: #ffffff;
            border-radius: 28px;
            text-indent: 0;
            border: 1px solid #d4d4d4;
            display: inline-block;
            color: #9d915d !important;
            font-family: arial;
            font-size: 15px;
            font-weight: bold;
            font-style: normal;
            height: 40px;
            line-height: 40px;
            width: 161px;
            text-decoration: none;
            text-align: center;
        }
        
        .content .butSerCard:hover {
            background-color: #ffffff;
            color: #9d915d !important;
        }
        
        .content .butSerCard:active {
            position: relative;
            top: 1px;
            color: #0d8c60 !important;
        }
        
        .loading, .error {
            text-align: center;
            padding: 20px;
            color: #666;
        }
        
        .error {
            color: #dc3545;
        }
        
        /* Media Queries */
        @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
            .cardSer {
                height: 370px;
            }
            
            .cardSer .front .icon {
                width: 40%;
                margin-top: 5px;
                margin-bottom: 10px;
            }
        }
        
        @media (max-width: 575.98px) {
            .cardSer {
                height: 350px;
            }
            
            .cardSer .front .icon {
                width: 45%;
                margin-top: 4%;
                margin-bottom: 4%;
            }
            
            .col-lg-3, .col-md-6 {
                width: 100%;
            }
        }
        
        @media (min-width: 576px) and (max-width: 767.98px) {
            .cardSer {
                height: 275px;
            }
        }
        
        @media (min-width: 768px) and (max-width: 991.98px) {
            .cardSer {
                height: 275px;
            }
            
            .col-lg-3 {
                width: 50%;
            }
        }
        
        @media (min-width: 992px) and (max-width: 1199.98px) {
            .cardSer {
                height: 275px;
            }
            
            .col-lg-3 {
                width: 50%;
            }
        }
        
        @media (min-width: 1200px) {
            .col-lg-3 {
                width: 25%;
            }
        }