viewport.css

//CSS units - viewport - vh,vw,vmax,vmin
//Refered in - https://alligator.io/css/viewport-units/
body {
  margin: 0;
  padding: 0;
}
html, body {
  overflow-x: hidden;
}
nav {
  height: 3rem;
  background-color: blue;
}
.hero__section, .subhero__section {
  display: flex;
  align-items: center;
  justify-content: center;
  
  width: 100vw;
  position: relative;
  left: 50%;
  margin-left: -50vw;
}
.hero__section { 
  height: calc(100vh - 3rem);
  background: linear-gradient(45deg, #DA4453, #89216B);
}
.subhero__section {
  height: 25vh;
  background: linear-gradient(115deg, #4e54c8, #8f94fb);
}
h1 {
  font-size: 8vw; 
  /*font-size: 8vmax;*/
  text-align: center;
}