@import url('https://fonts.googleapis.com/css2?family=Maven+Pro:wght@400..900&display=swap');

html {
  scroll-padding-top: 5rem;
}

header{
font-size: 1rem;
}

.footer {
  color: #fff;
  margin-top: 0em;
  border-top: 10px solid #E6FC94;
  background-color: #0D3125;
  background-image:none;
}

.footer .moduletable{
  padding-bottom: 30px;
}

#banner, footer{
padding: 30px;
}

:root {
  --bs-blue: #1e30f3;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #e21e80;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #2E3092;
  --bs-secondary: #EC008C;
  --bs-mission: #8C18D3;
  --bs-guide: #3FC273;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #fff;
  --bs-dark: #1C1322;
  --bs-primary-rgb: 46, 48, 146;
  --bs-secondary-rgb: 226, 30, 128;
  --bs-mission-rgb: 140, 24, 211;
  --bs-guide-rgb: 63, 194, 115;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 28, 19, 34;
  --bs-light-rgb: 135, 144, 141;
  --bs-dark-rgb: 28, 19, 34;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: "Maven Pro";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --body-font-family: var(--bs-font-sans-serif);
  --body-font-size: 1.2rem;
  --body-font-weight: 400;
  --body-line-height: 1.5;
  --body-color: #173D2F; /*070969*/
  --body-bg: #fff; /*!FFF8E8*/
  --border-width: 0px;
  --border-style: solid;
  --border-color: #dee2e6;
  --border-color-translucent: rgba(0, 0, 0, 0.175);
  --border-radius: 0.375rem;
  --border-radius-sm: 0.25rem;
  --border-radius-lg: 0.5rem;
  --border-radius-xl: 1rem;
  --border-radius-2xl: 2rem;
  --border-radius-pill: 50rem;
  --link-color: #2B7954;
  --link-hover-color: #CDB0F3;
  --code-color: #e21e80;
  --highlight-bg: #fff3cd;
}

/* HEADER & NAVIGATION */

.container-header nav {
  margin-top: 0em;
  padding: 0 0 10px 0;
}

.container-header .navbar {
  background-color: #173D30;
  margin-top:0;
}

.container-header .navbar-brand {
  color: #fff;
  font-size: 1.4rem;
}

.container-header .navbar-brand a, .container-header .site-description {
  color: #E6FC94;
  font-size: 0.8rem;
  text-decoration: none;
}

.container-header .navbar-brand img {
  margin-left: 0rem;
  width: 280px;
  padding: 0px 0;
}

.container-header .navbar-toggler {
    color: #fff);
    cursor: pointer;
    border-width: 2px;
    border-style: solid;
    border-color: #fff;
    border-image: initial;
}

.breadcrumb{
    background-color: #F8FFFA;
  padding: 0 17px 0px 17px;
}

.breadcrumbs{
    margin-top: 0em;
    padding: 0 0px 0px 0px;
    background-color: #F8FFFA;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15);
}

.container-header .breadcrumbs nav{
  padding: 0 0 0px 0;
    background-color: #F8FFFA;
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 1px;
    outline: 0;
    text-decoration: none;
}

.navbar{
 transition: all 0.5s;
 }

.brand-logo-light, 
.directory .brand-logo-dark,
.directory .navbar-scrolled .brand-logo-light{
   display: none;
   visibility: hidden;
 }

.directory .brand-logo-light,
.directory .navbar-scrolled .brand-logo-dark{
  display: block;
  visibility: visible;
}

 nav.navbar-scrolled{
 margin-top: 0em;
 padding-top: 0em;
 }

.container-header nav {
  margin-top: 0em;
  padding-top: 0.3em;
  background-color: #173D30;
}

.container-header nav {
  margin-top: 0em;
  padding-top: 0.3em;
  background-color: #003399;
}

.navbar {
  --bs-nav-link-padding-x: 0.25rem;
  --bs-nav-link-padding-y: 1rem;
  --bs-nav-link-font-size: 1rem;
  --bs-nav-link-font-weight: bold;
  --bs-nav-link-color: #E6FC94;
  --bs-nav-link-hover-color: #fff;
  --bs-nav-link-disabled-color: #E6FC94;
}

