/* About Section */
#about {
    background-color: #24292f; /* Background color for the About section */
    color: white; /* Text color */
    display: flex; /* Use flexbox for vertical and horizontal centering */
    align-items: center; /* Center content vertically */
    justify-content: center; /* Center content horizontally */
    min-height: 100vh; /* Full viewport height */
    padding: 20px; /* Add padding as needed */
}

/* About Content */
.about-content {
    display: flex; /* Use flexbox for horizontal layout */
    justify-content: space-between; /* Space between the two elements */
    align-items: center; /* Center items vertically */
    max-width: 1200px; /* Maximum width of the content */
    width: 100%; /* Full width */
    font-family: "Roboto";
}

/* About Text */
.about-text {
    flex: 2; /* Take up equal space */
    margin-right: 20px; /* Space between text and description */
    color: #BDBDBD;
}

.about-text h1 {
    font-size: 2.5em; /* Font size for the heading */
    margin: 0; /* Remove default margin */
    font-family: 'Roboto'; /* Font family */
    line-height: 1.2; /* Line height for better readability */
    font-weight: bold; /* Make the title bold */
}

/* About Description */
.about-description {
    flex: 1; /* Take up more space compared to text */
    font-style: bold !important;

}

.about-description p {
    font-size: 1.2em; /* Font size for the paragraph */
    margin: 0; /* Remove default margin */
    line-height: 1.6; /* Line height for better readability */
}

.etc-text {
    display: block; /* Make it block-level element */
    margin-top: 10px; /* Space above the link */
    color: #FE8D25 !important; /* Link color */
    text-decoration: none; /* Remove underline */
    font-size: 0.9em; /* Font size */
    box-sizing: border-box; /* Include border in the element's total width and height */
}

.etc-text:hover {
    text-decoration: none; /* No underline on hover */
    color: #FE8D25; /* Link color on hover */
    border: solid 1px #FE8D25; /* Border color on hover */
    box-sizing: border-box; /* Include border in the element's total width and height */
}
