.hero {
  position: relative;
  width: 100vw;
  height: 100%;
  min-height: 100vh;
  padding-top: 20px;
  /*padding-bottom: 60px;*/
  transition: 500ms all ease;
}
.hero .bg_image,
.hero .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  transition: 1000ms all ease;
  top: 0;
  left: 0;
}
.hero .overlay {
  background-color: #3e5e6f;
  opacity: 0.6;
  z-index: 20;
}
.hero .bg_image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 33%;
}
.hero.animate .bg_image img {
	width: 100%;
	height: 100%;
    max-height: 635px;
}
.hero .logo {
  position: relative;
  display: flex;
  justify-content: center;
  z-index: 30;
  transition: 500ms all ease;
}
.hero .logo img{
    width:176px;
    height:79px;
}
.hero .hero_content {
  position: absolute;
  z-index: 20;
  text-align: center;
  left: 0;
  width: 100%;
  bottom: 5vh;
}
.hero .hero_content p {
  max-width: 655px;
  color: black;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  opacity: 0;
  transition: 500ms all ease;
 font-family:"PT Sans";
	font-size:22px;
}
.hero h1 {
  font-size: 140px;
  color: #ffffff;
	opacity: 0.8;
  margin: 0;
  transition: 500ms all ease;
}
.hero .down__arrow {
  width: 100%;
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: 60px;
  left: 0;
  z-index: 50;
}

.hero .down__arrow button {
    padding-left: 11px;
    padding-right: 11px;
    padding-top: 19px;
    padding-bottom: 15px;
  background: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  outline: none;
  border: none;
  transition: 500ms all ease;
}

.hero.animate .logo,
.hero.animate #scroll_down,
.hero.animate .overlay {
  opacity: 0;
  pointer-events: none;
}

.hero.animate .hero_content {
  transition: 1s all ease;
}
.hero.animate h1 {
  font-size: 80pt;
  color: #3e5e6f;
	opacity:1;
}
 
.hero.animate{
    min-height: 100vh;
}

.hero.animate .hero_content p {
  opacity: 1;
	width:100%;
}

.hero.animate .bg_image {
  padding-left: 70px;
  padding-right: 70px;
  /*width: calc(100% - 200px);*/
  height: 64vh;
	display: flex;
    justify-content: center;
}
