* {
				margin: 0;
				padding: 0;
				box-sizing: border-box;
			}
			
			#cricle {
				width: 200px;
				height: 200px;
				margin: 50px auto;
				border-radius: 50%;
				border: 1px solid #999;
				position: relative;
			}
			
			#cricle .left,
			#cricle .right {
				width: 100px;
				height: 200px;
				position: absolute;
				top: 0;
				overflow: hidden;
			}
			
			#cricle .right {
				right: 0;
			}
			
			#cricle .bg {
				width: 100px;
				height: 200px;
				position: absolute;
				overflow: hidden;
			}
			
			#cricle .bg i {
				position: absolute;
				width: 200px;
				height: 200px;
				border: 2px solid #000;
				border-radius: 50%;
				top: 0;
			}
			
			#cricle .left .bg i {
				left: -1px;
			}
			
			#cricle .right .bg i {
				right: -1px;
			}
			
			#cricle .left .bg {
				transform: rotate(-180deg);
				transform-origin: 100% 50%;
			}
			
			#cricle .right .bg {
				transform: rotate(-180deg);
				transform-origin: 0% 50%;
			}
			
			p {
				width: 260px;
				margin: 0 auto;
			}
			
			p input {
				padding: 0 10px;
				width: 130px;
				height: 36px;
			}