﻿body {
}

.bg-image-container {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 200px; /* Adjust height as needed */
}

    /* Pseudo-element for background image */
    .bg-image-container::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: url('img/HomeSample02.jpg') no-repeat center center;
        background-size: cover;
        opacity: 0.15;
        z-index: 0;
    }

    /* Ensure container content appears above the background image */
    .bg-image-container .content {
        position: relative;
        z-index: 1;
        padding: 0px;
        color: #000; /* Adjust text color for readability */
    }

/*****************************************/
/*** BEGIN: Card Settings for Services ***/
/*****************************************/

.custom-card {
    background-color: #efefef;
    color: #a8a8a8;
    height: 400px;
    margin: 1rem;
    transition: background-color 0.3s, color 0.3s;
}

/* Positioning for the button */
.custom-card-body {
    position: relative;
}

    .custom-card .custom-card-title {
        font-size: 2.0rem; /* Default font size 1.25rem */
        margin-top: 3rem;
    }

    .custom-card .custom-card-text {
        font-size: 1.25rem; /* Default font size 1.25rem */
    }

    .custom-card .custom-card-btn {
        position: absolute;
        width: 150px;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
    }

    .custom-card .custom-card-line {
        /* border: 5px white; */
        border-top: 5px solid #a8a8a8;
        width: 25%;
        margin: 1.5rem auto; /* Centers the line and adds spacing */
        transition: border-color 0.3s;
    }

.custom-card .custom-card-icon,
.custom-card .custom-card-icon-hover{
    position: absolute;
    top: -50px;
    left: 50%;
    transform: translateX(-50%);
    transition: opacity 0.3s ease;
}

.custom-card .custom-card-icon-hover {
    /* The hover icon is hidden initially */
    opacity: 0;
}

/* On card hover, hide the default icon and show the hover icon */
.custom-card:hover .custom-card-icon {
    opacity: 0;
}

.custom-card:hover .custom-card-icon-hover {
    opacity: 1;
}

.custom-card:hover {
        background-color: #ed1c24;
        color: #efefef;
    }

        .custom-card:hover .custom-card-title,
        .custom-card:hover .custom-card-text{
            color: white;
        }

        .custom-card:hover .custom-card-line { 
            /* border: 5px white; */
            border-top: 5px solid #fff; /* Highlight white on hover */
        }

        .custom-card:hover .custom-card-btn {
            background-color: #efefef;
            color: #ed1c24;
        }

        .custom-card:hover .custom-card-btn:hover {
            background-color: white;
        }

    .custom-card .custom-card-title,
    .custom-card .custom-card-text {
        transition: color 0.3s;
    }

/**************************************/
/*** END-Card Settings for Services ***/
/**************************************/


/*********************************************/
/*** BEGIN: Card Settings for Testimonials ***/
/*********************************************/

.custom-card-tes, .custom-card-tes-large {
    background-color: #efefef;
    color: black; /*#a8a8a8;*/
    transition: background-color 0.3s, color 0.3s;
}

.custom-card-tes {
    height: 400px;
    display: flex;
    flex-direction: column;
    border-radius: 15px;
    margin: 1rem;
    border: none;
}

.custom-card-tes-large {
    display: flex;
}

