/* montserrat-regular - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url('../webfonts/montserrat-v14-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Montserrat Regular'), local('Montserrat-Regular'),
         url('../webfonts/montserrat-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/montserrat-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/montserrat-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/montserrat-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/montserrat-v14-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
  }

  /* montserrat-600 - latin */
  @font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: url('../webfonts/montserrat-v14-latin-600.eot'); /* IE9 Compat Modes */
    src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'),
         url('../webfonts/montserrat-v14-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/montserrat-v14-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/montserrat-v14-latin-600.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/montserrat-v14-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/montserrat-v14-latin-600.svg#Montserrat') format('svg'); /* Legacy iOS */
  }

  /* montserrat-800 - latin */
  @font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 800;
    src: url('../webfonts/montserrat-v14-latin-800.eot'); /* IE9 Compat Modes */
    src: local('Montserrat ExtraBold'), local('Montserrat-ExtraBold'),
         url('../webfonts/montserrat-v14-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/montserrat-v14-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/montserrat-v14-latin-800.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/montserrat-v14-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/montserrat-v14-latin-800.svg#Montserrat') format('svg'); /* Legacy iOS */
  }

html,body {
    height: 100%; min-height: 100%;
    font-family: 'Montserrat', sans-serif;
    /*font-size: calc(14px + (18 - 14) * ((100vw - 300px) / (1920 - 300)));*/
    font-size: 100%;
}
hr{ 
    background: #ccc; 
    height: 1px; 
    border: none;
    margin-bottom: 10px;
    margin-top: 5px;
}
h2{
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 0.8em;
    font-size: calc(20px + (32 - 20) * ((100vw - 300px) / (1920 - 300)));
}
h3 {
    font-weight: 600;
    font-size: calc(20px + (27 - 20) * ((100vw - 300px) / (1920 - 300)));
}
h4 {
    font-weight: 600;
    font-size: calc(16px + (20 - 16) * ((100vw - 300px) / (1920 - 300)));
    color: #1D71B8;
}
h5 {
    font-weight: 800;
    text-transform: uppercase;
    font-size: calc(25px + (45 - 25) * ((100vw - 300px) / (1920 - 300)));
}
section {
    padding-top: 63px;
/*    padding-bottom: 41px; */
/*  BB Boris 20.02.2020:  Auf 5 px reduziert*/
    padding-bottom: 5px;
}
.row {
    margin:0 !important;
}
.linkImage.col-sm-12, .linkImage.col-md-4 {
    padding: 0 !important;
}
.nospace {
    margin: 0 !important;
    padding: 0 !important;
}
.main{
    background-color: #ffffff;
}
.mainColor{
    color: var(--primary);
}
.white{
    color: var(--light);
}
.blue{
    color: #1f71b8;
}
.bigText{
    /*font-size: calc(40% + 1vw + 1vh);*/
    font-weight: 600;
}
.smallText {

    /*font-size: calc(16px + (20 - 16) * ((100vw - 300px) / (1920 - 300)));*/
    font-size: calc(14px + (18 - 14) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 400;
}

/* Splash image */
.splash {
    /*width: 100%;
    height: 1080px;*/
    margin-top: 40px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.splash img {
    width: 100%;
    height: auto;
    padding: 0 !important;
    margin: 0 !important;
}


/* Playstores */
section.playstores {
    background-color: #1D71B8;
    padding-top: 41px !important;
    padding-bottom: 41px !important;
}
.playstore-link, .playstore-logo {
    text-decoration: none;
}
.playstore-logo {
    margin-bottom: 4px;
}

/* Scroller */
.scroller {
    box-shadow: 0 -20px 20px -20px rgba(0, 0, 0, .5), 0 20px 20px -20px rgba(0, 0, 0, .5);
}
.carousel-navi-prev, .carousel-navi-next {
    cursor: pointer;
}
#morefeatures{
    background-size: cover;
    background-position: center;
    /*height:831px;*/
}
.features {
    margin-top: 0.8em;
    margin-bottom: 0.8em;
    font-size: calc(14px + (16 - 14) * ((100vw - 300px) / (1920 - 300)));

}
/* Roadmap accordion */
div.accordion:first-of-type {
    padding-top: 2em;
}
.accordion:last-child {
    border-bottom:2px solid #1D71B8;
}

.teaserText {
    font-size: calc(16px + (22 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 400;
}
.teaserTextRight{
    position: absolute;
    bottom: 8px;
    right: 16px;

}
.teaserImg{
    min-height: 580px;
    width: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    
    /*box-shadow: 0 -20px 20px -20px rgba(0, 0, 0, .5), 0 20px 20px -20px rgba(0, 0, 0, .5);*/
}
.teaserBgr{
    padding: 1.75rem 1.75rem;
    background: rgba(255,255,255,0.9);
}


/* Roadmap */
.roadmapbutton {
    width: 100%;
    display: block;
    background:transparent;
    border: 0 0 0 0;
    font-size: calc(18px + (22 - 18) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 600;
    border-top:2px solid #1D71B8;
    text-align: left;
    cursor: pointer;
    padding-top: 0.3em;
    padding-bottom: 0.3em;
    padding-left: 0.4em;
    padding-right: 0.4em;
}
.accordion .roadmapbutton:after {
    font-family: 'Font Awesome 5 Free';
    content: "\f068";
    float: right;
    color: var(--primary);
}
.accordion .roadmapbutton.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\f067";
}

/* Button */
.btn {
    font-size: calc(14px + (18 - 14) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 600;
    border-radius: 10px;
    text-align: left;
    padding-left: 0.5em;
    padding-right: 0.5em;
}
.btn01 {
    font-size: calc(16px + (22 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 600;
    border: none;
    background-color: unset !important;
    text-align: left;
    padding-left: 0.7em;
    padding-bottom: 0.7em;
    
}
a[download] {
    font-size: calc(14px + (18 - 14) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 600;
    padding-left: 30px;
    padding-top: 4px;
    display: block;
    
    background: url(../img/download-light.svg);
    background-size: 25px;
    background-repeat: no-repeat;
    background-position: top bottom;
    color: #000000;
  }
  
  a[download]::before {
    margin: 0 0 7px 50px;
    color: #000000;

  }
  
  a[download]:hover,
  a[download]:focus {
    text-decoration: none;
  }
/* Newsletter */
.newsletter{
    background-size: cover;
    background-position: center;
}
/* Link images */
.linkImage {
    height:563px;
    position: relative;
    font-size: 30px;
    transition: 0.5s ease;
    font-weight: 600;
    background-position: center;
    background-size: cover;
}
.linkImage p {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-weight: 800;
    font-size: calc(40% + 1vw + 1vh);
    text-transform: uppercase;
    /*text-shadow: 0 0 1em #ffffff, 0 0 1em #ffffff, 0 0 1em #ffffff;*/
    /*text-shadow:
    0 0 5px #fff,
    0 0 10px #fff,
    0 0 20px #fff,
    0 0 40px #1D71B8,
    0 0 80px #1D71B8,
    0 0 90px #1D71B8,
    0 0 100px #1D71B8,
    0 0 150px #1D71B8;*/
    text-shadow:1px 1px 20px #fff, 1px 1px 20px #ccc;
}
.linkImage a:hover {
    text-decoration: none !important;
}
.linkImage:hover {
    font-size: 35px;
}
.linkImage:hover .overlay {
    opacity: 0;
    font-size: 35px;
}
.overlay {
    background-color: rgba(0, 0, 0, .5);
    opacity: 0.5;
    position:absolute;
    height: 100%;
    width: 100%;
    transition: 0.5s ease;
}
/* Footer */
footer{
    background-color:#000;
    padding-top: 50px;
    padding-bottom: 100px;
    color:#ffffff;
    font-size: calc(12px + (14 - 12) * ((100vw - 300px) / (1920 - 300)));
}
h1.footer {
    font-weight: 600;
    font-size: calc(14px + (15 - 14) * ((100vw - 300px) / (1920 - 300)));
    margin-bottom: 10px;
}
footer a, footer a:hover {
    color:#ffffff;
    text-decoration: none;
}
.seperator {
    margin:0 25px;
    color:#ffffff;
    text-decoration: none;
}

/* Cards */
.card {
    background-color: unset !important;
    border: 0 !important;
    margin-bottom: 10px;
}

h1.card {
    margin-bottom: 0 !important;
    margin-top: 15px;
    line-height: unset;
}
.card-body {
    padding: 1em !important;

}

.card-header:first-child {
    border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0;
}
.card-header {
    padding: 0;
    margin-bottom: 0;
    background-color: rgba(70, 70, 70, 0.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
    border-top: 1px solid rgba(0,0,0,.125);
    line-height: 1.0;
}
.card-body > ul {
    list-style: none;
    /*padding: 0;*/
}
.card-body > ul > li.feature-av:before {
    content: "\f00c"; /* FontAwesome Unicode */
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    margin-left: -1.3em; /* same as padding-left set on li */
    width: 1.3em; /* same as padding-left set on li */
    color: #1d71b8;
}
.card-body > ul > li.feature-na:before {
    content: "\f00c"; /* FontAwesome Unicode */
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    margin-left: -1.3em; /* same as padding-left set on li */
    width: 1.3em; /* same as padding-left set on li */
    color: #f88501;
}
.card-body > ul > li.feature-na {
    /* text-decoration:line-through; */
}
.card .card-badge {
    position:absolute;
    top: -4px;
    right: -4px;
}
.card-body-vids {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.25rem;
}


section.scroller {
    padding-top: 20px;
/*    padding-bottom: 41px; */
/*  BB Boris 20.02.2020:  Auf 5 px reduziert*/
    padding-bottom: 20px;
}


 .bg-dark {
    background-color: #464646 !important;
}
.bg-blue {
    background-color: #1f71b8 !important;
}
 .ImgFlow {
    background-image: url("../img/img_flow01.png");
    background-repeat: no-repeat;
    background-position: 10%;
  }


/*
 * Extra utilities
 */

 .flex-equal > * {
    -ms-flex: 1;
    flex: 1;
  }
  @media (min-width: 768px) {
    .flex-md-equal > * {
      -ms-flex: 1;
      flex: 1;
    }
  }
  
  .overflow-hidden { overflow: hidden; }

  .list-group-item:first-child {
    border-top-left-radius: .0rem;
    border-top-right-radius: .0rem;
}
  .list-group-item {
    position: relative;
    display: block;
    padding: .0rem 1.25rem;
    background-color: #fff;
    border: none;
}
.list-group-item-action {
    width: 100%;
    color: #464646;
    text-align: inherit;
    background-color: #FFF;
}
.list-group-item:hover {
    background:#fff;
}
.list-group-item:visited {
    background:#fff;
}
.list-group-item:active {
    background:#fff;
}
/*Video*/

Vid {
  position: relative;
  background-color: black;
  height: 75vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

Vid video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

Vid .container {
  position: relative;
  z-index: 2;
}

Vid .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0.5;
  z-index: 1;
}

@media (pointer: coarse) and (hover: none) {
  Vid {
    background: url('http://sandbox.thewikies.com/vfe-generator/images/big-buck-bunny_poster.jpg') black no-repeat center center scroll;
  }
  Vid video {
    display: none;
  }
}