/* CSS Document */



html, body{
	overflow-x:hidden;
	color:#fff;
	background-color: #000;
	font-family: tornac,sans-serif;
font-weight: 400;
font-style: normal;
}

h1 {
	padding-top:20vh;
	margin-bottom:2rem;	
	font-size:  4rem;
}

h2 {
	text-align: center;
	margin-bottom:3rem;	
	font-size:  3rem;
}

a, a:hover{
text-decoration: none;
	color:inherit;
}

ul {
  list-style-type: none;
	list-style-position: inside;
	padding:0;
}
li {
	padding-bottom: 0.5rem;
	text-align: center;
	text-shadow: #000 2px 2px 4px;
	font-family: ff-duper-web-pro,sans-serif;
font-weight: 400;
font-style: normal;
	font-size: 1.3rem;
}

iframe {
    width: 100vw;
    height: 56vw;
	display:block;
}

#welcome-section {
    background-image: url(img/welcome.jpg);
    background-size: cover;
	background-position: center;
    height: 100vh;
}

#welcome-section .col{
	height: 100vh;
}

#welcome-section #col-text{
	padding-left: 10%;
}

#welcome-section p {
	font-size:  1.8rem;
	padding-left:2rem;
	font-family: ff-duper-web-pro,sans-serif;
font-weight: 400;
font-style: normal;
}

#social-container{
	width:100%;
	position: absolute;
	text-align: center;
	bottom: 15vh;
	left:0;
}

#social{
	margin:auto;
}

#social a{
	margin: 0 1rem;
}

#social span{
	font-size: 2rem;
}

#scene-section, #film-section, #cursus-section, #rumble-section {
    background-size: cover;
	padding:5rem;
}

#scene-section {
    background-image: url(img/scene.jpg);
	background-size: cover;
	background-position: left center;
}


#rumble-section {
    background-image: url(img/JamiroRumble.jpg);
	background-size: cover;
	background-position: left center;
}

#rumble-texte{
	/*background-color: rgba(0, 0, 0, 0.5);*/
	}

#scene-texte{padding-right: 5%;}

#scene-photos .scene-photo {
	height: 50vh;
	background-size: cover;
	background-position: center;
}

#scene-photo1{background-image: url(img/dom-juan.jpg);}
#scene-photo2{background-image: url(img/pirate.jpg);}
#scene-photo3{background-image: url(img/miguel.jpg);}
#scene-photo4{background-image: url(img/marvel.jpg);}
#scene-photo5{background-image: url(img/fil-a-la-patte.jpg);}
#scene-photo6{background-image: url(img/jedi-web.jpg);}

#rumble-photos .rumble-photo {
	height: 50vh;
	background-size: cover;
	background-position: center;
}

#rumble-photo1{background-image: url(img/rumble1.jpg);}
#rumble-photo2{background-image: url(img/rumble2.jpg);}
#rumble-photo3{background-image: url(img/rumble3.jpg);}
#rumble-photo4{background-image: url(img/rumble4.jpg);}

#film-section{
	background-image: url(img/film.jpg);
	background-size: cover;
	background-position: bottom right;
}

#book .book-col{
	height: 50vh;
	background-size: cover;
	background-position: top center;
}

#book-photo1{background-image: url(img/book1.jpg);}
#book-photo2{background-image: url(img/book2.jpg);}
#book-photo3{background-image: url(img/book3.jpg);}
#book-photo4{background-image: url(img/book4.jpg);}
#book-photo5{background-image: url(img/book5.jpg);}
#book-photo6{background-image: url(img/book6.jpg); background-position: top right !important;}

#cursus-section {
	background-image: url(img/cursus.jpg);
	background-position: center;
}

#footer-section{
	padding:1rem;
	text-align: center;
color:#ccc;}

#footer-section img{
	height: 25px;
	width:auto;
}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) { 
	h1 {
	padding-top:15vh;
	font-size:  3rem;
}
#welcome-section p {
	font-size:  1.5rem;
	padding-left:2rem;
}
	#social-container{
	bottom: 30vh;
	left:auto;
}
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) { 
	
	#scene-section {
	padding:0;
}
#rumble-section {
	padding:0;
}
	#scene-texte{
		padding:2rem;
		background-image: url(img/scene.jpg);
	background-size: cover;
	background-position: center;
	}

#rumble-texte{
		padding:2rem;
		background-image: url(img/JamiroRumble.jpg);
	background-size: cover;
	background-position: center;
	}

	#scene-photos .scene-photo {
	height: 33vh;
		background-position: center top;
}
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) { 

	h1 {
	padding-top:10vh;
	font-size:  2.5rem;
}
	#welcome-section{background-position: 65%;}
#welcome-section p {
	font-size:  1rem;
	padding-left:1rem;
}
	#social-container{
	bottom: 20vh;
	left:auto;
}
	#social span{
	font-size: 1.5rem;
}
#scene-section {
	background-position: center;
}
#rumble-section {
	background-position: center;
}
	
	li {
		
	font-size: 1rem;
}
	
	#film-section, #cursus-section{padding:2rem;}
	#film-section{background-position: right 25% center;
	}
}

#ml, #ml h1, #ml h2{
padding:inherit;
	text-align: center;
}