@font-face {
	font-family:"permanent-marker";
	src:url("https://use.typekit.net/af/3a60ef/00000000000000007735a0e4/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/3a60ef/00000000000000007735a0e4/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/3a60ef/00000000000000007735a0e4/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
	font-display:auto;font-style:normal;font-weight:400;font-stretch:normal;
	}


.violet {
	color: #591766;
}

.light-green {
	font-weight: 300;
	color: #B0918B;
}

.addresse {
	color: #000000 !important;
}

.green {
	color: #BABD17;
}

.bold-prix {
	color: var(--secondary);
	font-weight: bold;
}

.padding {
	padding-bottom: 0.5vw;
}

.bold {
	font-weight: 900;
}

li {
	margin-bottom: 0.7em !important;
}

main li::before {
	color: var(--secondary);
}


.btn {
	border: none;
	color: white;
	background-color: var(--navbar-button);
}
.btn:hover, .btn:active {
    color: var(--navbar-hover);
    fill: var(--navbar-hover);
	border: 1px solid var(--navbar-hover);
}
.btn:hover svg, .btn:hover svg * { fill: var(--navbar-hover); }

#formulaire .btn { 
	background-color: var(--primary);
}
#formulaire .btn:hover {
	color: var(--button-form-clr);
	background-color: var(--button-form-bg);
}

#projet {
	margin: 1vw 0 1.5vw !important;
}

#projet .mab_radio label {
   width: 6.5vw;
    height: max(2.5vw, 40px);
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: var(--primary--light);
/*    border: 1px solid var(--secondary);*/
    border-radius: 5px;
    transition: all 0.3s ease;
    padding: 5px max(0.5vw, 10px);
    line-height: 1vw;
    cursor: pointer;
}

.fw-900 {
	font-weight: 900;
}

#formulaire #projet .mab_radio input:checked+label {
    background-color: var(--primary);
    color: white;
    width: 6.5vw;
    height: max(2.5vw, 40px);
}

.form-group.projet .control-label { display:block; color:#000; text-align:center; font-weight:bold; }

#projet .control {
	display: flex;
	justify-content: space-between;
}

#projet p {
	margin-bottom: 0;
	font-size: 100%;
}

.mab_radio {
	grid-gap: 0 !important;
}

#heure {
	background-color: var(--primary--light);
	color: white;
	cursor: pointer;
}

header .baseline h1 {
	font-weight: 900;
	margin-bottom: 0.3vw;
}

@media (max-width: 1024px) {
	
	#projet .mab_radio label {
		width: 28vw;
		line-height: inherit;
	}

	#projet {
    	margin: 1vw 0 6vw !important;
	}

	#formulaire #projet .mab_radio input:checked+label {
	    
	    width: 28vw; 
	}
}

h3 {
	letter-spacing: 2px;
}

nav .logos > img {
	height: 5.5vw;
	margin-bottom: -2.5vw;
}

.small-size {
	font-size: 1vw;
	font-weight: 300;
	letter-spacing: 0.1vw !important;
}

header .baseline h1 strong {
	letter-spacing: 0;
}

/*header .baseline {
	opacity : 0.9;
}*/

header .baseline > div {
	background-color: var(--primary);
/*	padding-right: calc(var(--padd) * 11.2);*/
}

.titre-header{
	font-size: clamp(16px, 1.3vw, 21.5px) !important; 
}

#formulaire h2 {
	padding-bottom: 0;
	border-bottom: none;
}

header .header_bandeau {
	position: absolute;
	top: 2vw;
	z-index: 1;
	background-color: #498B78;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='768.248' height='245.779' viewBox='0 0 768.248 245.779'%3E%3Cpath id='Tracé_3834' data-name='Tracé 3834' d='M-295.971,0H472.276L411.369,245.779h-707.34Z' transform='translate(295.971)' fill='%23181730'/%3E%3C/svg%3E") no-repeat right/cover;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='768.248' height='245.779' viewBox='0 0 768.248 245.779'%3E%3Cpath id='Tracé_3834' data-name='Tracé 3834' d='M-295.971,0H472.276L411.369,245.779h-707.34Z' transform='translate(295.971)' fill='%23181730'/%3E%3C/svg%3E") no-repeat right/cover;
	color: white;
	padding-top: calc(var(--padd) * 1);
	padding-right: calc(var(--padd) * 2);
	padding-bottom: calc(var(--padd) * 1);
	padding-left: calc(var(--padd)*3);
}

