@media (orientation: landscape)
{
    nav li
    {
	width: 23vw;
    }

    .dual
    {
	position: fixed;
	min-height: 66vh;
    }

    .dual article
    {
	position: absolute;
	width: 50vw;
	min-height: 66vh;
    }

    .dual article > div
    {
	position: absolute;
	width: 80%;
    }

    .dual article:first-of-type
    {
	left: -5vw;
	transform: skew(+10deg);
	transition: all 0.5s ease-in-out 1s;
    }

    .dual article:first-of-type > div
    {
	right: 5%;
	direction: rtl;
    }
    
    .dual article:first-of-type > div > *
    {
	margin-left: 5%;
	direction: ltr;
    }

    .dual article:last-of-type
    {
	right: -5vw;
	transform: skew(-10deg);
	transition: all 0.5s ease-in-out 1s;
    }

    .dual article:last-of-type > div
    {
	text-align: right;
	left: 5%;
    }

    .dual article.hidden:first-of-type
    {
	left: -100vw;
    }

    .dual article.hidden:last-of-type
    {
	right: -100vw;
    }

    .scrolleft
    {
	width: 90%;
	height: 90%;
	overflow: auto;
    }

    .dual article:first-of-type h1,
    .dual article:first-of-type h2,
    .dual article:first-of-type h3,
    .dual article:first-of-type h4,
    .dual article:first-of-type h5,
    .dual article:first-of-type label,
    .dual article:first-of-type p
    {
	transform: skew(-10deg);
    }

    .dual article:last-of-type h1,
    .dual article:last-of-type h2,
    .dual article:last-of-type h3,
    .dual article:last-of-type h4,
    .dual article:last-of-type h5,
    .dual article:last-of-type label,
    .dual article:last-of-type p
    {
	transform: skew(+10deg);
    }

    .youtube
    {
	overflow: hidden;
	padding: 0px !important;
	height: 100%;
	transform: skew(0deg) !important;
	right: 0px !important;
	transition: all 0.5 ease-in-out;
    }

    .youtube.hidden
    {
	right: -100vw !important;
    }
    
    iframe
    {
	position: absolute;
	border-radius: 20px;
    }
}