body, html {
		position:absolute;
		top:0;
		height:100vh;
		width:100vw;
		margin:0;
		padding:0;
		overflow:hidden;
		background:white;
	}

	.backtopost {
		position:absolute;
		left:50px;
		top:20px;
		line-height:25px;
		font-family:Helvetica;
		font-weight:600;
		text-decoration:none;
		color:#333;
	}

	.backtopost.two {
		top:45px;
	}

	.backtopost img {
		filter:drop-shadow(0 0 2px rgba(0,0,0,0.7));
		-webkit-filter:drop-shadow(0 0 2px rgba(0,0,0,0.7));
		width:20px;
		opacity:1;
		right:-30px;
		position:absolute;
		opacity:0.2;
		transition:opacity 2s ease;
	}

	.backtopost:hover img {
		opacity:1;
	}

	.centertext {
		position:absolute;
		z-index:20;
		font-family:Raleway;
		width:400px;
		font-size:60px;
		color:#BEBEBE;
		text-align:center;
		line-height:60px;
		top:calc(50% - 35px);
		left:calc(50% - 200px);
	}

	.circle {
		padding:0;
		display:block;
		position:absolute;
		vertical-align:middle;
		border-radius:50%;
		will-change:transform;
		transition:.2s all ease;
	}

	.circledown {
		transition:.2s all ease;
		padding:0;
		display:block;
		position:absolute;
		vertical-align:middle;
		border-radius:50%;
		will-change:transform;
		box-sizing:border-box;
	}

	.circledown:after {
		position:absolute;
		content:"brainless developer";
		display:block;
		line-height:26px;
		color:#C5C5C5;
		font-family:Helvetica;
		height:100px;
		top:calc(50% - 13px);
		right:5px;
		background-size:cover;
	}

	#circle1 {
		background:#FFFFFF;
		left:calc(50% - 200px);
		top:calc(50% - 200px);
		width:400px;
		height:400px;
		z-index:10;
	}

	#circle2 {
		background:#FFFFFF;
		left:calc(50% - 350px);
		top:calc(50% - 350px);
		width:700px;
		height:700px;
		z-index:5;
	}

	.controls {
		right:64px;
		bottom:64px;
		padding-left:44px;
		padding-top:20px;
		padding-bottom:30px;
		text-align:left;
		font-family:helvetica;
		font-size:16px;
		color:#333;
		width:200px;
		border-radius:3px;
		background:#FFF;
		position:absolute;
	}

	.divider {
		width:120%;
		margin-left:-21%;
		height:1px;
		margin-bottom:20px;
		margin-top:20px;
		background:#eaebeb;
	}

	.octocat {
		content:"";
		width:240px;
		height:240px;
		position:absolute;
		right:68px;
		bottom:600px;
		pointer-events:none;
		background:url(http://brainlessdeveloper.com/wp-content/uploads/2016/04/social-github.png);
		display:block;
		background-size:cover;
		background-repeat:no-repeat;
		background-position:center center;
	}

	.controls p, .controls label {
		line-height:26px;
		display:block;
	}

	.controls p:first-child {
		margin-top:0;
		width:80%;
		font-size:14px;
		line-height:20px;
		text-align:center;
	}

	.controls p {
		font-weight:600;
	}

	.controls p {
		margin-top:16px;
	}

	.controls input[type=checkbox], .controls input[type=radio] {
		position:absolute;
		margin-top:-21px;
		left:20px;
	}

	.controls input[type=range] {
		width:calc(100% - 50px);
		margin-top:0;
	}