// Ecran de cinéma

@media screen and (min-width:2561px){
	.cartouchelogo {
		padding: 1.2em 2.5em 0.6em;
		.texte, .texte p {font-size: 32px }
	}
	.menuprincipal { font-size: 36px; }
	#tiroir .titre {
		width: 230px;
		img { width: 100%;}
	}
}

@media screen and (min-width:1601px){
	.cartouchelogo {
		top: 7em;
		margin-left:2.5%;
	}
}

@media screen and (max-width:1535px){
	.cartouchelogo {width: 25%; }
}

@media screen and (max-width:1200px){
	.cartouchelogo {width: 29%; }
	.device{left:20%;top:-36px;}
	footer li{margin-right:10%;}
	.feature-content{width:55%;}
}

@media screen and (max-width:991px){
	.cartouchelogo {
		width: 31%;
		padding: 0.8em 1em;
		.lelogo {
			margin-bottom: .2em;
			.spip_logo{width: 90%; }
		}
		p { font-size: 12px; }
	}
	.feature-1,.feature-2{margin-bottom:50px;}
	.device{display:none;}
	.screenshots ul li{width:50%;}
	.screenshots-intro{padding:110px 0 100px 0;}
	.feature-content{width:80%;}
	.features-slider{height:100%}
}

@media screen and (min-width:681px){
	.menuprincipal { padding: 0.6em 1em 0.3em; }
}

@media screen and (max-width:680px){
	.feature-content{width:60%;}
}

@media screen and (max-width:680px) and (max-height:479px){
	header .cartouchelogo .visible-xs {
	    width: 60%;
	    margin: 1em 20%;
	    text-align: center;
	    padding: 0.6em 0.8em;
	}
	section#tiroir ul li {
		.bts { margin: 0.9% 0 0%; }
		.cboxElement img {margin: 0.8em 0; }
	}
}

@media screen and (max-width:640px){
	.use-btn{display:none;}
	footer li{display:block;text-align:left;padding:20px 0;border-bottom:dashed 1px #c7cacc;margin-right:0!important;float:none;}
	nav{margin-top:40px;}
	.overlay ul{margin-left:0px;}
	.overlay ul li a{padding:20px 0;min-width:120px;font-size:12px;}

	.menuprincipal{
		padding: 0.3em 5%;
		background-color: #004070;
		.item {
			padding: 0;
			list-style: none;
			display: inline-block ;
			a {
				font-size: .9em;
				margin: 0;
				color: #fff;
				&::before{
					background-color: transparent;
					margin-left: 0;
				}
			}
		}
		.invisible  { display: none }
		.gauche {
			padding: 0;
			margin: 0;
			a::before{
				width: 0;
				margin: 0;
			}
		}
	}


	.cartouchelogo {
		top: 0;
		width: 100%;
		margin: 2.8em 0 0;
		padding: 0.7em 1.5em 7em;
		.lelogo {
			margin: 0;
			.spip_logo {
				width: 29%;
				float: left;
				margin: 0 0.4em 0.1em 0;
			}
		}
		p { margin: 0; }
		.visible-xs {
			background-color: #E75C10;
			color: #fff;
			text-align: left;
			width: auto;
			font-size: 0.6em;
			padding: 0.4em 0.8em;
			display: inline-block !important;
			margin-top: 0.5em;
			font-weight: 600;
		}
	}

	#tiroir {
		position: fixed;
		.titre {
			width: 17%;
			padding: 0.3em 0.7em .1em;
			img {
				width:100%;
			}
		}
		ul {
			padding: 0;
			height: 0;
			li {
				width: 24%;
				padding: 0.6em 0.8em;
				.cboxElement  {
					width:17%;
					img {
						margin: 1.1em 0;
					}
				}
			}
		}
	}

	.interieur #features, .interieur #features .container {
		padding: 2.3em 3% 18%;
		h1.titi {
			font-size: 2.9em;
			width: 100%;
			margin: 0 auto .5em;
		}
		.container .comments .comment-texte{
			&::before {
				font-size: 2.6em;
				top: 1.5%;
			}
			&::before {
				font-size: 2.6em;
				bottom: 2.5%;
			}
		}
		.cnt .formulaire_spip form .editer.erreur {padding: 4% 0 5% 7%; }
	}
	#rubrique_photo #features{
		padding: 5em 3% 18%;
		 .cnt p {
			font: 400 1.3em serif;
			margin-bottom: 0.5em;
		}
	}

	#article27, #article26 {
		 #features .container .cnt > p {
			margin: 0 10% 1.2em;
			font-size: 1.3em;
			text-align: center;
		}
	}

	.interieur {
		.menuprincipal .visiter { display: none; }
	}
}

@media screen and (max-width:640px) and (min-height:480px){
	.cartouchelogo {
		padding: 0.7em 1.5em 2.3em;
		min-height: 93.2%;
		.visible-xs {margin-top: 0.8em; }
	}
}

@media screen and (max-width:465px){
	.hero h1{font-size:40px;margin:100px 0 45px 0}
	.screenshots ul li{width:100%;min-height:100%;float:none;}
	section.video i{font-size:30px;}
	section.video h1{font-size:15px;font-weight:400;}
	section.video{padding:40px;}
	.feature-content{width:100%;text-align:center;margin-top:20px;}
	.feature-icon{display:block;margin:0 auto;}
	blockquote p{width:60%;}
	.features-slider {padding: 11% 50px 10% 50px;}

	html, body {
		overflow: auto;
	}
	.menuprincipal{
		padding: 0.3em 5%;
		background-color: #004070;
		.item {
			padding: 0;
			list-style: none;
			display: inline-block ;
			a {
				font-size: .9em;
				margin: 0;
				color: #fff;
				&::before{
					background-color: transparent;
					margin-left: 0;
				}
			}
		}
		.invisible  { display: none }
		.gauche {
			padding: 0;
			margin: 0;
			a::before{
				width: 0;
				margin: 0;
			}
		}
	}

	.cartouchelogo {
		.lelogo {
			margin-bottom: .2em;
			.spip_logo {
				width: 98%;
				float: none;
				margin: 0;
			}
		}
		p { margin: 0; }
		.visible-xs {
			text-align: center;
			width: auto;
			font-size: 0.6em;
			padding: 0.4em 0.8em;
			display: inline-block !important;
			margin-top: 0.5em;
			font-weight: 600;
		}
	}
	.hero {
		min-height: 480px;
		overflow: hidden;
	}

	#tiroir {
		position: fixed;
		.titre {
			width: 38%;
			img {
				width:100%;
			}
		}
		ul {
			padding: 0;
			height: 0;
			li {
				width: 49%;
				padding: 0.6em 0.8em;
				.cboxElement  img {
					margin: 1.1em 0;
				}
			}
		}
	}

	#panorama {
		.pnlm-scene {
			height: 26px;
			width: 26px;
			background-size: 200%;
		}

		.pnlm-zoom-controls {
			top: 13em;
		}
		.pnlm-fullscreen-toggle-button {
			top: 18em;
		}
		.cache {
			top: 12em;
			.aide {
				top: auto;
			}
		}

	}
	.interieur {
		#features .container {
			min-height: auto;
			padding: 5.1em 5% 8em;
		}
	}
}