.scroll-nav {
	
  margin-right: -8px;
  margin-top: -105px;
  position: fixed;
  left: 10%;
  top: 50%;
  z-index: 677;
  transition: all 0.2s;
}

.scroll-nav-wrap {
  position: relative;
}

.scroll-nav-wrap::before {
  background: none repeat scroll 0 0 rgba(12, 12, 12, 0.5);
  content: "";
  display: block;
  height: 118%;
  padding: 16px 0;
  position: absolute;
  left: -10px;
  top: -16px;
  width: 36px;
  z-index: 1;
}

.scroll-nav-wrap::after {
  background: none repeat scroll 0 0 rgba(12, 12, 12, 0.5);
  content: "";
  display: block;
  height: 118%;
  opacity: 0;
  padding: 16px 0;
  position: absolute;
  left: 26px;
  top: -16px;
  transition: all 0.3s linear 0s;
  visibility: hidden;
  width: 250px;
  z-index: 1;
}

.scroll-nav-wrap:hover::after {
  opacity: 1;
  visibility: visible;
}

.scroll-nav a {
  background: none repeat scroll 0 0 #dbdbdb;
  border-radius: 50%;
  color: transparent;
  display: block;
  font-size: 0;
  height: 10px;
  margin: 0 auto 16px;
  position: relative;
  text-decoration: none;
  width: 10px;
  z-index: 12;
}

.scroll-nav a:last-child {
  margin-bottom: 0;
}

.scroll-nav a.home {
  background: url("../img/s1.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
  border-radius: 0;
  height: 16px;
  width: 16px;
}

.scroll-nav a.phone {
  background: url("../img/s2.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
  border-radius: 0;
  height: 14px;
  width: 16px;
}

.scroll-nav a.next {
  background: url("../img/s4.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
  bottom: -194px;
  height: 72px;
  left: 50%;
  margin: 0 0 0 -36px;
  position: absolute;
  width: 72px;
}

.scroll-nav a.price {
  background: url("../img/s5.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
  border-radius: 0;
  height: 16px;
  width: 16px;
}

.scroll-nav a.point:hover, .scroll-nav a.point.active {
  background: none repeat scroll 0 0 #fff;
}

.scroll-nav a.home:hover, .scroll-nav a.home.active {
  background-position: 0 -16px;
}


.scroll-nav a.price:hover, .scroll-nav a.price.active {
  background-position: 0 -16px;
}


.scroll-nav a.phone:hover, .scroll-nav a.phone.active {
  background-position: 0 -14px;
}

.scroll-nav a.next:hover, .scroll-nav a.next.active {
  background-position: 0 -72px;
}

.scroll-nav a i {
  color: #dbdbdb;
  display: block;
  font-size: 13px;
  line-height: 14px;
  margin-top: -8px;
  opacity: 0;
  position: absolute;
  left: 22px;
  text-align: left;
  top: 50%;
  transition: all 0.3s linear 0s;
  visibility: hidden;
  width: 205px;
}

.scroll-nav a.home i, .scroll-nav a.phone i {
  right: 25px;
}

.scroll-nav a:hover i, .scroll-nav a.active i {
  color: #fff;
}

.scroll-nav .scroll-nav-wrap:hover a i {
  opacity: 1;
  visibility: visible;
}

.facts-wrap_inner {
  position: relative;
}

.scroll-pin {
  min-width: 1100px;
  position: relative;
  width: 100%;
  z-index: 10;
}

.scroll-pin.fix {
  left: 0;
  position: fixed;
}

.scroll-pin.fix.top {
  bottom: auto;
  top: 0;
}

.scroll-pin.fix.bottom {
  top: 0;
}

.scroll-pin.fix .facts-wrap_inner {
  height: 337px;
}

.facts-wrap li {
  margin-bottom: 380px;
}

.facts-wrap li:last-child {
  margin-bottom: 0;
}

.scroll-pin.fix .facts-wrap li {
  left: 0;
  margin-bottom: 0;
  position: absolute;
  top: 0;
}

@media screen and (max-width: 768px) {
  .scroll-nav {
    margin-right: -8px;
    margin-top: 0;
    position: fixed;
    left: 40px;
    top: 220px;
  }
}