I have made this website using pure html and css

Hi @akojha556 👋

Great job on your solution!

Here are some recommendations for you:

• I suggest using flexbox and min-height to center your content. See the example below.

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "Roboto", sans-serif;
  text-align: center;
  padding: 5rem;

  /*Add the code below*/
  justify-content: center; /*This will center your content vertically*/
  min-height: 100vh; /*This sets the minimum height of the container to 100% of the viewport's height*/
}

• Now a vertical overflow will appear. Remove the margin in the body to remove that overflow.

body {
  background-color: #d5e1ef;

  /*Add the code below*/
  margin: 0;
}

• Regardless your question. I suggest checking out the BEM's naming convention: https://getbem.com/

I hope this helps a little.

Well done for the rest.