/* ********************************************
 * Main Page Rules
 * ********************************************/
 
/*
 * Mobile (< 600px)
 */

body {
    background-image: url('../img/background.jpg');
    background-repeat:repeat;
}

#mainPageContent > header{
	background : url('../img/siteHeader.jpg');
	background-size : 100%;
	background-attachment : fixed;
	box-shadow: inset 0 0 10em 10em #222222;
	color : white;
	padding-bottom : 2em;
}
#mainPageContent > header  > video {
	width : 0%;
	height : 0%;
}
#mainPageContent > section > figure{
	width : 0px;
	height : 0px;
}
#mainPageContent > section > figure > img{
	width : 0px;
	opacity : 0;
}
#mainPageContent > section:nth-child(2n) > figure{
	order : 2;
	padding-left : 1em;
}

/*
 * Tablet Portrait + (> 768px && < 1024px)
 */
@media (min-width: 768px) {
	#mainPageContent > header  {
		padding-top : 10em;
		box-shadow: inset 0 0 13em 13em #222222;
	}
	#mainPageContent > header > *{
		font-size : 2em;
	}
	#mainPageContent > header  > h1 {
		font-size : 7em;
	}
}

/*
 * Tablet Landscape (> 1024px && < 1366px)
 */
@media (min-width : 1024px) {
	#mainPageContent > section {
		display : flex;
		flex-direction: row;
		align-items: center;
	}
	#mainPageContent > section > figure{
		width : initial;
		height : initial;
	}
	#mainPageContent > section > figure > img{
		width : 100%;
		opacity : 1;
	}
}
/*
 * Computer (> 1366px)
 */
@media (min-width : 1366px) {
	#mainPageContent > header  {
		box-shadow: inset 0 0 17em 17em #222222;
	}
	#mainPageContent > header  > video {
		width : 480px;
		float : right;
		margin : 0em 2em;
	}
}