body{
}
.cabell{
  width:530px;
  height:750px;
  background:#4b3029;
  border-radius: 20% / 60%;
  margin: 0 auto;
}
.cap{
  width:450px;
  height:640px;
  background:#FCD0B4;
  margin:0 auto;
  border-radius: 250px 250px 300px 290px;
  box-shadow: inset 0px 0px 25px #edaa7c;
  margin-top:250px;
}
.front{
  height:220px;
  margin-top:200px;
}
.cabell-front{
  margin:-15px;
  width:485px;
  height:400px;
  margin-top:-175px;
  border-radius: 150px 150px 100px 100px;
  box-shadow: inset 0px 120px 0px #4b3029;
}
.gorro-superior{
  margin-left:-10px;
  margin-top:-505px;
  width:460px;
  height:200px;
  border-radius: 150px 150px 100px 100px;
  box-shadow: inset 0px 500px 0px #cdcdcd;
}
.gorro{
  margin-left:-52px;
  width:553px;
  height:400px;
  margin-top:-145px;
  border-radius: 210px 210px 100px 100px;
  box-shadow: inset 0px 205px 0px #e5e4e2 ;
}
.celles{
  height:20px;
  padding:5px;
  margin-top:0px;
}
.cella-esquerra{
  width: 130px;
  height:15px;
  background: #4b3029;
  float:left;
  margin-left:30px;
  border-radius: 50% 0 50% 0;
  transform:rotate(8deg);
}
.cella-dreta{
  width: 130px;
  height:15px;
  background: #4b3029;
  float:right;
  margin-right:30px;
  border-radius: 50% 0 50% 0;
  transform:rotate(-4deg);
}
.ulls{
  height:60px;
  margin-top:5px;
}
.esquerra .parpella{
  width:135px;
  height:105px;
  float:left;
  margin-left:40px;
  border-radius: 210px 210px 100px 100px;
  box-shadow: inset 0px 220px 0px #edaa7c ;
  clip-path: polygon(59% 0, 83% 9%, 99% 41%, 75% 49%, 35% 49%, 18% 45%, 0 39%, 18% 15%, 34% 0);
}

.esquerra .blanc{
  width:127px;
  height:80px;
  float:left;
  margin-left:-130px;
  border-radius:50%;
  margin-top:10px;
  background: white;
  clip-path: polygon(59% 0, 83% 9%, 99% 41%, 75% 49%, 35% 49%, 18% 45%, 0 39%, 18% 15%, 34% 0);
}
.esquerra .iris{
  float:left;
  margin-left:33px;
  margin-top:-10px;
  background:#4b3029;
  width: 60px;
  height: 60px;
  border-radius: 50%;
}
.esquerra .pupila{
  float:left;
  margin-left:10px;
  margin-top:5px;
  background:black;
  width: 40px;
  height: 40px;
  border-radius:50%;
}
.esquerra .llum{
  float:left;
  margin-left:-35px;
  margin-top:10px;
  background:white;
  width: 15px;
  height: 15px;
  border-radius: 50%;
}
.dreta .parpella{
  margin-top:-105px;
  width:135px;
  height:105px;
  float:right;
  margin-right:40px;
  border-radius: 210px 210px 100px 100px;
  box-shadow: inset 0px 220px 0px #edaa7c ;
  clip-path: polygon(59% 0, 83% 9%, 99% 41%, 75% 49%, 35% 49%, 18% 45%, 0 39%, 18% 15%, 34% 0);
}

