* {
  -webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
}

body {
  -webkit-touch-callout: none;                /* prevent callout to copy image, etc when tap to hold */
  -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
  -webkit-user-select: none;                  /* prevent copy paste, to allow, change 'none' to 'text' */
  background-color:black; /*#E4E4E4; */

  background-attachment:fixed;
  font-family:'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
  font-size:12px;
  height:100%;
  margin:0px;
  padding:0px;
  overflow: hidden;
  text-transform:uppercase;
  width:100%;
}

#frame-parent {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #fff;
}
#iap-frame {
    width: 100%;
    height: 100%;
    frameborder: 0;
    scrolling: no;
}

@font-face {
  font-family: 'ObelixPro';
  src: url('../res/fonts/obelix-pro.otf');
}

.spinner {
  width: 80px;
  height: 80px;

  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -40px;
  margin-top: -40px;

  text-align: center;
  
  -webkit-animation: sk-rotate 2.0s infinite linear;
  animation: sk-rotate 2.0s infinite linear;
}

.dot1, .dot2 {
  width: 60%;
  height: 60%;
  display: inline-block;
  position: absolute;
  top: 0;
  background-color: #f5842e;
  border-radius: 100%;
  
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.dot2 {
  top: auto;
  bottom: 0;
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-rotate { 100% { -webkit-transform: rotate(360deg) }}
@keyframes sk-rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}

.device-orientation {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -75px;
    margin-top: -128px;
    animation: fade-animation 2s infinite, orientation-animation 2s infinite;
}
@-moz-keyframes orientation-animation {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}
@-webkit-keyframes orientation-animation {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}
@-o-keyframes orientation-animation {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}
@keyframes orientation-animation {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}
@-moz-keyframes fade-animation {
    0% {
        transform: rotate(-90deg);
    }
    100% {
        transform: rotate(0deg);
    }
}
@-webkit-keyframes fade-animation {
    0% {
        transform: rotate(-90deg);
    }
    100% {
        transform: rotate(0deg);
    }
}
@-o-keyframes fade-animation {
    0% {
        transform: rotate(-90deg);
    }
    100% {
        transform: rotate(0deg);
    }
}
@keyframes fade-animation {
    0% {
        transform: rotate(-90deg);
    }
    100% {
        transform: rotate(0deg);
    }
}