@charset "UTF-8";
/***
CSS BY ARTAMEDIA
GNEISS IMMOBILIER - 2025 J5

bleugris : #485A65 rgba(72, 90, 101, 1)
bleugris clair : #576a76
+ clair : #acc0cd
beige clair : #e6e3de
beige : #a18b79
fonts : Montserrat
***/

:root {
  --img-hover-scale: 1.1;
  --img-hover-duration: 280ms;
  --img-ease: cubic-bezier(.2,.6,.2,1);
}

/*** GLOBAL ***/
body {background-color:#fff}
body, p {font-family: "Montserrat", "Opensans", sans-serif; color:#444; font-size: 16px}
h1, h2, h4, h6 .sp-page-title .sp-page-title-heading {font-family: "Montserrat", sans-serif; color:#485A65}
h3 {font-family: "Montserrat", sans-serif; color:#a18b79}
.qx-h1, h1 {font-size: 2rem;}
.qx-h2, h2 {font-size: 1.7rem;}
.qx-h3, h3 {font-size: 1.2rem}
.qx-h4, h4 {font-size: 1.2rem; color:#666}
.qx-h4, h5 {font-size: 1.5rem; color:#666; font-family: "Caveat", cursive}
#intro, #titre, #temoignages, .sp-page-title, #sp-title {background-color:#e6e3de}

em {color:inherit}
#rdv {background-color:#acc0cd}
#rdv  h2, #rdv h4 {color:#485A65}

a:link, a:visited {color:#485A65}
a:hover, a:focus {color:#576a76; text-decoration:none!important}

.tpp-bootstrap hr {border-top: 1px solid rgba(0, 0, 0, 0.5);}


#sp-main-body {padding: 0}
.qx-section {padding:40px 0}
#home-slider {padding:0}
#sp-component {padding:0 0 0 0}
.sp-page-title {padding:40px 0 40px 0}
.sp-page-title .sp-page-title-heading {font-size: 1.8rem; font-weight: 500; line-height: 2; text-align: center; line-height: 3.2em; color:#485A65}

/*PRE FOOTER (Bottom)*/
#sp-bottom {padding: 0}
#sp-bottom .sp-module {margin-bottom: 0}
#sp-bottom a, #sp-bottom a:visited {color: #485A65}
#sp-bottom a:hover, #sp-bottom a:focus {color: #576a76}
#sp-bottom .sp-module ul>li {display: block; margin-bottom: 0; padding:0 0 6px 0}

/*HEADER & FOOTER*/
#sp-header, #sp-footer {background: #485A65; color: #fff}

#sp-footer .container-inner {padding: 8px 0; border-top: none;}
#sp-footer a, #sp-footer a:link, #sp-footer a:visited {color:#acc0cd}
#sp-footer a:hover, #sp-footer a:focus {color: #fff}
#sp-footer .sp-copyright>span {color:#acc0cd; font-size: 110%}
#footer {background-color:#d5dadd!important }
#sp-footer1 {text-align: center}

/*HEADER*/
#sp-header {box-shadow:0 0 0 0; height: 90px}
#sp-header .logo a {font-weight: 600; padding-left:80px; background-image: url("../../../images/gneiss-immobilier-logo-icone.png"); background-repeat: no-repeat; background-position:0 12px; background-size:70px; line-height:86px; color:#fff}
#sp-header .logo-slogan {padding-left:80px; display: block; margin-top: -30px; font-size: 13.2px; font-weight: 500; color:#fff}

/*BOUTONS*/
.error-page a.btn-secondary, .qx-btn-outline-primary {
    color: #485A65;
    background-color: transparent;
    background-image: none;
    border-color: #485A65;
}
.error-page a.btn-secondary:hover, .error-page a.btn-secondary:active, .error-page a.btn-secondary:focus, 
.qx-btn-outline-primary:hover, .qx-btn-outline-primary:active, .qx-btn-outline-primary:focus {
    color: #fff;
    background-color: #485A65;
    border-color: #485A65;
}
.qx-btn-outline-primary:not(:disabled):not(.qx-disabled):active,
.qx-btn-primary:not(:disabled):not(.qx-disabled):active {
	 background-color:#576a76; 
	 border-color:#485A65
}

/*LANGUES*/
div.mod-languages ul li.lang-active, div.mod-languages ul li:hover {
    background-color: transparent!important;
    padding: 0 3px 1px 3px;
	border-bottom:#fff 1px solid!important;
    border-radius: 0px;
}

/*NAV*/
#sp-menu a {text-transform: uppercase; font-size:15px; color:#fff}
#sp-menu .sp-dropdown-inner {background-color:#485A65}
.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span {line-height: 90px}
.sp-megamenu-parent>li:last-child>a {padding:0 15px}
#sp-menu .sp-megamenu-parent>li.active>a, 
#sp-menu .sp-megamenu-parent>li.active:hover>a,
#sp-menu .sp-megamenu-parent>li:hover>a,
#sp-menu .sp-megamenu-parent .sp-dropdown li.sp-menu-item>a:hover {color:#acc0cd}
#sp-menu .sp-megamenu-parent>li.active>a, .sp-megamenu-parent .sp-dropdown li.sp-menu-item.active>a {color:#acc0cd; font-weight: 600}


/*NAV OFF CANEVAS*/
.burger-icon>span { background-color: #fff}
.offcanvas-menu .offcanvas-inner ul.menu li.active a {color:#485A65!important}
.offcanvas-menu .offcanvas-inner ul.menu>li a:hover, .offcanvas-menu .offcanvas-inner ul.menu>li a:focus, .offcanvas-menu .offcanvas-inner ul.menu>li span:hover, .offcanvas-menu .offcanvas-inner ul.menu>li span:focus {color: #000}

body.ltr #offcanvas-toggler.offcanvas-toggler-right {margin-top: 8px}


/*** HOME ***/
#col .qx-element-wrap+.qx-element-wrap {margin-top:8px!important}

/* ÉTAT DE BASE : on fige la transition ici (jamais au :hover) */
#intro figure {overflow: hidden}
#intro figure a img{
  display:block;
  width:100%;
  height:auto;
  transform: scale(1) translateZ(0);         /* valeur initiale */
  transform-origin:center center;
  transition: transform var(--img-hover-duration) var(--img-ease) !important;
  will-change: transform;
  backface-visibility: hidden;
}

/* HOVER + FOCUS clavier : on ne redéfinit PAS transition ici */
#intro figure a:hover img,
#intro figure a:focus-visible img{
  transform: scale(var(--img-hover-scale)) translateZ(0);
}

/* Optionnel : feedback de focus (accessibilité) */
#intro figure a:focus-visible{
  outline:2px solid #5b9dd9;
  outline-offset:3px;
}

/* Respect des préférences */
@media (prefers-reduced-motion: reduce){
  #intro figure a img{ transition:none !important; }
}

/*Blurb*/
.qx-element-blurb__media {margin-bottom: 0!important}
.qx-element-blurb__body p {font-size:14px}
#home-slider-col .qx-col-wrap {padding:0}
#diapo .qx-dotnav li; * {background-color:#fff}
#diapo .qx-dotnav li.qx-active * {background-color:#ECAB00}

/*Témoignages*/
.slider-wrapper svg {color:#a18b79}
.qx-dotnav>.qx-active>* {background-color:#a18b79}
.qx-dotnav>*>* {border-color:#a18b79}
.qx-dotnav>*>:hover {background-color:#d4bfa9}

/*** A PROPOS ***/
#gneiss {background-attachment: fixed}

/*** PRESTATIONS ***/
#courtage, #ppe {background-color:#e6e3de}
#header {padding:0!important}
#header .qx-col-wrap {padding: 0!important}
#header img {width: 100%}

/*** PROMOTIONS ***/
#tpPortfolio {padding: 40px 0}
.tplElegant .element .card-body {padding: 2px 8px 8px 8px}
.tplElegant .element .TzPortfolioDescription .tpMeta {font-size:13px; letter-spacing: -1px;}
.tplElegant .element .TzPortfolioDescription .TzPortfolioIntrotext {float:right; margin-top:-18px}
.tplElegant .element .TzPortfolioDescription .TzPortfolioIntrotext p {margin-bottom:0; font-size:13px; letter-spacing: -1px; padding-left: 12px; background-image:url("../../../../../images/iconpin.png"); background-repeat:no-repeat; background-position: 0 0}
.tp-tags:before {display:none} /*supprimer icone par défaut devant le nom des tags*/
.tpp-item-tags {background-image:url("../../../../../images/iconroom.png"); background-repeat:no-repeat; background-position: 0 0; padding-left:12px} /*icone chambres et pièces*/
.tpp-bootstrap .badge {padding: 0.4em;font-size: 90%;} /*tags dans détail bien*/
.tpArticleTag .title {display:none} /*Titre "Tagged under"*/

h3.TzPortfolioTitle a:hover {text-decoration: none; margin: 0} /*titre des projets en rollover*/
h3.TzPortfolioTitle a {color:#fff!important; text-shadow: #000 1px 1px 3px; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; padding-top: 30%; text-align: center} /*positionner zone de clic en rolloverc*/

/* #tpPortfolio .iconhover {display: none}  masquer les icone lien et loupe */
.TzInner:hover .tz_portfolio_plus_image_gallery {webkit-filter: grayscale(100%); filter: grayscale(100%);} /*img noir et blanc en rollover*/

#tz_options {padding: 0 8px 24px 8px} /*espaces autour des boutons de catégorie*/

/* FORM lié à chaque bien */
.convertforms {border: 1px solid rgba(0, 0, 0, .125)!important; border-radius: .25rem!important; margin: 24px 15px 40px 15px!important}
.convertforms .cf-response p {}
/*Exclusion du formulaire sur la page liste vente/location */
body.view-portfolio .sp-module-content-bottom {display: none}

.tpp-bootstrap .btn-primary:not(:disabled):not(.disabled):active, .tpp-bootstrap .btn-primary:not(:disabled):not(.disabled).active, .show>.tpp-bootstrap .btn-primary.dropdown-toggle, .tpp-bootstrap .btn-primary:hover, .qx-btn-primary:hover {
    color: #fff!important;
    background-color: rgba(72, 90, 101, 0.4);
    border-color: #485A65;
}
.tpp-bootstrap .btn-primary, .qx-btn-primary {
    color: #fff!important;
    background-color: #485A65;
    border-color: #fff;
}
.cf-btn-text {border-radius: 0.25rem!important}

/*Page d'un projet*/
/*#tz-portfolio-template-information,#tz-portfolio-template-vote, .tp-item-tools {display: none} Date, auteur, catégorie, vues et votes et print*/
#tz-portfolio-template-introtext {padding: 32px 0} /*espace autour du texte de présentation*/
#tz-portfolio-template-title {padding-top: 40px!important} /*espace au dessus du titre du projet, haut de page*/
#tz-portfolio-template-title h1.tpTitle {color:#485A65; line-height: 1.4!important; font-size: 2rem} /*titre du projet*/
.flexslider .flex-control-nav {bottom: 0px} /*points de navigation sur le slide*/
.tpp-bootstrap ol {margin-bottom: 8px} /*points de navigation sur le slide*/

/*** CONTACT ***/
#contactform #cf_1 {margin: 0 auto}
.convertforms.cf-success .cf-response {background-color:#a18b79!important; color:#fff} /*message succes envoi*/
.convertforms.cf-success .cf-response p, .convertforms.cf-success .cf-response span {color:#fff; padding: 8px 0} /*message succes envoi*/
#contactform .qx-form-check input[type="radio"] {height:16px!important} /*corrige la forme du radio boutton*/
a.icontel {line-height: 24px; padding-left: 30px; background-image: url("../../../images/icontel.png"); background-position: 0 0; background-repeat: no-repeat; display: inline-block}
a.iconmail {line-height: 24px; padding-left: 30px; background-image: url("../../../images/iconmail.png"); background-position: 0 0; background-repeat: no-repeat; display: inline-block}

/*** RESPONSIVE ***/

@media (min-width: 1600px){
	#diapo .qx-slideshow.slider-height-custom, #diapo .qx-slideshow.slider-height-custom .qx-slideshow-items img {height: 720px!important;}
}
@media (min-width: 1280px) and (max-width: 1599px){
	#diapo .qx-slideshow.slider-height-custom, #diapo .qx-slideshow.slider-height-custom .qx-slideshow-items img {height: 600px!important;}
}
@media (min-width: 1024px) and (max-width: 1279px){
	#diapo .qx-slideshow.slider-height-custom, #diapo .qx-slideshow.slider-height-custom .qx-slideshow-items img {height: 500px!important;}
}
@media (min-width: 768px) and (max-width: 1023px) {
	#diapo .qx-slideshow.slider-height-custom, #diapo .qx-slideshow.slider-height-custom .qx-slideshow-items img {height: 400px!important;}

}
@media (max-width: 991px){
		#sp-header {height: 80px}
	#sp-header .logo {
        height: 72px;
    }
	#sp-header .logo a {
        background-size: 64px;
		padding-left: 72px;
    	background-position: 0 8px;
    	line-height: 72px;
	}
	#sp-header .logo-slogan {
		margin-top: -26px;
		padding-left: 72px;
	}
}
@media (max-width: 767px) {
	#diapo .qx-slideshow.slider-height-custom, #diapo .qx-slideshow.slider-height-custom .qx-slideshow-items img {height: 300px!important;}
	.qx-h3, h3 {font-size: 1.4rem}
	#sp-bottom .sp-module ul>li>a {text-align: center}
}
@media (max-width: 575px){
	#sp-header .logo a {
    	padding-left: 55px;
    	background-position: 0 20px;
    	line-height: 78px;
    	background-size: 50px;
    	font-size: 20.5px;
	}
	#sp-header .logo-slogan {
   	 	padding-left: 55px;
    	font-size: 11px;
		margin-top: -25px;
	}
}
@media (max-width: 480px) {

}
@media (max-width: 378px) {
	#sp-header .logo a {
		padding-left: 48px;
        background-position: 0 20px;
        line-height: 68px;
        background-size: 44px;
        font-size: 19px;
	}
	#sp-header .logo-slogan {
    	padding-left: 48px;
    	font-size: 10.2px;
	}
}