@font-face {
	font-family: 'cambria';
	src: url('../../../../../css/fonts/cambria/cambria.ttf')  format('truetype'),
	     url('../../../../../css/fonts/cambria/cambria.woff2') format('woff2'),
			 url('../../../../../css/fonts/cambria/cambria.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'AbrilFatface';
	src: url('../../../../../css/fonts/abrilfatface/AbrilFatface-Regular.ttf')  format('truetype'),
	     url('../../../../../css/fonts/abrilfatface/AbrilFatface-Regular.woff2') format('woff2'),
			 url('../../../../../css/fonts/abrilfatface/AbrilFatface-Regular.woff') format('woff'),
			 url('../../../../../css/fonts/abrilfatface/AbrilFatface-Regular.svg#AbrilFatface-Regular') format('svg'),
			 url('../../../../../css/fonts/abrilfatface/AbrilFatface-Regular.eot'),
			 url('../../../../../css/fonts/abrilfatface/AbrilFatface-Regular.eot') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "arialBlack";
	src: url('../../../../../css/fonts/arialblack/ariblk.ttf') format('truetype'),
			 url('../../../../../css/fonts/arialblack/ariblk.woff2') format('woff2'),
			 url('../../../../../css/fonts/arialblack/ariblk.woff') format('woff'),
			 url('../../../../../css/fonts/arialblack/ariblk.svg#ariblk') format('svg'),
			 url('../../../../../css/fonts/arialblack/ariblk.eot'),
			 url('../../../../../css/fonts/arialblack/ariblk.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'istok';
	src: url('../../../../../css/fonts/istok-web/istokweb-regular-webfont.woff') format('woff'),
		url('../../../../../css/fonts/istok-web/istokweb-regular-webfont.woff2') format('woff2'),
		url('../../../../../css/fonts/istok-web/istokweb-regular-webfont.svg#istokweb-regular-webfont') format('svg'),
		url('../../../../../css/fonts/istok-web/istokweb-regular-webfont.ttf') format('truetype');
		font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'jacques-francois';
	src: url('../../../../../css/fonts/jacques-francois/jacquesfrancois-regular.woff') format('woff'),
		url('../../../../../css/fonts/jacques-francois/jacquesfrancois-regular.woff2') format('woff2'),
		url('../../../../../css/fonts/jacques-francois/jacquesfrancois-regular.svg#jacquesfrancois-regular') format('svg'),
		url('../../../../../css/fonts/jacques-francois/jacquesfrancois-regular.ttf') format('truetype');
		font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'inter-classic';
	src: url('../../../../../css/fonts/inter-classic/inter-variable.woff') format('woff'),
		url('../../../../../css/fonts/inter-classic/inter-variable.woff2') format('woff2'),
		url('../../../../../css/fonts/inter-classic/inter-variable.ttf') format('truetype');
		font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'bodoni';
	src: url('../../../../../css/fonts/bodoni/librebodoni.woff') format('woff'),
		url('../../../../../css/fonts/bodoni/librebodoni.woff2') format('woff2'),
		url('../../../../../css/fonts/bodoni/librebodoni.svg#librebodoni') format('svg'),
		url('../../../../../css/fonts/bodoni/librebodoni.ttf') format('truetype');
		font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

html {
	--white: #FFF;
	--black: #222;
	--grey: #a2a2a2;
	--purple: #b007ff;
	--purple-light: #f6e4ff;
	--blue: #008fff;
	--blue-light: #57a5e2;
	--yellow: #ffde00;
	--yellow-light: #fffbe3;
	--green: #00D42F;
	--green-tchat: #206519;
}
div{
	--border-color-medium-header: var(--purple)
}
button {
	--bg-color-btn-form-request: var(--purple);
	--text-color-btn-form-request: var(--white);

	/* --bg-color-btn-cards: var(--yellow); */
	--text-color-btn-cards: var(--white);
}
span {
	--text-color-phone: var(--green-tchat, #206519);
}
.mainContent{
	--bg-color-main-content: #ebebeb;
}
#form-box {
	--border-color-form-box: #00D42F;
	--bg-color-form-box: rgba(255, 255, 255, 0.4);
}
#ban-phone{
	--bg-color-ban-phone: #fae0ff;
}
#tchat-window{
	--border-color-tchat-window: var(--purple);
}
#spinner{
	--border-color-spinner-default:#206519;
}
#spinner::before{
	--border-color-spinner-before: #206519;
}
#spinner::after{
	--border-color-spinner-after: #206519;
}
#is-typing-container{
	--border-color-is-typing-container: #000;
}
.dots{
	--bg-color-dots: #c851ff;
}
#btn-paper-plane{
	--bg-color-btn-typing: #206519;
	--text-color-btn-typing: #FFF;
}
#container-mailing{
	--border-color-form-box: #00D42F;
}

#title-form-action,
#title-cards-action,
#call {
	--text-color-titles: var(--green);
	--bg-color-btn-call: var(--green);
}

#phone-button{
	--bg-color-phone-ico : #FFF;
	--border-color-phone-ico : #08b9fe;
	--text-color-phone-ico : #0f93e5;

	--text-color-phone-number : #0f93e5;
}

.ban-call-container{
	--border-width-call-content: 2px ;
	--border-width-call-container-bottom: 5px;
}
#ban-call-private{
	--border-color-call-content: #0b1470;
	--border-color-call-container-bottom: #37f6f8;

	--padding-call-content: 0 0 6px;

	--text-color-call-title:#0b1470;
	--text-color-call-subtitle:#0b1470;
	--text-color-call-phone:#0f81ff;
	--text-color-call-tarif:#0b1470;

	--text-size-call-title: 27px;
}
#ban-call-audiotel{
	--border-color-call-content: #a50f78;
	--border-color-call-container-bottom: #a50f78;

	--padding-call-content: 2px 5px 6px;

	--text-color-call-title:#a50f78;
	--text-color-call-subtitle:#0b1470;

	--text-size-call-title: 32px;
}
#reponse {
	--background-color-content: #f7fafd;
}
#phone-button-response{
	--bg-color-phone-ico: #FFF;
	--border-color-phone-ico: #2a3c67;
	--text-color-phone-ico: #2a3c67;
	--text-color-phone-number: #2a3c67;
	--border-color-phone-number: #2a3c67;
}

