
.pokeball1, .pokeball2, .pokeball3 {
	position: relative; box-sizing: border-box; background: #DC3D24;
	background: linear-gradient(to bottom, #DC3D24 50%, #FFFFFF 50%);
	height: 512px; width: 512px;
	border-radius: 50%; box-shadow: inset 0 0 0 16px #232B2B; transition: all 500ms ease;
	}
.pokeball1:before, .pokeball1:after, .pokeball2:before, .pokeball2:after, .pokeball3:before, .pokeball3:after { content: ""; position: absolute; }
.pokeball1:after, .pokeball2:after, .pokeball3:after {
	box-sizing: border-box; background: #FFFFFF; border: 16px solid #232B2B;
	box-shadow: inset 0 0 0 12px #FFFFFF, inset 0 0 2px 16px #232B2B; border-radius: 50%;
	height: 128px; width: 128px;
	top: calc(512px/2 - 128px/2); left: calc(512px/2 - 128px/2);
	}
.pokeball1:before, .pokeball2:before, .pokeball3:before { background: #232B2B; height: 32px; width: 100%; top: calc(512px/2 - 32px/2); }
.pokeball1:hover, .pokeball2:hover, .pokeball3:hover { -webkit-transform: rotate(180deg); transform: rotate(180deg); }

.pokeball2 { height: 256px; width: 256px; box-shadow: inset 0 0 0 8px #232B2B; }
.pokeball2:after { border: 8px solid #232B2B; box-shadow: inset 0 0 0 6px #FFFFFF, inset 0 0 1px 8px #232B2B; height: 64px; width: 64px; top: calc(256px/2 - 64px/2); left: calc(256px/2 - 64px/2); }
.pokeball2:before { height: 16px; top: calc(256px/2 - 16px/2); }

.pokeball3 { height: 64px; width: 64px; box-shadow: inset 0 0 0 3px #232B2B; transition: all 500ms ease; }
.pokeball3:after { border: 3px solid #232B2B; box-shadow: inset 0 0 0 3px #FFFFFF, inset 0 0 0 4px #232B2B; height: 22px; width: 22px; top: calc(64px/2 - 22px/2); left: calc(64px/2 - 22px/2); }
.pokeball3:before { height: 4px; top: calc(64px/2 - 4px/2); }
