.second h1 span,.second h4 span{display:inline-block;opacity:0;text-shadow:0 20px 30px rgba(0,0,0,.6)}<title>FitText</title> @import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700,300);*{margin:0;padding:0;outline:0;list-style:none;text-decoration:none;box-sizing:border-box;color:#000;background:0 0;border:none}.second h1,.second h4{text-align:center;text-transform:uppercase;left:0;right:0;bottom:0;margin:auto;position:absolute}body,html{height:70%;width:70%;title:'FitText'}body{background:#111;overflow:hidden;font-family:Roboto,sans-serif}section{position:absolute;top:0;left:0;transform:translateY(100%);transition:.6s all ease-out 0s}section.active{transform:translateY(0)}.second{height:100%;width:100%;// background:url(https://pgurus.com/wp-content/uploads/2016/04/fbPGurus.jpg) no-repeat center center;background-size:cover}.second h1{letter-spacing:10px;font-size:13px;height:100px;top:0}.second h1 span{font-size:104px;color:#FFF;transform-origin:bottom;perspective:1000px;transform-style:preserve-3d;transform:rotateY(-90deg);transition:.8s all cubic-bezier(.64,.57,.67,1.53)}.second h1 span:nth-of-type(1){transition-delay:.2s}.second h1 span:nth-of-type(2){transition-delay:.4s}.second h1 span:nth-of-type(3){transition-delay:.6s}.second h1 span:nth-of-type(4){transition-delay:.8s}.second h1 span:nth-of-type(5){transition-delay:1s}.second h1 span:nth-of-type(6){transition-delay:1.2s}.second h4{white-space:pre;letter-spacing:4.9px;font-size:28px;height:75px;top:160}.second h4 span{font-size:28px;color:#fff;vertical-align:top;transform-origin:bottom;perspective:300px;transform-style:preserve-3d;transform:rotateY(-90deg);transition:.8s all cubic-bezier(.64,.57,.67,1.53)}.second h4 span:nth-of-type(1){transition-delay:.1s}.second h4 span:nth-of-type(2){transition-delay:.2s}.second h4 span:nth-of-type(3){transition-delay:.3s}.second h4 span:nth-of-type(4){transition-delay:.4s}.second h4 span:nth-of-type(5){transition-delay:.5s}.second h4 span:nth-of-type(6){transition-delay:.6s}.second h4 span:nth-of-type(7){transition-delay:.7s}.second h4 span:nth-of-type(8){transition-delay:.8s}.second h4 span:nth-of-type(9){transition-delay:.9s}.second h4 span:nth-of-type(10){transition-delay:1s}.second h4 span:nth-of-type(11){transition-delay:1.1s}.second h4 span:nth-of-type(12){transition-delay:1.2s}.second h4 span:nth-of-type(13){transition-delay:1.3s}.second h4 span:nth-of-type(14){transition-delay:1.4s}.second h4 span:nth-of-type(15){transition-delay:1.5s}.second h4 span:nth-of-type(16){transition-delay:1.6s}.second h4 span:nth-of-type(17){transition-delay:1.7s}.second h4 span:nth-of-type(18){transition-delay:1.8s}.second h4 span:nth-of-type(19){transition-delay:1.9s}.second h4 span:nth-of-type(20){transition-delay:2s}.second h4 span:nth-of-type(21){transition-delay:2.1s}.second h4 span:nth-of-type(22){transition-delay:2.2s}.second h1.active span,.second h4.active span{opacity:1;transform:rotateX(0)}#logoman{position:absolute;height:100%;width:100%}