.mod-menu .nav-item {
  display: block;
  margin: 0px .25rem;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-family: var(--bs-body-font-family);
  font-size: 1.1rem;
  font-weight: var(--bs-nav-link-font-weight);
  color: var(--bs-nav-link-color);
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.mod-menu .nav-item:hover, .mod-menu .nav-item:focus {
  color: var(--bs-nav-link-hover-color);
  text-decoration: none;
}

.container-header .mod-list li.active > a {
  color: var(--bs-nav-link-hover-color);
  text-decoration: none;
}

.bg-prod .container-header .mod-list li.active > a {
  color: #E6FC94;
  text-decoration: none;
}

.container-header .mod-menu > li > a.csrd {
  padding: 5px;
  color: #fff;
}

.container-header .mod-menu > li.active::after, .container-header .mod-menu > li:hover::after {
  background: #CDB0F3;
}
 .container-header .mod-menu > li::after {
    content: "";
    opacity: .4;
    position: relative;
  }

.csrd{
  padding: 5px;
  color: #fff;
}

a.csrd:link{
  font-size: 1rem;
  padding: 5px;
  color: #fff;
  background: url('/images/assets/flags/eu-flag.png') no-repeat #003399;
  background-position: center;
  background-size: 42px 28px;
  border: 0px solid #ffd617;
  border-radius: 5px;
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
  }

@media (max-width: 991.98px) { 

.container-header ul.mod-list{
  padding-top: 10px;
}

#banner{
  padding: 15px 10px;
}

}

/* section coloring based on page class */

.bg-home #banner, .bg-esg #banner, .bg-hub #banner{
  background-color: #F0FFEE;
}

.bg-home #intro, .bg-esg #intro{
  background-color: #fff;
}

.bg-home .container-component{
  background-color: transparent;
  border-radius: 5px;
  padding: 20px 0;
}

.bg-home #interest{
color: #E6FC94;
padding: 10px 0;
background: #173D30;
}

 .bg-home #afterburn{
   --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;  
}

.bg-esg #interest{
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;  
}

.bg-esg #afterburn{
   --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-guide-rgb), var(--bs-bg-opacity)) !important;  
}

.bg-solution #interest{
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-guide-rgb), var(--bs-bg-opacity)) !important;  
}

.bg-solution #afterburn{
   --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;  
}

.bg-prod #interest{
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;  
}

 .bg-prod #afterburn{
   --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-guide-rgb), var(--bs-bg-opacity)) !important;  
}

.bg-about #interest{
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-guide-rgb), var(--bs-bg-opacity)) !important;  
}

 .bg-about #afterburn{
   --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-guide-rgb), var(--bs-bg-opacity)) !important;  
}

/* CATEGORY STYLING */

.form-select, .form-control {
  border: 0px solid #E7FCEF;
  background: #eaedf0 url("../images/select-bg.svg?v=5ebba0") 100% / 116rem no-repeat;
}

.container-banner {
    margin: 0 0 0rem;
    display: block;
}

.search-assist{
  border-radius: 10px;
  background-color: #C6FEC1;
}

.search-assist .awesomplete > input {
  width: 600px;
}
.lead-article-intro{
  all: unset;
}

.com-content-category-blog__children {
  padding: 10px;
  background-color: #E6FC94;
  border-radius: 0.5rem;
}

.com-content-category-blog__child{
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.directory .com-content-category-blog__children {
  padding: 10px 0;
  background-color: #fff;
  border-radius: 0.5rem;
}

.directory .com-content-category-blog__child{
  padding: 10px 0px;
  border-bottom: 1px solid #ccc;
}

/* GENERAL STYLING */

blockquote{
  font-size: 1.3em;
  width:90%;
  margin:50px auto;
  font-family:Open Sans;
  font-style:italic;
  color: #555555;
  padding:1.2em 30px 1.2em 75px;
  border-left:8px solid #E6FC94;
  line-height:1.6;
  position: relative;
  background:#EDEDED;
}

blockquote::before{
  font-family:Arial;
  content: "\201C";
  color:#78C0A8;
  font-size:4em;
  position: absolute;
  left: 10px;
  top:-10px;
}

blockquote::after{
  content: '';
}

blockquote span{
  display:block;
  color:#333333;
  font-style: normal;
  font-weight: bold;
  margin-top:1em;
}


h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
  font-family: var(--bs-font-sans-serif);
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
}

