html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline; }

html {
  line-height: 1; }

ol, ul {
  list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

q, blockquote {
  quotes: none; }
  q:before, q:after, blockquote:before, blockquote:after {
    content: "";
    content: none; }

a img {
  border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block; }

*, :before, :after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.abs-pos, #wrapper, #click_through, #logo2, #pen, #pen #f2-copy1, #pen #f2-copy2, #pen #f2-copy3, #pen #product3, #pen #product4, #pen #pen_tool, #pen #ink1, #pen #ink2, #pen #ink3, #pen #ink4, #keyboard, #keyboard #f3-copy1, #keyboard #f3-copy2, #keyboard #f3-copy3, #keyboard #product5_tablet, #keyboard #product5_keyboard, #keyboard #product6, #speed, #speed #f5-copy1, #speed #f5-copy2, #speed #f5-copy3, #speed #product9, #speed #product10, #weight, #weight #f4-copy1, #weight #f4-copy2, #weight #f4-copy3, #weight #f4-copy4, #weight #f4-copy5, #weight #product7, #weight #product8, #endframe, #endframe #f6-copy1, #endframe #f6-copy2, #endframe #f6-copy3, #endframe #f6-copy4, #endframe #product11, #offer, #offer-hotspot {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 300px;
  height: 600px;
  overflow: hidden; }

#wrapper {
  position: relative;
  visibility: hidden;
  overflow: hidden; }
  #wrapper.show {
    visibility: visible; }

#click_through {
  z-index: 999;
  cursor: pointer;
  overflow: hidden;
  background-color: rgba(255, 255, 255, 0);
  border: 1px solid #000000; }

#logo2 {
  background: url('../img/endframe-seaab6a3cf1.png') 0 0; }

#blue-bar {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  width: 12px;
  height: 600px;
  background-color: #0078d7; }

#btn-replay {
  position: absolute;
  left: 265px;
  top: 11px;
  width: 22px;
  height: 26px;
  background: url('../img/endframe-seaab6a3cf1.png') 0 -600px;
  cursor: pointer;
  z-index: 1012; }

#buttons {
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 0px;
  z-index: 10010;
  cursor: pointer; }
  #buttons #btn_weight {
    position: absolute;
    top: 331px;
    left: 71px;
    width: 40px;
    height: 41px;
    background: url('../img/buttons-sa42d8ae526.png') 0 0; }
    #buttons #btn_weight.off {
      background: url('../img/buttons-sa42d8ae526.png') 0 0; }
    #buttons #btn_weight.over {
      background: url('../img/buttons-sa42d8ae526.png') 0 -41px; }
    #buttons #btn_weight.visited {
      background: url('../img/buttons-sa42d8ae526.png') 0 -328px; }
  #buttons #btn_speed {
    position: absolute;
    top: 331px;
    left: 111px;
    width: 40px;
    height: 41px;
    background: url('../img/buttons-sa42d8ae526.png') 0 -82px; }
    #buttons #btn_speed.off {
      background: url('../img/buttons-sa42d8ae526.png') 0 -82px; }
    #buttons #btn_speed.over {
      background: url('../img/buttons-sa42d8ae526.png') 0 -123px; }
    #buttons #btn_speed.visited {
      background: url('../img/buttons-sa42d8ae526.png') 0 -369px; }
  #buttons #btn_pen {
    position: absolute;
    top: 331px;
    left: 151px;
    width: 40px;
    height: 41px;
    background: url('../img/buttons-sa42d8ae526.png') 0 -164px; }
    #buttons #btn_pen.off {
      background: url('../img/buttons-sa42d8ae526.png') 0 -164px; }
    #buttons #btn_pen.over {
      background: url('../img/buttons-sa42d8ae526.png') 0 -205px; }
    #buttons #btn_pen.visited {
      background: url('../img/buttons-sa42d8ae526.png') 0 -410px; }
  #buttons #btn_keyboard {
    position: absolute;
    top: 331px;
    left: 191px;
    width: 40px;
    height: 41px;
    background: url('../img/buttons-sa42d8ae526.png') 0 -246px; }
    #buttons #btn_keyboard.off {
      background: url('../img/buttons-sa42d8ae526.png') 0 -246px; }
    #buttons #btn_keyboard.over {
      background: url('../img/buttons-sa42d8ae526.png') 0 -287px; }
    #buttons #btn_keyboard.visited {
      background: url('../img/buttons-sa42d8ae526.png') 0 -451px; }

