/* CSS Document */
/* Begin Reset CSS */
* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -webkit-text-size-adjust: none;
  box-sizing: border-box; }

/* End Reset CSS */
div {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden; }

.vis-off {
  visibility: hidden; }

.opacity-0 {
  opacity: 0; }

#ad {
  position: absolute;
  width: 160px;
  height: 600px;
  left: 0;
  top: 0;
  border: 1px solid black;
  overflow: hidden; }

#bg {
  position: absolute;
  width: 160px;
  height: 600px;
  left: 0;
  top: 0;
  overflow: hidden;
  background: url("gradient.jpg") 0 0 no-repeat; }

#bubbles-1 {
  position: absolute;
  width: 160px;
  height: 1000px;
  left: 0;
  top: 0;
  opacity: .5;
  overflow: hidden;
  background: url("bubbles.png"); }

#bubbles-2 {
  position: absolute;
  width: 160px;
  height: 1000px;
  left: 0;
  top: -150px;
  opacity: .3;
  overflow: hidden;
  background: url("bubbles.png"); }

#logo {
  position: absolute;
  width: 120px;
  height: 38px;
  left: 10px;
  top: 30px;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 0 no-repeat; }

#headline-1, #headline-2 {
  position: absolute;
  width: 260px;
  height: 132px;
  left: 10px;
  top: 210px;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 -40px no-repeat; }

#tagline {
  position: absolute;
  width: 250px;
  height: 76px;
  left: 10px;
  top: 245px;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 -180px no-repeat; }

#cta {
  position: absolute;
  width: 135px;
  height: 30px;
  left: 10px;
  top: 340px;
  overflow: hidden; }

#cta-bg {
  position: absolute;
  width: 135px;
  height: 37px;
  left: 0;
  top: 0;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 -280px no-repeat; }

#cta-text {
  position: absolute;
  width: 102px;
  height: 15px;
  left: 15px;
  top: 10px;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 -260px no-repeat; }

#card-qs {
  position: absolute;
  width: 120px;
  height: 80px;
  left: 7px;
  top: 440px;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 -324px no-repeat;
  -webkit-transform-origin: 0 0;
      -ms-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transform: scale(1) rotate(-10deg);
      -ms-transform: scale(1) rotate(-10deg);
          transform: scale(1) rotate(-10deg); }

#card-v {
  position: absolute;
  width: 120px;
  height: 80px;
  left: 25px;
  top: 430px;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 -423px no-repeat;
  -webkit-transform-origin: 0 0;
      -ms-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transform: scale(1) rotate(3deg);
      -ms-transform: scale(1) rotate(3deg);
          transform: scale(1) rotate(3deg); }

#card-mc {
  position: absolute;
  width: 120px;
  height: 80px;
  left: 50px;
  top: 425px;
  overflow: hidden;
  background: url("sprite-sheet.png") 0 -522px no-repeat;
  -webkit-transform-origin: 0 0;
      -ms-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transform: scale(1) rotate(21deg);
      -ms-transform: scale(1) rotate(21deg);
          transform: scale(1) rotate(21deg); }

.headline-transform-1 {
  -webkit-transform-origin: 0 0;
      -ms-transform-origin: 0 0;
          transform-origin: 0 0; }

.transform-rotate {
  -webkit-transform: rotate(15deg);
      -ms-transform: rotate(15deg);
          transform: rotate(15deg); }

.transition-time {
  -webkit-transition: all 3000ms cubic-bezier(0.645, 0.045, 0.355, 1);
          transition: all 3000ms cubic-bezier(0.645, 0.045, 0.355, 1); }

:focus {
  outline: none; }

::-moz-focus-inner {
  border: 0; }