{% extends "base.html" %}

{% block scripts %}
  <script async type="text/javascript" src="https://dap.digitalgov.gov/Universal-Federated-Analytics-Min.js?agency=DOI" id="_fed_an_ua_tag"></script>
  {{super()}}
{% endblock %}


{% block header %}
<section class="usa-banner" aria-label="Official government website">
    <div class="usa-accordion">
      <header class="usa-banner__header">
        <div class="usa-banner__inner">
          <div class="grid-col-auto">
            <img
              class="usa-banner__header-flag"
              src="https://asc-public-docs.s3.us-west-2.amazonaws.com/common/uswds/3.6.0/img/us_flag_small.png"
              alt="U.S. flag"
            />
          </div>
          <div class="grid-col-fill tablet:grid-col-auto">
            <p class="usa-banner__header-text">
              An official website of the United States government
            </p>
            <p class="usa-banner__header-action" aria-hidden="true">
              Here’s how you know
            </p>
          </div>
          <button
            type="button"
            class="usa-accordion__button usa-banner__button"
            aria-expanded="false"
            aria-controls="gov-banner-default-default"
          >
            <span class="usa-banner__button-text">Here’s how you know</span>
          </button>
        </div>
      </header>
      <div
        class="usa-banner__content usa-accordion__content"
        id="gov-banner-default-default"
      >
        <div class="grid-row grid-gap-lg">
          <div class="usa-banner__guidance tablet:grid-col-6">
            <img
              class="usa-banner__icon usa-media-block__img"
              src="https://asc-public-docs.s3.us-west-2.amazonaws.com/common/uswds/3.6.0/img/icon-dot-gov.svg"
              role="img"
              alt=""
              aria-hidden="true"
            />
            <div class="usa-media-block__body">
              <p>
                <strong>Official websites use .gov</strong><br />A
                <strong>.gov</strong> website belongs to an official government
                organization in the United States.
              </p>
            </div>
          </div>
          <div class="usa-banner__guidance tablet:grid-col-6">
            <img
              class="usa-banner__icon usa-media-block__img"
              src="https://asc-public-docs.s3.us-west-2.amazonaws.com/common/uswds/3.6.0/img/icon-https.svg"
              role="img"
              alt=""
              aria-hidden="true"
            />
            <div class="usa-media-block__body">
              <p>
                <strong>Secure .gov websites use HTTPS</strong><br />A
                <strong>lock</strong> (
                <span class="icon-lock"
                  ><svg
                    xmlns="http://www.w3.org/2000/svg"
                    width="52"
                    height="64"
                    viewBox="0 0 52 64"
                    class="usa-banner__lock-image"
                    role="img"
                    aria-labelledby="banner-lock-title-default banner-lock-description-default"
                    focusable="false"
                  >
                    <title id="banner-lock-title-default">Lock</title>
                    <desc id="banner-lock-description-default">A locked padlock</desc>
                    <path
                      fill="#000000"
                      fill-rule="evenodd"
                      d="M26 0c10.493 0 19 8.507 19 19v9h3a4 4 0 0 1 4 4v28a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4h3v-9C7 8.507 15.507 0 26 0zm0 8c-5.979 0-10.843 4.77-10.996 10.712L15 19v9h22v-9c0-6.075-4.925-11-11-11z"
                    />
                  </svg> </span
                >) or <strong>https://</strong> means you’ve safely connected to
                the .gov website. Share sensitive information only on official,
                secure websites.
              </p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>


    <header id="navbar" class="header-nav"  role="banner">
        <div class="tmp-container">
            <div class="header-search">
             <a class="logo-header" href="https://www.usgs.gov/" title="Home">
                <img class="img"  src="https://asc-public-docs.s3.us-west-2.amazonaws.com/common/uswds/3.6.0/img/logo.png"  alt="Home" />
              </a>
              <form action="https://www.usgs.gov/science-explorer-results" method="GET" id="search-box">
               <div class="fa-wrapper"><label for="se_search" class="only">Search</label>
                <input id="se_search" type="search" name="es" placeholder="Search">
                <button class="fa fa-search" type="submit">
                  <span class="only">Search</span>
                   </button></div>
              </form>
            </div>
            
          </div> 
          
      </header>

    {{ super() }}
    {% endblock %}

