8_ForkingCrazy.html

<div class="container">
	<div class="item">
		<div class="a"></div>
		<div class="b"></div>
	</div>
<style>
	.container {
		background: #6592cf;
		position: fixed;
		height: 300;
		width: 400;
		left: 0;
		top: 0
	}
	.item {
		position: absolute;
		bottom: 50;
		right: 122;
		width: 140;
		height: 140;
		background: #060f55;
		border-radius: 0 0 50% 50%
	}
	.item:before {
		content: '';
		position: absolute;
		top: -50;
		width: 20;
		height: 50;
		background: #060f55;
		box-shadow: 40px 0 0 0 #060f55, 80px 0 0 0 #060f55, 120px 0 0 0 #060f55
	}
	.item:after {
		content: '';
		position: absolute;
		bottom: -50;
		left: 60;
		width: 20;
		height: 52;
		background: #060f55
	}
	.a {
		position: absolute;
		top: -60;
		width: 20;
		height: 20;
		border-radius: 50%;
		background: #060f55;
		box-shadow: 40px 0 0 0 #060f55, 80px 0 0 0 #060f55, 120px 0 0 0 #060f55
	}
	.b {
		position: absolute;
		top: 30;
		left: 20;
		width: 20;
		height: 20;
		border-radius: 50%;
		background: #6592cf;
		box-shadow: 40px 0 0 0 #6592cf, 80px 0 0 0 #6592cf
	}
	.b:after {
		content: '';
		position: absolute;
		top: -90;
		width: 20;
		height: 100;
		background: #6592cf;
		box-shadow: 40px 0 0 0 #6592cf, 80px 0 0 0 #6592cf
	}