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

body {
	background: #000;
	text-align: center;
	-webkit-text-size-adjus: 100% !important;
}

body::before {
	content: "";
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

p {
	box-sizing: border-box
}

*,*:before,*:after {
	box-sizing: inherit;
	margin: 0;
	padding: 0
}

img{border:none}
a{text-decoration:none}
ol, ul {list-style: none}
table {border-collapse: collapse;border-spacing: 0}
input, select {vertical-align: middle}
.l {
	position: relative;
                left:-123px;
	z-index: 101
}
.r {
	position: relative;
                right:-123px;
	z-index: 101
}
.logo_left {
	position: absolute;
	top: 20px;
	left: 30px;
	padding: 10px;
	font-size: 24px;
	font-weight: bold;
	color: #fff;
	z-index: 101
}

.logo_right {
	position: absolute;
	top: 20px;
	right: 21px;
	padding: 10px;
	font-size: 24px;
	font-weight: bold;
	color: #fff;
	z-index: 101
}
.container a.one::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 20px;
	height: 20px;
	border-top: 3px solid aqua;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.two::before {
	content: '';
	position: absolute;
	top: 46px;
	left: 0;
	width: 20px;
	height: 20px;
	border-left: 3px solid aqua;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.three::before {
	content: '';
	position: absolute;
	top: 46px;
	right: 0;
	width: 20px;
	height: 20px;
	border-right: 3px solid aqua;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.four::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 20px;
	height: 20px;
	border-top: 3px solid aqua;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.whatsverse::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 20px;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.one::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 20px;
	height: 20px;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.two::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 20px;
	height: 20px;
	border-bottom: 3px solid aqua;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.three::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 20px;
	height: 20px;
	border-bottom: 3px solid aqua;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.four::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 20px;
	height: 20px;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a.whatsverse::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 0;
	height: 20px;
	border-bottom: 3px solid aqua;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.container a:hover::before,a:hover::after {
	width: 100%;
	height: 100%;
	transition-delay: 0s;
}

.container a:hover {
	background-color: aqua;
	color: #000;
	box-shadow: 0 0 50px #21ebff;
	transition-delay: 0.3s;
}

.container a:nth-child(1) {
	filter: hue-rotate(195deg);
}

.container a:nth-child(2) {
	filter: hue-rotate(250deg);
}

.container a:nth-child(3) {
	filter: hue-rotate(320deg);
}

.container a:nth-child(4) {
	filter: hue-rotate(0deg);
}

.container a:nth-child(5) {
	filter: hue-rotate(500deg);
}

.scene {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	perspective: 15px;
	perspective-origin: 50% 50%;
}

.wrap {
	position: absolute;
	width: 1000px;
	height: 1000px;
	left: -500px;
	top: -500px;
	transform-style: preserve-3d;
	animation: move 12s infinite linear;
	animation-fill-mode: forwards;
}

.wrap:nth-child(2) {
	animation: move 12s infinite linear;
	animation-delay: 6s;
}

.wall {
	width: 100%;
	height: 100%;
	position: absolute;
	background: url(../img/sg.jpg);
	background-size: cover;
	opacity: 0;
	animation: fade 12s infinite linear;
}
.wrap:nth-child(2) .wall {
	animation-delay: 6s;
}
.wall-right {
	transform: rotateY(90deg) translateZ(500px);
}
.wall-left {
	transform: rotateY(-90deg) translateZ(500px);
}
.wall-top {
	transform: rotateX(90deg) translateZ(500px);
}
.wall-bottom {
	transform: rotateX(-90deg) translateZ(500px);
}
.wall-back {
	transform: rotateX(180deg) translateZ(500px);
}
@keyframes fade {
	0% {
		opacity: 0;
	}

	25% {
		opacity: 1;
	}

	75% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}
@keyframes move {
	0% {
		transform: translateZ(-500px) rotate(0deg);
	}

	100% {
		transform: translateZ(500px) rotate(0deg);
	}
}
@-webkit-keyframes rotation{from{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}.Rotation{-webkit-transform:rotate(360deg);animation:rotation 8s linear infinite;-moz-animation:rotation 8s linear infinite;-webkit-animation:rotation 8s linear infinite;-o-animation:rotation 8s linear infinite}.Rotation:hover{-webkit-animation-play-state:paused;animation-play-state:paused}@keyframes mylogo{from{top:5px}to{top:-5px}}@-moz-keyframes mylogo{from{top:5px}to{top:-5px}}@-webkit-keyframes mylogo{from{top:5px}to{top:-5px}}@-o-keyframes mylogo{from{top:5px}to{top:-5px}}.imagelogo{float:left;position:relative;width:604px;height:160px;margin-left:12px;padding:0;cursor:pointer;animation:mylogo 2s linear 0s infinite alternate;-moz-animation:mylogo 2s linear 0s infinite alternate;-webkit-animation:mylogo 2s linear 0s infinite alternate;-o-animation:mylogo 2s linear 0s infinite alternate}
.abcd{
padding:0 1px;
font-size:21px;
font-weight:bold;
color:#391105;
text-shadow: 0 0 10px #ffff00,
                    0 0 20px #ffff00,
                    0 0 30px #ffff00,
                    0 0 40px #fff700,
                    0 0 70px #fff700,
                    0 0 80px #fff700,
                    0 0 100px #fff700,
                    0 0 150px #fff700;
animation: light 1.5s ease infinite alternate;
}
.zwz h3 {
	margin-bottom: 0;
	font-weight: bold;
	font-size: 23px;
	color: #000;
	text-shadow: 0 0 10px #ffff00,
                    0 0 20px #ffff00,
                    0 0 30px #ffff00,
                    0 0 40px #fff700,
                    0 0 70px #fff700,
                    0 0 80px #fff700,
                    0 0 100px #fff700,
                    0 0 150px #fff700;
}
.zwz h3 {
	animation: light 1.5s ease infinite alternate;
}