:root {
  --body-bg-color: #EEEEEE;
  --hb-dark-color: 0, 72, 116;
  --hb-lighter-color: 0, 158, 227;
  --hb-grey-color: 73, 73, 72;
  /*Hex: #004874; */
  --landing-text-color: var(--hb-dark-color);
  --landing-secondary-text-color: var(--hb-lighter-color);
  --font-family: "Sparkasse", Helvetica, Arial, sans-serif !important;
  --h1-font-family: var(--font-family) !important;

  /* Styles for Contact section */
  --interested-bg-color: rgba(255, 255, 255, 1);
  --interested-text-color: rgba(var(--landing-text-color));
  --interested-link-color: rgba(var(--landing-secondary-text-color));
  --interested-padding: 56px;
  --interested-border-radius: 10px;
  --interested-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.interested-h2-span {
  background-color: var(--interested-bg-color);
  color: var(--interested-text-color);
  padding: var(--interested-padding);
  /* border-radius: var(--interested-border-radius); */
  /* box-shadow: var(--interested-box-shadow); */
}


/* Taken from: https://www.helaba.com/wLayout/wGlobal/layout/webfonts/sparkasse/fonts.css */
@font-face {
    font-family: 'Sparkasse';
    src: url('/assets/fonts/helaba/Sparkasse_web_Rg.eot');
    src: url('/assets/fonts/helaba/Sparkasse_web_Rg_iefix.eot') format('embedded-opentype'),
         url('/assets/fonts/helaba/Sparkasse_web_Rg.woff') format('woff'),
         url('/assets/fonts/helaba/Sparkasse_web_Rg.ttf') format('truetype'),
         url('/assets/fonts/helaba/Sparkasse_web_Rg.svg#Sparkasse_Rg') format('svg');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}
@font-face {
    font-family: 'Sparkasse';
    src: url('/assets/fonts/helaba/Sparkasse_web_It.eot');
    src: url('/assets/fonts/helaba/Sparkasse_web_It_iefix.eot') format('embedded-opentype'),
         url('/assets/fonts/helaba/Sparkasse_web_It.woff2') format('woff2'),
         url('/assets/fonts/helaba/Sparkasse_web_It.woff') format('woff'),
         url('/assets/fonts/helaba/Sparkasse_web_It.ttf') format('truetype'),
         url('/assets/fonts/helaba/Sparkasse_web_It.svg#Sparkasse_It') format('svg');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}
/* @font-face {
    font-family: 'Sparkasse';
    src: url('/assets/fonts/helaba/Sparkasse_web_Lt.eot');
    src: url('/assets/fonts/helaba/Sparkasse_web_Lt_iefix.eot') format('embedded-opentype'),
         url('/assets/fonts/helaba/Sparkasse_web_Lt.woff') format('woff'),
         url('/assets/fonts/helaba/Sparkasse_web_Lt.ttf') format('truetype'),
         url('/assets/fonts/helaba/Sparkasse_web_Lt.svg#Sparkasse_Lt') format('svg');
    font-style: normal;
    font-weight: 200;
    text-rendering: optimizeLegibility;
} */
/*
@font-face {
    font-family: 'Sparkasse';
    src: url('/assets/fonts/helaba/Sparkasse_web_LtIt.eot');
    src: url('/assets/fonts/helaba/Sparkasse_web_LtIt.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/helaba/Sparkasse_web_LtIt.woff') format('woff'),
         url('/assets/fonts/helaba/Sparkasse_web_LtIt.ttf') format('truetype'),
         url('/assets/fonts/helaba/Sparkasse_web_LtIt.svg#Sparkasse_Lt') format('svg');
    font-style: italic;
    font-weight: 200;
    text-rendering: optimizeLegibility;
}
*/
@font-face {
    font-family: 'Sparkasse';
    src: url('/assets/fonts/helaba/Sparkasse_web_Md.eot');
    src: url('/assets/fonts/helaba/Sparkasse_web_Md_iefix.eot') format('embedded-opentype'),
         url('/assets/fonts/helaba/Sparkasse_web_Md.woff2') format('woff2'),
         url('/assets/fonts/helaba/Sparkasse_web_Md.ttf') format('truetype'),
         url('/assets/fonts/helaba/Sparkasse_web_Md.svg#Sparkasse_Md') format('svg');
    font-style: normal;
    font-weight: 600;
    text-rendering: optimizeLegibility;
}
/* @font-face {
    font-family: 'Sparkasse';
    src: url('/assets/fonts/helaba/Sparkasse_web_Bd.eot');
    src: url('/assets/fonts/helaba/Sparkasse_web_Bd_iefix.eot') format('embedded-opentype'),
         url('/assets/fonts/helaba/Sparkasse_web_Bd.woff2') format('woff2'),
         url('/assets/fonts/helaba/Sparkasse_web_Bd.woff') format('woff'),
         url('/assets/fonts/helaba/Sparkasse_web_Bd.ttf') format('truetype'),
         url('/assets/fonts/helaba/Sparkasse_web_Bd.svg#Sparkasse_Bd') format('svg');
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}
@font-face {
    font-family: 'Sparkasse';
    src: url('/assets/fonts/helaba/Sparkasse_web_BdIt.eot');
    src: url('/assets/fonts/helaba/Sparkasse_web_BdIt_iefix.eot') format('embedded-opentype'),
         url('/assets/fonts/helaba/Sparkasse_web_BdIt.woff2') format('woff2'),
         url('/assets/fonts/helaba/Sparkasse_web_BdIt.woff') format('woff'),
         url('/assets/fonts/helaba/Sparkasse_web_BdIt.ttf') format('truetype'),
         url('/assets/fonts/helaba/Sparkasse_web_BdIt.svg#SparkasseRg-BoldItalic') format('svg');
    font-style: italic;
    font-weight: bold;
    text-rendering: optimizeLegibility;
} */
/* // @font-face { // Not currently used
//     font-family: 'Sparkasse Head';
//     src: url('/assets/fonts/helaba/SparkasseHead_web_Rg.eot');
//     src: url('/assets/fonts/helaba/SparkasseHead_web_Rg_iefix.eot') format('embedded-opentype'),
//          url('/assets/fonts/helaba/SparkasseHead_web_Rg.woff2') format('woff2'),
//          url('/assets/fonts/helaba/SparkasseHead_web_Rg.woff') format('woff'),
//          url('/assets/fonts/helaba/SparkasseHead_web_Rg.ttf') format('truetype');
//     font-style: normal;
//     font-weight: bold;
//     text-rendering: optimizeLegibility;
// }
// @font-face { // Adviced against usage in styleguide
//     font-family: 'Sparkasse Serif';
//     src: url('/assets/fonts/helaba/SparkasseSerif_web_Rg.eot');
//     src: url('/assets/fonts/helaba/SparkasseSerif_web_Rg_iefix.eot') format('embedded-opentype'),
//          url('/assets/fonts/helaba/SparkasseSerif_web_Rg.woff2') format('woff2'),
//          url('/assets/fonts/helaba/SparkasseSerif_web_Rg.ttf') format('truetype');
//     font-style: normal;
//     font-weight: normal;
//     text-rendering: optimizeLegibility;
// } */

body, section .background {
  background-color: var(--body-bg-color)
}

#fp-hero, #solution, #platform-input, #technology, #contact {
  .elementBox {
    background-color: white;
  }
}

