body {
	width: 100%;
	height: 100%;
	background-color: #fff;
}
div#canvas-frame{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow:hidden;
	background-color: #fafafa;
	position: absolute;
	opacity: 0.7;
	z-index: 1;
}
#main-bg {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(200,200,200,0.35);
	position: absolute;
	z-index: 3;
}
#main-dot {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/dot-pattern.png);
	background-size: 180px auto;
	opacity: 0.5;
	position: absolute;
	z-index: 2;
}

#title {
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	color: #909090;
	font-size: 50px;
	font-family: 'Julius Sans One', sans-serif;
	text-align: center;
	width: 300px;
	height: 50px;
	margin: auto auto;
	position: absolute;
	z-index: 5;
	opacity: 0;
	 animation: animation-title 2.5s ease-in-out .5s forwards;
}

@keyframes animation-title {
	from{
		opacity: 0;
	}
	to{
		opacity: 1;
	}
}