body {
  background: #333;
  margin: 100px;
}

.eye {
    position: relative;
    @include linear-gradient(to bottom, #0c68b0, darken(#0c68b0, 10));
    width: 100px;
    height: 100px;
    border-radius: 100px 100px 12px 100px;
    border: 2px solid white;
    transform: rotateZ(45deg);
    &:before {
      content: "";
      position: absolute;
      background-color: white;
      width: 70px;
      height: 70px;
      border-radius: 50%;
      z-index: 1;
      top: 50%;
      left: 50%;
      transform: translateX(-50%) translateY(-50%);
    }
  
    .inner {
      position: absolute;
      background-color: black;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      z-index: 1;
      top: 50%;
      left: 50%;
      transform: translateX(-50%) translateY(-50%) rotate(45deg);
      &:before {
        content: "";
        position: absolute;
        background-color: white;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        z-index: 1;
        top: 15%;
        left: 40%;
      }
    }
}