JSFiddle - React, Tailwind, and code Playground

by adem

HTML

<link href='http://fonts.googleapis.com/css?family=Lobster+Two:700italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300' rel='stylesheet' type='text/css'>
<div id="wrapper">
    <div id="name">
        aydio.de
        <footer>creating audio since 1991</footer>
    </div>
</div>

CSS

html {
    font: bold italic 64px/1em 'Lobster Two';
    color: #161616;
}

footer {
    position: relative;
    top: -1.9em;
    left: 4.5em;
    font-size: 0.208333em;
    text-shadow: none;
    letter-spacing: 0;
    text-indent: 10px;
    color: #fff;
text-shadow: 1px 1px 0 #306E73, 2px 2px 0 #306E73, 3px 3px 0 #306E73, 4px 4px 0 #306E73;
}

#name { padding: 30px; background: #24282B; color: #fff; width: 3.75em; height: 1.5em;
text-shadow: 1px 1px 0 #306E73, 2px 2px 0 #306E73, 3px 3px 0 #306E73, 4px 4px 0 #306E73, 5px 5px 0 #306E73, 5px 5px 0 #306E73, 6px 6px 0 #306E73, 7px 7px 0 #306E73, 8px 8px 0 #306E73, 9px 9px 0 #306E73, 10px 10px 0 #306E73;
}

#wrapper:hover {
    margin-left: 0;
}
span {
}