:root {
	--padd		: 2.5vw;
	--padd15d	: calc(var(--padd) * 0.66);
	--padd2d	: calc(var(--padd) * 0.5);
	--padd3d	: calc(var(--padd) * 0.33);
	--padd15m	: calc(var(--padd) * 1.5);
	--padd2m	: calc(var(--padd) * 2);
	--padd3m	: calc(var(--padd) * 3);

	--form	: 27.5vw;
}
/* ========================================================================== */

body {
  min-height: 100vh;
  position: relative;
  /* scroll-behavior: smooth;
    -ms-scroll-chaining: none;
    overscroll-behavior: none; */
}

/* ========================================================================== */
.btn-wrapper{
	display: flex;
	justify-content: flex-end;
}
.btn {
  cursor: pointer;
  background-color: #000000;
  color: white;
  padding: 4px 8px;
  display: flex;
  font-size:14px ;
  justify-content: center;
  align-items: center;
text-transform: uppercase;
  transition: all 0.3s ease;
}
.btn:hover {
}

/* ========================================================================== */

#content {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  height: 100%;
}
#content > img:first-child {
  margin-bottom: var(--padd2m);
  width: max(200px, 17.5vw);
  max-width: 320px;
}
#content h1 {
  margin-bottom: var(--padd);
}
#content h1 strong {
  font-size: 2.5vw;
}
#content h1 span {
  background-color: #b10f5c;
  padding: 6px 18px;
  font-size: 2vw;
}
#content h2 {
  margin-bottom: var(--padd2m);
  font-size: 1.66vw;
}

/* ========================================================================== */

#formulaire {
  width: var(--form);
  padding: var(--padd2d) var(--padd);
  text-align: center;
  box-shadow: 2.5px 2.5px 10px #707070;
  background-color: white;
  color: black;
}
#formulaire h2 {
  margin: auto;
  padding-bottom: var(--padd3d);
  margin-bottom: var(--padd3d);
  border-bottom: 1px solid #095d60;
}
#confirmation {
  padding: var(--padd2m) 0;
  text-align: center;
  margin-bottom: 0;
}
#confirmation .btn {
  width: 80%;
}
.formLeads input,
.formLeads select {
  width: 100%;
padding-top:8px ;
padding-bottom: 8px;
  margin-bottom: var(--padd3d);

  background-color: #ffffff;
  padding-left: 12px;
  color: black;
}
::placeholder {
  color: black;
  opacity: 1;
  font-size: 0.833vw;
  font-weight: 500;
}
@media screen and (max-width : 769px){
	::placeholder {
		color: black;
		opacity: 1;
		font-size: 14px;
		font-weight: 500;
	  }
}
#container_date {
  margin-top: 5px;
}
#container_date > div {
  display: grid;
  grid-template-columns: 47.5% 47.5%;
  grid-gap: 5%;
  width: 100%;
}
#container_date label {
  width: 100%;
}
.formLeads {
  font-size: 90%;
}
.formLeads i {
  margin-bottom: var(--padd2d);
}
.formLeads .mab_radio {
  margin-top:0.4vw ;
  margin-bottom:0.4vw; 
}
.formLeads .form_nb-txt{
	display: block;
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	line-height: 1em;
}
.formLeads .mab_radio__label {
  text-align: left;
  padding-left: var(--padd3d);
}
.formLeads .mab_radio__control {
  width: 30px;
  height: 30px;
  border-radius: 0;
  background-color: #ffffff;
  border-color: #ffffff;
}
.formLeads .mab_radio input:checked + .mab_radio__control {
  background-color: #241A33;
}
#formulaire .btn {
  width: 50%;
  height: max(2.5vw, 40px);
  margin: calc(var(--padd) * 0.66) auto;
  letter-spacing: 0.1em;
  line-height: 1em;
}
#heure {
  background: #e5eded
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cg id='Groupe_2221' data-name='Groupe 2221' transform='translate(-50 -1745)'%3E%3Cg id='Ellipse_10' data-name='Ellipse 10' transform='translate(50 1745)' fill='none' stroke='%23000' stroke-width='1'%3E%3Ccircle cx='6' cy='6' r='6' stroke='none'/%3E%3Ccircle cx='6' cy='6' r='5.5' fill='none'/%3E%3C/g%3E%3Cpath id='Tracé_3942' data-name='Tracé 3942' d='M56,1746.217v3.273l1.923.9' transform='translate(0 1.51)' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A")
    no-repeat 5%/12px;
  text-indent: 0.5em;
}
@media (min-width: 1025px) {
  input[name="date"] {
    text-indent: 0.5em;
  }
}
/* uniquement pour safari */
@media not all and (min-resolution: 0.001dpcm) {
  #heure {
    text-indent: 20px;
  }
  input[name="date"] {
    text-indent: 0;
    width: 100%;
  }
  input[type="date"]::before {
    content: attr(placeholder);
    white-space: pre;
    padding-left: 0;
  }
  input[type="date"]:focus::before {
    content: "" !important;
  }
}
@media (max-width: 1024px) {
  input[type="date"]::before {
    content: attr(placeholder);
    white-space: pre;
    padding-left: 0.5em;
  }
  input[type="date"]:focus::before {
    content: "" !important;
  }
}
input[name="date"] {
  position: relative;
}
input[name="date"]::-webkit-calendar-picker-indicator {
  position: absolute;
  left: 6px;
  right: 0;
  width: 24px;
  padding-right: 75%;
  cursor: pointer;
  content: "";
  /* filter: invert(1); */
}

/* ========================================================================== */

h2 {
  line-height: 1.2em !important;
}

.mentions {
  color: #ffffff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: var(--padd2d);
}
.mentions p {
  margin-bottom: 0;
}
.mentions img {
  width: 50%;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: max(160px, 8.5vw);
  margin-bottom: var(--padd15d);
}

.vegetations {
  position: absolute;
  z-index: -1;
}

/* ========================================================================== */

@media (min-width: 1024px) {
  .mobile {
    display: none;
  }

  h1 {
    line-height: 1.75em !important;
  }

  .mentions {
    width: 50%;
  }

  .vegetations {
    width: auto;
    height: 100%;
  }
  .vegetations.right {
    top: 0;
    right: 0;
  }
  .vegetations.left {
    top: 0;
    left: 0;
  }
}

/* ========================================================================== */

@media (max-width: 1024px) {
  .desktop {
    display: none;
  }

  :root {
    --padd: 30px;

    --form: 90vw;
  }

  body {
    grid-template-columns: 1fr;
  }

  h1 {
    line-height: 1.33em !important;
  }

  .mentions {
    min-width: 100vw;
  }

  /* ========================================================================== */

  .vegetations {
    width: 100vw;
    height: auto;
  }
  .vegetations.top {
    top: 0;
    left: 0;
  }
  .vegetations.bottom {
    bottom: 0;
    left: 0;
    transform: translateY(-25%);
  }

  /* ========================================================================== */

  #content {
    padding-top: var(--padd3m);
  }
  #content h1 strong {
    font-size: 7vw;
  }
  #content h1 span {
    font-size: 5.5vw;
  }
  #content h2 {
    font-size: 5vw;
  }

  /* ========================================================================== */

  #formulaire {
    width: var(--form);
    padding: var(--padd2d);
    margin-bottom: var(--padd3m);
  }
}

@media screen and (max-width : 769px){
	.formLeads .form_nb-txt{
		margin-top: 16px;
		margin-bottom: 32px;
	}
}