@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 100;
    src: local('Roboto Thin'), local('Roboto-Thin'), url(http://fonts.gstatic.com/s/roboto/v15/Jzo62I39jc0gQRrbndN6nfesZW2xOQ-xsNqO47m55DA.ttf) format('truetype')
  }

  @font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Light'), local('Roboto-Light'), url(http://fonts.gstatic.com/s/roboto/v15/Hgo13k-tfSpn0qi1SFdUfaCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')
  }

  @font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(http://fonts.gstatic.com/s/roboto/v15/zN7GBFwfMP4uA6AR0HCoLQ.ttf) format('truetype')
  }

  @font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(http://fonts.gstatic.com/s/roboto/v15/RxZJdnzeo3R5zSexge8UUaCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')
  }

  @font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 300;
    src: local('Roboto Light Italic'), local('Roboto-LightItalic'), url(http://fonts.gstatic.com/s/roboto/v15/7m8l7TlFO-S3VkhHuR0at50EAVxt0G0biEntp43Qt6E.ttf) format('truetype')
  }

  .dcg {
    max-width: 1240px;
    color: #3d4042;
    font-family: 'Roboto', Helvetica, Sans-serif;
  }

  .dcg *,
  .dcg *:after,
  .dcg *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  .dcg img {
    max-width: 100%;
  }
.dcg .pixel-cta a.pixel-table-cta {
    background: #efeae6;
    color: #000000;
    border: 1px solid #000000;
}

.dcg .pixel-cta a.pixel-table-cta:hover {
    background: #fffff;
    color: #000000;
    border: 1px solid #000000;
}

