Copy environment

Password

<header class="header  ">
    <div class="container">
        <a href="#" class="logo  header__logo">
    <span class="logo__label">gotoAndPlay</span>
    <svg xmlns="http://www.w3.org/2000/svg" width="170" height="29" viewBox="0 0 170 29" class="logo__img" fill="#353635" fill-rule="evenodd">
        <path d="M17.689,12.756c1.278,0.734,1.278,1.934,0,2.668s-3.366,1.935-4.643,2.668-2.321.133-2.321-1.335V11.422c0-1.466,1.043-2.066,2.321-1.333ZM28.049,26V13.952a14.015,14.015,0,1,0-5.184,10.824v1.668a0.494,0.494,0,0,0,.144.355c0.18,0.14.582,0.518,2.36,0.518a3.982,3.982,0,0,0,2.523-.506,0.551,0.551,0,0,0,.157-0.42V26ZM14.024,23.486a9.535,9.535,0,1,1,9.582-9.534A9.568,9.568,0,0,1,14.024,23.486ZM42.695,12.074q-2.9,0-2.894,3.485v2.36a4.168,4.168,0,0,0,.634,2.552,2.624,2.624,0,0,0,2.206.823,4.391,4.391,0,0,0,3-1.153V13.419A3.884,3.884,0,0,0,42.695,12.074Zm5.35,10.893Q48.045,29,42.474,29a9.3,9.3,0,0,1-3.749-.659,1.025,1.025,0,0,1-.359-1.756,0.866,0.866,0,0,1,.827-0.219,6.62,6.62,0,0,0,.634.192l0.663,0.165a8.061,8.061,0,0,0,1.847.22q3.308,0,3.309-3.868V22.308a5.933,5.933,0,0,1-3.419,1.1q-4.854,0-4.853-5.761V15.833q0-5.87,4.909-5.872A5.272,5.272,0,0,1,45.646,11.2V11.169a1.183,1.183,0,0,1,.344-0.851,1.127,1.127,0,0,1,.84-0.357,1.171,1.171,0,0,1,.883.343,1.2,1.2,0,0,1,.332.864v11.8Zm11.028-7.326q0-3.457-3.143-3.457-3.115,0-3.116,3.457v2.826q0,3.486,3.116,3.485,3.145,0,3.143-3.485V15.641ZM60.2,22.473a5.318,5.318,0,0,1-4.274,1.674,5.28,5.28,0,0,1-4.246-1.674,5.933,5.933,0,0,1-1.3-4.006V15.641a5.937,5.937,0,0,1,1.3-4.006A5.283,5.283,0,0,1,55.93,9.961,5.321,5.321,0,0,1,60.2,11.635a5.94,5.94,0,0,1,1.3,4.006v2.826A5.936,5.936,0,0,1,60.2,22.473Zm10.327,1.18a1.05,1.05,0,0,1-.787.329H68.918a4.341,4.341,0,0,1-3.833-1.619,7.746,7.746,0,0,1-.966-4.308V12.184h-0.8a1.011,1.011,0,0,1-.743-0.3,0.973,0.973,0,0,1-.3-0.713,1.033,1.033,0,0,1,1.047-1.043h0.8V7.3a1.157,1.157,0,0,1,.358-0.85,1.171,1.171,0,0,1,.855-0.357,1.126,1.126,0,0,1,.842.357,1.184,1.184,0,0,1,.344.85v2.827h2.564a1.02,1.02,0,0,1,.745.3,1.009,1.009,0,0,1,.3.741,0.975,0.975,0,0,1-.3.713,1.016,1.016,0,0,1-.745.3H66.518v5.845a5.764,5.764,0,0,0,.523,2.935,2.375,2.375,0,0,0,2.152.823h0.551a1.076,1.076,0,0,1,.787.315,1.064,1.064,0,0,1,.317.783A1.076,1.076,0,0,1,70.531,23.653Zm9.94-8.012q0-3.457-3.144-3.457-3.115,0-3.116,3.457v2.826q0,3.486,3.116,3.485,3.145,0,3.144-3.485V15.641ZM81.6,22.473a6.257,6.257,0,0,1-8.519,0,5.929,5.929,0,0,1-1.3-4.006V15.641a5.933,5.933,0,0,1,1.3-4.006,6.257,6.257,0,0,1,8.519,0,5.936,5.936,0,0,1,1.3,4.006v2.826A5.932,5.932,0,0,1,81.6,22.473ZM92.975,12.444Q92.161,10.125,91.2,7.711q-1.875,4.8-3.309,9.356H94.5Q93.788,14.764,92.975,12.444Zm5.708,10.468a1.181,1.181,0,0,1,.013.165,1.026,1.026,0,0,1-.385.837,1.365,1.365,0,0,1-.884.315,1.13,1.13,0,0,1-1.183-.96q-0.195-.768-0.469-1.742T95.14,19.317H87.252q-0.386,1.318-1.075,3.951a1.116,1.116,0,0,1-1.157.96,1.287,1.287,0,0,1-.856-0.329,1.066,1.066,0,0,1-.385-0.851,1.447,1.447,0,0,1,.055-0.329q1.048-4.335,2.509-8.725t3.308-8.917a1.607,1.607,0,0,1,3.172,0q1.763,4.336,3.213,8.711t2.606,8.931C98.659,22.793,98.673,22.858,98.683,22.912ZM110.73,23.8a1.178,1.178,0,0,1-.867.342,1.145,1.145,0,0,1-.841-0.342,1.167,1.167,0,0,1-.345-0.864V15.2a3.538,3.538,0,0,0-.523-2.14,2.485,2.485,0,0,0-2.095-.824,3.539,3.539,0,0,0-3.338,1.729V22.94a1.144,1.144,0,0,1-.358.864,1.2,1.2,0,0,1-.855.342,1.223,1.223,0,0,1-1.214-1.207V13.693a1.759,1.759,0,0,0-.855-1.729,0.834,0.834,0,0,1-.469-0.8,0.991,0.991,0,0,1,1.187-1.043,2.349,2.349,0,0,1,1.488.576,2.643,2.643,0,0,1,.608.906,5.552,5.552,0,0,1,4.3-1.646q4.521,0,4.522,5.022V22.94A1.164,1.164,0,0,1,110.73,23.8Zm10.631-10.5a3.913,3.913,0,0,0-2.868-1.262q-2.951,0-2.95,3.7v2.991q0,3.32,3.006,3.32a4.221,4.221,0,0,0,2.812-1.153v-7.6Zm2.454,10.838a2.136,2.136,0,0,1-1.986-1.207,5.914,5.914,0,0,1-3.611,1.207q-5.1,0-5.1-5.542v-2.5q0-6.146,4.935-6.146a5.461,5.461,0,0,1,3.309,1.07V5.3a1.131,1.131,0,0,1,.345-0.836,1.179,1.179,0,0,1,.868-0.344,1.148,1.148,0,0,1,.841.344,1.135,1.135,0,0,1,.345.836V20.58a1.774,1.774,0,0,0,.772,1.728,0.836,0.836,0,0,1,.469.8A0.99,0.99,0,0,1,123.815,24.147ZM137.3,9.413a2.765,2.765,0,0,0-.827-2.086,4.383,4.383,0,0,0-3.2-1.015h-3.86V13.8h4.219a3.963,3.963,0,0,0,2.811-.905,2.839,2.839,0,0,0,.855-2.141V9.413Zm0.855,5.213a6.461,6.461,0,0,1-4.467,1.455h-4.273v6.914a1.242,1.242,0,1,1-2.483,0V5.215a1.206,1.206,0,0,1,.358-0.864,1.178,1.178,0,0,1,.883-0.371h5.267a6.642,6.642,0,0,1,4.936,1.728,5.077,5.077,0,0,1,1.405,3.677v1.4A4.953,4.953,0,0,1,138.153,14.626Zm6.065,9.521a2.281,2.281,0,0,1-1.489-.576,3.058,3.058,0,0,1-1.075-2.552V5.3a1.111,1.111,0,0,1,.359-0.836,1.234,1.234,0,0,1,1.709,0,1.114,1.114,0,0,1,.359.836V20.58a1.754,1.754,0,0,0,.855,1.728,0.836,0.836,0,0,1,.468.8A0.989,0.989,0,0,1,144.218,24.147Zm10.341-6.365h-2.9q-2.923,0-2.923,2.14V20.14q0,2.14,2.839,2.14,2.979,0,2.979-2.881V17.781Zm2.453,6.365a1.95,1.95,0,0,1-1.433-.576,1.8,1.8,0,0,1-.551-0.823,5.01,5.01,0,0,1-3.861,1.4,5.256,5.256,0,0,1-3.695-1.152,3.781,3.781,0,0,1-1.13-2.881v-0.22a3.563,3.563,0,0,1,1.213-2.853,5.945,5.945,0,0,1,3.86-1.126h3.144V15.257a4.159,4.159,0,0,0-.552-2.469,2.735,2.735,0,0,0-2.289-.823,5.81,5.81,0,0,0-2.811.686,1.226,1.226,0,0,1-.58.165A0.947,0.947,0,0,1,147.6,12.5a1.044,1.044,0,0,1-.289-0.727,0.987,0.987,0,0,1,.5-0.851,7.594,7.594,0,0,1,4.054-.96,5.081,5.081,0,0,1,4.026,1.4,6.394,6.394,0,0,1,1.074,4.115v5.1a1.813,1.813,0,0,0,.772,1.728,0.912,0.912,0,0,1,.469.8A0.989,0.989,0,0,1,157.012,24.147Zm9.184-2.085a14.981,14.981,0,0,1-2.787,5.158A5.725,5.725,0,0,1,159.385,29a1.227,1.227,0,0,1-.966-0.33,1.159,1.159,0,0,1-.358-0.851,1.038,1.038,0,0,1,1.13-1.152q2.427-.082,3.888-2.8-1.572-3.923-2.73-7.01t-1.875-5.42c-0.019-.072-0.032-0.137-0.042-0.192a1.335,1.335,0,0,1-.013-0.192,0.992,0.992,0,0,1,.358-0.8,1.287,1.287,0,0,1,.855-0.3,1.078,1.078,0,0,1,1.048.823q0.744,2.334,1.64,4.843t1.944,5.227l3.419-10.1a1.1,1.1,0,0,1,1.1-.8,1.253,1.253,0,0,1,.855.316,1.029,1.029,0,0,1,.358.809,1.473,1.473,0,0,1-.082.466Z"/>
    </svg>