.hqfx-triangle {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#solution .background {
  background-image: url('../images/bg/istockphoto-1368297734-1024x1024.jpg');
}

#platform-input .vc_col-sm-3 .wpb_wrapper {
  margin: auto;
}

#platform-input .background {
    background-image: url('../images/bg/istockphoto-1256856495-1024x1024.jpg');
    transform: scaleX(-1);
    filter: brightness(95%);
    /* top: 15%;
    bottom: 15%;
    height: 75%; */
}

#technology .background {
  /* background-image: url('../images/bg/istockphoto-1342704371-1024x1024.jpg') */
  background-image: url('../images/bg/istockphoto-1147809595-1024x1024.jpg')
}

#solution {
  .vc_row {
    flex-direction: row-reverse;
  }
}

#technology {
  svg path {
    fill: white !important;
  }

  .vc_row {
    align-items: flex-start;
    flex-direction: row-reverse;
  }
}

.elementBox {
  padding: 56px;
  color: rgba(var(--hb-grey-color),1);
  font-size: 18px;
}

/* #technology {
  h2, h3 {
    color: white !important;
  }

  .elementBox {
    color: white;
  }
} */




.hero-background {
    background-size: cover;
    background-repeat: no-repeat;
    background-color: rgba(var(--landing-text-color), 0.25);
    background-image: url('../images/bg/helaba-bg.jpg');
    background-attachment: fixed;
    background-blend-mode: darken;
    min-width: 100%;
    left: 0px;
    min-width: calc(100% - 1px);
}

.text-highlight {
  text-align: right;
  color: rgba(var(--landing-text-color),1);
}

.text-highlight-secondary {
  text-align: right;
  color: rgba(var(--landing-secondary-text-color),1);
}

blockquote, h2, h3, h4, h5, h6 {
  color: rgba(var(--landing-text-color),1) !important;
}

/* Moves the animated tagline at top to be slightly at top to be over the sky background for easier readability */
#fp-hero {
  .fp-tableCell {
    vertical-align: top;
    padding-top: 4%;
  }
}

.header-bgcol {
  border-bottom: none !important;
}

/* Reuse this automatic class added to the top header navbar when scrolling down that adds a bg, to override that bg and change text color aswell */
header#page-header {
  &.sticky {
    background-image: unset;
    background-color: white;
    backdrop-filter: brightness(2.5);
    /* color: rgba(var(--landing-secondary-text-color),1); */
    color: rgba(var(--landing-text-color),1);
    border-bottom: none;
    border-color: unset;

    .l-subheader.header-bgcol {
      border-bottom: none;
      border-color: unset;
    }

    .l-subheader.at_middle {
      color: inherit;
    }

  }
}

/* Removes transparent background in login. */
.us-btn-style_1 {
  background-color: rgba(var(--landing-text-color),1) !important;
}

