/* Style for carousel */
   .carousel {
    position: relative; /* Ensure carousel is positioned correctly */
    z-index: 10; /* Higher z-index to ensure it appears above other elements */
}

/* Style for navbar */
.navbar {
    position: relative; /* or 'fixed' depending on your layout */
    z-index: 5; /* Lower z-index to ensure it appears below the carousel */
}

/* Style for carousel button */
.carousel-caption .cta-btn a.btn-slider {
    background-color: red; /* Background color */
    color: white; /* Text color */
    opacity: 1; /* Ensure opacity is set to 1 for full visibility */
    padding: 15px 30px; /* Equal padding on all sides */
    border-radius: 5px; /* Rounded corners for button */
    display: inline-block; /* Ensure button is inline with text */
    text-decoration: none; /* Remove underline from text */
    font-size: 18px; /* Adjust font size */
    font-weight: bold; /* Make text bold */
    text-align: center; /* Center text inside the button */
    line-height: 1.5; /* Adjust line height for vertical centering */
    border: none; /* Remove border */
    transition: background-color 0.3s ease; /* Smooth transition for background color */
}

/* Hover state for carousel button */
.carousel-caption .cta-btn a.btn-slider:hover {
    background-color: #114da3; /* Background color on hover */
    border: none; /* Ensure border remains removed on hover */
}

/* Style for carousel caption */
.carousel-caption {
    position: absolute;
    top: 30%;
    left: 25%;
    transform: translate(-50%, -50%);
    text-align: center;

    color: black; /* Set text color to white */
    padding: 20px;
    border-radius: 10px; /* Rounded corners for caption */
    max-width: 90%; /* Adjust max width to prevent overflow */
    z-index: 15; /* Ensure caption is above other content */
}

/* Specific styling for text elements inside the caption */
.carousel-caption h1{
    color:#164193;

}

.carousel-caption h5{
    font-size: 20px; /* Adjust font size for smaller screens */


}
.carousel-caption p {
    color: white; /* Ensure all text is white */
}

.carousel .item {
    position: absolute;         /* Stack the items on top of each other */
    top: 0;                     /* Align items to the top */
    left: 0;                    /* Align items to the left */
    width: 100%;                /* Ensure each item takes up full width */
    opacity: 0;                 /* Initially hide the slides */
    visibility: hidden;         /* Ensure hidden slides do not interact */
    transition: opacity 0.7s ease, visibility 0.7s ease; /* Smooth transition */
}

.carousel .item.active {
    opacity: 1;                 /* Make the active slide visible */
    visibility: visible;        /* Ensure the active slide is interactable */
    position: relative;         /* Make the active slide properly positioned */
}

.carousel .item.inactive {
    opacity: 0;                 /* Hide the inactive slides */
    visibility: hidden;         /* Ensure hidden slides are non-interactive */
}

.carousel .carousel-control {
    cursor: pointer;
}

/* Responsive styling */
@media (max-width: 999px) {
    .carousel-caption {
        font-size: 14px; /* Adjust font size for smaller screens */
        padding: 10px; 
        margin-top:20px;
        top: 50%;
    color:white;
    background-color: rgba(0, 0, 0, 0.3);


    left: 50%;/* Adjust padding for smaller screens */
    }
    .carousel-caption h5{
    font-size: 15px; /* Adjust font size for smaller screens */


}
    .carousel-caption h1 {
        font-size: 17px; 
        color:white;
    }

    .carousel-caption p {
        font-size: 12px; /* Adjust paragraph size for smaller screens */
    }
}



.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Responsive columns */
  gap: 20px; /* Space between items */
  padding: 20px;
  justify-content: center; /* Center items horizontally */
}

.grid-item {
  background-color: #FFF; /* Background color for each item */
  color: #333; /* Text color */
  padding: 20px;
  border-radius: 8px; /* Rounded corners */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Light shadow for depth */
  height: 300px; /* Fixed height for symmetric boxes */
  display: flex;
  height:100%;
  flex-direction: column;
  justify-content: space-between; /* Space out content vertically */
  overflow: hidden; /* Ensure content stays within the box */
  text-align: center; /* Center text */
}
.grid-item h1{
    color:#164193;
}
.page-header {
  text-align: center;
  margin-bottom: 20px;
  color: #0c4da2;
}

h3 {
  margin-top: 0;
}

blockquote {
  margin: 0;
  padding: 0;
  border-left: 4px solid #3668af; /* Accent line for blockquote */
  padding-left: 20px;
  height: 100%; /* Ensure blockquote takes full height of the grid item */
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden; /* Ensure list items stay within the container */
}