section.sect3.google-pixel-tablet {
    display: flex;
    flex-flow: column;
	    padding: 0px 30px 30px 30px;
}

  /******** HERO SECTION **********/
  .dcg .mobile-hero {
    display: none;
  }

  @media only screen and (max-width: 599px) {
    .dcg .desktop-hero {
      display: none;
    }

    .dcg .mobile-hero {
      display: block;
    }
  }

  /************ SECTION 1 *********/
  .dcg .sect1 {
    background-color: #c5d5e1;
    padding: 30px 5% 0;
  }

  .dcg .sect-half {
    float: left;
    width: 50%;
  }

  .dcg .sect-half-right {
    float: right;
    width: 50%;
  }

  .dcg .sect1-text {
    text-align: center;
    padding: 10% 10% 20px;
  }

  .dcg .sect1-text p {
    font-size: 18px;
  }

  .dcg .sect1-logo {
    margin-bottom: 30px;
  }

  .dcg .sect1-lifestyle {
    text-align: center;
  }

  .dcg .lifestyle-text {
    padding: 15% 20px 20px;
  }

  .dcg .lifestyle-heading {
    color: #285768;
    font-size: 60px;
    font-family: 'Roboto', Helvetica, Sans-serif;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 10px;
  }

  .dcg .lifestyle-semi {
    color: #285768;
    font-size: 30px;
    font-family: 'Roboto', Helvetica, Sans-serif;
    line-height: normal;
  }

  .dcg .pixel-cta {
    margin: 40px 0;
  }

  .dcg .pixel-cta a {
    background-color: #4285f4;
    color: #fff;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 3px;
    border: 1px solid #4285f4;
    transition: background-color 0.5s;
    display: inline-block;
  }

  .dcg .pixel-cta a:hover {
    background-color: #fff;
    color: #4285f4;
  }

  @media only screen and (max-width: 1040px) {
    .dcg .lifestyle-heading {
      color: #285768;
      font-size: 50px;
    }

    .dcg .lifestyle-semi {
      color: #285768;
      font-size: 24px;
    }
  }

  @media only screen and (max-width: 599px) {
    .dcg .sect-half {
      float: none;
      width: 100%;
    }

    .dcg .sect-half-right {
      float: none;
      width: 100%;
    }

    .dcg .lifestyle-row {
      padding-top: 50px;
    }

    .dcg .lifestyle-text {
      padding: 5% 20px 20px;
    }
  }

  /*********** SECTION 2 ***********/
  .dcg .sect2 {
    background-color: #d9cfe7;
    padding: 40px 5% 0;
    margin-top: 30px;
  }

  .dcg .sect2-text {
    text-align: center;
    padding: 15% 20px 20px;
  }

  .dcg .sect2-sm-txt {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 20px;
    line-height: normal;
  }

  .dcg .sect2-lg-txt {
    font-size: 50px;
    font-family: 'Roboto', Helvetica, Sans-serif;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 10px;
  }

  .dcg .lg-break {
    display: block;
  }

  @media only screen and (max-width: 599px) {
    .dcg .sect2-text {
      text-align: center;
      padding: 5% 20px 20px;
    }
  }

  /*********** SECTION 3 ***********/
  .dcg .sect3 {
    margin-top: 30px;
    background-color: #fafafa;
  }

  .dcg .sect3-text {
    text-align: center;
    padding: 5% 15% 20px;
  }

  .dcg .sect3-heading {
    font-size: 34px;
    font-weight: 500;
    margin-bottom: 20px;
    line-height: normal;
  }

  .dcg .sect3-text p {
    font-size: 18px;
  }

  /************ SECTION 4 ***************/
  .dcg .sect4 {
    margin-top: 30px;
  }

  .dcg .sect4-container {
    position: relative;
  }

  .dcg .sect4-text {
    position: absolute;
    right: 5%;
    width: 40%;
    text-align: center;
    bottom: 15%;
    color: #fff;
  }

  .dcg .sect4-sm-heading {
    font-size: 20px;
    padding-bottom: 20px;
  }

  .dcg .sect4-lg-heading {
    font-size: 46px;
    font-weight: 500;
    line-height: normal;
  }

  .dcg .smaller-t {
    font-size: 30px;
  }

  @media only screen and (max-width: 1099px) {
    .dcg .sect4-text {
      right: 2%;
      width: 40%;
      bottom: 5%;
    }
  }

  @media only screen and (max-width: 899px) {
    .dcg .sect4-text {
      right: 2%;
      width: 44%;
      bottom: 0%;
    }
  }

  @media only screen and (max-width: 799px) {
    .dcg .sect4-text {
      position: static;
      right: 0;
      width: 100%;
      text-align: center;
      bottom: 0;
      color: #3d4042;
      padding: 30px 30px 10px;
    }

    .dcg .sect4-lg-heading {
      font-size: 46px;
      font-weight: 500;
    }
	  .dcg .sect3{
		display: flex;
		 flex-flow: column-reverse;
	  }
  }

  /************ SECTION 5 ************/
  .dcg .sect5 {
    margin-top: 30px;
  }

  .dcg .sect5-container,
  .dcg .sect5-container-right {
    position: relative;
  }

  .dcg .sect5-container {
    margin-right: 20px;
  }

  .dcg .sect5-container-right {
    margin-left: 20px;
  }

  .dcg .sect5-text {
    position: absolute;
    right: 5%;
    width: 90%;
    text-align: center;
    top: 5%;
  }

  .dcg .sect5-sm-heading {
    font-size: 20px;
    padding-bottom: 20px;
  }

  .dcg .sect5-lg-heading {
    font-size: 46px;
    font-weight: 500;
    line-height: normal;
  }

  .dcg .white-headings {
    color: #fff;
  }

  @media only screen and (max-width: 799px) {
    .dcg .sect5-lg-heading {
      font-size: 40px;
      font-weight: 500;
    }
  }

  @media only screen and (max-width: 599px) {
    .dcg .sect5-container {
      margin-right: 0;
    }

    .dcg .sect5-container-right {
      margin-left: 0;
    }
  }

  /********** SECTION 6 *************/
  .dcg .sect6 {
    background-color: #e8f2f1;
    margin-top: 30px;
    padding: 20px 0;
  }

  .dcg .sect6-img-half {
    float: right;
    width: 55%;
  }

  .dcg .sect6-text-half {
    float: left;
    width: 45%;
  }

  .dcg .sect6-text-inner {
    text-align: center;
    padding: 15% 10% 20px;
  }

  @media only screen and (max-width: 699px) {
    .dcg .sect6-img-half {
      float: none;
      width: 100%;
    }

    .dcg .sect6-text-half {
      float: none;
      width: 100%;
    }

    .dcg .sect6-text-inner {
      text-align: center;
      padding: 5% 10% 0;
    }
  }

  /***** BOTTOM HERO ********/
  .dcg .bottom-hero {
    margin-top: 30px;
  }

  .dcg .small-terms {
    margin: 50px 10%;
  }

  .dcg .small-terms li {
    color: #7e7e7e;
    font-size: 11px;
  }

  /******* video section *******/
  .videoWrapper {
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    height: 0;
    overflow: hidden;
  }

  .videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  /********** Others **********/
  .dcg .clearfix::after {
    content: "";
    clear: both;
    display: table;
  }