[Hacktoberfest 2021] Responsive design with css

My third contribution to the hacktoberfest 2021 was fixing the responsive design.
When I saw the word "responsive", it seemed very interested for me because I have not worked on css for a while after second semester of school.
I chose the issue that I could bring up my old memories from few years ago.
https://github.com/mohitbalwani/Citi-site/issues/1

It is an one-page website that is created with html and css only now, and had some bug with the last section when reducing the window size.

The update was made with css. I first updated the division of the section as two-column design.
Inside "row 4" division, I added two more divisions for the column designs. And added width as percentages to make those columns align horizontally.

.column {
    float:left;
}
#col1 {
    width: 55%;
}

#col2 {
    margin:0%;
    width: 45%;
}

After, I wanted to add some specific rules for smaller windows, by using "@media" struct.

@media(max-width:700px){
    .row4 {
        height: 70vh;
    }
    .column h1{
        font-size: 2rem;
    }
    .form{
        font-size: 1.2rem;
    }
    .column button{
        width: 22vw;
        text-align: center;
    }
    .column {
        align-items: center;
    }
}

After the fixes, with the smaller windows, width under 700px it looked like the image below.

Also, I added another media struct for even smaller windows such as phones.

This issue had very little description and no Readme.md in the project, and that made me understanding the code little longer. However the owner of the project was very responsive and communicated with me well so that I could move on to solve the issues.

You can find my pull request on this issue below.
https://github.com/mohitbalwani/Citi-site/pull/4