/**
 * @file
 * Bartik layout styling.
 */

/**
 * Container
 */
.layout-container {
  box-sizing: border-box;
  max-width: 860px;
  margin-right: auto;
  margin-left: auto;
}

@media all and (min-width: 851px) {
  .layout-container {
    max-width: 1290px;
  }
}

/**
 * Main
 */
.layout-main-wrapper {
  min-height: 300px;
}
.layout-main {
  margin-top: 20px;
  margin-bottom: 40px;
}

/* the following settings added, KCTang 18/12/2021 */

@media all and (min-width: 851px) {
  .layout-container {
    max-width: 1920px;
  }
}

/* the following settings added, KCTang 21/9/2024 */

mark.marker-blue {
  background-color: hsl(201, 97%, 72%);
}
mark.marker-green {
  background-color: hsl(120, 93%, 68%);
}
mark.marker-pink {
  background-color: hsl(345, 96%, 73%);
}
mark.marker-yellow {
  background-color: hsl(60, 97%, 73%);
}
mark.pen-blue {
  background-color: inherit;
  color: hsl(201, 97%, 72%);
}
mark.pen-green {
  background-color: inherit;
  color: hsl(112, 100%, 27%);
}
mark.pen-red {
  background-color: inherit;
  color: hsl(0, 85%, 49%);
}