.service_area {

    text-align: start;

    /* Centers the section content */

}





.service_style_seven {

    width: 100%;

    /* Allow the boxes to take full column width */

    margin-bottom: 30px;

    /* Add spacing below each box */

    display: flex;

    /* Ensures the icon and content align properly */

    align-items: start;

    /* Vertically centers icon and content */

    padding: 20px;

    /* Add inner spacing */

    border: 1px solid #ddd;

    /* Optional: Add a border for styling */

    border-radius: 8px;

    /* Optional: Rounded corners */

    background-color: #fff;

    /* Optional: Background color */



}



.service_style_seven_icon {

    font-size: 40px;

    /* Adjust icon size */

    color: #333;

    /* Icon color */

    margin-right: 15px;

    /* Spacing between icon and content */

}



.service_style_seven_content {

    text-align: left;

    /* Keeps the text aligned to the left */

}



h4 {

    font-size: 20px;

    font-weight: 800 !important;

}



.service_style_seven_text {

    margin-bottom: 50px;

}



h5 {

    color: #6B717F;

    font-weight: 500 !important;

    text-align: left;



}



.p3 {

    font-weight: 500 !important;

    font-size: 16px;

    text-align: left;



}



.single_contact_now {



    margin-bottom: -20px;

}



h6 {

    font-size: 14px;

}



p {

    font-size: 13px;

}



.service_area .row {

    display: flex;

    align-items: stretch;

    width: 103%;

    /* Ensures equal height for all items in the row */

}



.service_area .col-lg-6 {

    display: flex;

    flex-direction: column;

    /* Allows proper stacking of content */

}



.service_style_seven {

    flex: 1;

    /* Ensures the boxes grow to the same height */

    border: 1px solid #ccc;

    /* Optional: To visualize the box */

    padding: 20px;

    /* Add some padding for content spacing */

    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);

    /* Optional: Add some shadow for aesthetics */

}



.counter_area {

    margin-top: 250px;

    background-color: #fff;

}



h3 {

    font-size: 18px;

}



.single_contact_now_content p {

    font-size: 17px;

    color: #000;

}



.row-list {

    list-style: none;

    /* Remove bullets */

    margin: 0;

    padding: 0;

    display: flex;

    gap: 20px;

    align-items: center;

}



.row-list li {

    margin-bottom: 10px;

    /* Add space between rows */

    padding: 9px;

    border-radius: 5px;



}



.row-list a {

    text-decoration: none;

    /* Remove underline */

    color: #008080;

    font-size: 13px;



    /* Set link color */

}



.row-list2 li {

    padding: 10px;

    border-radius: 8px;

    width: 29%;

    display: flex;





}





.row-list2 span {

    color: #FFC500;

    font-size: 14px;

}







.single_counter .lis1 {

    border-radius: 40px;

    color: #1C9F2E;

}



.single_counter .dot {

    height: 8px;

    width: 8px;

    background-color: #1C9F2E;

    border-radius: 50%;

    display: inline-block;

}



.single_counter .lis2 {

    background-color: #008080;

    color: #fff;



}



.single_counter .lis2 a {

    color: #fff

}



@media (max-width: 768px) {

    .cntr_bg_up {



        padding: 10px;

        margin-left: 20px;

    }



    .portfolio_menu ul li {

        font-size: 24px;

    }







    .service_style_seven_content {

        text-align: center;

    }



    .single_contact_now h5 {

        font-size: 26px;

    }



    .single_contact_now p {

        font-size: 18px;

    }



    .class1 {

        margin-left: 0px !important;

    }



    h4 {

        font-size: 26px;

        margin-right: 80px;

    }





    h6 {

        font-size: 20px;

    }

}









.tabcontent {

    display: none;

    padding-left: 0;

    border-top: none;

}



.class2 {

    margin-bottom: 200px;

}



.detail1 {

    margin-bottom: 200px;



}



.portfolio_nav ul li button {

    font-size: 17px;

    font-weight: 600;

    gap: 10px;

    cursor: pointer;

    color: #4C5563;

}



