/* Home Page Styling */
.trainingmain-container {
    text-align: center;
    margin: auto;
    overflow: hidden;
    width: 100vw; /* Full viewport width */
    max-width: 100%;
    height: 30vw;
    box-sizing: border-box;
    background: linear-gradient(120deg, #111314, #131e27);
    padding: 20px;
    color: white;
    background-image: url('../images/trainingboard.png'); /* Replace with your actual image path */
    background-blend-mode:darken;
    background-size:50%; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    background-attachment: fixed; /* Keeps the background fixed while scrolling */
}
.trainingmain-container::before {
    content: "";
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* Dark overlay */
}

/* Title Styling */
.trainingmain-container h1 {
    font-size: 3em;
    margin-bottom: 3cqb;
}

.trainingmain-container p {
    font-size: 1.2em;
    margin: 5px 0;
}
.training-container {
    text-align: center;
    margin: auto;
    overflow: hidden;
    width: 100vw; /* Full viewport width */
    max-width: 100%;
    box-sizing: border-box;
    background: linear-gradient(120deg, #f2f4f6, #c2def4);
    padding: 20px;
    color: black;
}

/* Title Styling */
.training-container h1 {
    font-size: 3em;
    margin-bottom: 10px;
}

.training-container p {
    font-size: 1.2em;
    margin: 5px 0;
}

/* Main Container for Image & Text */
.image-text-container {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 65%; /* Ensures it doesn’t stretch too much */
    margin: 10px auto;
    padding: 0;
    gap: 0;
    flex-wrap: wrap; /* Allows wrapping on smaller screens */
    overflow: hidden; /* Prevents horizontal scrolling */
}

/* Image Styling */
.image-container {
    flex: none;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.image-container img {
    width: 300px;
    height: auto;
    border-radius: 10px;
    margin: 0;
    padding: 0;
}

/* Text Styling */
.text-content {
    flex: none;
    text-align: left;
    max-width: 100%;
    margin: 0;
    padding: 10px;

}
/* Main Container for Image & Text */
.image-text-container1 {
    display: flex;
    align-items: center; /* Vertically align items */
    justify-content: space-between; /* Keep image and text aligned */
    width: 100%;
    max-width: 90%; /* Keeps content within screen */
    margin: 0 auto; /* Centering */
    padding: 10px;
    flex-wrap: wrap; /* Allows wrapping on smaller screens */
    flex-direction: row-reverse; /* Moves image to the right and text to the left */
}

/* Image Styling */
.image-container1 {
    flex: 1; /* Allows it to share space equally */
    display: flex;
    justify-content: flex-start; /* Aligns image to the left */
}

.image-container1 img {
    width: 100%; /* Responsive size */
    max-width: 100%; /* Prevents it from getting too large */
    height: auto;
    border-radius: 10px;
    margin-left: 10%;
}

/* Text Styling */
.text-content1 {
    flex: 1; /* Allows it to share space equally */
    text-align: left;
    padding-left: 10px; /* Adds space between image & text */
}

/* Heading Styling */
.image-text-container1.left-layout h1 {
    width: 100%;
    text-align: left;
    font-size: 24px !important; /* Ensures size change */
    font-weight: bold;
    margin-bottom: 10px;
}




/* Responsive Fix for Mobile */
@media screen and (max-width: 768px) {
    .image-text-container1 {
        flex-direction: column; /* Stack image & text vertically */
        align-items: center;
        text-align: center;
    }

    .image-container1,
    .text-content1 {
        width: 100%; /* Make both sections full width */
        text-align: left;
    }

    .text-content1 {
        padding-left: 0;
        margin-top: 10px;
    }
    .trainingmain-container {
        text-align: center;
        margin: auto;
        overflow: hidden;
        width: 100vw; /* Full viewport width */
        max-width: 100%;
        height: 40vw;
        
    }
    .trainingmain-container h1 {
        font-size: 2em;
       margin-top: 10px;
    }
    
    .trainingmain-container p {
        font-size: 1em;
        margin: 5px 0;
    }

    
}


/* 📌 Responsive Fix for Mobile */
@media screen and (max-width: 768px) {
    .image-text-container {
        flex-direction: column; /* Stack image & text vertically */
        max-width: 90%; /* Increase width to fit mobile screen */
        text-align: center; /* Center text */
    }

    .image-container img {
        width: 100%; /* Make images responsive */
        max-width: 300px; /* Limit size */
    }
    .image-container1 img {
        width: 100%; /* Make images responsive */
        max-width: 300px; /* Limit size */
    }

    .text-content {
        max-width: 100%; /* Allow full width text */
        text-align: center;
    }
}



.automation-container {
    text-align: center;
    margin: auto;
    overflow: hidden;
    width: 100vw; /* Full viewport width */
    max-width: 100%;
    box-sizing: border-box;
    background: linear-gradient(120deg, #ffffff, #c5f1ff);
    padding: 20px;
    color: black;
    
}

/* Title Styling */
.automation-container h1 {
    
    font-size: 3em;
    margin-bottom: 10px;
    margin-left: 5%;
}

.automation-container p {
   
    font-size: 1.2em;
    margin: 5px 0;
    margin-left: 5%;
}

ul {
    list-style-type: disc; /* Use bullet points */
    padding-left: 20px; /* Adjust indentation */
}

li {
    margin-bottom: 8px; /* Add spacing between bullet points */
    font-size: 1.2em;
    margin: 5px 0;

}