body {
  margin: 0;
}

h2 {
  margin: 0;
}

.container {
  display: flex;
  flex-direction: column;
  height: 100vh;
  padding-top: 100px;
  justify-content: flex-start;
  align-items: stretch;
  width: 400px;
  gap: 20px;
}
@media (max-width: 767px) {
       .container {
  display: flex;
  flex-direction: column;
  height: 100vh;
  padding-top: 100px;
  justify-content: flex-start;
  align-items: stretch;
  width: 290px;
  gap: 20px;
}
    
}

@media (min-width: 768px) and (max-width: 1200px)  {
      .container {
  display: flex;
  flex-direction: column;
  height: 100vh;
  padding-top: 100px;
  justify-content: flex-start;
  align-items: stretch;
  width: 400px;
  gap: 20px;
}
}