@media handheld, only screen and (max-width: 1450px), only screen and (max-device-width: 1450px) {
	#contact form textarea {
		height: 100px;
	}
	.video, #contact .video {
		margin-top:-250px
	}
}

@media handheld, only screen and (max-width: 1350px), only screen and (max-device-width: 1350px) {
	.introvideo {
		width: 40%;
	}
	.video, #contact .video {
		width: 60%;
		margin-right:-5%;
		margin-top:-250px
	}
	#contact form textarea {
		height: 150px;
	}
	.introphoto {
		width: 50%;
	}
	.photo {
		width: 75%;
		margin-right: -30%;
	}
}

@media handheld, only screen and (max-width: 1200px), only screen and (max-device-width: 1200px) {
	section, article, aside, #presse, #podcast, #etape2, #etape5, #interlude, #etape4, #etape7 {
		padding:60px 15%;
		}

	h1, h2 {
		margin:0 0 30px 0;
	}
	
	#home .logo, footer .logo { 
		width: 80%;
		max-width:500px;
	}

	.realisation {
		width: 48%;
		}	

	#prestations ul li {
		width: 44%;
		}

	#etapes .legende {
		position: relative;
		width: 90%;
		padding: 0 5% 50px 5%;
		text-align: center;
		margin:0;
	}

	#etapes .legende svg {
		display: none
	}

	#compo .left {
		width: 80%;
		margin:5% 5% -10px -30%;	
	}

	#compo2 .left {
		width: 50%;
		padding: 10% 5% 0 0;
	}

	#compo2 .right {
		width: 60%;
	}
	.responsive {
		width:100%
	}

	.video, #contact .video {
		width: 70%;
		margin-right:-25%;
		margin-top:-200px
	}

	.introvideo {
		width: 50%;
	}

	#compo .right .sb, #compo .left .sb {
		width: 60px;
		margin-top:-40px;
	}
	.picto  {
		width: 60px;
	}
	.introphoto {
		width: 100%;
	}
	.photo {
		margin: 0;
		width: 100%;
	}
	#contact form textarea {
		height: 250px;
	}
}

@media handheld, only screen and (max-width: 990px), only screen and (max-device-width: 990px) {
	body, input::placeholder, textarea::placeholder, input, textarea {
		font-weight:400;
		letter-spacing: 0;
	}
	
	#choix {
		top:0px;
		right:0px;
	}

	h1, h2 {
		font:normal 40px 'Galins', Serif;
		margin-bottom:30px;
	}

	#home header, #projet, #podcast, #interlude, #etape4, #etape7, footer {
		background-size:cover;
		background-attachment:scroll;
		}

	#home #logo, footer #logo { 
		width:450px;
		max-width:100%;
		}

	#mini-logo {
		display: none
		}
	
	#menu_top ul li {
		padding: 10px;
	}
	
	#bande {
		width:40px;
		height:40px;
	}

	#burger {
	}

	#burger br {
		display: none;
	}

	#home #burger .menu {
		display: none;
	}

	#menu_top a, #burger .menu {
		font:normal 30px 'Galins', Serif;
	}	

	h1, h2 {
		font-size:30px;
		margin-bottom: 20px
	}

	h3 {
		padding-bottom: 0;
	}
	#etapes, #apropos, #creation {
		padding-bottom:60px;
	}
	
	section p {
		text-align: left
	}

	#burger {
		padding: 8%
	}
	
	.reseaux svg {
		width: 30px;
		height: 30px;
	}

	#prestations ul, #prestations ul li {
		padding:0%;
		}

	.realisation {
		width:100%;
		margin:0;
		}

	#prestations ul li {
		width:100%;
		margin:0 0 15% 0;
	}	

	.realisation {
		display:block;
	}	

	.realisation figcaption {
		margin:0 0 20px 0;
		display:block;
		padding:0;
	}
	
	.introvideo {
		width: 100%;
	}
	
	.video, #contact .video {
		margin: 0 0 20px 0;
		width: 100%;
		max-height: none
	}
	
	#etapes, #apropos, #creation, #contact {
		padding-bottom:60px;
		margin-bottom: 0;
	}
	
	#presse h3, #presse p {
		text-align: left
	}
	
	#compo p, #compo2 p, .logos p {
		text-align: center
	}
	
	#etape3 .logos img {
		width: 100%;
		margin: 0 0 5% 0;
	}
		
	#compo .left, #compo2 .right {
		float: none;
		width: 100%;
		margin:30px 0 0 0;	
	}

	#compo .right, #compo2 .left {
		float: none;
		width: 100%;
		margin:0;
		padding: 0;
		display: flex;
		flex-direction: column-reverse;	
	}

	#compo .right .sb, #compo2 .left .sb {
		display: none
	}
	
	#podcast .hajime {
    	flex-direction: column;
	}
	
	#podcast .hajime .couv {
		max-width:100%
	}
	
	.picto {
		margin-bottom: 10px;
	}

	#avis .logo {
		float:none;
		margin:0 auto 20px auto;
		display:block;
	}

	#confiance ul li {
		width:47%;	
		margin:1%;
	}

	footer .bulle {
		opacity: 0;
		display: block;
		margin-top: -25px;
		}

	#choice {
		width: 140px;
		padding: 30px 5px
	}

}