* {
  padding: 0;
  margin: 0;
  font-family: "MarkWeb", 'Helvetica', sans-serif;
}

html, body {
  background-color: black;
  width: 100%;
  height: 100%;
}

.section {
  width: 100%;
  height: auto;
  text-align: center;
  padding: 60px 0;
}

.section p {
  text-align: justify;
}

.section.odd {
  background-color: #99d1a5;
  color: black;
}

.section.even {
  background-color: white;
  color: black;
  
}

.section .content {
  width: 95%;
  padding-top: 20px;
  padding-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6;
}

.legal {
  font-size: 11pt;
}

a.legal {
  font-style: italic;
  text-decoration: none;
  text-decoration-line: none;
}

.lang {
  position: absolute;
  top: 10px;
  right: 20px;
}

#header {
  position: relative;
  height: 100%;
}

#header h1 {
  font-size: 30pt;
  margin-top: auto;
  margin-bottom: auto;
}

#header h2 {
  margin-top: 20px;
  font-size: 15pt;
}

#header .content {
  position: absolute;
  margin-top: auto;
  margin-bottom: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  line-height: 1.6;
}

#picture {
  position: relative;
  display: block;
  padding: 20px;
  height: 200px;
  width: 200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 150px;
  margin-bottom: 20px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.25);
}

#main .content {
  max-width: 900px;
}

#main p {
  padding: 10px;
}

#main a {
  color: inherit;
}

#contact .content {
  text-align: center;
}

#contact p {
  padding: 20px;
  text-align: center;
  width: auto;
  margin-left: auto;
  margin-right: auto;
  max-width: auto;
}

#contact a {
  color: inherit;
}


.info-card {
  background: linear-gradient(135deg, #99d1a5, #86bd92);
  border-radius: 16px;
  padding: 25px;
  margin: 40px 0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
  text-align: left;
  line-height: 1.6;
}

.info-card h1 {
  margin-bottom: 15px;
  font-size: 24pt;
  text-align: center;
}

.info-card ul,
.info-card ol {
  margin: 15px 0 0 0;
  padding-left: 20px;
}

.info-card li {
  margin-bottom: 10px;
  line-height: 1.4;
  font-size: 12.5pt
}

/* Table for features */
table {
  border-collapse: separate;
  width: 100%;
  max-width: 800px;
  table-layout: fixed;
  border-radius: 5px;
  overflow: hidden;
  font-family: Arial, sans-serif;
  margin: 0 auto;
}

th, td {
  border: 1px solid #aeb1b5bb;
  padding: 12px;
  text-align: center;
  width: 50%;
  transition: background-color 0.2s ease;
}

tbody td:hover {
  background-color: #5b615e38;
}


tr:first-child th {
  background-color: #b1e9bd;
  font-weight: bold;
  font-size: 1.1em;
}

td:first-child {
  background-color: white;
  text-align: left;
}

tr:first-child th:first-child {
  border-top-left-radius: 10px;
}

tr:first-child th:last-child {
  border-top-right-radius: 10px;
}

td ul.features {
  list-style: none;
  padding-left: 0;
  margin: 0;
  text-align: left;
}

td ul.features li {
  margin-bottom: 6px;
  line-height: 1.4;
  
}

/* Häkchen (default) */
td ul.features li::before {
  margin-right: 8px;
  content: "✔";
  color: #2e8b57;
}

/* x */
td ul.features li.excluded::before {
  content: "✖";
  color: #d9534f; /* rot */
}

.appLegal {
  text-align: left;
}

.appLegal ul {
  list-style-position: inside;
  padding-left: 10px;
}

.appLegal h2 {
  padding-top: 20px;
}

.appLegal h3 {
  padding-top: 10px;
}

.appLegal #status {
  padding: 30px 0 0 0;
}

.appLegal .homepage {
  margin-top: 10px;
  display: inline-block;
}