HTML { width:100%;margin:0;padding:0;background: #000;}
BODY { width:100%;height:100vh;margin:0;padding:0; overflow:hidden;}

.logo { font-size: 18px; color: #333; display: inline-block; position: relative; left: 20px; 
	top: 35%;
	transform: translateY(-50%);
	font-family: "Chakra Petch";
	font-weight: 400;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	background-color: transparent;vertical-align:middle;
}

canvas:before {
background: url("/assets/img/home-bg.jpg") top center no-repeat;
background-size: cover;
background-attachment:fixed;
opacity: 1;
}

canvas {
display: block;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
overflow:hidden;
opacity:.4;
}


.e404 { z-index:100;left: 0; line-height: 100px; margin-top: -100px; position: absolute; text-align: center; top: 40%; width: 100%; font-family
: "Chakra Petch", sans-serif; font-display: swap; background-color: transparent; 
}
.e404 .logotext { font-size: 100px;font-weight:700;font-family:"Chakra Petch";display:inline-block;color: #E03A3C;}
.e404 .title { color: #fff; font-size: 62px;font-weight:700;}
.e404 .text { color: #CCC; font-size: 70px;}
.e404 .fix { color: #7BBD31; font-size: 40px;}
.e404 .h2  { font-size: 30px; color: #FFFFFF; font-family:"Chakra Petch";height:30px;}
.e404 .h2 a { font-size: 20px; color: #E03A3C; font-family:"Chakra Petch";text-decoration:none;height:30px;}
.e404 .h2 a:hover { font-size: 20px; color: #fff; font-family:"Chakra Petch";text-decoration:none;height:30px;}
.enum { position:relative; top: -100px; color: #CCC; font-size: 300px;}


/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {
  width: 100%;
  height: 100vh;
  /*background-color: rgba(0,200,0,.5);*/
  background: url("/assets/img/home-bg.jpg") top center no-repeat;
  background-size: cover;
  background-attachment:fixed;
  position: relative;
  padding-top: 82px;
}

#hero:before {
  content: "";
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}

#hero .quote {
font-family: "Playfair Display";
font-family: "Chakra Petch";
font-style: italic;
font-size: 12px;
color: #DDD;
}