.p4 {

    color: #008080;

    float: left;

}



.portfolio_nav ul li button:hover {

    color: #000;

}



#bookingModal {

    display: none;

    /* Hidden by default */

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.6);

    z-index: 1000;

    justify-content: center;

    align-items: center;

}



#bookingModal .about_area {

    width: 34%;

    background-color: #fff;

    padding: 20px;

    border-radius: 8px;

    position: relative;

}



#closeModal {

    position: absolute;

    top: 0px;

    right: 10px;

    background-color: transparent;

    border: none;

    font-size: 30px;

    cursor: pointer;

}



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

    #bookingModal .about_area {

        width: 80%;

        /* Adjust to a larger width for mobile */

        padding: 15px;

        /* Reduce padding for better fit */

    }

}



@media screen and (max-width: 480px) {

    #bookingModal .about_area {

        width: 90%;

        /* Full width on smaller devices */

        padding: 10px;

    }

}



.custom-col {

    text-align: center;

    margin-bottom: 10px;

}



.description {

    width: 100%;

    padding: 8px;

    margin-top: 8px;

    border: 1px solid #ccc;

    border-radius: 4px;

}



.btn {

    padding: 10px 20px;

    background-color: #007bff;

    color: #fff;

    border: none;

    border-radius: 4px;

    cursor: pointer;

}



.btn:hover {

    background-color: #0056b3;

}



.widget {

    border-radius: 8px;

}



.blog-left-side>div {

    border: 1px solid #e1dfdf;

    margin-bottom: 10px;

    padding: 27px;

}



/* Base custom-col styles */

.custom-cols {

    text-align: center;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    border-radius: 8px;

    padding-left: 2px;

    padding-right: 2px;

}



/* Enhancements for custom-cols */

.custom-cols {

    border: 1px solid #ddd;

    /* Add a light border for structure */

    padding: 10px 15px;

    /* Increase padding for better spacing */

    margin-bottom: 15px;

    /* Add spacing below each element */



}



.custom-cols h6 {

    font-weight: 600;

    /* Slightly bolder text */

    font-size: 16px;

    /* Adjust heading size */

    margin-bottom: 5px;

    /* Add spacing below heading */

}



.custom-cols span {

    font-size: 14px;

    /* Adjust font size for span */

    margin: 4px 0;

    /* Add vertical spacing */

}



.custom-cols:hover {

    border: 1px solid #008080;

    color: #000;

}



.custom-cols.active {

    text-decoration: none;

    border: 1px solid #008080;

    color: #000;

}



/* Mobile responsive adjustments */

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

    .custom-cols {

        padding: 8px;

        /* Adjust padding for smaller screens */

        box-shadow: none;

        /* Remove shadow for simplicity */

    }



    .custom-cols h6 {

        font-size: 14px;

        /* Reduce heading font size */

    }



    .custom-cols span {

        font-size: 12px;

        /* Reduce span text size */

    }

}



@media screen and (max-width: 576px) {

    .custom-cols {

        padding: 6px;

        /* Further reduce padding */

    }



    .custom-cols h6 {

        font-size: 12px;

        /* Further reduce heading size */

    }



    .custom-cols span {

        font-size: 11px;

        /* Further reduce text size */

    }

}





h6 {

    font-weight: 600;

    color: #263238;



}



.col-sm-3 {

    border: 1px solid #6B717F;

    gap: 7px;

}



.col-sm-3 {

    border: 1px solid #6B717F;

    gap: 2px;

}



/* Container row styling */

.custom-row {

    display: flex;

    justify-content: start;

    align-items: stretch;

    width: 100%;

    margin-left: 0px;

    gap: 9px;

}



/* Box styling */

.custom-col {



    text-align: center;

    /* Center align text */

    display: flex;

    flex-direction: column;

    justify-content: center;

    /* Center content vertically */

    align-items: center;

    /* Add some padding inside the box */

    border-radius: 8px;

    padding-left: 2px;

    padding-right: 2px;

    /* Optional: Rounded corners */

}



