.need-login-page {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.need-login-page h1 {
  color: #2ba4c5;
  font-weight: 600;
}
.need-login-page .btn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 2em;
  margin: 2em 0 0 0;
}
.need-login-page .btn-group a {
  background-color: #2ba4c5;
  color: #ffffff;
  padding: 1em 2em;
  border-radius: 3px;
  transition: all 0.3s ease-in-out;
  font-size: 16px;
  font-weight: 500;
}
.need-login-page .btn-group a:hover {
  background-color: rgb(33.8625, 129.15, 155.1375);
}

.contact-form,
.demand-form {
  display: grid;
  max-width: 70%;
  background: #fff;
  border-radius: 10px;
  padding: 3em;
  gap: 2em;
  margin: auto;
  align-items: center;
}
@media (max-width: 600px) {
  .contact-form,
  .demand-form {
    max-width: 90%;
  }
}
.contact-form form,
.demand-form form {
  display: grid;
  gap: 2em;
}
.contact-form form input,
.contact-form form select,
.demand-form form input,
.demand-form form select {
  width: 100%;
  height: 30px;
  border-radius: 3px;
  border-color: #d8e6eb;
}
.contact-form form .fieldset.name,
.demand-form form .fieldset.name {
  display: grid;
  align-items: center;
  grid-template-columns: 100px auto;
}
.contact-form form .message-fieldset label,
.contact-form form .message-fieldset textarea,
.demand-form form .message-fieldset label,
.demand-form form .message-fieldset textarea {
  width: 100%;
}
.contact-form form .message-fieldset textarea,
.demand-form form .message-fieldset textarea {
  min-height: 150px;
  resize: vertical;
  border-radius: 3px;
  border-color: #d8e6eb;
}
.contact-form form button,
.demand-form form button {
  background-color: #2ba4c5;
  color: #ffffff;
  padding: 1em 2em;
  border-radius: 3px;
  transition: all 0.3s ease-in-out;
  font-size: 16px;
  font-weight: 500;
  max-width: 300px;
  margin: auto;
}
.contact-form form button:hover,
.demand-form form button:hover {
  background-color: rgb(33.8625, 129.15, 155.1375);
}
.contact-form form #language_autre,
.demand-form form #language_autre {
  margin-top: 1em;
}
.contact-form h1,
.demand-form h1 {
  color: #2ba4c5;
  font-weight: 600;
  text-align: center;
}
.contact-form p,
.demand-form p {
  text-align: center;
}

.my-account-page .heading {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  grid-auto-flow: column;
  padding-bottom: 1em;
  margin-bottom: 1em;
  border-bottom: 1px solid #000;
}
.my-account-page .heading h1 {
  font-weight: 600;
}
.my-account-page .heading .logout-button {
  grid-row: span 2;
  background-color: #2ba4c5;
  color: #ffffff;
  padding: 1em 2em;
  border-radius: 3px;
  transition: all 0.3s ease-in-out;
  font-size: 16px;
  font-weight: 500;
  max-width: 300px;
  margin: auto;
  place-self: center;
}
.my-account-page .heading .logout-button:hover {
  background-color: rgb(33.8625, 129.15, 155.1375);
}
.my-account-page .messages-box,
.my-account-page .demand-box {
  background-color: #ffffff;
}
.my-account-page .messages-box .message,
.my-account-page .messages-box .demand,
.my-account-page .demand-box .message,
.my-account-page .demand-box .demand {
  border-radius: 3px;
  padding: 2em;
}
.my-account-page .messages-box .message::after,
.my-account-page .messages-box .demand::after,
.my-account-page .demand-box .message::after,
.my-account-page .demand-box .demand::after {
  width: 100%;
  left: 0;
  height: 1px;
  content: "";
  border-top: 1px solid #d8e6eb;
  position: absolute;
  margin: 1em 0;
}
.my-account-page .messages-box .message .date,
.my-account-page .messages-box .demand .date,
.my-account-page .demand-box .message .date,
.my-account-page .demand-box .demand .date {
  font-weight: 500;
  border-bottom: 1px solid #d8e6eb;
}
.my-account-page .messages-box .message .email,
.my-account-page .messages-box .demand .email,
.my-account-page .demand-box .message .email,
.my-account-page .demand-box .demand .email {
  margin-bottom: 2em;
  padding-top: 1em;
  font-weight: normal;
}
.my-account-page .tab {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.my-account-page .tab .tabitem {
  padding: 1em;
  cursor: pointer;
  text-align: center;
}
.my-account-page .tab .tabitem.active {
  background: #fff;
}

.dnone {
  display: none;
}