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, #f1-copy1, .copy, .click_through, #menu, #menu-bg, #ksp1, #ksp1 .copy-line, #ksp1 .copy-next, #ksp1 .product, #ksp2, #ksp2 .copy-line, #ksp2 .copy-next, #ksp2 .product, #ksp3, #ksp3 .copy-line, #ksp3 .copy-next, #ksp3 .product, #endframe, #endframe .copy-line, #endframe .product, #ef_holder, #f1_holder, #f2_holder, #f3_holder, #menu_holder {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 970px;
  height: 250px;
  overflow: hidden; }

#wrapper {
  position: relative;
  visibility: hidden;
  border: 1px solid #000000; 
}

#wrapper #ef_holder,
#wrapper #f1_holder,
#wrapper #f2_holder,
#wrapper #f3_holder,
#wrapper #f4_holder
 {
  width: 100%;
  height: 100%;
}
  #wrapper.show {
    visibility: visible; }

.click_through {
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0);
  }

 

/*#logo {
	position: absolute;
	width: 94px;
	height: 17px;
	left:15px;
	top:219px;

	top: 50%;
	//left: 50%;
	//opacity: 1;
	background: url("../img/WINDOWS10_LOGO_WHITE.png") no-repeat; 

	/*@include transform(
    	translate( -50%, -50% )
    );
}*/
#logo-white {
  position: absolute;
  width: 180px;
  height: 25px;
  left: 15px;
  top: 209px;
  background-image: url("../img/MSSurface_Logo_horizontal_C-White_RGB.png"); }

#logo-end {
  position: absolute;
  width: 180px;
  height: 25px;
  left: 15px;
  top: 209px;
  background-image: url("../img/MSSurface_Logo_horizontal_C-Gray_RGB.png"); }

#copy {
  position: absolute;
  opacity: 0;
  left: 50%;
  top: 55%;
  width: 100%; }
  #copy p {
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    width: 100%; }

#cta {
  position: relative;
  opacity: 0;
  left: 50%;
  top: 85%; }
  #cta h6 {
    display: block;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100px;
    height: 25px;
    padding-top: 5px;
    background-color: #f47b23;
    color: #ffffff;
    font-family: arial;
    font-size: 12px;
    font-weight: bold;
    line-height: 140%;
    text-align: center; }

#btn-replay {
  position: absolute;
  left: 926px;
  top: 21px;
  width: 22px;
  height: 26px;
  background-image: url("../img/REPLAY_BUTTON.png");
  cursor:pointer;
  cursor: hand;  }

#bg-big-holder {
  position: absolute; }

#bg-big {
  position: absolute; }

.hotspot {
  position: absolute; }

/*#hotspot1 {
  top: 127px;
  left: 795px; }

#hotspot2 {
  top: 129px;
  left: 587px; }

#hotspot3 {
  top: 127px;
  left: 795px; }*/

#ksp1 {
  background-color: #eee; }
  #ksp1 .copy-line {
    /*background-image: url("../img/f2-copy1.png");*/
     }
  /*#ksp1 .copy-next {
    background-image: url("../img/f5-copy2.png"); }*/
  #ksp1 .invisi-hotspot {
    position: absolute;
    width: 200px;
    height: 40px;
    left: 82px;
    top: 148px;
    opacity: .5;
    cursor:pointer;
    cursor: hand;  }
  #ksp1 .fwd-button {
    position: absolute;
    background-image: url("../img/Button_RIGHT.png");
    width: 29px;
    height: 72px;
    left: 941px;
    top: 93px; 
    cursor:pointer;
    cursor: hand; 
  }
  /*#ksp1 .fwd-arrow {
    position: absolute;
    background-image: url("../img/Arrow_RIGHT.png");
    width: 30px;
    height: 37px;
    left: 941px;
    top: 93px; 
  }*/
  #ksp1 .product {
    /*background-image: url("../img/product_laptop.png"); */
  }

