.header {
  margin-left: -1.0em;
  margin-top: -0.75em;
}

.title {
  margin-left: -0.7em;
}

.carousel {
  outline: none;
  margin-top: 0.75em;
  width: 100%;
}

button:focus {
  --plasma-colors-button-focused: white;
}

div:focus {
  --plasma-colors-button-focused: white;
}

.buttonImage {
  margin-top: '10%';
  display: 'flex';
  flex-direction: 'column';
  justify-content: 'center';
}

.oneLineText {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/* Fallback stuff */
progress[value] {
  appearance: none;
  border: none;
  border-radius: 3px;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.25) inset;
  color: dodgerblue;
  display: inline;
  height: 10px;
  order: 1;
  position: relative;
  width: 100%;
}

/* WebKit styles */
progress[value]::-webkit-progress-bar {
  background-color: gray;
  border-radius: 100px;
  height: '10mm';
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.25) inset;
}

progress[value]::-webkit-progress-value {
  background-image: linear-gradient(to right, whiteSmoke, whiteSmoke);
  border-radius: 3px;
  position: relative;
/*   transition: width 1s linear; */
}

.multiLineText {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 8; /* number of lines to show */
           line-clamp: 8;
   -webkit-box-orient: vertical;
}

.trainingProgress {
  height: 0.2em;
  position: absolute;
  bottom: 23%;
  left: 0;
}

.trainingCard {
  text-align: center;
}

.trainingCard img {
  width: 120%;
  margin: 0 -10%;
}