@import url('https://fonts.googleapis.com/css?family=Nunito:300,400,600,700&display=swap');
body {
     background: #101010;
     font-family: 'Nunito', sans-serif;
}

.wrap {
     position: absolute;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     overflow: hidden;
}

#ball {
     width: 60px;
     height: 60px;
     background: none;
     border: 1px solid grey;
     border-radius: 50%;
     position: absolute;
     left: 50%;
     top: 50%;
     margin: -10px 0 0 -10px;
     pointer-events: none;
}

/* Next Button */

* {
     box-sizing: border-box;
}

.icon {
     display: block;
     width: 1.5em;
     height: 1.5em;
     margin: 0 auto;
     fill: currentColor;
}

.icon--arrow-right {
     transform: scale3d(-1, -1, 1);
     display: inline-block;
     vertical-align: middle;
     margin-left: 0.5em;
}

.next {
     position: absolute;
     display: flex;
     justify-content: flex-end;
     bottom: 0;
     right: 0;
     font-size: 1.3rem;
}

.next-demo {
     position: relative;
     margin: 1.5em 2em;
     font-weight: bold;
     color: #fff !important;
     text-decoration: none;
}

.next-demo a:hover, .next-demo a:focus {
     color: #42AB9E !important;
}

.hidden {
     width: 0;
     height: 0;
}