section#contact {
  background-size: cover ;
  background-repeat: no-repeat;
  background-color: rgba(var(--hb-dark-color), 0.25);
  background-image: url('../images/bg/contact.jpg');
  background-attachment: fixed;
  background-position-y: 25%;
  background-position-x: 25vw;
  padding-bottom: 7em;

  h2 a {
    text-decoration: underline;
  }

  .elementBox {
    margin-bottom: 40%;
  }
}

.helaba-neon {
  background-color: rgba(var(--hb-dark), 0.25);
  background-color: rgba(var(--hb-dark), 1);
  background: -moz-linear-gradient(left, rgba(var(--hb-dark-color),1) 0%, rgba(var(--hb-lighter-color),1) 100%);
  background: -webkit-linear-gradient(left, rgba(var(--hb-dark-color),1) 0%, rgba(var(--hb-lighter-color),1) 100%);
  background: linear-gradient(to right, rgba(var(--hb-dark-color),1) 0%, rgba(var(--hb-lighter-color),1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(var(--hb-dark-color),1)',endColorstr='rgba(var(--hb-dark-color),1)',GradientType=1 );
  color: white !important;

  .technology-title {
    color: white !important;
  }
}

.header-bgcol {
  border-bottom: none;
}

#page-header.l-header.shadow_thin {
  background-image: unset;
  background-color: white;
  border-bottom: unset;

  .us-btn-style_1 {
    background-color: rgba(var(--landing-text-color),1) !important;
  }
}

.helaba-logo {
  height: 48px;
  width: auto;
}

.language-switcher a {
  color: rgba(var(--hb-dark-color),1) !important;
  &:hover {
    color: rgba(var(--hb-lighter-color),1) !important;
  }
}

/* Dropdown nav */
.l-subheader-cell.at_left .w-nav {
  .w-nav-control {
    color: rgba(var(--hb-dark-color),1) !important;
  }
  .menu-item a { /* Contact button in nav, overrides some css copied... */
    &:hover {
      color: rgba(var(--hb-lighter-color),1) !important;
    }
  }

  .menu-item.current-menu-item a {
    color: rgba(var(--hb-lighter-color),1) !important;
    &:hover {
      color: white !important;
    }
  }
}

.l-subheader.at_middle {
  color: rgba(var(--landing-text-color),1);
}


.hedgepilot-login {
  img {
    width: auto;
    height: 24px;
  }
}

/* Smaller screen adjustments overrides */

@media(max-width: 1600px) {
  section#contact {
    background-position-y: -20vh;
    background-position-x: 20vw;
  }
}

@media(max-width: 1200px) {
  section#contact {
    background-position-y: -20vh;
    background-position-x: 20vw;

    h2 {
      position: relative;
      left: -15vw;
    }
  }
}

@media(max-width: 800px) {

  section#contact {
    background-position-x: 0;
    background-position-y: 0;
    .elementBox {
      margin-bottom: 0;
      margin-top: 55%;
    }
  }
}

@media (max-width: 550px) {
}

@media(max-height: 500px) {
  section#contact {
    background-position-y: -60vh;
  }
}

/* hero-background */
@media (max-width: 600px) {
  .hero-background.upb_row_bg {
    background-position: right center;
  }
}

/* logo */
@media (max-width: 1300px) {
  .logo {
    width: 40vw;
  }
}

/* navbar */
@media (min-width: 901px) {
  #page-header.l-header.shadow_thin {
    background-image: unset;
    background-color: white;
    border-bottom: unset;

    .us-btn-style_1 {
      background-color: rgba(var(--landing-text-color),1) !important;
    }
  }
}

@media (max-width: 600px) {
  .m_layout_dropdown {
    .w-nav-list.level_1 {
      background: rgba(var(--hb-dark-color), 1) !important;
    }
  }
}


@media (min-width: 901px) {
  .l-sidebar,
  .l-section-h,
  .l-section.width_full .vc_col-sm-12 .w-tabs-section-content-h {
    padding: 2rem 0;
  }
  .off.l-subheader.at_middle,
  .l-header .pos_fixed .l-subheader.at_middle {
    background-image: linear-gradient(90deg, rgba(var(--hb-lighter-color),1), rgba(var(--hb-dark-color),1));
  }
  .l-header.bg_transparent,
  .l-header.bg_solid.sticky {
    display: block;
  }
  .l-header.pos_fixed ~ .l-section,
  .sidebar_left .l-header.pos_fixed + .l-main,
  .sidebar_right .l-header.pos_fixed + .l-main,
  .sidebar_none .l-header.pos_fixed + .l-main .l-section:first-child,
  .sidebar_none .l-header.pos_fixed + .l-main .l-section-gap:nth-child(2),
  .header_inpos_below .l-header.pos_fixed ~ .l-main .l-section:nth-child(2),
  .l-header.pos_static.bg_transparent ~ .l-section,
  .sidebar_left .l-header.pos_static.bg_transparent + .l-main,
  .sidebar_right .l-header.pos_static.bg_transparent + .l-main,
  .sidebar_none
    .l-header.pos_static.bg_transparent
    + .l-main
    .l-section:first-child {
    padding-top: 0;
  }

}