@font-face {
    font-family: 'AvenirNext';
    src: url('https://www.snapchat.com/fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot?#iefix');
    src: url('https://www.snapchat.com/fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot?#iefix') format('eot'), url('https://www.snapchat.com/fonts/2cd55546-ec00-4af9-aeca-4a3cd186da53.woff2') format('woff2'), url('https://www.snapchat.com/fonts/1e9892c0-6927-4412-9874-1b82801ba47a.woff') format('woff'), url('https://www.snapchat.com/fonts/46cf1067-688d-4aab-b0f7-bd942af6efd8.ttf') format('truetype'), url('https://www.snapchat.com/fonts/52a192b1-bea5-4b48-879f-107f009b666f.svg#52a192b1-bea5-4b48-879f-107f009b666f') format('svg');
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'AvenirNext';
    src: url('https://www.snapchat.com/fonts/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?#iefix');
    src: url('https://www.snapchat.com/fonts/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?#iefix') format('eot'), url('https://www.snapchat.com/fonts/627fbb5a-3bae-4cd9-b617-2f923e29d55e.woff2') format('woff2'), url('https://www.snapchat.com/fonts/f26faddb-86cc-4477-a253-1e1287684336.woff') format('woff'), url('https://www.snapchat.com/fonts/63a74598-733c-4d0c-bd91-b01bffcd6e69.ttf') format('truetype'), url('https://www.snapchat.com/fonts/a89d6ad1-a04f-4a8f-b140-e55478dbea80.svg#a89d6ad1-a04f-4a8f-b140-e55478dbea80') format('svg');
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: 'AvenirNext';
    src: url('https://www.snapchat.com/fonts/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?#iefix');
    src: url('https://www.snapchat.com/fonts/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?#iefix') format('eot'), url('https://www.snapchat.com/fonts/aad99a1f-7917-4dd6-bbb5-b07cedbff64f.woff2') format('woff2'), url('https://www.snapchat.com/fonts/91b50bbb-9aa1-4d54-9159-ec6f19d14a7c.woff') format('woff'), url('https://www.snapchat.com/fonts/a0f4c2f9-8a42-4786-ad00-fce42b57b148.ttf') format('truetype'), url('https://www.snapchat.com/fonts/99affa9a-a5e9-4559-bd07-20cf0071852d.svg#99affa9a-a5e9-4559-bd07-20cf0071852d') format('svg');
    font-weight: 700;
    font-style: normal
}

body {
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'AvenirNext', 'Helvetica Neue', Arial, Helvetica, sans-serif;
}

.page-unlock {
  margin-top: -46px;
  text-align: center;
}

.page-unlock .section {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 440px;
  overflow-x: hidden;
  overflow-y: hidden;
}

@media (max-width:320px), (min-width:375px) and (max-width:375px), (min-width:414px) and (max-width:414px) {
  .page-unlock .section {
    height: calc(100vh - 68px);
  }
}

.page-unlock .section-content {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  z-index: 1;
  transform: translateY(-50%);
}

.page-unlock .section-footer {
  position: absolute;
  bottom: 18px;
  left: 0;
  width: 100%;
  z-index: 1;
}

.page-unlock .snapcode {
  margin: 0;
}

.page-unlock .snapcode-link,
.page-unlock .snapcode-image {
  display: block;
  margin: 0 auto;
  width: 176px;
  height: 176px;
}

.page-unlock .snapcode-caption {
  margin: 1em 0;
  padding-bottom: 5px;
}

.page-unlock .unlockable_title{
  font-size: 19px;
  font-weight: 700;
}

.page-unlock .unlockable_subtitle{
  font-size: 12px;
  font-weight: 700;
  padding-bottom: 5px;
}

.page-unlock .appbutton {
  background: #9043be;
  border-radius: 22px;
  color: #fff;
  display: inline-block;
  font-size: 17px;
  font-weight: 700;
  line-height: 44px;
  min-width: 180px;
  padding: 0 1em;
  white-space: nowrap;
}

.page-unlock .applink {
  color: #9a9fa7;
  font-size: 17px;
  font-weight: 600;
}

.page-unlock .applink-download {
  padding-left: 1.5em;
  position: relative;
}

.page-unlock .applink-download:before {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzciIGhlaWdodD0iMzUiIHZpZXdCb3g9IjUgNyAzNyAzNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMjUuNTY4IDI0LjU5NGwzLjI3Ny0zLjI3N2EyLjEzIDIuMTMgMCAxIDEgMy4wMTMgMy4wMTNsLTYuOTA4IDYuOTA4YTIuMTI2IDIuMTI2IDAgMCAxLTEuNTE0LjYyNyAyLjEyNiAyLjEyNiAwIDAgMS0xLjUxMy0uNjI3bC02LjkwOS02LjkwOGEyLjEzIDIuMTMgMCAxIDEgMy4wMTQtMy4wMTNsMy4yNzkgMy4yNzlWOS44NzRhMi4xMyAyLjEzIDAgMCAxIDIuMTMtMi4xMzhjMS4xNzcgMCAyLjEzMS45NDcgMi4xMzEgMi4xMzh2MTQuNzJ6bTE0LjkxNSA4djQuOTcyYzAgMi4zNTItMS45MSA0LjI2LTQuMjY2IDQuMjZoLTI1LjU2YTQuMjYgNC4yNiAwIDAgMS00LjI2NS00LjI2di00Ljk3MmEyLjEzIDIuMTMgMCAxIDEgNC4yNjEgMHYzLjE4OGMwIC45ODguNzk2IDEuNzgzIDEuNzc4IDEuNzgzaDIyLjAxM2MuOTg0IDAgMS43NzgtLjc5OCAxLjc3OC0xLjc4M3YtMy4xODhhMi4xMyAyLjEzIDAgMCAxIDQuMjYxIDB6IiBmaWxsPSIjOUE5RkE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=);
  background-size: 1.08824em 1.02941em;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 1.08824em;
  height: 1.02941em;
}

.page-unlock #phone-frame {
  margin-left:-3px;
  top:calc(100% + 10em);
  z-index=5;
  display: none;
  pointer-events: none;
}

.page-unlock #animation-frame {
  margin-left:-25px;
  top:calc(50vh - 80px);
  pointer-events: none;
}

.page-unlock .animated-image {
  width:100px;
  height:162px;
  position: absolute;
  z-index:10;
}

.page-unlock .phone-image {
  margin: 0 auto;
  width: 220px;
  height: 450px;
}