/* -------------------------------------------------------------------------------------------- */

:root {
	--red: #eb0000 !important;
	/* --grey: #c4c4c4 !important; */
	/* --bgrey: #757575 !important; */

	--left2d	: calc(var(--left) * 0.5);
	--left3d	: calc(var(--left2d) * 4);
}

/* -------------------------------------------------------------------------------------------- */

.form_filter select { overflow:visible !important; }

.ui-slider .ui-slider-handle.ui-state-default.ui-corner-all:last-child:before {
	content:" ";
	position: absolute;
	margin-left: -5px; 
	top: -9px;
	width: 6px;
	height: 6px; 
	transform: rotate(-90deg);
	border-style: solid;
	border-width: 6px 8px;
	border-color: transparent var(--red) transparent transparent;
}

input[type="range"]::-webkit-slider-thumb { position:relative; }
input[type="range"]::-webkit-slider-thumb:before {
	content:" ";
	position: absolute;
	left: 0; top: -10px;
	width:10px; height:10px;
	background: var(--red);
}

.prix_container { display:flex; }
.prix_container > .control-label { flex:0 0 auto; padding-right:20px; height:1.5vw; line-height:1.5vw; }
.prix_container > .control { flex:1; height:1.5vw; line-height:1.5vw; }
.prix_container input[type="range"] { width:100%; height:10px; }
.prix_container .ui-slider { width:100%; background:rgba(255,255,255,0.3); border:none; height:14px; margin-top:0.5vw; border-radius:7px; } 
.prix_container .ui-slider .ui-slider-handle.ui-state-default.ui-corner-all { width:4px; height:100%; border-radius:0; border:none; margin-left:0; top:0; background:var(--red); }
.prix_container .ui-slider .ui-slider-handle.ui-state-default.ui-corner-all:after { font-family: Arial;white-space: nowrap; position: absolute; top: 19px; bottom: 0px; left:0px; font-size:60%; color:var(--white); }
.prix_container .ui-slider .ui-slider-handle.ui-state-default.ui-corner-all:last-child:after { left:auto; right:0; }

#modal_ml > .modal_wrapper { display:flex; flex-direction:column; overflow:hidden; padding-right:0; }
#modal_ml > .modal_wrapper #ml_container { flex:1; overflow-y:auto; padding-right:42px; }

.chunk_item > picture { display:inline-block; width:100%; height:100%; }

#programmes .form_filter > div#__prix { display:flex; flex-direction:column; padding-left:10px; padding-right:10px; }
#programmes .form_filter > div#__prix .ui-slider { /* margin-top:0 !important; */ background-color:white; }
.prix_container .ui-slider .ui-slider-range { background: #ddd; }
#programmes .form_filter > div#__prix label { flex:1; position:relative; left:0; width:100%; transform:none !important; padding-bottom:0px !important; }
.prix_container .ui-slider .ui-slider-handle.ui-state-default.ui-corner-all:last-child:after { display:none; }

/* -------------------------------------------------------------------------------------------- */

@media (min-width: 1024px) {
		
		body { overflow-x:hidden !important; }
		
		.programmes-search #carte-france { width:90%; }
		#france .map { width:70%; }
		
		section.filter-programmes .form_filter select { padding:0.3vw 0 0 0; height:2vw; }
		section.filter-programmes .form_filter .btn { height:2.85vw; }
		#pour .offer { max-width:100%; width:auto; }
		#pour ul li::before { top:0.75em; margin-top:-4px; }
		#s1 #benseigne { width:max(200px, 15.5vw); height:auto; max-height:16vw; width:auto; margin:0 auto 4vw auto; }
		
}

/* -------------------------------------------------------------------------------------------- */

@media (max-width: 1024px) {
		
		section.filter-programmes .form_filter { display: none !important; }
		ul.typologies > li > div > div:nth-child(2) { display:none; }
		ul.typologies { font-size:3.5vw; }
		.programme-body > .programme-column2 > .programme-descriptif { font-size:4vw; }
		.collapse .content { max-height:80px; }
}

/* -------------------------------------------------------------------------------------------- */

/* Boutton plaquette */

.download-pdf-button {
	width: 80%;
    height: max(3vw, 54px);
    background-color: red;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    margin: auto;
    margin-bottom: var(--padd);
    margin-top: var(--padd2d);
    font-weight: bold;
}

#programmes .view_modes { /* display:none !important; */ }

/* -------------------------------------------------------------------------------------------- */
#s1 {
    display: grid;
    grid-template-columns: calc(var(--mid) * 3) auto calc(var(--mid) * 2);
    justify-content: space-between;
}

