body{
			background:rgba(128,128,128,.2);
		}
		#taiji{
			margin: 50px auto;
			width: 600px;
			height: 600px;
			animation: rotate 3s linear infinite;
			animation-play-state: paused;
		}
		.taiji{
			width: 300px;
			height: 300px;
			border-radius: 50%;
			position: relative;
			margin: 200px auto;
			top:150px;
			background-image: linear-gradient(to right,black 50%, white 50%);
		}
		.taiji::before,.taiji::after{
			content: '';
			position: absolute;
			width: 30px;
			height: 30px;
			border-radius:50%;
			left:50%;
			transform: translateX(-50%);
		}
		.taiji::before{
			background-color: white;
			border: 60px solid black;
			top: 0;
		}
		.taiji::after{
			background-color: black;
			border: 60px solid white;
			bottom: 0;
		}
		.line{
			width: inherit;
			height: inherit;
			transform-origin:50% 50%;
			transition: all 0s;
			position: absolute;
		}
		.line1{
			height: 10px;
			width: 80px;
			background-color: #000000;
			margin: 10px auto;
		}
		.line2{
			display: flex;
			width: 80px;
			margin: 10px auto;
		}
		.line3,.line4{
			height: 10px;
			width: 35px;
			background-color: #000000;
		}
		.line4{
			margin-left: 10px;
		}
		@keyframes rotate{
			0%{
				transform: rotate(0deg);
			}
			100%{
				transform: rotate(360deg);
			}
		}
		#taiji:hover{
			animation-play-state: running;
		}