h1{
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: weight;
  font-style: normal;

}
h2{
  font-family: "Inter", sans-serif;
  font-style: normal;

}
.hero h1,p{
  text-align: center;
}
.hero{
  background-color: gainsboro; 
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 450px;

}
.hero h2{
    font-family: 'inter', Helvetica, sans-serif;
    font-weight: 500;
    font-style: italic;
    margin-top: 20px;
    align-self: start;
}
.hero_image{
    align-self: center;
    height: 200px;
    margin-top: 30px;
    justify-self: center;
}
.hero a{
  justify-self: center;
  align-self: center;
}
.cta{
    color: white;
    align-self: center;
    background-color: #22C55E;
    width: 120px;
    height: 40px;
    justify-self: center;

}

.latest_blog{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;


}
.blog{
  margin-top: 20px;
}
.blog_img{
    align-self: center;
    justify-self: center;
    width: 70vw;
    
    
}
.latest_blog h3{
    align-self: center;
    justify-self: center;
}
.about {
  max-width: 720px;
  margin: 80px auto;
  padding: 0 20px;
}

.about h1 {
  font-size: 2rem;
  margin-bottom: 16px;
}

.about p {
  font-size: 1rem;
  line-height: 1.7;
  margin-bottom: 16px;
  color: #475569;
}
.Calculator{
  display: flex;
  flex-direction: column;
  width: 70vw;
 


}
.Calculator button{

  margin-top: 20px;
  align-self: center;
  background-color:  rgb(13 110 253);
  color: white;

}
#email-calculator{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#email-calculator h1,p{
  justify-self: center;
  margin-left: 20px;
  align-self: center;

  
}
.Calculator #result{
  justify-content: center;
  align-self: center;


}
#email-calculator h2{
  margin-left: 50px;
}
body{
  padding-left: 20px;
  padding-right: 20px;
}
.free-tool img{
  width: 40vw;
  float: right;
    
}
.free-tool h2{
  text-align: center;
}
.free-tool{
  display: flex;
  padding-top: 80px;

}
.free-tool div{
  align-self:center;
  padding-right: 5vw;
  text-align: left;

}
.free-tool button{
  margin-top: 20px;
  width: 10vw;
}
#email-calculator p{
  text-align: left;
}
@media (max-width:650px) {
.free-tool img{
  width: 0;
}

}
.faq h2{
  margin-top: 80px;
}