@charset "UTF-8";
/* Contains basic variable colors and fonts */
/* 
	Media query breakpoint mixins
*/
/* 
	General structure and layout of the page.
	Should style everything except the content,
	including the color and fonts of all areas
	outside the main content area.
*/
* {
  margin: 0;
  padding: 0; }

body {
  background: linear-gradient(#1d3057 15%, #30559C 55%, #bcdaf3);
  font-family: arial, sans-serif;
  color: #1d3057;
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-end;
  min-height: 100vh; }

#wrapper {
  max-width: 1080px;
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  height: 100vh;
  margin: 0 auto;
  padding: 0 50px; }
  @media only screen and (max-width: 600px) {
    #wrapper {
      padding: 0 10px; } }
  @media only screen and (max-height: 500px) {
    #wrapper {
      padding: 0 10px; } }
header {
  width: 100%;
  display: flex;
  align-items: center;
  flex-flow: column nowrap; }
  @media only screen and (max-height: 500px) {
    header {
      flex-flow: row-reverse nowrap;
      justify-content: flex-end; } }
  header #logo {
    background: url("../img/Logo.png");
    background-size: cover;
    height: 80px;
    width: 252px;
    margin: 30px 30px 0 30px; }
    @media only screen and (max-height: 500px) {
      header #logo {
        height: 40px;
        width: 126px;
        margin: 5px; } }
  header .sidebar-button {
    padding: 10px;
    font-size: 2rem;
    align-self: flex-start; }
    header .sidebar-button a {
      text-decoration: none;
      color: white; }
    @media only screen and (min-width: 900px) {
      header .sidebar-button {
        display: none; } }
  @media only screen and (min-width: 900px) {
    header {
      padding-bottom: 30px;
      align-items: flex-start; } }
  header .homelink {
    text-decoration: none;
    font-size: 4rem;
    margin-left: 16px;
    text-transform: uppercase;
    font-family: arial, sans-serif; }
    @media only screen and (max-width: 899px) {
      header .homelink {
        font-size: 48px; } }
    @media only screen and (max-width: 600px) {
      header .homelink {
        font-size: 11vw; } }
    @media only screen and (max-width: 600px) {
      header .homelink .hideable {
        display: inline-block; } }
    header .homelink:hover .hideable {
      display: inline; }

@media only screen and (min-width: 900px) {
  .main-wrapper {
    display: flex;
    flex-flow: row nowrap; } }

