/********************************************
	* Domaine : carre-pleyel.fr
	*
	* Exploitant : AG Real Estate
	*
	* Rôle : Feuille de style principale 
	*
	* Auteur : Ultra-Fluide, copyright 2021
********************************************/

/**** classique  ********/
/************************/
html {
  	font-size: 90%;
}
* {margin: 0px; padding: 0px; box-sizing: border-box;}
h4, h1, h2, h3, h5{
	font-family: 'Montserrat', sans-serif;
}
h2{
	text-transform: uppercase;
}
p, li, table, dl, figcaption{
	font-family: 'Montserrat', sans-serif;
	font-size:1.2rem
}
a { 
	text-decoration: none;
}
/* Pour contourner le problème des espaces entre élément inline-block*/
/* voir : https://github.com/patrickkunka/zero-width et */
/* http://www.alsacreations.com/astuce/lire/1432-display-inline-block-espaces-indesirables.html */
@font-face{ 
	font-family: 'NoSpace';
	src: url('fonts/zerowidthspaces.eot');
	src: url('fonts/zerowidthspaces.eot?#iefix') format('embedded-opentype'),
	url('fonts/zerowidthspaces.woff') format('woff'),
	url('fonts/zerowidthspaces.ttf') format('truetype'),
	url('fonts/zerowidthspaces.svg#NoSpace') format('svg');
}
@font-face {
	font-family: 'FontAwesome';
	src: url('fonts/fontawesome-webfont3295.eot?v=4.5.0');
	src: url('fonts/fontawesome-webfontd41d.eot?#iefix&v=4.5.0') format('embedded-opentype'), 
	url('fonts/fontawesome-webfont3295.html?v=4.5.0') format('woff2'), 
	url('fonts/fontawesome-webfont3295.woff?v=4.5.0') format('woff'), 
	url('fonts/fontawesome-webfont3295-2.html?v=4.5.0') format('truetype'), 
	url('fonts/fontawesome-webfont3295.svg?v=4.5.0#fontawesomeregular') format('svg');
}
/**** Global  *****************/
/*****************************/


.wwrap {/* la cliente n'aime finalement pas l'idée des bandes traversantes, donc on limite leur dépassement de la zone utile de 5% de l'écra, voir ci-dessous */
	max-width: 1100px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
body > *, body > * > *{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
body > *{
	max-width: 1300px;
}
body > * > *{
	max-width: 1100px;
}
body > table{
	max-width: 1100px;
}
body > .fancybox-container{/**** conteneur galerie photo  ****/
	max-width: 100%;
}
/**** Header  *****************/
/*****************************/

header {
	position:sticky !important;
	position: -webkit-sticky;
	top:0;
	z-index:20;
	box-shadow: 0 3px 3px -4px var(--sous-titre);
	background:white;
}
header div {
	position:relative;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: space-between;
}

header h1 {
	font-size:1.5rem;
	color:#4c4d4f;
	font-weight:700;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: space-between;
	width:66%;
}
header h1 a{
	display:inline-block;
	width:48.5%;
}
header h1 img{
	width:100%;
	display:block;
}
header h1 span{
	margin-top:7px;
	padding:11px 0;
	border-bottom:6px solid #4c4d4f;
	border-top:6px solid #4c4d4f;
	display:inline-block;
	width:48.5%;
	text-align:center;
}

@media screen and (max-width: 900px) {
	
}
/**** menu principal *********/
/*****************************/
header div > ul > li:first-child {
	padding-left:0;
}
header div > ul > li {
	height:110px;
	display: table-cell;
	vertical-align: middle;
	padding-left:30px;
}
/**** sous menu  *********/
header ul ul{
	display:none;
	position:absolute;
	width:25%;
	right:0;
	margin-top:36px;
	padding:1%;
	background-color:white;
	box-shadow: 0 3px 4px -2px #222;
}
header ul > li:last-child:hover ul{
	display:block;
}
header ul ul li{
	display:block;
	width:100%;
	margin-bottom:10px;
	font-family:'Oswald', sans-serif;
	text-transform: uppercase;
}
header ul ul li a{
	color:white;
	width:100%;
	height:100%;
	display:inline-block;
	text-align:right;
	padding : 10px;
}
header ul ul li:nth-child(1){
	background-color:#7ce0ac;
}
header ul ul li:nth-child(2){
	background-color:#F4BF50;
}
header ul ul li:nth-child(3){
	background-color:#E4B1B1;
}
header ul ul li:nth-child(4){
	background-color:#b9d46d;
}
header ul ul li:nth-child(5){
	background-color:#90b0de;
}
header ul ul li:nth-child(6){
	background-color:#32b7bc;
}
@media screen and (max-width: 1020px) {
	
}
/**** footer ***********/
/**********************/
footer ul {
	border-top:4px solid #4c4d4f;
	margin-top: 20px;
}
footer ul li{
	display:inline-block;
	color:#4c4d4f;
	padding:12px 0;
}
footer ul li:after{
	content: "|";
	padding:0 10px;
}
footer ul li:last-child:after{
	content: none;
}
footer a{
	color:#4c4d4f;
}
footer a:hover{
	text-decoration:underline;
}
footer + p{
	text-align: center;
	margin:10px 0;
	font-size:.9rem;
}
footer + p a{
	color:#d0d0d0;
}