body, html {
	margin: 0;
	height: 100%;
	overflow: hidden;
	cursor: pointer
}

.text {
	    margin-top: 115px;
		font-size: 36px;
}

.left-part {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-125%);
	animation-name: left-part;
    animation-duration: 3s;
}

.right-part {
    position: absolute;
    left: 50%;
    top: 50%;
	transform: translate(-50%,-64%);
	animation-name: right-part;
    animation-duration: 3s;
}

.left-text {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,170%);
	width: 600px;
	display: none;
}

.right-text {
    position: absolute;
    left: 50%;
    top: 50%;
	transform: translate(-50%,345%);
	width: 600px;
	display: none;
}

.left-text-animation{
	animation-name: left-text;
    animation-duration: 3s;
	display:block;
}

.right-text-animation{
	animation-name: right-text;
    animation-duration: 3s;
	display: block;
}

@keyframes left-part {
    from {transform: translate(-400%,-125%);}
    to {transform: translate(-50%,-125%);}
}

@keyframes right-part {
    from {transform: translate(950%,-64%);}
    to {transform: translate(-50%,-64%);}
}

@keyframes left-text {
    from {transform: translate(-400%,170%);}
    to {transform: translate(-50%,170%);}
}

@keyframes right-text {
    from {transform: translate(-400%,345%);}
    to {transform: translate(-50%,345%);}
}