.custom-card-tes .custom-card-tes-btn {
    position: absolute;
    width: 150px;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.custom-card-tes:hover,
.custom-card-tes-large:hover {
    background-color: white;
    color: black;
}
    .custom-card-tes:hover .custom-card-tes-btn {
        background-color: #efefef;
        color: #ed1c24;
    }

        .custom-card-tes:hover .custom-card-tes-btn:hover,
        .custom-card-tes-large:hover .custom-card-tes-large-btn:hover {
            background-color: red;
            color: white;
        }

/******************************************/
/*** END-Card Settings for Testimonials ***/
/******************************************/


/*************************************************/
/*** BEGIN: Card Settings for Responsive Style ***/
/*************************************************/

.responsive-card {
    background-color: #fff;/*#efefef;*/
    color: #a8a8a8;
    margin: 0rem;
    transition: background-color 0.3s, color 0.3s;
}

/* Positioning for the button */
.responsive-card-body {
    position: relative;
}

.responsive-card .responsive-card-title {
    font-size: 2.0rem; /* Default font size 1.25rem */
    color: red;
    margin-top: 3rem;
}

.responsive-card .responsive-card-subtitle {
    color: #b9a16d;
    font-size: 1.75rem;
}

.responsive-card .responsive-card-text-175 {
    font-size: 1.75rem; /* Default font size 1.25rem */
}

.responsive-card .responsive-card-text-125 {
    font-size: 1.25rem; /* Default font size 1.25rem */
    white-space: pre-line;
}

.responsive-card .responsive-card-icon-star {
    color: red;
}

.responsive-card .responsive-card-btn {
    position: absolute;
    width: 150px;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.responsive-card .responsive-card-line {
    /* border: 5px white; */
    border-top: 5px solid #b9a16d;
    width: 25%;
    margin: 1.5rem auto; /* Centers the line and adds spacing */
    transition: border-color 0.3s;
}

.responsive-card .responsive-card-icon,
.responsive-card .responsive-card-icon-hover {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    transition: opacity 0.3s ease;
}

.responsive-card .responsive-card-icon-hover {
    /* The hover icon is hidden initially */
    opacity: 0;
}

/* On card hover, hide the default icon and show the hover icon */
.responsive-card:hover .responsive-card-icon {
    opacity: 0;
}

.responsive-card:hover .responsive-card-icon-hover {
    opacity: 1;
}

.responsive-card-datalist li::first-letter {
    color: red;
    text-transform: uppercase;
}

.responsive-card:hover {
    background-color: #b9a16d;
    color: #efefef;
}

    .responsive-card:hover .responsive-card-title,
    .responsive-card:hover .responsive-card-subtitle,
    .responsive-card:hover .responsive-card-text-150,
    .responsive-card:hover .responsive-card-text-175,
    .responsive-card:hover .responsive-card-icon-star {
        color: white;
    }

    .responsive-card:hover .responsive-card-line {
        border-top: 5px solid #fff; /* Highlight white on hover */
    }

    .responsive-card:hover .responsive-card-btn {
        background-color: #efefef;
        color: #ed1c24;
    }

.responsive-card:hover .responsive-card-btn:hover {
    background-color: white;
}

.responsive-card .responsive-card-title,
.responsive-card .responsive-card-text-150,
.responsive-card .responsive-card-text-175 {
    transition: color 0.3s;
}

/***********************************************/
/*** END: Card Settings for Responsive Style ***/
/***********************************************/

/***********************/
/* Nav-Link Card Style */
.nav-link-card {
    border: 0px solid;
    background-color: #efefef;
    color: #a8a8a8;
    /* height: 450px; */
    margin: 0 3rem;
    transition: background-color 0.3s, color 0.3s;
}

/* Positioning for the button */
.nav-link-card-body {
    position: relative;
}

.nav-link-card .nav-link-card-title {
    font-size: 1.75rem; /* Default font size 1.25rem */
    margin-top: 0rem;
}

.nav-link-card .nav-link-card-text {
    font-size: 1.0rem; /* Default font size 1.25rem */
}

.nav-link-card .nav-link-card-line {
    /* border: 5px white; */
    border-top: 3px solid #a8a8a8;
    width: 25%;
    margin-top: 2rem;
    margin-bottom: 2rem;
    transition: border-color 0.3s;
}

.custom-link {
    text-decoration: none;
    color: darkgray;
}
.custom-link:hover{
    color: red;
}
.nav-bar-links {
    background-color: #efefef;
    align-content: center;
    width: 100%;
    margin: 0 auto;
}

.nav-bar-footer {
    background-color: #ed1c24;
    color: #fff;
    margin: 0 0 0 0;
}

.nav-bar-footer .footer-text{
    color: white;
}

.nav-bar-links a {
    color: #8b8b8b;
    text-decoration: none;
}

    .nav-bar-links a:hover {
        color: red;
        text-decoration: underline;
    }


/********************************/
/*** BEGIN: Carousel Settings ***/
/********************************/
.carousel {
    position: relative;
}

.carousel-control-prev, .carousel-control-next {
    position: absolute;
    top: -10%;
    transform: TranslateY(-20%);
}

.carousel-control-prev {
    right: auto;
    left: 20px;
}

.carousel-control-next {
    left: auto;
    right: 20px;
}


/********************************/
/***  END: Carousel Settings  ***/
/********************************/



/*********************************/
/*** BEGIN: Hoover Text Effect ***/
/*********************************/
.Label_Hover_Effect {
    background-color: #fff; /*#efefef;*/
    color: #a8a8a8;
    margin: 0rem;
    transition: background-color 0.3s, color 0.3s;
}
    .Label_Hover_Effect:hover {
        background-color: #b9a16d;
        color: #efefef;
        cursor: pointer;
    }

.modal-backdrop {
    z-index: 1040;
}

.modal-content {
    z-index: 1050;
}
/*********************************/
/***  END: Hoover Text Effect  ***/
/*********************************/





