@import url('https://fonts.googleapis.com/css?family=Lato:400,700,900&display=swap');

body {
    font-family: 'Lato', sans-serif;
    color: #333;
    letter-spacing: .02em;
}

#main {
    margin-top:56px !important;
}

#schuetzen {
    margin-top:56px !important;
}

.greenColor {
    color: #65B32E;
}

.greenBgColor {
    background-color: #65B32E;
}

.darkGreyColor {
    color: #293D4F;
}

.darkGreyBgColor {
    background-color: #293D4F;
}

.lightGreyColor {
    color: ##B1C1D0;
}

.lightGreyBgColor {
    background-color: ##B1C1D0;
}

.infoBgColor {
    background-color: #B1C1D0;
}

h1, h2 {
    font-weight:900;
}

.regTxt {
    font-size: 1rem;
}

.errorTxt {
    font-size: 1.5rem;
}

.navigation {
    background-color: #494949;
}

.mobiHero {
    background-size: cover;
    background-repeat: no-repeat;
    height:500px
}


.title {
    font-size:2rem;
    line-height: 2.2rem;
    font-weight:900;
    color: #65B32E;
}

.darkGreyTitle {
    color: #494949;
    font-size:2.4rem;
    line-height: 2.6rem;    
}

a.navLink, a.navLink:visited, a.navLink:active {
    font-size: 1rem;
    color: #fff !important;
}

a.navLink:hover {
    color: #65B32E !important;
    text-decoration: none;
}

.teaserBgImg {
    background-image: url(/assets/img/hero.png);
    background-size: contain;
}

.collapseTitle {
    font-size: 1rem;
}

[data-toggle="collapse"] .fa:before {  
    content: "\f106";
}
  
  [data-toggle="collapse"].collapsed .fa:before {
    content: "\f107";
}

.accordeonList > li {
    font-size:1rem;
    display: block;
    text-transform: none;
}

.accordeonList > li .fa:before {
    content: "\f061";
}

.mediapubItem {
    background: rgba(73, 73, 73, .5);
    bottom:0;
}

.btnTxt {
    font-size: 1.5rem;
    font-weight:900;
    color: #fff;
}

.actionButton {
    position: fixed; 
    right: 1rem; 
    top: 3rem;
    background-color: #ddd;
    border-radius: 0.5rem;    
}

.platformLink {
    background-color: #FFC300; 
}

a.actionLink, a.actionLink:visited, a.actionLink:active {
    font-size: 2rem;
    font-weight: 900;
    color: #fff;
}

a.actionLink:hover {
    text-decoration: none;
}

a:link, a:visited, a:active {
    color: #65B32E;
  }
  
a:hover {
    text-decoration: underline;
}

a.footerlink, a.footerlink:visited {
    color: #fff;
}

a.sociallink, a.sociallink:visited {
    color: #aaa;
}

a.sociallink:hover {
    color: #65B32E;
}

.countdown {
    background-color: #B1C1D0;
    color: #fff;
    margin: 0 auto;
    padding: 0.5rem;
    text-align: center;
  }

  .countdownInvert {
    color: #65B32E;
    margin: 0 auto;
    padding: 0.5rem;
    text-align: center;
  }  

li {
    display: inline-block;
    font-size: 1.5em;
    list-style-type: none;
    padding: 1em;
    text-transform: uppercase;
}

li span {
    display: block;
    font-size: 4.5rem;
    font-weight: 900;
}

.footerTxt {
    font-size:0.8rem;
}

.storyTxt {
    color: #293D4F;
}

.storyCite {
    height:100px;
}

.absCentered {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)    
}

.pointer {
    cursor: pointer;
}

.card-header {
    background-color: #B1C1D0;
}

.card-header > a {
    color: #293D4F;
    text-decoration: none;
}

.card-headerDark {
    background-color: #293D4F;
}

.card-headerDark > a {
    color: #fff;
    text-decoration: none;
}

.btn-primary {
    border-color: #65B32E;
    background-color: #65B32E;
}

.btn-primary:hover {
    border-color: #5b9b1e;
    background-color: #5b9b1e;
}

.btn-story {
    border-color: #65B32E;
    background-color: #fff;
    color: #5b9b1e;
    font-size:0.75rem;
    letter-spacing: .3em;
}

.btn-story:hover {
    border-color: #5b9b1e;
    background-color: #5b9b1e;
    color: #fff;
}

.owl-nav {
    display: grid;
}

.prev-slide {
    background: url(/assets/img/circle-left.png) center center;
    position: absolute;
    width: 50px;
    height: 50px;
    transform: translateY(-50%);
    left: -5%;
    top: 50%;
}

.next-slide {
    background: url(/assets/img/circle-right.png) center center;
    position: absolute;
    width: 50px;
    height: 50px;
    transform: translateY(-50%);
    right: -5%;
    top: 50%;
}

.prev-slide-bow {
    background: url(/assets/img/circle-left-bow.png) center center;
    position: absolute;
    width: 50px;
    height: 50px;
    transform: translateY(-50%);
    left: -5%;
    top: 50%;
}

.next-slide-bow {
    background: url(/assets/img/circle-right-bow.png) center center;
    position: absolute;
    width: 50px;
    height: 50px;
    transform: translateY(-50%);
    right: -5%;
    top: 50%;
}

@keyframes bouncy {
    0%{top:0em}
    40%{top:0em}
    43%{top:-0.9em}
    46%{top:0em}
    48%{top:-0.4em}
    50%{top:0em}
    100%{top:0em;}
}

.bouncy {
    animation: bouncy 3s infinite linear !important;
    position: relative !important;
}

a.buttonSpecial{
    display:inline-block;
    padding:0.35em 1.2em;
    border:0.1em solid #fff;
    background-color: #56bce8;
    margin:0 0.3em 0.3em 0;
    border-radius:0.12em;
    box-sizing: border-box;
    text-decoration:none;
    color:#fff;
    text-align:center;
    transition: all 0.2s;
}

a.buttonSpecial:hover {
    color:#56bce8;
    background-color:#fff;
    border:0.1em solid #56bce8;
}

@media all and (max-width:30em){
 a.buttonSpecial {
    display:block;
    margin:0.4em auto;
 }
}

/* video slider */
.video-thumbnail {
    position: relative;
    display: inline-block;
    cursor: pointer;
}
.video-title {
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);    
}
.video-thumbnail:before {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: scale(.8) translate(-70%, -70%);
    -webkit-transform: scale(.8) translate(-70%, -70%);
    content: url('/assets/img/play.svg');
    color: #fff;
    opacity: .5;
}
.video-thumbnail:hover:before {
    color: #eee;
    content: url('/assets/img/play-hover.svg');
    opacity: 1;
}

@media screen and (max-width:720px) {

    #main {
        margin-top:155px !important; 
    } 

    h1 {
        font-size: 2.5rem;
    }    

    ul {
        padding: 0px;
    }

    li {
        display: inline-block;
        font-size: 1rem;
        list-style-type: none;
        
        text-transform: uppercase;
    }

    li span {
        display: block;
        font-size: 2rem;
    }

    .title {
        font-size:1.6rem;
        line-height: 1.8rem;
        font-weight:900;
        color: #65B32E;
    }    
    
}