* { margin:0; padding:0; } 
html, body { width:100%; height:100%; overflow: hidden;} 
canvas { 
display:block;
background: #000;
}


#controls {
  margin: 20px;
  position: absolute;
  top: 0; left: 0;
  color: white;

    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
	font-family:  Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";

}
.lion {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	z-index: 100;
	padding-top: 10%;
	margin: 0px auto;
	text-align: center;
	
}
@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.logo {
	font-size: 270px !important;
	font-weight: lighter;
	color: #ededed;
	letter-spacing: 10px;
    margin-bottom: -20px;
	padding: 0;
	}
.largeo { 
	margin: 0% auto;
	text-align: center;
	position: absolute;
	top: 35%;
	width: 99%
	}
	.smalleo {
		font-size: 20px;
		letter-spacing: 14px;
	}
.surround {
    width: 60%;
	text-align: center;
	margin: 20%;
	psotion: relative
}