*, *:before,*:after {
    margin: 0; padding: 0; box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
/* Webkit scrollbar style */
::-webkit-scrollbar {
    width: 9px;
    height: 9px;
    background-color: #fff;
    box-shadow: inset 0 -1px 4px #bbb
}
::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 -1px 4px rgba(0,0,0,.3);
    background-color: #3b4148;
}

/*
.scroll-btn {
    display: block;
    right: 20px;
    background-color: #ABFF4C;
    cursor: pointer;
}

.sb-layer {
    width: 100%;
    height: 100%;
    z-index: 998;
    position: absolute;
    top: 0;
    left: 0;
    background-color: inherit;
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
}

.scroll-btn:hover .sb-layer {
    background-color: #f7f6f5;
}
.scroll-btn i {
    display: block;
    position:absolute;
    top:45%;
    left:50%;
    transform:translate(-50%,-50%);
    z-index:1000;
    font-size: 30px;
}


.click-bubble-container {
    position: relative;
    overflow: hidden;
}

@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}

.scroll-btn.bounce {
    -webkit-animation-play-state: running;
    animation-play-state: running;
    -webkit-animation: bounce 0.5s ease;
    animation: bounce 0.5s ease;
}

@-webkit-keyframes rotateIn {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotateIn {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.scroll-btn.rotate {
    -webkit-animation: rotateIn 1s cubic-bezier(1, -0.75, 0, 1.83);
    animation: rotateIn 1s cubic-bezier(1, -0.75, 0, 1.83);
}

/* -----------------------------
  scroll-btn click animations
----------------------------- */

/*
.click-bubble {
  width: 0%;
  height: 0%;
  position: absolute;
  -webkit-transform: scale(0);
          transform: scale(0);
  opacity: 1;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
}

.scroll-btn.bubble .click-bubble {
  -webkit-animation: bubble 1s ease;
          animation: bubble 1s ease;
}

@-webkit-keyframes bubble {
  100% {
    -webkit-transform: scale(1.6);
            transform: scale(1.6);
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
  }
}

@keyframes bubble {
  100% {
    -webkit-transform: scale(1.6);
            transform: scale(1.6);
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
  }
}

.spread-border {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

.scroll-btn.spread .spread-border {
    -webkit-animation: spread 1s ease;
    animation: spread 1s ease;
}

@-webkit-keyframes spread {
    100% {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0;
        border-width: 0px;
    }
}

@keyframes spread {
    100% {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0;
        border-width: 0px;
    }
}
*/