﻿/********************************************
	* Domaine : carre-pleyel.fr
	*
	* Exploitant : AG Real Estate
	*
	* Rôle : Feuille de style spécifique contenus page cadre de vie 
	*
	* Auteur : Ultra-Fluide, copyright 2021
********************************************/

/**** couleurs  ********/
/************************/
:root{
	--fond-trame: #eeffbe;
	--titre: #b9d46d;
	--sous-titre: #4B552C;
	--encart: #b9d46d;
}
/**** plans  ********/
/************************/

section#plans-etages article:nth-of-type(1) {
	width:100%;
	margin-bottom:50px;
}
section#plans-etages article:nth-of-type(2) {
	width:74.94116%;
	margin-bottom:60px;
}
section#plans-etages article:nth-of-type(3){
	width:62.2588232%;
	margin-left:4%;
}
section#plans-etages article:nth-of-type(2), section#plans-etages article:nth-of-type(3){
	position:relative;
	margin-top:15px
}
/**** pulsation texte plans  ********/
/************************/
@keyframes pulsation { from { stroke:#ddd;fill:#ddd } 40% { stroke:white; fill:white} to {stroke:white; fill:white} }
section#plans-etages article > div svg .libelle{
	animation: 1.2s linear 0s infinite alternate pulsation;
	stroke-width:.3;
}
/**  zones    **/
/*****************/
section#plans-etages article > div {
	position:absolute;
	top:0;
	width:100%;
	pointer-events: none;
}
section#plans-etages article > div > svg {
	pointer-events: none;
}
section#plans-etages article > div > svg > * {
	pointer-events: auto;
}
/** annimations popups    **/
/*****************/
section#plans-etages article > div > div{
	position:absolute;
	border:0 solid var(--titre);
	box-shadow: 0 0 4px 0px var(--sous-titre);
	background:white;
	font-size:.9rem;
	transition: all .3s ease-in;
	width:0;
	height:0;
	overflow:hidden;
	border-radius: 3px;
	z-index:10;
}
section#plans-etages article > div > div > p, section#plans-etages article > div > div > ul {
	padding:0 15px;
	margin:15px 0;
}
section#plans-etages article > div > div img{
	width:100%;
	display:block
}
/** zone  auditorium  **/
/** polygon : applat  **/
/** path : texte     **/
/***********************/
section#plans-etages article > div#auditorium svg polygon{
	fill:#c56a8f;
}
section#plans-etages article > div#auditorium svg > polygon:hover{
	fill:#c06585;
}
/** popup  auditorium  **/
/***********************/
section#plans-etages article > div#auditorium > div{
	top:15%;
	left:30%;
}
section#plans-etages div#auditorium > div.active{
	top:0;
	left:35%;
	width:90%;
	height:auto;
	border-width:3px;
}
/** zone  Fitness  **/
/***********************/
/***********************/
section#plans-etages article > div#fitness svg polygon{
	fill:#31ae74;
}
section#plans-etages article > div#fitness svg > polygon:hover{
	fill:#2ba670;
}
/** popup  Fitness  **/
/***********************/
section#plans-etages article > div#fitness > div{
	top:15%;
	left:47%;
}
section#plans-etages div#fitness > div.active{
	top:0;
	left:52%;
	width:90%;
	height:auto;
	border-width:3px;
}

/** PC sécurité  **/
/***********************/
/***********************/
section#plans-etages article > div#pc svg polygon{
	fill:#ac9895;
}
section#plans-etages article > div#pc svg > polygon:hover{
	fill:#a79390;
}
/** popup  PC  sécurité **/
/***********************/
section#plans-etages article > div#pc > div{
	top:8%;
	left:54%;
}
section#plans-etages div#pc > div.active{
	top:0;
	left:57%;
	width:80%;
	height:auto;
	border-width:3px;
}
/** zone  Bistro  **/
/***********************/
/***********************/
section#plans-etages article > div#bistro svg polygon{
	fill:#e29041;
}
section#plans-etages article > div#bistro svg > polygon:hover{
	fill:#da8a39;
}
/** popup  bistro  **/
/***********************/
section#plans-etages article > div#bistro > div{
	top:12%;
	left:70%;
}
section#plans-etages div#bistro > div.active{
	top:25%;
	left:50%;
	width:80%;
	height:auto;
	border-width:3px;
}
/** zone  Restaurant  **/
/***********************/
/***********************/
section#plans-etages article > div#restau svg > polygon, section#plans-etages article > div#restau svg > rect{
	fill:#ecc443;
}
section#plans-etages article > div#restau svg > polygon:hover, section#plans-etages article > div#restau svg > rect:hover{
	fill:#e8bc3b;
}
/** popup  restau  **/
/***********************/
section#plans-etages article > div#restau > div{
	top:30%;
	left:87%;
}
section#plans-etages div#restau > div.active{
	top:40%;
	left:0;
	width:80%;
	height:auto;
	border-width:3px;
}
/** zone  Parking  **/
/***********************/
/***********************/
section#plans-etages article > div#parking svg polygon{
	fill:#cfc1bf;
}
section#plans-etages article > div#parking svg > polygon:hover{
	fill:#cab8ba;
}
/** popup  parking  **/
/***********************/
section#plans-etages article > div#parking > div{
	top:35%;
	left:50%;
}
section#plans-etages div#parking > div.active{
	top:55%;
	left:10%;
	width:95%;
	height:auto;
	border-width:3px;
}
section#plans-etages div#parking > svg .o{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke:#000;stroke-width:0.24}