li {
  margin-bottom: 10px; /* Space between list items */
}

.info {
  color: white; /* Icon color */
}

@media (max-width: 768px) {
  .grid-container {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); /* Adjust item size for medium screens */
  }
}

@media (max-width: 576px) {
  .grid-container {
    grid-template-columns: 1fr; /* Single column layout for small screens */
  }
}

.brand {
    display: flex;
    justify-content: center; /* Align horizontally in the center */
    align-items: center;     /* Align vertically in the center */
    height: 100%;            /* Make sure the parent takes full height */
  }

  .brand img {
  max-width: 100%;
  height: auto;  /* Ensure the image is responsive */
  border-radius: 50%;  /* This makes the image circular */
  object-fit: cover;    /* Ensures the image covers the container without distortion */
  aspect-ratio: 1 / 1;  /* Maintains a square aspect ratio */
}


.image-box {
  width: 150px;        /* Set the width of the image box */
  height: 150px;       /* Set the height of the image box */
  border-radius: 50%;  /* Make the box circular */
  overflow: hidden;    /* Ensure the image doesn't overflow the box */
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);  /* Optional: Add a shadow for a nice effect */
  background-color: #f0f0f0;  /* Optional: Add a background color */
}

.image-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* Ensures the image covers the container without distortion */
}

.content-block {
  width: 300px;           /* Set a fixed width for the block */
  padding: 20px;          /* Add some padding inside the block */
  margin: 0 auto;         /* Center the block horizontally */
  text-align: center;     /* Align the text in the center */
  background-color: #f9f9f9;  /* Light background color for better visibility */
  border-radius: 10px;    /* Rounded corners for a softer look */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);  /* Optional shadow for depth */
}

.content-block h1, .content-block h3, .content-block h4, .content-block p {
  margin: 10px 0;         /* Add margin between elements */
}

.content-block h1 {
  font-size: 1.5em;       /* Adjust font size for the name */
  color: #164193;         /* Use your preferred color */
}

.content-block h3 {
  font-size: 1.2em;       /* Adjust font size for the title */
  color: #e20613;         /* Use your preferred color */
}

.content-block h4 {
  font-size: 1em;         /* Adjust font size for the company name */
  color: #666;            /* A muted color for the subtitle */
}

.content-block p {
  font-size: 0.9em;       /* Slightly smaller text for the description */
  color: #333;            /* Darker color for readability */
}


/* Navbar styling */
.navbar {
    position: fixed; /* Fix navbar to the top of the viewport */
    top: 0; /* Align to the top of the viewport */
    left: 0; /* Align to the left of the viewport */
    width: 100%; 
    z-index: 99999; /* High z-index to ensure it appears above other content */
    background-color: #fff; /* Background color for the navbar */
    border-bottom: 1px solid #ddd; /* Optional: border to separate navbar from content */
    padding: 10px 0; /* Optional: padding for spacing */
    transition: top 0.3s ease; /* Smooth transition for moving */
}

/* Positioned element */
.absposition {
    position: fixed;
    margin-top: 10px;
    right: 0;
    z-index: 100000 !important;
}

/* Advantage section styling */
.advantage .fa-general {
    color: #0c4da2;
    display: block;
    font-size: 5em;
    padding: 10px;
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
}

.advantage .fa-general:hover {
    transform: scale(1.2, 1.2);
    color: #bf2727;
}

.advantage > div {
    text-align: center;
    padding: 2em;
}

.advantage a {
    font-family: 'Source Sans Pro', sans-serif;
    color: #333;
    text-decoration: none;
    font-size: 1.5em;
    font-weight: 600;
}

.main-container{
    z-index: 1020 !important; 

}

 



.cta-btn {
    position: fixed;
    bottom: -20px; /* Adjust this value to fine-tune the button's position */
    left: 50%;
    transform: translateX(-50%);
}




/* Responsive styling for buttons */
@media screen and (max-width: 1200px) {
    .advantage .fa-general {
        font-size: 4em;
    }

    .advantage a {
        font-size: 1.3em;
    }
}

@media screen and (max-width: 1000px) {
    .advantage .fa-general {
        font-size: 2em;
    }

    .cta-btn {
    position: fixed;
    bottom: 26%; /* Keep the vertical position the same */
    left: 50%;
    transform: translateX(-50%);
    padding: 8px 16px;  /* Adjust padding for smaller button */
    font-size: 14px;    /* Decrease font size */
    width: auto;        /* Ensure the width adjusts to content */
    border-radius: 5px; /* Optional: Smaller rounded corners */
}


    .advantage a {
        font-size: 1.2em;
    }
}

