@charset "UTF-8";


header .container {
	position: relative;
	min-height: 100vh;
}
header .container .page-scroll {
	margin-top: 100px;
}

.inview {
	position: relative;
	top: 200px;
	opacity: 0;
	transition: all .7s ease-out;
}
.inviewFade {
	top: 0;
	opacity: 1;
}

@media (min-width:751px) {
	#portfolio .inview:nth-of-type(1) {	transition-delay: .1s;}
	#portfolio .inview:nth-of-type(2) {	transition-delay: .2s;}
	#portfolio .inview:nth-of-type(3) {	transition-delay: .3s;}
	#portfolio .inview:nth-of-type(4) {	transition-delay: .4s;}
	#portfolio .inview:nth-of-type(5) {	transition-delay: .5s;}
	#portfolio .inview:nth-of-type(6) {	transition-delay: .6s;}
	#portfolio .inview:nth-of-type(7) {	transition-delay: .7s;}
	#portfolio .inview:nth-of-type(8) {	transition-delay: .8s;}
	#portfolio .inview:nth-of-type(9) {	transition-delay: .9s;}
}

.titleInview {
	position: relative;
	right: -300px;
	opacity: 0;
	transition: all .7s ease-out;
}
.titleInviewFade {
	right: 0;
	opacity: 1;
}

.mvInview {
	position: relative;
	opacity: 0;
	top: 100px;
	transition: all 1s ease-out;
}
.mvInviewFade {
	top: 0;
	opacity: 1;
}
.mvInview:nth-child(2) {	transition-delay: 1s;}
.mvInview:nth-child(3) {	transition-delay: 2s;}

#myWebsite a { text-decoration: underline;}
#myWebsite a:hover { text-decoration: none;}
#myWebsite img {  max-width: 100%;}
#myWebsite em {
	font-style: normal;
	font-weight: bold;
	background-color: #faf70b;
}
#myWebsite em a {	color: #00f;}
#myWebsite section {  padding: 50px 0;}
#myWebsite section p {
	margin-bottom: 1em;
	font-size: 16px;
}
#myWebsite section p:last-child {  margin-bottom: 0;}
#myWebsite section .note { font-size: 12px;}
#fanzine section {  padding: 50px 0;}
#fanzine img {  max-width: 100%;}

@media (max-width:750px) {
	#fanzine .list > div:nth-child(3n+1) {
		clear: both;
	}
}