rsd2.sass

$stroke : #1F3969
$bg : white
$main : #F6F9FD

.art
  max-width: 600px
  max-height: 600px
  background: $bg
  box-shadow: 0px 3px 20px rgba(0,0,0,0.2)
  border-radius: 3px
  margin: 50px auto
  border: 20px white solid
  position: relative
  display: flex
  align-items: center
  justify-content: center
  
.r2
  margin: 0 auto
  margin-left: 200px
  
.structure
  transform: rotate(-25deg)
  
  .head
    position: relative
    height: 150px
    width: 150px
    border: 8px solid $stroke
    border-radius: 50%
    background: white
    background: $main
    overflow: hidden 
    box-shadow: -10px 0px 0px 5px #9ECAE6 inset, -20px 0px 0px 5px #B1D3ED inset,  10px 0px 0px 5px rgba(255,255,255,0.5) inset, 10px 10px 0px 80px #BEDAF1 inset
    
    .circle
      height: 70px
      width: 70px
      border: 8px solid $stroke
      border-radius: 50%
      position: absolute
      left: 30px
      top: -70px
      background: #5092E6
      
    .line-1
      height: 12px
      width: 60px
      border: 8px solid $stroke
      background: #5092E6
      position: absolute
      top: 40px
      left: -25px
      border-radius: 5px inset

    .line-2
      height: 12px
      width: 25px
      border: 8px solid $stroke
      background: #5092E6
      position: absolute
      top: 40px
      left: 70px
      border-radius: 5px
      
  .body
    z-index: 2
    position: relative
    margin-top: -80px
    height: 140px
    width: 150px
    border: 8px solid $stroke
    background: $main
    border-radius: 5px
    box-shadow: inset -20px 0 0px -5px #BEDAF1, inset -25px 0 0px -0px #E9F0FB
    
    
    .arm
      transform: rotate(50deg)
      position: absolute
      top: 0px
      left: -25px
      
      .shoulder
        position: relative
        height: 20px
        width: 20px
        border: 8px solid $stroke
        border-radius: 50%
        background: #4C7ED2
        transform: rotate(-25deg)
        box-shadow: 7px 0px 0px 0px #5092E6 inset
      
      .full-arm
        height: 180px
        width: 20px
        border: 8px solid $stroke
        background: $main
        margin-top: -20px
        box-shadow: inset -12px 0 0px -5px #BEDAF1, inset -15px 0 0px -0px #E9F0FB
        
      .hand
        height: 35px
        width: 80px
        background: $main
        border: 8px solid $stroke
        border-radius: 80px 80px 0 0 
        transform: rotate(-25deg)
        margin-top: -30px
        margin-left: -30px
        box-shadow: inset -20px 0 0px -5px #9ECAE6, inset -30px 0 0px -0px #B1D3ED
        
    .armpit
      height: 35px
      width: 70px
      border: 8px solid $stroke
      border-radius: 0 0 70px 70px
      position: absolute
      top: 40px
      left: 35px
      border-top: none
      transform: rotate(-20deg)
      
.tail
  height: 10px
  width: 90px
  border: 8px solid $stroke
  margin-left: 30px
  margin-top: -8px
  background: #E9F0FB
  position: relative
  z-index: 2
  box-shadow: inset -10px 2px 0px 4px #BEDAF1
    
.tail-circle
  height: 45px
  width: 50px
  border: 8px solid $stroke
  margin-left: 50px
  margin-top: -40px
  border-radius: 50%
  background: #BEDAF1
  position: relative
  z-index: 1
  box-shadow: inset -20px 0px 0px 5px #9ECAE6
  
.leg
  height: 50px
  width: 20px
  border: 8px solid $stroke
  z-index: 0
  transform: rotate(25deg)
  margin-left: 65px
  margin-top: -45px
  background: #BEDAF1
  z-index: 0
  box-shadow: inset 0px 10px 0px -10px #9ECAE6
  
.foot
  height: 35px
  width: 80px
  background: $main
  border: 8px solid $stroke
  border-radius: 80px 80px 0 0 
  transform: rotate(25deg)
  margin-top: -12px
  margin-left: 15px
  box-shadow: inset -35px 0 0px -5px #9ECAE6, inset -60px 0 0px -0px #B1D3ED
  
  
.floor
  height: 8px
  width: 400px
  background: $stroke
  margin-top: 20px
  margin-left: -80px