.template{background-image:url(../print/textures/clear.jpg)}
.tpl{padding:0 .5em}
.tpl:before,.tpl p:before,.tpl p:after{
  display:none
}
.tpl p{
  perspective:300px;
  color:#fff
}
.tpl p span{
  display:inline-block;
  background:url(../print/textures/dust.png),linear-gradient(90deg,#00b7ea 0%,#009ec3 100%);
  box-shadow:-1px 0 2px rgba(255,255,255,.4),-2px 0 0 #00adda,-2px 7px 9px rgba(0,0,0,.5)
}
.tpl p span:nth-child(n+5){
  background:url(../print/textures/dust.png),linear-gradient(90deg,#009ec3 0%,#00b7ea 100%);
  box-shadow:1px 0 2px rgba(255,255,255,.4),2px 0 0 #00adda,-2px 7px 9px rgba(0,0,0,.5)
}
.tpl p span:after{
  text-shadow:0 0 .7px,0 0 1.1px,-1px 1px 2px rgba(0,0,0,.6)
}
.tpl p span:nth-child(n+5):after{
  text-shadow:0 0 .7px,0 0 1.1px,1px 1px 2px rgba(0,0,0,.6)
}
.tpl p span:before,.tpl p span:after{
  width:.9em
}
.char1,.char8{z-index:1}
.char2,.char7{z-index:2}
.char3,.char6{z-index:3}
.char4,.char5{z-index:4}

.char4{transform:rotateY(40deg)translateZ(40px);margin-right:25px}
.char5{transform:rotateY(-40deg)translateZ(40px)}
.char3{transform:rotateY(38deg)translateZ(30px)}
.char6{transform:rotateY(-38deg)translateZ(30px)}
.char2{transform:rotateY(26deg)translateZ(20px)}
.char7{transform:rotateY(-26deg)translateZ(20px)}
.char1{transform:rotateY(10deg)translateZ(10px)}
.char8{transform:rotateY(-10deg)translateZ(10px)}

.char1:before,.char1:after{content:"A"}
.char2:before,.char2:after{content:"B"}
.char3:before,.char3:after{content:"C"}
.char4:before,.char4:after{content:"D"}
.char5:before,.char5:after{content:"E"}
.char6:before,.char6:after{content:"F"}
.char7:before,.char7:after{content:"G"}
.char8:before,.char8:after{content:"H"}
#dropbox:after{content:"L E T T E R I N G"}