* {
  margin: 0;
  padding: 0;
}

/* Loader */
.loader {
  position: fixed;
  background-color: #000000;
  width: 100%;
  height: 100vh;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 5000;
  display: flex;
  flex-direction: column;
}
.loader .svgLoader {
  width: 20vw;
  height: auto;
  aspect-ratio: 1874.11/1077.76;
  margin: auto;
  margin-bottom: 15vh;
}
.loader .svgLoader .svgLoaderPath {
  fill: none;
  stroke: #fff;
  stroke-width: 50px;
  stroke-miterlimit: 10;
}
.loader .loading {
  width: 50vw;
  margin: auto;
  margin-top: 0;
  display: flex;
  gap: 3vh;
  height: fit-content;
  flex-direction: column;
  position: relative;
}
.loader .loading .compteur {
  font-family: "acier-bat-solid", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: white;
  position: absolute;
  top: -4vh;
  font-size: 2vw;
}
.loader .loading .loading_bar {
  background-color: white;
  height: 2vh;
  border-radius: 100em;
}

header {
  width: 100%;
  height: 12vh;
  display: flex;
  position: fixed;
  align-items: center;
  font-family: "acier-bat-solid", sans-serif;
  font-weight: 400;
  font-style: normal;
  z-index: 3000;
}
header .background_masque {
  background: linear-gradient(to bottom, #101010 0%, rgba(16, 16, 16, 0) 100%);
  z-index: -1;
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: all 1s;
}
header .background_header {
  position: absolute;
  width: calc(100% + 100px);
  height: 20vh;
  top: -20vh;
  left: -50px;
  transition: all 1s;
  background: linear-gradient(to right, #ff314b 0%, #8908c0 50%, #0247a1 100%);
  filter: blur(10vh);
  z-index: -1;
}
header .header_links_1 {
  position: absolute;
  top: 0;
  bottom: 0;
  right: auto;
  left: 4vw;
  height: fit-content;
  width: fit-content;
  margin: auto 0;
  z-index: 1;
}
header .header_links_1 a {
  color: white;
  text-decoration: none;
  font-size: 1.75vw;
  text-shadow: 0px 0px 0px transparent;
  transition: all ease-in 0.2s;
}
header .header_links_1 a:nth-child(1) {
  margin-right: 40px;
}
header .Logo {
  display: flex;
  position: absolute;
  height: 60%;
  margin: auto;
  width: fit-content;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  filter: drop-shadow(0px 0px 0px transparent) !important;
}
header .Logo svg {
  height: 100%;
  width: auto;
}
header .Logo svg path {
  fill: #fff;
  stroke-width: 0px;
  transition: all ease-in 0.2s;
}
header .header_links_2 {
  position: absolute;
  top: 0;
  bottom: 0;
  left: auto;
  right: 40px;
  height: fit-content;
  width: fit-content;
  margin: auto 0;
  z-index: 1;
}
header .header_links_2 a {
  color: white;
  text-decoration: none;
  font-size: 1.75vw;
  text-shadow: 0px 0px 0px #ff314b;
  transition: all ease-in 0.2s;
}
header .header_links_2 a:nth-child(1) {
  margin-right: 40px;
  scroll-behavior: smooth;
}

.headerTel {
  display: none;
}

.navigationTel {
  display: none;
}

body {
  background-color: #000000;
  max-width: 100%;
  min-height: 100vh;
  overflow: hidden;
}

#topBtn {
  opacity: 0;
  width: 5vh;
  height: auto;
  aspect-ratio: 1/1;
  background-color: #1a1a1a;
  position: fixed;
  bottom: 3vh;
  top: auto;
  left: auto;
  right: 3%;
  z-index: 500;
  display: flex;
  border-radius: 50%;
  padding: 2vh;
  fill: white;
  box-shadow: inset 0em -3px 1px rgba(255, 255, 255, 0.2705882353);
}
#topBtn svg {
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
}
#topBtn svg #flecheHaut, #topBtn svg #trefle, #topBtn svg #coeur, #topBtn svg #carreau {
  visibility: hidden;
}
#topBtn svg #pique {
  margin: auto;
  width: 100%;
}

