*{
    box-sizing: border-box;
}

body{
    background:rgb(255, 255, 255);
}

img{
max-width:100%;
}

.container{
    border:1px solid;
    padding:20px;
    width:1000px;
    margin:0 auto;
}

header, footer{
    text-align:center;
    border:1px solid;
    padding:20px;
}

main{
    display:flex;
    gap:10px;
    margin:10px 0;
}

main div{
    border:1px solid;
    padding:20px;
}

.left, .right{
    width:25%;
}

.center{
    width:50%;
}

/* min-width media queries are for mobile-first designs */
@media screen and (max-width:900px)
{
 body {
    background:rgb(255, 255, 255);
 }

main{
    flex-direction:column;
}

main div {
    width:100%;
}

}