/* ===== Reset & basis ===== */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body,
h1, h2,h3,h4,h5,h6,
p,figure,blockquote,
ul,ol { margin: 0; }

ul,ol { padding: 0; }

/* ===== Personalize ===== */

body {
 font-family: Arial, sans-serif;
 margin: 0;
 padding: 0;
 color: #090a02;
 background: #fff;
}

header {
 background: #820e11;
 padding: 1em;
 text-align: center;
}

header h1 {
 margin-block-start: 0.67em;
 margin-block-end: 0.67em;
 color: #fff;
}

header a {
 text-decoration: none;
}

nav a {
 margin: 0 1em;
 text-decoration: none;
 color: #fff;
}

nav a:hover {
 text-decoration: underline;
 color: #f9faf2;
}

section {
 text-align: center;
}

.hero {
 color: #333;
 padding: 0.5em 2em;
}

.hero h1 {
 font-size: 2.5em;
}

.cta-button {
 background: #820e11;
 color: #fff;
 padding: 0.5em 1em;
 text-decoration: none;
 border-radius: 5px;
 margin-top: 1em;
 margin-bottom: 2em;
 display: inline-block;
}

.advantages {
 display: flex;
 justify-content: space-around;
 flex-wrap: wrap;
}

.advantages a {
 text-decoration: none;
 color: #000;
}

.advantages a.clean {
 text-decoration: none;
 color: #090a02;
}

.advantages a:hover {
 text-decoration: underline;
 color: #090a02;
}

.advantage {
 flex: 1;
 margin: 3em;
 margin-bottom: 0;
 text-align: left;
}

.advantage_left {
 flex: 1;
 margin: 3em;
 text-align: left;
}

.advantage_left img {
 max-width: 20%; 
 float: left;
}

.advantage_left p {
  margin-bottom: 1em;
}

.advantage_one_column {
 flex: 1;
 margin: 3em 15em;
 margin-bottom: 0;
 text-align: left;
}

.advantage_one_column ol {
 margin-left: 20em;
}

.advantage_one_column ul, ol {
 margin-left: 3em;
}

.advantage_one_column p {
  margin-bottom: 1em;
}

.advantage_one_column img {
 max-width: 20%; 
 float: left;
 margin-right: 2.5em;
}

.advantage_one_column img.left {
 max-width: 20%; 
 float: left;
 margin-right: 2.5em;
}

img.RHMLOGO {
 max-width: 3em;
}

.advantage_one_column img.right {
 max-width: 20%; 
 float: right;
 margin-left: 2.5em;
}

.quote {
 font-size: 1.2em;
 font-style: italic;
 font-weight: bold;
 color: #82926a;
}

.prijzen table {
 width: 70%;
 border-collapse: collapse;
 margin: 2.5em auto;
}

.prijzen table, th, td {
 border: 1px solid #ddd;
 padding: 0.5em;
 text-align: left;
}

.prijzen a {
 color: black; 
 text-decoration: none;
}

.prijzen a:hover {
 color: black; 
 text-decoration: underline;
}

.socials {
 margin-top: 2em;
}

footer {
 background: #820e11;
 padding: 1em;
 text-align: center;
 color: #fff;
}

.footer {
  padding: 0.5em;
}

.footer a {
 margin: 0 0.5em;
 text-decoration: none;
 color: #fff;
}

.footer a:hover {
 text-decoration: underline;
 color: #f9faf2;
}


@media (max-width: 768px) {
  .hero {
    padding: 5em 1em;
  }
 
  .advantages {
    flex-direction: column;
  }
}