nav.active {
	background-color: var(--navbar);
}

nav .logos span.upper {
	color: #010524;
}
nav.active .logos span.upper {
	color: white;
}

header .header_bandeau p {
	margin-bottom: 0;
	letter-spacing: 2px;
	font-weight: 300;
	font-size: 1.7vw;
}

header .header_offres {
    position: absolute;
    top: 4vw;
    right: 14vw;
    z-index: 1;
}

header .logos {
	padding: 0.6vw;
}

header .logos > img {
    width: 9vw;
}

header .header_offres img {
    width: 10vw;
    height: auto;
}

header .dispo li { display:block; line-height:4.5vw; text-transform:none; text-align:center; padding:0; }
header .dispo li > span { display:inline-block; width: 4.5vw; height: 4.5vw; vertical-align:middle; line-height:1em; text-align:center; font-size:1.3vw; font-weight:600; opacity: 1!important; background-color:#ffffff; border:1px solid #ffffff; color: var(--secondary); border-radius: 50%}
header .dispo li > span > sup { top:-0.5em; font-weight:400; margin-left:0.2em; }

.dispo {
	position: absolute;
	bottom: 11vw;
	left: 7vw;
	z-index: 1;
	display: flex;
	gap: 1vw;
}

.pictos-img {
	width: 5vw;
}


.dispo-element {
	vertical-align: middle;
	line-height: 1.5vw;
}

.dispo-element-text {
    margin-top: 0.5vw;
    line-height: 0.9em;
    font-size: 1.1vw;
}

header .baseline h2 {
	font-weight: 500 !important;
    font-size: 1.4vw !important;
    line-height: 1.6vw;
}

header .popup img {
    margin-bottom: 0.5vw;
}

header .popup > div:first-child::after {
	background-color: #344F24;
}

header .popup > div:last-child {
	color: #fff;
}

header .popup {
	top: -2.5vw;
	width: 8vw;
	height: 8vw;
}

.orange {
	background-color: #D9000D;
}

main #ptz li::before {
	color: #D4BD2A;
}




.dispo-element-text sup {
	top: -4px;
}

.ville {
	/* font-size: 1.8vw !important; */
	line-height: 2vw;
	/* color: #ffffff; */
	letter-spacing: 0.2vw;
}

header .header_bandeau p span {
	color: var(--secondary);
}

#gdp p {
	padding-left: 0;
	font-weight: 300;

}

header .baseline h2 {
	text-transform: capitalize;
}

.gdp-offer {
	background-color: #F5792C;
	width: 115%;
	padding: 0.5vw 0 0.5vw 0;
	margin-top: 1vw;

}

.gdp-offer .offer-txt {
	text-transform: uppercase;
	font-weight: 600 !important;
	letter-spacing: 0.2vw;
	margin-left: var(--padd);
/*	padding-left: 0 !important;*/
	color: #ffffff;
}

.gdp-offer .offer-txt:first-child {
	margin-bottom: 0vw !important;
}

#gdp .gdp-mention {
	margin-left: var(--padd);
	text-transform: uppercase;
	letter-spacing: .1vw;
	font-weight: 600;
	font-size: 0.5vw;

}

header .baseline > div {
	color: #344F24;
	padding-top: 1.5vw;
	padding-bottom: 3vw;
}

#addr {
	padding-top: 0.5vw;
	padding-bottom: 0.5vw;
}

#container_addr > strong {
	color: black;
}

#pres {
	line-height: 1.25em;
}
#pres h2 {
	font-weight: 700;
	color: #344F24;
}


/* ----- new GDP ----- */

.gdp-grid-price {
	display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    gap: .25vw;
    margin-left: var(--padd);
}

.gdp-grid-price p {
	margin-bottom: 0.25em !important;
}

.gdp-grid-price .price {
	text-align: center;
	color: #4F4554;
	font-weight: bold !important;
}

.row-table p {
	background-color: #EDEDED;
	padding: 0.5vw;
}

.row-table p span {
	padding-left: 0.5vw!important;
	color: #4F4554; 
	font-weight: bold;
}

.size-gdp {
	font-size: 0.8vw;
}

.gdp_sub_title {
	position: relative;
	left: 2.5vw;
}

