.blog-button:hover{
    color: #000;
    background-color: #00ADEE;
    border-color: #00ADEE !important;
    transition: 1s;
}
.only-link:hover{
    color: #14416b !important;
    transition: 1s;
}
.new-search-button{
    border-left: none;
    background: #14416b;
    color: white;
    font-weight: 700;
    border: none;
    border-radius: 0 20px 20px 0 !important;
}
.text-48{
    font-size: 48px !important;
    font-weight: 600 !important;
}
.new-search-button:hover{
    background: #00ADEE;
    transition: 1.4s;
    color: white;
    font-weight: 700;
}
.shape-circle{
    width: 50px;
    height: 50px;
}
/* blogs button alignment */
.darkbluebtn2 {
    background-color: #003366; /* Dark blue background */
    color: white; /* White text */
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* preparing the work Force */
/* preparing the work Force */
.Meet{
    background-image: url(../assets/blogs-image/Meet.webp)!important;
    width: 95% !important;
    height: 80vh !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* preparing the work Force */
/* preparing the work Force */
/* 
.darkbluebtn2.active4 {
    background-color: #ffffff; /* Different shade for active state */
    
 */

.darkbluebtn2.hidden1 {
    display: none; /* Hide the button */
}
.box-shawdow{
    box-shadow :0px 10px 60px 0px rgba(227, 221, 221, 0.5);
}
.left-gone{
    display: inline-block;
    position: relative;
}
.left-gone:hover{
    transform: translateX(8px);
}
.hiddenn{
    display: none;
}





  /* Ensure the container is responsive */
  .responsive_card {
    width: 100% !important;
    /* Full width for responsiveness */
    max-width: 47rem !important;
    /* Maximum width */
}
/* cisco certificate */
/* cisco certificate */
.cisco-certificate{
    background-image: url(../assets/blogs-image/cisco-certificate.jpg)!important;
    width: 95% !important;
    height: 80vh !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}
/* cisco certificate */
/* cisco certificate */





/* Optional: Add some shadow for card */
.box-shadow {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    /* Light shadow */
}

/* Ensure text and elements scale properly */
.text-17 {
    font-size: 1rem;
    /* Default font size */
}

@media (min-width: 600px) and (max-width: 768px) {
    .text-17 {
        font-size: 0.875rem;
        /* Smaller font size on smaller screens */
    }

    .responsive_card {
        max-width: 100%;
        /* Adjust width for smaller screens */
    }
    body{
position: sticky!important;
overflow-x: hidden!important;
}
.row{
--bs-gutter-x: 0!important;
--bs-gutter-y: 0!important;
}
}

@media (min-width: 340px) and (max-width: 576px) {
    .text-17 {
        font-size: 0.75rem;
        /* Further smaller font size on extra small screens */
    }
    .responsive_card {
        max-width: 100%;
        /* Adjust width for smaller screens */
    }
    .poster{
        font-size: 12px !important;
    }
    .box-shadow {
        box-shadow: none;
        /* Remove shadow on very small screens if needed */
    }
    .text-48{
        font-size: 22px !important;
        font-weight: 800 !important;
    }
    body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
}

/* General Card Styling */
.card {
    border: none;
    /* Remove card border */
    width: 100%;
    /* Full width for responsiveness */
    max-width: 50rem;
    /* Maximum width for large screens */
    margin: auto;
    /* Center align card on large screens */
}

.img-container {
    height: 100%;
    min-height: 460px;
    /* Minimum height for image container */
}

.bg-image {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    /* Center background image */
    height: 100%;
}

/* Add box shadow */
.box-shawdow {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    /* Light shadow */
}

/* Text Scaling */
.text-17 {
    font-size: 1rem;
    /* Default font size */
}


.poster {
    width: 100% !important;
    /* Full width set karein */
    box-sizing: border-box;
    /* Padding aur border ko width mein shamil karein */
}
@media (max-width: 586px) {
.special{
right: 0 !important;
}
.dashboard-img {
background: none !important;
}
.image-sindhDevelopment{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}
.Meet{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}
}
@media (min-width: 760px) and (max-width: 800px){
.special{
right: 25% !important;
}
.image-sindhDevelopment{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}
.text-48{
    font-size: 30px !important;
    font-weight: 800 !important;
}
.Meet{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}   
}
@media (min-width: 820px) and (max-width: 930px){
.special{
right: 25% !important;
}
.text-48{
    font-size: 30px !important;
    font-weight: 800 !important;
}
.image-sindhDevelopment{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}
.Meet{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}

}
@media (min-width: 800px) and (max-width: 830px){
.special{
right: 25% !important;
}
.image-sindhDevelopment{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}
.Meet{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}
}
@media (min-width: 930px) and (max-width: 1130px){
.special{
right: 22% !important;
}
.text-48{
    font-size: 30px !important;
    font-weight: 800 !important;
}
.image-sindhDevelopment{
    max-height: 300px; /* Limit height on smaller screens */
    object-fit: cover; /* Ensure the image covers the area without distortion */
}
}
@media (min-width: 1130px) and (max-width: 1330px){
.special{
right: 25% !important;
}
}