*/
z-index: 11;
}
@media (max-width: 767px) {
.forcefullwidth_wrapper_tp_banner {
height: auto;
}
.video-background-mobile {
position: relative;
padding-top: 56.25%; /* 16:9 ratio → 9 / 16 = 0.5625 */
height: 0;
overflow: hidden;
}
.video-background-mobile iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: none;
}
#bgYoutube {
width: 100% !important;
height: 100% !important;
margin-bottom: 0;
}
}
.toggle-content ul {
margin-top: -12px;
}
.toggle-content ul ul {
margin-top: 0px;
list-style: circle;
}
.project-item figure h2 {
line-height: 18px;
}
.project-item figure a {
color: inherit !important;
}
.project-item figure h2:hover a {
text-decoration: none;
}
#projects .project-item .project-zoom {
z-index: 888;
}
/* menu_home */
#menu_home {
position: fixed;
top: 0;
right: 0;
height: 92%;
width: 290px;
margin: 40px 40px 40px 0;
background-color: rgba(0, 0, 0, 0.5);
backdrop-filter: blur(10px); /* Applique un flou de 10px à l'arrière-plan */
-webkit-backdrop-filter: blur(10px); /* Support pour les anciens navigateurs WebKit */
transition: transform 0.4s ease;
z-index: 1000;
}
#menu_home #menu-content {
height: calc(100vh - 80px);
overflow: auto;
padding: 30px 30px 0;
}
#menu_home #menu-content p {
color: #fff;
font-weight: bold;
text-transform: uppercase;
line-height: 22px;
}
#menu_home .menu-closed {
transform: translateX(114%);
}
#menu_home-content {
height: 100%;
padding: 15px;
background-color: rgba(255, 255, 255, 0.9);
overflow-y: auto;
}
#menu_home_toggle-button {
position: absolute;
top: 0;
left: -80px;
width: 80px;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
cursor: pointer;
}
#menu_home_toggle-button .container {
width: auto;
height: 100%;
}
#menu_home_toggle-button .row {
height: 100%;
}
@media (max-width: 767px) {
#menu_home {
width: 100%;
height: 100%; /* Make the menu full height */
margin: 0;
top: 0; /* Position at the top */
bottom: unset; /* Unset bottom */
transform: translateY(100%); /* Start hidden at the bottom */
z-index: 1000;
}
#menu_home_toggle-button {
position: fixed; /* Keep the toggle button fixed */
top: -80px;
left: 0;
width: 100%;
height: 80px;
background-color: rgba(0, 0, 0, 0.7);
cursor: pointer;
z-index: 1001; /* Ensure it's above other elements */
}
#menu_home .menu-closed {
transform: translateY(100%); /* Menu slides down off-screen */
}
}
/* /menu_home */
.nav {
margin: 20px 0 0;
}
ul.sub-menu {
list-style-type: none;
margin: 0 0 0 20px;
}
.nav:not(.nav-tabs) > li > a {
color: #fff !important;
padding: 3px 5px;
}
.nav:not(.nav-tabs) > li > a:hover {
color: var(--vert) !important;
}
.nav:not(.nav-tabs) > li .sub-menu a {
color: #fff !important;
padding: 3px 5px;
}
.nav:not(.nav-tabs) > li .sub-menu a:hover {
color: var(--vert) !important;
background-color: #eee;
border-radius: 4px;
}
.nav-stacked > .menu-item {
border-bottom: 1px solid #fff; /* Filet blanc */
}
.nav-stacked > .menu-item:last-child {
border-bottom: none; /* Pas de filet pour le dernier élément */
}
.rotated-text {
transform: rotate(90deg); /* Tourne le texte de 90 degrés vers la droite */
transform-origin: center center; /* Définit le point de pivot pour la rotation */
white-space: nowrap; /* Empêche le texte de se casser sur plusieurs lignes */
}
.icon-button {
color: white; /* Couleur de l'icône */
border: none;
border-radius: 50%; /* Rond */
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
cursor: pointer;
transition: background-color 0.3s, transform 0.3s;
padding: 0;
}
.icon-button .fa {
transition: transform 0.3s;
}
/*.icon-button.active {
background-color: #dc3545;
}*/
.vertical-align {
display: flex;
flex-direction: column;
height: 100vh; /* La hauteur de la fenêtre */
}
#responsive-layout {
width: 100%;
height: 100%;
}
#responsive-layout img {
max-width: 100px;
}
@media (min-width: 768px) {
#responsive-layout .col-xs-4 {
position: absolute;
width: 100% !important;
}
#responsive-layout .col-xs-4:first-child {
top: 15px;
}
#responsive-layout .col-xs-4:nth-child(2) {
color: #fff;
top: 50%;
transform: translateY(-50%);
display: flex;
justify-content: center;
align-items: center;
}
#responsive-layout .col-xs-4:last-child {
bottom: 15px;
}
#responsive-layout .col-xs-4 button {
margin: 0 auto;
}
.col-xs-push-4 {
left: auto;
}
.col-xs-pull-4 {
right: auto;
}
}
@media (max-width: 767px) {
#responsive-layout .col-xs-4 {
height: 100%;
}
#responsive-layout .rotated-text {
display: none;
}
#responsive-layout .col-xs-4 {
display: flex;
align-items: center;
justify-content: center;
}
#responsive-layout .col-xs-4:last-child {
justify-content: end;
}
}
.wprt-galleries-grid .item-wrap .zoom {
filter: alpha(opacity=100);
opacity: 1;
visibility: visible;
text-align: right;
width: 100%;
height: 100%;
}
.wprt-galleries-grid .item-wrap .zoom:hover {
color: #000;
}
.wprt-galleries-grid .item-wrap .zoom i {
margin-right: 20px;
}
.label_sale_sold {
font-size: 9px;
}
#sidebar .widget.widget_links ul.col2 li,
#footer-widgets .widget.widget_links ul.col2 li {
width: 100%;
}
#top-bar #top-bar-text .icons a {
margin: 0 4px;
}
#top-bar #top-bar-text .icons a:first-child {
margin-left: 0;
}
#top-bar #top-bar-text .icons a:last-child {
margin-right: 0;
}
#top-bar a:hover {
color: var(--vert);
}
.bt_wishlist_like {
background-color: #979797 !important;
border: 0;
position: absolute;
top: 5px;
left: 5px;
z-index: 999;
}
.bt_wishlist_like.btn-danger {
background-color: #8d071a !important;
}
/* changer le look du mouseover sur les images des maisons */
.project-item .effect-zoe figcaption {
background: rgba(60, 74, 80, 0.7);
color: white;
height: 100%;
z-index: 99;
}
.project-item .effect-zoe h2 {
float: none;
width: 100%;
font-size: 2.6rem;
margin: 20px 0 26px;
}
.project-item .effect-zoe h2 .small {
color: white;
}
.project-item .effect-zoe p {
color: white;
float: none;
width: 100%;
margin-top: 20px;
}
.project-item .effect-zoe figcaption .row {
font-size: 1.8rem;
}
.project-item .effect-zoe figcaption .row .col-xs-6 {
display: flex; /* pour centrer verticalement */
align-items: center; /* pour centrer verticalement */
margin-bottom: 10px;
}
.project-item .effect-zoe figcaption img {
width: 40px;
}
.button_cta {
background-image: url("/img/fleche_verte.png");
background-color: transparent !important;
background-position: right;
background-repeat: no-repeat;
color: var(--vert);
display: inline-block;
font-family: "Montserrat", sans-serif;
font-size: 38px;
font-weight: normal;
line-height: 40px;
padding: 1.285em 2.642em;
padding-left: 30px;
margin: 1px;
margin-right: 30px;
}
.button_cta:hover {
color: var(--vert);
text-decoration: underline;
}
@media (max-width: 479px) {
.button_cta {
background-size: 60px;
font-size: 32px;
padding-right: 2em;
}
}
body.admin p {
margin: 0 0 20px;
}
/* l'espace entre les photos pour les zones de contenu 11, 12 et 13 */
.zone_images .col-4 {
padding: 0 0 10px 15px;
}
.zone_images .col-8 {
padding: 0 15px 10px 10px;
}
.zone_images .col-12 {
padding: 0 15px 10px;
}
.zone_images.inverted .col-8 {
padding: 0 0 10px 15px;
}
.zone_images.inverted .col-4 {
padding: 0 15px 10px 10px;
}
.row.equal {
display: flex;
flex-wrap: wrap;
}
.zone_fond_gris {
background-color: #f8f8f8;
padding: 30px 30px 15px 30px;
text-align: center;
flex: 1; /* pour que toutes s'étirent également */
height: 100%;
/* lignes suivantes, pour centrer verticalement */
display: flex;
align-items: center;
justify-content: center;
flex-direction: column; /* pour empiler tes verticalement */
}
.zone_fond_gris span {
color: var(--vert);
padding-right: 6px;
}
.zone_fond_gris p {
line-height: 20px;
}
body.admin .zone_fond_gris p,
#tinymce .zone_fond_gris p {
color: var(--grisfonce);
}
.vert {
color: var(--vert);
}
.zone_10_css {
margin-bottom: 15px;
}
.zone_10_css .row {
margin-top: 30px;
}
.zone_10_css .vert {
letter-spacing: 1px;
font-size: 16px;
}
.zone_10_css h2,
body.admin .zone_10_css h2,
#tinymce .zone_10_css h2 {
color: var(--bleumarin);
font-size: 32px;
font-weight: 900;
margin: 0;
}
.zone_10_detail {
font-size: 16px;
padding-bottom: 30px;
}
a.bouton.btn.btn-primary,
body.admin a.bouton.btn.btn-primary,
#tinymce a.bouton.btn.btn-primary {
background-color: var(--vert) !important;
border-color: var(--vert) !important;
border-radius: 0 !important;
box-shadow: none !important;
color: #fff !important;
font-weight: bold;
min-width: 200px;
padding: 6px 12px !important;
}
a.bouton.btn.btn-primary:hover {
background-color: var(--grisfonce) !important;
border-color: var(--grisfonce) !important;
}
body.admin .text-right {
text-align: right;
}
#project-filter {
text-align: left;
padding-right: 60px;
margin-bottom: 20px;
}
.h2_bigger {
color: var(--bleumarin);
font-size: 34px;
font-weight: bold;
}
#home_moveinready {
line-height: 16px;
}
#home_moveinready .col-md-4 {
max-width: 370px;
margin: 0 auto;
}
#home_moveinready .row img {
width: 30px;
}
#home_moveinready .bouton {
width: 100%;
}
#home_moveinready .bigger {
font-size: 20px;
}
#home_moveinready .big {
font-size: 26px;
}
/* Dans la page "inventaire" en frontend */
#projects #home_moveinready {
width: 100% !important;
}
.image-carousel {
position: relative;
width: 100%;
max-width: 370px; /* ajuste selon ton besoin */
/*height: 277px;*/
overflow: hidden;
}
.image-carousel .ic-track {
display: flex;
width: 100%;
transition: transform 0.5s ease;
}
.image-carousel img {
flex: 0 0 100%;
width: 100%;
/*height: 200px;*/
object-fit: cover;
flex-shrink: 0;
}
.image-carousel button {
position: absolute;
top: 50%;
transform: translateY(-50%);
background: rgba(255,255,255,0.3) !important;
border: none;
font-size: 24px;
cursor: pointer;
padding: 5px 10px;
border-radius: 50%;
z-index: 2;
transition: background 0.2s;
}
.image-carousel button:hover {
background: rgba(255,255,255,0.5) !important;
}
.image-carousel .carousel-prev { left: 10px; }
.image-carousel .carousel-next { right: 10px; }
.row-flex-center {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
/* ******************************************** */
/* *** Ajuster la modale de Leaflet (carte) *** */
#map,
.map {
height: 750px;
width: 100%;
}
body.admin .leaflet-popup-content {
text-align: right;
}
body:not(.admin) .leaflet-popup-content {
font-size: 1.5em;
width: 300px;
}
.leaflet-popup-tip-container {
display: none;
}
.leaflet-popup-content-wrapper {
box-shadow: none;
border-radius: 0;
border: 1px solid #000;
}
.popup-content {
font-family: "Montserrat", sans-serif;
}
.popup-content table,
.popup-content th,
.popup-content td {
border: 0;
margin: 0;
padding: 0;
}
.popup-content table tr:first-child td {
text-align: right;
}
.popup-content table tr:last-child td:first-child {
text-align: left;
}
.popup-content table tr:last-child td:last-child {
text-align: right;
}
.popup-content img {
max-width: 240px;
}
.popup-content a.bouton.btn.btn-primary {
font-size: 10px;
min-width: auto;
text-transform: uppercase;
}
.adresse_civique {
font-size: 16px;
}
/* ******************************************** */
/* ******************************************************************** */
/* *** Petits label de filtres de recherche (modèles et Inventaire) *** */
.filters { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom: 20px; }
.chip{
display:inline-flex; align-items:center; gap:.5rem;
padding:.25rem .5rem; border:1px solid #979797;
font:500 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.chip strong{ font-weight:700; }
.chip--outline{ background:#fff; }
.chip__close{
appearance:none; border:0; background:transparent; cursor:pointer;
width:1.25rem; height:1.25rem; line-height:0.9; border-radius:999px;
font-size:14px; display:inline-grid; place-items:center;
padding: 0px;
color: white;
}
/* ******************************************************************** */
.wprt-button.small {
padding: 0.1em 0.6em !important;
font-size: 0.9em !important;
line-height: 18px;
}
.majuscule {
text-transform: uppercase;
}
.zone_infolettre {
background-color: #eee;
}