#bpopupdiv{
	background: #FFF;
	/*padding: 20px;*/
	width: 450px;
	border-radius: 10px;
}

.boutonOk{
	border: 1px solid #ddd;
	padding: 5px 10px;
	text-align: center;
	background: #007acc;
	border-radius: 3px;
	color:#fff;
}
#bpopupcontent{padding: 15px;}

.footerbPopup{
	border-top:1px solid #dddddd;
	background: #f5f5f5;
	padding: 15px;
	text-align: right;
	border-radius: 0 0 10px 10px;
}

.mentionsLegales{
	text-align:center;
	color:black;
	font-size: 14px;
}

.mentionsLegales a:visited {
    color: black;
}

.center {
	text-align: center;
}

.bold {
	font-weight: bold;
}

.btn-lien {
	text-decoration: none;
	padding: 15px 60px;
	font-size: 20px;
}

.is_disabled {
	cursor: not-allowed;
	opacity: 0.5;
}

/* COULEUR FOND */
.fond_bleu_ciel{
	background-color: #00b9f1 !important;
}
.fond_rouge{
	background-color: #BB282E !important;
}
.fond_vert{
	background-color: #85B81B !important;
}

/* COULEUR TEXTE */
.bleu_ciel{
	color: #00b9f1;
}
.rouge{
	color: #BB282E;
}
.blanc{
	color: #FFFFFF;
}
.vert{
	color: #85B81B;
}

/*----------Page accueil 3 fenetres ----------*/

#offre_location {
	height:310px; 
	float:none !important; 
	display:inline-block; 
	background-color:#DBE4F5;color:#292862; 
	font-weight:bold; 
	vertical-align: middle; 
	margin-right: -5px;
}

#gestion_demande_logement {
	height:350px; 
	float:none !important; 
	display:inline-block; 
	background-color:#DBE4F5;color:#292862; 
	font-weight:bold; 
	vertical-align: middle; 
	box-shadow: 8px 0 8px -5px #aaa, -8px 0 8px -6px #aaa; 
	position: relative; 
	z-index: 100;
}

#info_patrimoine_attrib {
	height:310px; 
	float:none !important; 
	display:inline-block; 
	background-color:#DBE4F5;color:#292862; 
	font-weight:bold; 
	vertical-align: middle; 
	margin-left: -5px;
}


/************************************ PAGE DE CONNEXION *********************************************/
.nouvelle_demande {
	background-color: #DBE4F5;
}

.nouvelle_demande #texte{
    margin-top: 20px;
}

.connexion_demande {
	background-color: #EAEEF9;
}

.connexion_demande #texte{
    margin-top: 20px;
}

#btn-corriger, #btn-effacer, #btn-connecter{
    width: 200px !important;
    margin: 5px;
}

.demande {
	background-color:#EAEEF9;
	color:#292862;
	font-weight:bold;
}

.nouvelle_demande .title {
	color: #BB282E;
	font-size: 28px;
	font-weight: bold;
}

.connexion_demande .title {
	color: #00b9f1;
	font-size: 28px;
	font-weight: bold;
}

.connexion_demande .text, .nouvelle_demande .text {
	text-align: justify;
}

.img-plus {
	display: flex;
	flex-direction: column;
	float: right;
	top: 0px;
	position: absolute;
	right: 0px;
}

.img-plus img {
	float: left;
	margin: 20px;
}

/************************************ RECHERCHE LOGEMENT VACANT - LOCATION CHOISIE *********************************************/
.recherche_logement_vacant {
    /* width: 985px;
    margin: auto; */
	background-color: #dbe4f4;
	padding: 30px 20px;
}

.recherche_logement_vacant input[type=text], .recherche_logement_vacant select, .btn{
	border-radius: 0px !important;
}

.btn-info {
	background: #00b9f1;
	border-color: #00b9f1;
}

#label_nb_chambres_logement_vacant {
	text-align: left;
}

#nb_chambres_logement_vacant {
	text-align: left;
}

#nb_chambre_6_plus {
	margin-left: 0px !important;
}

#validation_recherche_logement_vacant {
	padding-top: 15px;
	display: flex;
	justify-content: space-around;
}

.resultat_recherche_logement_vacant {
    font-family: 'open_sanslight';
    font-size: 15px !important;
	background-color: #eaeef8;
}

.log_informations {
	display: flex;
	grid-template-columns: repeat(6, 1fr);
}

.log_informations > div {
	text-align: center;
	flex: 1;
}

.log_informations > div p {
	margin: 0;
}

.log_informations .icone{
	padding-right: 0px; 
	padding-left: 0px; 
}