</a>
        <button class="header__nav-button js-nav-toggle">
                <svg class="icon  header__nav-toggle-icon header__nav-toggle-icon--open">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#menu"></use>
</svg>
                <svg class="icon  header__nav-toggle-icon header__nav-toggle-icon--close">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#menu-close"></use>
</svg>
                <span class="header__nav-button-label">Navigation</span>
            </button>
        <nav class="header__nav">
            <ul class="header__nav-list">
                <li class="header__nav-item is-current">
                    <a href="#" class="link  header__nav-link">
    Work
</a>
                </li>
                <li class="header__nav-item">
                    <a href="#" class="link  header__nav-link">
    Team
</a>
                </li>
                <li class="header__nav-item">
                    <a href="#" class="link  header__nav-link">
    Contact
</a>
                </li>
                <li class="header__nav-item">
                    <a href="#" class="link  header__nav-link">
    About
</a>
                </li>
                <li class="header__nav-item header__nav-item--mobile">
                    <a href="#" class="link  header__nav-link">
    Brand kit
</a>
                </li>
                <li class="header__nav-item header__nav-item--mobile">
                    <a href="#" class="link  header__nav-link">
    Privacy Policty
</a>
                </li>
            </ul>
        </nav>
    </div>
    <div class="header__background">
        <svg class="header__background-triangle" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 177.23">
            <path d="M142.34,61.33a30.14,30.14,0,0,1,0,54.87l-95,54.6C21.41,185.88,0,173.51,0,143.35V33.88C0,3.72,21.41-8.65,47.34,6.43l95,54.9"/>
        </svg>
    </div>
    <div class="header__footer">
        <ul class="list  social header__social">
            <li class="list__item "> <a href="https://www.facebook.com/gotoandplay.ee/" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#facebook"></use>
