.effecttext4{font-size:50px;color:#000;text-transform:uppercase;text-align:center;margin:0 auto;font-family:Helvetica,Arial,sans-serif;display:inline-block}@media screen and (max-width:800px){.effecttext4{font-size:30px}}.effecttext4 .animation{position:relative;width:100%}.effecttext4 .animation div{height:100%;overflow:hidden;transform:skewX(-20deg);width:50%}.effecttext4 .animation div:before{height:4px;content:"";position:absolute;background:#000;width:0}.effecttext4 .animation span{padding:0 10px}.effecttext4 .animation-left:before{animation:widthLineLeft 1.2s cubic-bezier(.68,-.55,.265,1.1) .4s forwards;left:0}.effecttext4 .animation-left span{animation:slideLeft 1.2s cubic-bezier(.68,-.55,.265,1.1) .3s forwards;transform:translateX(900px) skewX(20deg);display:block}.effecttext4 .animation-right{right:0;position:absolute;top:0}.effecttext4 .animation-right:before{animation:widthLineRight 1.2s cubic-bezier(.68,-.55,.265,1.1) .4s forwards;right:0;bottom:0}.effecttext4 .animation-right span{animation:slideRight 1.2s cubic-bezier(.68,-.55,.265,1.1) .3s forwards;transform:translateX(-900px) skewX(20deg);position:absolute;left:-100%;width:100%}@keyframes slideLeft{0%{transform:translateX(900px) skewX(20deg)}to{transform:translateX(0) skewX(20deg)}}@keyframes slideRight{0%{transform:translateX(-900px) skewX(20deg)}to{transform:translateX(0) skewX(20deg)}}@keyframes widthLineLeft{0%{left:0;width:0}50%{left:0;width:100%}to{left:100%;width:0}}@keyframes widthLineRight{0%{right:0;width:0}50%{right:0;width:100%}to{right:100%;width:0}}