<!DOCTYPE html>
<html lang="{{tpl:BlogLanguage}}">

<head>
  <meta charset="UTF-8" />
  <meta name="ROBOTS" content="NOARCHIVE,NOINDEX,NOFOLLOW" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>{{tpl:lang Password needed}} - {{tpl:BlogName encode_html="1"}}</title>
  <style type="text/css">
  :root {
    --color-text: #000;
    --color-background: #eee;
    --color-form-background: #fff;
    --color-form-border: #a2cbe9;
    --color-title: #d30e60;
  }

  @media (prefers-color-scheme: light) {
    :root {
      --color-text: #000;
      --color-background: #eee;
      --color-form-background: #fff;
      --color-title: #d30e60;
    }
  }

  @media (prefers-color-scheme: dark) {
    :root {
      --color-text: #fff;
      --color-background: #595b5d;
      --color-form-background: #272b30;
      --color-title: #f783b3;
    }
  }

  body {
    font-family: Verdana, Arial, Geneva, sans-serif;
    background: var(--color-background);
    display: flex;
    justify-content: center;
  }

  form {
    max-width: 35em;
    margin-top: 1.5em;
    padding: 1em;
    color: var(--color-text);
    background: var(--color-form-background);
    border: .25em solid var(--color-form-border);
    border-radius: .5em;
    display: flex;
  }

  h2 {
    color: var(--color-title);
    margin: 0 0 1em 0;
  }

  svg.icon {
    width: 59px;
    height: 45px;
    margin: 0 1em 1em 0;
  }

  svg.icon path.dc-icon-leap {
    fill: rgb(174, 220, 75);
  }

  svg.icon path.dc-icon-nerve {
    fill: rgb(154, 207, 0);
  }

  label {
    font-weight: bold;
  }

  input,
  button {
    margin: .5em 0 0;
    padding: 0.25em .5em;
    border-radius: .25em;
    border: 1px solid #333;
    min-width: 3em;
    font-size: 1em;
  }

  .pw-show,
  .pw-hide {
    min-width: 2.25em;
    height: 1.75em;
    margin-left: .25em;
    vertical-align: bottom;
  }

  .pw-show,
  .pw-show:hover,
  .pw-show:focus,
  .pw-show:active,
  .pw-hide,
  .pw-hide:hover,
  .pw-hide:focus,
  .pw-hide:active {
    background-position: 50% 50%;
    background-repeat: no-repeat;
  }

  .pw-show:hover,
  .pw-show:focus,
  .pw-show:active,
  .pw-hide:hover,
  .pw-hide:focus,
  .pw-hide:active {
    background-color: #fff;
  }

  .pw-show,
  .pw-show:hover,
  .pw-show:active,
  .pw-show:focus {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTI1NiAxODUwIDE4NTAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxwYXRoIGQ9Ik0xNjk0LjM3MyA2ODMuODk4cS0xNTItMjM2LTM4MS0zNTMgNjEgMTA0IDYxIDIyNSAwIDE4NS0xMzEuNSAzMTYuNS0xMzEuNSAxMzEuNS0zMTYuNSAxMzEuNS0xODUgMC0zMTYuNS0xMzEuNS0xMzEuNS0xMzEuNS0xMzEuNS0zMTYuNSAwLTEyMSA2MS0yMjUtMjI5IDExNy0zODEgMzUzIDEzMyAyMDUgMzMzLjUgMzI2LjUgMjAwLjUgMTIxLjUgNDM0LjUgMTIxLjUgMjM0IDAgNDM0LjUtMTIxLjUgMjAwLjUtMTIxLjUgMzMzLjUtMzI2LjV6bS03MjAtMzg0cTAtMjAtMTQtMzQtMTQtMTQtMzQtMTQtMTI1IDAtMjE0LjUgODkuNS04OS41IDg5LjUtODkuNSAyMTQuNSAwIDIwIDE0IDM0IDE0IDE0IDM0IDE0IDIwIDAgMzQtMTQgMTQtMTQgMTQtMzQgMC04NiA2MS0xNDcgNjEtNjEgMTQ3LTYxIDIwIDAgMzQtMTQgMTQtMTQgMTQtMzR6bTg0OCAzODRxMCAzNC0yMCA2OS0xNDAgMjMwLTM3Ni41IDM2OC41LTIzNi41IDEzOC41LTQ5OS41IDEzOC41LTI2MyAwLTQ5OS41LTEzOS0yMzYuNS0xMzktMzc2LjUtMzY4LTIwLTM1LTIwLTY5IDAtMzQgMjAtNjkgMTQwLTIyOSAzNzYuNS0zNjggMjM2LjUtMTM5IDQ5OS41LTEzOSAyNjMgMCA0OTkuNSAxMzkgMjM2LjUgMTM5IDM3Ni41IDM2OCAyMCAzNSAyMCA2OXoiLz48L3N2Zz4K");
  }

  .pw-hide,
  .pw-hide:hover,
  .pw-hide:active,
  .pw-hide:focus {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTI1NiAxODUwIDE4NTAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxwYXRoIGQ9Ik01ODUuMzczIDEwMTMuMzRsNzgtMTQxcS04Ny02My0xMzYtMTU5LTQ5LTk2LTQ5LTIwMyAwLTEyMSA2MS0yMjUtMjI5IDExNy0zODEgMzUzIDE2NyAyNTggNDI3IDM3NXptMzg5LTc1OXEwLTIwLTE0LTM0LTE0LTE0LTM0LTE0LTEyNSAwLTIxNC41IDg5LjUtODkuNSA4OS41LTg5LjUgMjE0LjUgMCAyMCAxNCAzNCAxNCAxNCAzNCAxNCAyMCAwIDM0LTE0IDE0LTE0IDE0LTM0IDAtODYgNjEtMTQ3IDYxLTYxIDE0Ny02MSAyMCAwIDM0LTE0IDE0LTE0IDE0LTM0em0zNjMtMTkxcTAgNy0xIDktMTA1IDE4OC0zMTUgNTY2LTIxMCAzNzgtMzE2IDU2N2wtNDkgODlxLTEwIDE2LTI4IDE2LTEyIDAtMTM0LTcwLTE2LTEwLTE2LTI4IDAtMTIgNDQtODctMTQzLTY1LTI2My41LTE3My0xMjAuNS0xMDgtMjA4LjUtMjQ1LTIwLTMxLTIwLTY5IDAtMzggMjAtNjkgMTUzLTIzNSAzODAtMzcxIDIyNy0xMzYgNDk2LTEzNiA4OSAwIDE4MCAxN2w1NC05N3ExMC0xNiAyOC0xNiA1IDAgMTggNiAxMyA2IDMxIDE1LjUgMTggOS41IDMzIDE4LjUgMTUgOSAzMS41IDE4LjUgMTYuNSA5LjUgMTkuNSAxMS41IDE2IDEwIDE2IDI3em0zNyA0NDdxMCAxMzktNzkgMjUzLjUtNzkgMTE0LjUtMjA5IDE2NC41bDI4MC01MDJxOCA0NSA4IDg0em00NDggMTI4cTAgMzUtMjAgNjktMzkgNjQtMTA5IDE0NS0xNTAgMTcyLTM0Ny41IDI2Ny0xOTcuNSA5NS00MTkuNSA5NWw3NC0xMzJxMjEyLTE4IDM5Mi41LTEzNyAxODAuNS0xMTkgMzAxLjUtMzA3LTExNS0xNzktMjgyLTI5NGw2My0xMTJxOTUgNjQgMTgyLjUgMTUzIDg3LjUgODkgMTQ0LjUgMTg0IDIwIDM0IDIwIDY5eiIvPjwvc3ZnPgo=");
  }

  .sr-only {
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
  }
  </style>
  <script type="application/json" id="dc_password_msg-data">
  {
    "show_password": "{{tpl:lang Show password}}",
    "hide_password": "{{tpl:lang Hide password}}"
  }
  </script>
  <script src="{{tpl:BlogQmarkURL}}pf=util.js"></script>
  <script src="{{tpl:BlogQmarkURL}}pf=password.js"></script>
</head>

<body>
  <form action="{{tpl:EntryURL}}" method="post" role="form">
    <svg class="icon" clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 59 45" xmlns="http://www.w3.org/2000/svg">
      <path class="dc-icon-leap" d="m22.334-13.733s-12.14 12.667-12.231 24.844c1.63 12.534 6.918 9.981 12.231 36.197 5.786-2.28 17.495-17.628 15.131-39.175-3.075-15.357-15.131-21.866-15.131-21.866" transform="matrix(.608277 .793725 .793725 -.608277 6.925 11.05)" />
      <path class="dc-icon-nerve" d="m0 43.4s13.37-10.8 27.91-18.24c23-11.76 28.98-25.16 28.98-25.16s-6.65 12.53-29.65 24.3c-14.54 7.44-27.91 18.24-27.91 18.24z" transform="translate(.67 1.5)" /></svg>
    <div>
      <h2>{{tpl:lang Password needed}}</h2>
      <p>{{tpl:lang You must give a password to access this area.}}</p>
      <p>
        <label for="password">{{tpl:lang Password:}}
          <input type="password" id="password" name="password" value="" />
        </label>
        <input type="submit" value="ok" title="{{tpl:lang Access to content}}" />
      </p>
    </div>
  </form>
</body>

</html>
