.about_header > .video_overlay {
  position: absolute;
  top: 240px;
  left: 0;
  width: 100%;
  height: 80px;
  background: url('/web/templates/images/about_video_overlay.png') no-repeat top center;
  z-index: 9;
}
.about_header > .container {
  z-index: 2;
  margin-top: 240px;
  margin-bottom: 60px;
}
.about_header > .container > .video {
  width: 100%;
  height: 620px;
  margin-bottom: 90px;
}
@media all and (min-width: 621px) and (max-width: 1020px) {
  .about_header > .container > .video {
    height: 340px;
  }
}
@media all and (max-width: 620px) {
  .about_header > .container > .video {
    height: 200px;
  }
}
.about_header > .container > .video > iframe {
  background: #307563;
  position: relative;
  float: left;
  width: auto;
  height: auto;
  width: 100%;
  height: 100%;
}
.about_header > .container > .content {
  width: 530px;
  min-height: 600px;
}
@media all and (min-width: 621px) and (max-width: 1020px) {
  .about_header > .container > .content {
    width: 100%;
    min-height: auto;
    padding: 0 20px;
  }
}
@media all and (max-width: 620px) {
  .about_header > .container > .content {
    width: 100%;
    min-height: auto;
    padding: 0 20px;
  }
}
.about_header > .container > .content > h1 {
  font-size: 60px;
  line-height: 60px;
  font-weight: normal;
  margin-bottom: 25px;
  color: #fff;
}
@media all and (min-width: 621px) and (max-width: 1020px) {
  .about_header > .container > .content > h1 {
    font-size: 40px;
    line-height: 40px;
    color: #1e5546;
  }
}
@media all and (max-width: 620px) {
  .about_header > .container > .content > h1 {
    font-size: 40px;
    line-height: 40px;
    color: #1e5546;
  }
}
.about_header > .container > .content > p {
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 30px;
  color: #fff;
}
@media all and (min-width: 621px) and (max-width: 1020px) {
  .about_header > .container > .content > p {
    color: #000;
  }
}
@media all and (max-width: 620px) {
  .about_header > .container > .content > p {
    color: #000;
  }
}
.about_header > .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #30bc9f;
}
@media all and (min-width: 621px) and (max-width: 1020px) {
  .about_header > .bg {
    display: none;
  }
}
@media all and (max-width: 620px) {
  .about_header > .bg {
    display: none;
  }
}
.about_header > .bg > .top {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 900px;
  background: #fff url('/web/templates/images/about_header_bg_top.jpg') no-repeat bottom center;
  background-size: 100% auto;
}
.about_header > .bg > .bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 500px;
  background: #fff url('/web/templates/images/about_header_bg_bottom.jpg') no-repeat top center;
  background-size: 100% auto;
}
@media all and (min-width: 1021px) and (max-width: 1300px) {
  .about_header > .bg > .bottom {
    height: 340px;
  }
}
@media all and (min-width: 1301px) and (max-width: 1500px) {
  .about_header > .bg > .bottom {
    height: 400px;
  }
}
.about_header > .bg > .image {
  position: absolute;
  bottom: 150px;
  right: 0;
  width: 50%;
  height: auto;
}
@media all and (min-width: 1021px) and (max-width: 1300px) {
  .about_header > .bg > .image {
    width: 45%;
    bottom: 200px;
  }
}
.about_header > .bg > .image > img {
  position: relative;
  float: left;
  width: auto;
  height: auto;
  max-width: 100%;
}
/*# sourceMappingURL=about_header.css.map */