.custom-col a {

    text-decoration: none;

}



.custom-cols a {

    text-decoration: none;

}



/* Text styling */

.custom-col h6 {

    margin: 0;

    font-size: 18px;

    font-weight: bold;

}



.custom-col span {

    margin: 4px 4px 0px 4px;

    font-size: 16px;

    color: #333;

}



.custom-col h6 {

    font-weight: 500;

    font-size: 14px;

}



.custom-col span {

    font-weight: 700;

}



.pd_gap {

    background: #fff;

    padding: 38px 48px;

    border-radius: 8px;

}



.section_sub_title h3 {

    font-size: 14px;

}



.custom-row1 {

    display: flex;

    justify-content: space-between;

    align-items: stretch;

    width: 100%;

    margin-left: 0px;

}



.custom-row1 span {

    font-weight: 500;

    font-size: 13px;

}



.description {

    width: 100%;

    height: 7vh;

}



.quote_btn button {

    background: #008080;

    color: #fff;

    width: 100%;

    height: 40px;

    padding: 12px 20px 12px 20px;

    border-radius: 8px;

    font-weight: 600;

    cursor: pointer;



}



.about_area .container {

    display: flex;

    justify-content: center;

    align-items: start;

    min-height: 64vh;

    /* Full viewport height */

}



/* General styling for desktop already defined */



/* Mobile responsiveness */

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



    .custom-row,

    .custom-row1 {

        flex-direction: column;

        /* Stack columns vertically */

        width: 100%;

        /* Use full width of the container */

        gap: 7px;

        /* Add spacing between stacked elements */

    }



    .custom-col {

        width: 100%;

        /* Ensure boxes span the full width */

        margin-bottom: 10px;

        /* Add spacing between rows */

    }



    .pd_gap {

        padding: 20px;

        /* Reduce padding for smaller screens */

    }



    .section_sub_title h3 {

        font-size: 12px;

        /* Adjust font size for mobile */

    }



    .custom-col h6 {

        font-size: 12px;

        /* Reduce font size */

    }



    .custom-col span {

        font-size: 14px;

        /* Adjust text size for readability */

    }



    .description {

        height: 8vh;

        /* Reduce the height of the text area */

    }



    .quote_btn button {

        height: 36px;

        /* Adjust button height */

        font-size: 14px;

        /* Reduce button text size */

    }

}



@media screen and (max-width: 576px) {



    .custom-row,

    .custom-row1 {

        width: 100%;

        /* Ensure full width on extra small screens */

    }



    .col-sm-3 {

        -ms-flex: 0 0 25%;

        flex: 0 0 25%;

        max-width: 22%;

    }

}



.custom-col {

    padding: 8px;

    /* Reduce padding for smaller devices */

}



.custom-col h6,

.custom-col span {

    font-size: 12px;

    /* Further reduce text size */

}



.pd_gap {

    padding: 16px;

    /* Adjust padding */

}



.section_sub_title h3 {

    font-size: 10px;

    /* Adjust heading size */

}



.quote_btn button {

    font-size: 12px;

    /* Smaller button text for extra small screens */

}







@media (min-width: 576px) {

    .col-sm-3 {

        -ms-flex: 0 0 25%;

        flex: 0 0 25%;

        max-width: 22%;

    }

}













#checkoutmodel {

    display: none;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.5);

    /* Dimmed background */

    z-index: 1000;

    justify-content: center;

    align-items: center;

}



#checkoutmodel .about_area {

    background-color: #fff;

    padding: 20px;

    border-radius: 8px;

    max-width: 600px;

    margin: auto;

    margin-top: 7%;



}



#closeModal {

    background: none;

    border: none;

    font-size: 28px;

    position: absolute;

    top: 0px;

    right: 10px;

    cursor: pointer;

}







/* Desktop Default Styles (Existing Code) */

.about_area .container {

    display: flex;

    justify-content: center;

    /* Horizontally center the container */

    align-items: center;

}