footer {
  width: 100%;
  height: 88vh;
  margin-top: 12vh;
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 200;
  background-color: #000000;
}
footer .decoFooter {
  width: 100%;
  height: 30%;
  position: relative;
  display: flex;
}
footer .decoFooter h1 {
  font-family: "acier-bat-solid", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: white;
  font-size: 8vh;
  width: fit-content;
  height: fit-content;
  margin: auto;
}
footer .decoFooter svg {
  position: absolute;
  width: auto;
  height: 30%;
}
footer .decoFooter svg.piqueFooter, footer .decoFooter svg.trefleFooter {
  fill: #2b2b2b;
}
footer .decoFooter svg.coeurFooter, footer .decoFooter svg.carreauFooter {
  fill: #ff314b;
}
footer .decoFooter svg.carreauFooter {
  top: 10%;
  right: 20%;
  bottom: auto;
  left: auto;
}
footer .decoFooter svg.coeurFooter {
  bottom: 9%;
  left: 7%;
  top: auto;
  right: auto;
}
footer .decoFooter svg.piqueFooter {
  bottom: -4%;
  left: 83%;
  top: auto;
  right: auto;
}
footer .decoFooter svg.trefleFooter {
  bottom: auto;
  left: 23%;
  top: 5%;
  right: auto;
}
footer form {
  scroll-behavior: smooth;
  width: calc(100% - 160px);
  margin: 0 80px;
  height: 60%;
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 0.5fr;
  grid-row-gap: 10%;
  grid-column-gap: 5%;
  grid-template-areas: "Nom Prenom Message Message" "Organisation Email Message Message" ". btn btn .";
}
footer form .contact.nom {
  grid-area: Nom;
}
footer form .contact.prenom {
  grid-area: Prenom;
}
footer form .contact.organisation {
  grid-area: Organisation;
  display: flex;
  flex-direction: column;
  vertical-align: bottom;
  margin-top: auto;
  height: fit-content;
}
footer form .contact.email {
  grid-area: Email;
  display: flex;
  flex-direction: column;
  vertical-align: bottom;
  margin-top: auto;
  height: fit-content;
}
footer form .contact.message {
  grid-area: Message;
}
footer form .contact.antispam {
  grid-area: antispam;
}
footer form .contact.btnSubmit {
  grid-area: btn;
  width: fit-content;
  margin: auto;
  height: fit-content;
}
footer form .contact.btnSubmit label {
  width: fit-content;
  background-color: #2b2b2b;
  padding: 0.5em 1em;
  border-radius: 12em;
  transition: all 0.2s ease-in-out;
  color: white;
}
footer form .contact.btnSubmit label:hover {
  background-color: white;
  color: #000000;
}
footer form .decos {
  position: absolute;
}
footer form .contact {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 20px 0;
}
footer form .contact label {
  color: white;
  font-family: "acier-bat-solid", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3vh;
  color: #858585;
}
footer form .contact input[type=text], footer form .contact input[type=email] {
  width: 100%;
  height: 4vh;
  font-size: 2vh;
  border: none;
  font-family: "roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
  box-sizing: border-box;
  padding: 0% 3% 0% 3%;
}
footer form .contact input[type=text]:focus-visible, footer form .contact input[type=email]:focus-visible {
  outline: none;
}
footer form .contact input[type=text]::placeholder, footer form .contact input[type=email]::placeholder {
  color: #bcbcbc;
}
footer form .contact textarea {
  width: 100%;
  height: 100%;
  font-size: 2vh;
  border: none;
  font-family: "roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
  box-sizing: border-box;
  padding: 1em;
}
footer form .contact textarea:focus-visible {
  outline: none;
}
footer form .contact textarea::placeholder {
  color: #bcbcbc;
}
footer .linksFooter {
  width: 100%;
  height: 10%;
  display: flex;
  justify-content: center;
  gap: 30px;
}
footer .linksFooter a {
  width: fit-content;
  height: fit-content;
  font-family: "acier-bat-solid", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: white;
  text-decoration: none;
  vertical-align: bottom;
  margin-top: auto;
  margin-bottom: 1em;
  font-size: 1.12em;
}