h1, .h1 {
  font-size: calc(1.375rem + 1.5vw);
}
@media (min-width: 1200px) {
  h1, .h1 {
    font-size: 2.5rem;
  }
}

h2, .h2 {
  font-size: calc(1.325rem + 0.9vw);
}
@media (min-width: 1200px) {
  h2, .h2 {
    font-size: 2rem;
  }
}

h3, .h3 {
  font-size: calc(1.3rem + 0.6vw);
}
@media (min-width: 1200px) {
  h3, .h3 {
    font-size: 1.75rem;
  }
}

h4, .h4 {
  font-size: calc(1.275rem + 0.3vw);
}
@media (min-width: 1200px) {
  h4, .h4 {
    font-size: 1.5rem;
  }
}

h5, .h5 {
  font-size: 1.25rem;
}

h6, .h6 {
  font-size: 1rem;
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

.text-gradient {
  background: -webkit-linear-gradient(315deg, #8C18D3 0%, #75DA9E 60%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

hr {
  margin: 1rem 0;
  color: #000;
  border: 0;
  border-top: 1px solid;
  opacity: 0.25;
}

/* BUTTONS */

.btn.show {
  color: #1C1322;
  background-color: #fff;
  border-color: var(--btn-active-border-color);
}
.btn{
--btn-border-width: 1px;
}

.btn-primary {
  --btn-color: #1C1322;
  --btn-bg: #fff;
  --btn-border-color: #1C1322;
  --btn-hover-color: #fff;
  --btn-hover-bg: #1C1322;
  --btn-hover-border-color: #1C1322;
  --btn-focus-shadow-rgb: 64, 79, 245;
  --btn-active-color: #fff;
  --btn-active-bg: #1826c2;
  --btn-active-border-color: #1724b6;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #fff;
  --btn-disabled-bg: #1e30f3;
  --btn-disabled-border-color: #1e30f3;
}

.btn-secondary {
  --btn-color: #1C1322;
  --btn-bg: #fff;
  --btn-border-color: #1C1322;
  --btn-hover-color: #fff;
  --btn-hover-bg: #1C1322;
  --btn-hover-border-color: #1C1322;
  --btn-focus-shadow-rgb: 64, 79, 245;
  --btn-active-color: #fff;
  --btn-active-bg: #1826c2;
  --btn-active-border-color: #1724b6;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #fff;
  --btn-disabled-bg: #1e30f3;
  --btn-disabled-border-color: #1e30f3;
}

.btn-mission {
  --btn-color: #fff;
  --btn-bg: #8C18D3;
  --btn-border-color: #8C18D3;
  --btn-hover-color: #000;
  --btn-hover-bg: #C966F8;
  --btn-hover-border-color: #C966F8;
  --btn-focus-shadow-rgb: 192, 26, 109;
  --btn-active-color: #1C1322;
  --btn-active-bg: #e84b99;
  --btn-active-border-color: #e5358d;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #1C1322;
  --btn-disabled-bg: #e21e80;
  --btn-disabled-border-color: #e21e80;
}

.btn-guide, .btn-info {
  --btn-color: #fff;
  --btn-bg: #173D2F;
  --btn-border-color: #173D2F;
  --btn-hover-color: #fff;
  --btn-hover-bg: #157347;
  --btn-hover-border-color: #146c43;
  --btn-focus-shadow-rgb: 60, 153, 110;
  --btn-active-color: #fff;
  --btn-active-bg: #146c43;
  --btn-active-border-color: #13653f;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #fff;
  --btn-disabled-bg: #198754;
  --btn-disabled-border-color: #198754;
}

.btn-outline-lang {
--btn-border-width: 0px;
--btn-border-color: #1C1322;
}

.btn-outline-primary {
  --btn-color: #1C1322;
  --btn-border-color: #1C1322;
  --btn-hover-color: #fff;
  --btn-hover-bg: #1C1322;
  --btn-hover-border-color: #fff;
  --btn-focus-shadow-rgb: 30, 48, 243;
  --btn-active-color: #fff;
  --btn-active-bg: #1e30f3;
  --btn-active-border-color: #1e30f3;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #1e30f3;
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: #1e30f3;
  --gradient: none;
}

.btn-outline-secondary {
  --btn-color: #fff;
  --btn-border-color: #fff;
  --btn-hover-color: #1C1322;
  --btn-hover-bg: #fff;
  --btn-hover-border-color: #1C1322;
  --btn-focus-shadow-rgb: 226, 30, 128;
  --btn-active-color: #1C1322;
  --btn-active-bg: #e21e80;
  --btn-active-border-color: #e21e80;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #e21e80;
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: #e21e80;
  --gradient: none;
}

.btn-outline-mission {
  --btn-color: #8C18D3;
  --btn-border-color: #8C18D3;
  --btn-hover-color: #fff;
  --btn-hover-bg: #8C18D3;
  --btn-hover-border-color: #f8f9fa;
  --btn-focus-shadow-rgb: 248, 249, 250;
  --btn-active-color: #1C1322;
  --btn-active-bg: #f8f9fa;
  --btn-active-border-color: #f8f9fa;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #f8f9fa;
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: #f8f9fa;
  --bs-gradient: none;
}

.btn-outline-guide {
  --btn-color: #3FC273;
  --btn-border-color: #3FC273;
  --btn-hover-color: #fff;
  --btn-hover-bg: #3FC273;
  --btn-hover-border-color: #fff;
  --btn-focus-shadow-rgb: 33, 37, 41;
  --btn-active-color: #fff;
  --btn-active-bg: #212529;
  --btn-active-border-color: #212529;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: #212529;
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: #212529;
  --gradient: none;
}

/* MODULE CARDS */
.card {
  background-color: #F0FFEE;
  margin-top: 30px;
  max-width: 90%;
  }

/* TEXT-COLOR */
.text-primary {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
}

.text-secondary {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
}

.text-mission {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-mission-rgb), var(--bs-text-opacity)) !important;
}

.text-guide {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-guide-rgb), var(--bs-text-opacity)) !important;
}