h3 {

    font-size: 16px;

    font-weight: 500;

}



.book1 {

    display: flex;

    gap: 5px;

}



.book2 {

    display: flex;

    gap: 15px;

}



.book2 h6 {

    font-size: 14px;

    font-weight: 400;

}



.wrapper {

    height: 35px;

    min-width: 100px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #FFF;

    border-radius: 5px;

    border: 1px solid #008080;

    margin-top: -12px;

    margin-left: 200px;

}



.wrapper span {

    width: 100%;

    text-align: center;

    font-size: 15px;

    font-weight: 600;

    cursor: pointer;

    user-select: none;

}



.wrapper span.num {

    font-size: 15px;



    pointer-events: none;

}



.wp1 {

    margin-left: 200px;

}



.bk1 img {

    margin-left: 6px;

}



.cd1 h6 {

    font-weight: bold;

}



.book1 h3 {

    font-weight: bold;

}



.cd2 p {

    margin-top: -10px;

    font-size: 14px;

    width: 260px;

}



.cd2 .wrapper {

    margin-left: 54px;

}



a.dtbtn {

    font-size: 14px;

}



.bt1 a {

    background-color: #fff;

    color: #000;

}





/* Responsive Styles for Mobile Devices */

@media (max-width: 768px) {



    /* Center container */

    .about_area .container {

        flex-direction: column;

        /* Stack items vertically */

        margin-top: 50px;

        /* Adjust top margin */

    }



    /* Adjust text sizes */

    h3 {

        font-size: 14px;

    }



    /* Adjust gaps for book1 and book2 */

    .book1,

    .book2 {

        flex-direction: column;

        /* Stack items */

        gap: 10px;

        /* Increase spacing for readability */

    }



    .book2 h6 {

        font-size: 12px;

        /* Reduce font size */

    }



    /* Wrapper adjustments */

    .wrapper {

        margin-left: 0;

        /* Center align for mobile */

        min-width: 80px;

        /* Adjust width */

        margin-top: 0px;

    }



    .wrapper span {

        font-size: 13px;

        /* Adjust text size */

    }



    /* Adjust margin for wp1 */

    .wp1 {

        margin-left: 0;

    }



    /* Center buttons and adjust size */

    .button1 {

        margin-left: 0;

        /* Center align */

        width: 100%;

        /* Full width for mobile */

        text-align: center;

        /* Align text */

    }



    /* Paragraph adjustments */

    .cd2 p {

        width: 100%;

        /* Full width for mobile */

    }



    /* Adjust margins for buttons and images */

    .bk1 img {

        margin-left: 0;

        /* Center align */

    }

}



@media (max-width: 767px) {





    .cd2 .wrapper {

        margin-left: 0px;

    }

}



.modal {

    display: none;

    /* Hidden by default */

    position: fixed;

    /* Stay in place */

    z-index: 1000;

    /* Sit on top */

    left: 0;

    top: 0;

    width: 100%;

    /* Full width */

    height: 100%;

    /* Full height */

    overflow: auto;

    /* Enable scroll if needed */

    background-color: rgba(0, 0, 0, 0.5);

    /* Black background with transparency */

}



.modal-content {

    background-color: #fff;

    margin: 10% auto;

    /* 10% from top and centered */

    padding: 20px;

    border-radius: 8px;

    width: 50%;

    /* Adjust as needed */

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

}



.close-btn {

    color: #aaa;

    float: right;

    font-size: 28px;

    font-weight: bold;

    cursor: pointer;

}



.close-btn:hover,

.close-btn:focus {

    color: #000;

    text-decoration: none;

}





/* Modal styles */

.modal {

    display: none;

    /* Hidden by default */

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.6);

    z-index: 1000;

    justify-content: center;

    align-items: center;

}



.modal-content {

    background-color: #fff;

    width: 50%;

    padding: 20px;

    border-radius: 8px;

    overflow-y: auto;

    max-height: 90vh;

    position: relative;

}



