@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:100,300,400);.arc-container.one-quarter .arc1,
.arc-container.one-third .arc1,
.arc-container.two-thirds .arc1,
.arc-container.three-quarters .arc1,
.arc-container.complete
.arc1{width:160px;height:160px;background:#009bde;-webkit-transform-origin:-31% 61%;margin-left:-30px;margin-top:20px;-webkit-transform:translate(-54px,50px);-moz-transform:translate(-54px,50px);-o-transform:translate(-54px,50px)}.arc-container.complete
.arc1{margin-left:50px}.arc2{width:160px;height:160px;background:#009bde;-webkit-transform:skew(-45deg,0deg);-moz-transform:skew(-45deg,0deg);-o-transform:skew(-45deg,0deg);margin-left:-180px;margin-top:-90px;position:absolute;-webkit-transition:all .5s linear;-moz-transition:all .5s linear;-o-transition:all .5s linear}.arc-container.one-quarter
.arc2{-webkit-transform:skew(0deg,0deg);-moz-transform:skew(0deg,0deg);-o-transform:skew(0deg,0deg)}.arc-container.one-third
.arc2{-webkit-transform:skew(45deg,0deg);-moz-transform:skew(45deg,0deg);-o-transform:skew(45deg,0deg)}.arc-container.two-thirds
.arc2{margin-left:0px;-webkit-transform:skew(-45deg,0deg);-moz-transform:skew(-45deg,0deg);-o-transform:skew(-45deg,0deg)}.arc-container.three-quarters
.arc2{margin-left:0px;-webkit-transform:skew(0deg,0deg);-moz-transform:skew(0deg,0deg);-o-transform:skew(0deg,0deg)}.arc-container.complete
.arc2{margin-left:0px;-webkit-transform:skew(0deg,0deg);-moz-transform:skew(0deg,0deg);-o-transform:skew(0deg,0deg)}.arc-wrapper{width:150px;height:150px;border-radius:150px;background:#424242;overflow:hidden;left:0px;top:0px;position:absolute}.arc-hider{width:150px;height:150px;border-radius:150px;position:absolute;z-index:5;xbox-shadow:inset 0px 0px 20px rgba(0,0,0,0.7)}.arc-inset{font-family:"Josefin Sans";font-weight:100;position:absolute;font-size:413px;margin-top:-114px;z-index:5;left:-28px;line-height:327px;height:280px;-webkit-mask-image:-webkit-linear-gradient(top,rgba(0,0,0,1),rgba(0,0,0,0.2))}.arc-lowerInset{font-family:"Josefin Sans";font-weight:100;position:absolute;font-size:413px;margin-top:-114px;z-index:5;left:-28px;line-height:327px;height:280px;color:white;-webkit-mask-image:-webkit-linear-gradient(top,rgba(0,0,0,0.2),rgba(0,0,0,1))}.arc-overlay{width:100px;height:100px;background-image:linear-gradient(bottom, rgb(217,217,217) 10%, rgb(245,245,245) 90%, rgb(253,253,253) 100%);background-image:-o-linear-gradient(bottom, rgb(217,217,217) 10%, rgb(245,245,245) 90%, rgb(253,253,253) 100%);background-image:-moz-linear-gradient(bottom, rgb(217,217,217) 10%, rgb(245,245,245) 90%, rgb(253,253,253) 100%);background-image:-webkit-linear-gradient(bottom, rgb(217,217,217) 10%, rgb(245,245,245) 90%, rgb(253,253,253) 100%);box-sizing:border-box;-moz-box-sizing:border-box;line-height:100px;font-family:sans-serif;font-weight:400;text-shadow:0 1px 0 #fff;font-size:22px;border-radius:100px;position:absolute;z-index:5;top:25px;left:25px;text-align:center;xbox-shadow:0px 0px 20px rgba(0,0,0,0.7)}.arc-container{position:relative;background:transparent;height:150px;width:150px}