.text-warning {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-warning-rgb), var(--bs-text-opacity)) !important;
}

.text-danger {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important;
}

.text-light {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
}

.text-dark {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important;
}

.text-black {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-black-rgb), var(--bs-text-opacity)) !important;
}

.text-white {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important;
}

.text-body {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-body-color-rgb), var(--bs-text-opacity)) !important;
}

.text-muted {
  --bs-text-opacity: 1;
  color: #6c757d !important;
}

.text-black-50 {
  --bs-text-opacity: 1;
  color: rgba(0, 0, 0, 0.5) !important;
}

.text-white-50 {
  --bs-text-opacity: 1;
  color: rgba(255, 255, 255, 0.5) !important;
}

.text-reset {
  --bs-text-opacity: 1;
  color: inherit !important;
}

.text-opacity-25 {
  --bs-text-opacity: 0.25;
}

.text-opacity-50 {
  --bs-text-opacity: 0.5;
}

.text-opacity-75 {
  --bs-text-opacity: 0.75;
}

.text-opacity-100 {
  --bs-text-opacity: 1;
}

/* BACKGROUND-COLOR */

.bg-primary {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
}

.bg-secondary {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
}

.bg-mission{
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-mission-rgb), var(--bs-bg-opacity)) !important;  
}

.bg-guide {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-guide-rgb), var(--bs-bg-opacity)) !important;
}

.bg-dark {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
}


.bg-warning {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important;
}

.bg-danger {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important;
}

.bg-light {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
}

.display-1 {
  font-size: calc(1.625rem + 4.5vw);
  font-weight: 300;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .display-1 {
    font-size: 5rem;
  }
}

.display-2 {
  font-size: calc(1.575rem + 3.9vw);
  font-weight: 300;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .display-2 {
    font-size: 4.5rem;
  }
}

.display-3 {
  font-size: calc(1.525rem + 3.3vw);
  font-weight: 300;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .display-3 {
    font-size: 4rem;
  }
}

.display-4 {
  font-size: calc(1.475rem + 2.7vw);
  font-weight: 300;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .display-4 {
    font-size: 3.5rem;
  }
}

.display-5 {
  font-size: calc(1.425rem + 2.1vw);
  font-weight: 300;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .display-5 {
    font-size: 3rem;
  }
}

.display-6 {
  font-size: calc(1.375rem + 1.5vw);
  font-weight: 300;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .display-6 {
    font-size: 2.5rem;
  }
}