{% block content %}
{% if page.nb_url %}
    <a href="{{ page.nb_url }}" title="Download Notebook" class="md-content__button md-icon">
        {% include ".icons/material/download.svg" %}
    </a>
{% endif %}

{{ super() }}
{% endblock content %}

{% block footer %}

<footer class="footer">
  <div class="tmp-container">
    
      
      <div class="footer-doi">
        
        <ul class="menu nav">
          <li class="first leaf menu-links menu-level-1"><a href="https://www.doi.gov/privacy">DOI Privacy Policy</a></li>
          <li class="leaf menu-links menu-level-1"><a href="https://www.usgs.gov/policies-and-notices">Legal</a></li>
          <li class="leaf menu-links menu-level-1"><a href="https://www.usgs.gov/accessibility-and-us-geological-survey">Accessibility</a></li>
          <li class="leaf menu-links menu-level-1"><a href="https://www.usgs.gov/sitemap">Site Map</a></li>
          <li class="last leaf menu-links menu-level-1"><a href="https://answers.usgs.gov/">Contact USGS</a></li>
        </ul>
              
      </div> 
      <hr>

    
    <div class="footer-doi">
      <ul class="menu nav">
        <li class="first leaf menu-links menu-level-1"><a href="https://www.doi.gov/">U.S. Department of the Interior</a></li>
        <li class="leaf menu-links menu-level-1"><a href="https://www.doioig.gov/">DOI Inspector General</a></li>
        <li class="leaf menu-links menu-level-1"><a href="https://www.whitehouse.gov/">White House</a></li>
        <li class="leaf menu-links menu-level-1"><a href="https://www.whitehouse.gov/omb/management/egov/">E-gov</a></li>
        <li class="leaf menu-links menu-level-1"><a href="https://www.doi.gov/pmb/eeo/no-fear-act">No Fear Act</a></li>
        <li class="last leaf menu-links menu-level-1"><a href="https://www.usgs.gov/about/organization/science-support/foia">FOIA</a></li>
      </ul>
      </div>			
    
    
    <div class="footer-social-links">
      <ul class="social">
        <li class="follow">Follow</li>
        <li class="twitter">
          <a href="https://twitter.com/usgs" target="_blank">
            <i class="fa fa-twitter-square"><span class="only">Twitter</span></i>
          </a>
        </li>
        <li class="facebook">
          <a href="https://facebook.com/usgeologicalsurvey" target="_blank">
            <i class="fa fa-facebook-square"><span class="only">Facebook</span></i>
          </a>
        </li>
        <li class="github">
          <a href="https://github.com/usgs" target="_blank">
            <i class="fa fa-github"><span class="only">GitHub</span></i>
          </a>
        </li>
        <li class="flickr">
          <a href="https://flickr.com/usgeologicalsurvey" target="_blank">
            <i class="fa fa-flickr"><span class="only">Flickr</span></i>
          </a>
        </li>
        <li class="youtube">
          <a href="http://youtube.com/usgs" target="_blank">
            <i class="fa fa-youtube-play"><span class="only">YouTube</span></i>
          </a>
        </li>
        <li class="instagram">
          <a href="https://instagram.com/usgs" target="_blank">
            <i class="fa fa-instagram"><span class="only">Instagram</span></i>
          </a>
        </li>
      </ul>
    </div>
    
  </div>
      
</footer>

{% endblock %}

{% block styles %}

  <link href="https://asc-public-docs.s3.us-west-2.amazonaws.com/common/uswds/3.6.0/css/uswds.min.css" rel="stylesheet" type="text/css" media="screen" /> 
  {{ super() }}
{% endblock %}