/** zone  salles de réunion  **/
/** polygon : applat  **/
/** path : texte     **/
/***********************/
section#plans-etages article > div#reunion svg polygon{
	fill:#9185be;
}
section#plans-etages article > div#reunion svg > polygon:hover{
	fill:#8a80b5;
}
/** popup  salles de réunion  **/
/***********************/
section#plans-etages article > div#reunion > div{
	top:23%;
	left:25%;
}
section#plans-etages div#reunion > div.active{
	top:0;
	left:30%;
	width:70%;
	height:auto;
	border-width:3px;
}

/** zone  Hall A  **/
/***********************/
/***********************/
section#plans-etages article > div#halla svg polygon{
	fill:#ec6084;
}
section#plans-etages article > div#halla svg > polygon:hover{
	fill:#e75980;
}
/** popup  Hall A  **/
/***********************/
section#plans-etages article > div#halla > div{
	top:20%;
	left:35%;
}
section#plans-etages div#halla > div.active{
	top:15%;
	left:38%;
	width:65%;
	height:auto;
	border-width:3px;
}
/** zone  Lobby  **/
/***********************/
/***********************/
section#plans-etages article > div#lobby svg polygon{
	fill:#e5007d;
}
section#plans-etages article > div#lobby svg > polygon:hover{
	fill:#db0075;
}
/** popup  lobby  **/
/***********************/
section#plans-etages article > div#lobby > div{
	top:50%;
	left:35%;
}
section#plans-etages div#lobby > div.active{
	top:10%;
	left:40%;
	width:80%;
	height:auto;
	border-width:3px;
}

/** zone  Café  **/
/***********************/
/***********************/
section#plans-etages article > div#cafe svg > path{
	fill:#c5a334;
}
section#plans-etages article > div#cafe svg > path:hover{
	fill:#c09c2d;
}
/** popup  cafe  **/
/***********************/
section#plans-etages article > div#cafe > div{
	top:18%;
	left:65%;
}
section#plans-etages div#cafe > div.active{
	top:28%;
	left:30%;
	width:80%;
	height:auto;
	border-width:3px;
}

/** zone  Hall B  **/
/***********************/
/***********************/
section#plans-etages article > div#hallb svg polygon{
	fill:#ec6084;
}
section#plans-etages article > div#hallb svg > polygon:hover{
	fill:#e75980;
}
/** popup  Hall B  **/
/***********************/
section#plans-etages article > div#hallb > div{
	top:20%;
	left:70%;
}
section#plans-etages div#hallb > div.active{
	top:30%;
	left:55%;
	width:65%;
	height:auto;
	border-width:3px;
}

/** zone  Hall C   **/
/***********************/
/***********************/
section#plans-etages article > div#hallc svg polygon{
	fill:#ec6084;
}
section#plans-etages article > div#hallc svg > polygon:hover{
	fill:#e75980;
}
/** popup  Hall C  **/
/***********************/
section#plans-etages article > div#hallc > div{
	top:68%;
	left:70%;
}
section#plans-etages div#hallc > div.active{
	top:55%;
	left:55%;
	width:65%;
	height:auto;
	border-width:3px;
}

/** zone  Hall D  **/
/***********************/
/***********************/
section#plans-etages article > div#halld svg polygon{
	fill:#ec6084;
}
section#plans-etages article > div#halld svg > polygon:hover{
	fill:#e75980;
}
/** popup  Hall D  **/
/***********************/
section#plans-etages article > div#halld > div{
	top:68%;
	left:35%;
}
section#plans-etages div#halld > div.active{
	top:55%;
	left:38%;
	width:65%;
	height:auto;
	border-width:3px;
}

/** zone  patio  **/
/***********************/
/***********************/
section#plans-etages article > div#patio svg rect{
	fill:white;
	fill-opacity :0;
}
section#plans-etages article > div#patio svg .libelle{
	animation: none;
}
/** popup  Patio  **/
/***********************/
section#plans-etages article > div#patio > div{
	top:15%;
	left:60%;
}
section#plans-etages div#patio > div.active{
	top:0;
	left:70%;
	width:80%;
	height:auto;
	border-width:3px;
}

/** Autour de carré pleyel  **/
/***********************/
section.standard article h3{
	margin-top:40px;
	font-size:1.4rem;
}
section.standard article li{
	list-style: none;
	margin-bottom:15px;
}