.log_informations .icone span{
	width: 100%;
	float: right;
	height: 38px;
	line-height: 64px;
}

.bloc_informations_complementaire {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
}

.bloc_informations_complementaire {
	text-align: center;
}

.log-photos {
	/*height: 230px !important;    */
	border-bottom: solid 1px #dbe4f4;
	overflow: hidden;
}

#log_vacant_detail {
	/* background-color: #eaeef8;  */
	/* width: 985px;  */
	margin: auto; 
	font-family: 'open_sanslight'; 
	font-size: 15px !important;
	color: #2c266a;
}

.fenetre_logement_vacant {
	padding:0px;
	background-color: white;
}

.log_intro {
	background-color: #00b9f1;
	color: white;
	height: 46px;
	padding-left: 0px;
}

.log_ville {
	line-height: 46px;
	padding: 0px 0px 0px 8px;
	text-align: left;
	font-weight: bold;
}

.logo-type-logement {
	float: right;
	padding: 5px;
}

.list-log.carousel-inner {
	height: 250px;
}

.carousel-caption {
	background-color: #b5b5b5b8;
	border-radius: 35px;
	width: 100px;
	margin: -5px auto;
	padding: 1px;
	bottom: 5px;
}

.logement_vacant_pagination {
	display: flex;
	justify-content: center;
}

.logement_vacant_map {
	position: sticky !important;
	top: -300px;
	height: 400px;
	z-index: 20;
	transition-duration: 500ms;
}

.logement_vacant_map:hover {
	top: 30px;
	transition-duration: 500ms;
}

.logement_vacant.grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 5px;
}

.log_description {
	margin: 10px 5px;
}

.div_maison {
	position: absolute;
    right: -260px;
    z-index: 5;
}
/************************************ DETAILS LOGEMENT VACANT - LOCATION CHOISIE *********************************************/
/*-----TITRE-----*/
/*.panel-log-vacant .panel-heading .panel-title {
  font-size: 26px;
  width: 92%;
  margin: auto;
  line-height: 51px;
}
.panel-log-vacant .panel-heading .panel-title div img{
  float:right;
}*/

/*-----DETAIL-----*/
/*#log_vacant_detail{
  width: 90%; 
  margin: auto; 
  font-size: 18px;
}*/
/*-----DIV PRIX-----*/
/*#bloc_prix_reservation{
  padding-top:15px;
  padding-bottom:15px;
  height: 260px;
  position: fixed;
  right: 15px;
  background-color: #efeeee;
  border-radius: 7px;
}
#ligne_loyer {
  text-align: center;
  margin-top: 22px;
  font-size: 20px;
}
#montant_loyer {
  margin-top: 30px;
  text-align: center;
}
#montant_loyer strong{
  font-size:28px;
}
#choisir_logement {
  margin-top: 50px;
  text-align: center;
}
#choisir_logement button{
  padding: 15px 60px;
  font-size: 18px;
  float:none !important;
}*/

/*-----DIV DETAIL-----*/
/*-----INFO-----*/
/*#bloc_resume {
  padding-top:15px;
  padding-bottom:15px; 
  background-color: yellow; 
  border-bottom: 1px grey solid;
}*/
/*-----PHOTOS-----*/
#bloc_photos {
    padding-right: 0px;
    padding-left: 0px; 
  	border-bottom: 1px grey solid;
}
/*-----DESCRIPTION-----*/
/*#bloc_description {
  padding-top:15px;
  padding-bottom:15px; 
  border-bottom: 1px grey solid;
}*/
/*-----CARTE-----*/
/*#bloc_map {
  padding-top:15px;
  padding-bottom:15px; 
  border-bottom: 1px grey solid;
}
.sous_titre_detail_loc_vacant{
  padding-left:2px !important; 
  padding-bottom:15px;
}
.sous_titre_detail_loc_vacant span{
  color:#4cd64e;
}
#bloc_map #map {
  height: 400px;
  width: 100%;
}*/


/*-----CARTE-----*/
#bloc_map {
  padding-top:15px;
  padding-bottom:15px; 
  border-bottom: 1px grey solid;
  background-color: white;
  margin-bottom:10px;
  margin-left:10px;
  padding:10px 0px;
  width: 30% ;
}

.coord-not-found {
	background: #ccc;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
}

/* .bloc_informations_complementaire .icone{
	padding-right: 0px; 
	padding-left: 0px; 
	border: solid 1px #ced1c8;
	height: 130px;;
} */

/* .bloc_informations_complementaire .icone span{
	width: 100%;
	float: right;
	height: 65px;
} */

blockquote {
	padding: 10px;
	border-left: 3px solid #00b9f1;
	background: #E5F8FD;
}

