css绘制一副蒙拉丽莎黑白照片效果代码

代码语言:html

所属分类:布局界面

代码描述:css绘制一副蒙拉丽莎黑白照片效果代码

代码标签: css 蒙拉丽莎 黑白 照片

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        html,
        body {
          width: 100%;
          height: 100%;
          background: #fff;
          overflow: hidden;
        }
        html *,
        body * {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          margin: auto;
          box-sizing: border-box;
        }
        html *:before, html *:after,
        body *:before,
        body *:after {
          content: "";
          position: absolute;
        }
        
        .hair-1 {
          width: 19.2vmin;
          height: 10vmin;
          background: #000;
          top: -85vmin;
          left: 4.9vmin;
          border-radius: 50% 100% 0 0;
        }
        .hair-1::before {
          width: 12.5vmin;
          height: 4vmin;
          background: #000;
          left: 3.1vmin;
          transform: rotate(7.5deg);
          border-radius: 50%;
        }
        .hair-1::after {
          width: 6vmin;
          height: 1vmin;
          background: #000;
          top: 1.3vmin;
          left: 11.2vmin;
          transform: rotate(25deg);
          border-radius: 50%;
        }
        .hair-2 {
          width: 15vmin;
          height: 40vmin;
          background: #000;
          top: -54vmin;
          left: 15vmin;
          transform: rotate(-3.5deg);
          border-radius: 0 11.5vmin 0 0;
        }
        .hair-2::before {
          width: 20vmin;
          height: 15vmin;
          background: #000;
          top: 33vmin;
          left: 1vmin;
        }
        .hair-2::after {
          width: 10vmin;
          height: 11vmin;
          background: #fff;
          top: 32.9vmin;
          left: 15.5vmin;
          transform: rotate(-5deg);
          border-radius: 0 0 0 100%;
        }
        .hair-3 {
          width: 6vmin;
          height: 2vmin;
          background: #fff;
          top: -29vmin;
          left: 37.7vmin;
          transform: skewX(9deg);
          border-radius: 0.4vmin 0 0 0.2vmin;
        }
        .hair-3::before {
          width: 0.5vmin;
          height: 3vmin;
          background: #fff;
          top: -0.2vmin;
          left: -0.1vmin;
          border-radius: 50%;
        }
        .hair-3::after {
          width: 5vmin;
          height: 1.5vmin;
          background: #fff;
          top: 8.45vmin;
          left: 2vmin;
          transform: rotate(38deg);
          border-radius: 50%;
        }
        .hair-4 {
          width: 3.4vmin;
          height: 9.5vmin;
          background: #000;
          top: -85.5vmin;
          left: -14.2vmin;
          transform: rotate(40deg);
          border-radius: 50%;
        }
        .hair-4::before {
          width: 5vmin;
          height: 5.2vmin;
          background: #000;
          top: 5.6vmin;
          left: 0.25vmin;
          border-radius: 50%;
        }
        .hair-4::after {
          width: 4vmin;
          height: 6vmin;
          background: #000;
          top: 9.1vmin;
          left: 1.85vmin;
          border-radius: 50%;
        }
        .hair-5 {
          width: 3vmin;
          height: 4vmin;
          background: #000;
          top: -75vmin;
          left: -19.1vmin;
          transform: rotate(22deg);
        }
        .hair-5::before {
          width: 1vmin;
          height: 1.2vmin;
          background: #fff;
          top: 1.5vmin;
          left: -0.9vmin;
          border-radius: 50%;
        }
        .hair-5::after {
          width: 3vmin;
          height: 6vmin;
          background: #000;
          top: 5vmin;
          left: 0.95vmin;
          transform: rotate(15deg);
          border-radius: 0 0 0 22%;
        }
        .hair-6 {
          width: 2vmin;
          height: 3vmin;
          background: #000;
          top: -65.5vmin;
          left: -22.4vmin;
        }
        .hair-6::before {
          width: 1vmin;
          height: 1.8vmin;
          background: #fff;
          top: 0.4vmin;
          left: -0.9vmin;
          border-radius: 50%;
        }
        .hair-6::after {
          width: 3vmin;
          height: 6vmin;
          background: #000;
          top: 4.9vmin;
          left: -1.85vmin;
          transform: rotate(32deg);
          border-radius: 0 0 0 32%;
        }
        .hair-7 {
          width: 3vmin;
          height: 4vmin;
          background: #000;
          top: -58vmin;
          left: -24vmin;
          border-radius: 30% 0 0 0;
        }
        .hair-7::before {
          width: 1.1vmin;
          height: 3vmin;
          background: #fff;
          top: 0.6vmin;
          left: -0.9vmin;
          transform: rotate(-4deg);
          border-radius: 50%;
        }
        .hair-7::after {
          width: 3vmin;
          height: 6vmin;
          background: #000;
          top: 6.1vmin;
          left: -1.2vmin;
          transform: rotate(18deg);
          border-radius: 0 0 0 20%;
        }
        .hair-8 {
          width: 3vmin;
          height: 3vmin;
          background: #000;
          top: -48vmin;
          left: -26.5vmin;
          border-radius: 20% 0 0 0;
        }
        .hair-8::before {
          width: 1vmin;
          height: 1.9vmin;
          background: #fff;
          top: 1.65vmin;
          left: -0.75vmin;
          transform: rotate(-5deg);
          border-radius: 50%;
        }
        .hair-8::after {
          width: 10vmin;
          height: 13.85vmin;
          background: #000;
          top: -5vmin;
          left: 2vmin;
        }
        .hair-9 {
          width: 3vmin;
          height: 4vmin;
          background: #000;
          top: -33.9vmin;
          left: -24.8vmin;
          transform: rotate(4deg);
          border-radius: 0 0 0 20%;
        }
        .hair-9::before {
          width: 3vmin;
          height: 4.2vmin;
          background: #000;
          top: -2.2vmin;
          left: -1.05vmin;
          transform: rotate(-32deg);
          border-radius: 22% 0 0 0;
        }
        .hair-9::after {
          width: 0.8vmin;
          height: 3vmin;
          background: #fff;
          top: -0.4vmin;
          left: -1.3vmin;
          transform: rotate(-35deg);
          border-radius: 50%;
        }
        .hair-10 {
          width: 3vmin;
          height: 2vmin;
          background: #000;
          top: -22.8vmin;
          left: -24.6vmin;
          transform: rotate(-35deg);
          border-radius: 80% 0 0 0;
        }
        .hair-10::before {
          width: 3vmin;
          height: 4vmin;
          background: #000;
          top: -3vmin;
          left: 2.2vmin;
          transform: rotate(22deg);
        }
        .hair-10::after {
          width: 1vmin;
          height: 2.9vmin;
          background: #fff;
          top: -2.7vmin;
          left: 1.45vmin;
          transform: rotate(19deg);
          border-radius: 50%;
        }
        .hair-11 {
          width: 2vmin;
          height: 3.5vmin;
          background: #000;
          top: -18vmin;
          left: -24.8vmin;
          transform: rotate(15deg);
        }
        .hair-11::before {
          width: 1vmin;
          height: 2.7vmin;
          background: #fff;
          top: 0.85vmin;
          left: -0.7vmin;
          border-radius: 50%;
        }
        .hair-11::after {
          width: 10vmin;
          height: 2vmin;
          background: #000;
          top: -2.4vmin;
          transform: rotate(-53.5deg);
          border-radius: 0 0 10% 0;
        }
        .hair-12 {
          width: 4vmin;
          height: 1.5vmin;
          background: #000;
          top: -30vmin;
          left: -8.8vmin;
          transform: rotate(63deg);
          border-radius: 50%;
        }
        .hair-12::before {
          width: 3vmin;
          height: 2vmin;
          background: #000;
          top: -0.1vmin;
          left: 0.1vmin;
          transform: rotate(15deg);
        }
        .hair-12::after {
          width: 1vmin;
          height: 2vmin;
          background: #000;
          top: -1vmin;
          transform: rotate(-5deg);
        }
        .hair-13 {
          width: 1.3vmin;
          height: 2.2vmin;
          background: #fff;
          top: -31.4vmin;
          left: -6.15vmin;
          transform: rotate(-40deg);
          border-radius: 50%;
        }
        .hair-13::before {
          width: 10vmin;
          height: 5vmin;
          background: #000;
          top: -3vmin;
          left: -10vmin;
          border-radius: 45% 40% 30% 0;
        }
        .hair-13::after {
          width: 5vmin;
          height: 5vmin;
          background: #000;
          top: -5vmin;
          left: -6vmin;
        }
        .hair-14 {
          width: 4vmin;
          height: 2vmin;
          background: #000;
          top: -34.8vmin;
          left: -5.1vmin;
          transform: rotate(16deg);
        }
        .hair-14::before {
          width: 6vmin;
          height: 4vmin;
          background: #000;
          top: -1vmin;
          left: 2vmin;
          transform: rotate(10deg);
          border-radius: 50%;
        }
        .hair-14::after {
          width: 4vmin;
          height: 2vmin;
          background: #000;
          left: 0.2vmin;
          transform: rotate(20deg);
        }
        .hair-15 {
          width: 1.8vmin;
          height: 1vmin;
          background: #fff;
          top: -32.1vmin;
          left: -6.15vmin;
          transform: rotate(25deg);
          border-radius: 50%;
        }
        .hair-15::before {
          width: 1vmin;
          height: 1.5vmin;
          background: #000;
          top: 10vmin;
          left: -2.1vmin;
          transform: rotate(-30deg);
          border-radius: 0 0 30% 0;
        }
        .hair-15::after {
          width: 1.3vmin;
          height: 2vmin;
          background: #000;
          top: 10.8vmin;
          left: -2.75vmin;
          transform: rotate(30deg);
        }
        .hair-16 {
          width: 1vmin;
          height: 2vmin;
          background: #000;
          top: -17vmin;
          left: -19.3vmin;
          transform: rotate(5deg);
        }
        .hair-16::before {
          width: 0.6vmin;
          height: 1.8vmin;
          background: #fff;
          top: 0.7vmin;
          left: 1vmin;
          transform: rotate(-8deg) skewX(2deg);
          border-radius: 50%;
        }
        .hair-16::after {
          width: 1vmin;
          height: 1.2vmin;
          background: #000;
          top: 3.8vmin;
          left: -0.45vmin;
          border-radius: 50%;
        }
        .hair-17 {
          width: 1vmin;
          height: 1.5vmin;
          background: #000;
          top: -11.5vmin;
          left: -21.5vmin;
          transform: rotate(-10deg);
        }
        .hair-17::before {
          width: 1vmin;
          height: 1vmin;
          background: #fff;
          left: 0.85vmin;
          border-radius: 50%;
        }
        .hair-17::after {
          width: 3vmin;
          height: 4vmin;
          background: #000;
          top: -2.1vmin;
          left: -2.2vmin;
          transform: rotate(25deg);
        }
        .hair-18 {
          width: 2.2vmin;
          height: 1.5vmin;
          background: #000;
          top: -10vmin;
          left: -22vmin;
          transform: rotate(-30deg);
          border-radius: 0 30% 40% 0;
        }
        .hair-18::before {
          width: 1vmin;
          height: 1.7vmin;
          background: #000;
          top: 0.2vmin;
          left: -0.2vmin;
          transform: rotate(-24deg);
          border-radius: 0 0 50% 0;
        }
        .hair-18::after {
          width: 1vmin;
          height: 1vmin;
          background: #fff;
          top: 1.35vmin;
          left: 0.3vmin;
          border-radius: 50%;
        }
        .hair-19 {
          width: 0.8vmin;
          height: 1.8vmin;
          background: #000;
          top: -5.1vmin;
          left: -22.4vmin;
          transform: rotate(45deg);
          border-radius: 50%;
        }
        .hair-19::before {
          width: 1.3vmin;
          height: 1.1vmin;
          background: #000;
          top: -0.1vmin;
          left: -0.6vmin;
          border-radius: 50%;
        }
        .hair-19::after {
          width: 0.35vmin;
          height: 1vmin;
          background: #000;
          top: -0.4vmin;
          left: -0.8vmin;
          transform: rotate(-40deg);
        }
        .hair-20 {
          width: 1vmin;
          height: 1.5vmin;
          background: #fff;
          top: -4.5vmin;
          left: -23.8vmin;
          transform: rotate(40deg);
          border-radius: 50%;
        }
        .hair-20::before {
          width: 0.3vmin;
          height: 0.5vmin;
          background: #fff;
          top: -0.7vmin;
          left: -0.35vmin;
          border-radius: 50%;
        }
        .hair-20::after {
          width: 1.6vmin;
          height: 2vmin;
          background: #000;
          top: -0.85vmin;
          left: -2.25vmin;
          border-radius: 50%;
        }
        .hair-21 {
          width: 8vmin;
          height: 16vmin;
          background: #fff;
          top: -12.8vmin;
          left: 2vmin;
        }
        .hair-21::before {
          width: 5vmin;
          height: 1vmin;
          background: #fff;
          top: -0.6vmin;
          left: 4.4vmin;
          transform: rotate(-23deg);
          border-radius: 50%;
        }
        .hair-21::after {
          width: 2.3vmin;
          height: 0.5vmin;
          background: #000;
          top: -0.4vmin;
          left: 3.3vmin;
          transform: rotate(3deg);
          border-radius: 50%;
        }
        .hair-22 {
          width: 2vmin;
          height: 1vmin;
          background: #fff;
          top: -30vmin;
          left: 11.2vmin;
          transform: rotate(-35deg);
        }
        .hair-22::before {
          width: 1.5vmin;
          height: 0.7vmin;
          background: #fff;
          top: -0.15vmin;
          left: 1.2vmin;
          transform: rotate(-20deg);
          border-radius: 0 0 100% 0;
        }
        .hair-22::after {
          width: 1.5vmin;
          height: 1.5vmin;
          background: #fff;
          top: -0.1vmin;
          left: 1.2vmin;
          transform: rotate(-10deg);
          border-radius: 0 0 100% 0;
        }
        .hair-23 {
          width: 2.8vmin;
          height: 2vmin;
          background: #fff;
          top: -28vmin;
          left: 10.5vmin;
          border-radius: 50% 0 0 0;
        }
        .hair-23::before {
          width: 2vmin;
          height: 2vmin;
          background: #000;
          top: -5vmin;
          left: -5vmin;
        }
        .hair-23::after {
          width: 2vmin;
          height: 2vmin;
          background: #fff;
          top: 0.4vmin;
          left: 1vmin;
          transform: rotate(30deg);
        }
        .hair-24 {
          width: 2vmin;
          height: 1vmin;
          background: #fff;
          top: -27.3vmin;
          left: 13.8vmin;
          transform: rotate(20deg);
          border-radius: 2vmin;
        }
        .hair-24::before {
          width: 3vmin;
          height: 2vmin;
          background: #fff;
          top: 0.5vmin;
          left: -1vmin;
          transform: rotate(-20deg);
          border-radius: 0 30% 0 0;
        }
        .hair-24::after {
          width: 1.5vmin;
          height: 0.5vmin;
          background: #fff;
          top: 1.2vmin;
          left: 1.2vmin;
          transform: rotate(28deg) skewX(-25deg);
        }
        .hair-25 {
          width: 2.5vmin;
          height: 3vmin;
          background: #fff;
          top: -22.5vmin;
          left: 11.9vmin;
          transform: rotate(30deg);
        }
        .hair-25::before {
          width: 2vmin;
          height: 0.6vmin;
          background: #fff;
          top: 0.55vmin;
          left: 1.45vmin;
          transform: rotate(10deg);
          border-radius: 0 0 50% 0;
        }
        .hair-25::after {
          width: 2vmin;
          height: 2vmin;
          background: #fff;
          top: 0.9vmin;
          left: 1.35vmin;
          transform: skewX(2deg);
        }
        .hair-26 {
          width: 2vmin;
          height: 1vmin;
          background: #fff;
          top: -20vmin;
          left: 14.4vmin;
          transform: rotate(30deg);
          border-radius: 50%;
        }
        .hair-26::before {
          width: 4vmin;
          height: 1.5vmin;
          background: #fff;
          top: 0.8vmin;
          left: -2.2vmin;
          transform: skewX(5deg);
        }
        .hair-26::after {
          width: 2vmin;
          height: 1.2vmin;
          background: #fff;
          top: 1.3vmin;
          left: 0.45vmin;
          border-radius: 50%;
        }
        .hair-27 {
          width: 4vmin;
          height: 3vmin;
          background: #fff;
          top: -16vmin;
          left: 11vmin;
          transform: rotate(23deg);
          border-radius: 0 20% 0 0;
        }
        .hair-27::before {
          width: 2vmin;
          height: 4vmin;
          background: #fff;
          top: 1.5vmin;
          left: 2.9vmin;
          transform: rotate(-15deg);
          border-radius: 50%;
        }
        .hair-27::after {
          width: 4vmin;
          height: 5.5vmin;
          background: #fff;
          top: 2.5vmin;
          left: 0.7vmin;
          transform: rotate(-20deg);
        }
        .hair-28 {
          width: 1.5vmin;
          height: 1.5vmin;
          background: #fff;
          top: -9.1vmin;
          left: 13.8vmin;
          transform: rotate(40deg);
          border-radius: 0 20% 0 0;
        }
        .hair-28::before {
          width: 2vmin;
          height: 3vmin;
          background: #fff;
          top: 0.4vmin;
          left: -0.2vmin;
          transform: rotate(-40deg);
          border-radius: 0 0 30% 0;
        }
        .hair-28::after {
          width: 0.5vmin;
          height: 1.2vmin;
          background: #000;
          left: 1.35vmin;
          transform: rotate(5deg);
          border-radius: 50%;
        }
        .hair-29 {
          width: 3vmin;
          height: 6vmin;
          background: #fff;
          top: -1.7vmin;
          left: 9.25vmin;
          transform: rotate(45deg);
          border-radius: 0 30% 0 0;
        }
        .hair-29::before {
          width: 0.8vmin;
          height: 0.6vmin;
          background: #fff;
          top: -0.2vmin;
          left: 1.6vmin;
          border-radius: 50%;
        }
        .hair-29::after {
          width: 1vmin;
          height: 2vmin;
          background: #000;
          top: -0.5vmin;
          left: 2.4vmin;
          transform: rotate(-22deg);
          border-radius: 50%;
        }
        
        .face-1 {
          width: 10vmin;
          height: 10vmin;
          background: #fff;
          top: -75vmin;
          left: -10vmin;
          transform: rotate(3deg);
          border-radius: 40% 22% 0 0;
        }
        .face-1::before {
          width: 6vmin;
          height: 6vmin;
          background: #fff;
          left: 5vmin;
          transform: skewX(20deg);
          border-radius: 0 40% 0 0;
        }
        .face-1::after {
          width: 0.25vmin;
          height: 3vmin;
          background: #fff;
          top: -1.5vmin;
          left: 6.5vmin;
          transform: rotate(-49deg);
          border-radius: 1vmin;
        }
        .face-2 {
          width: 1.7vmin;
          height: 0.4vmin;
          background: #000;
          top: -86vmin;
          left: -6.8vmin;
          transform: rotate(40deg);
          border-radius: 50%;
        }
        .face-2::before {
          width: 4vmin;
          height: 5.2vmin;
          background: #fff;
          top: 1.9vmin;
          left: -2.25vmin;
          transform: rotate(20deg);
          border-radius: 50%;
        }
        .face-2::after {
          width: 2vmin;
          height: 3vmin;
          background: #fff;
          top: 0.4vmin;
          left: -0.5vmin;
          transform: rotate(10deg) skewX(-10deg);
        }
        .face-3 {
          width: 3vmin;
          height: 0.5vmin;
          background: #000;
          top: -85.2vmin;
          left: -14.8vmin;
          transform: rotate(-13deg);
        }
        .face-3::before {
          width: 3vmin;
          height: 1vmin;
          background: #fff;
          top: 0.5vmin;
          left: 1.3vmin;
        }
        .face-3::after {
          width: 1.2vmin;
          height: 0.5vmin;
          background: #000;
          left: 3.6vmin;
          transform: rotate(-10deg);
          border-radius: 50%;
        }
        .face-4 {
          width: 11vmin;
          height: 18vmin;
          background: #fff;
          top: -58.6vmin;
          left: -9.8vmin;
          transform: rotate(2deg);
          border-radius: 20% 0 0 50%;
        }
        .face-4::before {
          width: 10vmin;
          height: 5.2vmin;
          background: #fff;
          top: 13.7vmin;
          left: 0.15vmin;
          transform: rotate(45deg);
          border-radius: 50%;
        }
        .face-4::after {
          width: 5vmin;
          height: 1vmin;
          background: #fff;
          top: 17.4vmin;
          left: 1.25vmin;
          transform: rotate(42.5deg);
          border-radius: 50%;
        }
        .face-5 {
          width: 0.9vmin;
          height: 3vmin;
          background: #fff;
          top: -44.7vmin;
          left: -16.7vmin;
          transform: rotate(-23deg);
          border-radius: 50%;
        }
        .face-5::before {
          width: 8.5vmin;
          height: 5vmin;
          background: #fff;
          top: 3.1vmin;
          left: 1.7vmin;
          transform: rotate(-13deg);
          border-radius: 0 0 30% 45%;
        }
        .face-5::after {
          width: 1vmin;
          height: 3.5vmin;
          background: #fff;
          top: 4vmin;
          left: 1.4vmin;
          transform: rotate(-20deg);
          border-radius: 50%;
        }
        .face-6 {
          width: 5vmin;
          height: 1vmin;
          background: #fff;
          top: -39vmin;
          left: 0.4vmin;
          transform: rotate(-37deg);
          border-radius: 50%;
        }
        .face-6::before {
          width: 4vmin;
          height: 6vmin;
          background: #fff;
          top: -5vmin;
          left: 3vmin;
          transform: rotate(35deg);
          border-radius: 0 0 45% 0;
        }
        .face-6::after {
          width: 9vmin;
          height: 3.6vmin;
          background: #fff;
          top: -7.35vmin;
          left: 5.6vmin;
          transform: rotate(-10deg);
          border-radius: 50%;
        }
        .face-7 {
          width: 2vmin;
          height: 3vmin;
          background: #fff;
          top: -53vmin;
          left: 4vmin;
          transform: rotate(24deg);
        }
        .face-7::before {
          width: 1vmin;
          height: 2.25vmin;
          background: #000;
          top: 0.2vmin;
          left: 1.8vmin;
          transform: rotate(1deg);
          border-radius: 50%;
        }
        .face-7::after {
          width: 2.1vmin;
          height: 4.5vmin;
          background: #fff;
          top: -5vmin;
          left: 0.9vmin;
          transform: rotate(10deg);
          border-radius: 50%;
        }
        .face-8 {
          width: 5vmin;
          height: 1vmin;
          background: #fff;
          top: -56.5vmin;
          left: 7.7vmin;
          transform: rotate(-46deg);
          border-radius: 50%;
        }
        .face-8::before {
          width: 5vmin;
          height: 3vmin;
          background: #fff;
          top: -4vmin;
          transform: rotate(46deg);
        }
        .face-8::after {
          width: 3.9vmin;
          height: 2.6vmin;
          background: #fff;
          top: -5vmin;
          left: 5.7vmin;
          transform: rotate(-40deg) skewY(-1deg);
          border-radius: 50%;
        }
        .face-9 {
          width: 2vmin;
          height: 5vmin;
          background: #000;
          top: -70vmin;
          left: 13.25vmin;
        }
        .face-9::before {
          width: 2vmin;
          height: 3vmin;
          background: #000;
          left: -0.05vmin;
          transform: rotate(-5deg);
        }
        .face-9::after {
          width: 2vmin;
          height: 3vmin;
          background: #000;
          top: 2vmin;
          left: -0.05vmin;
          transform: rotate(6deg);
        }
        .face-10 {
          width: 5vmin;
          height: 2vmin;
          background: #fff;
          top: -74vmin;
          left: 3.5vmin;
          transform: rotate(25deg);
        }
        .face-10::before {
          width: 4vmin;
          height: 2.2vmin;
          background: #000;
          top: -1.65vmin;
          left: 1.35vmin;
          transform: rotate(-3deg);
          border-radius: 50%;
        }
        .face-10::after {
          width: 3vmin;
          height: 1vmin;
          background: #fff;
          top: 0.6vmin;
          left: 2.5vmin;
          transform: rotate(-26deg);
        }
        .face-11 {
          width: 3vmin;
          height: 2vmin;
          background: #fff;
          top: -68.25vmin;
          left: 7.4vmin;
          transform: rotate(30deg);
          border-radius: 50%;
        }
        .face-11::before {
          width: 5.5vmin;
          height: 3vmin;
          background: #fff;
          top: -0.35vmin;
          left: -3vmin;
          transform: rotate(-10deg);
          border-radius: 50%;
        }
        .face-11::after {
          width: 1vmin;
          height: 1vmin;
          background: #fff;
          top: 1.05vmin;
          left: 1vmin;
          transform: rotate(-20deg);
        }
        
        .eye-right-1 {
          width: 5.5vmin;
          height: 4vmin;
          background: #000;
          top: -64.1vmin;
          left: -0.6vmin;
          transform: rotate(5deg);
          border-radius: 50%;
        }
        .eye-right-1::before {
          width: 2vmin;
          height: 6vmin;
          background: #000;
          top: 1vmin;
          left: 0.05vmin;
          transform: rotate(-10deg);
          border-radius: 50%;
        }
        .eye-right-1::after {
          width: 5vmin;
          height: 4vmin;
          background: #fff;
          top: 0.7vmin;
          left: 0.9vmin;
          transform: skewY(3deg);
          border-radius: 50%;
        }
        .eye-right-2 {
          width: 2.5vmin;
          height: 5vmin;
          background: #fff;
          top: -60vmin;
          left: -2.5vmin;
          border-radius: 50%;
        }
        .eye-right-2::before {
          width: 2vmin;
          height: 3vmin;
          background: #fff;
          top: 2vmin;
          transform: rotate(10deg);
        }
        .eye-right-2::after {
          width: 2.5vmin;
          height: 3vmin;
          background: #fff;
          top: 3.45vmin;
          left: -1vmin;
          transform: skewY(-35deg);
        }
        .eye-right-3 {
          width: 2vmin;
          height: 4vmin;
          background: #fff;
          top: -58vmin;
          left: -8.05vmin;
          transform: rotate(-25deg);
        }
        .eye-right-3::before {
          width: 2vmin;
          height: 1vmin;
          background: #fff;
          top: 2.8vmin;
          left: 1vmin;
          transform: rotate(25deg);
        }
        .eye-right-3::after {
          width: 3.55vmin;
          height: 2vmin;
          background: #000;
          top: 0.3vmin;
          left: 4.1vmin;
          transform: rotate(12deg);
          border-radius: 50%;
        }
        .eye-right-4 {
          width: 2vmin;
          height: 1vmin;
          background: #000;
          top: -63.5vmin;
          left: 3.35vmin;
          transform: rotate(2deg);
          border-radius: 50%;
        }
        .eye-right-4::before {
          width: 1vmin;
          height: 0.3vmin;
          background: #000;
          top: 0.1vmin;
          left: 1vmin;
        }
        .eye-right-4::after {
          width: 1.5vmin;
          height: 0.4vmin;
          background: #fff;
          top: 0.25vmin;
          left: 0.5vmin;
          transform: rotate(5deg);
          border-radius: 50%;
        }
        .eye-right-5 {
          width: 5vmin;
          height: 2vmin;
          background: #fff;
          top: -61.7vmin;
          left: 2.6vmin;
        }
        .eye-right-5::before {
          width: 4vmin;
          height: 2vmin;
          background: #fff;
          top: -0.4vmin;
          left: -0.55vmin;
          border-radius: 50%;
        }
        .eye-right-5::after {
          width: 1vmin;
          height: 1vmin;
          background: #fff;
          left: -0.8vmin;
        }
        .eye-right-6 {
          width: 1.7vmin;
          height: 1.3vmin;
          background: #000;
          top: -64.1vmin;
          left: 1.6vmin;
          border-radius: 50%;
        }
        .eye-right-6::before {
          width: 2.7vmin;
          height: 1vmin;
          background: #000;
          top: 1.55vmin;
          left: -0.8vmin;
          border-radius: 50%;
        }
        .eye-right-6::after {
          width: 1.5vmin;
          height: 1vmin;
          background: #000;
          top: 1.2vmin;
          left: 0.9vmin;
          transform: rotate(-48deg);
          border-radius: 50%;
        }
        .eye-right-7 {
          width: 3vmin;
          height: 1vmin;
          background: #fff;
          top: -61.7vmin;
          transform: rotate(-2deg);
          border-radius: 50%;
        }
        .eye-right-7::before {
          width: 2vmin;
          height: 0.8vmin;
          background: #fff;
          top: -0.1vmin;
          left: 1.9vmin;
          transform: rotate(-30deg);
          border-radius: 50%;
        }
        
        .eye-left-1 {
          width: 4.4vmin;
          height: 2.3vmin;
          background: #000;
          top: -65vmin;
          left: -15.2vmin;
          transform: rotate(-15deg);
          border-radius: 0 1.3vmin 0 0;
        }
        .eye-left-1::before {
          width: 3vmin;
          height: 1vmin;
          background: #fff;
          top: 0.7vmin;
          left: 0.95vmin;
          transform: rotate(10deg) skewX(25deg);
          border-radius: 35% 1vmin 0 0;
        }
        .eye-left-1::after {
          width: 2vmin;
          height: 1vmin;
          background: #fff;
          top: 1.4vmin;
          left: 2.05vmin;
          transform: skewX(45deg);
        }
        .eye-left-2 {
          width: 0.4vmin;
          height: 2vmin;
          background: #fff;
          top: -63.3vmin;
          left: -17.9vmin;
          transform: skewY(-35deg);
        }
        .eye-left-2::before {
          width: 3vmin;
          height: 2vmin;
          background: #fff;
          top: 1vmin;
          left: 0.2vmin;
          transform: skewY(30deg);
          border-radius: 0 40% 0 0;
        }
        .eye-left-2::after {
          width: 2vmin;
          height: 2vmin;
          background: #fff;
          top: 1.25vmin;
          left: -0.7vmin;
          transform: skewY(50deg);
        }
        .eye-left-3 {
          width: 1vmin;
          height: 0.9vmin;
          background: #000;
          top: -65.2vmin;
          left: -20vmin;
        }
        .eye-left-3::before {
          width: 1.4vmin;
          height: 0.5vmin;
          background: #000;
          top: 0.6vmin;
          left: 0.1vmin;
          transform: rotate(28deg);
          border-radius: 0 100% 0 0;
        }
        .eye-left-3::after {
          width: 1.5vmin;
          height: 1vmin;
          background: #000;
          top: -0.3vmin;
          left: -0.3vmin;
          transform: rotate(40deg);
          border-radius: 0 0 30% 0;
        }
        .eye-left-4 {
          width: 1.4vmin;
          height: 1.3vmin;
          background: #fff;
          top: -67.4vmin;
          left: -18.8vmin;
          border-radius: 50%;
        }
        .eye-left-4::before {
          width: 1vmin;
          height: 0.5vmin;
          background: #fff;
          top: 0.6vmin;
          left: 0.6vmin;
          transform: rotate(-25deg);
          border-radius: 0 0 0 40%;
        }
        .eye-left-4::after {
          width: 3.75vmin;
          height: 2.5vmin;
          background: #000;
          top: 1.7vmin;
          left: 0.8vmin;
          transform: rotate(-1deg);
          border-radius: 50%;
        }
        .eye-left-5 {
          width: 1vmin;
          height: 0.4vmin;
          background: #000;
          top: -63.5vmin;
          left: -17.6vmin;
        }
        .eye-left-5::before {
          width: 2.5vmin;
          height: 1vmin;
          background: #fff;
          top: -0.25vmin;
          left: 0.85vmin;
          transform: rotate(5deg);
          border-radius: 50%;
        }
        .eye-left-5::after {
          width: 2.5vmin;
          height: 1.2vmin;
          background: #fff;
          top: 0.2vmin;
          left: 1.8vmin;
          transform: rotate(30deg);
          border-radius: 30% 0 0 0;
        }
        .eye-left-6 {
          width: 2.2vmin;
          height: 3vmin;
          background: #fff;
          top: -61vmin;
          left: -16vmin;
          transform: rotate(-50deg) skewY(20deg);
        }
        .eye-left-6::before {
          width: 0.7vmin;
          height: 1vmin;
          background: #fff;
          top: -0.4vmin;
          left: 0.6vmin;
          transform: skewX(15deg);
        }
        .eye-left-7 {
          width: 1.4vmin;
          height: 1.1vmin;
          background: #000;
          top: -63.9vmin;
          left: -13.8vmin;
          border-radius: 50%;
        }
        .eye-left-7::before {
          width: 0.5vmin;
          height: 0.5vmin;
          background: #000;
          left: -0.1vmin;
          transform: rotate(-30deg);
        }
        .eye-left-7::after {
          width: 2vmin;
          height: 1vmin;
          background: #000;
          top: 1.25vmin;
          left: -0.5vmin;
          border-radius: 50%;
        }
        .eye-left-8 {
          width: 2vmin;
          height: 0.7vmin;
          background: #fff;
          top: -61.9vmin;
          left: -15vmin;
          transform: rotate(-3deg);
          border-radius: 50%;
        }
        .eye-left-8::before {
          width: 1.2vmin;
          height: 0.8vmin;
          background: #fff;
          top: -0.15vmin;
          left: 1.5vmin;
          transform: rotate(20deg);
          border-radius: 80% 0 0 0;
        }
        .eye-left-8::after {
          width: 1vmin;
          height: 0.5vmin;
          background: #fff;
          top: 0.1vmin;
          left: 1.3vmin;
        }
        
        .nose-1 {
          width: 1vmin;
          height: 2vmin;
          background: #000;
          top: -51vmin;
          left: -4.25vmin;
          transform: rotate(-6deg);
          border-radius: 50%;
        }
        .nose-1::before {
          width: 1.5vmin;
          height: 1vmin;
          background: #000;
          top: 1vmin;
          left: -1vmin;
        }
        .nose-1::after {
          width: 1vmin;
          height: 1.5vmin;
          background: #fff;
          top: -0.4vmin;
          left: -0.25vmin;
          transform: rotate(-10deg);
          border-radius: 50%;
        }
        .nose-2 {
          width: 1.5vmin;
          height: 1vmin;
          background: #fff;
          top: -53vmin;
          left: -2.5vmin;
          transform: rotate(30deg);
        }
        .nose-2::before {
          width: 1vmin;
          height: 0.5vmin;
          background: #fff;
          top: 1.7vmin;
          left: -0.5vmin;
          transform: rotate(-25deg);
          border-radius: 50%;
        }
        .nose-2::after {
          width: 1.4vmin;
          height: 0.8vmin;
          background: #000;
          top: 2.35vmin;
          left: -1.1vmin;
          transform: rotate(-30deg);
          border-radius: 50%;
        }
        .nose-3 {
          width: 1.5vmin;
          height: 0.8vmin;
          background: #000;
          top: -49.7vmin;
          left: -8vmin;
          transform: rotate(-30deg);
          border-radius: 0 25% 0 30%;
        }
        .nose-3::before {
          width: 2vmin;
          height: 0.5vmin;
          background: #000;
          top: -0.8vmin;
          left: -1.2vmin;
          transform: rotate(60deg);
          border-radius: 50%;
        }
        .nose-3::after {
          width: 1vmin;
          height: 0.8vmin;
          background: #000;
          top: -0.1vmin;
          left: -0.1vmin;
          transform: rotate(30deg);
          border-radius: 0 0 0 30%;
        }
        .nose-4 {
          width: 1.2vmin;
          height: 1vmin;
          background: #fff;
          top: -51.2vmin;
          left: -9vmin;
          border-radius: 50%;
        }
        .nose-4::before {
          width: 2vmin;
          height: 1vmin;
          background: #fff;
          top: -0.4vmin;
          left: -2vmin;
          transform: rotate(-20deg);
        }
        .nose-4::after {
          width: 1.2vmin;
          height: 0.5vmin;
          background: #000;
          top: 1.35vmin;
          left: 0.1vmin;
          transform: rotate(25deg);
          border-radius: 50%;
        }
        .nose-5 {
          width: 2.2vmin;
          height: 1vmin;
          background: #000;
          top: -49vmin;
          left: -6.2vmin;
        }
        .nose-5::before {
          width: 1vmin;
          height: 1vmin;
          background: #fff;
          top: -0.2vmin;
          left: -1.7vmin;
          transform: skewX(40deg);
          border-radius: 50%;
        }
        .nose-5::after {
          width: 1.2vmin;
          height: 1vmin;
          background: #fff;
          top: 0.7vmin;
          left: -0.5vmin;
          border-radius: 0 100% 0 0;
        }
        .nose-6 {
          width: 1.7vmin;
          height: 1vmin;
          background: #fff;
          top: -48vmin;
          left: -5.4vmin;
          transform: rotate(-4deg);
          border-radius: 100% 0 0 0;
        }
        
        .mouth-1 {
          width: 5vmin;
          height: 1vmin;
          background: #000;
          top: -45.8vmin;
          left: -7.2vmin;
          border-radius: 50%;
        }
        .mouth-1::before {
          width: 2vmin;
          height: 1vmin;
          background: #000;
          top: -0.2vmin;
          left: -0.4vmin;
          transform: rotate(10deg);
          border-radius: 50%;
        }
        .mouth-1::after {
          width: 2vmin;
          height: 1vmin;
          background: #000;
          left: 3.4vmin;
          transform: rotate(2deg) skewX(-25deg);
          border-radius: 0 0 100% 0;
        }
        .mouth-2 {
          width: 3vmin;
          height: 1vmin;
          background: #fff;
          top: -47.4vmin;
          left: -3.2vmin;
          transform: rotate(-3deg);
          border-radius: 40% 0 0 0;
        }
        .mouth-2::before {
          width: 2.3vmin;
          height: 1vmin;
          background: #fff;
          top: 0.4vmin;
          left: -2vmin;
          border-radius: 50%;
        }
        .mouth-2::after {
          width: 1.5vmin;
          height: 0.7vmin;
          background: #fff;
          top: 0.4vmin;
          left: -0.35vmin;
          transform: rotate(-10deg);
        }
        .mouth-3 {
          width: 1vmin;
          height: 1.5vmin;
          background: #fff;
          top: -46.5vmin;
          left: -13.8vmin;
        }
        .mouth-3::before {
          width: 2vmin;
          height: 1vmin;
          background: #fff;
          top: -0.05vmin;
          left: 0.8vmin;
          transform: rotate(12deg);
        }
        .mouth-3::after {
          width: 1vmin;
          height: 0.5vmin;
          background: #fff;
          top: 0.55vmin;
          left: 1.9vmin;
          transform: rotate(16deg);
        }
        .mouth-4 {
          width: 3vmin;
          height: 1vmin;
          background: #000;
          top: -42.5vmin;
          left: -7vmin;
        }
        .mouth-4::before {
          width: 2vmin;
          height: 1.2vmin;
          background: #fff;
          top: -0.1vmin;
          left: 2.25vmin;
          transform: skewX(-55deg);
        }
        .mouth-4::after {
          width: 1vmin;
          height: 1.5vmin;
          background: #fff;
          left: -0.7vmin;
          transform: rotate(-30deg);
          border-radius: 50%;
        }
        .mouth-5 {
          width: 3.5vmin;
          height: 0.6vmin;
          background: #fff;
          top: -43.5vmin;
          left: -7vmin;
          transform: rotate(-2.5deg);
          border-radius: 50%;
        }
        .mouth-5::before {
          width: 1.5vmin;
          height: 0.5vmin;
          background: #fff;
          top: 1.15vmin;
          left: 0.55vmin;
          transform: skewX(-35deg);
          border-radius: 30% 0 0 0;
        }
        
        .shirt-1 {
          width: 20vmin;
          height: 20vmin;
          background: #000;
          top: 9vmin;
          left: 38.7vmin;
          border-radius: 0 50% 0 0;
        }
        .shirt-1::before {
          width: 15vmin;
          height: 37vmin;
          background: #000;
          top: 1.5vmin;
          left: 8.8vmin;
          transform: rotate(-18deg);
          border-radius: 40% 30% 33% 0;
        }
        .shirt-1::after {
          width: 5vmin;
          height: 27vmin;
          background: #000;
          top: 5vmin;
          left: 18.8vmin;
          transform: rotate(-18deg);
          border-radius: 50%;
        }
        .shirt-2 {
          width: 5vmin;
          height: 20vmin;
          background: #000;
          top: 12vmin;
          left: 56.2vmin;
          transform: rotate(-25deg);
          border-radius: 50%;
        }
        .shirt-2::before {
          width: 3vmin;
          height: 17vmin;
          background: #fff;
          left: 5vmin;
          transform: rotate(2deg);
          border-radius: 50%;
        }
        .shirt-2::after {
          width: 18vmin;
          height: 18vmin;
          background: #000;
          top: 25.6vmin;
          left: -22.5vmin;
          transform: rotate(43deg);
          border-radius: 0 0 11vmin 0;
        }
        .shirt-3 {
          width: 5vmin;
          height: 9vmin;
          background: #000;
          top: 63vmin;
          left: 64.25vmin;
          transform: rotate(20deg);
          border-radius: 0 16% 5% 0;
        }
        .shirt-3::before {
          width: 30vmin;
          height: 10vmin;
          background: #000;
          top: 15vmin;
          left: -31.7vmin;
          transform: rotate(-14deg);
          border-radius: 50%;
        }
        .shirt-3::after {
          width: 5.5vmin;
          height: 2vmin;
          background: #000;
          top: 19.55vmin;
          left: -9.3vmin;
          transform: rotate(-25deg);
          border-radius: 50%;
        }
        .shirt-4 {
          width: 6vmin;
          height: 1vmin;
          background: #000;
          top: 88.1vmin;
          left: 32vmin;
          border-radius: 50%;
        }
        .shirt-4::before {
          width: 25vmin;
          height: 1vmin;
          background: #fff;
          top: 1.05vmin;
          left: -15vmin;
          transform: rotate(8deg);
          border-radius: 50%;
        }
        .shirt-4::after {
          width: 40vmin;
          height: 34vmin;
          background: #000;
          top: -39vmin;
          left: -27vmin;
        }
        .shirt-5 {
          width: 10vmin;
          height: 15vmin;
          background: #000;
          top: 8vmin;
          left: 18vmin;
          transform: rotate(44deg);
        }
        .shirt-5::before {
          width: 5vmin;
          height: 10vmin;
          background: #000;
          top: 6vmin;
          left: -0.05vmin;
          transform: rotate(15deg);
        }
        .shirt-5::after {
          width: 3.8vmin;
          height: 10vmin;
          background: #000;
          top: 14vmin;
          left: -19.8vmin;
          border-radius: 30% 0 0 5%;
        }
        .shirt-6 {
          width: 4vmin;
          height: 10vmin;
          background: #000;
          left: -30vmin;
          border-radius: 20% 0 0 0;
        }
        .shirt-6::before {
          width: 25vmin;
          height: 10vmin;
          background: #000;
          top: 6.9vmin;
          left: -2.8vmin;
          transform: rotate(10deg);
        }
        .shirt-6::after {
          width: 10vmin;
          height: 5vmin;
          background: #000;
          top: 4.6vmin;
          left: -0.5vmin;
          transform: rotate(40deg);
        }
        .shirt-7 {
          width: 10vmin;
          height: 15vmin;
          background: #000;
          top: 16vmin;
          left: -38.9vmin;
          transform: rotate(-13deg);
          border-radius: 50%;
        }
        .shirt-7::before {
          width: 3vmin;
          height: 2vmin;
          background: #000;
          top: -2.3vmin;
          left: 5.6vmin;
          transform: rotate(-30deg) skewX(-20deg);
          border-radius: 50% 0 0 0;
        }
        .shirt-7::after {
          width: 4vmin;
          height: 3vmin;
          background: #000;
          top: -0.5vmin;
          left: 5vmin;
          transform: rotate(40deg) skewX(-15deg);
        }
        .shirt-8 {
          width: 1vmin;
          height: 1.35vmin;
          background: #fff;
          top: 0.05vmin;
          left: -41.9vmin;
          transform: rotate(15deg);
          border-radius: 50%;
        }
        .shirt-8::before {
          width: 4vmin;
          height: 2vmin;
          background: #000;
          top: 9.9vmin;
          left: -2.5vmin;
          transform: rotate(-55deg);
          border-radius: 1vmin 0 0 0;
        }
        .shirt-8::after {
          width: 20vmin;
          height: 23.5vmin;
          background: #000;
          top: 8.9vmin;
          left: 1vmin;
          transform: rotate(-15deg);
        }
        .shirt-9 {
          width: 12vmin;
          height: 5vmin;
          background: #000;
          top: 66.2vmin;
          left: -41vmin;
          transform: rotate(3deg);
          border-radius: 0 0 50% 0;
        }
        .shirt-9::before {
          width: 2.4vmin;
          height: 4vmin;
          background: #000;
          top: 2.45vmin;
          left: -1.4vmin;
          transform: rotate(70deg);
        }
        .shirt-9::after {
          width: 2vmin;
          height: 3vmin;
          background: #fff;
          top: 4.55vmin;
          left: -3vmin;
          transform: rotate(-63deg);
        }
        .shirt-10 {
          width: 4vmin;
          height: 2vmin;
          background: #fff;
          top: 73.9vmin;
          left: -54vmin;
        }
        .shirt-10::before {
          width: 10vmin;
          height: 18vmin;
          background: #000;
          top: -18.95vmin;
          left: -4vmin;
          border-radius: 30% 0 0 0;
        }
        .shirt-10::after {
          width: 9.6vmin;
          height: 18.5vmin;
          background: #000;
          top: -18.7vmin;
          left: -6.85vmin;
          transform: rotate(5deg);
          border-radius: 50%;
        }
        .shirt-11 {
          width: 6.5vmin;
          height: 13vmin;
          background: #000;
          top: 57vmin;
          left: -65.5vmin;
          transform: rotate(-2deg);
          border-radius: 50%;
        }
        .shirt-11::before {
          width: 5vmin;
          height: 10vmin;
          background: #000;
          top: -5vmin;
          left: 1.4vmin;
          transform: rotate(22deg);
          border-radius: 50%;
        }
        .shirt-11::after {
          width: 2vmin;
          height: 9vmin;
          background: #000;
          top: -10.5vmin;
          left: 7.2vmin;
          transform: rotate(47deg);
          border-radius: 50%;
        }
        .shirt-12 {
          width: 5vmin;
          height: 5vmin;
          background: #000;
          top: 33vmin;
          left: -55vmin;
          border-radius: 80% 0 0 0;
        }
        .shirt-12::before {
          width: 3vmin;
          height: 8vmin;
          background: #000;
          top: -4.6vmin;
          left: 2.95vmin;
          transform: rotate(25deg);
          border-radius: 50%;
        }
        .shirt-12::after {
          width: 1.5vmin;
          height: 6vmin;
          background: #000;
          top: 0.3vmin;
          left: -1vmin;
          transform: rotate(60deg);
          border-radius: 50%;
        }
        .shirt-13 {
          width: 17vmin;
          height: 6vmin;
          background: #fff;
          top: 4.4vmin;
          left: -13.2vmin;
          transform: rotate(15deg);
          border-radius: 50%;
        }
        .shirt-13::before {
          width: 8vmin;
          height: 4vmin;
          background: #000;
          top: 1.25vmin;
          transform: rotate(10deg);
          border-radius: 50%;
        }
        .shirt-13::after {
          width: 2vmin;
          height: 4vmin;
          background: #000;
          top: 0.9vmin;
          left: -1.2vmin;
          transform: rotate(27deg);
        }
        .shirt-14 {
          width: 16vmin;
          height: 4vmin;
          background: #000;
          top: 6.05vmin;
          left: -9.7vmin;
          transform: rotate(8.5deg);
          border-radius: 50%;
        }
        .shirt-14::before {
          width: 8vmin;
          height: 1vmin;
          background: #000;
          top: 2.85vmin;
          left: 7vmin;
          transform: rotate(-3deg);
          border-radius: 50%;
        }
        .shirt-14::after {
          width: 2vmin;
          height: 3vmin;
          background: #000;
          top: 2vmin;
          left: 12.95vmin;
          transform: rotate(15deg);
        }
        .shirt-15 {
          width: 15vmin;
          height: 4vmin;
          background: #fff;
          top: 4.4vmin;
          left: -12.5vmin;
          transform: rotate(14deg);
          border-radius: 50%;
        }
        .shirt-15::before {
          width: 5vmin;
          height: 2.8vmin;
          background: #fff;
          top: 0.2vmin;
          left: -1.1vmin;
          transform: rotate(30deg);
          border-radius: 50%;
        }
        .shirt-15::after {
          width: 2vmin;
          height: 3vmin;
          background: #000;
          top: -1vmin;
          left: -2.8vmin;
          transform: rotate(20deg);
        }
        .shirt-16 {
          width: 6vmin;
          height: 1.7vmin;
          background: #fff;
          top: 8.3vmin;
          left: -0.4vmin;
          transform: rotate(-2.5deg);
          border-radius: 50%;
        }
        .shirt-16::before {
          width: 3vmin;
          height: 4vmin;
          background: #000;
          left: 4.1vmin;
          transform: rotate(55deg);
          border-radius: 30% 0 0 0;
        }
        .shirt-16::after {
          width: 3vmin;
          height: 0.4vmin;
          background: #fff;
          top: 1.1vmin;
          left: -0.3vmin;
          transform: rotate(6deg);
          border-radius: 50%;
        }
        .shirt-17 {
          width: 15vmin;
          height: 3vmin;
          background: #000;
          top: 4vmin;
          left: -8vmin;
          transform: rotate(9deg);
          border-radius: 50%;
        }
        .shirt-17::before {
          width: 5.2vmin;
          height: 2vmin;
          background: #000;
          top: -0.4vmin;
          left: -2.9vmin;
          transform: rotate(35deg);
          border-radius: 50%;
        }
        .shirt-17::after {
          width: 13vmin;
          height: 3vmin;
          background: #fff;
          top: -0.5vmin;
          transform: rotate(3deg);
          border-radius: 50%;
        }
        .shirt-18 {
          width: 7vmin;
          height: 2.5vmin;
          background: #fff;
          top: 4.5vmin;
          border-radius: 50%;
        }
        .shirt-18::before {
          width: 3vmin;
          height: 0.8vmin;
          background: #fff;
          top: 1.75vmin;
          left: 3.1vmin;
          transform: skewX(-55deg) rotate(4deg);
          border-radius: 0 0 50% 0;
        }
        .shirt-18::after {
          width: 4vmin;
          height: 1.9vmin;
          background: #fff;
          top: -2.4vmin;
          left: -9.5vmin;
          transform: rotate(40deg);
          border-radius: 50%;
        }
        .shirt-19 {
          width: 0.9vmin;
          height: 3vmin;
          background: #fff;
          top: -2.15vmin;
          left: -24.3vmin;
          transform: rotate(-30deg);
          border-radius: 50%;
        }
        .shirt-19::after {
          width: 0.8vmin;
          height: 2.5vmin;
          background: #fff;
          top: 0.2vmin;
          left: -0.1vmin;
          border-radius: 50%;
        }
        .shirt-20 {
          width: 1vmin;
          height: 6.1vmin;
          background: #fff;
          top: 7.5vmin;
          left: -31.5vmin;
          transform: rotate(25deg);
          border-radius: 50%;
        }
        .shirt-20::before {
          width: 0.4vmin;
          height: 1.2vmin;
          background: #fff;
          left: 0.2vmin;
          transform: rotate(10deg);
          border-radius: 20% 60% 0 0;
        }
        .shirt-20::after {
          width: 2vmin;
          height: 3vmin;
          background: #fff;
          top: 0.5vmin;
          left: 0.3vmin;
          transform: skewY(17deg);
          border-radius: 10% 0 0 0;
        }
        .shirt-21 {
          width: 1.6vmin;
          height: 5.5vmin;
          background: #000;
          top: 9.3vmin;
          left: -30.7vmin;
          transform: rotate(37.5deg);
          border-radius: 50%;
        }
        .shirt-21::before {
          width: 1.2vmin;
          height: 2.7vmin;
          background: #fff;
          top: -0.1vmin;
          left: 0.4vmin;
          transform: rotate(-10deg);
          border-radius: 50%;
        }
        .shirt-21::after {
          width: 2vmin;
          height: 2.65vmin;
          background: #fff;
          top: -0.35vmin;
          left: 1vmin;
          transform: skewY(-7deg);
        }
        .shirt-22 {
          width: 0.5vmin;
          height: 2vmin;
          background: #000;
          top: 6.85vmin;
          left: -27.8vmin;
          transform: rotate(40deg);
          border-radius: 80% 10% 0 0;
        }
        .shirt-22::before {
          width: 1vmin;
          height: 1.5vmin;
          background: #000;
          top: 1.4vmin;
          left: -0.05vmin;
          transform: rotate(10deg);
          border-radius: 0 100% 0 0;
        }
        .shirt-22::after {
          width: 0.5vmin;
          height: 2.5vmin;
          background: #000;
          top: 0.3vmin;
          left: 0.25vmin;
          transform: rotate(-11deg);
          border-radius: 50% 0 0 0;
        }
        .shirt-23 {
          width: 0.8vmin;
          height: 4vmin;
          background: #000;
          top: 9.5vmin;
          left: -27vmin;
          transform: rotate(45deg);
          border-radius: 50%;
        }
        .shirt-23::before {
          width: 1vmin;
          height: 1vmin;
          background: #000;
          top: 2vmin;
          left: 0.3vmin;
        }
        .shirt-23::after {
          width: 1.5vmin;
          height: 6.5vmin;
          background: #fff;
          top: -0.5vmin;
          left: 1vmin;
          transform: rotate(-22deg);
          border-radius: 50%;
        }
        .shirt-24 {
          width: 2vmin;
          height: 2vmin;
          background: #fff;
          top: 9.2vmin;
          left: -22vmin;
          transform: skewY(20deg);
        }
        .shirt-24::before {
          width: 1vmin;
          height: 6.6vmin;
          background: #000;
          left: -1.1vmin;
          transform: rotate(27deg);
          border-radius: 50%;
        }
        .shirt-24::after {
          width: 2vmin;
          height: 4vmin;
          background: #000;
          top: 4vmin;
          left: -2.4vmin;
          transform: rotate(28deg);
        }
        .shirt-25 {
          width: 1.5vmin;
          height: 1.7vmin;
          background: #fff;
          top: 9.5vmin;
          left: -21.8vmin;
          transform: rotate(20deg);
        }
        .shirt-25::before {
          width: 1.5vmin;
          height: 2vmin;
          background: #000;
          top: 0.5vmin;
          left: 0.4vmin;
          transform: rotate(40deg);
        }
        .shirt-25::after {
          width: 2vmin;
          height: 3vmin;
          background: #fff;
          left: 1.1vmin;
        }
        .shirt-26 {
          width: 1vmin;
          height: 3vmin;
          background: #000;
          top: 11.5vmin;
          left: -19.5vmin;
          transform: rotate(20deg);
          border-radius: 100% 0 0 0;
        }
        .shirt-26::before {
          width: 0.5vmin;
          height: 2.5vmin;
          background: #000;
          top: 0.5vmin;
          left: -0.05vmin;
          transform: rotate(15deg);
          border-radius: 40% 0 0 0;
        }
        .shirt-26::after {
          width: 1.5vmin;
          height: 1vmin;
          background: #000;
          top: 2.4vmin;
          left: -0.45vmin;
          transform: skewX(-29deg);
          border-radius: 0 60% 0 0;
        }
        .shirt-27 {
          width: 0.8vmin;
          height: 2vmin;
          background: #000;
          top: 14vmin;
          left: -20vmin;
          transform: rotate(10deg);
        }
        .shirt-27::before {
          width: 1.5vmin;
          height: 2vmin;
          background: #000;
          left: 1vmin;
          transform: rotate(40deg);
        }
        .shirt-27::after {
          width: 0.6vmin;
          height: 2.2vmin;
          background: #fff;
          top: -1.8vmin;
          left: 1.15vmin;
          transform: rotate(25deg);
          border-radius: 0 0 0 50%;
        }
        .shirt-28 {
          width: 1vmin;
          height: 4.2vmin;
          background: #fff;
          top: 13.8vmin;
          left: -16.4vmin;
          transform: rotate(14deg);
          border-radius: 50%;
        }
        .shirt-28::before {
          width: 1vmin;
          height: 0.8vmin;
          background: #fff;
          top: -0.2vmin;
        }
        .shirt-28::after {
          width: 2vmin;
          height: 1.2vmin;
          background: #fff;
          left: 0.7vmin;
        }
        .shirt-29 {
          width: 1vmin;
          height: 4.5vmin;
          background: #000;
          top: 15vmin;
          left: -15.7vmin;
          transform: rotate(27deg);
          border-radius: 50%;
        }
        .shirt-29::before {
          width: 2vmin;
          height: 3.4vmin;
          background: #fff;
          top: -0.4vmin;
          left: 0.8vmin;
          transform: rotate(-12deg);
          border-radius: 0 0 0 10%;
        }
        .shirt-29::after {
          width: 2vmin;
          height: 0.5vmin;
          background: #fff;
          top: -0.8vmin;
          left: 1vmin;
          transform: rotate(-18deg);
        }
        .shirt-30 {
          width: 1vmin;
          height: 4vmin;
          background: #000;
          top: 14.8vmin;
          left: -12.8vmin;
          transform: rotate(31deg);
          border-radius: 50%;
        }
        .shirt-30::before {
          width: 0.5vmin;
          height: 1.2vmin;
          background: #fff;
          top: -0.4vmin;
          left: 0.55vmin;
          transform: rotate(-30deg);
        }
        .shirt-30::after {
          width: 1vmin;
          height: 2vmin;
          background: #000;
          top: 1.9vmin;
          left: 0.35vmin;
          transform: rotate(-30deg);
          border-radius: 40% 0 0 0;
        }
        .shirt-31 {
          width: 0.4vmin;
          height: 2.2vmin;
          background: #fff;
          top: 14vmin;
          left: -11.3vmin;
          transform: rotate(18deg);
          border-radius: 50%;
        }
        .shirt-31::before {
          width: 1vmin;
          height: 0.4vmin;
          background: #fff;
          top: -0.5vmin;
          left: 1vmin;
        }
        .shirt-31::after {
          width: 0.9vmin;
          height: 2vmin;
          background: #fff;
          top: -0.9vmin;
          left: 0.1vmin;
          transform: rotate(20deg);
          border-radius: 50% 0 0 90%;
        }
        .shirt-32 {
          width: 1.5vmin;
          height: 3vmin;
          background: #000;
          top: 17vmin;
          left: -10.4vmin;
          transform: rotate(34deg);
        }
        .shirt-32::before {
          width: 2vmin;
          height: 0.5vmin;
          background: #000;
          top: -2.55vmin;
          left: 0.7vmin;
          transform: rotate(-34deg);
        }
        .shirt-32::after {
          width: 1vmin;
          height: 2vmin;
          background: #fff;
          top: -2vmin;
          left: 0.25vmin;
          transform: rotate(-36deg);
        }
        .shirt-33 {
          width: 0.5vmin;
          height: 1.2vmin;
          background: #fff;
          top: 14vmin;
          left: -8.4vmin;
          transform: rotate(12deg);
        }
        .shirt-33::before {
          width: 0.5vmin;
          height: 0.9vmin;
          background: #fff;
          top: -1.3vmin;
          left: 0.5vmin;
          transform: rotate(35deg);
          border-radius: 40% 0 0 0;
        }
        .shirt-33::after {
          width: 0.9vmin;
          height: 3.5vmin;
          background: #000;
          top: -1vmin;
          left: 0.2vmin;
          transform: rotate(20deg);
          border-radius: 50%;
        }
        .shirt-34 {
          width: 1vmin;
          height: 1vmin;
          background: #000;
          top: 14.5vmin;
          left: -6.5vmin;
        }
        .shirt-34::before {
          width: 1.7vmin;
          height: 1.8vmin;
          background: #fff;
          top: -1.3vmin;
          left: 0.6vmin;
          transform: rotate(10deg);
        }
        .shirt-34::after {
          width: 1.5vmin;
          height: 2vmin;
          background: #000;
          top: -0.9vmin;
          left: 1vmin;
          transform: rotate(40deg);
        }
        .shirt-35 {
          width: 1.5vmin;
          height: 1.5vmin;
          background: #fff;
          top: 12.7vmin;
          left: -2.5vmin;
        }
        .shirt-35::before {
          width: 1.5vmin;
          height: 1.8vmin;
          background: #000;
          top: 0.5vmin;
          left: 0.3vmin;
          transform: rotate(42deg);
        }
        .shirt-36 {
          width: 1vmin;
          height: 1vmin;
          background: #fff;
          top: 12.3vmin;
          left: -0.8vmin;
        }
        .shirt-36::after {
          width: 2vmin;
          height: 2vmin;
          background: #000;
          left: 0.15vmin;
          transform: rotate(25deg);
        }
        .shirt-37 {
          width: 0.7vmin;
          height: 10vmin;
          background: #fff;
          top: 23.5vmin;
          left: -8.5vmin;
          transform: rotate(35deg) skewX(-3deg);
          border-radius: 100% 0 0 0;
        }
        .shirt-37::before {
          width: 1vmin;
          height: 7.5vmin;
          background: #fff;
          top: 4vmin;
          left: 0.05vmin;
          transform: rotate(-5.5deg);
        }
        .shirt-37::after {
          width: 1.5vmin;
          height: 10vmin;
          background: #000;
          top: 2vmin;
          left: -0.95vmin;
          transform: rotate(-6deg);
        }
        .shirt-38 {
          width: 0.5vmin;
          height: 4.5vmin;
          background: #000;
          top: 32vmin;
          left: -14.2vmin;
          transform: rotate(30deg);
          border-radius: 50%;
        }
        .shirt-38::before {
          width: 0.3vmin;
          height: 2.6vmin;
          background: #fff;
          top: 3.4vmin;
          left: 0.3vmin;
          transform: rotate(6deg);
          border-radius: 0 10% 0 100%;
        }
        .shirt-38::after {
          width: 0.3vmin;
          height: 2vmin;
          background: #000;
          top: 2.5vmin;
          left: 0.15vmin;
          tran.........完整代码请登录后点击上方下载按钮下载查看

网友评论0