body {
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 overflow-y: scroll;
 color: white;
}

table {
  overflow: hidden;
  border-radius: 1rem;
  border: 0px solid transparent;
  box-shadow: 0 1rem 1rem #000000dd
}

table td {
  background: #333;
}

b {
  color: #F3114E;
}

h1 {
  color: #f3114e;
  text-shadow: 0 4px 0px #000;
}
h2 {
  color: #f3114e;
  font-size: 300%;
  text-shadow: 0 4px 0px #000;
}
span {
  background: transparent !important;  
}

span font {
  color: #DDD;
}
span font a:link {
  color: #f3114e;
}
span font a:visited {
  color: #f3114e;
}

/* Style the tab */
.tab {
    background: #333;
    border: 0px solid transparent;
    border-bottom: 1px solid #f3114e;
}

/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
  animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

/* custom tab-stuffz */

.tab {
    background: #333;
    border: 0px solid transparent;
    border-bottom: 1px solid #f3114e;
}

.tabcontent {
    border: 1px solid transparent;
}

.tabcontent b, p b {
    color: #f3114e;
    text-shadow: 0px 2px 0px #00000088;
}

.tab button.active {
    background-color: #f3114e;
}
.tab button:hover {
    color: #000;
}
.tab button {
    color: #FFF;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
}

.tabcontent img {
    display: block;

    display: block;
    box-shadow: 0 .5rem 1rem #00000088;
    border-radius: .5rem;
}

.countdown-section {
  margin: 1.5rem 0;
}
.label {
  margin-bottom: 0.5rem;
  font-weight: bold;
  color: #121212;
}
.bar {
  display: grid;
  grid-template-columns: repeat(30, 12px);
  gap: 4px;
  justify-content: center;
}
.square {
  width: 12px;
  height: 12px;
  background: #f3114e;
  border-radius: 2px;
  transition:
    opacity 0.4s ease,
    transform 0.4s ease;
  transform: scale(1);
}
.square.inactive {
  opacity: 0.1;
  transform: scale(0.6);
}

/* Nytt för att göra countdown-text och siffror vita */
.countdown > .part > .text {
  color: white !important;
}

.countdown > .part > .number {
  color: white !important;
}

#countdown .label span {
  color: white;
}

#countdown .label {
  color: white;
}