* {
  margin: 0;
  padding: 0;
  box-sizing:border-box;
}
html {
  font-size:8px;
}
body {
  font-size:1.8rem;
  background:#000000;
  color:rgb(237, 209, 255);
  color:rgb(205, 204, 205)
}
h1 {
  font-size: 2rem;
}
h2 {
  font-size: 2rem;
}
h3 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.8rem;
}
p {
  font-family: Arial, Helvetica, sans-serif;
  margin-bottom:0.5rem;
}
a {
  font-family: Arial, Helvetica, sans-serif;
  margin-bottom:0.5rem;
  color:rgb(248, 62, 205);
  color:rgb(162, 31, 255)
}

ul {
  padding-left: 1.8rem;
}

header {
  width:100%;
  height:20rem;    /* OBS! sätt ev fast höjd - kan bli konstigt annars 25vh el 225px */
  display:fixed;
  width: max-content; 
  justify-content: center;
  align-items:center;
  background-color:black;
  object-fit: cover;

}
header img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: 0 0;
}
main{
  margin:auto;
  width:100%;
  display:flex;
  flex-wrap: wrap;                  /* default nowrap gör att items width ignoreras */
  justify-content: flex-start;    /* flex-start, center, flex-end, space-between, space-around, space-evenly */
  align-items:flex-start;             /* flex-start, center, flex-end, baseline (bara om olika fonter) */
}
nav {
  width:100%;
  height:4rem;    /* OBS! sätt ev fast höjd - kan bli konstigt annars 25vh el 225px */
  display:flex;
  flex-wrap: wrap;
  justify-content:center;
  align-items:center;
  background:rgb(0, 0, 0);
}
nav a {
  background:rgb(130, 70, 130);
  font-size: 2rem;
  padding: 0.5rem 3.0rem 0.5rem 3.0rem;
  color:white;
  text-decoration: none;
}
nav a:hover {
  color:#ffa080;
}
section{
  width:90%;
  padding: 0rem 0rem 1rem 0rem;
  display:flex;
  flex-wrap: wrap;                  /* default nowrap gör att items width ignoreras */
  justify-content:space-between;    /* flex-start, center, flex-end, space-between, space-around, space-evenly */
  align-items:flex-start;             /* flex-start, center, flex-end, baseline (bara om olika fonter) */
}

.card{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  font-family: Arial, Helvetica, sans-serif;
  background:rgb(0, 0, 0);
  padding: 0rem 0rem 0rem 0rem;
  border-radius: 2px;
  margin-top:0rem;
}

.table1 {
  table-layout:fixed;
  width: max-content; 
  border-collapse: separate;   /* använd separate isf collapse om olika cell-klasser ska använda padding */
  padding:0px;
}
thead {
  padding: 0rem 0 0rem 0;
}
.table1 th {
  background:rgb(100, 1, 161);
  padding: 0.5rem 1.0rem 0.5rem 0.5rem;
}
.table1 td {
  border-top:1px solid #810b9c;
  padding: 0rem 0.5rem 0rem 0.5rem;
}
/* padding behöver göras på cellnivå för att funka för sista radens summa */
.tdl {
  text-align: left;
}
.tdr {
  text-align: right;
}