#ksp2 {
  background-color: #eee; }
  #ksp2 .copy-line {
    /*background-image: url("../img/f3-copy1.png"); */
  }
  /*#ksp2 .copy-next {
    background-image: url("../img/f6-copy2.png"); }*/
  #ksp2 .invisi-hotspot {
    position: absolute;
    width: 200px;
    height: 40px;
    left: 82px;
    top: 148px;
    opacity: .5;
    cursor: pointer; }
  #ksp2 .fwd-button {
    position: absolute;
    background-image: url("../img/Button_RIGHT.png");
    width: 29px;
    height: 72px;
    left: 941px;
    top: 93px;
    cursor:pointer;
    cursor: hand;  }
  #ksp2 .prev-button {
    position: absolute;
    background-image: url("../img/Button_LEFT.png");
    width: 29px;
    height: 72px;
    left: 0;
    top: 93px; 
    cursor:pointer;
    cursor: hand; 
  }
  /*#ksp2 .fwd-arrow {
    position: absolute;
    background-image: url("../img/Arrow_RIGHT.png");
    width: 30px;
    height: 37px;
    left: 941px;
    top: 93px; 
  }
  #ksp2 .prev-arrow {
    position: absolute;
    background-image: url("../img/Arrow_LEFT.png");
    width: 30px;
    height: 37px;
    left: 0;
    top: 93px; 
  }*/
  #ksp2 .product {
    /*background-image: url("../img/product_tent.png"); */
  }

#ksp3 {
  background-color: #eee; }
  #ksp3 .copy-line {
    /*background-image: url("../img/f4-copy1.png"); */
  }
  /*#ksp3 .copy-next {
    background-image: url("../img/f7-copy2.png"); }*/
  #ksp3 .invisi-hotspot {
    position: absolute;
    width: 200px;
    height: 40px;
    left: 82px;
    top: 148px;
    opacity: .5;
    cursor: pointer; }
  #ksp3 .fwd-button {
    position: absolute;
    background-image: url("../img/Button_RIGHT.png");
    width: 29px;
    height: 72px;
    left: 941px;
    top: 93px; 
    cursor:pointer;
    cursor: hand; 
  }
  #ksp3 .prev-button {
    position: absolute;
    background-image: url("../img/Button_LEFT.png");
    width: 29px;
    height: 72px;
    left: 0;
    top: 93px; 
    cursor:pointer;
    cursor: hand; 
  }
  /*#ksp3 .fwd-arrow {
    position: absolute;
    background-image: url("../img/Arrow_RIGHT.png");
    width: 30px;
    height: 37px;
    left: 941px;
    top: 93px; 
  }
  #ksp3 .prev-arrow {
    position: absolute;
    background-image: url("../img/Arrow_LEFT.png");
    width: 30px;
    height: 37px;
    left: 0;
    top: 93px; 
  }*/
  #ksp3 .product {
    /*background-image: url("../img/product_laptop_4.png"); */
  }

#learnMore {
  width: 92px;
  height: 26px;
  background-color: #0175da;
  position: absolute;
  overflow: hidden;
  left: 116px;
  top: 150px;
  cursor:pointer;
  cursor: hand; 
  }

#learnMore1 {
  margin: 0;
  padding: 0;
  position: relative; }

#learnMore2 {
  margin: 0;
  padding: 0;
  position: relative; }

#hotspot1 {
  top: 127px;
  left: 795px; }

#hotspot2 {
  top: 129px;
  left: 587px; }

#hotspot3 {
  top: 75px;
  left: 836px; }

.pulse-button {
  position: relative;
  width: 79px;
  height: 27px;
  border: none;
  box-shadow: 0 0 0 0 rgba(0, 120, 215, 0.7);
  border-radius: 0%;
  background-color: #137ad4;
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  -webkit-animation: pulse 1.25s 10 cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 1.25s 10 cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 1.25s 10 cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 1.25s 10 cubic-bezier(0.66, 0, 0, 1); }

.pulse-button:hover {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  animation: none; }

@-webkit-keyframes pulse {
  to {
    box-shadow: 0 0 0 10px rgba(232, 76, 61, 0); } }
@-moz-keyframes pulse {
  to {
    box-shadow: 0 0 0 10px rgba(232, 76, 61, 0); } }
@-ms-keyframes pulse {
  to {
    box-shadow: 0 0 0 10px rgba(232, 76, 61, 0); } }
@keyframes pulse {
  to {
    box-shadow: 0 0 0 10px rgba(232, 76, 61, 0); } }
#endframe {
  background-color: #eee; }

  #endframe .product {
    /*background-image: url("../img/product_laptop_5.png"); */
  }
 #legal-rollover {
    /*height:20px;*/
    position:absolute;
    top:215px; 
    left:849px; 
    width:94px; 
    height:7px; 
    background-image: url("../img/f5-copy2.png"); 
    cursor:pointer;
  }

  #copy-rollover-legal {
    /*top:0px;*/
    position:absolute; 
    width:970px; 
    height:250px;
    background-image: url("../img/copy_rollover_legal.png");
  }