#pen {
  /*#product2 {
  	@extend .abs-pos;
  	background: sprite($mac_fold, product2_1);  
  }*/ }
  #pen #f2-copy1 {
    background: url('../img/pen-sbb417a71d4.png') 0 0; }
  #pen #f2-copy2 {
    background: url('../img/pen-sbb417a71d4.png') 0 -600px; }
  #pen #f2-copy3 {
    background: url('../img/pen-sbb417a71d4.png') 0 -1200px; }
  #pen #product3 {
    background: url('../img/pen-sbb417a71d4.png') 0 -4800px; }
  #pen #product4 {
    background: url('../img/pen-sbb417a71d4.png') 0 -5400px; }
  #pen #pen_tool {
    background: url('../img/pen-sbb417a71d4.png') 0 -4200px no-repeat; }
  #pen #ink1 {
    background: url('../img/pen-sbb417a71d4.png') 0 -1800px no-repeat; }
  #pen #ink2 {
    background: url('../img/pen-sbb417a71d4.png') 0 -2400px no-repeat; }
  #pen #ink3 {
    background: url('../img/pen-sbb417a71d4.png') 0 -3000px no-repeat; }
  #pen #ink4 {
    background: url('../img/pen-sbb417a71d4.png') 0 -3600px no-repeat; }

#keyboard #f3-copy1 {
  background: url('../img/keyboard-s0672ea88ad.png') 0 0; }
#keyboard #f3-copy2 {
  background: url('../img/keyboard-s0672ea88ad.png') 0 -600px; }
#keyboard #f3-copy3 {
  background: url('../img/keyboard-s0672ea88ad.png') 0 -1200px; }
#keyboard #product5_tablet {
  background: url('../img/keyboard-s0672ea88ad.png') 0 -2400px; }
#keyboard #product5_keyboard {
  background: url('../img/keyboard-s0672ea88ad.png') 0 -1800px; }
#keyboard #product6 {
  background: url('../img/keyboard-s0672ea88ad.png') 0 -3000px; }

#speed #f5-copy1 {
  background: url('../img/speed-sd51a8ae22f.png') 0 0; }
#speed #f5-copy2 {
  background: url('../img/speed-sd51a8ae22f.png') 0 -600px; }
#speed #f5-copy3 {
  background: url('../img/speed-sd51a8ae22f.png') 0 -1200px; }
#speed #product9 {
  background: url('../img/speed-sd51a8ae22f.png') 0 -2400px; }
#speed #product10 {
  background: url('../img/speed-sd51a8ae22f.png') 0 -1800px; }

#weight #f4-copy1 {
  background: url('../img/weight-sa080aec41b.png') 0 0; }
#weight #f4-copy2 {
  background: url('../img/weight-sa080aec41b.png') 0 -600px; }
#weight #f4-copy3 {
  background: url('../img/weight-sa080aec41b.png') 0 -1200px; }
#weight #f4-copy4 {
  background: url('../img/weight-sa080aec41b.png') 0 -1800px; }
#weight #f4-copy5 {
  background: url('../img/weight-sa080aec41b.png') 0 -2400px; }
#weight #product7 {
  background: url('../img/weight-sa080aec41b.png') 0 -3000px; }
#weight #product8 {
  background: url('../img/weight-sa080aec41b.png') 0 -3600px; }

#endframe #f6-copy1 {
  background: url('../img/endframe-seaab6a3cf1.png') 0 -626px; }
#endframe #f6-copy2 {
  background: url('../img/endframe-seaab6a3cf1.png') 0 -1226px; }
#endframe #f6-copy3 {
  background: url('../img/endframe-seaab6a3cf1.png') 0 -1826px; }
#endframe #f6-copy4 {
  background: url('../img/endframe-seaab6a3cf1.png') 0 -2426px; }
#endframe #product11 {
  background: url('../img/endframe-seaab6a3cf1.png') 0 -3659px; }

#offer {
  background: url('../img/endframe-seaab6a3cf1.png') 0 -3059px; }

#offer-hotspot {
  height: 20px;
  width: 100px;
  top: 467px;
  left: 47px;
  z-index: 1002;
  cursor: pointer; }

	/*#intro {

	@extend .abs-pos;
			#f1-copy1 {
			  background: url($intro, f1-copy1);
			   }
			 #f1-copy2 {
			  background: url($intro , f1-copy2); 
			  }
			#f1-copy3 {
			  background: url($intro, f1-copy3);
			  }
			#f1-copy4 {
			  background: url($intro, f1-copy4);
			  }
			#intro #product1 {
			  background: url($intro, product1);
			  }
			 #product2 {
			  background: url($intro, product2);
			  }
	 }*/
#learnMore1 {
  position: relative;
  width: 113px;
  height: 33px;
  top: 0px;
  left: 0px;
  background: url('../img/endframe-seaab6a3cf1.png') 0 -3026px; }

#learnMore2 {
  position: relative;
  width: 113px;
  height: 33px;
  top: 0px;
  left: 0px;
  background: url('../img/endframe-seaab6a3cf1.png') 0 -3026px; }

#cta {
  position: absolute;
  width: 113px;
  height: 33px;
  top: 218px;
  left: 54px;
  overflow: hidden;
  background-color: #0078d7;
  border: none; }
