/* CSS Document */
@media only screen and (max-width: 1480px) {
  .wrapper_inner {
    width: 100%; }

  .hero_bg {
    background-image: url("../images/Quadrant-butterfly@1x.jpg");
    background-position: center left; }

  .social_wrapper {
    padding: 70px 40px 0 0; }

  .hero_content {
    width: 648px;
    padding: 0 40px 0 0; } }
@media only screen and (max-width: 1210px) and (orientation: landscape) {
  .hero_bg {
    background-image: url("../images/Quadrant-butterfly@1x.jpg");
    background-position: center left; }

  .social_wrapper {
    padding: 40px 40px 0 0; }

  .hero_content h1 {
    font-size: 4.6vw;
    margin: 0 0 20px 0; }

  .hero_content p {
    font-size: 2.2vw;
    letter-spacing: 0; }

  .content .left_col {
    padding: 0 120px 0 70px; }

  .content .right_col {
    padding: 0 70px 0 0; }

  footer {
    height: 200px; }

  footer .right_col {
    width: 100%;
    top: 30px; }

  footer .left_col {
    width: 100%;
    bottom: 30px; }

  footer .left_col p {
    padding: 0 0 0 70px; }

  footer .right_col {
    padding: 0 70px 0 0; } }
@media only screen and (max-width: 1210px) and (orientation: portrait) {
  .hero_bg {
    background-image: url("../images/Quadrant-butterfly-1024@1x.jpg");
    background-position: center left; }

  .social_wrapper {
    padding: 40px 40px 0 40px; }

  .hero_content {
    width: 100%;
    padding: 0 40px 0 0;
    bottom: 40px;
    top: auto;
    right: auto;
    left: 0;
    bottom: 55px; }

  .hero_content h1 {
    font-size: 2vw;
    margin: 0 0 20px 0; }

  .hero_content p {
    font-size: .5vw;
    letter-spacing: 0; }

  .hero_arrow {
    display: none; }

  .content .left_col {
    padding: 0 120px 0 70px; }

  .content .right_col {
    padding: 0 70px 0 0; }

  footer {
    height: 200px; }

  footer .right_col {
    width: 100%;
    top: 30px; }

  footer .left_col {
    width: 100%;
    bottom: 30px; }

  footer .left_col p {
    padding: 0 0 0 70px; }

  footer .right_col {
    padding: 0 70px 0 0; } }
@media only screen and (max-width: 800px) and (orientation: landscape) {
  .hero_bg {
    background-image: url("../images/Quadrant-butterfly@1x.jpg");
    background-position: bottom left; }

  .social_wrapper {
    padding: 40px 40px 0 40px; }

  .content_bg {
    padding: 30px 0 30px 0; }

  .content .left_col {
    padding: 0 40px 0 40px;
    width: 100%; }

  .content .right_col {
    padding: 0 40px 0 40px;
    width: 100%; }

  footer {
    height: 200px; }

  footer .right_col {
    width: 100%;
    top: 30px; }

  footer .left_col {
    width: 100%;
    bottom: 30px; }

  footer .left_col p {
    padding: 0 0 0 40px; }

  footer .right_col {
    padding: 0 40px 0 0; } }
@media only screen and (max-width: 800px) and (orientation: portrait) {
  .hero_bg {
    background-image: url("../images/Quadrant-butterfly-1024@1x.jpg");
    background-position: bottom left; }

  .hero_content {
    width: 100%;
    display: block;
    text-align: left;
    padding: 0 0 0 40px;
    position: absolute;
    top: auto;
    right: auto;
    bottom: 45px;
    left: 0; }

  .hero_content h1 {
    font-size: 7.5vw;
    margin: 0 0 20px 0;
    letter-spacing: -0.1px; }

  .hero_content p {
    font-size: 3.8vw; }

  .social_wrapper {
    padding: 40px 40px 0 40px; }

  .content_bg {
    padding: 30px 0 30px 0; }

  .content .left_col {
    padding: 0 40px 0 40px;
    width: 100%; }

  .content .right_col {
    padding: 0 40px 0 40px;
    width: 100%; }

  footer {
    height: 200px; }

  footer .right_col {
    width: 100%;
    top: 30px; }

  footer .left_col {
    width: 100%;
    bottom: 30px; }

  footer .left_col p {
    padding: 0 0 0 40px; }

  footer .right_col {
    padding: 0 40px 0 0; } }
@media only screen and (max-width: 570px) {
  .hero_bg {
    background-image: url("../images/Quadrant-butterfly-mob@1x.jpg");
    background-position: top left; }

  .content_bg {
    padding: 30px 0 30px 0; }

  .content .left_col {
    padding: 0 40px 0 40px;
    width: 100%; }

  .content .right_col {
    padding: 0 40px 0 40px;
    width: 100%; }

  footer .left_col p {
    padding: 0 40px 0 40px; }

  footer .right_col {
    width: 100%;
    padding: 0 40px 0 16px;
    text-align: left; } }
@media only screen and (max-width: 380px) {
  .hero_bg {
    background-image: url("../images/Quadrant-butterfly-mob@1x.jpg");
    background-position: top left; }

  .social_wrapper {
    padding: 20px 0px 0 20px !important;
    text-align: left !important; }

  .social_wrapper :nth-child(n+2) {
    padding-left: 10px !important; }

  .hero_content {
    padding: 0 0 0 20px; }

  .content .left_col {
    padding: 0 20px; }

  .content .right_col {
    padding: 0 20px; }

  footer .left_col p {
    padding: 0 0 0 20px; }

  footer .right_col {
    padding: 0 20px 0 0; } }