</svg>
            <span class="social__label">Visit our Facebook page</span>
        </a>
            </li>
            <li class="list__item "> <a href="https://www.instagram.com/gotoandplayee/" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#instagram"></use>
</svg>
            <span class="social__label">Visit our Instagram feed</span>
        </a>
            </li>
            <li class="list__item "> <a href="https://twitter.com/gotoandplayee" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#twitter"></use>
</svg>
            <span class="social__label">Visit our Twitter feed</span>
        </a>
            </li>
        </ul>

        <nav class="languages  header__lang">
            <ul class="list  languages__list">
                <li class="list__item languages__item"> <a href="#" class="link  languages__link is-current">
    eng
</a>
                </li>
                <li class="list__item languages__item"> <a href="#" class="link  languages__link">
    est
</a>
                </li>
            </ul>
        </nav>
    </div>
</header>

<div class="main  ">
    <div class="main__content">

        <section class="section section--page-intro content password-form">
            <div class="section__inner">
                <div class="section__content">
                    <div class="h-container content__inner">
                        <div class="image image--fluid content__pattern">
                            <div class="image__inner">
                                <img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-srcset="../../inc/img/hero-pattern.svg 192w" data-sizes="auto" alt="" class="image__img lazyload">
                                <noscript>
                <img src="../../inc/img/hero-pattern.svg" srcset="../../inc/img/hero-pattern.svg 192w" sizes="100vw" alt="" class="image__img">
            </noscript>
                            </div>
                        </div>

                        <h1 class="heading  h2">
                            <span class="heading__small">you are required to enter the</span>
                            <span class="heading__main">
                    password
            </span>
                        </h1>
                        <div class="content__body text editor">
                            <form class="password-form__form" action="/" method="post">
                                <div class="grid">
                                    <div class="grid__col grid__col--xs-12 password-form__row">
                                        <div class="form-textfield  ">
                                            <div class="form-textfield__inner">
                                                <input type="password" class="form-textfield__input" id="password-form-pw-field" name="password-form-pw" value="">
                                                <label class="form-textfield__label" for="password-form-pw-field">password</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="grid__col grid__col--xs-12">
                                        <div class="password-form__button">

                                            <button type="submit" class="button button--tertiary ">
    enter