body{font-family: 'cambria', 'Times New Roman', serif;font-size:17px}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{font-family: 'Helvetica Neue Medium';}
h1, h2, h3, p {margin:0; padding:0}
a:hover, a:active{text-decoration: none;}
.text-grey{color:var(--grey, #FFF)} .bg-grey{background-color:var(--grey, #FFF)}
.color-white{color:var(--white, #FFF)}
.color-blue{color:var(--blue)} .bg-blue{background-color:var(--blue-light)}
.color-blue-light{color: var(--blue-light);}
.border-top-gray{border-top: 1px solid#dadada;}
.pad-15 {padding: 15px !important;}
.underline{text-decoration:underline}
.hr{border-top:1px solid #000;max-width:280px;margin:10px auto 20px;}
.container {padding: 0;background-color: #fff;}
.break-line{display:block}
.center-block{float:none;}
.text-bold{font-weight: bold;}
.border-grey{border-top: 1px solid #efefef;margin: 20px auto 0;width: 80%;max-width:600px}

.bg-light-purple{background-color: var(--purple-light, #dcdbfd);}
.bg-white{background-color: #FFF;}
.bg-grey{background-color: #777;}
.bg-light-blue{background-color: #f7fafd;}

.border-section{border-top: 2px solid #b007ff;width:90%;max-width: 800px;margin: 0 auto;background-color: #f7fafd;}

/* header */
header, #header{position: relative;border-bottom: 7px solid #e7e7e7;box-shadow: 2px 0 2px #000, -2px 0 2px #000;}
#header-medium-container {position: absolute;left: 50%;transform: translate(-50%, -65%);overflow: hidden;width: 32%;max-width: 200px;border: 3px solid var(--border-color-medium-header);border-radius: 50%;}


/* #valide .title1-top, #interdiction .title1-top{color:#b008fe;font-size:23px;font-weight: bold;margin-bottom:0;margin-top:0;font-family:'Times New Roman', Times, serif;padding-top:15px;text-align: center;}
#valide .title2-top, #interdiction .title2-top{color:#b008fe;font-size:21px;font-weight:normal;margin:0 auto;padding:8px 0;font-family:'Times New Roman', Times, serif;display: flex;flex-direction: row;flex-wrap: nowrap;align-content: center;justify-content: center;align-items: center;} */
.title2-top .fa-envelope {display: none;visibility: hidden;}
#valide .title3-top, #interdiction .title3-top{color:#263C6A;font-size:17px;font-weight:bold;text-align: center;margin-top:0;margin-bottom:5px;font-family:'Times New Roman', Times, serif;padding-top:10px;padding-bottom:15px}

.title4-txt{font-family: 'arialBlack', Arial sans-serif;color:#263C6A;font-size:18px;margin:0 auto 10px;text-align: center;padding-top: 20px;}
.title5-txt{font-family: Arial, Helvetica, sans-serif;color:#263C6A;font-size:14px;margin:20px auto 10px;text-align: center;font-style: italic;}
.title4-txt span{display:block}
.title4-txt span{font-family: Arial, Helvetica, sans-serif; font-weight: bold;font-size: 20px;margin-top: 7px;}

/* cards */
/* #cards-animation-container{background-color:rgb(246 228 255 / 30%)} */
#cards-animation{display: flex;flex-wrap: wrap;justify-content: space-evenly;align-items: center;align-content: center;max-width: 800px;}
.blk-cards{width: 50%;perspective: 600px;}
.card{position: relative;width: 80px;height: 156px;cursor: pointer;transform-style: preserve-3d;transform-origin: center right;transition: transform 0.45s ease-in-out;margin: 10px auto;border-radius: 5px;box-shadow: 0 2px 3px #333;}
.blk-cards.is-flipped .card{transform: translateX(-100%) rotateY(-180deg);box-shadow: inherit}
.face-card, .back-card{position: absolute;width: 100%;height: 100%;-webkit-backface-visibility: hidden;backface-visibility: hidden;border-radius: 5px;border:1px solid var(--bg-color-btn-cards)}
.face-card {transform: rotateY(180deg);}
.card-chosen{animation: anim-card-chosen;animation-delay:0.50s;animation-duration: 0.40s;animation-iteration-count: 1;animation-timing-function: ease-out;}

/* form */

#request-lead{position:relative;overflow:hidden;width:100%;padding: 8px 0;text-transform: uppercase;font-size: 22px;letter-spacing: .5px;color:var(--text-color-btn-form-request, #FFF);background-color: #000;border-radius: 12px;font-weight: bold;border:3px solid #00D4B7}

#request-lead[disabled]{opacity: 0.85}
#request-lead.loading{display: flex;flex-direction: row;flex-wrap: nowrap;align-content: center;justify-content: center;align-items: center;margin-left: auto;margin-right: auto;}
#button-form-loader{display: inline-block;margin-right: 8px;width: 23px;aspect-ratio: 1;--_c: radial-gradient(farthest-side,#FFF 92%,#0000);background: var(--_c) top, var(--_c) left, var(--_c) right, var(--_c) bottom;background-size: 7px 7px;background-repeat: no-repeat;animation: anim-button-fom-loader 1s infinite;}

@keyframes anim-button-fom-loader {to{transform: rotate(.5turn)}}
@-webkit-keyframes anim-button-fom-loader {to{-webkit-transform: rotate(.5turn)}}

/* call section */
#call{padding:20px 0 10px;}
#call-picture-container{width:70%;height:auto;max-width: 240px;padding-bottom:30px;padding-top:30px}

#call .title-txt{font-weight: bold;font-size: 18px;margin: 0;font-family: 'arialBlack', Arial sans-serif;color: var(--text-color-titles)}
#call .subtitle-txt{font-size: 21px;margin: 0;font-family: Arial, Helvetica, sans-serif;font-weight: normal;color: var(--text-color-titles)}
#call .title3-medium{font-family: 'arial', Arial sans-serif;color: #000;font-size: 17px;margin: 20px auto 10px;text-align: center;font-style: italic;}

#call .list-container{text-align: center;}
#call .list-container ul{list-style: none;padding: 0;margin: 30px 0 0;font-family: 'Times New Roman', Times, serif;font-size:22px;text-align: center;}
#valide #call .list-container ul, #interdiction #call .list-container ul{margin: 5px 0 15px;}
#call .list-container li{padding-left: 1rem;text-indent: -0.75rem;}
#call .list-container li i{width: 20px;height: auto;display: inline-block;padding-top: 5px;}
#call .list-container p{margin-top:10px;font-family:'Helvetica', 'Arial', sans-serif;font-size:14px;font-style: italic;text-align: center;color: var(--text-color-titles)}
#cb-secure-container img{max-width:144px;border-radius: 4px;box-shadow: 0 0 2px 0px #666666;}


#call-phone-btn{font-family:'Arial', sans-serif;margin-top:30px;background-color:var(--bg-color-btn-call);color:#FFF;padding:15px 20px;font-weight:bold;display: inline-block;font-size:18px;padding: 12px 0;border-radius: 3px;transition: all .4s;position: relative;overflow: hidden;letter-spacing: 1px;width:90%;max-width:280px}
#call-phone-btn:hover{transform: scale(0.9);text-decoration: none;}
#call-phone-btn::after{content: ''; position: absolute; top: -125%; left: -100%; width: 40px; height: 350%; opacity: 0.25; transform: rotate(25deg); animation: shine; animation-duration: 2s; animation-iteration-count: infinite; animation-timing-function: ease-out; background: rgba(255, 255, 255, 0.20); background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 53%, rgba(255, 255, 255, 0) 100%); background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 53%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 53%, rgba(255, 255, 255, 0) 100%); filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff', GradientType=1);}

#call h3 {padding: 12px 0 10px;}
#call h3 a{display: block;padding-bottom: 5px;font-weight: bold;font-size: 28px;font-family: 'cambria', 'Times New Roman', serif;color: var(--text-color-titles)}
#call-cb-secure{width:100%;height:auto;max-width: 100px;}
/* call ban */
#ban-call{display: flex;flex-direction: column;justify-content: flex-start;align-items: center;flex-wrap: nowrap;}
#ban-call *{font-family:'cambria', 'Cochin', Georgia, Times, 'Times New Roman', serif}
#ban-call a:hover, a:focus, a:active{text-decoration:none}
.ban-call-container{position:relative;width:98%;max-width:265px}
.ban-call-content{background-color: #FFF;position:relative;transform: translateY(-15px);border: solid var(--border-width-call-content) var(--border-color-call-content);border-width:var(--border-width-call-content) var(--border-width-call-content)  1px var(--border-width-call-content);padding:var(--padding-call-content);border-radius:6px;line-height:0.9}
.ban-call-content a:hover, a:focus{color:inherit}
.ban-call-content span{display:block}
#ban-call-private .ban-call-content span{display:block;padding: 5px 0;}
.ban-call-bar{position:absolute;left:0;bottom:0;background-color: var(--border-color-call-container-bottom);width:100%;height:100%;border-radius:0 0 6px 6px}
.ban-call-title{font-weight: bold;font-size: var(--text-size-call-title);color: var(--text-color-call-title)}
.ban-call-subtitle{font-size:19px;color: var(--text-color-call-subtitle)}
.ban-call-phone{font-size:26px;font-weight: bold;color: var(--text-color-call-phone)}
.ban-call-tarif{font-size:13px;font-style: italic;}

#ban-call-private{margin: 15px auto 0;}
#ban-call-audiotel{margin: 25px 0 0;}

#ban-call-audiotel-cartbridge{margin: 5px auto;}

#is-typing-content{font-size:15px}

#ban-frame-container{max-width: 340px;box-shadow: 0 2px 6px 0px #333;}
#ban-text{padding:10px}
.blk-txt{text-align:left;padding:0px 10px;font-family: 'inter-classic', 'Times New Roman','Times',  serif;}
.blk-txt p{font-size:14px !important;padding-bottom: 10px;font-family: 'inter-classic', 'Times New Roman','Times',  serif;}

/* txt head */
#steps {font-family: 'inter-classic', 'Times New Roman','Times',  serif;}

#title-form-action{background: rgba(255,255,255,0.5);margin-top: 30px;padding-top:0;padding-bottom:1px;margin-bottom:10px}

h3.title1{color:#333;font-size:15px;font-weight: bold;margin-bottom:0;margin-top:0;text-align: center;font-family: 'Times New Roman','Times',  serif;}
h4.title2{color:#333;font-size:16px;margin-top:3px;text-align: center;font-family:'Times New Roman','Times',  serif;}
h4.title3{font-size:16px;text-align: center;padding-top:5px;line-height: inherit;font-family: 'arialBlack', Arial sans-serif;color:var(--text-color-titles);}
.blk-txt2 h4, .blk-txt h4{font-family: 'cambria', 'Times New Roman','Times',  serif;}

/* about */
#about{padding:35px 0 70px;}
/* #about *{font-family: "Times New Roman", Times, serif;} */
#about-container{width:100%; max-width:600px;padding: 10px 20px;}
#landing #about-container{background-color: var(--purple-light);}
#bg-white{width:100%; max-width:600px;padding: 10px 20px}
#landing #bg-white, #reponse #bg-white{background-color: #fff;}
#about-container h2 {margin-bottom: 0.7em;font-size: 25px;font-family: 'WorkSans', 'Times', sans-serif;}
/* #about-container p {font-size: 16px;text-align: left;margin: 0 0 10px;} */
/* #about-container p:last-child{font-size:13px} */
#about-container #about-type {font-size: 16px;text-align: center;font-style: italic;}

#about-sub-titles h2{padding: 25px 0 5px;font-size: 25px;font-family: 'cambria', 'Times New Roman', serif;}
#about-sub-titles p{padding: 0 0 25px;margin: 0 0 10px;font-size: 20px;font-style: italic;color:#a2a2a2;}

/* footer */
#list-link-footer #list-container {display: flex;flex-direction: row;justify-content:space-around;align-items:center;padding:5px 0;background-color:var(--purple-light, #dcdbfd);}
#list-link-footer #list-container a {color:var(--text-color-ban-top, #373664)}
footer, #footer{background-color: #444;color:#fff;padding:15px 0}
#footer-title{padding:8px 0}

/* phone ban (validate/deny) */
#ban-phone{font-family:"Helvetica Neue Medium";padding:8px 0}
#ban-phone h2{font-size: 22px;}
#ban-phone h2 a{color: #222;}
#ban-phone h2 span{display:block}
#ban-phone .rdv{font-size:15px;margin:8px 0}
#ban-phone .tarif{font-size:13px}
#ban-frame-container{position:relative;margin:55px auto 5px;border:3px solid #b007ff;background-color: var(--white);border-radius:15px}
#ban-frame-cards-container{position: absolute;top:0;left: 50%;transform: translate(-50%, -100%)}
#ban-frame-content{padding: 25px 5px 5px;}
#ban-frame-content * {font-family: cambria, Cochin, Georgia, Times, 'Times New Roman', serif;}
#ban-frame-content h2{font-size: 25px;margin-bottom: 20px;color: var(--black)}
#ban-frame-content h4.phone-tel{display: flex;flex-direction: row;flex-wrap: nowrap;align-content: center;justify-content: center;align-items: center;margin-bottom: 20px;font-weight: bold;}
#ban-frame-content h4.phone-tel a{font-size:20px; color:var(--blue)}
#ban-frame-content .tarif{font-size:17px;color: var(--black)}

/* call titles - valide & deny*/
#valide #call, #interdiction #call{padding: 5px 0;margin:0 auto 10px;background-color: transparent}
#valide #call .title-txt,#interdiction #call .title-txt{padding-top: 0;}
/* #valide #call h4{font-family: Arial, Helvetica, sans-serif;} */
#call-titles-container{padding: 0 0 15px;}

/* phone button */
#phone-button{width: 96%;max-width: 375px;margin: 0 auto;position: relative;padding: 35px 0 35px 10px;}
#phone-svg{display:block;position: absolute;top: 50%;left: 0;transform: translate(0, -50%);width: 65px;height: 65px;text-align: center;padding: 8px 8px 0 5px;	border-radius: 50%;background-color: var(--bg-color-phone-ico, #FFF);border: 3px solid var(--border-color-phone-ico, #FFF);box-shadow: 0 2px 4px #999;}
#phone-svg .ico-phone{width: 90%;height: auto;fill: var(--text-color-phone-ico, #FFF);}
#phone-number-container{text-decoration:none;display:block;background-color: #FFF;border-top-right-radius:20px;border-bottom-right-radius:20px;padding: 3px 0 3px 35px;box-shadow: 0 3px 4px #999;}
#phone-number-link{font-family: Arial, Helvetica, sans-serif;font-size: 23px;font-weight: bold;color: var(--text-color-phone-number);}

/* phone button response */
#phone-button-response{width: 96%;max-width: 375px;margin: 0 auto;position: relative;padding: 35px 0 35px 10px;}
#phone-button-response #phone-svg-response{display:block;position: absolute;top: 50%;left: 60px;transform: translate(0, -50%);width: 65px;height: 65px;text-align: center;padding: 8px 8px 0 5px;}
#phone-button-response #phone-svg-response .ico-phone{width: 70%;height: auto;fill: var(--text-color-phone-ico, #FFF);}
#phone-button-response #phone-number-container-response{text-decoration:none;display:block;background-color: #FFF;border-top-right-radius:20px;border-bottom-right-radius:20px;padding: 3px 0 3px 35px;}
#phone-button-response #phone-number-link-response{font-family: Arial, Helvetica, sans-serif;font-size: 23px;font-weight: bold;color: var(--text-color-phone-number);}

/* tchat */
#tchat{padding: 15px 0;}
#tchat-window{max-width: 600px;width:90%;margin: 0 auto;border:1px solid #000;box-shadow:0 2px 2px 0 #b4b4b4;background-color: #FFF;border-bottom-right-radius: 25px;border-bottom-left-radius: 25px;}
#tchat-loader, #tchat-content{min-height:450px; max-height:450px}

#tchat-loader{display: flex;flex-direction: column;align-items: center;justify-content: space-evenly;}

#spinner {width: 70px;height: 70px;display: grid;border:4px solid #0000;border-radius: 50%;border-right-color:var(--border-color-spinner-default, #9390ff);animation: anim-loader-spinner 1s infinite linear;}
#spinner::before, #spinner::after {content:"";grid-area: 1/1;margin:2px;border:inherit;border-radius: 50%;border-right-color:var(--border-color-spinner-before, #aca9fc);animation: anim-loader-spinner 2s infinite;}
#spinner::after {border-right-color:var(--border-color-spinner-after, #c0befd);margin:8px;animation-duration: 3s;}

#loader-text{font-size: 18px;}
#tchat-content {overflow-y: auto;padding:10px}
#tchat-content .tchat-para {background: none;padding: 12px 0 0 0;overflow: hidden;display: flex;justify-content: flex-start;width:100%}
#tchat-content .tchat-msg {background: #e5f7e7 none repeat scroll 0% 0%;  min-width: 50px;padding: 5px;  margin-left: 4%;border-radius: 5px;box-shadow: #dcdcdc 1px 1px 2px 0px;font-size: 16px;word-break: break-word;color: #111;max-width: 93%;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-rendering: optimizeLegibility;position: relative;text-align:left;height:auto;transform-origin:left bottom;opacity:0;transform:scale(0);transition:all 0.5s ease-out;font-family: 'verdana', sans-serif;}
#tchat-content .open .tchat-msg{opacity:1;transform:scale(1);}
#tchat-content .close .tchat-msg{opacity:0;}
#tchat-content .tchat-msg::before {display: block;width: 0px;content: "";position: absolute;bottom: 10px;left: -12px;border-style: solid;border-width: 0 14px 18px 0;border-color: transparent #e5f7e7 transparent transparent;}
#tchat-content .tchat-para .prenom-consult-tchat {color: #206519;font-size: 17px;display:inline-block}
#tchat-content .tchat-para .prenom-consult-tchat::after{content: ' : ';margin-right:3px;}
#tchat-content .is-dots .tchat-avatar{display: none;visibility: hidden;}

#tchat-content .msg-cards-container{display: flex;justify-content: space-between;align-items: center;align-content: center;flex-wrap: wrap;}
#tchat-content .msg-cards{width:35%;margin-top:10px;border-radius: 5px;border: 1px solid var(--purple);}

.dots {width:50px;height:22px;
  background:
    radial-gradient(circle closest-side,var(--bg-color-dots) 90%,#0000) 0%   50%,
    radial-gradient(circle closest-side,var(--bg-color-dots) 90%,#0000) 50%  50%,
    radial-gradient(circle closest-side,var(--bg-color-dots) 90%,#0000) 100% 50%;
  background-size:calc(100%/2.5) 10px;
  background-repeat: no-repeat;
  animation:anim-dot 1s infinite linear;
}

/* #is-typing-container{min-height:23px;position:relative;display:flex;justify-content:flex-start;align-items: center;width: 90%;height:45px;margin: 5px auto 0;padding: 10px 0 10px 5px;border: 1px solid var(--border-color-is-typing-container);box-shadow:0px 2px 3px 0px rgb(0 0 0 / 25%);border-radius: 3px;} */
#is-typing-content{display: flex;	flex-direction: row;justify-content: center;align-items: center;text-align: center;font-size:13px}

.spinner-is-typing {width:15px;height:15px;border-radius: 50%;margin-right:5px;
  background:radial-gradient(farthest-side,#ff1cf4 60%,#0000) top/8px 8px no-repeat,	conic-gradient(#0000 30%,#fd4af4);
  -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 0);
  mask: radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 0);
  animation:anim-spinner 1s infinite linear;
}

#btn-paper-plane{position:absolute;right:5px;top:5px;width:35px;height:35px;text-align:center;padding:8px 8px 0 5px;background-color: var(--bg-color-btn-typing, #9390ff);border-radius:50%}
#btn-paper-plane #ico-paper-plane{width:90%;height:auto;fill:var(--text-color-btn-typing, #FFF)}

/* reponse page */
#reponse{overflow: hidden;}
#reponse  #content{background-image: none;background-color: var(--background-color-content, #f7fafd);padding: 0 0 10px;}
#reponse #content .container {padding: 0;}
#response-container{padding: 0;}
#container-mailing{border:6px solid #206519;background-color: #FFF;max-width:620px}

#header-mailing-medium{font-family: 'Times New Roman', Times, serif;font-weight: none;font-size: 15px;color: #263C6A;}
#header-mailing{padding: 0 0 10px;font-family: Verdana, Arial, Helvetica, sans-serif;}
#header-mailing-title{font-family: Verdana, Arial, Helvetica, sans-serif;color:#2b3a68;font-size:16px;font-weight: bold;margin:10px 0}
#header-mailing .fa-envelope{display: none; visibility: hidden;}
#header-mailing-subtitle{font-family: Verdana, Arial, Helvetica, sans-serif;color:#2b3a68;font-size:15px;font-weight: normal;padding:0;margin: 0 0 12px}
#confirm #header-mailing-subtitle{color:#000;font-size:24px;font-family: 'jacques-francois', Arial sans-serif;}


#content-mailing{font-family: Verdana, Arial, Helvetica, sans-serif;background-color: #fff;padding:0 30px;}
#content-mailing a {color:#2b3a68;font-size:18px;font-weight: normal;text-align: justify;}
#content-mailing a:hover, #content-mailing a:focus, #content-mailing a:visited{text-decoration: none;color:#2b3a68;}
#content-mailing p{margin-bottom:0}

#call-mailing {font-family: Verdana, Arial, Helvetica, sans-serif;padding: 10px 0;}
#call-mailing a, #call-mailing a:hover, #call-mailing a:focus, #call-mailing a:visited{text-decoration: none;}
#call-mailing hr{margin: 15px auto 15px;max-width: 250px;width: 80%;}
/* 18/11/2024 */
#call-mailing-title-1{display:block;color:#2a3c67;font-size:22px;font-weight:bold}
#call-mailing-title-2{display:block;padding:0;color:#2a3c67;font-size:19px;font-weight:normal}
#call-mailing-title-3{display:block;padding:0;color:#2a3c67;font-size:15px;font-weight:normal;text-transform: uppercase;}
#call-mailing #cb-secure-container{margin-top:40px;margin-bottom:30px}
#call-mailing #cb-secure-container img {max-width: 144px;border-radius: 4px;box-shadow: 0 0 2px 0px #666666;}
#call-mailiing-plan-container{margin-top: 12px;}
#call-mailiing-plan-container p{margin-bottom: 1px;line-height: 1.1;}
#call-mailiing-plan-container a{font-size: 13px;font-family: Verdana, Helvetica, sans-serif;color:#333}
/* #call-mailing #phone-svg{display: none;visibility: hidden;}
#call-mailing #phone-number-container{border-radius: 25px;padding: 3px;border: 3px solid var(	--border-color-phone-number, #D286A4)} */
#call-mailing #phone-button{padding: 20px 5px 30px;}
#call-mailing #phone-button-response{padding: 20px 5px 30px;}
#call-mailing #phone-number-link{font-size: 27px;}

.blk-infos {display: flex;flex-direction: row;flex-wrap: nowrap;align-content: center;justify-content: center;align-items: center;padding-top:20px;padding-bottom:20px}
.blk-medium{border-left:1px solid #eee;border-right:1px solid #eee;}
.blk-infos .title{color: #2a3c67;font-weight: bold;font-size: 15px;}
.blk-infos .subtitle{color:#2b3a68}


/* error message */
.message-error1{position: relative;top: 10px;left: -15px;z-index: 1000000}
#msg-error1{color: #fff;background-color: #000;padding: 5px 10px;border-radius: 5px;position: relative;font-weight: bold;font-style: italic;}
#msg-error1 .triangle-code1{position: absolute;top: -12px;left: 14px;display: inline-block;height: 0;width: 0;border-right: 13px solid transparent;border-bottom: 17px solid #000;border-left: 7px solid transparent;}

.message-error2{position: relative;top: -5px;left: -10px;z-index: 1000000}
#msg-error2{color: #fff;background-color: #000;padding: 5px 10px;border-radius: 5px;position: relative;top: 13px;left: -5px;font-weight: bold;font-style: italic;}
#msg-error2 .triangle-code2{position: absolute;top: -12px;left: 14px;display: inline-block;height: 0;width: 0;border-right: 13px solid transparent;border-bottom: 17px solid #000;border-left: 7px solid transparent;}

/* disclamer */
#rules{padding:25px 15px 65px}
.container-blk{margin:0 auto;text-align:center;max-width:620px;}
.container-blk p{font-size:11px;color:#a2a2a2;margin: 0 0 2rem;text-align:left; font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;}
.container-blk a{color: #a2a2a2;text-decoration: none;}
.container-blk .boprder{border:1px solid #f1f1f1;padding:7px;color:#a2a2a2}

.pseudonyme{font-size:11px;margin: 10px auto;color:#a2a2a2}
#disclamer-blk{text-align:left;border:1px solid #f1f1f1;font-size:11px;padding: 0 10px 0 0;background-color:#fafafa !important}
#disclamer-blk * {font-family:'Arial',sans-serif;color:#a2a2a2;}
#disclamer-blk h3{font-size: 11px;padding-left: 40px;margin-top:5px;font-weight:normal;margin-bottom:0;text-align:left;}
#disclamer-blk ul{padding-left:40px;padding-right:20px;list-style:inherit}

@keyframes anim-dot {
	20%{background-position:0%   0%, 50%  50%,100%  50%}
	40%{background-position:0% 100%, 50%   0%,100%  50%}
	60%{background-position:0%  50%, 50% 100%,100%   0%}
	80%{background-position:0%  50%, 50%  50%,100% 100%}
}

@keyframes anim-spinner{
  100%{transform: rotate(1turn)}
}
@keyframes anim-loader-spinner{  100%{transform: rotate(1turn)}}

@keyframes anim-action-cards-button {

	50%{box-shadow: 0 0 0 rgb(255 140 198), 0 3px 4px rgb(255 255 255 / 25%);text-shadow: 0 0 11px #f8acda;background-color: #f508b7;}
	100%{box-shadow: 0 0 5px 11px transparent, 0 3px 4px rgb(255 255 255 / 25%);text-shadow: 0 0 5px transparent;}
}


@keyframes anim-face-card{
  0%{filter: brightness(1);}
  80%{filter: brightness(1.21);}
  100%{filter: brightness(1);}
}
@keyframes anim-card-chosen {
  0%{box-shadow: 0 0 0 0 rgb(249 255 188);}
  100%{box-shadow:0 0 15px 12px transparent;}
}

@keyframes shine {from {left: -100%;} to {left: 200%;}}
@-moz-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-webkit-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-ms-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-o-keyframes shine {from {left: -100%;} to {left: 200%;}}

/* callback section */
#callback{
	--bg-color-callback-form: var(--purple, #57a5e2);
	--bg-color-callback-form: var(--purple, #57a5e2);
}
#callback{padding:20px 15px 40px}
#callback p{margin:5px 0; font-size:16px;font-weight:bold}
#callback h2{font-size:25px;font-weight:bold}
#callback .form-control{background-color:#FFF;font-family: Arial, Helvetica, sans-serif;}
#callback-phone-number::placeholder{text-align: center;}
#callback .btn{background-color: var(--bg-color-callback-btn); color: white;font-weight: bold;font-size: 19px;padding: 6px 8px;border: 0 none;}

#callback-container{display: flex;flex-direction: row;justify-content: space-between;align-items: center;padding:3px 8px;border-radius:3px;background-color: var(--bg-color-callback-form);max-width:370px}
#ico-callback{max-width:25px; height: auto;margin-right:12px}
/* #btn-rappel{padding:0;margin-left:8px;background-color: transparent;font-size:17px;color: white;font-weight:bold} */
#btn-rappel:hover, #btn-rappel:focus, #btn-rappel:active, #btn-rappel.active, #btn-rappel:focus, #btn-rappel:active:focus, #btn-rappel.active:focus {color: var(--text-color-btn-form-request, var(--white, #FFF)); text-shadow:0 0 3px var(--white, #FFF); box-shadow: none;outline:0}
#callback-spinner {width: 24px;height: 19px;border-radius: 50%;margin: 0 5px 0 11px;
	background: radial-gradient(farthest-side,#ffffff 80%,#0000) top/8px 8px no-repeat, conic-gradient(#0000 20%,#ffffff);
	-webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 0);
	mask: radial-gradient(farthest-side,#0000 calc(100% - 5px),#000 0);
	animation: anim-spinner 1s infinite linear;
	display: inline-block;
}
#callback-container.responsed{padding: 0;}
#callback-response {opacity:0;transition:opacity 0.8s ease-out;}
#callback-response.open {opacity:1}
#callback-response h3 {font-size: 17px;display: inline-block;background-color: #f3f9eb;padding: 11px;color: #4d9d00;font-weight: normal;border-radius: 3px;margin-bottom: 10px;text-align: justify;border: 1px solid #62ab00;}
#callback-response .text-contact-back{display: inline-block;margin: 20px auto;font-size: 20px;}
#rappel-form-phone-response-msg p{margin:0;border-radius: 3px;}

/* rappel module sur page valide (intl-tel-input)
#rappel-form{
	--rappel-border-color-form: #3a752c;
	--rappel-background-color-form: #FFF;

	--rappel-title-color:#3a752c;
	--rappel-subtitle-color:#333;
	--rappel-paragraph-color:#333;

	--rappel-button-color:#FFF;
	--rappel-button-background-color:#3a752c;
	--rappel-button-background-color-gradient-1:#3a752c;
	--rappel-button-background-color-gradient-2:#3a752c;
	--rappel-button-border-color:#3a752c;
	--rappel-button-shadow-color:#3a752c;
}
#rappel-form{position:fixed;top:0;left:0;width: 100%;height: 100%;min-height: 100%;z-index:100;background-color: rgba(255, 255, 255, 0.4);display:flex;flex-wrap: nowrap;align-content: center;flex-direction: column;justify-content: center;align-items: center;backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px)}
#rappel-form-content{position:relative;width:90%;max-width: 370px;padding: 10px;border: 2px solid var(--rappel-border-color-form);
	border-radius: 5px;background-color: var(--rappel-background-color-form);border-radius: 3px;box-shadow: 0 1px 4px 4px rgba(0,0,0,0.2);}
#rappel-form-phone-inpu-content *{font-family: Arial, Helvetica, sans-serif;}
#rappel-form-input-phone{color: #212529;background-color: #fff;border-color: #86b7fe;outline: 0;box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25);border-radius:6px;font-size:17px;width:100%}

#rappel-form-close-btn{position: absolute;top:1px;right:1px;line-height: 1;font-size:14px}
#rappel-form-close-btn .fa-times{cursor:pointer}

#rappel-form-header * {font-family: 'Helvetica', 'Arial', sans-serif;}
#rappel-form-header h2{font-size: 25px;font-weight: bold;letter-spacing: 0.5px;color:var(--rappel-title-color)} */

/* new 13/09/2024 */
#call .title1-medium-form{font-family: Arial, Helvetica, sans-serif;color:#263C6A;font-size: 21px;margin:0;font-weight: bold;}
#call .title2-medium-form{font-family: Arial, Helvetica, sans-serif;font-size: 17px;color:#263C6A;margin:0;padding-top: 10px;padding-bottom:0}
#call .title3-medium-form{font-family: Arial, Helvetica, sans-serif;font-size: 13px;color:#263C6A;}

.cb-secure{width: 35%;}

/********************************************/
/* news 01/2025 */

.no-display-mob{display:none}

/* bg (header & steps) */
#landing #bg-container.step-1, #landing #bg-container.step-2, #landing #bg-container.step-3{background: no-repeat center top url(../images/bg-mobile.jpg);background-color: #FFF;background-size: cover;}
#valide #bg-container.step-1, #valide #bg-container.step-2, #valide #bg-container.step-3{background: 0 none;}
#interdiction #bg-container.step-1, #interdiction #bg-container.step-2, #interdiction #bg-container.step-3{background: 0 none;}

#title-cards-action{background: rgba(0, 0, 0, 0.2);padding-bottom:1px;}
h2.title0{font-size:17px;text-align: center;width: 100%;font-weight: bold;padding:5px 0 0;line-height: inherit;font-family: 'bodoni', arial, serif;color:var(--text-color-titles);}

/* steps */
#step-1-container, #step-2-container{padding: 15px 0 25px;}
#step-2{opacity:0;transition:opacity 1s ease-out;}
#step-2.opened{opacity:1;}
#step-1 h3, #step-2 h3 {font-family: 'bodoni',Arial, Helvetica, sans-serif;color:#00D42F;text-align: center;font-size:20px}
#step-1 h4, #step-2 h4 {font-family: 'bodoni',Arial, Helvetica, sans-serif;color:#fff;text-align: center;font-size:18px}
#steps .medium-name{font-family: 'bodoni',Arial, Helvetica, sans-serif;color:#fff;text-align: right;font-size:22px;padding-right:10px;padding-bottom: 15px;text-shadow: 2px 2px 2px #000000;margin:0}
.bg-opacity-black{background-color: rgba(0, 0, 0, 0.3);}

/* cards */
#btn-event-card{margin-top: 15px;padding: 10px 0;font-size: 16px;letter-spacing: 1px;color: var(--text-color-btn-cards);background-color: #000;border-radius: 12px;width: 60%;word-wrap: break-word;max-width: 275px;overflow: hidden;border: 2px solid #00D4B7;font-weight: bold;font-family: 'istok', Arial, Helvetica, sans-serif;}


/* infos */
/* #call-group{padding-top:80px} */
.title1-top{color:#000;font-size:30px;text-align: center;width: 100%;margin-bottom:0;padding-top:20px;line-height: inherit;font-family: 'jacques-francois', Arial sans-serif;letter-spacing: 3px;}
.title2-top{font-family: 'inter-classic', Arial sans-serif;font-size: 18px;margin-top: 0;margin-bottom: 0;text-align: center;color: #000;
padding-bottom: 10px;display: flex;flex-wrap: nowrap;align-content: center;justify-content: center;align-items: center;font-weight: lighter;}
.title2-top span{margin-left:10px}

.title3-top{color:#263C6A;font-weight: bold;font-family: 'jacques-francois', Arial sans-serif;text-align: left;font-size:24px}
.blk-dispo{margin: 0 auto;width: 85%;max-width: 400px;padding-top: 60px;}
.blk-display-tel{margin: 0 auto;width: 85%;max-width: 400px;}
.blk-domaines{margin: 0 auto;width: 85%;max-width: 400px;padding-top: 60px;}

.tarification{font-family: 'inter-classic', Arial sans-serif;font-size: 16px;color:#000;font-weight: 200;text-align: left;
	margin: 0 auto;font-weight: lighter;}
.blk-tel{text-align: center;margin: 0 auto;padding-top: 80px;padding-bottom: 25px;}
.display-tel{font-family: 'inter-classic', Arial sans-serif;font-weight:bolder;color: #fff;font-size: 20px;padding: 10px 40px;
border-radius: 10px;box-shadow: 0px 5px 11px 0px rgba(120,120,120,0.75);
-webkit-box-shadow: 0px 5px 11px 0px rgba(120,120,120,0.75);
-moz-box-shadow: 0px 5px 11px 0px rgba(120,120,120,0.75);display:block;background: rgb(32,100,25);
background: linear-gradient(90deg, rgba(32,100,25,1) 0%, rgba(0,212,47,1) 100%);}
.blk-tel a:hover{color:#fff}
.display-dispo{text-align: left;margin: 0 auto;display: flex;flex-wrap: nowrap;align-content: center;justify-content: flex-start;align-items: center;font-weight: bold;font-family: 'inter-classic', Arial sans-serif;font-size: 16px;color:#263C6A}
.point-vert{background-color: #00D42F;width: 14px;height: 14px;border-radius: 50%;margin-right: 20px;margin-left: 10px;}
.tarification2{font-family: 'inter-classic', Arial sans-serif;color:#AA54B7;text-align: left;margin: 0 auto;font-size:16px;font-weight: normal;padding-top: 30px;}
.display-dispo-valide{text-align: center;width: 70%;margin: 0 auto;display: flex;flex-wrap: nowrap;align-content: center;justify-content: center;align-items: center;font-weight: bold;font-family: 'inter-classic', Arial sans-serif;font-size: 16px;color:#263C6A;padding: 20px 0 10px;}

.display-top{display: flex;flex-wrap: nowrap;align-content: space-around;justify-content: space-between;align-items: center;padding-top: 10px;width: 100%;margin: 0 auto;font-size:15px;font-family: 'inter-classic', Arial sans-serif;}
.display-bottom{display: flex;flex-wrap: nowrap;align-content: space-around;justify-content: space-between;align-items: center;padding-top: 20px;width: 100%;margin: 0 auto;padding-bottom: 20px;font-size:14px;font-family: 'inter-classic', Arial sans-serif;}
.bg-display-amour{color: #263C6A;background-color: #E3D5B9;border: 1px solid #000000;padding: 7px;border-radius: 10px;width: 30%;text-align: center;}
.bg-display-rencontre{color:#263C6A;background-color: #E3D5B9;border: 1px solid #000000;padding: 7px;border-radius: 10px;width: 30%;text-align: center;}
.bg-display-mariage{color:#263C6A;background-color: #E3D5B9;border: 1px solid #000000;padding: 7px;border-radius: 10px;width: 30%;text-align: center;}
.bg-display-finances{color:#263C6A;background-color: #E3D5B9;border: 1px solid #000000;padding: 7px;border-radius: 10px;width: 30%;text-align: center;}
.bg-display-exconjoint{color:#263C6A;background-color: #E3D5B9;border: 1px solid #000000;padding: 7px;border-radius: 10px;width: 30%;text-align: center;}
.bg-display-famille{color:#263C6A;background-color: #E3D5B9;border: 1px solid #000000;padding: 7px;border-radius: 10px;width: 30%;text-align: center;}

#confirm .blk-link {position: relative;}
#confirm .blk-link-text {position: absolute;color: #fff;width: 100%;top: 5px;font-weight: bold;font-size:12px}

#about {padding: 10px 0 80px;}
.no-padding {padding:0}
/* footer */
footer{background-color: #e5f7e7;}
footer #list-container a{color:#263C6A}
footer #list-container {display: flex;flex-direction: row;justify-content:space-around;align-items:center;padding:5px 0;background-color:#e5f7e7;font-size: 15px;font-family: 'inter-classic', Arial sans-serif;}

/* slider */
.container-slider {display: flex;flex-direction: column;gap: 20px;}
.text-item {position: relative;cursor: pointer;text-align: left;width: 80%;margin: 0 auto;font-family: 'inter-classic', Arial sans-serif;color:#263C6A;}
.text-item .text-title {height: auto;border-radius: 5px;transition: transform 0.3s ease;font-weight: bold;font-size:16px;font-family: 'jacques-francois', Arial sans-serif;font-size: 20px;}
.text-item .text-title:hover {transform: scale(1.05);}
.hidden-text {overflow: hidden;max-height: 0;transition: max-height 0.5s ease, padding 0.5s ease;color: black;padding: 0 10px;text-align: center;}
.text-item.active .hidden-text {padding: 10px 0;}
.header-item{display: flex;flex-direction: row;flex-wrap: nowrap;align-content: space-around;justify-content: space-between;align-items: center;border-bottom: 2px solid #000;}
.border-chevron{width: 25px;fill: #000;min-width: 25px;max-width: 25px;}

/* slider rgpd */
#rgpd {padding-bottom:50px;padding-top:20px;max-width: 600px;margin: 0 auto 50px;}
.container-slider{max-width: 600px;margin: 40px auto;}
.container-slider-rgpd {display: flex;flex-direction: column;gap: 20px;}
.text-item-rgpd {position: relative;cursor: pointer;text-align: left;width: 70%;margin: 0 auto;font-family: Arial, Arial sans-serif;color:#333;}
.text-item-rgpd .text-title-rgpd {height: auto;border-radius: 5px;transition: transform 0.3s ease;font-size: 14px;}
.text-item-rgpd .text-title-rgpd:hover {transform: scale(1.05);}
.hidden-text-rgpd {overflow: hidden;max-height: 0;transition: max-height 0.5s ease, padding 0.5s ease;color: black;padding: 0 10px;text-align: center;}
.text-item-rgpd.active .hidden-text-rgpd {padding: 10px 0;}
.header-item-rgpd{display: flex;flex-direction: row;flex-wrap: nowrap;align-content: space-around;justify-content: space-between;align-items: center;border-bottom: 1px solid #333;}
.border-chevron-rgpd{width: 15px;fill: #333;min-width: 15px;max-width: 15px;}
.blk-txt-rgpd{font-size: 12px;font-family: Arial, Helvetica, sans-serif}

/* boutique */
.title-boutique{border: 1px solid #000;width: 40%;margin: 0 auto;border-radius: 15px;background: #F7FAFD;font-weight: bold;font-family: 'jacques-francois', Arial sans-serif;font-size: 18px;color:#000;padding: 7px;margin-bottom:20px;max-width: 300px;margin-left:45px;text-align: left;padding-left: 5%;}
.type-tarif{display: flex;flex-direction: row;flex-wrap: nowrap;align-content: space-around;justify-content: flex-start;align-items: center;border: 1px solid #e9b2da;border-radius: 10px;width: 70%;margin: 0 auto;padding: 3px;margin-bottom:5px;max-width: 370px;position:relative;top:0;min-height:75px;max-height:75px}
.blk-img{width: 25%;padding-left: 2px;}
.blk-img img{width: 68px;height:63px;border-radius:5px}
.tarif{text-align: left;font-family: 'inter-classic', Arial sans-serif;padding-left: 10px;}
.details-tarif{font-size:13px}
.color-blue{color:#263C6A}
.color-grey{color:#de78bd}
.color-black{color:#000}
#landing #boutique{padding: 10px 0 180px;}
#valide #boutique, #interdiction #boutique{padding: 10px 0 40px;}
.price{background: rgb(224,86,196);background: linear-gradient(90deg, rgba(224,86,196,1) 0%, rgba(227,102,160,1) 51%, rgba(231,117,127,1) 100%);color: white;font-weight: bold;padding: 2px 13px;border-radius: 5px;position: absolute;right: 10px;font-family: 'Arial', Arial sans-serif;top: 30px;max-height: 25px;max-width: 60px;font-size: 17px;}
#landing .img-medium{margin: 0 auto;padding:40px 0 0}
#valide .img-medium, #interdiction .img-medium{margin: 0 auto;padding:20px 0 0}
.title-medium-tarif{font-weight: bold;font-family: 'jacques-francois', Arial sans-serif;font-size: 20px;padding-bottom: 0;}
#boutique .type-medium-tarif{padding-bottom: 30px;}
#boutique .blk-display-choice-tarif{width: 90%;padding: 7px;margin: 10px auto;border-radius: 10px;font-size: 20px;font-family: Arial, Helvetica, sans-serif;font-weight: bold;max-width: 280px;box-shadow: 0px 5px 11px 0px rgba(120, 120, 120, 0.75);-webkit-box-shadow: 0px 5px 11px 0px rgba(120, 120, 120, 0.75);-moz-box-shadow: 0px 5px 11px 0px rgba(120, 120, 120, 0.75);display: block;background: rgb(224, 86, 196);
background: linear-gradient(90deg, rgba(224, 86, 196, 1) 0%, rgba(227, 102, 160, 1) 51%, rgba(231, 117, 127, 1) 100%);margin-top:20px}
#boutique .blk-display-choice-tarif a{color:#fff}

/* formulaire */
#lead-form .form-control{border:1px solid #00D42F;border-radius:15px;font-weight: normal;}
#lead-form .form-control::placeholder{font-weight: normal;}
/* form */
.flex-group{display: flex;flex-direction: row;justify-content: space-between;align-items: center;}

#form-box{width: 95%;max-width: 370px;padding:40px;border: 2px solid var(--border-color-form-box, #00D42F);border-radius: 30px;background-color: var(--bg-color-form-box, #FFF);margin-top: 40px;}
#form-box .form-control,#form-box .form-control::placeholder{color:#333;font-weight: normal;text-align: left;text-align-last: left;}
.flex-group{display: flex;flex-direction: row;justify-content: space-between;align-items: center;}
.form-control {font-family: "arial", sans-serif;}
.form-condition{font-size:10px;font-weight: lighter;font-family: 'istok',Arial, Helvetica, sans-serif;}
#btn-container{padding:10px 0;margin-bottom: 0;margin-top: 15px;}



/* Style de base du span */
.custom-checkbox-span {
	display: inline-block;
	width: 12px; /* Taille de la "checkbox" */
	height: 12px;
	border-radius: 50%; /* Rond */
	border: 1px solid #00D42F; /* Bordure */
	background-color: white; /* Fond blanc */
	margin-right: 8px; /* Espacement avec le texte */
	position: relative;
	cursor: pointer; /* Indicateur interactif */
}

/* Style quand la checkbox est cochée */
input.custom-checkbox:checked + label .custom-checkbox-span {
	background-color: #00D42F; /* Couleur de remplissage */
	border-color: #00D42F; /* Harmonisation de la bordure */
}

/* Style pour un effet de "check" visuel */
.custom-checkbox-span::after {
	content: '';
	display: none;
	width: 50%; /* Taille du "check" */
	height: 50%;
	background-color: white; /* Couleur du "check" */
	border-radius: 50%; /* Cercle parfait */
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* Afficher le "check" lorsque la checkbox est cochée */
input.custom-checkbox:checked + label .custom-checkbox-span::after {
	display: block;
}

/* cartes */
#tarot-cards {display: flex;flex-direction: row;flex-wrap: nowrap;align-content: space-around;justify-content: space-around;align-items: center;padding:20px 30px 30px 30px;max-width: 400px;margin: 0 auto;}
#tarot-cards img{width: 17%;border: 2px solid #00D42F;border-radius: 20px;}

/* valide */
#tchat-header{border:1px solid #000;margin:0 auto;max-width: 600px;width: 90%;background: rgb(32,100,25);background: linear-gradient(90deg, rgba(32,100,25,1) 0%, rgba(0,212,47,1) 100%);color:#fff;border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: 25px;}
#tchat-header .title-tchat{padding-left: 25px;padding-top:7px;padding-bottom:7px;font-size:20px;font-family: Arial, Helvetica, sans-serif;text-align: left;position: relative;}
#tchat-header .title-tchat span{padding-left: 25px;text-transform: capitalize;}
/* .display-title-text{}
.display-name{color:#263C6A;font-size:20px;font-family: 'istok',Arial, Helvetica, sans-serif;} */

.display-medium{font-family: 'jacques-francois', Times, serif;font-size: 26px;font-weight: normal;letter-spacing: 2px;color:#AA54B7;}
.display-title-text{color:#197C1D;font-size:20px;font-family: "istok", Arial, Helvetica, sans-serif;font-weight: bold;padding:10px 0}
.display-name{color:#263C6A;font-family: "istok", Arial, Helvetica, sans-serif;font-weight: bold;font-size:20px;padding-bottom:10px}
.info-presence{color:#263C6A;font-family: 'inter-classic', Arial sans-serif;font-size:14px;font-weight: bold;padding-top: 15px;}
.info-tarif{color:#4E73DE;font-family: 'jacques-francois', Arial sans-serif;font-size:17px;font-weight: bold;font-size:24px;padding-top:55px;max-width: 600px;margin: 0 auto;}
#confirm .info-tarif{padding-top: 0;}
.info-tarif-text1{padding-bottom:20px;color:#000}
#reponse .info-tarif-text1{padding:20px;color:#206519;font-family: 'istok', Arial sans-serif;max-width: 500px;margin: 0 auto;font-weight: bold;}
.info-tarif-text2{line-height: 36px;padding-bottom:10px;color:#206519;font-size: 21px;padding-left: 15px;padding-right: 15px;}
.info-tarif-suite{color:#263C6A;font-family: 'inter-classic', Arial sans-serif;font-size:15px;font-weight: normal;}
.info-call-button{width: 90%;padding: 7px;margin: 10px auto;border-radius: 10px;font-size: 23px;font-family: Arial, Helvetica, sans-serif;font-weight: bold;max-width: 280px;box-shadow: 0px 5px 11px 0px rgba(120, 120, 120, 0.75);
-webkit-box-shadow: 0px 5px 11px 0px rgba(120, 120, 120, 0.75);
-moz-box-shadow: 0px 5px 11px 0px rgba(120, 120, 120, 0.75);
display: block;
background: rgb(32, 100, 25);
background: linear-gradient(90deg, rgba(32, 100, 25, 1) 0%, rgba(0, 212, 47, 1) 100%);}
.info-call-button a{color:#fff}
.info-call-text{color:#263C6A;font-family: 'inter-classic', Arial sans-serif;font-size:20px;font-weight: bold;padding-top:55px}
.info-call-text-bottom{color:#000;font-family: 'inter-classic', Arial sans-serif;font-size:15px;font-weight: bold;padding-top:55px}

.blk-infos-medium {font-family: 'inter-classic', Arial sans-serif;text-align: left;padding: 45px 35px;color: #263C6A;font-size: 16px;font-weight: normal;}
.blk-infos-medium h3{color: #206519;font-weight: bold;font-family: 'inter-classic', Arial sans-serif;}
.blk-infos-medium h4{color: #000;font-weight: bold;font-family: 'inter-classic', Arial sans-serif;padding-top: 50px;}

.call-button-down{text-align: left;}
.call-button-down .info-call-button{margin:inherit;margin-top:10px;margin-bottom:10px;text-align: center;font-size: 23px;}


/* tchat - audio */
#tchat-content .tchat-para.is-audio .tchat-msg{background-color: transparent;box-shadow:none}
#tchat-content .tchat-para.is-audio .tchat-msg::before{border: 0 none}
.custom-audio-player {display: flex;flex-direction: column;align-items: center;border-radius: 25px;min-width:200px;max-width: 250px;}
.audio-visualizer-row {display: flex;align-items: center;width: 100%;}
.audio-icon {width:60px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0; border: 3px solid #FFF;border-radius:50%;background:#206519;color:white;font-size:21px;z-index:5;}
.audio-icon:hover{background: #206519;}
.audio-icon .fa-play{margin-left:4px}
.audio-visualizer-container {position: relative;flex: 1;height:34px;min-width:150px;overflow: hidden;border: 3px solid #206519;border-radius: 0 20px 20px 0;position: absolute;	left: 52px;}

.audio-visualizer-progress {position: absolute;width: 0%;height: 100%;background: #bcf3d3;z-index: 2;transition: width 0.1s linear;}

.audio-visualizer-bars {position: absolute;width: 100%;height: 100%;display: flex;align-items: center;gap: 1px;z-index: 3;padding: 3px 11px;max-width: 138px;	overflow: hidden;}

.audio-visualizer-bars div {flex-shrink: 0;width: 1px; /* Largeur fine des barres */height: 100%; /* Barres sur toute la hauteur ; par défaut */background: #206519; /* Utilisé comme masque */}
.audio-visualizer-timing {font-size:10px;font-weight:bold;color: #333;text-align: center;position: absolute;right: 16px;bottom: 3px;}

/* user */
#tchat-content .tchat-para.is-user{justify-content: flex-end;}
#tchat-content .tchat-para.is-user .tchat-msg{margin-left:0;margin-right:5%;transform-origin: right bottom;background-color: #e0f8ff;box-shadow: #91d5ea -1px 1px 2px 0px;}
#tchat-content .tchat-para.is-user .tchat-msg::before{left:inherit;right:-12px;border-width: 14px 18px 0 0;border-color: #e0f8ff transparent transparent transparent;}
#tchat-content .tchat-para.is-user .prenom-consult-tchat {color:#3377bd;font-size: 16px;}

.dots {width:50px;height:22px;
  background:
    radial-gradient(circle closest-side,var(--bg-color-dots) 90%,#0000) 0%   50%,
    radial-gradient(circle closest-side,var(--bg-color-dots) 90%,#0000) 50%  50%,
    radial-gradient(circle closest-side,var(--bg-color-dots) 90%,#0000) 100% 50%;
  background-size:calc(100%/2.5) 10px;
  background-repeat: no-repeat;
  animation:anim-dot 1s infinite linear;
}
.audio-recording-animation {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  height: 20px;
  width: 60px;
}
.audio-recording-animation .fa-microphone{
	color: #206519;
	margin-right: 3px;
}
.audio-recording-animation .recording-bar {
  display: inline-block;
  width: 5px;
  height: 10px;
  background-color: var(--bg-color-audio, #206519);
  animation: recording-wave 1s infinite ease-in-out;
}
.audio-recording-animation .recording-bar:nth-child(1) {
  animation-delay: 0s;
}
.audio-recording-animation .recording-bar:nth-child(2) {
  animation-delay: 0.2s;
}
.audio-recording-animation .recording-bar:nth-child(3) {
  animation-delay: 0.4s;
}

#is-typing-container{min-height:23px;position:relative}

#is-typing-container{display:flex;justify-content:flex-start;align-items: center;width: 100%;height:40px;margin: 5px auto 0;padding: 10px 20px;border-top: 1px solid var(--border-color-is-typing-container);}
#is-typing-content{display: flex;	flex-direction: row;justify-content: center;align-items: center;text-align: center;font-size:13px;color:#000;font-weight: bold;}
.spinner-is-typing {width:15px;height:15px;border-radius: 50%;margin-right:5px;
  background:radial-gradient(farthest-side,var(--bg-first-spinner-is-typing) 60%,#0000) top/8px 8px no-repeat,	conic-gradient(#0000 30%,var(--bg-second-spinner-is-typing));
  -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 0);
  mask: radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 0);
  animation:anim-spinner 1s infinite linear;
}
#is-typing-container.active{border-color: #206519;}

@keyframes recording-wave {
  0%, 100% {
    height: 10px;
  }
  50% {
    height: 20px;
  }
}

@keyframes anim-dot {
	20%{background-position:0%   0%, 50%  50%,100%  50%}
	40%{background-position:0% 100%, 50%   0%,100%  50%}
	60%{background-position:0%  50%, 50% 100%,100%   0%}
	80%{background-position:0%  50%, 50%  50%,100% 100%}
}

@keyframes anim-spinner{
  100%{transform: rotate(1turn)}
}
@keyframes anim-loader-spinner{  100%{transform: rotate(1turn)}}

@keyframes shine {from {left: -100%;} to {left: 200%;}}
@-moz-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-webkit-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-ms-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-o-keyframes shine {from {left: -100%;} to {left: 200%;}}


/* reponse */
#reponse .text-footer{text-align: center;font-family: 'inter-classic', Arial sans-serif;font-size:16px;padding:10px 0 30px 0}
#reponse header h1{background-color: #ABDAFC;padding: 10px;}
#reponse .blk-tel a:hover{color:#fff}

.check-tchat-container label{font-weight: normal;font-size: 14px;}
#tchat-content .tchat-para .check-tchat-container{display: block;;margin: 4px 0;}

#confirm #call-mailing h4{color:#000; font-size:20px;font-family: 'inter-classic', Arial sans-serif;font-weight: 400;padding-top: 20px;}
#confirm .blk-tel{padding-top:0}
#confirm .blk-display-tel{max-width: 280px;}
#confirm .display-dispo-valide{padding: 0px 0 10px;}
#confirm .text-footer-emailing{color: #263C6A;max-width: 350px;margin: 0 auto;font-family: 'inter-classic', Arial sans-serif;font-size: 18px;padding:20px 30px 0}
#confirm #footer-mailing{padding-bottom: 50px;}
#confirm .info-tarif-text1{max-width: 380px;}
#confirm .title3-top {font-family: 'inter-classic', Arial sans-serif;font-size:18px}

/******************************************************************************/

/* black week */
#black-week-container {padding: 10px 15px;text-align: center;overflow: hidden;}
#black-week-content {display: inline-block;max-width: 520px;background-color: #000;color: #d4af37;padding: 12px 15px;border-top: 2px solid #d4af37;border-bottom: 2px solid #d4af37;border-radius: 4px;box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4);font-family:  "Montserrat", "Trebuchet MS", "verdana", sans-serif;text-transform: uppercase;font-weight: 600;position: relative;z-index: 10;transform: rotate(-2deg);line-height: 1.4;overflow: hidden;}
#black-week-content::before {content: "";position: absolute;top: 0;left: -100%;width: 45%;height: 100%;background: linear-gradient(90deg,rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0.45) 50%,rgba(255, 255, 255, 0) 100%);transform: skewX(-20deg);animation: shine-sweep 2.2s ease-in-out infinite;pointer-events: none;}

.text-black-week {font-size: 1.35rem;}
.text-black-week-sub {font-size: 1.25rem;margin-top: 12px;text-transform: none;opacity: 0.9;color: #ffd700;}
.price-black-week {color: #ffd700;font-weight: 700;font-size: 1.5rem;}

.black-week #tchat-header{background: radial-gradient(circle at 20% 50%, rgba(32,100,25,1), #000000 80%);color: #ffd700;}
.black-week .info-call-button{background: linear-gradient(90deg, rgba(32,100,25,1) 0%, #056620 30%, #056620 70%, rgba(32,100,25,1) 100%);box-shadow: 0px 4px 8px 0px rgba(32,100,25,0.41);}
.black-week .info-call-button a{color:#ffd700}


@media (min-width: 360px) {
	.text-black-week {font-size: 1.5rem;}
}
@media (min-width: 380px) {
	.text-black-week {font-size: 1.65rem;}
	.text-black-week-sub {font-size: 1.45rem;}
}
@media (min-width: 420px) {
	.text-black-week {font-size: 1.85rem;}
	.text-black-week-sub {font-size: 1.5rem;}
}
@media (min-width: 768px) {
  #black-week-content {
    padding: 15px 25px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
		transform: rotate(-1.5deg);
  }
}

@keyframes shine-sweep {
  0% {left: -100%;}
	80% {left: 120%;}
	100% {left: 120%;}
}


/* new css nov 2025 */
/* rappel modale form sur page valide / interdiction */
#rappel-form{
	--rappel-border-color-form: #273b5f;
	--rappel-background-color-form: #FEFDFA;

	--rappel-title-color: #273b5f;
	--rappel-subtitle-color: #333;
	--rappel-paragraph-color: #ff387d;

	--rappel-button-close-color: #273b5f;
	--rappel-button-color: #FFF;
	--rappel-button-background-color: #FF387E;
	--rappel-button-background-color-gradient-1: #FF387E;
	--rappel-button-background-color-gradient-2: #e9125d;
	--rappel-button-border-color: #b80000;
	--rappel-button-shadow-color: #b80000;
}
#rappel-form{position:fixed;top:0;left:0;width: 100%;height: 100%;min-height: 100%;z-index:100;background-color: rgba(255, 255, 255, 0.4);display:flex;flex-wrap: nowrap;align-content: center;flex-direction: column;justify-content: center;align-items: center;backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px)}
#rappel-form-content{position:relative;width: 90%;max-width: 350px;height: 560px;border-radius: 5px;background-color: var(--rappel-background-color-form);border-radius: 3px;box-shadow: 0 1px 4px 4px rgba(0,0,0,0.2);}

#rappel-form-content-step-1 {
	padding: 10px;
	width: 100%;
	height: 100%;
  /* Fallback JPG pour tous les vieux navigateurs */
  background-image: url("../images/bg-callback.jpg");

  /* Safari 13 / WebKit */
  background-image: -webkit-image-set(
    url("../images/bg-callback.webp") type("image/webp"),
    url("../images/bg-callback.jpg") type("image/jpeg")
  );

  /* Navigateurs modernes */
  background-image: image-set(
    url("../images/bg-callback.webp") type("image/webp"),
    url("../images/bg-callback.jpg") type("image/jpeg")
  );
	background-repeat: no-repeat;background-size: inherit;background-position: center
}

/* etape 2 validation formulaire */

/* Style du bloc blanc principal */
.congrats-modal-v3 {
    padding: 25px 40px 30px;
    background-color: #FEFDFA;
    margin: 0 auto;
    text-align: center;
}

/* Titre "Bravo!" */
.main-title-v3 {
    color: #4a148c;
    font-size: 60px;
    margin-top: 5px;
    margin-bottom: 25px;
    font-weight: 800;
    font-family: 'inter-classic';
}

/* Texte des paragraphes */
.info-item-v3 p {
    margin: 0;
    font-size: 23px;
    font-weight: 500;
    color: #182d43;
    line-height: 1.3;
}
/* Style pour chaque ligne d'information (icône + texte) */
.info-item-v3 {
    display: flex;
    align-items: center;
    text-align: left;
    margin-bottom: 20px;
}

/* --- Icône de confirmation SMS (Coche Verte) --- */
.sms-confirmation-v3 {
    display: flex;
    align-items: center;
    text-align: left;
    margin-bottom: 20px;
    font-size: 24px;
    font-weight: 600;
    color: #182d43;
}

/* Style de l'icône de validation (checkmark) */
.sms-confirmation-v3 .fa-check-circle {
    color: #81c784; /* Vert clair de la coche */
    font-size: 40px;
    margin-right: 10px;
    /* Ajustement de la forme du cercle/coche */
    background-color: transparent;
}

/* --- Icônes Mail et Téléphone --- */

/* Style de l'icône Mail (enveloppe) */
.icon-mail-v3 .fa-envelope {
    color: #f58d2a; /* Orange de l'enveloppe */
    font-size: 40px;
    width: 40px; /* Assurer une largeur uniforme pour l'alignement */
    margin-right: 15px;
}

/* Style de l'icône Téléphone */
.icon-phone-v3 .fa-phone-alt {
    color: #ff9800; /* Orange du téléphone */
    font-size: 30px;
    width: 40px;
    margin-right: 15px;
    transform: rotate(95deg); /* Rotation légère du combiné */
}

/* Bouton "OK" avec dégradé */
#rappel-form-ok-btn {
    width: 80%;
    padding: 10px 0;
    margin-top: 20px;

    /* Propriété clé pour le dégradé */
    /* background: linear-gradient(to bottom, #ffc107, #f57c00); */
		background: #F2AC5E;
		background: linear-gradient(90deg, rgba(242, 172, 94, 1) 0%, rgba(239, 148, 101, 1) 50%, rgba(236, 115, 121, 1) 100%);

    color: white;
    font-size: 28px;
    font-weight: bold;
    border: none;
    border-radius: 30px; /* Forme "pilule" */
    cursor: pointer;

    /* Ombre subtile */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
    transition: all 0.2s ease;
}

#rappel-form-ok-btn:hover {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}



/*****/
#rappel-form-phone-inpu-content *{font-family: Arial, Helvetica, sans-serif;}
/* #rappel-form-input-phone{color: #212529;background-color: #fff;border-color: #86b7fe;outline: 0;box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25);border-radius:6px;font-size:17px;width:100%} */

#rappel-form-close-btn{
	display: flex;
	flex-wrap: nowrap;
	align-content: space-around;
	justify-content: space-evenly;
	align-items: center;
	line-height: 1;
	font-size: 18px;
	background-color: #90C0CE;
	padding: 5px;
	border: 2px solid #355097;
	width: 45%;
	border-radius: 10px;
	margin: 0 auto;
	margin-top: 10px;
	color: #355097;
	font-family: 'inter-classic';
}

.iti--separate-dial-code .iti__selected-flag{background-color:#90C0CE}

/* #rappel-form-close-btn{position: absolute;top:1px;right:1px;line-height: 1;font-size:20px} */
#rappel-form-close-btn .fa-times{cursor:pointer;color:var(--rappel-button-close-color);font-size: 25px;}

#rappel-form-header * {font-family: 'Helvetica', 'Arial', sans-serif;position:relative;}
#rappel-form-header h2{font-size: 25px;font-weight: bold;letter-spacing: 0.5px;color:var(--rappel-title-color);padding-top:50px }

#rappel-form-phone-input-content {
    /* Clé pour aligner les éléments horizontalement */
    display: flex;

    /* Permet de créer l'effet d'un seul bloc autour des éléments */
    border: 2px solid #546284;
    border-radius: 8px; /* Coins arrondis du conteneur */
    background-color: white;
    overflow: hidden; /* Empêche les enfants de dépasser */
    max-width: 400px; /* Exemple de largeur maximale */
}

#rappel-form-input-phone {
    /* Permet à l'input de s'étendre et d'occuper l'espace central */
    flex-grow: 1;

		/* Supprimer les bordures et l'arrière-plan de l'input */
    border: none;
    outline: none;
    padding: 10px;
    font-size: 16px;
    color: #355097;
		padding-left: 45px;
		width: 100%;
		background-color: #90C0CE;
}

#rappel-form-phone-button {
    /* Styles pour l'apparence orange */
    background-color: #d1875c;
    color: white;
    font-weight: bold;
    text-transform: uppercase;

    /* Supprimer la bordure et ajuster le padding */
    border: none;
    padding: 0 5px;
    cursor: pointer;
		font-size: 17px;
    /* Assure qu'il est bien aligné avec le reste */
    display: flex;
    align-items: center;
}
/* PLACEHOLDER */
#rappel-form-input-phone::placeholder {
    /* Couleur noire pour le texte du placeholder */
    color: black;
    /* Ou utilisez le code hexadécimal */
    /* color: #000; */

    /* Optionnel : pour s'assurer qu'il n'y a pas de transparence, si besoin */
    opacity: 1;
}

/* --- Préfixes navigateurs pour la compatibilité --- */

/* Pour Firefox */
#rappel-form-input-phone::-moz-placeholder {
    color: black;
    opacity: 1;
}

/* Pour Internet Explorer/Edge */
#rappel-form-input-phone:-ms-input-placeholder {
    color: black;
}

/* Pour les anciennes versions de Edge */
#rappel-form-input-phone::-ms-input-placeholder {
    color: black;
}
/***/

@media ((min-width:380px)){
	#rappel-form-header h2{font-size: 24px;letter-spacing: normal;}
}
#rappel-form-header h3{margin-top: 25px;font-size: 18px;font-weight: bold;}
@media ((min-width:320px)){
	#rappel-form-header h3{font-size: 20px;;}
}
#rappel-form-header h4{font-size: 18px;font-weight: bold;font-style: italic;}
#rappel-form-header p{margin-top: 25px;font-size:16px;font-weight: normal;line-height: 1.2326521;}

#rappel-form-phone-container {
    position: absolute;
    bottom: 0px; /* Positionne l'élément au bas du conteneur relatif */
    left: 0;
    width: 100%; /* Prend toute la largeur */
    padding: 5px;
    box-sizing: border-box;
}

#rappel-form-phone-container.responsed{margin-top:20px;padding-bottom:20px}
#rappel-form-phone-response-msg p{font-family: 'Helvetica', 'Arial', sans-serif;padding:3px;font-size:16px;color: #155724;background-color: #d4edda;border-color: #c3e6cb;font-weight:normal}

#rappel-form-phone-checkbox-container{margin: 30px auto 0;width:95%;}
.rappel-form-phone-checkbox-content{display: flex;flex-direction: row;flex-wrap: nowrap;align-items:baseline;font-weight: normal;font-size: 13px;}
.rappel-form-phone-checkbox-content input{margin:0 5px 0 0}
.rappel-form-phone-checkbox-content label{margin:0;color: #333}
.rappel-form-phone-checkbox-content label a{color:#337ab7;text-decoration: underline;}

#rappel-form-phone-error-msg{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 3px;width: 95%;margin: 0 auto 20px;padding: 2px 0;font-size: 16px;}

#rappel-form-phone-container p{font-family: 'Helvetica', 'Arial', sans-serif;color: var(--rappel-paragraph-color);margin-bottom: 12px;font-style: italic;}

.fade-in{opacity: 0;animation-name:fade-in-animation;animation-duration: 0.5s; animation-fill-mode: forwards;}
.fade-out{opacity: 1;animation-name:fade-out-animation;animation-duration: 0.5s; animation-fill-mode: forwards;}

#rappel-form ul {
	list-style-type: none; /* Supprime les puces */
	margin: 0; /* Optionnel : ajuste la marge */
}

#rappel-form li {
	list-style-type: none; /* Optionnel : s'assure que chaque élément <li> n'a pas de puce */
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
	padding: 10px 0;
}
#rappel-form li i{margin-right: 8px;}
#rappel-form li i img{max-width: 20px;height: auto;}

#header-mailing-title-sms{text-align: left;color: #000;padding: 15px 30px;font-size: 25px;text-align: center;}
#header-mailing-title-sms span{font-size: 19px;}
#header-mailing-subtitle-sms{color:#2b3a68;font-size:20px;font-weight: bold;padding: 0 30px 30px;}

/* 1. Conteneur principal: Fixé en bas */
#fixed-call-to-action {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    text-align: center;
    background-color: white;
    z-index: 1000;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
		z-index: 90000000;
}

/* 2. Le bouton d'appel (le grand rectangle bleu) */
#call-button {
    /* Style du bouton */
    display: inline-flex; /* Permet d'aligner l'icône, le texte et le numéro */
    align-items: center;
    justify-content: center;

    /* Couleurs et forme */
    background-color: #5c6bc0; /* Bleu/Violet principal */
    color: white;
    font-size: 10px;
    font-weight: 700;
    padding: 12px 10px;
    border-radius: 8px;
    text-decoration: none; /* Enlève le soulignement du lien */

    /* Ombre sous le bouton pour l'effet de relief */
    box-shadow: 0 5px 0 #3f51b5, 0 8px 15px rgba(0, 0, 0, 0.3);

    /* Marge pour le centrage et l'espacement */
    margin-bottom: 5px;


    /* Animation optionnelle pour l'effet de "pression" */
    transition: all 0.1s ease;
		margin: 10px;
}

.phone-number{font-size: 15px;}

/* 3. Style de l'icône étoile */
.star-icon {
    font-size: 28px; /* Taille de l'étoile */
    margin-right: 10px;
    line-height: 1; /* Assure un alignement parfait */
}

/* 4. Mettre le numéro en évidence */
.phone-number {
    margin-left: 10px;
    font-weight: 900; /* Plus gras que le reste du texte */
}

/* 5. Le texte du code promotionnel */
#promo-code-text {
    font-size: 16px;
    color: #333;
    margin: 0; /* Supprimer les marges par défaut */
    padding-bottom: 5px; /* Espacement au bas de la page */
}

#reponse{margin-bottom: 50px;}
#header-mailing-subtitle{font-family: 'inter-classic', Arial sans-serif;color:#2b3a68;font-size:21px;font-weight: normal;padding:0;margin: 30px 0 12px;background-color: #dce2f6;max-width: 400px;margin: 30px auto;padding: 10px;}


/*******************************************************************************************/

/******************************************************************************/
@media (min-width:330px){
	#tchat-header .title-tchat span{font-size:15px}
}

@media ((min-width:380px) and (max-width:400px)){
	#rappel-form-header h2{font-size: 23px;}
}
#rappel-form-header h3{margin-top: 25px;font-size: 18px;font-weight: bold;}
@media ((min-width:360px)){
	#rappel-form-header h3{font-size: 20px;;}
}
/* #rappel-form-header h4{font-size: 18px;font-weight: bold;font-style: italic;}
#rappel-form-header p{margin-top: 25px;font-size:16px;font-weight: normal;line-height: 1.2326521;}

#rappel-form-phone-container{margin-top:40px}

#rappel-form-phone-container.responsed{margin-top:20px;padding-bottom:20px}
#rappel-form-phone-response-msg p{font-family: 'Helvetica', 'Arial', sans-serif;padding:3px;font-size:16px;color: #155724;background-color: #d4edda;border-color: #c3e6cb;font-weight:normal}

#rappel-form-phone-checkbox-container{margin: 30px auto 0;width:95%;}
.rappel-form-phone-checkbox-content{display: flex;flex-direction: row;flex-wrap: nowrap;align-items:baseline;font-weight: normal;font-size: 13px;}
.rappel-form-phone-checkbox-content input{margin:0 5px 0 0}
.rappel-form-phone-checkbox-content label{margin:0;color: #333}
.rappel-form-phone-checkbox-content label a{color:#337ab7;text-decoration: underline;}

#rappel-form-phone-button, #rappel-form-phone-call-link{position:relative;overflow:hidden;font-family: Montserrat,sans-serif;
	font-size: 25px;width: 95%;padding: 2px 0;margin: 40px auto 0;text-transform: uppercase;font-size: 22px;letter-spacing:1px;color:var(--rappel-button-color, #FFF);animation: infinite anim-rappel-form-button 2s cubic-bezier(0.42, 0.41, 0.13, 0.89);border:0 none;border-radius:12px;box-shadow: 0 2px var(--rappel-button-shadow-color), 0 3px 4px rgb(255 255 255 / 25%);
	border-radius: 10px;box-shadow: 0px 5px 11px 0px rgba(120,120,120,0.75);
	-webkit-box-shadow: 0px 5px 11px 0px rgba(120,120,120,0.75);
	-moz-box-shadow: 0px 5px 11px 0px rgba(120,120,120,0.75);display:block;background: rgb(32,100,25);
	background: linear-gradient(90deg, rgba(32,100,25,1) 0%, rgba(0,212,47,1) 100%);
}
#rappel-form-phone-button::after{content: '';position: absolute;top: -125%;left: -100%;width: 40px;height: 350%;opacity: 0.25;transform: rotate(45deg);animation: shine;animation-duration: 2s;animation-iteration-count: infinite;animation-timing-function: ease-out;
	background: rgba(255, 255, 255, 0.20);
	background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 53%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 53%,rgba(255,255,255,0) 100%);
	background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 53%,rgba(255,255,255,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1);
} */
#rappel-form-phone-error-msg{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 3px;width: 95%;margin: 0 auto 20px;padding: 2px 0;font-size: 16px;}

.fade-in{opacity: 0;animation-name:fade-in-animation;animation-duration: 0.5s; animation-fill-mode: forwards;}
.fade-out{opacity: 1;animation-name:fade-out-animation;animation-duration: 0.5s; animation-fill-mode: forwards;}

@keyframes anim-rappel-form-button {
	0%{background-position:50% 0%;text-shadow: none;}
	50%{background-position:51% 100%;text-shadow: 0 0 5px #FFF;}
	100%{background-position:50% 0%;text-shadow: none;}
}

@keyframes fade-in-animation {from {opacity: 0;} to {opacity: 1;}}
@keyframes fade-out-animation {from {opacity: 1;} to {opacity: 0;}}

@keyframes shine {from {left: -100%;} to {left: 200%;}}
@-moz-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-webkit-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-ms-keyframes shine {from {left: -100%;} to {left: 200%;}}
@-o-keyframes shine {from {left: -100%;} to {left: 200%;}}


@media (min-width:320px){
	#ban-phone{margin-top: 15px;}

	h2.title0{font-size:19px;}
	h4.title2{font-size:18px}
	h3.title1{font-size:17px;}
	h4.title3{font-size:17px}

	#valide #call .title-txt,#interdiction #call .title-txt{padding-top:0}
	#valide #ban-frame-container,#interdiction #ban-frame-container{border: 0 none;box-shadow:none;border-radius: 0;border-top: 1px solid #0b1470;}
	#valide #callback,#interdiction #callback{padding-top:20px;}
	#valide .border-grey-resp,#interdiction .border-grey-resp{border-top: 1px solid#dadada;margin: 20px auto 0;width: 50%;}

	/* reponse page */
	#call-mailing-title-1{font-size:19px}
	#call-mailing-title-2{font-size:16px}
	#call-mailiing-plan-container a{font-size: 15px;}
}
@media (min-width:340px){
	#ban-frame-content h4.phone-tel a{font-size:25px;}
}
@media (min-width:360px){
	h2.title0{font-size:21px;}
	h3.title1{font-size:18px;}
	h4.title2{font-size:19px}
	h4.title3{font-size:18px}

	#valide .title2-top .fa-envelope, #interdiction .title2-top .fa-envelope{color: #FFF;display: inline-block;visibility: visible;	font-size: 16px;	padding: 3px 4px;	border-radius: 4px;	background: #3b7bff;	background: linear-gradient(180deg, #ef2de7 0%, #b008fe 100%);	margin-right: 3px;}

	#cards-animation-container{padding:220px 0 0}
	.blk-cards{width: 20%}

	#request-lead{padding: 10px 0;font-size: 22px;letter-spacing: 1px;}

	#ban-phone{padding: 10px 0;}
	#ban-frame-content{padding-top: 35px;}
	#ban-frame-content .tarif {font-size:20px}

	#is-typing-container{justify-content: left;padding: 10px 10px;}

	/* call group (call & callack) */
	/* #landing #call-group{background-color: #FFF;background-image: url(../images/bg-call-group-mobile.jpg), url(../images/bg-call-group-mobile.jpg);background-repeat:repeat-y, repeat-y;background-position:left top, right top;} */

	#phone-svg{	width: 85px;height: 85px;}
	#phone-number-link{	font-size: 27px;}

	#callback {padding: 0 45px 50px;}

	/* #about{margin-top: 8px;} */

	#tchat{padding: 25px 0 10px;}

	#call .title-txt{font-size:19px}

	/* response pages */
	#header-mailing .fa-envelope{display: inline; visibility: visible;color: #FFF;font-size: 16px;	padding: 3px 4px;	border-radius: 4px;	background: rgb(255, 29, 70);	background: linear-gradient(180deg, rgba(255, 29, 70, 1) 0%, rgba(255, 61, 3, 1) 100%);	margin-right: 3px}

	/********************************/
	/* news 01/2025 */
	.blk-select-right{width: 50%;position: relative;right: -145px;}
	.vocal-response{position: absolute;right: 20px;top: 25px;}

}
@media (min-width:375px){
	#confirm .blk-link-text {font-size:13px}
}
@media (min-width:390px){
	h2.title0{font-size:23px;}
	h3.title1{font-size:20px;}
	h4.title2{font-size:20px}
	h4.title3{font-size:20px}

	#call .title-txt{font-size:21px}

	.card{width: 85px;height: 165px;}
}
@media (min-width:410px){
	/* #steps h3{font-size:18px}
	#steps h4{font-size:18px} */

	.card{width: 70px;height: 115px;}

	#tchat-content .msg-cards-container{justify-content: space-evenly;}
	#tchat-content .msg-cards {width: 28%;margin: 8px 6%}

	#call h2{font-size:24px}

	/* txt head */
	h2.title0{font-size: 24px;}
	h3.title1{font-size: 24px;}
	h4.title2{font-size: 24px;}
	h4.title3{font-size: 24px;}


	#valide .title1-top, #interdiction .title1-top{font-size:27px;margin-bottom:0;padding-top: 40px;}
	#valide .title2-top, #interdiction .title2-top{font-size:22px;margin-top:0;margin-bottom:0}
	#valide .title3-top, #interdiction .title3-top{font-size:21px;font-weight:bold;margin-top:0;margin-bottom:0}

	.title4-txt{font-size: 20px;}
	.title4-txt span{font-size: 18px;}
	.title5-txt{font-size: 18px;font-weight: bold;font-style: normal;}
}
@media (min-width:420px){
	#call h2{font-size:24px}
	#ban-frame-content h4.phone-tel a{font-size:27px}
	#ban-frame-content .tarif .break-line{display: inline;}
	#tchat{padding: 15px 0 15px;}
	#header-mailing-title{font-size:18px;}
}

@media (min-width:430px) {
	#call-mailing-title-1{font-size:19px}
	#call-mailing-title-2{font-size:15px}
	#call-mailing-title-2 span{display: inline;font-weight: normal;}
}
@media (min-width:450px){
	#header-mailing-subtitle{font-size:18px;}
}
@media (min-width:467px){
	.blk-infos div{padding: 0 14px;}

	#confirm .blk-link-text {top: 10px;font-size:18px}
}
@media (min-width:500px){
	#call h2{font-size:28px}
	#ban-phone{margin-top:50px}

	#tchat{padding: 45px 0 25px;}

	#call-mailing-title-1{font-size:20px}
	#call-mailing-title-2{font-size:16px;font-weight: bold;}
	#call-mailing-title-2 span{font-weight: bold;}

	.cb-secure{width: 12%;}
}
@media (min-width:600px) {

}
@media (min-width:650px){
	#reponse #overlay{background-color: transparent;}
	#response-container{padding-top: 12px;}
	#container-mailing{margin:10px auto}
}

@media (min-width:678px){
	.mainContent{background-color: var(--bg-color-main-content, gray);}
	/* .container{background-color: var(--white, #FFF);} */

	header, #header{border-bottom:0 none ;}
	#header-picture{width:100%} /* force 100% */

	#steps .break-line{display: inline-block;}

	.card{width: 125px;height: 200px;border-radius: 10px;}
	.back-card, .face-card{border-radius: 10px;}

	#ban-frame-container{max-width: 600px;}

	#callback-container{max-width: 370px; transform-origin: bottom;}
	#callback-response{max-width: 370px;margin:0 auto}
	/* #about {margin-top: 0;} */
	#about-container{padding: 30px 47px}
	#about-container h2{font-size: 25px;}
	#about-sub-titles h2{font-size: 25px;}
	#about-sub-titles p{font-size:25px}

	#tchat{padding: 0 0 15px;}

	#tchat-content .tchat-para{align-items: center;padding: 5px 0 0;}
	#tchat-content .tchat-avatar{order:0;width:65px;min-width: 65px;max-width: 65px;margin:11px 6px 0 0}
	#tchat-content .tchat-avatar img{border:1px solid var(--green-tchat)}
	#tchat-content .tchat-msg{order:1; margin-left:15px;}

	#tchat-content .tchat-para.is-card{align-items: flex-end;}
	#tchat-content .is-card .tchat-avatar{margin: 0 6px 11px 0}
	#tchat-content .msg-cards-container{flex-wrap: nowrap;}
	#tchat-content .msg-cards{width: 18%;margin: 0;}

	#about img{width:45%}
	#bg-white{padding: 10px 40px;}

	/* txt head */
	/* #title-cards-action, #title-form-action{margin-top: 80px;background-color:rgb(246 228 255 / 30%)} */

	#valide #ban-frame-container, #interdiction #ban-frame-container{border-top: 0;}

	/* news 01/2025 */
	.no-display-mob{display: block;}
	.bg-opacity-black{background-color: inherit;}

	#landing #bg-container.step-1, #landing #bg-container.step-2, #landing #bg-container.step-3{background: no-repeat center top url(../images/bg-pad.jpg);background-color: #FFF;background-size: cover;}
	#valide #bg-container.step-1, #valide #bg-container.step-2, #valide #bg-container.step-3{background: no-repeat center top url(../images/bg-pad.jpg);background-color: #FFF;background-size: cover;min-height: 350px;border-bottom: 1px solid #000;}
	#interdiction #bg-container.step-1, #interdiction #bg-container.step-2, #interdiction #bg-container.step-3{background: no-repeat center top url(../images/bg-pad.jpg);background-color: #FFF;background-size: cover;min-height: 350px;border-bottom: 1px solid #000;}
	#valide #steps, #interdiction #steps{position: relative;top:0}
	#valide #steps .medium-name, #interdiction #steps .medium-name{position: absolute;top:320px;right:0}

	#valide #tchat-container,#interdiction #tchat-container{position: relative;top: -70px;}

	#rgpd{max-width: inherit;}
	.container-slider-rgpd{max-width: 600px;margin: 0 auto;}
	.title-boutique{margin-left: 220px;}

	#valide .blk-infos-medium, #interdiction .blk-infos-medium {width: 50%;margin: 0 auto;}
	#cards-animation-container {padding: 320px 0 20px;}
}

@media (min-width:908px){
	#header-medium-container{transform: translate(-50%, -55%);}

	#cards-animation {max-width: 700px;}
	.blk-cards{width:20%}

	#tchat{padding: 0}
	#form-box{background-color:rgba(255,255,255,0.6)}

	#call .title-txt{font-size:23px}
	#call .subtitle-txt{font-size: 22px;}

	#ban-phone{margin-top:115px}
	#ban-phone h2{font-size:26px;}
	#ban-phone .rdv{font-size:26px}
	#ban-phone .tarif{font-size:17px}

	#tchat-container.border-top-gray{border: 0 none;}

	/* #is-typing-container{width: 70%;box-shadow: 0 4px 6px 0px rgb(0 0 0 / 40%);border-radius: 5px;} */

	#about-container #about-type{font-size: 18px;font-weight: bold;}
	#about-sub-titles{max-width:600px;margin:0 auto}
	#about-sub-titles h2{font-size: 25px;}
	#about-sub-titles h2 .break-line{display: inline;}

	#response-container{padding: 20px 0;}

	/* formulaire */
	#form-container{background: transparent;}

	/* news 01/2025 */
	#landing #bg-container.step-1, #landing #bg-container.step-2, #landing #bg-container.step-3{background: no-repeat center top url('../images/bg-desk.jpg');background-color: #FFF;background-size: cover;}
	#valide #bg-container.step-1, #valide #bg-container.step-2, #valide #bg-container.step-3{background: no-repeat center top url('../images/bg-desk.jpg');background-color: #FFF;background-size: cover;}
	#interdiction #bg-container.step-1, #interdiction #bg-container.step-2, #interdiction #bg-container.step-3{background: no-repeat center top url('../images/bg-desk.jpg');background-color: #FFF;background-size: cover;}

	/* #cards-animation-container{padding: 360px 0 20px} */
	#step-1 h3, #step-2 h3{font-size: 28px;}
	#step-1 h4, #step-2 h4{font-size:21px}
}
@media (min-width:990px){
	/* news 01/2025 */
	.title-boutique{margin:0 auto;}
}
@media (min-width:1200px){
	#header-medium-container{width:100%;max-width: 250px;border-width:7px;transform: translate(-50%, -70%);}

	#about.border-top-gray{border: 0 none;}

	/* txt head */
	h2.title0{font-size: 30px;}
	h3.title1{font-size: 25px;}
	h4.title2{font-size: 29px;}
	h4.title3{font-size: 27px;padding-top: 12px;}

	/* news 01/2025 */

	#valide .container, #interdiction .container {width: 985px;}
	#valide #bg-container.step-1, #valide #bg-container.step-2, #valide #bg-container.step-3{min-height: 440px;}
	#interdiction #bg-container.step-1, #interdiction #bg-container.step-2, #interdiction #bg-container.step-3{min-height: 440px;}
	#valide #steps .medium-name, #interdiction #steps .medium-name{top:400px}

	/* .title-boutique {margin-left: 400px;} */

}
