/* ........................Top Bar........................ */
/* Top Bar Background */
.top-bar-bg {
    background-color: #098a9c; /* DodgerBlue */
}

/* Social Media Icons */
.text-white a {
    color: white;
    margin: 0 5px;
}

/* General Styles */
body {
    background-color: #F8F9FA; /* Light Grey for a clean look */
    color: #343A40; /* Dark Grey for text */
}

a {
    color: #1E90FF; /* DodgerBlue for links */
}

a:hover {
    color: #104E8B; /* Darker shade for hover state */
}

/* Social Media Icon Styles */
.fa-facebook-f {
    background: #4287f5;
    color: white;
    padding: 4px;
    font-size: 16px;
    width: 25px;
    text-align: center;
    text-decoration: none;
    margin: 5px 2px;
}

.fa-instagram {
    background: linear-gradient(30deg, #f38334, #da2e7d 50%, #6b54c6);
    color: white;
    padding: 4px;
    font-size: 16px;
    width: 25px;
    text-align: center;
    text-decoration: none;
    margin: 5px 2px;
}

.fa-youtube {
    background: #FF0000;
    color: white;
    padding: 4px;
    font-size: 16px;
    width: 25px;
    text-align: center;
    text-decoration: none;
    margin: 5px 2px;
}

.fa-whatsapp {
    background: #25D366;
    color: white;
    padding: 4px;
    font-size: 16px;
    width: 25px;
    text-align: center;
    text-decoration: none;
    margin: 5px 2px;
}


/* Navbar Styles */
.img1 {
    height: 70px;
    width: 110px;
}

.navbar-toggler {
    border-color: #098a9c; /* Customize border color */
}

.navbar-toggler-icon {
    background-image: none; /* Remove default icon */
}

.navbar-toggler .navbar-toggler-bar {
    display: block;
    width: 25px;
    height: 3px;
    background-color: #098a9c; /* Customize bar color */
    margin: 5px 0;
}

.navbar-nav .nav-link {
    color: #344767; /* Link color */
}

.navbar-nav .nav-item .nav-link:hover {
    color: grey; /* Hover color */
    text-decoration: none; /* Remove underline */
}

.navbar-collapse {
    display: flex;
    justify-content: flex-start; /* Align content to the left */
}

.navbar-brand {
    margin-right: auto; /* Pushes the logo to the left */
}

/* Ensure navbar collapses correctly on small screens */
@media (max-width: 991.98px) {
    .navbar-collapse {
        display: none;
    }

    .navbar-collapse.collapse.show {
        display: flex !important;
        flex-direction: column; /* Stack items vertically */
        align-items: flex-start; /* Align items to the left */
        width: 100%; /* Ensure it takes up the full width */
    }
    
    .navbar-nav {
        width: 100%; /* Ensure the navbar items take up the full width */
    }
    
    .navbar-nav .nav-item {
        width: 100%; /* Ensure each navbar item takes up the full width */
    }
    
    .navbar-nav .nav-item .nav-link {
        text-align: left; /* Align text to the left */
        width: 100%; /* Ensure each link takes up the full width */
    }
}


/* .............................hero section section 1.......................... */

.bg-cover {
    background-size: cover;
  }
  .bg-gradient-light {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background: rgba(255, 255, 255, 0.7); */
  }
  .text-light {
    color: #fff !important;
  }
  .text-3xl {
    font-size: 1rem;
  }
  .bg-light-brown {
    background-color: #098a9c
;
  }
  .shadow-info {
    box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);
  }
  .border-radius-lg {
    border-radius: 0.5rem;
  }
  .input-group-dynamic {
    position: relative;
  }
  .input-group-dynamic .form-control {
    padding: 0.5rem;
    height: auto;
  }
  .input-group-dynamic label {
    position: absolute;
    top: 0;
    left: 0;
    padding: 1rem;
    pointer-events: none;
    transition: all 0.2s ease;
  }
  .input-group-dynamic .form-control:focus + label,
  .input-group-dynamic .form-control:not(:placeholder-shown) + label {
    top: -1rem;
    left: 1rem;
    font-size: 0.75rem;
    color: #80461B;
  }

  

/* ........................About Us........................ */
.img3 {
    width: 400px;
    height: 300px;
}

.image1 {
    width: 500px;
    height: 200px;
}



/* Additional styling for responsiveness */
@media (max-width: 768px) {
    .img3 {
        width: 100%;
        height: auto;
    }
}

/* ........................Kripa services........................ */

.icon {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}
.icon-shape {
    color: white;
}
.bg-gradient-primary {
    background: linear-gradient(87deg, #11cdef 0, #1171ef 100%) !important;
}
.bg-gradient-info {
    background: linear-gradient(87deg, #2dce89 0, #2dcecc 100%) !important;
}
.bg-gradient-warning {
    background: linear-gradient(87deg, #fb6340 0, #fbb140 100%) !important;
}
.shadow {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}
.opacity-10 {
    opacity: 0.1;
}

/* ........................3 car section........................ */


.card-header {
    padding: 0;
    overflow: hidden;
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem;
}

.card-header img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.car-section {
    padding-top: 5rem;
    padding-bottom: 0;
}

.badge {
    display: inline-block;
    font-size: 1rem;
}

.mt-6 {
    margin-top: 2rem !important;
}

.mb-5 {
    margin-bottom: 1.25rem !important;
}

/* .......................Read More About Us................................ */
 .bg-gradient-dark {
            background: linear-gradient(87deg, #212529 0, #000000 100%) !important;
        }

        .info-horizontal {
            display: flex;
            align-items: center;
            margin-bottom: 1.5rem;
        }

        .icon-shape {
            width: 50px;
            height: 50px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
        }

        .shadow-info {
            box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        }

        .icon-move-right {
            display: flex;
            align-items: center;
            /* color: #80461B; */
            text-decoration: none;
        }

        .icon-move-right i {
            margin-left: 0.5rem;
            transition: margin-left 0.2s;
        }

        .icon-move-right:hover i {
            margin-left: 1rem;
        }

        .description p {
            margin-bottom: 0;
        }

        .info-horizontal .icon {
            margin-right: 20px; /* Adjust the value as needed */
        }

        .equal-height-columns {
            display: flex;
            align-items: stretch;
        }

/* ........................accordion section.................................. */

.collapse-icon {
    right: 15px; /* Adjust this value as needed to place the icon correctly */
    top: 50%; /* Center vertically */
    transform: translateY(-50%); /* Center vertically */
}



/* ........................footer........................ */

.footer {
    background: #333;
    color: white;
}
.footer a {
    color: white;
    font-size: 14px;
}
.footer a:hover {
    color: #91979e;
    text-decoration: none;
}
.footer h6 {
    color: white;
}
.footer hr {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}