/* Basic Reset & Box Sizing */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: sans-serif;
    line-height: 1.6;
    padding: 20px;
    color: #333;
}

header, main, footer {
    width: 90%;
    #max-width: 1000px; /* Prevents content from stretching too wide on large screens */
    margin: 20px auto;
    padding: 15px;
    background: #f4f4f4;
    border: 1px solid #ccc;
    border-radius: 5px;
}

/* Flexible images: ensures images scale within their containers */
img {
    max-width: 100%;
    height: auto;
}


/* Media Query for smaller screens (e.g., mobile phones) */
@media (max-width: 600px) {
    header, main, footer {
        width: 100%; /* Full width on small devices */
        margin: 10px auto;
        padding: 10px;
    }
}