/* todo: Organize colors, classes and the like with BS files*/

:root {
  --red-light: #c8102e;
  --red-dark: #921127;

  --yellow-light: #f1be48;
  --yellow-dark: #efa70b;

  --white: #fff;
  --text: #212529;

  --primary: var(--red-light);
  --primary-hover: var(--red-dark);

  --secondary: var(--yellow-light);
  --secondary-hover: var(--yellow-dark);

  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.24), 0 1px 3px rgba(0, 0, 0, 0.12);
  --shadow-2: 0 2px 4px rgba(0, 0, 0, 0.12), 0 3px 6px rgba(0, 0, 0, 0.15);
  --shadow-3: 0 3px 6px rgba(0, 0, 0, 0.1), 0 10px 20px rgba(0, 0, 0, 0.15);

  --header-height: '';
  /* overrides BS5 smooth scroll */
  scroll-behavior: initial;
}

/* overrides BS5 smooth scroll */
@media (min-width: 768px) {
  :root {
    scroll-padding-top: 0;
  }
}

/* This is for templating internal styles that need not be exposed to the tinymce editor */

/* display styling for side-nav are done with utility classes */
a.nde-ed-toc-category-link {
  display: block;
  color: #c8102e;
  color: var(--red-light);
  font-size: 18px;
  transition-duration: 0s;
  transition: color ease 0.3s;
  padding: 0.25rem 0;
}

.nde-ed-toc-category-link.nde-is-active {
  color: #921127;
  color: var(--red-dark);
}

a.nde-ed-toc-category-link:hover {
  color: #921127;
  color: var(--red-dark);
}

ul.ndeed-navtopicentry-toplevel {
  list-style: none;
  padding-left: 0;
}

ul.ndeed-navcategoryentry-toplevel {
  list-style: none;
  padding-left: 0;
}

/*****
 **These are missing from BS5 Alpha that BS4 have
*****/

a {
  /*text-decoration: none;*/
  text-decoration: underline;
}

p + h2 {
  padding-top: 2rem;
}

