@media (max-width: 1299px){
	body,html{ 
		/*background-color: #333333;*/
		font-size: 14px;
		line-height: 20px;
	}
	
	/* FONT --------------------- */
	h1{ font-size: 20px; }
	h1 .sstitre{ font-size: 16px; }
	.titreh1{ font-size: 20px; }
	.titreh1 .sstitre{ font-size:16px; }
	h2{ font-size:26px; line-height: 24px; }
	h3{ font-size:19px; }
	.big{ font-size: 16px; }
	.petit{ font-size: 12px; }
	/* ---------------------------- */
	
	.coinGHaut{ font-size: 17px; }
	#Menu{ top: 90px; }
	
	#Fin{ flex-wrap: wrap; }
	.caseBCentre{
	width:100%;
	position: relative;
	float: left;
	left: 0;
	transform: translateX(0);
	}
	#LogoB{ left: 50%; transform: translateX(-50%);}
	
	/* PANO HAUT DE PAGE -------------*/
	.panoAcc{
	width:100%;
	height: 550px;
	}
	.panoTxt1{
	transform:translateX(-470px);
	}
    .popBord{
    width:260px;
    top: 405px;
    left: 50%;
    transform:translateX(-50%);
    }
	
	.caseMiniPhoto{
	width:100px;
	height: 100px;
	}
	.caseMiniPhoto .maskRea p{
	font-size:14px;
	}
	.projet{
	height: 350px;
	}
	.vue .maskRea p{
	font-size:14px;
	}
	.bProjet{
	font-size: 18px;
	}
	.bProjet.actif .txt{
	font-size: 14px;
	}
	
	
	.caseLogo{
	width:115px;
	height:50px;
	margin: 5px;
	position: relative;
	float: left;
	}
	.caseLogo.double{
		width:190px;
		height: 80px;
	}
	
	@keyframes accT1{
		from{
			transform:translateY(100%) translateX(-470px);
		}
		0.7%{
			transform:translateY(10px) translateX(-470px);
		}
		1%{
			transform:translateY(-5px) translateX(-470px);
		}
		1.2%,85%{
			transform:translateY(0) translateX(-470px);
		}
		86%,100%{
			transform:translateY(100%) translateX(-470px);
		}
	}
}

@media (max-width: 999px){
	body,html{ 
		/*background-color: #9d9d9d;*/
		font-size:14px;
		line-height: 18px;
	}
	
	.bandHaut{
	height: 85px;
	}
	.coinGHaut{
	width:100%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	}
	.coinHDroit{
		width: 100%;
		height: 40px;
		text-align: center;
		float: left;
		padding-right: 0;
		top: 0;
		transform: none;
	}
	.coinHDroit img{ max-height: 100%; }
	.coinHCentre{
		position: absolute;
		float: left;
		top: 85px;
		left: 50%;
		transform: translateX(-50%);
		z-index: 5;
	}
	#Menu{ top: 170px; font-size: 12px; }
	.ssMenuH.deplier{ width:560px; }
	
	.col50r{ width:calc(100% - 12px); padding: 5px; }
	.col50b{ width:calc(100% - 12px); padding: 5px; text-align: center; }
	.col50.droite{ width:50%; text-align: right; }
	
	
	
	/*PANO ------------------------ */
	.panoAcc{
	width:100%;
	height: 490px;
	}
	.panoTxt1{
	width:calc(100% - 20px);
	height: auto;
	padding: 10px;
	background-color: #ffffff;
	position: absolute;
	bottom: 0;
	left: 0;
	transform:none;
	animation-name: none;
	}
	.panoTxt2{
	width:calc(100% - 20px);
	height: auto;
	padding: 10px;
	background-color: #ffffff;
	position: absolute;
	top: auto;
	right: auto;
	bottom: 0;
	left: 0;
	transform:none;
	animation-name: none;
	}
	.panoTxt3{
	width:calc(100% - 20px);
	height: auto;
	padding: 10px;
	background-color: #ffffff;
	position: absolute;
	top: auto;
	right: auto;
	bottom: 0;
	left: 0;
	transform:none;
	animation-name: none;
	}
    
    .popBord{
    width:calc(100% - 6px);;
    position: relative;
    float: left;
    top: inherit;
    padding: 2px;
    z-index: 10;
    }
	
	
	.paraSTD{
	margin-bottom: 40px;
	}
	.paraGAL{
	margin-bottom: 40px;
	}
	
	.flexQuad{ flex-wrap: wrap; }
	.fqTxt{ width:calc(100% - 100px); }
	.fqImg.max100{ width:100%; }
	.fqGal{width:calc(100% - 50px);}
	
	.imgRC{float: left; left: 50%; transform: translateX(-50%); position: relative;}
	
	.projet{
	height: 250px;
	}
	.bProjet{
	width:100px;
	font-size: 16px;
	margin: 0 5px;
	}
	.bProjet.actif .txt{
	font-size: 12px;
	}
    
    .caseGal{
    width:23%;
    margin: 0.5% 0.5%;
    border: 1px solid #ff0000;
    overflow: hidden;
    position: relative;
    float: left;
    }
	
}


@media (max-width: 599px){
	body,html{ 
		/*background-color: #333333;*/
	}
	
	#Menu{
	width:100%;
	height: auto;
	padding: 0;
	}
	.baseMenu{ display:none; }
	.ssMenuH{
		width:100%;
		flex-wrap: wrap;
		justify-content: space-around;
	}
	.ssMenuH.deplier{
		width:100%;
	}
	.bMenu{
	display: block;
	margin: 0;
	padding: 0 2px;
	}
	.infoPano{
	width:calc(100% - 50px);
	}
	
	.fqAvis{
	width:calc(100% - 102px);
	margin: 15px 30px;
	}
	
	.groupeChantier{
	width: 100%;
	display: grid;
	grid-template-columns: 1fr;
	grid-column-gap: 30px;
	grid-row-gap:50px;
	position: relative;
	float: left;
	}
}