#s1 > div:first-child {
	grid-column-start: 1;
	grid-column-end: 4;
	grid-row-start: 1;
	grid-row-end: 2;
	margin-bottom: 0;
}
/*#s1 > div:last-child {padding-top: 25%;}*/

#s1 > div:nth-child(2) {
	grid-column-start: 3;
    grid-column-end: 4;
    grid-row-start: 2;
    grid-row-end: 3;
}

@media (max-width: 1024px) {
	#s1 { grid-template-columns: 1fr; }
	#s1 > div:first-child {
		grid-column-start: 1;
		grid-column-end: 2;
	}
	#s1 > div:nth-child(2) { 
		grid-column-start: unset;
    	grid-column-end: unset;
   	 	grid-row-start: unset;
    	grid-row-end: unset;
	}
	#s1 > div:last-child {padding-top: 0;}
}

#offer {
	padding: 20px 0;
}

/****** 20240729 // Evolutions ******/

:focus { outline:none; }
body.tab-focus [tabindex="0"]:focus { outline:3px dashed #0080FF !important; outline-offset:-3px; }
body.tab-focus .ui-slider-handle:focus { outline:3px dashed #0080FF !important; outline-offset:-3px; }

video.video-header { position:absolute; left:0; top:0; right:0; bottom:0; width:100%; height:100%; background:black; object-fit:cover; }

.programme-body .etat_programme { /* background:#eb0000; */ background:rgba(0, 0, 0, 0.6); }
.programme-body .programme-livraison { z-index:101; right:1.9vw;}
/* .programme-body > .programme-column2 { background:var(--grey); } */

#programmes[data-view="compact"] .programme:not(.fixed) .programme-body:hover .programme-overlay { cursor:pointer; }
#programmes[data-view="compact"] .programme:not(.fixed) .programme-body:hover .programme-overlay > p { pointer-events:none; }

#programmes .view_modes .mode#compact { background-image:url('../images/picto-mosaique.svg') !important; background-size:60%; }
#programmes .view_modes .mode#full { background-image:url('../images/picto-liste.svg') !important; background-size:60%; }
#programmes[data-view="compact"] .view_modes .mode#compact { background-image:url('../images/picto-mosaique.active.svg') !important; background-color: var(--red); }
#programmes[data-view="full"] .view_modes .mode#full { background-image:url('../images/picto-liste.active.svg') !important; background-color: var(--red); }

.programme > .programme-header {
	line-height: 1em;
	padding-top: 0.8vw;
}

input[type="date"]::before { content:""; }
#formulaire #rdv_container { display:block; }
#formulaire #rdv_container > div:last-child { margin-left:0; }
#formulaire #rdv_container > .control { display:grid; grid-template-columns:1fr 1fr; }
#formulaire #rdv_container > .control > div { margin-right:10px; }
#formulaire #rdv_container > .control > div:last-child { margin-right:0px; }

footer #contact a.twitter { display:none !important; }
footer #mentions { /* background:var(--grey) !important; */ }

#border_container .border:not(:first-child) { border:1px solid #f2f2f2; }

header #france { }

#offers_container.one {
    grid-template-columns: 1fr;
    width: calc(3 * var(--mid));
    margin-left: 10.6vw;
}

nav {
	height: 5vw;
}

@media (min-width: 1921px) {
	
		section#pour .offer,
		section#pour #habiter p,
		section#pour #habiter ul > li,
		section#pour #investir p,
		section#pour #investir ul > li { font-size:1vw !important; }
		section#s1 > div p { font-size:1vw !important; line-height:1.3em; }
		
}

@media (min-width: 1025px) {
		
		body nav:not(.active) { width:50vw; }
		nav .btn-search { display:none; }
		
		header h1#baseline { line-height:unset; text-transform:unset; margin-bottom:unset; font-size:unset; }
		header h1#baseline > strong { font-size:1.8vw; line-height:2vw; }
		
		#programmes.full h2 { margin-top: calc(var(--padd) * 0.75); margin-bottom: calc(var(--padd) * 0.75); padding-right: calc(var(--mid) * 0.8); color: var(--black);
		    font-family: "DM Serif Text";
		    font-size: 2.2vw;
		    line-height: 1.1em; 
		    text-transform:none;
		}
		
		#programmes .form_filter { display:flex; width:calc(10.5vw * 6); }
		#programmes .form_filter > div { flex:1; }
		#programmes .form_filter > div.btn_container { justify-content:right; }
		#programmes .form_filter > #datepicker { display:none; }

		nav { padding:var(--padd) 2vw 0 2vw; }
		body.navbar-sticky main > section#programmes > .form_filter { position:fixed; top:0; z-index:1111; }
		body.navbar-sticky main > section#programmes > .form_filter > div { height:80px; background:transparent; }
		body.navbar-sticky main > section#programmes > .form_filter > div.prix_container .ui-slider { margin-top:1.5vw; }
		body.navbar-sticky main > section#programmes > .form_filter .btn { /* margin-top:calc((80px - 3vw) / 2); */ }
		body.navbar-sticky main > section#programmes > .form_filter #datepicker { display:none; }

		.programme-body > .programme-column1 > .Carousel > .CROP { height:23vw !important; }
		.programme-body > .programme-column2 { overflow:hidden; }
		.programme-body > .programme-column2 > .programme-descriptif { color:black !important; }
		.programme-body > .programme-column2 > .programme-descriptif > div { direction:ltr !important; }
		.programme-body > .programme-column2 > .programme-actions { gap:1vw; }
		.programme-body > .programme-column2 > .programme-actions #rdv { width:21vw; }
		.programme-body > .programme-column2 > .programme-actions #brochure { width:21vw; }
		/* .programme-body > .programme-column2 > .programme-typologies { overflow-y:hidden; } */
		.programme-body > .programme-column2 > .programme-typologies::-webkit-scrollbar { width:5px!important; }
		.programme-body > .programme-column2 > .programme-typologies::-webkit-scrollbar-track { background-color:#fff; border:none !important; box-shadow:none !important; outline:none !important; }
		.programme-body > .programme-column2 > .programme-typologies::-webkit-scrollbar-thumb { background-color:#777; }
		.programme-footer h2 { padding-right:calc(var(--mid) * 0.4) !important; }
		
		#formulaire.decouvrir > div { /* left:0 !important; */ left:max(320px, calc(var(--mid) * 4)) !important; } /* left:calc(var(--mid) * 4) !important; */
		.one_fixed .programme.fixed { /* left:max(320px, calc(var(--left) * 1.5)) !important; */ left:0 !important; transform:translateX(-100%); opacity:0; /* margin-left:-100%; */ }
		.one_fixed .programme.fixed.ok { transition:all 0.4s ease; transition-property:transform,margin-left,opacity; /* transition-delay:2s; */ transform:translateX(0); opacity:1; /* margin-left:0; */ }
		.one_fixed .fixed .programme-header h2 { margin-top:0 !important; margin-bottom:0 !important; }

		header #background {
    		background-size: 100%; /* 70%; */
    		background-position: left bottom;
    		/*margin-left: 4vw; */
		}

		header #background::after {
			content: "";
			height: 5vw;
			background-color: #fff;
			z-index: 1;
			position: absolute;
			top: 0;
			width: 100%;
    	}

		.programmes-search {
    		padding: 8.65vw 2vw;
    		font-family: 'Montserrat', sans-serif;
    		font-size: clamp(14px, 1.3vw, 18px);
		}

		nav {
        	padding: 0vw 2vw 0 2vw;
    	}

		nav .logo {
			width: 9vw;
			height: auto;
		}
		 
}