.dreta .blanc{
  width:127px;
  height:80px;
  float:right;
  margin-right:45px;
  border-radius:50%;
  margin-top:-95px;
  background: white;
  clip-path: polygon(59% 0, 83% 9%, 99% 41%, 75% 49%, 35% 49%, 18% 45%, 0 39%, 18% 15%, 34% 0);
}
.dreta .iris{
  float:right;
  margin-right:33px;
  margin-top:-10px;
  background:#4b3029;
  width: 60px;
  height: 60px;
  border-radius: 50%;
}
.dreta .pupila{
  float:right;
  margin-right:10px;
  margin-top:5px;
  background:black;
  width: 40px;
  height: 40px;
  border-radius:50%;
}
.dreta .llum{
  float:right;
  margin-right:-20px;
  margin-top:10px;
  background:white;
  width: 15px;
  height: 15px;
  border-radius: 50%;
}
.parpella:hover{
  position:relative;
  transition: width 0.1s 0.1s ease-in;
  z-index: 100;
}
.ojera-izquierda {
  float:left;
  margin-top:-90px;
  margin-left:40px;
  width: 130px;
  height:55px;
  border-radius: 50%;
  box-shadow: 1px 1px 0 #edaa7c;
  transform:rotate(10deg);
  opacity: 0.2;
}
.ojera-derecha {
  float:left;
  margin-top:-85px;
  margin-left:280px;
  width: 130px;
  height:50px;
  border-radius: 50%;
  box-shadow: 1px 1px 0 #edaa7c;
  transform:rotate(10deg);
  opacity:0.2;
  transform: scaleX(-1);
}
.esquerra{
  float:left;
}
.dreta{
  float:right;
}
.orella{
  height: 100px;
  margin-top:-250px;
  clear:both;
  position:relative;
  top:-50px;
}
.orella .dreta{
  width: 50px;
  height: 110px;
  background:#FCD0B4;
  border-radius:50%;
  box-shadow: 0 1px 0 1px #edaa7c;
  position:relative;
  left:50px;
}
.orella .esquerra{
  width: 50px;
  height: 110px;
  background:#FCD0B4;
  border-radius:50%;
  box-shadow: 2px 2px 0 0 #edaa7c;
  position:relative;
  right:50px;
}
.rosa-izquierda{
  margin-left:35px;
  margin-top:-100px;
  width:120px;
  height:100px;
  background:pink;
  border-radius: 50%;
  opacity: 20%;
  transform:rotate(180deg);
}
.rosa-derecha{
  margin-left:300px;
  margin-top:-100px;
  width:120px;
  height:100px;
  background:pink;
  border-radius: 50%;
  opacity: 20%;
  transform:rotate(180deg);
}
.nas{
  height:80px;
  margin-top:-90px;
}
.lunar{
  margin-left:280px;
  width: 3px;
  height: 3px;
  border-radius:50%;
  background: #edaa7c;
}
.nas-inferior{
  margin-left:160px;
  width: 120px;
  height: 70px;
  background-color:#FCD0B4;
  border-radius: 30px 30px 100px 100px;
  box-shadow: 5px 5px 0 0 #edaa7c;
}
.boca{
  height:70px;
  margin-top:37px;
}
.oyuelo{
  float:left;
  margin-top:-30px;
  margin-left:350px;
  width: 50px;
  height:50px;
  border-radius: 50%;
  box-shadow: 1px 1px 0 #edaa7c;
  transform:rotate(10deg);
  opacity:0.2;
  transform: scaleX(-1);
}
.llavi-superior{
  margin-left:120px;
  margin-top:0px;
  width: 210px;
  height:75px;
  border-radius:10%;
  clip-path: polygon(51% 10%, 69% 0, 100% 15%, 0 15%, 31% 0);
  background: #EB636B;
}
.llavi-inferior{
  height:445px;
  width: 210px;
  margin-left:120px;
  margin-top:-242px;
  border-radius:10%;
 clip-path: polygon(0 40%, 100% 40%, 82% 50%, 51% 56%, 21% 50%);
 background: #EB636B;
}
.mueca{
  height:70px;
  margin-top:210px;
  opacity:0;
}
.mueca:hover{
  opacity: 100;
  z-index: 100;
}
.guino{
  margin-top:-360px;
  width:135px;
  height:105px;
  float:right;
  margin-right:41px;
  border-radius: 210px 210px 100px 100px;
  box-shadow: inset 0px 220px 0px #edaa7c ;
  clip-path: polygon(59% 0, 83% 9%, 99% 41%, 75% 49%, 35% 49%, 18% 45%, 0 39%, 18% 15%, 34% 0);
}
.llavi-alt{
  margin-left:108px;
  margin-top:-286px;
  height:135px;
  width: 234px;
  border-radius:10%;
  clip-path: polygon(51% 10%, 69% 0, 100% 15%, 0 15%, 31% 0);
  background: #EB636B;
}
.dents{
  margin-left:215px;
  margin-top:-252px;
  background: white;
  height:210px;
  width:20px;
  border-radius: 0 100px 100px 0;
  transform: rotate(90deg);
}
.llavi-baix{
  margin-left:185px;
  margin-top:-193px;
  background: #EB636B;
  height:235px;
  width:80px;
  border-radius: 0 100px 100px 0;
  transform: rotate(90deg);
}
.llengua{
  background:#d9534f;
  margin-left:175px;
  margin-top:-210px;
  height:210px;
  width:100px;
  border-radius: 0 100px 100px 0;
  transform: rotate(90deg);
}
.parla{
  height:70px;
  margin-top:-71px;
  opacity:0;
}
.parla:active{
  opacity: 100;
  z-index: 100;
}
.llavis{
  margin-left:112px;
  height:135px;
  width: 233px;
  border-radius:10%;
  clip-path: polygon(51% 10%, 70% 0, 100% 15%, 0 15%, 31% 0);
  background:#EB636B;
}
.dent{
  margin-left:112px;
  margin-top:-232px;
  background: white;
  height:195px;
  width: 233px;
  clip-path: polygon(49% 76%, 100% 60%, 42% 61%, 0 60%);
}
.llaviss{
  margin-left:112px;
  margin-top:-186px;
  height:180px;
  width: 233px;
  background:#EB636B;
  clip-path: polygon(49% 76%, 100% 60%, 69% 100%, 29% 99%, 0 60%);
}