body {
		position: relative;
		margin: 0;
		overflow: hidden;
	}

	.intro-container {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		color: white;
		text-align: center;
		margin: 0 auto;
		right: 0;
		left: 0;
	}

	h1 {
		font-family: 'brandon-grotesque', sans-serif;
		font-weight: bold;
		margin-top: 0px;
		margin-bottom: 0;
		font-size: 20px;
	}

	@media screen and (min-width: 860px) {
		h1 {
			font-size: 40px;
			line-height: 52px;
		}
	}

	.fancy-text {
		font-family: "adobe-garamond-pro", sans-serif;
		font-style: italic;
		letter-spacing: 1px;
		margin-bottom: 17px;
	}

	.button {
		position: relative;
		cursor: pointer;
		display: inline-block;
		font-family: 'brandon-grotesque', sans-serif;
		text-transform: uppercase;
		min-width: 200px;
		margin-top: 30px;
	}

	.button:hover .border {
		box-shadow: 0px 0px 10px 0px white;
	}

	.button:hover .border .left-plane,
	.button:hover .border .right-plane {
		transform: translateX(0%);
	}

	.button:hover .text {
		color: #121212;
	}

	.x-mark {
		right: 10px;
		top: 10px;
		position: absolute;
		cursor: pointer;
		opacity: 0;
	}

	.x-mark:hover .right {
		transform: rotate(-45deg) scaleY(1.2);
	}

	.x-mark:hover .left {
		transform: rotate(45deg) scaleY(1.2);
	}

	.x-mark .container {
		position: relative;
		width: 20px;
		height: 20px;
	}

	.sky-container {
		position: absolute;
		color: white;
		text-transform: uppercase;
		margin: 0 auto;
		right: 0;
		left: 0;
		top: 2%;
		text-align: center;
		opacity: 0;
	}

	@media screen and (min-width: 860px) {
		.sky-container {
			top: 18%;
			right: 12%;
			left: auto;
		}
	}

	.sky-container__left,
	.sky-container__right {
		display: inline-block;
		vertical-align: top;
		font-weight: bold;
	}

	.sky-container__left h2,
	.sky-container__right h2 {
		font-family: 'brandon-grotesque', sans-serif;
		font-size: 26px;
		line-height: 26px;
		margin: 0;
	}

	@media screen and (min-width: 860px) {

		.sky-container__left h2,
		.sky-container__right h2 {
			font-size: 72px;
			line-height: 68px;
		}
	}

	.sky-container__left {
		margin-right: 5px;
	}

	.sky-container .thirty-one {
		letter-spacing: 4px;
	}

	.text-right {
		text-align: right;
	}

	.text-left {
		text-align: left;
	}

	.twitter:hover a {
		transform: rotate(-45deg) scale(1.05);
	}

	.twitter:hover i {
		color: #21c2ff;
	}

	.youtube:hover a {
		transform: rotate(45deg) scale(1.05);
	}

	.youtube:hover i {
		color: #ec4c44;
	}
canvas{
	width: 1200px;
    height: 907px;
    position: absolute;
    top: 0px;
    z-index: -1;
}
.layadmin-user-login-main {
    width: 400px;
    margin: 100px auto;
    box-sizing: border-box;
    background: #fff;
}