:root {
  --purple-color: #782484;
  --orange-color: #e84806;
  --grey-color: #514a46;
  --generic-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans",
  "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.text-orange, .link:hover {
    color: var(--orange-color) !important;
}

.text-purple {
    color: var(--purple-color);
}

#label_consent, #label_all_thematics, #description, h2, label[for^="id_thematics_choice_"] {
    color: var(--grey-color);
}

#label_consent {
    display: inline !important;
    font-size: 0.8rem;
}

label[for=id_thematics_choice_0], #description, .link:hover {
    font-weight: bold;
}

#id_email {
    margin-bottom: 30px !important;
}

.text-purple {
    color: var(--purple-color) !important;
}

.btn-valid-modale {
  background-color: #dcdcdc;
}

label[class*="field-label"] {
  font-size: 1.2em;
  margin-bottom: 10px;
}

label[for^="id_thematics_choice_"], #label-all_thematics {
  font-size: 1rem;
}

#description, h2, label[for^="id_thematics_choice_"] {
   font-family: var(--generic-font-family);
}

#letter_image {
   width: 90px;
   height: auto;
   margin: auto;
}

#id_thematics_choice {
    margin-bottom: 25px;
}

li[class^="error_"], .error, .errorlist {
    font-size: 0.9em;
    color: red;
}

.success {
    color: green;
}

nav {
    padding-left: 16px;
    padding-right: 16px;
}

.navbar-text {
    font-size: 1em;
    display: inline-block;
    padding-top: .5rem;
    padding-bottom: .5rem;
    text-decoration: none;
    font-family: var(--generic-font-family);
}

h2 {
    color: var(--orange-color);
    font-weight: bold;
}

form {
    border-top: solid var(--purple-color);
    border-bottom: solid var(--purple-color);
}

.onysos-btn {
    color: var(--orange-color);
    padding: 3px 6px 0;
    border: thin solid;
    text-transform: uppercase;
    font-size: .8em;
}

a {
    text-decoration: none;
}

#unsubscribe-section {
    min-height: 45vh;
}

footer > nav > div > a:hover {
    text-decoration: underline;
}