.grecaptcha-badge {
  visibility: hidden !important;
}

@media (max-width: 1200px) {
  header .header_links_1 a, header .header_links_2 a {
    font-size: 2.5vw;
  }
  footer .decoFooter .trefleFooter {
    top: -8%;
    left: 17%;
  }
  footer .decoFooter svg.carreauFooter {
    top: -5%;
    right: 15%;
  }
  footer form {
    height: 50%;
  }
  footer form .contact input[type=text], footer form .contact input[type=email], footer form .contact textarea {
    font-size: 1.5vw;
  }
  footer form .contact label {
    font-size: 2.25vw;
  }
  footer .linksFooter {
    height: 20%;
  }
}
@media (max-width: 768px) {
  .loader .svgLoader {
    width: 40vw;
    margin-bottom: 10vh;
  }
  .loader .loading {
    width: 80vw;
  }
  .loader .loading .compteur {
    font-size: 4vw;
    top: -4vh;
  }
  .loader .loading .loading_bar {
    height: 3vh;
  }
  body {
    overflow: auto;
  }
  header {
    display: none;
  }
  .headerTel {
    width: 100%;
    height: 12vh;
    display: flex;
    position: fixed;
    flex-direction: row;
    z-index: 3000;
    justify-content: space-between;
    top: 0;
    overflow: hidden;
  }
  .headerTel .LogoTel {
    width: auto;
    height: fit-content;
    margin: auto;
    margin-left: 8vw;
  }
  .headerTel .LogoTel svg {
    height: auto;
    width: 12vw;
    position: relative;
    aspect-ratio: 1849/1147;
  }
  .headerTel .LogoTel svg path {
    fill: #fff;
    stroke-width: 0px;
    transition: all ease-in 0.2s;
  }
  .headerTel .CVTelBtn {
    text-decoration: none;
    color: white;
    background-color: #8908c0;
    padding: 0.5em 1em;
    height: fit-content;
    margin: auto;
    margin-right: 8vw;
    border-radius: 300em;
    font-family: "acier-bat-solid", sans-serif;
    font-size: 3.25vw;
  }
  footer .decoFooter {
    height: 10%;
  }
  footer .decoFooter h1 {
    font-size: 10vw;
  }
  footer .decoFooter svg {
    height: 30%;
  }
  footer .decoFooter .trefleFooter {
    top: -8%;
    left: 17%;
  }
  footer .decoFooter svg.carreauFooter {
    top: -5%;
    right: 15%;
  }
  footer form {
    display: flex;
    flex-direction: column;
    width: calc(100% - 80px);
    margin: 0 40px;
    grid-row-gap: 0;
    grid-column-gap: 0;
    height: 80%;
  }
  footer form .contact.nom, footer form .contact.prenom, footer form .contact.organisation, footer form .contact.email {
    width: 100%;
    height: fit-content;
    vertical-align: top;
  }
  footer form .contact.prenom {
    grid-area: Prenom;
  }
  footer form .contact.organisation {
    grid-area: Organisation;
  }
  footer form .contact.email {
    grid-area: Email;
  }
  footer form .contact.message {
    grid-area: Message;
  }
  footer form .contact.antispam {
    grid-area: antispam;
  }
  footer form .contact.btnSubmit {
    grid-area: btn;
  }
  footer form .contact input[type=text], footer form .contact input[type=email], footer form .contact textarea {
    font-size: 1em;
  }
  footer form .contact label {
    font-size: 1em;
  }
  footer form .contact .nom, footer form .contact .prenom, footer form .contact .email, footer form .contact .organisation {
    height: fit-content;
    vertical-align: auto;
  }
  footer .linksFooter {
    height: 10%;
  }
}

/*# sourceMappingURL=app.css.map */