.skippy {
  display: block;
  padding: 1em;
  color: #fff;
  text-align: center;
  background-color: #563d7c;
  outline: 0;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/*****
 ** BS5 overrides for the moment
*****/

.bd-navbar {
  position: -webkit-sticky;
  position: sticky;
  background-color: #fff;
  background-color: var(--white);
  border-bottom: 2px solid #c8102e;
  border-bottom: 2px solid var(--primary);
  min-height: 1rem;
  top: 0;
  z-index: 1071;
}

@media (max-width: 767px) {
  .bd-navbar {
    position: fixed;
  }
}

.navbar-light .navbar-nav .nav-link {
  color: var(--primary);
  transition: color 0.3s ease;
}

.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link:hover {
  color: #921127;
  color: var(--primary-hover);
}

.bd-sidenav {
  display: none;
}

.bd-toc-item.active > .bd-sidenav {
  display: block;
}

.bd-toc-item.active {
  font-weight: bolder;
}

.front .bd-sidebar {
  display: none;
}

.bd-sidebar {
  background-color: #fff;
  background-color: var(--white);
  border-bottom: none;
  border-right: 1px solid #dcdcdc;
  top: var(--header-height);
}

.bd-sidebar.bd-sidenav-active {
  color: #212529;
  color: var(--text);
}

@media (max-width: 767px) {
  .bd-sidebar {
    flex: 0 0 100%;
    position: fixed;
    width: 98vw;
    overflow-y: scroll;
    /* overflow-x: hidden; */
    left: 3vw;
    box-shadow: var(--shadow-1);
    border-radius: 4px;
    z-index: 1070;
  }
}

@media (min-width: 768px) {
  .bd-sidebar {
    flex: 0 0 350px;
  }
}

@media (min-width: 768px) {
  .nde-simple-nav {
    padding: 0;
  }
}

.bd-links {
  position: sticky;
  /* top: var(--header-height); */
}

@media (min-width: 768px) {
  .bd-links {
    position: sticky;
  }
}

.bd-links .bd-sidenav-active a {
  color: #212529;
  color: var(--text);
}

@media (max-width: 768px) {
  .bd-links {
    height: calc(100vh - 5rem);
    padding-left: 2rem;
  }
}

.bd-links a {
  display: block;
  margin-left: 0;
}

.bd-toc-item.active:not(:first-child) {
  margin-top: 0;
}

.bd-content {
  flex: 0 0 auto;
}

.bd-content h1 {
  margin-bottom: 1.5rem;
}

.bd-content p,
.bd-content ul {
  max-width: 800px;
}

.bd-content p img {
  padding: 0 1rem;
}

.bd-content figure + p,
.bd-content .nde-ed-iframediv + p {
  margin-top: 1rem;
}

/*****
  ** NDE custom buttons with Bootstrap naming
*****/

.nde-btn-primary {
  color: #fff;
  color: var(--white);
  background-color: #c8102e;
  background-color: var(--primary);
  border-color: #c8102e;
  border-color: var(--primary);
}

.nde-btn-primary:hover {
  color: #fff;
  color: var(--white);
  background-color: #c8102e;
  background-color: var(--primary-hover);
  border-color: #c8102e;
  border-color: var(--primary-hover);
  box-shadow: var(--shadow-2);
}

.nde-btn-secondary {
  color: #212529;
  color: var(--text);
  background-color: #f1be48;
  background-color: var(--secondary);
  border-color: #f1be48;
  border-color: var(--secondary);
}

.nde-btn-secondary:hover {
  color: #212529;
  color: var(--text);
  background-color: #efa70b;
  background-color: var(--secondary-hover);
  border-color: #efa70b;
  border-color: var(--secondary-hover);
}

/*****
 ** NDE site specific CSS
 *****/

@media (max-width: 768px) {
  .nde-main-nav {
    display: none;
  }
}

.nde-push-footer-bottom {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/*****
** content pages
*****/

.nde-navbar {
  max-width: 1400px;
}

.nde-content--wrap {
  max-width: 800px;
}

.nde-content--wrap .ndeed-navcategoryentry-toplevel > li {
  margin-bottom: 1rem;
}

.nde-content--wrap .ndeed-navtopicentry-toplevel > li {
  margin-bottom: 1rem;
}

.nde-header--logo {
  max-width: 250px;
}

.nde-ed--link {
  font-size: 1rem;
  font-family: 'Merriweather', Georgia, serif;
  color: #c8102e;
  color: var(--red-light);
  padding-left: 0.4rem;
  transition: color 0.3s ease;
}

.nde-ed--link:hover {
  color: #921127;
  color: var(--red-dark);
}

.nde-content {
  padding-bottom: var(--header-height);
  position: relative;
  top: var(--header-height);
}

@media (min-width: 768px) {
  .nde-content {
    top: 0;
  }
}

.nde-subtopic-content {
  clear:both;
}

.nde-subtopic-content + .nde-subtopic-content {
  padding-top: 3rem;
  border-top: #f1be48 solid 2px;
  border-top: var(--secondary) solid 2px;
}

/* * homepage */
.nde-hero {
  position: relative;
  height: 500px;
  margin-bottom: 300px;
  background-image: url(../images/nde-hero.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

@media (min-width: 1200px) {
  .nde-hero {
    height: 450px;
    margin-bottom: 270px;
  }
}

@media (max-width: 768px) {
  .nde-hero {
    height: 50vw;
    margin-bottom: 270px;
  }
}

@media (max-width: 576px) {
  .nde-hero {
    height: 350px;
  }
}

@media (max-width: 450px) {
  .nde-hero {
    height: auto;
    margin-bottom: 2rem;
  }
}

.nde-hero--card {
  max-width: 747px;
  bottom: -5vw;
  z-index: 2;
}

@media (min-width: 1200px) {
  .nde-hero--card {
    max-width: 850px;
    bottom: -5vw;
  }
}

@media (max-width: 768px) {
  .nde-hero--card {
    max-width: 85%;
  }
}

.nde-card-title,
.nde-card-text,
.nde-card-icon {
  color: var(--text);
}

.nde-hero--card .nde-card-body {
  z-index: 2;
  transition: box-shadow ease 0.3s;
}

.nde-hero--card .nde-card-body:hover {
  box-shadow: var(--shadow-3);
}

.nde-hero--card {
  font-size: 2.6rem;
}

@media (min-width: 1200px) {
  .nde-hero--card .nde-card-title {
    font-size: 3.1rem;
  }
}

@media (max-width: 768px) {
  .nde-hero--card .nde-card-title {
    font-size: 2rem;
  }
}

@media (max-width: 576px) {
  .nde-hero--card .nde-card-title {
    font-size: 1.5rem;
  }
}

.nde-hero--card .nde-card-text {
  font-size: 18px;
  color: var(--text);
}

@media (max-width: 768px) {
  .nde-hero--card .nde-card-text {
    font-size: 16px;
  }
}

.nde-hero--card .btn {
  width: 50%;
}

.nde-hero--card .nde-deco-box {
  width: 40px;
  height: 40px;
  background-color: #f1be48;
  background-color: var(--secondary);
  z-index: 3;
}

.nde-hero--card span:first-of-type {
  left: -20px;
  top: 9px;
  background-color: #f1be48;
  background-color: var(--secondary);
  transition: box-shadow ease 0.3s;
}

.nde-hero--card:hover span:first-of-type {
  box-shadow: var(--shadow-3);
}

.nde-hero--card span:nth-of-type(2) {
  right: -20px;
  bottom: 20%;
  background-color: #c8102e;
  background-color: var(--primary);
  transition: box-shadow ease 0.7s;
}

.nde-hero--card:hover span:nth-of-type(2) {
  box-shadow: var(--shadow-3);
}

.nde-hero--card span:last-of-type {
  left: -10px;
  bottom: -20px;
  background-color: #efa70b;
  background-color: var(--secondary-hover);
  transition: box-shadow ease 1.3s;
  z-index: -1;
}

.nde-hero--card:hover span:last-of-type {
  box-shadow: var(--shadow-2);
}

.nde-sections--wrap {
  /* position: relative; */
  background: rgb(246, 237, 237);
  background: linear-gradient(
    66deg,
    rgba(246, 237, 237, 1) 0%,
    rgba(231, 231, 231, 1) 100%
  );
  z-index: 1;
}

.nde-ed-card {
  position: relative;
  min-width: 250px;
  max-width: 450px;
  transition: box-shadow ease 0.3s, background ease 0.3s;
}

.nde-ed-card:hover {
  box-shadow: var(--shadow-3);
}

.nde-ed-card::before,
.nde-ed-card::after {
  position: absolute;
  content: '';
  height: 20px;
  width: 20px;
  box-shadow: var(--shadow-1);
  border-radius: 0.25rem;
  z-index: -1;
}

.nde-ed-card::before {
  background-color: #921127;
  background-color: var(--primary-hover);
  top: -10px;
  left: -10px;
}

.nde-ed-card::after {
  background-color: #efa70b;
  background-color: var(--secondary-hover);
  bottom: -10px;
  right: -10px;
}

.nde-card-icon {
  color: #212529;
  color: var(--text);
}

.nde-ed-card .card-body {
  z-index: 2;
}

.nde-ed-card .card-icon {
  font-size: 2.5rem;
}

.nde-add-res--wrap .nde-card {
  transition: box-shadow ease 0.3s;
}

.nde-add-res--wrap .nde-card:hover {
  box-shadow: var(--shadow-3);
}

.nde-add-res--wrap .nde-card-red {
  border-color: #c8102e;
  border-color: var(--primary);
}

.nde-add-res--wrap .nde-card-yellow {
  border-color: #f1be48;
  border-color: var(--secondary);
  /* max-width: 500px; */
}

.nde-sponsors {
  position: relative;
}

.nde-sponsors::before,
.nde-sponsors::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.nde-sponsors::before {
  height: 6px;
  width: 100%;
  background: rgb(200, 16, 46);
  background: linear-gradient(
    90deg,
    var(--primary) 0%,
    rgba(238, 238, 238, 0) 45%
  );
}

@media (max-width: 768px) {
  .nde-sponsors::before {
    background: linear-gradient(
      90deg,
      var(--primary) 0%,
      rgba(238, 238, 238, 0) 75%
    );
  }
}

.nde-sponsors::after {
  height: 100%;
  width: 6px;
  background: rgb(200, 16, 46);
  background: linear-gradient(
    180deg,
    var(--primary) 0%,
    rgba(238, 238, 238, 0) 68%
  );
}

.nde-sponsors .nde-deco-box {
  /* position: absolute; */
  top: -8px;
  left: -8px;
  height: 20px;
  width: 20px;
  background-color: #c8102e;
  background-color: var(--primary);
}

.nde-sponsors ul {
  list-style-type: none;
  max-width: 1000px;
  /* padding: 0; */
}

.nde-img-wrap {
  height: 115px;
  width: 204px;
  /* position: relative; */
}

.nde-sponsors img {
  /* position: relative; */
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  max-width: 100%;
}

.nde-sponsors--platinum figure {
  text-align: center;
}

.nde-sponsors--platinum img {
  top: 0;
  transform: translateY(0);
}

.nde-original--contrib figure {
  max-width: 204px;
  margin: 0 auto;
}

.nde-sponsors--gold figure {
  max-width: 148px;
}

.nde-sponsors--gold .nde-img-wrap {
  height: 87px;
  width: 148px;
  /* position: relative; */
}

.nde-original--contrib li {
  min-width: 250px;
}

@media (max-width: 768px) {
  .nde-original--contrib li {
    width: 100%;
  }
}

/* * footer */
.nde-footer--wrap {
  background-color: #c8102e;
  background-color: var(--primary);
}

a.nde-nav-category {
  display: block;
  color: #fff;
  color: var(--white);
  text-decoration: none;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.7;
  transition: color 0.3s ease;
}

a.nde-nav-category:hover {
  color: #9e9e9e;
}

.nde-footer-list {
  list-style-type: none;
  padding-left: 0;
}

.nde-footer-list a {
  display: block;
  text-decoration: none;
  color: #fff;
  color: var(--white);
  transition: color 0.3s ease-in;
}

.nde-footer-list a:hover {
  color: #9e9e9e;
}

.nde-footer-list span {
  display: block;
  color: #fff;
  color: var(--white);
}

.nde-footer-list .nde-nav-subtopic a {
  font-size: 14px;
}

.nde-footer--logo {
  max-width: 250px;
}

@media (max-width: 768px) {
  .nde-footer--wrap {
    padding-bottom: 2rem;
  }
  .nde-footer--slim .nde-footer-list a,
  .nde-footer--slim .nde-footer-list span {
    font-size: 14px;
  }
}

/* * Custom utility classes */

.nde-shadow-1 {
  box-shadow: var(--shadow-1);
}

.nde-shadow-2 {
  box-shadow: var(--shadow-2);
}

.nde-shadow-3 {
  box-shadow: var(--shadow-3);
}

/* Tooltips */
.nde-tooltip {
  position: relative;
  display: inline;
  border-bottom: 1px dotted black;
}

.nde-tooltip .nde-tooltiptext {
  visibility: hidden;
  width: 250px;
  background-color: #921127;
  background-color: var(--red-dark);
  color: #fff;
  text-align: left;
  border-radius: 4px;
  padding: 1rem;
  position: absolute;
  z-index: 1;
  box-shadow: var(--shadow-1);
  text-shadow: var(--shadow-1);
  transform: translateX(-50%);
  left: 50%;
  top: 1.5em;
}

.nde-tooltip .nde-tooltiptext a {
  color: #f1be48;
  color: var(--secondary);
}

.nde-tooltip:hover .nde-tooltiptext {
  visibility: visible;
}