/* Variables */

:root {
  --c-dark-grey: #353535;
  --c-mid-grey: #989898;
  --c-white: #ffffff;
  --c-green: #dbff6f;

  --grid-unit: 1rem; /* 16px */

  --column-gutter: calc(var(--grid-unit) * 2);
}

/* Fonts */

@font-face {
    font-family: 'bc-book';
    src: url('../fonts/bc-book.woff2') format('woff2'),
         url('../fonts/bc-book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bc-book';
    src: url('../fonts/bc-medium.woff2') format('woff2'),
         url('../fonts/bc-medium.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 100%; /* 18px */
  height: 100%;
  scroll-behavior: smooth;
}

body {
  background-color: var(--c-dark-grey);
  color: var(--c-white);
  font-family: 'bc-book', sans-serif;
}

/* Background styles */
.bg {
  position: fixed;
  width: 100%;
  height: 100%;
}

.bg__image {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
}

.bg__image--home {
  background-image: url('../img/bg-cover.jpg');
}

.bg__image--platform {
  background-image: url('../img/bg-platform-1.jpg');
}

.bg .bg__image {
  opacity: 0;
  transition: opacity 0.9s;
}

.bg__image--motorsport {
  background-image: url('../img/bg-onboard.jpg');
}

.bg__image--smartcities {
  background-image: url('../img/bg-smartcities.jpg');
}

.bg__image--ysc__page1 {
  background-image: url('../img/bg-ysc-page-1.jpg');
}

.bg__image--ysc__page2 {
  background-image: url('../img/bg-ysc-page-2.jpg');
}

.bg__image--ysc__page3 {
  background-image: url('../img/bg-ysc-page-3.jpg');
}

.bg__image--intro__page1 {
  background-image: url('../img/bg-intro-page-1.jpg');
}

.bg__image--intro__page2 {
  background-image: url('../img/bg-intro-page-2.jpg');
}

.bg__image--intro__page3 {
  background-image: url('../img/bg-intro-page-3.jpg');
}

.bg__image--intro__page4 {
  background-image: url('../img/bg-intro-page-4.jpg');
}

.bg__image--intro__page5 {
  background-image: url('../img/bg-intro-page-5.jpg');
}

.bg__image--intro__page6 {
  background-image: url('../img/bg-intro-page-6.jpg');
}

.bg__image--cto {
  background-image: url('../img/bg-cto.jpg');
}

.bg .active {
  opacity: 1;
}

.bg__logo {
  bottom: 0;
  padding: var(--grid-unit);
  position: fixed;
  right: 0;
}

/* Layout */
section {
  padding: calc(var(--grid-unit) * 4) var(--grid-unit);
  position: relative;
  width: 100%;
  min-height: 100%;
}

.section-partnership-slide {
  padding: calc(var(--grid-unit) * 2) calc(var(--grid-unit) * 2);
  min-height: 100%;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center;
  background-size: cover;
}

@media only screen and (min-width : 1025px) {
  .section-partnership-slide {
    padding: calc(var(--grid-unit) * 6) calc(var(--grid-unit) * 4);
    min-height: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
  }
}

.cookie-notice {
  background-color: var(--c-dark-grey);
  color: var(--c-mid-grey);
  font-size: 0.9rem;
  left: 0;
  padding: calc(var(--grid-unit) / 2);
  position: fixed;
  text-align: center;
  top: 0;
  width: 100%;
}

.content {
  margin: 0 auto;
  max-width: 100%;
}

.content__full {
  margin: 0 auto;
  max-width: 100%;
}

.content__list {
  margin-bottom: calc(var(--grid-unit) * 2);
  margin-left: calc(var(--grid-unit) * 2);
  margin-right: calc(var(--grid-unit) * 2);
  text-align: left;
}

.layout-columns {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media only screen and (min-width : 767px) {
  section {
    padding: calc(var(--grid-unit) * 8) 0;
  }

  html, body {
    font-size: 112.5%; /* 18px */
  }

  .content {
    margin: 0 auto;
    max-width: 768px;
  }

  .content__list {
    margin-bottom: calc(var(--grid-unit) * 2);
    margin-left: calc(var(--grid-unit) * 4);
    margin-right: calc(var(--grid-unit) * 4);
    text-align: left;
  }
}

@media only screen and (min-width : 767px) {
  .layout-columns {
    flex-direction: row;
  }
}

.layout-columns__third {
  margin-bottom: calc(var(--grid-unit) * 2);
  width: 100%;
}

/* Text Styles */
a, a:link, a:visited {
  color: var(--c-green);
}

h1 {
  font-size: 2rem; /* 32px */
  font-weight: normal;
  margin-bottom: calc(var(--grid-unit) * 2);
}

h2 {
  font-size: 1.5rem; /* 24px */
  font-weight: bold;
  text-align: center;
  color: var(--c-green);
  margin-bottom: calc(var(--grid-unit) * 2);
}

h3 {
  font-size: 1.5rem; /* 24px */
}

p {
  line-height: 1.6;
  margin-bottom: calc(var(--grid-unit) * 2);
}

/* set text sizes for larger-than-mobile */
@media only screen and (min-width : 767px) {
  h1 { font-size: 3rem; /* 48px */ }
  h2 { font-size: 2rem; /* 32px */ }
}

/* Section styles */
.section {
  padding: calc(var(--grid-unit) * 6) var(--grid-unit);
}
.section__cover {
  text-align: center;
}

.section__contact {
  text-align: center;
}

.section__ysc {
  text-align: center;
}

.section__intro {
  font-size: 130%;
  text-align: center;
}

@media only screen and (min-width : 767px) {
  .section {
    padding: calc(var(--grid-unit) * 8) var(--grid-unit);
  }
}

.logo {
  margin-bottom: calc(var(--grid-unit) * 1);
}

.new-product {
  color: var(--c-green);
  font-size: 1.5rem;
  margin-bottom: 0;
}

@media only screen and (min-width : 767px) {
  .new-product { font-size: 1.5rem; /* 24px */ }
}

.learn-more {
  cursor: pointer;
  margin: 0 auto;
  width: calc(var(--grid-unit) * 8);
}

.learn-more__icon {
  font-size: 2rem;
  transform: rotate(90deg);
}

.learn-more__linkedin {
  font-size: 2rem;
}

.learn-more:hover .learn-more__icon {
  color: var(--c-green);
}

.learn-more:hover .learn-more__linkedin {
  color: var(--c-green);
}

/*TODO Remove navigate home from site*/
.navigate-home {
  cursor: pointer;
  left: 0;
  padding: var(--grid-unit);
  position: fixed;
  top: var(--grid-unit);
}

.navigate-home__icon {
  /*font-size: 2rem;*/
}

.navigate-home:hover .navigate-home__icon {
  color: var(--c-green);
}

.page-link {
  color: var(--c-green);
  cursor: pointer;
  font-size: 1.5rem;
  text-align: center;
}

.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

/* Navigation helpers styles */
.intuitiq-nav-arrow-up, .intuitiq-nav-arrow-down, .intuitiq-nav-dot {
  cursor: pointer;
  font-size: 2rem;
}

.intuitiq-nav-arrow-up {
  transform: rotate(90deg);
}

.intuitiq-nav-arrow-down {
  transform: rotate(90deg);
}

.intuitiq-hover-text-green:hover {
  color: var(--c-green);
}

.nav-icon {
  font-size: 80%;
}

.pulse {
  animation:pulse 2s;
  -webkit-animation:pulse 2s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}

.pulse:hover {
    animation: step-end;
}

@keyframes pulse {
  0% {opacity: 0.2;}
  100% {opacity: 0.6;}
}

@-webkit-keyframes pulse {
  0% {opacity: 0.2;}
  100% {opacity: 0.6;}
}

/* Powered by styles */
.powered-by {
  text-align: center;
}
.powered-by__prefix {
  text-shadow: none;
  font-size: 0.5rem;
  font-weight: bold;
  letter-spacing: 1px;
  margin-bottom: 0;
  text-transform: uppercase;
}
.powered-by__logo {
  color: var(--c-green);
  font-size: 1.5rem; /* 24px */
  text-transform: lowercase;
}