* {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* padding and border in width and height */
}

/* Body styles */
body {
    font-family: 'Archivo', Arial, sans-serif; /*  font  */
}

/* Header styles */
header {
    position: relative;
}

/* Horizontal navigation bar */
nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: flex;
    justify-content: center; /* Center the items horizontally */
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #ffffff;
    z-index: 999;
}

nav li {
    margin: 0 10px; /* Add margin between each list item */
}

nav li:first-child a {
    background-color: #ffffff; /* Adjust background color for the first navigation item */
    color: #2E69A0; /* Adjust text color for the first navigation item */
    
}

nav li a {
    display: block;
    padding: 14px 16px; /* Add padding to the link text */
    text-decoration: none;
    color: #2E69A0; /* Adjust link text color */
    background-color: transparent; /* Adjust background color for each link */
}

/* Change background color on hover */
nav li a:hover {
    background-color: #ffffff; /* White background color on hover */
}

/* Grid layout */
.grid-wrapper {
    display: grid;
    grid-template-columns: minmax(0px, 1fr) repeat(4, minmax(0, 175px)) minmax(0px, 1fr); /* Adjusted template-columns */
    grid-template-rows: auto; /* adjust this based on your content */
    gap: 10px; /*  gap between grid items */
    padding-top: 50px; /*  padding to accommodate the navigation bar */
}

.row {
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* number of columns based on your grid */
    gap: 10px; /*  gap between grid items */
}

.column {
    position: relative;
    background-color: #ffffff;
    padding: 20px;
    text-align: center; /* Center text horizontally */
}

/*  child on the grid */
/*.column:nth-child(1) {
    /*background-color: #D2A650; /* Color Column 1 */
    /*width: 998px; /*  width of column 1 */
    /*height: 123px; /*  height of column 1 */
    /*grid-column: span 5; /* Span  */
    /*align-self: center; /* Align Column 1  */
/*} */

.column:nth-child(2) {
    position: relative; /* Change to relative positioning */
    background-color: #ffffff; /* Background color */
    padding: 20px; /* Padding */
    text-align: center; /* Center text horizontally */
}
img {
    position: absolute;
    top: 0; /* Adjust as needed */
    left: 1100%; /* Move it to the center horizontally */
    transform: translateX(-50%); /* Move it to the left by 50% of its own width */
}
.overlay-text {
    position: absolute;
    top: 100px; /* y-axis position */
    left: 600px; /* x-axis position */
    width: 177px; /* width of the text */
    height: 80px; /* height of the text */
    text-align: center; /* Center text horizontally */
    font-family: 'Archivo', sans-serif;
    font-size: 24px;
    letter-spacing: 7px;
    color: #ffffff; /* Set the color to black */
}

#company-name {
    position: absolute;
    top: 140px; /* Y-axis position */
    left: 600px; /* X-axis position */
    width: 177px; /* Width of the text */
    text-align: center; /* Center text horizontally */
    font-family: 'Archivo', sans-serif; /* Font family */
    font-size: 26px; /* Font size */
    letter-spacing: 2px;
    color: #ffffff; /* Set the color to black */
}


.column:nth-child(3) {
        position: absolute;
        top: 550px; /* Y-axis position */
        left: 560px; /* X-axis position */
        color: #2E69A0; /* Color of the text */
        font-size: 40px; /* Font size */
        z-index: 1; /* Ensure the text is positioned above other elements */

    .line-under-welcome {
        position: absolute;
        top: 150px; /* Y-axis position */
        left: -100px; /* X-axis position */
        width: 600px; /* Width of the line */
        height: 3px; /* Height of the line */
        background-color: #bdbdbd; /* Color of the line */
        z-index: 3; /* Ensure the line is positioned above other elements */
}

}
.column:nth-child(4) {
    position: absolute;
    top: 800px;
    left: 500px;
    color: black; /* Set the color of the paragraph text */
    font-size: 32px; /* Set the font size of the paragraph text */
    text-align: justify; /* Justify the paragraph text */
    line-height: 1.4; /* Set the line height of the paragraph text */
    width: 550px; /* Adjust the width if needed */
    
}
.column:nth-child(5) {
    position: absolute;
    bottom: -900px; /* Adjust as needed */
    left: 55%; /* Center horizontally */
    transform: translateX(-50%); /* Center horizontally */
    color: #2E69A0; /* Text color */
    font-size: 18px; /* Font size */
    font-weight: bold; /* Font weight */
}

/* Footer styles */
footer {
    position: fixed; /* Fixed position */
    bottom: 0; /* Position at the bottom */
    left: 0; /* Align to the left */
    width: 100%; /* Full width */
    background-color: #ffffff; /* Background color */
    padding: -20px 0; /* Add padding */
    text-align: left; /* Center text horizontally */
    z-index: 999; /* Ensure it appears above other content */
}