@media screen and (max-width: 668px) {
    .advantage .fa-general {
        font-size: 2.5em;
    }

    .advantage a {
        font-size: 1.1em;
    }
}

@media screen and (max-width: 576px) {
    .advantage .fa-general {
        font-size: 2em;
    }

    .advantage a {
        font-size: 1em;
    }
}

/* Button Styles */
.cta-btn a.btn {
    display: inline-block; /* Ensure the button takes up space */
    padding: 10px 20px; /* Default padding */
    font-size: 16px; /* Default font size */
    border-radius: 5px; /* Rounded corners */
    text-align: center; /* Center text within the button */
    transition: background-color 0.3s, color 0.3s; /* Smooth transition */
    text-decoration: none; /* Remove underline */
}

.cta-btn a.btn:hover,
.cta-btn a.btn:focus {
    background-color: #114da3; /* Background color on hover */
    color: #ffffff; /* Text color on hover */
}

.cta-btn h2 {
    margin: 0; /* Remove default margin */
    font-size: 16px; /* Font size for the heading */
}

/* Responsive Styling */
@media (max-width: 767px) {
    .cta-btn a.btn {
        padding: 8px 16px; /* Smaller padding on small screens */
        font-size: 14px; /* Smaller font size */
        border-radius: 4px; /* Slightly smaller border radius */
    }

    .cta-btn h2 {
        font-size: 12px; /* Adjust heading font size */
    }
}

@media (max-width: 480px) {
    .cta-btn a.btn {
        padding: 6px 12px; /* Even smaller padding on extra-small screens */
        font-size: 10px; /* Even smaller font size */
        border-radius: 3px; /* Even smaller border radius */
    }

    .cta-btn h2 {
        font-size: 12px; /* Adjust heading font size */
    }
}

/* Form container styles */
.form-container {
    max-width: 500px; /* Maximum width of the form */
    margin: 0 auto; /* Center the form horizontally */
    padding: 20px; /* Padding inside the form */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Subtle shadow for depth */
    background-color: #f9f9f9; /* Light background color */
    box-sizing: border-box; /* Include padding and border in element's total width and height */
}

/* General form group styles */
.form-group {
    margin-bottom: 15px; /* Spacing between form controls */
}

/* Form control styles */
.form-control {
    width: 100%; /* Full width input fields */
    padding: 10px; /* Padding inside input fields */
    border: 1px solid #ddd; /* Light border color */
    border-radius: 5px; /* Rounded corners */
    box-sizing: border-box; /* Include padding and border in element's total width and height */
    font-size: 16px; /* Font size */
}

/* Focus state for form controls */
.form-control:focus {
    border-color: #114da3; /* Change border color on focus */
    outline: none; /* Remove default outline */
}

/* Submit button styles */
.btn-primary {
    background-color: #114da3; /* Primary button background color */
    border: none; /* Remove default border */
    color: white; /* Button text color */
    padding: 8px 15px; /* Adjust padding to fit text snugly */
    font-size: 16px; /* Font size */
    border-radius: 5px; /* Rounded corners */
    cursor: pointer; /* Pointer cursor on hover */
    text-align: center; /* Center-align text */
    display: inline-block; /* Ensure button size fits content */
    text-decoration: none; /* Remove underline from links */
    transition: background-color 0.3s; /* Smooth transition for background color */
}

/* Hover effect for the submit button */
.btn-primary:hover {
    background-color: #0c3d7b; /* Darker background color on hover */
}

/* Responsive styling */
@media (max-width: 1000px) {
    .form-control {
        font-size: 10px; /* Adjust font size for smaller screens */
        margin-bottom: 20px; /* Increase space between input fields */
    }
}

@media (max-width: 480px) {
    .form-control {
        font-size: 12px; /* Further reduce font size */
        margin-bottom: 25px; /* Further increase space between input fields */
    }

    .btn-primary {
        font-size: 14px; /* Adjust font size for smaller screens */
        padding: 10px 15px; /* Adjust padding for smaller screens */
    }
}

.Certifications {
    background-color: #f2f7ff!important;
    padding: 10px;
}
.cirblue3{
	color:white;
}
.btn{
	background-color: #e20613!important;


}
.btn:hover{
	background-color: #164193!important;

}

.features-icon {
    color: #114da3;
}