* {
  margin: 0;
  padding: 0;
}

:root {
  --padding: 1.5rem;
  --color-black:      #333300;
  --color-white:      rgb(238, 238, 238);
  --color-ultrawhite: #FFFFFF;
  --color-code-red:   #ff00ff;
  --color-code-blue:  blue;
  --color-code-green: green;
  --color-text: var(--color-black);
  --stroke: 1rem solid;
  --stroke-md: .5rem solid;
  --stroke-xs: .2rem solid;
  --stroke-xxs: .1rem solid;
  --stroke-no: 0rem solid;
  --font-family-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --font-family-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
  --border: var(--stroke) var(--color-black);

}
.foot {
  background: var(--color-white);
  border-top: var(--stroke) var(--color-black);
  padding-top: 0.5rem;
}
html {
  font-family: var(--font-family-sans);
  font-size: 115%;
  color: var(--color-text);
  background: var(--color-white);
  scroll-behavior: smooth;
  padding-left: 10%;
  padding-right: 10%;
}

body {
  padding: var(--padding);
  padding-top: 1rem;
  max-width: 70rem;
  margin: 0 auto;
}

.honeypot {
    position: absolute;
    left: -9999px;
}
.ishidden {
    display: none !important;
}
@media screen and (max-width: 599px) {
    .hide-xs {
        display: none !important;
    }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
    .hide-sm {
        display: none !important;
    }
}
@media screen and (min-width: 900px) and (max-width: 1199px) {
    .hide-md {
        display: none !important;
    }
}
@media screen and (min-width: 1200px) {
    .hide-lg {
        display: none !important;
    }
}

main {
  min-height: calc(100vh - 50vh);
}


.modul {
  border-radius: .5rem;
  padding: 1rem;
  padding-bottom: .5rem;
  background-color: var(--color-ultrawhite);
  margin-bottom: 1rem !important;
}

strong, b {
  font-weight: 600;
}

.none {
  margin-bottom: -1rem;
}
.strokexxs {
  border-bottom: var(--stroke-xxs);
}
.nonetop {
 margin-top: -0.5rem;
}

.free {
  padding: 0;
}

.text {
  line-height: 1.5em;
}

.text :first-child {
  margin-top: 0;
}
.text :last-child {
  margin-bottom: 0;
}
.text p,
.text ul,
.text ol {
  margin-bottom: .5rem;
}
.text ul,
.text ol {
  margin-left: 0rem;
}

.text ul p,
.text ol p {
  margin-bottom: 0;
}
.text ul > li {
  list-style: none;
}

.text ul > li a {
  text-decoration: none;
}
li {
  list-style: none;
}
.section {
  padding: 3rem 0;
}
.espace {
  padding-top: 1rem;
}

.tags {
  display: flex;
  margin-bottom: .5rem;
  margin-top: 1rem;
}
.tags li {
  margin-right: .5rem;
}
.tags a {
  display: block;
  color: var(--color-code-blue);
}
.tags a:hover {
  color: var(--color-code-red);
}


.grid {
  --columns: 12;
  --gutter: 1.5rem;
  display: grid;
  grid-gap: var(--gutter);
  grid-template-columns: 1fr;
}
.grid > .column {
  margin-bottom: var(--gutter);
}
.autogrid {
  --gutter: 1.5rem;
  --min: 10rem;
  display: grid;
  grid-gap: var(--gutter);
  grid-template-columns: repeat(auto-fit, minmax(var(--min), 1fr));
  grid-auto-flow: dense;
}

header {
  padding-bottom: 1.5rem;
}

@media (min-width: 769px) {
	header {
    margin-bottom: 3rem;
  }
}

nav {
  padding-bottom: 0rem;
}

.prevnext {
  display: flex;
  justify-content: space-between;
  margin-bottom: -2rem !important;
}

/* elements------------------ */

img {
  width: 100%;
  height: auto;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.separateur {
    border-bottom: var(--stroke-xs) var(--color-black);
    margin-bottom: 1rem;
}
.separateurxxs {
  border-bottom: var(--stroke-xxs) var(--color-black);
  margin-bottom: 1rem;
}

.separateur .separateurxxs > p {
  font-size: 80%;
}

.separateur .separateurxxs > p:last-child {
  margin-bottom: 1rem;
  /* color: red; */
}

.separateur .separateurxxs > ul:last-child {
    font-size: 80%;
      margin-bottom: 1rem;
}

.separateur:last-child {
  border-bottom: 0rem solid var(--color-black);
}

.separateurxxs:last-child {
  border-bottom: 0rem solid var(--color-black);
}

/* .image_article {
    max-width: 100%;
    height: auto;
  display:block;
} */



/* Footer */

#ascenseur {
padding-bottom: 0rem;
}

.text-footer {
  padding-bottom: 0rem;
}

.foot {
  border-top: var(--stroke-xs) var(--color-black);
  padding-top: 1rem;
}

/* Form */
.form-element {
  margin-bottom: 1rem;
}
.form-element label {
  display: block;
  padding: 0 0 .75rem;
  line-height: 1.25rem;
}
.form-element input,
.form-element textarea {
  -webkit-appearance: none;
  width: calc(100% - 1rem);
  border: 1px solid var(--color-black);
  background: none;
  font: inherit;
  color: inherit;
  padding: .5rem;
  line-height: 1.25rem;
  border-radius: .2rem;

}

.form-element-demi input,
.form-element-demi textarea {
  width: 30%;
}

.alert {
  width: 22.5rem;
  margin: 1.5rem auto;
  color: var(--color-style-red);
}

.alert ul li {
  list-style: disc;
  margin-bottom: 0.5rem;
}

.alert a {
  text-decoration: underline;
}
input[type=submit] {
  font: inherit;
  font-weight: 500;
  border-radius: 1rem;
  background-color: var(--color-code-blue);
  border: var(--nostroke) var(--color-code-blue);;
  color: var(--color-white);
  padding: .5rem;
  text-decoration: none;
  line-height: 1;
  margin-top: .5rem !important;
  margin-bottom: .5rem !important;
  cursor: pointer;
}
input[type=submit]:hover {
  border: var(--nostroke) var(--color-code-red);
  background-color: var(--color-white);
  cursor: pointer;
}