html {
  box-sizing: border-box;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
.cf:before,
.cf:after {
  content: " ";
  display: table;
}
.cf:after {
  clear: both;
}
.cf {
  *zoom: 1;
}
body {
  margin: 0;
  background-color:;
 
}
img {
  max-width: 100%;
  height: auto;
}
figure {
  margin: 0;
  padding: 10px;
}
figure a {
  display: block;
}

.demo-content {
  max-width: 90%;
  width: 100%;
  margin-top: 60px;
  margin-right: auto;
  margin-left: auto;
}
.demo-content img {
  border: 5px solid #fff;
}
.picture {
  padding: 36px 0;
  border-bottom: 1px solid #dae1ec;
}
.picture:first-child {
  padding-top: 0;
}
.pace {
  pointer-events: none;
  user-select: none;
}
.pace-inactive {
  display: none;
}
.pace .pace-progress {
  background: #f87f3f;
  position: fixed;
  z-index: 2000;
  top: 0;
  right: 100%;
  width: 100%;
  height: 2px;
}
.pace-running .demo-content {
  opacity: 0.5;
}
.pace-running figure {
  pointer-events: none;
}
@media screen and (min-width: 630px) {
  
  .demo-content {
    padding: 10px;
  }
  .picture {
    padding: 0;
    border-bottom: 0;
  }
  .three figure {
    float: left;
    width: 33.33333333%;
  }
  .two figure {
    float: left;
    width: 50%;
  }
}
/*# sourceMappingURL=style.css.map */

.wrapper {
	margin-top: -50px;
}