@media (max-width: 1024px) {
		
		nav.active .btn-search { display:inline-block; width:50px; height:50px; line-height:60px; text-align:center; font-weight:bold; color:var(--black); }
		nav:not(.active) .btn-search { display:none; }
		
		#programmes h1 { font-size:6vw; }
		.programme-body > .programme-column2 > .programme-descriptif { color:black; }
		.programme-body > .programme-column2 > .programme-descriptif .c_red { pointer-events:none; }
		.collapse .content { /* max-height:112px; */ max-height:27vw; }
		.collapse > p { margin-top:5vw; }

		header #background::after {
			content: "";
			height: 35vw;
			background-color: #fff;
			z-index: 1;
			position: absolute;
			top: 0;
			width: 100%;
    	}
		
	
}

#carte-france .mapTooltip { font-weight:normal !important; }
#carte-france .mapTooltip strong { font-weight:bold !important; }



/* new style offre tremplin 06-2025 */
header#cnatidf #baseline { 
	position: absolute; 
	left: calc(calc(17vw * 0.5) * 3.4); /*var(--left3d); */
	color: var(--white); 
}
header#cnatidf #baseline > div {
	font-size: clamp(28px, 1.5vw, 32px);
}
header#cnatidf #baseline > div > span {
    text-transform: unset;
    font-weight: 500;
	font-family: "Avenir";
}
header#cnatidf #baseline > div > span strong {
	font-weight: 700;
	font-family: "Avenir";
}
header#cnatidf #baseline > div > span.offre {
	margin-bottom: 10px;
}

