/* Bootstrap 4.5 CSS - to be included via CDN */

/* Custom Variables */
:root {
  --dark: #343a40;
}

/* Custom Fonts */
@font-face {
  font-family: Calibri;
  src: url('/calibri.ttf');
}

@font-face {
  font-family: Calibri;
  src: url('/calibrib.ttf');
  font-weight: bold;
}

/* Base Styles */
body {
  background-color: #343a40;
}

body#switcher {
  background-color: #6d6e70 !important;
  font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
  margin-bottom: 200px;
}

body#switcher footer {
  background-color: #6d6e70 !important;
}

a {
  color: white;
}

.hidden {
  display: none !important;
}

.alert a {
  color: blue;
}

/* Page Layout */
#page {
  width: 90%;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 90px;
}

@media (max-width: 767.98px) {
  #page {
    width: 100%;
  }
}

#page.full_page {
  max-width: 100%;
  width: 100%;
}

.card a {
  color: white !important;
}

.home-columns {
  column-count: 2;
}

.text-large {
  font-size: 2em;
}

/* Navigation */
.navbar {
  margin-bottom: 10px;
  padding: 0.5rem 1rem;
  background-color: #6d6e70 !important;
}

.navbar .navbar-nav .nav-link {
  color: white;
}

/* Logo Styles */
.logo img {
  max-height: 45px;
}

.logo-big img {
  max-height: 120px;
}

.main_logo {
  text-align: center;
}

.main_logo img {
  max-width: 150px;
}

/* Button Strip */
.button-strip ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.button-strip ul li {
  display: list-item;
}

.button-strip ul li a {
  display: block;
  padding: 0.5rem 1rem;
  color: white;
  text-decoration: none;
  background-color: transparent;
  border: 0;
}

.button-strip ul li a:hover {
  color: lightblue;
}

/* Button styled as link (for button_to replacing link_to with method:) */
.link-button {
  display: inline;
  padding: 0;
  color: white;
  text-decoration: none;
  background-color: transparent;
  border: 0;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
}

.link-button:hover {
  color: lightblue;
}

.button-strip ul li form {
  display: inline;
}

.button-strip ul li .link-button {
  display: block;
  padding: 0.5rem 1rem;
}

/* Switcher Component */
.switcher {
  width: 100%;
}

.switcher a {
  flex: 1 1 200px;
  padding: 25px;
  text-align: center;
  color: white;
  text-decoration: none;
  display: flex;
}

.switcher a .switch_link {
  flex: 1 1 auto;
  vertical-align: middle;
  justify-self: center;
  align-self: center;
}

.switcher a .switch_link img {
  width: auto;
  max-width: 100%;
  max-height: 300px;
}

.switcher a:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

/* Column Layout */
@media (min-width: 992px) {
  .cols-2 {
    display: flex;
    flex-wrap: wrap;
    flex: 0 0 50%;
  }

  .cols-2 .column {
    width: 50%;
    padding: 10px;
  }
}

/* Mobile Styles */
@media (max-width: 767.98px) {
  body#switcher footer {
    position: static;
  }

  body#switcher {
    margin-bottom: 0 !important;
  }
}