@keyframes oriandleft{
	0%{color: rgba(0,0,0,0);}
	100%{color: rgba(0,0,0,0);}
}

@keyframes oriandleft_img{
	from{opacity: 0;}
	to{opacity: 0;}
}


.leftmode .content img{
	width: 60%;
	animation-name: oriandleft_img;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}
.leftmode .content{
	left: 10%;
	width: 10%;
	height: 80%;
	animation-name: oriandleft;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}

.leftmode #hiddenText{
	display: none;
}
.leftmode #subTitle{
	display: none;
}
.leftmode .yhref span{
	font-size: 0pt;
}
.leftmode .yhref{
	font-size: 130%;
	margin: 2px;
	line-height: 2px;
	animation-name: oriandleft;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}
.leftmode #frame{
	top:50%;
	transform: translateY(-50%);
}

@media (max-width: 800px){
	.leftmode .content{
		top:150%;
		left:50%;
		opacity: 0;
		width: 75%;
		animation-name: oriandleft;
		animation-duration: 0.8s;
		animation-iteration-count: 1;
	}
}