header#cnatidf #baseline > div > span.offre strong{
	font-size: 35px;
}
header#cnatidf #baseline > div > span.offre::after {
    content: "";
    display: inline-block;
    width: 230px;
    height: 83px;
    background: url('../images/logo-tremplin-no-baseline.png') no-repeat;
    background-size: cover;
    background-position: left bottom;
    position: relative;
    top: 12px;
}

.logo-tremplin {
	width: 13.5vw;
	height: auto;
}

header#cnatidf .txt-header-promoteur {
    position: absolute;
    top: 2vw;
    right: 30vw;
    font-weight: 900;
    font-size: 0.9vw;
    z-index: 4;
}

header#cnatidf .txt-header-promoteur .text-blck {
	color: #000;
}

.programmes-search h2 {
	color: #000 !important;
}

header#cnatidf .txt-header-promoteur .text-red {
	color: var(--red);
}

header#cnatidf #patch-title {
	position: absolute;
	bottom: 15vw;
	left: 22vw;
	background-color: var(--red);
	color: white;
	padding: 0.5vw;
	font-size: 1vw;
	font-weight: 700;
}

header#cnatidf #patch1 {
	position: absolute;
	bottom: 7.1vw;
    left: 22vw;
	padding-top: 1.6vw;
    padding-left: 0.5vw;
} 

header#cnatidf #patch2 {
	position: absolute;
	bottom: 7.1vw;
    left: 32.52vw;
	padding-top: 1.6vw;
    padding-left: 0.7vw;
}

header#cnatidf #patch img {
	width: 35vw;
}

header #baseline {
	font-weight: bold;
}

header #baseline .dark, header #baseline .red, header #baseline .white {
	width: fit-content;
}

header #baseline .dark {
	padding: 0.3vw 0.5vw;
	background-color: #000;
	color: #fff;
	margin-left: 3vw;
}

header #baseline .red {
	padding: 0.3vw 0.5vw;
	background-color: var(--red);
	color: var(--white);
	margin-left: 5vw;
}

header #baseline .white {
	padding: 0.3vw 0.5vw;
	background-color: #fff;
	color: #000;
}

header .patch {
	width: 10.9vw;
    height: 8vw;
    background-color: #fff;
    border: 5px var(--red) solid;
   
}

