Cacher is the code snippet organizer for pro developers

.scroll-up
		a(href='#!')

.scroll-up
	overflow: hidden
	border-radius: 50%
	transform: rotate(180deg)
	position: absolute
	bottom: 5vh
	left: 50%
	border: 2px solid #fff
	width: 100px
	height: 100px
	margin-left: -48px
	margin-top: -50px
	+lg
		left: auto
		bottom: 50px
		right: 20px
		width: 70px
		height: 70px
	a
		border-radius: 50%
		display: block
		opacity: 0
		-moz-transition: all 0.4s ease
		-o-transition: all 0.4s ease
		-webkit-transition: all 0.4s ease
		transition: all 0.4s ease
		line-height: 0
		font-size: 0
		color: transparent
		margin-left: auto
		margin-right: auto
		width: 100%
		height: 100%
		-moz-background-size: 0 auto
		-o-background-size: 0 auto
		-webkit-background-size: 0 auto
		background-size: 0 auto
		-webkit-animation: pulse 1.5s 0s infinite normal ease forwards
		-moz-animation: pulse 1.5s 0s infinite normal ease forwards
		-o-animation: pulse 1.5s 0s infinite normal ease forwards
		animation: pulse 1.5s 0s infinite normal ease forwards
		background-image: url("https://jamesmuspratt.com/codepen/img/arrow-down.svg")
		background-repeat: no-repeat
		&:before, &:after
			content: " "
			position: absolute
			top: 0
			left: 0
			display: block
			width: 100%
			height: 100%
			background: url("https://jamesmuspratt.com/codepen/img/arrow-down.svg") no-repeat center top
			-moz-background-size: 100% auto
			-o-background-size: 100% auto
			-webkit-background-size: 100% auto
			background-size: 100% auto
		&:before
			-webkit-animation: pulse 1.5s 0.25s infinite normal ease forwards
			-moz-animation: pulse 1.5s 0.25s infinite normal ease forwards
			-o-animation: pulse 1.5s 0.25s infinite normal ease forwards
			animation: pulse 1.5s 0.25s infinite normal ease forwards
		&:after
			-webkit-animation: pulse 1.5s 0.5s infinite normal ease forwards
			-moz-animation: pulse 1.5s 0.5s infinite normal ease forwards
			-o-animation: pulse 1.5s 0.5s infinite normal ease forwards
			animation: pulse 1.5s 0.5s infinite normal ease forwards
		&:hover
			background-color: #3d8af7

@keyframes pulse
	0%
		opacity: 0
		background-position: center top
		-moz-background-size: 0 auto
		-o-background-size: 0 auto
		-webkit-background-size: 0 auto
		background-size: 0 auto
	
	10%
		opacity: 0
	
	50%
		opacity: 1
		-moz-background-size: 75% auto
		-o-background-size: 75% auto
		-webkit-background-size: 75% auto
		background-size: 75% auto
	
	90%
		opacity: 0
	
	100%
		opacity: 0
		background-position: center bottom
		-moz-background-size: 0 auto
		-o-background-size: 0 auto
		-webkit-background-size: 0 auto
		background-size: 0 auto