

@media(max-width:768px){
menu.flex.row{
	position: fixed;
	left: 0;
	height: var(--header-height);
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction:column;
    -moz-flex-direction:column;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-align-items: center;
    align-items: center;
    transition: all .3s;
}

#header.opaque menu.flex.row{height: var(--header-height-alt);}
menu.flex.row.opened, #header.opaque menu.flex.row.opened{height: 100vh; padding-top: 10px; padding-top: bottom; background: rgba(0,0,0,.75);}

menu .logo{padding: 10px; position: relative; max-height: var(--header-height);}
menu.opened .logo{height: var(--header-height);}
menu .logo::after{
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	margin: 0 auto;
	height: 12px;
	width: 12px;
	border-bottom: 2px solid rgba(255,255,255,.75);
	border-right: 2px solid rgba(255,255,255,.75);
	transform: rotate(45deg) translateX(2px);
	transition: all .3s;
}
menu.opened .logo::after{
	bottom: -10px;
	transform: rotate(225deg) translateX(-2px);
}

menu li{
	transition: all .3s;
}

menu li a{
	padding-top: 10px;
	padding-bottom: 10px;
}

menu li a{
	padding-top: 10px;
	padding-bottom: 10px;
}

menu.opened li:not(.logo){max-height: 100vh}
menu li:not(.logo){max-height: 0px; overflow: hidden;}

#yt-presentation{
	width: 100%;
	height: calc(56.25vw - 30px);
}


.lady:not(.full){height: 40vw;}

.lady:not(.full) > div{
	width: calc(50% + (var(--20px) * 3));
	z-index: -1;
}

.lady h2{font-weight: 400}

.lady:hover{
	z-index: 1;
}

.lady:not(.full) .resume{
	max-height: 0px;
	transition: max-height .1s;
}

.lady:hover .resume{
	max-height: 2000px;
	box-shadow: -9px 12px 15px 0 rgba(0, 0, 0, 0.28);
}

.lady:not(.full) p{
	border-top: 1px solid rgba(255,255,255,.35);
	border-bottom: 1px solid rgba(255,255,255,.35);
}

.lady.full h3{
	border-bottom: 1px solid rgba(255,255,255,.35);
}
}
