phatograph · December 15, 2015 06:49
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html>
 <head>
 <meta charset=utf-8 />
 <title>Oozou in pure css!</title>
  <style>
    body {
      background: #FFF;
    }
    
    .wrapper {
      width: 300px;
      height: 400px;
      margin: 0 auto;
      position: relative;
    }
    
    .oozou div {
      position: absolute;
      background: #21addf;
      z-index: 10;
    }
    
    #oozou1 {
      width: 55px;
      height: 50px;
      top: 145px;
      left: 70px;
      border-top-left-radius: 70px 70px;
    }
    
    #oozou2 {
      width: 30px;
      height: 25px;
      top: 145px;
      left: 125px;
      border-top-right-radius: 50px 40px;
    }
    
    #oozou3 {
      width: 30px;
      height: 65px;
      top: 170px;
      left: 125px;
      border-bottom-right-radius: 70px 150px;
    }
    
    #oozou4 {
      /* background: #DDD; */
      z-index: 8;
      width: 80px;
      height: 100px;
      top: 145px;
      left: 125px;
    }
    
    #oozou5 {
      background: #FFF;
      z-index: 9;
      width: 50px;
      height: 80px;
      top: 145px;
      left: 120px;
      border-bottom-right-radius: 80px 150px;
    }
    
    #oozou6 {
      width: 50px;
      height: 45px;
      top: 145px;
      left: 195px;
      border-top-right-radius: 40px 40px;
    }
    
    #oozou7 {
      width: 40px;
      height: 115px;
      top: 190px;
      left: 205px;
    }
    
    #oozou8 {
      width: 40px;
      height: 20px;
      top: 305px;
      left: 205px;
      border-bottom-right-radius: 80px 40px;
      border-bottom-left-radius: 80px 40px;
    }
    
    #oozou9 {
      width: 80px;
      height: 40px;
      top: 245px;
      left: 125px;
    }
    
    #oozou10 {
      width: 40px;
      height: 45px;
      top: 270px;
      left: 105px;
    }
    
    #oozou11 {
      width: 40px;
      height: 20px;
      top: 305px;
      left: 105px;
      border-bottom-right-radius: 80px 40px;
      border-bottom-left-radius: 80px 40px;
    }
    
    #oozou12 {
      width: 55px;
      height: 75px;
      top: 195px;
      left: 70px;
    }
    
    #oozou13 {
      width: 40px;
      height: 15px;
      top: 265px;
      left: 70px;
      border-bottom-right-radius: 80px 30px;
    }
    
    #oozou14 {
      width: 40px;
      height: 50px;
      top: 230px;
      left: 30px;
      border-bottom-left-radius: 100px 120px;
    }
    
    #oozou15 {
      width: 30px;
      height: 30px;
      top: 200px;
      left: 30px;
      /* border-bottom-left-radius: 120px 120px; */
    }
    
    #oozou16 {
      background: #FFF;
      width: 60px;
      height: 10px;
      top: 280px;
      left: 145px;
      border-top-left-radius: 5px 5px;
      border-top-right-radius: 5px 5px;
    }
    
    #oozou17 {
      z-index: 8;
      width: 30px;
      height: 30px;
      top: 190px;
      left: 235px;
      border-bottom-left-radius: 40px 20px;
    }
    
    #oozou18 {
      background: #FFF;
      z-index: 9;
      width: 30px;
      height: 40px;
      top: 181px;
      left: 245px;
      border-bottom-left-radius: 60px 60px;
    }
    
    #oozou19 {
      background: #FFF;
      z-index: 11;
      width: 15px;
      height: 7px;
      top: 191px;
      left: 95px;
      border-top-left-radius: 60px 60px;
      border-top-right-radius: 60px 60px;
    }
    
    #oozou20 {
      background: #FFF;
      z-index: 11;
      width: 10px;
      height: 10px;
      top: 230px;
      left: 60px;
      border-bottom-left-radius: 60px 60px;
      border-bottom-right-radius: 60px 60px;
    }
    
    #oozou21 {
      width: 10px;
      height: 20px;
      top: 145px;
      left: 160px;
    }
    
    #oozou22 {
      background: #FFF;
      width: 9px;
      height: 20px;
      top: 145px;
      left: 160px;
      border-top-right-radius: 10px 15px;
      border-bottom-right-radius: 2px 2px;
    }
  </style>
 </head>
 <body>
  <div class="wrapper">
    <div id="oozou" class="oozou">
      <div id="oozou1"></div>
      <div id="oozou2"></div>
      <div id="oozou3"></div>
      <div id="oozou4"></div>
      <div id="oozou5"></div>
      <div id="oozou6"></div>
      <div id="oozou7"></div>
      <div id="oozou8"></div>
      <div id="oozou9"></div>
      <div id="oozou10"></div>
      <div id="oozou11"></div>
      <div id="oozou12"></div>
      <div id="oozou13"></div>
      <div id="oozou14"></div>
      <div id="oozou15"></div>
      <div id="oozou16"></div>
      <div id="oozou17"></div>
      <div id="oozou18"></div>
      <div id="oozou19"></div>
      <div id="oozou20"></div>
      <div id="oozou21"></div>
      <div id="oozou22"></div>
    </div>
  </div>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset=utf-8 />
	<title>Oozou in pure css!</title>
	<style>
	body {
	background: #FFF;
	}

	.wrapper {
	width: 300px;
	height: 400px;
	margin: 0 auto;
	position: relative;
	}

	.oozou div {
	position: absolute;
	background: #21addf;
	z-index: 10;
	}

	#oozou1 {
	width: 55px;
	height: 50px;
	top: 145px;
	left: 70px;
	border-top-left-radius: 70px 70px;
	}

	#oozou2 {
	width: 30px;
	height: 25px;
	top: 145px;
	left: 125px;
	border-top-right-radius: 50px 40px;
	}

	#oozou3 {
	width: 30px;
	height: 65px;
	top: 170px;
	left: 125px;
	border-bottom-right-radius: 70px 150px;
	}

	#oozou4 {
	/* background: #DDD; */
	z-index: 8;
	width: 80px;
	height: 100px;
	top: 145px;
	left: 125px;
	}

	#oozou5 {
	background: #FFF;
	z-index: 9;
	width: 50px;
	height: 80px;
	top: 145px;
	left: 120px;
	border-bottom-right-radius: 80px 150px;
	}

	#oozou6 {
	width: 50px;
	height: 45px;
	top: 145px;
	left: 195px;
	border-top-right-radius: 40px 40px;
	}

	#oozou7 {
	width: 40px;
	height: 115px;
	top: 190px;
	left: 205px;
	}

	#oozou8 {
	width: 40px;
	height: 20px;
	top: 305px;
	left: 205px;
	border-bottom-right-radius: 80px 40px;
	border-bottom-left-radius: 80px 40px;
	}

	#oozou9 {
	width: 80px;
	height: 40px;
	top: 245px;
	left: 125px;
	}

	#oozou10 {
	width: 40px;
	height: 45px;
	top: 270px;
	left: 105px;
	}

	#oozou11 {
	width: 40px;
	height: 20px;
	top: 305px;
	left: 105px;
	border-bottom-right-radius: 80px 40px;
	border-bottom-left-radius: 80px 40px;
	}

	#oozou12 {
	width: 55px;
	height: 75px;
	top: 195px;
	left: 70px;
	}

	#oozou13 {
	width: 40px;
	height: 15px;
	top: 265px;
	left: 70px;
	border-bottom-right-radius: 80px 30px;
	}

	#oozou14 {
	width: 40px;
	height: 50px;
	top: 230px;
	left: 30px;
	border-bottom-left-radius: 100px 120px;
	}

	#oozou15 {
	width: 30px;
	height: 30px;
	top: 200px;
	left: 30px;
	/* border-bottom-left-radius: 120px 120px; */
	}

	#oozou16 {
	background: #FFF;
	width: 60px;
	height: 10px;
	top: 280px;
	left: 145px;
	border-top-left-radius: 5px 5px;
	border-top-right-radius: 5px 5px;
	}

	#oozou17 {
	z-index: 8;
	width: 30px;
	height: 30px;
	top: 190px;
	left: 235px;
	border-bottom-left-radius: 40px 20px;
	}

	#oozou18 {
	background: #FFF;
	z-index: 9;
	width: 30px;
	height: 40px;
	top: 181px;
	left: 245px;
	border-bottom-left-radius: 60px 60px;
	}

	#oozou19 {
	background: #FFF;
	z-index: 11;
	width: 15px;
	height: 7px;
	top: 191px;
	left: 95px;
	border-top-left-radius: 60px 60px;
	border-top-right-radius: 60px 60px;
	}

	#oozou20 {
	background: #FFF;
	z-index: 11;
	width: 10px;
	height: 10px;
	top: 230px;
	left: 60px;
	border-bottom-left-radius: 60px 60px;
	border-bottom-right-radius: 60px 60px;
	}

	#oozou21 {
	width: 10px;
	height: 20px;
	top: 145px;
	left: 160px;
	}

	#oozou22 {
	background: #FFF;
	width: 9px;
	height: 20px;
	top: 145px;
	left: 160px;
	border-top-right-radius: 10px 15px;
	border-bottom-right-radius: 2px 2px;
	}
	</style>
	</head>
	<body>
	<div class="wrapper">
	<div id="oozou" class="oozou">
	<div id="oozou1"></div>
	<div id="oozou2"></div>
	<div id="oozou3"></div>
	<div id="oozou4"></div>
	<div id="oozou5"></div>
	<div id="oozou6"></div>
	<div id="oozou7"></div>
	<div id="oozou8"></div>
	<div id="oozou9"></div>
	<div id="oozou10"></div>
	<div id="oozou11"></div>
	<div id="oozou12"></div>
	<div id="oozou13"></div>
	<div id="oozou14"></div>
	<div id="oozou15"></div>
	<div id="oozou16"></div>
	<div id="oozou17"></div>
	<div id="oozou18"></div>
	<div id="oozou19"></div>
	<div id="oozou20"></div>
	<div id="oozou21"></div>
	<div id="oozou22"></div>
	</div>
	</div>
	</body>
	</html>