.close-btn {

    position: absolute;

    top: 10px;

    right: 10px;

    background-color: transparent;

    border: none;

    font-size: 20px;

    cursor: pointer;

}



.custom-col {

    text-align: center;

    margin-bottom: 10px;

    padding: 6px;

}



.custom-col.active {

    text-decoration: none;

    border: 1px solid #008080;

    color: #000;

}



.custom-col:hover {



    border: 1px solid #008080;

    color: #000;

}





.description {

    width: 100%;

    padding: 8px;

    margin-top: 8px;

    border: 1px solid #ccc;

    border-radius: 4px;

}



.btn {

    padding: 10px 20px;

    background-color: #007bff;

    color: #fff;

    border: none;

    border-radius: 4px;

    cursor: pointer;

}



.btn:hover {

    background-color: #0056b3;

}

















/* Base styles for the .fix class */

.fix {

    background-color: #fefefe;

    margin: 7% auto;

    border-radius: 8px;

    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);

    width: 38%;

}



/* Media query for screens 1200px or smaller */

@media (max-width: 1200px) {

    .fix {

        width: 50%;

    }

}



/* Media query for screens 768px or smaller */

@media (max-width: 768px) {

    .fix {

        width: 80%;

    }

}



/* Media query for screens 480px or smaller */

@media (max-width: 480px) {

    .fix {

        width: 90%;

    }

}









/* Desktop Default Styles (Existing Code) */

.about_area .container {

    display: flex;

    justify-content: center;

    /* Horizontally center the container */

    align-items: center;

    /* Vertically center the container */

    min-height: 100vh;

    /* Full viewport height */

}



h3 {

    font-size: 16px;

    font-weight: 500;

}



.book1 {

    display: flex;

    gap: 5px;

}



.book2 {

    display: flex;

    gap: 15px;

    justify-content: space-between;

    align-items: center;

}



.book2 h6 {

    font-size: 14px;

    font-weight: 400;

}



.wrapper {

    height: 35px;

    min-width: 100px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #FFF;

    border-radius: 5px;

    border: 1px solid #008080;

    margin-top: -12px;

    margin-left: 200px;

}



.wrapper span {

    width: 100%;

    text-align: center;

    font-size: 15px;

    font-weight: 600;

    cursor: pointer;

    user-select: none;

}



.wrapper span.num {

    font-size: 15px;



    pointer-events: none;

}



.wp1 {

    margin-left: 200px;

}



.bk1 img {

    margin-left: 6px;

}



.cd1 h6 {

    font-weight: bold;

}



.book1 h3 {

    font-weight: bold;

}



.cd2 p {

    margin-top: -10px;

    font-size: 14px;

    width: 260px;

}



.cd2 .wrapper {

    margin-left: 57px;

}



a.dtbtn {

    font-size: 14px;

}



.bt1 a {

    background-color: #fff;

    color: #000;

}



.button1 {

    text-align: end;

}



/* Responsive Styles for Mobile Devices */

@media (max-width: 768px) {



    /* Center container */

    .about_area .container {

        flex-direction: column;

        /* Stack items vertically */

        margin-top: 50px;

        /* Adjust top margin */

    }



    /* Adjust text sizes */

    h3 {

        font-size: 14px;

    }



    /* Adjust gaps for book1 and book2 */

    .book1,

    .book2 {

        flex-direction: column;

        /* Stack items */

        gap: 10px;

        /* Increase spacing for readability */

    }



    .book2 h6 {

        font-size: 12px;

        /* Reduce font size */

    }



    /* Wrapper adjustments */

    .wrapper {

        margin-left: 0;

        /* Center align for mobile */

        min-width: 80px;

        /* Adjust width */

        margin-top: 0px;

    }



    .wrapper span {

        font-size: 13px;

        /* Adjust text size */

    }



    /* Adjust margin for wp1 */

    .wp1 {

        margin-left: 0;

    }



    /* Center buttons and adjust size */

    .button1 {

        margin-left: 0;

        /* Center align */

        width: 100%;

        /* Full width for mobile */

        text-align: center;

        /* Align text */

    }



    /* Paragraph adjustments */

    .cd2 p {

        width: 100%;

        /* Full width for mobile */

    }



    /* Adjust margins for buttons and images */

    .bk1 img {

        margin-left: 0;

        /* Center align */

    }

}



