/*!
 * html5-device-mockups (https://github.com/pixelsign/html5-device-mockups)
 * Copyright 2013 - 2017 pixelsign
 * Licensed under MIT (https://github.com/pixelsign/html5-device-mockups/blob/master/LICENSE.txt)
 * Last Build: Tue Nov 14 2017 12:40:57
 */
/*!
 * html5-device-mockups (https://github.com/pixelsign/html5-device-mockups)
 * Copyright 2013 - 2017 pixelsign
 * Licensed under MIT (https://github.com/pixelsign/html5-device-mockups/blob/master/LICENSE.txt)
 * Last Build: Tue Nov 14 2017 12:39:20
 */
 .device-wrapper {
  max-width: 300px;
  width: 100%; }

.device {
  position: relative;
  background-size: cover; }
  .device .screen {
    position: absolute;
    background-size: cover;
    pointer-events: none; }
  .device .button {
    position: absolute;
    cursor: pointer; }

.device[data-device="iPhone7"][data-orientation="portrait"][data-color="black"] {
  padding-bottom: 203.10345%;
  background-image: url(../images/portrait_black.png); }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="black"] .screen {
    top: 11.99774%;
    left: 6.2069%;
    width: 87.35632%;
    height: 76.06112%; }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="black"] .button {
    top: 89.53028%;
    left: 42.29885%;
    width: 15.74713%;
    height: 7.75325%; }

.device[data-device="iPhone7"][data-orientation="portrait"][data-color="white"] {
  padding-bottom: 203.10345%;
  background-image: url(../images/portrait_white.png); }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="white"] .screen {
    top: 11.99774%;
    left: 6.2069%;
    width: 87.35632%;
    height: 76.06112%; }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="white"] .button {
    top: 89.53028%;
    left: 42.29885%;
    width: 15.74713%;
    height: 7.75325%; }

.device[data-device="iPhone7"][data-orientation="portrait"][data-color="gold"] {
  padding-bottom: 203.10345%;
  background-image: url(../images/portrait_gold.png); }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="gold"] .screen {
    top: 11.99774%;
    left: 6.2069%;
    width: 87.35632%;
    height: 76.06112%; }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="gold"] .button {
    top: 89.53028%;
    left: 42.29885%;
    width: 15.74713%;
    height: 7.75325%; }

.device[data-device="iPhone7"][data-orientation="portrait"][data-color="pink"] {
  padding-bottom: 203.10345%;
  background-image: url(../images/portrait_pink.png); }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="pink"] .screen {
    top: 11.99774%;
    left: 6.2069%;
    width: 87.35632%;
    height: 76.06112%; }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="pink"] .button {
    top: 89.53028%;
    left: 42.29885%;
    width: 15.74713%;
    height: 7.75325%; }

.device[data-device="iPhone7"][data-orientation="portrait"][data-color="red"] {
  padding-bottom: 201.91083%;
  background-image: url(../images/portrait_red.png); }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="red"] .screen {
    top: 11.98738%;
    left: 6.6879%;
    width: 84.71338%;
    height: 75.55205%; }
  .device[data-device="iPhone7"][data-orientation="portrait"][data-color="red"] .button {
    top: 89.74763%;
    left: 42.35669%;
    width: 15.6051%;
    height: 7.72871%; }