</button>
                                        </div>
                                    </div>
                                </div>
                            </form>

                        </div>
                    </div>

                </div>
            </div>
        </section>

    </div>
    <div class="sticky-footer  ">
        <ul class="list  social sticky-footer__social">
            <li class="list__item "> <a href="https://www.facebook.com/gotoandplay.ee/" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#facebook"></use>
</svg>
            <span class="social__label">Visit our Facebook page</span>
        </a>
            </li>
            <li class="list__item "> <a href="https://www.instagram.com/gotoandplayee/" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#instagram"></use>
</svg>
            <span class="social__label">Visit our Instagram feed</span>
        </a>
            </li>
            <li class="list__item "> <a href="https://twitter.com/gotoandplayee" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#twitter"></use>
</svg>
            <span class="social__label">Visit our Twitter feed</span>
        </a>
            </li>
        </ul>
        <nav class="languages languages--dark sticky-footer__languages">
            <ul class="list languages--dark languages__list">
                <li class="list__item languages__item"> <a href="#" class="link languages--dark languages__link is-current">
    eng
</a>
                </li>
                <li class="list__item languages__item"> <a href="#" class="link languages--dark languages__link">
    est
</a>
                </li>
            </ul>
        </nav>
    </div>
    <footer class="footer  main__footer">

        <h2 class="heading heading--on-dark footer__heading">
            <span class="heading__small">take a look at our</span>
            <span class="heading__main">
                    <a href="#" class="link link--h2 footer__heading">
    case studies
</a>
            </span>
        </h2>

        <nav class="footer__nav">
            <ul class="list  social footer__social">
                <li class="list__item "> <a href="https://www.facebook.com/gotoandplay.ee/" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#facebook"></use>
</svg>
            <span class="social__label">Visit our Facebook page</span>
        </a>
                </li>
                <li class="list__item "> <a href="https://www.instagram.com/gotoandplayee/" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#instagram"></use>
</svg>
            <span class="social__label">Visit our Instagram feed</span>
        </a>
                </li>
                <li class="list__item "> <a href="https://twitter.com/gotoandplayee" class="social__link">
            <svg class="icon  ">
    <use xlink:href="../../inc/svg/global.b2834a8c5e2811bb3821991f69ec7764.svg#twitter"></use>
</svg>
            <span class="social__label">Visit our Twitter feed</span>
        </a>
                </li>
            </ul>

            <ul class="list  footer__menu">
                <li class="list__item "> <a href="#" class="link  footer__menu-link">
    Brand kit
</a>
                </li>
                <li class="list__item "> <a href="#" class="link  footer__menu-link">
    Privacy policy
</a>
                </li>
                <li class="list__item "> <a href="#" class="link  footer__menu-link">
    Something else
</a>
                </li>
            </ul>

            <nav class="languages  footer__lang">
                <ul class="list  languages__list">
                    <li class="list__item languages__item"> <a href="#" class="link  languages__link is-current">
    eng
