Cacher is the code snippet organizer for pro developers

<div class="line-animate" style="width: 100%;"></div>

// Waypoints
$(document).ready(function(){

    $('.line-animate').waypoint(function(){
    $('.line-animate').css({
        animation: "animate-positive 2s",
        opacity: "1"
    });
}, { offset: '75%' });
});

.line-animate{
	position: relative;
	background-color: $color__brand-two;
	height:4px;
	width: 0%;
	margin: 40px 0 40px 0;
}

@-webkit-keyframes animate-positive{
    0% { width: 0%; }
}
@keyframes animate-positive{
    0% { width: 0%; }
}