html{
	height:100%;
}
body{
	margin:0;
	padding:0;
	height:100%;
	overflow:hidden;
	background:white;
	color:black;
	text-align:center;
}
.panel{
	width:35%;
	overflow:hidden;
	height:100%;
	float:left;
}
#panel-l{
	padding:10% 5% 10% 10%;
}
#panel-r{
	padding:10% 10% 10% 5%;
}
.panel a img{
	width:100%;
	height:auto;
}
a{
	color:black;
	text-decoration:none;
	cursor:pointer;
	transition: 0.4s ease-out;
	opacity:0.4;
}
a:hover{
	opacity:1;
}
@media screen and (orientation:portrait) { 
	.panel{
		width:80%;
		overflow:hidden;
		height:30%;
		float:none;
	}
	.panel a img{
		width:80%;
		height:auto;
	}
	#panel-l, #panel-r{
		padding:10%;
	}
	#panel-l{
		margin-bottom:10%;
	}
}