header .patch .patch-dark1 {
	color: #000;
	font-weight: bold;
	font-size: 1vw;
}

header .patch .patch-red {
	color: var(--red);
	font-weight: bold;
	font-size: 1.2vw;
	line-height: 1.2em;
}

header .patch .patch-red b {
	font-size: 1.2vw;
}

header .patch .patch-dark2 {
	color: #000;
	font-weight: bold;
	font-size: 1.3vw;
	line-height: 1.6vw;
}

header#cnatidf #baseline .white:last-of-type {
	margin-left: 4vw; /* 9vw; */
}

header .deco {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 2.5vw;
	position: absolute;
	right: 6.9vw;
	top: 5vw;
}

header .deco .red, header .deco .dark {
	width: 3vw;
	height: 3vw;
}

header .deco .red {
	background-color: var(--red);
}

header .deco .dark {
	background-color: #000;
}


@media (max-width: 1024px) {
    .body {
		margin-top: 10vw;
	}

	header#cnatidf #france {
		top: 208vw;
	}

	header#cnatidf #patch {
		position: absolute;
		bottom: 24vw;
		right: 14%;
	} 

	header#cnatidf #baseline {
		width: 100%;
		left: unset;
	}

	header#cnatidf #baseline .white:last-of-type {
		margin-left:  23vw;	
	}

	header#cnatidf #baseline > div {
		width: 95%;
		margin: 0 auto;
	}

	header#cnatidf #patch img {
		width: 75vw;
	}

	header#cnatidf #baseline {
		text-align: center;
		text-transform: none;
	}

	header#cnatidf #baseline > div > span {
		font-size: clamp(20px, 5vw, 32px);
	}

	header#cnatidf #baseline > div > span.offre strong {
		font-size: 28px;
	}

	header#cnatidf #baseline > div > span.offre::after {
		content: "";
		display: inline-block;
		width: 170px;
		height: 61px;
		background: url(../images/logo-tremplin-no-baseline.png) no-repeat;
		background-size: cover;
		background-position: left bottom;
		position: relative;
		top: 12px;
	}

	header#cnatidf #patch-title {
		padding: 1.6vw;
		font-size: 3vw;
		bottom: 70vw;
		left: 16vw;
		width: 67vw;
		text-align: center;
	}

	#programmes {
	    margin-top: 110vw;
	}

	header .patch {
		top: 120vw;
		width: 34vw;
		height: 32vw;
		background-color: #fff;
		border: 5px var(--red) solid;
		
	}

	header .patch .patch-dark1 {
		color: #000;
		font-weight: bold;
		font-size: 4vw;
	}

	header .patch .patch-red {
		color: var(--red);
		font-weight: bold;
		font-size: 4.3vw;
		line-height: 1.2em;
	}

	header .patch .patch-red b {
		font-size: 4.2vw;
	}

	header .patch .patch-dark2 {
		color: #000;
		font-weight: bold;
		font-size: 4.5vw;
		line-height: 4.7vw;
	}

	header#cnatidf #patch1 {
		position: absolute;
		top: unset;
		bottom: 39vw;
		left: 16vw;
		padding-top: 7.5vw;
		padding-left: 1.5vw;
	}

	header#cnatidf #patch2 {
		position: absolute;
		top: unset;
		bottom: 39vw;
		left: 49vw;
		padding-top: 7.5vw;
		padding-left: 1.5vw;
	}

	header#cnatidf .txt-header-promoteur {
        position: absolute;
        top: 24vw;
        right: 23vw;
        font-weight: 900;
        font-size: 4vw;
        z-index: 5;
    }

	header #baseline .dark, header #baseline .red, header #baseline .white {
		width: fit-content;
		margin-left: inherit;
		margin: 0 auto;
	}

	header .deco {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 3.5vw;
		position: absolute;
		right: 0;
		top: 5vw;
	}

	header .deco .red, header .deco .dark {
		width: 5vw;
		height: 5vw;
	}

	.logo-tremplin {
		width: 41.5vw;
	}

	nav.active .logo-mobile {
	display: none;
	}

}