@font-face {

font-family: 'jellykaVampire';

src: URL('jellykaVampire.ttf') format ('ttf');

}


html,body {
	height:100%;
	width:100%;
}

body {
    zoom: 0.75;
	background-color: white;
	display: table;
	overflow: hidden;
    background-color: black;
    pointer-events: none;
}

body h1 {
    margin: -50px 350px;
    display: block;
}

#canvas {

	margin: 5px auto;
	display: block;
    border: solid 2px black;
    cursor: none !important;
}

#text
{
    text-align: center;
    font-size: 30px;
    width: 500px;
    height: 50px;
    display: block;
    margin: auto;
}

.effect
{
  	position:relative;       
    -webkit-box-shadow:0 1px 80px rgba(0, 0, 0, 0.3), 0 160px 160px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 80px rgba(0, 0, 0, 0.3), 0 160px 160px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 80px rgba(0, 0, 0, 0.3), 0 160px 160px rgba(0, 0, 0, 0.1) inset;
}
.effect:before, .effect8:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 80px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 80px rgba(0,0,0,0.8);
    box-shadow:0 0 80px rgba(0,0,0,0.8);
    top:40px;
    bottom:40px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
} 
.effect:after
{
	right:10px; 
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg); 
       -moz-transform:skew(8deg) rotate(3deg);     
        -ms-transform:skew(8deg) rotate(3deg);     
         -o-transform:skew(8deg) rotate(3deg); 
            transform:skew(8deg) rotate(3deg);
}