nav {
  font-size: 1.5rem;
  flex-flow: column nowrap;
  color: #1d3057;
  display: flex; }
  @media only screen and (max-width: 600px) {
    nav {
      width: 100%; } }
  @media only screen and (min-width: 900px) {
    nav {
      margin-right: 10px; } }
  nav .site-navigation {
    width: 100%;
    max-width: calc(100vw - 100px);
    height: calc(100vh - 210px);
    top: -150vh;
    flex-flow: column nowrap;
    justify-content: space-around;
    background: rgba(188, 218, 243, 0.9);
    display: flex;
    visibility: hidden;
    position: absolute;
    transition: top 200ms ease-in-out; }
    @media only screen and (max-width: 600px) {
      nav .site-navigation {
        max-width: calc(100vw - 20px);
        height: calc(100vh - 160px); } }
    @media only screen and (min-width: 900px) {
      nav .site-navigation {
        width: 200px;
        top: 0;
        position: unset;
        height: calc(100vh - 220px);
        visibility: visible;
        font-size: 1rem;
        justify-content: flex-start;
        background: linear-gradient(#bcdaf3 55%, white 90%); } }
    @media only screen and (max-height: 500px) {
      nav .site-navigation {
        height: calc(100vh - 60px);
        max-width: calc(100vw - 20px);
        font-size: 1rem; } }
    nav .site-navigation:target {
      visibility: visible;
      top: 165px;
      transition: top 200ms ease-in-out; }
      @media only screen and (max-height: 500px) {
        nav .site-navigation:target {
          top: 55px; } }
    nav .site-navigation .close {
      display: inline-block;
      position: absolute;
      text-decoration: none;
      top: -45px;
      left: 10px;
      font-size: 2rem;
      z-index: 9999;
      color: #f68c1e; }
      @media only screen and (min-width: 900px) {
        nav .site-navigation .close {
          display: none; } }
    nav .site-navigation > li {
      flex-grow: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      border-bottom: 3px solid white; }
      nav .site-navigation > li:hover ul.nav-links {
        visibility: initial; }
      @media only screen and (min-width: 900px) {
        nav .site-navigation > li {
          flex-grow: 0;
          background: #bcdaf3;
          border-bottom: 3px solid white; }
          nav .site-navigation > li:hover {
            background: #f68c1e; }
            nav .site-navigation > li:hover a {
              color: white; } }
      @media only screen and (max-height: 500px) {
        nav .site-navigation > li {
          border-bottom: 1px solid white; } }
      nav .site-navigation > li a {
        text-decoration: none;
        color: #1d3057;
        font-weight: bold;
        text-align: center; }
        @media only screen and (min-width: 900px) {
          nav .site-navigation > li a {
            padding: 10px 0;
            display: block;
            width: 100%;
            height: calc(100% - 20px); } }
        nav .site-navigation > li a:hover {
          color: #f68c1e; }
          @media only screen and (min-width: 900px) {
            nav .site-navigation > li a:hover {
              color: white; } }
    nav .site-navigation > li:last-child {
      border-bottom: none; }
      @media only screen and (min-width: 900px) {
        nav .site-navigation > li:last-child {
          border-bottom: 3px solid white; } }
main {
  background: linear-gradient(rgba(255, 255, 255, 0), white 15%), url("../img/background.jpg"), white;
  background-attachment: local;
  flex: auto;
  padding-top: 25px;
  margin-bottom: 50px;
  height: calc(100vh - 245px);
  display: flex;
  font-size: 12px;
  justify-content: space-between;
  flex-flow: column nowrap; }
  @media only screen and (max-width: 600px) {
    main {
      margin-bottom: 10px;
      height: calc(100vh - 200px); } }
  @media only screen and (max-height: 500px) {
    main {
      margin-bottom: 10px;
      height: calc(100vh - 95px); } }
  main #text-body {
    overflow-y: auto;
    padding: 24px; }
  main #text-body:only-child {
    max-width: 100%; }
  main footer {
    color: white;
    background-color: #1d3057;
    width: calc(100% - 40px);
    padding: 20px;
    display: none; }
    main footer a {
      color: white;
      text-decoration: none; }
      main footer a:hover {
        color: #f68c1e; }
    main footer .jargon {
      width: 160px;
      height: 70px;
      background-image: url("../img/JargonLogo.png");
      background-size: cover;
      margin-top: 5px;
      display: block; }
      main footer .jargon a {
        display: block;
        height: 100%;
        width: 100%;
        color: transparent; }
        @media only screen and (max-width: 600px) {
          main footer .jargon a {
            color: white; } }
        @media only screen and (max-width: 600px) {
          main footer .jargon a:hover {
            color: red; } }
      @media only screen and (max-width: 600px) {
        main footer .jargon {
          background-image: none;
          height: unset;
          width: unset;
          display: inline-block; } }
    main footer .info {
      text-transform: uppercase; }
    main footer .square {
      display: inline-block;
      height: 10px;
      width: 10px;
      background: red; }
  main.footer footer {
    display: block; }

main {
  /*
	General content definitions.
	Contains everything for inside the main content area
	To be included inside a main block
*/ }
  main h1, main h2, main h3, main h4, main h5, main h6 {
    font-weight: bold;
    line-height: 1;
    color: #1d3057;
    font-family: arial, sans-serif;
    margin: 15px 0 0 0; }
  main h1 {
    font-size: 18px; }
  main ul, main li {
    list-style-type: disc; }
  main ul {
    margin-left: 1em; }
  main li {
    margin-bottom: 3px; }
  main li:last-child {
    margin-bottom: 0; }
  main p + ul {
    margin-top: -0.8em; }
  main a {
    text-decoration: none;
    color: #f68c1e; }
    main a.button {
      border-radius: 12px;
      background: #f68c1e;
      font-weight: bold;
      color: white;
      padding: 1px 6px; }
      main a.button:hover {
        color: white;
        background: #1d3057; }
    main a.mail {
      padding-left: 25px;
      background: url("../img/envelop.png");
      background-repeat: no-repeat;
      background-size: contain; }
    main a:hover {
      color: black; }
  main p {
    line-height: 1.5;
    margin: 3px 0 15px 0; }
  main table {
    border-collapse: collapse;
    border: 1px solid #1d3057; }
    main table th {
      background: #bcdaf3; }
    main table th, main table td {
      border: 1px solid #1d3057;
      text-align: center;
      padding: 5px;
      max-width: 150px; }
      @media only screen and (max-width: 600px) {
        main table th, main table td {
          padding: 2px; } }
    main table td {
      background: white; }
  main .two-columns {
    display: flex;
    flex-flow: row wrap; }
    main .two-columns > * {
      padding-left: 10px;
      flex-basis: calc(50% - 10px); }
      @media only screen and (max-width: 600px) {
        main .two-columns > * {
          flex-basis: 100%;
          padding-left: 0; } }
    main .two-columns > *:first-child {
      padding-left: 0; }
  main input, main textarea {
    padding: 5px;
    margin: 0px;
    font-size: 12px;
    font-family: arial, sans-serif;
    width: 250px;
    border: none;
    border-bottom: 1px solid #bcdaf3; }
  main textarea {
    resize: vertical; }
  main input[type=submit] {
    background: #f68c1e;
    color: white;
    padding: 7px;
    font-weight: bold;
    border: none;
    border-radius: 12px; }
  main form {
    padding: 15px 0; }

.collapse {
  user-select: none;
  cursor: pointer; }

.collapse + * {
  overflow: hidden;
  margin-bottom: 10px; }

.collapse:not(.open) + * {
  max-height: 0;
  display: none; }

.collapse.open + * {
  max-height: 999px;
  padding-left: 10px;
  border-left: 2px solid #f68c1e; }

.collapse.open::before {
  content: '⯆'; }

.collapse:not(.open)::before {
  content: '⯈'; }

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE10+ CSS styles go here */
  nav .site-navigation {
    position: relative !important; }
  #wrapper {
    overflow: hidden; }
  .main-wrapper {
    width: 100%; }
  main {
    width: 100%; } }