/*--------------------------------------------------------------------------------------------------------------------*/
/*Fonts*/
/*--------------------------------------------------------------------------------------------------------------------*/
@font-face {
    font-family: 'melior';
    src: url('../fonts/melior/melior-webfont.eot');
    src: url('../fonts/melior/melior-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/melior/melior-webfont.woff') format('woff'),
    url('../fonts/melior/melior-webfont.ttf') format('truetype');
}

/*--------------------------------------------------------------------------------------------------------------------*/
/* FM */
/*--------------------------------------------------------------------------------------------------------------------*/

.topper { background: #efefef; padding: 15px 0; }

.controlsx { position: fixed; bottom: 0; left: 0; height: 100px; width: 100%; }
.controlsx a { display: block; float: left; height: 100px; width: 50%; font-size: 50px; color: #fff; padding-top: 20px; }

.bg-rot { background: #ca2f56; }
.bg-gruen { background: #8cd000; }

/*--------------------------------------------------------------------------------------------------------------------*/
/*HTML, Body etc.*/
/*--------------------------------------------------------------------------------------------------------------------*/
html {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}
body {
    background: #fff; /* Old browsers */

    font-family: melior;
    width: 100%;
    height: 100%;

    font-size: 30px;
    margin: 0;
    padding: 0;
    overflow:hidden;
}
/*--------------------------------------------------------------------------------------------------------------------*/
/* Buttons CSS */
/*--------------------------------------------------------------------------------------------------------------------*/
.btn {
    font-size: 12px;
    border-radius: 0px;
}
.btn-danger{
    background-color: #ca2f56;
    font-size: 20px;
}

.btn-danger:hover
{
    background-color: #ca2f56; !important;
    border-color: #ca2f56; !important;
}
.btn-success{
    background-color: #8cd000;
    font-size: 20px;
    border-color: #8cd000;
}
.btn-success:hover
{
    background-color: #8cd000; !important;
    border-color: #8cd000; !important;
}
.btn-default{
    font-size: 20px;
}
/*--------------------------------------------------------------------------------------------------------------------*/
/* Header */
/*--------------------------------------------------------------------------------------------------------------------*/
#startseite_header
{
    background-color:#ffffff;
}
/*--------------------------------------------------------------------------------------------------------------------*/
/* Menu */
/*--------------------------------------------------------------------------------------------------------------------*/
.menubutton.top{
    padding-top: 100px;
}
/*--------------------------------------------------------------------------------------------------------------------*/
/* Content */
/*--------------------------------------------------------------------------------------------------------------------*/
#content_box{
    padding-left: 10px;
}
.content{

}
.box {
}

.center-block{
    float:none;
}

.vertical-center{
    min-height: 50%;  /* Fallback for browsers do NOT support vh unit */
    min-height: 50vh; /* These two lines are counted as one 🙂       */
    display: flex;
    align-items: center;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*Categories Page*/
/*--------------------------------------------------------------------------------------------------------------------*/
.headline{
    text-align: center;
}

.cat-box{
    height: 991px;
    background-image: url('../pics/bg.png');
    width: 1024px;
    background-position: center;
    background-repeat: no-repeat;

}


.cat-overlay{
    position: absolute;
    top:33.333%;
    width: 1024px;
    height: 300px;
    background-color: #FFFFFF;
    opacity: 0.9;
    box-shadow: 6px 6px 6px #e1edf7;

}

.categories-text{

    padding: 10px;

}

.categories{

    width: 100%;
    padding-right: 0px;
}

a.category-link{

    width: 250px;
    height: 250px;
    padding: 5px 5px 0px 5px;
    opacity: 1.0;
    margin: 50px;
    display: block;
    color: #000;
    text-decoration: none;
    box-shadow: 6px 6px 0px 0px #b2bec8;
    text-align: center;
}

a.category-link:hover{
    opacity: 0.7;
}

.cat-image {
    max-height: 400px;
    overflow: hidden;
    padding: 0;
}

.cat-image img{



}

.cat-footer{
    margin: 3px;
    font-size: 24px;
}
/*--------------------------------------------------------------------------------------------------------------------*/
/*Questions*/
/*--------------------------------------------------------------------------------------------------------------------*/
.headline-right{
    color:#8cd000;
}

.headline-wrong{
    color:#ca2f56;
}

.answers-box{
    counter-reset: alpha;
    padding-left: 0;
}



a.answers{
    border:1px solid #efefef;
    padding: 0px;
    margin-bottom: 30px;
    line-height: 1;
    width: 100%;
    display: block;
    text-align: left;
    text-decoration: none;
    color: #000000;
}



.answers.active{
    background-color: #efefef;

}

.box h2 {
    margin-bottom: 10px;
    margin-top: 10px;
    font-size: 36px;
    line-height: 1.2;
    width: 66%;
}

.bstabe{
    padding: 0;
    border-right: 5px solid #000000;
    text-align: center;
    width: 120px !Important;
    height: 120px;
    background-color: #efefef;
    min-height: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align : center;
    -webkit-align-items : center;
    -moz-box-align : center;
    -ms-flex-align : center;
    align-items : center;
    width: 100%;
    -webkit-box-pack : center;
    -moz-box-pack : center;
    -ms-flex-pack : center;
    -webkit-justify-content : center;
    justify-content : center;
}

.bstabe::before {
    counter-increment: alpha;
    content:"" counter(alpha, upper-alpha)" ";
    font-size: 80px;
    color: #FFFFFF;
}

.antwort {
    padding-top: 26px;
    font-size: 30px;
}

.image{

}

.q-box-right{
    padding-top: 0px;
    font-size: 25px;

}

.q-box-wrong{
    padding-top: 0px;
    font-size: 25px;
}

.q-box-inner{
    padding-top: 40px;
}
/*--------------------------------------------------------------------------------------------------------------------*/
/*Endcard*/
/*--------------------------------------------------------------------------------------------------------------------*/
#endcard_box{

}
#endcard_box .points {
    font-size: 40px;
    padding-top: 15%;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*Footer*/
/*--------------------------------------------------------------------------------------------------------------------*/
footer {
    position: relative;
    margin-top: -150px; /* negative value of footer height */
    height: 150px;
    clear:both;
    padding-top:20px;
    text-align: center;
    font-size:10px;
}
/*--------------------------------------------------------------------------------------------------------------------*/
/*Media Queries*/
/*--------------------------------------------------------------------------------------------------------------------*/
@media (min-width: 1200px){
    .col-lg-2 {
        width: 12.66666667%;
    }
}
/*--------------------------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------------------------------------------*/
/* FM :: 21.01.2019 11:24:11 */
/*--------------------------------------------------------------------------------------------------------------------*/

.no-padding { padding-left: 0; padding-right: 0; }
.no-margin { margin-left: 0; margin-right: 0; }
.catxgories { display: inline; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin-top: 300px;}
.lang-box { width: 272px; float: left; padding: 8px; margin-right: 30px; }
.lang-box .inner { text-align: center; }