/* Divided into - */
/* All Media */  
/* @media (min-width: 601px) */
/* @media (max-width: 600px) */

*,
::before,
::after {
  box-sizing: border-box;
}

html {
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    system-ui,
    Roboto,
    "Helvetica Neue",
    Arial,
    sans-serif,
    Apple Color Emoji,
    "Segoe UI Emoji",
    "Segoe UI Symbol",
    "Noto Color Emoji";
    overflow-wrap: break-word;
}

body {
  min-height: 100vh;
}

header {
  border-bottom: 0.5em solid var(--theme-dark-line-color);
}

.skip-link {
  position: absolute;
  top: -30px;
}

.skip-link:focus-visible {
  top: 5px;
}

h1.pagetitle {
  margin-top: 0;
}

h1.banner {
  font-size: 3em;
  margin: 0 auto 0 auto;
  color: var(--theme-main-font-color);
}
a.brand-logo {
  text-decoration: none;
}


.articletitle {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: 2rem;
  color: var(--theme-headline-font-color);
}

.articletitle a {
  text-decoration: none;
}

.article img {
  width: 60%;
  display:block;
  margin: 0 auto;
  text-align: center;
}


footer ul li img {
  height: 1.2em;
}

@media (min-width: 601px) {

  #main {
    display: flex;
  }

  .horizontalbar nav ul {
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
    list-style-type: none;
    list-style-position: unset;
  }

  .horizontalbar li.menuitem,
  .horizontalbar li.menuitem a {
    list-style-type: none;
    text-decoration: none;
    font-weight: 600;
    font-size: 1.2em;
    line-height: 2em;
    color: var(--theme-main-font-color);
  }


  #content {
    flex: 3 0 50%;
    order: 2;
  }
  .pagezone {
    display: flex;
    flex-wrap: wrap;
    max-width:100%;
    justify-content: center;
  }
  .article {
    padding-left:1em;
    padding-bottom: 1ex;
    border-bottom: 1px solid var(--theme-dark-line-color)
  }

  .article:first-child {
    padding-left:0;
  }

  .article.boldness_normal {
    width:60%;
  }

  .article.boldness_normal {
    width:40%;
  }

  .article.boldness_light {
    width:30%;
  }

  .singlearticle {
    width:80%;
    margin: 0 auto;
    padding-left:1em;
  }

  #leftsidebar {
    flex: 0 0 20%;
    width: 0;
    order: 1
  }
  #rightsidebar {
    flex: 0 0 20%;
    width: 0;
    order: 3;
  }
  footer {
    text-align:center;
  }
  footer li {
    list-style-type:none;
  }
  .disclaimer {
    max-width:60%;
    margin: 0 auto;
    border:1px solid black;
  }

}

@media (max-width: 600px) {

  #main {
    display:flex;
    flex-direction: column;
  }


  .horizontalbar nav ul {
    margin: 0 auto;
    list-style-type: none;
    list-style-position: unset;
  }

  .horizontalbar li.menuitem,
  .horizontalbar li.menuitem a {
    list-style-type: none;
    text-decoration: none;
    font-weight: 600;
    font-size: 1em;
    line-height: 1.2em;
    color: var(--theme-main-font-color);
    margin: 0 auto;
  }


  #content {
    order: -1;
  }

  #leftsidebar {
    order: 1;
  }
  #rightsidebar {
    order 2;
  }

  .article {
    padding-bottom: 1ex;
    border-bottom: 1px solid var(--theme-dark-line-color)
  }

  .disclaimer {
    max-width:60%;
    margin: 0 auto;
    border:1px solid black;
  }

  footer li {
    list-style-type: none;
  }
}