.fno-title {
    background-color: #F37322;
    padding: 0.3vw 0.5vw 0.3vw 2.5vw !important;
    width: 92%;
    position: relative;
    left: 0vw;
    color: white;
    font-weight: bold !important;
    font-size: 1vw;
}

.titre-typo {
	color: #344F24!important;
	font-weight: bold!important;
	font-size: 1.3vw !important;
}

.accroche-newbase {
	font-family: 'Lato';
	font-size: 2vw;
	text-transform: uppercase;
	line-height: 2.5vw;
	font-weight: bold;
}

.newbase-div {
	width: 51vw;
	margin-bottom: -0.1vw;
	padding-top: 0.4vw!important;
	padding-bottom: 0.1vw!important;
}

/* .oldbase-div {
	width: 48.5vw;
	background-color: #fff!important;
	color: #344F24 !important;
	padding-top: 0.2vw!important;
	padding-bottom: 1.5vw;
} */

.accroche-newbase span {
	font-family: 'permanent-marker';
	font-size: 2vw;
}

.persona-0525 {
    position: absolute;
    left: 4.5vw;
    bottom: 18.3vw;
    width: 15vw;
}

.patch-prix {
	background-color: #D9000D;
	color: white;
	position: relative;
	padding: 0.2vw 0.5vw;
	font-size: 0.7vw;
	top: -0.2vw;
	width: 10vw;
	height: 3vw;
	padding-left: 0.5vw !important;
	margin-left: 0.7vw;
}

.fno-title {
	width: 100%;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='159' height='36' viewBox='0 0 159 36'%3E%3Cpath id='Tracé_3896' data-name='Tracé 3896' d='M0,0H159l-4.9,36H0Z' fill='%23181730'/%3E%3C/svg%3E ") no-repeat right/cover;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='159' height='36' viewBox='0 0 159 36'%3E%3Cpath id='Tracé_3896' data-name='Tracé 3896' d='M0,0H159l-4.9,36H0Z' fill='%23181730'/%3E%3C/svg%3E ") no-repeat right/cover;
	background-color: #D9000D;
	font-size: 0.8vw;
	font-weight: bold;
}




@media (max-width: 1024px) {
	#gdp {
		-webkit-mask: none;
		mask: none;
	}

	#gdp p {
		font-size: 3.5vw;
	}

	.gdp-grid-price {
		margin-left: 0;
		align-items: baseline;
	}

	.row-table p {
		padding: 1vw;
	}

	.row-table p span {
		padding-left: 2vw!important;
	}

	.gdp_sub_title {
		position: initial;
		left: inherit;
	}

	.fno-title {
		position: relative;
		left: -4vw !important;
		font-size: 3vw !important;
		padding: 1vw 1.5vw 1vw 4vw !important;
		width: 60%;
	}

	.titre-typo {
		color: #000!important;
		font-weight: bold!important;
		font-size: 3.5vw !important;
	}
	
	.patch-prix {
		font-size: 2.8vw;
		padding: 0.5vw 2vw;
		margin-left: 5vw;
		padding-left: 2vw !important;
	}
}


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





#gdp {
	padding-bottom: 1.5vw;
}

.gdp-livraison {
	margin-top: 1.5vw;
}

.title-form {
		font-weight: 300;
	}

footer {
	justify-content: start;
	gap: 10vw;
}

#formulaire {
	background-color: var(--formulaire);
	color: white;
}

footer .mentions {
	width: 75%;
}


.formLeads input, .formLeads select {
	color: white;
	background-color: var(--primary--light);
}

.formLeads input::placeholder {
	color: white;
}

.formLeads .mab_radio__control {
	border-color: transparent;
}
.formLeads .mab_radio__control {
	background-color: var(--primary--light);
}
.formLeads .mab_radio input:checked + .mab_radio__control {
	background-color: var(--primary);
}

footer .logos img {
	height: 5.5vw;
    max-width: unset;
    margin-right: 1vw;
}

.splide__pagination {
	bottom: 0px !important;
}

main .splide__pagination__page.is-active { background: white; opacity: 1; }
main .splide__arrow { border-radius: unset; opacity: 1; }
main .splide__arrow svg { display: none; }
main .splide__arrow--prev { background: url(../images/cprev.png) no-repeat center/contain; left:12em ; top: 50vw!important;}
main .splide__arrow--next { background: url(../images/cnext.png) no-repeat center/contain; right: 4em; top: 50vw!important;}

