:root {
  --inception-button-border-radius: 72px;
  --inception-button-primary-background: #79c4f2;
  --inception-button-primary-background-hover: #264f73;
  --inception-button-primary-border: #79c4f2;
  --inception-button-primary-border-hover: #264f73;
  --inception-button-primary-color: #ffffff;
  --inception-button-primary-color-hover: #ffffff;
  --inception-general-base: #f46e1d;
  --inception-general-base-active: #79c4f2;
  --inception-general-base-color: #ffffff;
  --inception-general-base-color-active: #ffffff;
  --inception-general-base-color-hover: #ffffff;
  --inception-general-base-hover: #264f73;
  --inception-general-font-family: 'Open Sans', sans-serif;
  --inception-general-font-size: 10pt;
  --inception-general-link-color: #f46e1d;
  --inception-general-link-color-hover: #264f73;
  --inception-header-background: #3c3c3b;
  --inception-header-boxshadow: 0 0 10px rgba(0, 0, 0, 0.5);
  --inception-header-desktop-width: 1600px;
  --inception-header-height: 92px;
  --inception-header-logo: url('../images/inception-inv.svg');
  --inception-header-logo-icon: url('../images/inception-icon-inv.svg');
  --inception-header-menu-background-active: #f46e1d;
  --inception-header-menu-color: #ffffff;
  --inception-header-menu-color-active: #ffffff;
  --inception-header-menu-color-hover: #f46e1d;
  --inception-header-menu-font-size: 12pt;
  --inception-header-menu-font-weight: 400;
  --inception-header-search-background: #79c4f2;
  --inception-header-search-color: #ffffff;
  --inception-header-tablet-width: 1200px;
  --inception-main-homepage-background: url('../images/inception/background_logo.jpg') no-repeat center top/cover;
  --inception-panelbar-background: #ffffff;
  --inception-panelbar-border-color: transparent;
  --inception-panelbar-border-radius: 32px;
  --inception-panelbar-border-width: 0;
  --inception-panelbar-content-color: #000000;
  --inception-panelbar-header-background-hover: #f46e1d;
  --inception-panelbar-header-color: #000000;
  --inception-panelbar-header-color-hover: #ffffff;
  --inception-panelbar-padding: 8px;
  --inception-webpart-search-border-radius: 32px;
  --inception-webpart-search-font-size: 12pt;
  --inception-webpart-search-padding: 16px 32px 16px 16px;
}

/* For debugging PDF converter */
@font-face {
  font-family: 'Tolkien';
  src: url('../css/fonts/Tolkien.woff2') format('woff2'),
  url('../css/fonts/Tolkien.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.inception-content-with-sidebars {
  display: grid;
  grid-template-areas:
        'main-content'
        'left-sidebar'
        'right-sidebar';
  /* fallback height */
  min-height: 100vh;
  /* new small viewport height for modern browsers */
  min-height: 100svh;
}

.inception-content-with-sidebars > * {
  padding: 2rem;
}

.inception-content-with-sidebars > .inception-main-content {
  grid-area: main-content;
}

.inception-content-with-sidebars > .inception-left-sidebar {
  grid-area: left-sidebar;
}

.inception-content-with-sidebars > .inception-right-sidebar {
  grid-area: right-sidebar;
}

/* tablet breakpoint */
@media (min-width: 768px) {
  .inception-content-with-sidebars {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
            'main-content main-content'
            'left-sidebar right-sidebar';
  }
}

/* desktop breakpoint */
@media (min-width: 1280px) {
  .inception-content-with-sidebars {
    grid-template-columns: 24rem 1fr 24rem;
    grid-template-areas:
            'left-sidebar main-content right-sidebar';
  }
}

.inception-title {
  margin-bottom: 1rem;
  color: #f46e1d;
  text-align: center;
  font-size: 1.5rem;
  font-family: var(--inception-general-font-family);
}

.inception-button-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  grid-auto-rows: minmax(8rem, auto);
  grid-gap: 2rem;
  padding: 0;
  list-style: none;
  margin-bottom: 4rem;
}

.inception-button-container a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  border-radius: 2rem;
  padding: 1rem;
  font-size: 1rem;
  font-family: var(--inception-general-font-family);
  color: #ffffff;
  background: #888888;
}

.inception-button-container a::before {
  display: block;
  font-size: 2rem;
  margin-bottom: 0.75rem;
  font-family: "Font Awesome 6 Pro";
  content: var(--fa);
}

.inception-button-container a:hover,
.inception-button-container a:hover:before {
  text-decoration: none;
  background: color-mix(in srgb, #888888, black 10%);
}

.inception-button-container a.inception-light-blue {
  background: #79c4f2;
}

.inception-button-container a.inception-light-blue:hover,
.inception-button-container a.inception-light-blue:hover:before {
  background: color-mix(in srgb, #79c4f2, black 10%);
}

.inception-button-container a.inception-dark-blue {
  background: #264f73;
}

.inception-button-container a.inception-dark-blue:hover,
.inception-button-container a.inception-dark-blue:hover:before {
  background: color-mix(in srgb, #264f73, black 10%);
}

.inception-button-container a.inception-orange {
  background: #f46e1d;
}

.inception-button-container a.inception-orange:hover,
.inception-button-container a.inception-orange:hover:before {
  background: color-mix(in srgb, #f46e1d, black 10%);
}

.inception-button-container a.inception-dark-gray {
  background: #333333;
}

.inception-button-container a.inception-dark-gray:hover,
.inception-button-container a.inception-dark-gray:hover:before {
  background: color-mix(in srgb, #333333, black 10%);
}

.inception-button-container a.inception-light-gray {
  background: #888888;
}

.inception-button-container a.inception-light-gray:hover,
.inception-button-container a.inception-light-gray:hover:before {
  background: color-mix(in srgb, #888888, black 10%);
}