</a>
                    </li>
                    <li class="list__item languages__item"> <a href="#" class="link  languages__link">
    est
</a>
                    </li>
                </ul>
            </nav>
        </nav>
    </footer>
    <div class="cookie  ">
        <div class="cookie__notice">
            <div class="cookie__content text">
                Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis molestias maxime odio id hic iste? Cumque, voluptates similique sit doloribus impedit, minus culpa odit quas tempore voluptatum. Odit, animi, ratione.
            </div>
            <div class="cookie__actions">

                <button type="button" class="button  cookie__accept-button">
    Nõustun
</button>
            </div>
        </div>
    </div>
</div>
{
  "language": "en-US",
  "data": {
    "header": {
      "logo": {
        "label": "gotoAndPlay",
        "link": "#"
      },
      "navButtonLabel": "Navigation",
      "navigation": [
        {
          "link": "#",
          "title": "Work",
          "current": true
        },
        {
          "link": "#",
          "title": "Team"
        },
        {
          "link": "#",
          "title": "Contact"
        },
        {
          "link": "#",
          "title": "About"
        },
        {
          "link": "#",
          "title": "Brand kit",
          "modifier": "header__nav-item--mobile"
        },
        {
          "link": "#",
          "title": "Privacy Policty",
          "modifier": "header__nav-item--mobile"
        }
      ],
      "social": {
        "items": [
          {
            "link": "https://www.facebook.com/gotoandplay.ee/",
            "icon": "facebook",
            "label": "Visit our Facebook page"
          },
          {
            "link": "https://www.instagram.com/gotoandplayee/",
            "icon": "instagram",
            "label": "Visit our Instagram feed"
          },
          {
            "link": "https://twitter.com/gotoandplayee",
            "icon": "twitter",
            "label": "Visit our Twitter feed"
          }
        ]
      },
      "languages": {
        "items": [
          {
            "link": "#",
            "title": "eng",
            "current": "true"
          },
          {
            "link": "#",
            "title": "est"
          }
        ]
      }
    },
    "footer": {
      "heading": {
        "prefix": "take a look at our",
        "text": "case studies",
        "link": "#"
      },
      "social": {
        "items": [
          {
            "link": "https://www.facebook.com/gotoandplay.ee/",
            "icon": "facebook",
            "label": "Visit our Facebook page"
          },
          {
            "link": "https://www.instagram.com/gotoandplayee/",
            "icon": "instagram",
            "label": "Visit our Instagram feed"
          },
          {
            "link": "https://twitter.com/gotoandplayee",
            "icon": "twitter",
            "label": "Visit our Twitter feed"
          }
        ]
      },
      "languages": {
        "items": [
          {
            "link": "#",
            "title": "eng",
            "current": "true"
          },
          {
            "link": "#",
            "title": "est"
          }
        ]
      },
      "navigation": [
        {
          "link": "#",
          "title": "Brand kit"
        },
        {
          "link": "#",
          "title": "Privacy policy"
        },
        {
          "link": "#",
          "title": "Something else"
        }
      ]
    },
    "passwordForm": {
      "heading": {
        "prefix": "you are required to enter the",
        "text": "password"
      },
      "field": {
        "label": "password",
        "type": "password",
        "id": "password-form-pw-field",
        "name": "password-form-pw"
      },
      "form": {
        "action": "/",
        "method": "post"
      },
      "button": {
        "text": "enter",
        "type": "submit"
      }
    },
    "stickyFooter": {
      "social": {
        "items": [
          {
            "link": "https://www.facebook.com/gotoandplay.ee/",
            "icon": "facebook",
            "label": "Visit our Facebook page"
          },
          {
            "link": "https://www.instagram.com/gotoandplayee/",
            "icon": "instagram",
            "label": "Visit our Instagram feed"
          },
          {
            "link": "https://twitter.com/gotoandplayee",
            "icon": "twitter",
            "label": "Visit our Twitter feed"
          }
        ]
      },
      "languages": {
        "items": [
          {
            "link": "#",
            "title": "eng",
            "current": "true"
          },
          {
            "link": "#",
            "title": "est"
          }
        ]
      }
    },
    "cookie": {
      "content": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis molestias maxime odio id hic iste? Cumque, voluptates similique sit doloribus impedit, minus culpa odit quas tempore voluptatum. Odit, animi, ratione.",
      "button": {
        "text": "Nõustun"
      }
    }
  }
}