@media (max-width: 767px) {





    .cd2 .wrapper {

        margin-left: 0px;

    }

}









.row-listw li {

    margin-bottom: 10px;

    background-color: #E5F4F4;

    padding: 9px;

    border-radius: 5px;

}



.blog_area {

    margin-top: 100px;

    background-color: #fff;

    border-radius: 8px;

}



.dg {

    display: flex;

    gap: 0px 5px;

    align-items: center;

}



.content h2 {

    font-size: 18px !important;



}



.comments_ttl h3 {

    font-size: 18px !important;

}



.pr1 {

    font-size: 14px;

}



.pr2 {

    font-size: 12px;

    color: #F06A32;

    font-weight: 600;



}



.pr3 {

    font-size: 14px;

}



.pr4 {

    font-size: 14px;

}



.content {

    gap: 20px;

}



.blog_dtl_top_bs span {

    padding: 8px 10px;

    color: #000;

    border: 1px solid #E1E1E1

}



.fa-star {

    color: #FFC500;



}



.sp1 {

    font-size: 12px;

}



.recent_post_dtls {

    background-color: #fff;

    width: 100%;

    border-radius: 8px;

    border: 1px solid #e1dfdf;

    padding: 26px 45px 26px;

}



.fa-eye {

    font-size: 10px;

}



.p1 {

    font-size: 10px;

}



.techno-blog-meta {

    width: 120%;

}



.blog_page_button a {

    color: #008080;



}



.badmin {

    font-size: 14px;

    font-weight: bold;

}



.meta-date {

    float: right;

}



.row-list2 {

    background-color: #F7F8FA;

    padding: 6px;

    width: 35%;

    border-radius: 5px;

}



p {

    font-size: 12px;

}



.sp3 {

    color: #000;

    font-size: 8.5px;

}



.row-list3 {

    background-color: #F7F8FA;

    padding: 6px;

    width: 23%;

    border-radius: 8px;

    margin-bottom: 10px;

}



.color {

    margin-left: 13px;

    font-size: 13px;

    margin-bottom: 6px;

}



.fa-star,

.fa-star-half {

    font-size: 12px;

}



.widget-title {

    font-size: 18px;

    color: #000;



}





.f-15 {

    font-size: 15px;

}



.widget-title1 {

    font-size: 26px;

    font-weight: 500;

}



.donate-btn-header img {

    border-style: none;

    max-width: 100%;

    height: auto;

    vertical-align: middle;



}



.widget_about {

    border: 15px solid #000;

}







.text-black {

    color: #000 !important;

}



.popup-booknow {

    display: none;

    position: fixed;

    z-index: 1000;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    overflow: auto;

    background-color: rgba(0, 0, 0, 0.4);

}





.span-close {



    color: #000000;

    float: right;

    font-size: 31px;



    cursor: pointer;



    padding: 10px;

}









.custom-select {

    border-radius: 5px;

    height: 38px;

    padding: 4px 4px;

    border: 1px solid #008080;

    width: 175px;

}

@media (max-width: 768px) {

    .blog-details-area {

        padding-top: 0;

    }

}

@media (min-width: 500px) {

 .col-lg-8 {

    padding: 0;

    

} 

 .col-lg-4 {

    padding: 0;

    

} 

.blog-details-area {

       

        padding-top: 50px;

        

    }

.col-md-8,

    .col-md-12{

       padding-right:.5rem;

       padding-left:0px;

    }

}

@media (max-width: 500px) {

 .col-lg-8 {

    padding: 15px!important;

}

.col-md-8,

    .col-md-12{

       padding-right:0px;

       padding-left:0px;

    }

}