<div id="bkDiv">
<svg width="100%" height="100%">
<defs>
<mask id="theMask">
<rect width="100%" height="100%" fill="#fff" />
<text x="20" y="120" id="theText" fill="#000">Night CLUB</text>
</mask>
</defs>
<rect width="100%" height="100%" mask="url(#theMask)" fill="#fff" />
</svg>
</div>
/* by Chtiwi Malek */
/* http://www.codicode.com */
body
{
background-color:#fff;
}
#bkDiv
{
margin:-2px auto 0px auto;
background: linear-gradient(-45deg, #036 30%,transparent 45%,transparent 55%,#036 70%), linear-gradient(45deg, #036 30%,transparent 45%,transparent 55%,#036 70%);
background-color: #f00;
background-size: 15px 15px;
background-position:0px 0px;
height:100%;
width:580px;
animation: cAnim 1s linear 0s infinite;
}
@keyframes cAnim
{
100% {background-position:15px 0px;}
}
#theText
{
font-family:Impact, Charcoal, sans-serif;
font-size:120px;
stroke:#000;
stroke-width:5px;
fill-opacity:0.1;
stroke-opacity:1;
animation: cAnim1 0.5s linear 0s infinite;
}
@keyframes cAnim1
{
100% {fill-opacity:0.9;stroke-opacity:0.5;}
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.