/* Colours */
/* Fluid heading sizes - set your min/max sizes and you're done! */
/* Some device sizes to use with min-width */
/* adjusted breakpoints for above */
/* 100% widths look better than "Snapping" IMO */
/* Utility */
/* Additional Spacers -- don't think you'll need more than 10, but if you do -- maybe just use a custom class  :)  */
#intro {
  padding-top: 80px;
  padding-bottom: 80px;
  background-color: #F5F5F5; }
  #intro h2 {
    color: #84BD00; }
  #intro p, #intro li {
    color: #4D4D4D; }
  @media screen and (min-width: 1025px) {
    #intro {
      padding-top: 120px;
      padding-bottom: 120px; } }

#turbines {
  padding: 80px 0; }
  #turbines p {
    color: #BCBEC0; }
  #turbines .card {
    background-color: #FFFFFF;
    border-radius: 10px; }
    #turbines .card .video-container .vidswap {
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 250px;
      width: 100% !important; }
      #turbines .card .video-container .vidswap .black-layout {
        width: 100% !important;
        height: 100% !important;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(33, 33, 33, 0.7);
        background-blend-mode: hue;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px; }
      #turbines .card .video-container .vidswap .embed-responsive, #turbines .card .video-container .vidswap iframe {
        height: 100%;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px; }
    #turbines .card .content {
      padding: 50px 32px; }
      #turbines .card .content h5 {
        color: #000000;
        margin-bottom: 18px; }
      #turbines .card .content p {
        color: #6D6E71; }
      #turbines .card .content a {
        color: #212121;
        display: flex;
        align-items: center;
        margin-top: 30px;
        font-weight: 900;
        letter-spacing: 1.1px;
        text-transform: uppercase; }
        #turbines .card .content a::after {
          font-family: 'standard-icons' !important;
          content: '\e910';
          margin-left: 16px;
          font-weight: 400; }
        #turbines .card .content a:hover {
          color: #84BD00; }
  @media screen and (min-width: 1025px) {
    #turbines {
      padding: 120px 0 88px; }
      #turbines .card .video-container .vidswap {
        height: 330px; } }
  @media screen and (max-width: 1025px) {
    #turbines .card .video-container .vidswap .black-layout img {
      width: 50px;
      height: 50px; } }

#downloads {
  padding: 80px 0;
  background-color: #F5F5F5; }
  #downloads .content {
    position: relative;
    display: flex;
    align-items: center; }
    #downloads .content h3 {
      margin: 0; }
    #downloads .content::after {
      content: '';
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      height: 26px;
      width: 756px;
      color: #84BD00;
      background-image: url("/wp-content/themes/inet_lightspeed-child/img/group-x-sm.svg"), url("/wp-content/themes/inet_lightspeed-child/img/group-x-sm.svg");
      background-repeat: repeat-x, repeat-x;
      background-position: left top, left bottom;
      background-size: 20px 8px, 20px 8px;
      pointer-events: none;
      filter: brightness(0) saturate(100%) invert(67%) sepia(94%) saturate(498%) hue-rotate(26deg) brightness(96%) contrast(101%); }
    @media screen and (max-width: 1025px) {
      #downloads .content::after {
        display: none; } }
  #downloads .cta-container {
    padding: 18px 10px 4px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    border-bottom: 1px solid #6D6E71; }
    #downloads .cta-container:first-of-type {
      border-top: 1px solid #6D6E71; }
    #downloads .cta-container h5 {
      font-size: 16px;
      color: #000000;
      margin: 0;
      font-weight: 400;
      margin-right: 25px;
      margin-bottom: 10px; }
    #downloads .cta-container a {
      color: #212121;
      display: flex;
      align-items: center;
      font-weight: 900;
      font-size: 14px;
      margin-bottom: 10px;
      letter-spacing: 1.1px;
      text-transform: uppercase; }
      #downloads .cta-container a::after {
        font-family: 'standard-icons' !important;
        content: '\e910';
        margin-left: 16px;
        font-weight: 400; }
      #downloads .cta-container a:hover {
        color: #84BD00; }
  @media screen and (min-width: 1025px) {
    #downloads {
      padding: 140px 0 128px; }
      #downloads .cta-container {
        padding: 18px 10px 8px; }
        #downloads .cta-container h5 {
          font-size: 26px; }
        #downloads .cta-container a {
          font-size: 18px; } }

#sec-callout {
  padding: 150px 0;
  background-color: #202020;
  /* the design's callout headings run up to ~1300px; the copy stays narrower */ }
  #sec-callout h2 {
    max-width: 1310px; }
  #sec-callout p {
    max-width: 873px; }
  #sec-callout .bg-img {
    z-index: 0; }
  @media screen and (min-width: 1025px) {
    #sec-callout {
      padding: 272px 0 170px; } }