// Mobile first!

.learn-more {

  // Overrides for the Plan B version of the site
  &.plan-b {




  }

  .hero {
    h1 {
      padding-bottom: 5px;
      background: transparent url() scroll no-repeat left center;
      .avenir-next-bold;
      .at2x( '../img/icon_learn-more.png', 42px, 42px );
    }
  }
  h2 {
    margin-top: 10px;
    padding-bottom: 5px;
    .avenir-next-demi;
    font-size: 1.5em;
  }

  .background {
    padding: 1px 15px 0px 15px;
  }

  .transcript {
    h3 {
      .avenir-next-bold;
    }
    ul {
      padding: 0 0 0 20px;
    }
  }

  #transcript-text:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }

}


#learn-more {
  section {
    min-height: 200px;
  }

  p {
    display: inline-block;
    margin-right: 4%;
    font-size: 1em;
    line-height: 1.375em;
  }

  ul {
    margin-right: 4%;
    line-height: 1.375em;
    display: inline-block;
    font-size: 1em;
  }

  .links {
    display: inline-block;
    vertical-align: top;
  }

  .links ul {
    list-style-type: none;
    padding-left: 0;
    margin: 8px 0 0 0;
  }
  
  .links li {
    margin-bottom: 10px;
  }

  .highlight {
    background-color: @light_field10;
    padding: 15px 20px;
    line-height: 1.375em;
    p:nth-child(3) {
      margin-top: .5em;
    }
    a.action-arrow {
      font-size: .95em;
      margin-top: .75em;
      color: @pacific;
      .avenir-next;
      font-weight: 400;
    }
    h5 {margin-bottom: .5em;};
  }
  
  .filter {
    background-color: @white;
    border-bottom: 0px;
    padding-top: 1em;
  }

  .filter label {
    font-size: 1em;
    color: @pacific;
  }
    
  .filter h3 {
    padding: 0;
    //letter-spacing: 0.075em;
  }

  [type=checkbox] {
    display: none;
  }

  :checked + div {
    display: inline-block !important;
  }

  dfn {
    .avenir-next;
    font-size: .75em;
    a:link {
      border-bottom: 1px dotted @pacific;
      color: @pacific;
      text-decoration: none;
    }
    a:hover {
      border-bottom: 1px solid @navy;
      color: @navy;
      text-decoration: none;
    }
  }

  .footnote {
    padding-left: 20px;
    padding-right:20px;
  }

 // Show a plus icon when the filter is closed.
    &.closed {
      i.icon-minus-round:before {
      content: "\e109"; 
    }
  }

}
  


// Adjustments for larger screens

@media only screen and ( min-width: 768px ) {

  #learn-more {

  h2 {
    margin-top: 70px;
  }

  .title {padding:0;}
  .highlight {
      background-color: @light_field10;
      padding: 15px 20px;
      width: 66%;
      line-height: 1.375em;
      margin-bottom: 20px;
      display: inline-block;  
      p {margin:0; padding:0; width: 100%;}
    }

  p {
    width: 66%;
    display: inline-block;
    margin-right: 4%;
    font-size: 1em;
    line-height: 1.375em;
    float: left;
    margin-bottom: .025em;
    }

  li {
    width: 90%;
    }

  ul {
    margin-right: 4%;
    line-height: 1.375em;
    display: inline-block;
    font-size: 1em;
    }

  .links ul {
    display: inline-block;
    vertical-align: top;
    list-style-type: none;
    padding-left: 0;
    }

  .links li {
    width: 100%;
  }

  .footnote {
    width: 66%;
  }
    

  }

}