/* The sticky class is added to the header with JS when it reaches its scroll position */
.sticky {
  position: fixed !important;
  top: 0;
  width: 330px;
  left: 57.6%;
}

/* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
  padding-top: 102px;
}

.bloc_consommation_energetique {
	margin-top:35px;
	padding-bottom: 20px;
}

#dpe, #ges {
	position:relative; 
	padding: 0px;
	margin-top: 15px;
}

/* Alexis : Add style in order to avoid them in HTML pages */
.union-euro {
	font-size: 14px;
}

.union-euro p {
	margin: 0;
}

.union-euro > p {
	max-width: 80%;
	margin: 0 auto;
}

.bloc_map_loyer {
	background: white;
}

.logement_details_map {
	height: 400px;
}

.graphics {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

.price {
	font-size: 32px;
}

/* NOT FOUND PAGE */
.not-found {
	font-size: 16px;
	animation: appear 1s;
}

.not-found-status {
	font-size: 8em;
	font-weight: bold;
}

.not-found-message {
	font-size: 2em;
}

@keyframes appear {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

/* Page des mentions légales */

.mentions-legales {
	text-align: justify;
	font-size: 14px;
}

.mentions-legales h2 {
	font-size: 1.4em;
}

.mentions-legales h3 {
	font-size: 1.2em;
	text-align: inherit;
}

/* Page informations patrimoines */
.infos-patrimoines {
	font-size: 14px;
	text-align: justify;
}

.infos-patrimoines .card-header {
	font-size: 1.2em;
}

.infos-patrimoines table {
	overflow: hidden;
}

@media only screen and (max-width: 1500px) {
	.sticky {
		left: 60.6%;
	}
	
	.div_maison {
		display: none;
	}
}
	
@media only screen and (max-width: 1200px) {
	.sticky {
		left: 61.6%;
	}

	.logement_vacant_map {
		position: unset;
		top: unset;
		z-index: unset;
	}
	
	.logement_vacant_map:hover {
		top: unset;
	}
}

@media only screen and (max-width: 991px) {
	#gestion_demande_logement {
		margin-top:10px;
		margin-bottom:10px;
	}
	#offre_location {
		box-shadow: 8px 0 8px -5px #aaa, -8px 0 8px -6px #aaa; 
	}
	#info_patrimoine_attrib {
		box-shadow: 8px 0 8px -5px #aaa, -8px 0 8px -6px #aaa; 		
	}

	.marginauto, .marginauto_acceuil, .marginauto_connexion, .recherche_logement_vacant, .resultat_recherche_logement_vacant, #log_vacant_detail {
		width: auto !important;
	}

	.entete{
	    /* width: 950px !important; */
	}

    .nouvelle_demande #texte, .nouvelle_demande #icone, .connexion_demande #texte, .connexion_demande #icone{
        text-align: center;
    }

    .nouvelle_demande #texte{
        margin-top: 0px;
    }

    .connexion_demande #texte{
        margin-top: 0px;
    }

    #nb_chambres_logement_vacant {
		text-align: center;
	}

	#nb_chambre_6_plus {
		margin-left: 10px !important;
	}

	.fenetre_logement_vacant {
		margin-right: 0px !important;
	}

  	/* .bloc_informations_complementaire {
	  	height: auto !important;
	} */

	.bloc_map_loyer {
		width: 100% !important;
	}

	#bloc_map, #bloc_map #map {
		width: 100% !important;
	}

	.logement_vacant.grid {
		grid-template-columns: 1fr;
	}
	/*.log-photo {
		height: 250px !important;
	}*/

	/* .bloc_map_loyer > div:first-child {
		display: flex;
		justify-content: space-around;
	} */

	.not-found {
		font-size: 14px;
	}

	.union-euro > p {
		margin: unset;
		max-width: unset;
	}
}

@media only screen and (max-width: 767px) {
	/* #bloc_description {
		border-left: none !important;
		border-top: solid 1px #ced1d8;
	}	 */
	
	.bloc_consommation_energetique {
		display:inline-block;
	}

	/*.log-photo {
		height: 350px !important;
	}*/

	.not-found {
		font-size: 9px;
	}
}

@media only screen and (max-width: 705px) {
	#img_plus {
		display:none;
	}

	.graphics {
		grid-template-columns: 1fr;
	}

	.bloc_informations_complementaire {
		grid-template-columns: repeat(4, 1fr);
	}

	.mentions-legales, .union-euro, .mentionsLegales, .infos-patrimoines {
		font-size: 16px;
	}
}

@media only screen and (max-width: 500px) {
	.connexion_demande input[type=text] {
		width: 100%;
	}
}
