@import "../vars.css";
@import "../font.css";
@import "../fontClasses.css";

html {
  overflow-x: hidden;
}

body {
  font-family: Boston;
  font-weight: normal;
}

header {
  max-width: 1600px;
  max-height: 170px;
}

p {
  margin-bottom: 0;
}

a {
  text-decoration: none;
}

main {
  margin: auto;
}

footer {
  background-color: var(--custom_dark);
  max-width: 1600px;
  padding-top: 56.4px;
  padding-bottom: 83px;
}

footer > section {
  margin: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}

/* h1 {
  max-width: 662px;
  max-height: 224px;
} */

h2 {
  margin-top: 137px;
  margin-bottom: 70.7px;
}

section {
  max-width: 1600px;
  margin: auto;
}

#marker-one {
  border-top: 1px solid var(--custom_dark);
  position: relative;
  padding-top: 60.7px;
  padding-bottom: 55.3px;
  gap: 41px;
}

#marker-two {
  border-top: 1px solid var(--custom_dark);
  position: relative;
  padding-top: 60.7px;
  padding-bottom: 55.3px;
  gap: 41px;
}

#marker-one::before {
  content: "POUR VOTRE CLIENT";
  font-family: Boston;
  font-weight: 900;
  position: absolute;
  top: -15px;
  background: var(--custom_green);
  padding: 0 15px;
}

#marker-two::before {
  content: "POUR VOUS";
  font-family: Boston;
  font-weight: 900;
  position: absolute;
  top: -15px;
  background: var(--custom_green);
  padding: 0 15px;
}

.sepeation-line {
  display: block;
  content: " ";
  margin-top: 24px;
  margin-bottom: 20px;
  width: 100%;
  height: 1px;
  background-color: white;
}

.description {
  display: flex;
}

.button {
  border-radius: 5px;
  outline: transparent;
  border: none;
}

.ok {
  display: flex;
  justify-content: space-around;
  flex-direction: row;
  width: 1370px;
}

.line-after {
  position: relative;
}

.line-after::after {
  position: absolute;
  bottom: 31.1px;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--custom_dark_opacity_50);
}

.line-before {
  position: relative;
}

.line-before::before {
  position: absolute;
  left: -39px;
  content: "";
  width: 1px;
  height: 100%;
  background-color: white;
}

.absolute-img {
  right: -37%;
  bottom: -50%;
}

.bg-img {
  background-image: url("../../images/Groupe\ 616.png");
  background-repeat: no-repeat;
  background-position: right top;
}

.img-container {
  max-width: 80%;
  height: 100%;
}

/* Specific class for anchore */

.title {
  display: flex;
  gap: 13.5px;
}

.tel {
  text-decoration: none;
  color: var(--custom_dark);
}

/* Utilities class */

.g-1 {
  gap: 274.8px;
}

.g-10 {
  gap: 10px;
}

.z-5 {
  z-index: 5;
}

.z-1 {
  z-index: 1;
}

.g-2 {
  gap: 12.5px;
}

.g-3 {
  gap: 107px;
}

.mt-footer {
  margin-top: 243px;
}

.ml-negative {
  margin-left: -0.9rem;
}

.max-width-small {
  max-width: 1316px;
}

.p-1 {
  padding-top: 60.7px;
  padding-bottom: 55.3px;
}

.p-5 {
  padding: 79px;
}

.mt-9 {
  margin-top: 90px;
}

.pt-5 {
  padding-top: 79.7px;
}

.pb-5 {
  padding-bottom: 79.7px;
}

.ml-1 {
  margin-left: 142px;
}

.bg-red {
  background-color: var(--custom_red);
}

.bg-green {
  background-color: var(--custom_green);
}

.text-green {
  color: var(--custom_green_light);
}
.text-green-dark {
  color: var(--custom_green);
}

.bg-dark {
  background-color: var(--custom_dark);
}

.text-white {
  color: white;
}

.text-red {
  color: var(--custom_red);
}
.w-fit-content {
  width: fit-content;
}

.rounded {
  border-radius: 100%;
  outline: none;
  border: none;
  height: 11px;
  width: 12px;
  background-color: var(--custom_green);
}

.w-40 {
  width: 40%;
}
.w-60 {
  width: 60%;
}

.bd-bottom {
  border-bottom: 1px solid black;
}

.bd-right {
  border-right: 1px solid black;
}

.max-w-block {
  max-width: 614px;
  width: 614px;
}

.bd {
  border: 1px solid black;
}

.w-604 {
  width: 604px;
}

.g-76 {
  gap: 76px;
}

/* slides classes */

.mb-slide {
  margin-bottom: 68.8px;
}

.prev,
.next {
  background-color: transparent;
  all: unset;
}

.next {
  transform: rotate(180deg) translateY(-7px);
}

.arrows svg {
  fill: var(--custom_red);
}

/* accorddion classes */

.accordion-button:not(.collapsed) {
  background-color: var(--custom_dark);
  color: white;
}

.accordion-button {
  background-color: var(--custom_dark_opacity_50);
  color: #fff;
}

.accordion-button::after {
  background-image: url("../../images/Groupe\ 258.svg");
}

.accordion-button:not(.collapsed)::after {
  background-image: url("../../images/Groupe\ 258.svg");
}

.accordion-body {
  padding: 0;
}

/* Formulaire classes */

.form-control {
  background-color: transparent;
  border: 1px solid var(--custom_grey);
  border-radius: inherit;
  width: 457px;
}

.form-control:focus {
  background-color: transparent;
  box-shadow: none;
  border: 1px solid var(--custom_grey);
}
.form-control::placeholder {
  color: white;
}

form div {
  margin-bottom: 52.3px;
}

form button {
  background-color: transparent;
  color: white;
  border: 1px solid var(--custom_grey);
  padding: 10px;
}