button.splide__arrow.splide__arrow--prev {
	left: 12vw !important;
}

header .splide { height: calc(100% - var(--padd2m)); align-self: flex-end; }

header .splide { height: 44vw; width: 120%; margin-left: -10%; }
header .splide .splide__slide { background-position: center !important; background-size:contain; }

.splide__arrow--next {
	background: #ffffff98 !important;
	right: 12em !important;
}

.splide__arrow--prev {
	background: #ffffff98 !important;
}

.splide__track, .splide .splide__list {
    height: 100.8% !important;
}

#gdp span.gdp-remise {
	padding: 0.3vw 0.5vw;
	margin-left: 0.5vw;
	background-color: var(--primary--light);
	color: white;
	border-radius: 5px;
	font-weight: 600;
	font-size: 0.8vw;
}

@media (max-width: 1024px) {
	header .splide { height: 80vw; width: 120%; margin-left: -10%; }
	main .splide__arrow--prev { background: url(../images/cprev.png) no-repeat center/contain; left:10vw  }
	main .splide__arrow--next { background: url(../images/cnext.png) no-repeat center/contain; right: 10vw }
	.splide__slide {
		background-size: cover;
	}
	.splide__arrow--prev {
		top: 55vw!important;
	}
	.splide__arrow--next {
		right: 12vw!important;
		top: 55vw!important;
	}

	header .logos {
		top: 30vw;
		padding-left: 2vw;
		background: none !important;
		mask: none !important;
		-webkit-mask: none;
	}

	.ville {
		font-size: 5.3vw !important;
		line-height: 1.2;
		/* color: white; */
		letter-spacing: 0.4vw;
	}

	nav .logos > img {
		height: calc(var(--nav)* 0.8);
		margin-top: 1vw;
	}

	nav.active:before {
/*		opacity: 0.9;*/
	}

	nav .btn {
		background-color: #344F24;
	}

	header .header_bandeau {
		top: 39.9vw;
		padding: 4.5vw 8.5vw 4.5vw 4vw;

		font-size: 4vw;
		letter-spacing: 0;
	}

	header .baseline{
		/* height: 0;
		padding-bottom: 0; */
	}

	header .baseline > div {
		height: 55vw;
		padding-top: 2vw;
		padding-right: 0;
		/* background-color: #4878BD; */
		opacity: 1;
	}

	header .baseline h2 {
		/* color: #ffffff; */
		font-size: 125%;
		font-weight: 500 !important;
    	font-size: 4vw !important;
    	line-height: 5vw;
    	width: 100%;
        /* padding-left: 35vw; */
	}

	.oldbase-div {
		padding-bottom: 14vw!important	;
	}


	header .baseline h1 {
	    margin-bottom: 0;
	}


	header .header_bandeau p {
		margin-bottom: 0;
		letter-spacing: 1px;
		font-size: 4.5vw;
	}

	header .header_offres {
        top: 30vw;
        left: 65vw;
        width: 100%;
        right: unset;
    }

	header .header_offres img {
		width: 20%;
	}

	header .pictos img {
		z-index: 1;
		top: 40vw;
		height: 15vw;
		width: 15vw;
	}

	header .pictos-img {
		width: 17vw;
	}

	header .pictos {
		top: 127vw;
	}

	header .popup {
		display: none;
        z-index: 1;
        top: unset;
        right: unset;
        bottom: 0;
        left: 0;
        width: 35vw;
        height: 35vw;
        max-width: 140px;
        max-height: 140px;
        transform: translate(calc(var(--padd) * 0.75), 66.6%);
    }

	.dispo {
		top: inherit;
		right: 3vw;
		left: auto;
		gap: 3vw;
		bottom: -5vw;
		flex-direction: column;
	}

	header .dispo li > span {
		width: 15vw;
		height: 15vw;
		font-size: 4vw;
	}

	.dispo-element {
		line-height: 3.5vw;
	}

	.dispo-element-text {
		margin-top: 1vw;
	    font-size: 3.6vw;
	    line-height: 0.9em;
	}
	main {
		margin-top: 10vw;
	}

	#bg_header {
		z-index: -1;
		background-size: cover;
		/* padding-top: 100%; */
		margin-top: 23vw;
	}

	#informations {
		padding-top: 0;
		margin-top: 5vw;
	}

	#pres {
		line-height: 5vw;
	}
	
	#pres p {
		margin-bottom: 3vw;
	}

	#plus ul, #ptz ul {
		line-height: 5vw;
		padding-left: var(--padd2d);
	}
	

	#plus ul li, #ptz ul li {
		margin-bottom: 4vw!important;
	}

	#container_addr > strong {
		color: white;
		font-weight: normal;
	}

	#container_addr > svg path:last-child {
		fill: var(--secondary);
	}

	.addresse {
		color: #ffffff !important;
	}

	#addr h3 {
		margin-bottom: -10px;
	}

	#gdp {
		padding-bottom: 0;
	}

	#gdp h3 {
		display: block !important;
		visibility: visible;
		left: -15px;
	}

	.gdp_sub_title {
		font-size: 3vw;
		padding-left: 0;
		margin-bottom: 2.5vw;
		margin-top: 3vw;
	}

	#gdp p {
		padding-left: 0;
		line-height: 4.5vw;
		font-weight: 300;

	}

	.gdp-livraison {
		margin-top: 3vw;
	}

	.gdp-mention {
		font-size: 2vw !important;
		margin-left: 0 !important;
	}

	.title-form {
		font-weight: 300;
	}

	.gdp-offer {
		width: 110%;
		text-align: center;
		margin: 0 -5vw 0 -5vw;
		margin-top: 5vw;
		padding: 1.5vw 0 1.5vw 0;
	}

	.gdp-offer .offer-txt {
		margin-left: 0;
	}


	#gdp span.gdp-remise {
		padding: 0.5vw 2vw;
        margin-left: 0.5vw;
        background-color: var(--primary--light);
        color: white;
        border-radius: 3px;
        font-weight: 600;
        font-size: 2.8vw;
	}
	

	/*.title p {
		width: 50%;
		text-align: center;
	}*/

	#formulaire h2 {
		border: none;
	}

	.formLeads input {
		padding-left: 7vw;
	}

	footer {
		padding-top: 20vw;
	}

	footer .mentions {
		width: 100%;
	}

	footer .logos > span {
		top: -9vw;
	}

	footer .logos {
		margin-bottom: -7vw;
	}
	footer .logos img {
		height: 20vw;
	}

	header .baseline h1 strong {
		letter-spacing: 1px;
	}

	#cta {
		position: fixed; z-index: 100;
		right: var(--padd2d); bottom: var(--padd2d); left: var(--padd2d);
		width: unset; height: 15vw;
		margin-left: 0;
		bottom: -4px;
		background-color: var(--cta-information);
	}

	nav.active {
		background-color: transparent;
	}
	nav.active:before {
		border: none;
		background-color: var(--navbar);
	}

	.btn:hover, .btn:active {
		color: white;
		fill: white;
		background-color:  var(--secondary);
	}
	.btn:hover svg, .btn:active svg {
		fill: white;
		color: white;
	}
	.btn:hover svg * {
		fill: white;
		color: white;
	}

	.newbase-div {
		width: 100%;
		height: 60vw !important;
	}

	.oldbase-div {
		width: 100%;
		height: 28vw !important;
		padding-top: 0vw!important;
	}

	header .baseline .newbase-div h1 {
        padding-left: 35vw;
		padding-top: 5vw;
    }

	/* header .baseline .oldbase-div h1 {
        padding-left: 35vw;

	} */


	.accroche-newbase {
		font-size: 3.1vw;
		line-height: 6vw;
	}

	.accroche-newbase span {
		font-family: 'permanent-marker';
		font-size: 4.5vw;
	}

	.accroche-newbase::before {
        content: '';
        position: absolute;
        background-image: url(../images/nante-natureo-persona.png);
        background-size: 38vw;
        background-repeat: no-repeat;
        width: 38vw;
        height: 35%;
        left: 1vw;
        top: 4.8vw;
    }

	.resize {
		font-size: 8vw!important;
	}

	header .logos > img {
        width: auto;
        height: 22vw;
    }

}

.plyr__video-embed {
	max-width: 100%;
	margin: 0 auto;
}

.plyr__video-embed iframe {
	width: 100%;
	height: 24vw;
	position: relative;

}


@media (max-width: 1024px) {
	.plyr__video-embed iframe {
		width: 100%;
		height: 53vw;
	
	}

}