/*
---------------------------------------------
Base Template - v 2.1.0
---------------------------------------------
 */
@import url("print.css") ;
@import url("../Fonts/fa/fa-all.css");

* {
    margin: 0;
    padding: 0;
}

html, body {
    width: 100%;
    margin: auto;
}

header section div{
    padding: 0.2% !important;
}

html, body,
.mm-page,
.inner-global-wrap,
#global-wrap,
.fixed-width{
    height: 100%;
}

.inner-global-wrap > a,
a[id^="c"]{
    float: left;
    width: 100%;
    position: relative;
    top: -180px;
}


.fixed-width {
    width: 100%;
    margin: auto;
    display: block;
    float: left;
    box-sizing: border-box;
}

.box-content,
.background-video-container{
    width: 100%;
    box-sizing: border-box;
}

/* ---------  Redaktionele klassen ---------*/



.content-bottom > div{
    bottom: 0;
    position: absolute;
}

.no-padding,
.no-padding > div,
.no-padding > div > section {
    padding: 0 0 0 0 !important;
}

.no-padding div form div.control-group{
    padding: 2%;
}

.content-box-1{
    width: 100%;
    height: 100% !important;
    float: left;
}

.responsive-box {
    width: 300px;
    height: 30px;
    padding: 20px;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1000;
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
    display: none;
}

#global-wrap {
    opacity: 0;
    visibility: visible;
}

#global-wrap > a{
    float:left;
}

.box-bg,
.box-bgimage{
    box-sizing: border-box;
}

.right {
    float: right;
}

.center {
    margin: auto;
}

.same-col-height .bgimage{
    height: 100%;
}

.bgimage {
    overflow: hidden;
    position: absolute;
    padding-bottom: 0;
}

.bgimage > img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.box-bgimage {
    overflow: hidden;
}

.box-bgimage img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.bgmap {
    position: relative;
}

#player{
    width: 1300px;
}

/* ------------ Main-Header ------------------------------------------------------------------------  */
header {
    position: fixed;
    top: 0;
    z-index: 3;
    width: 1300px;
    display: inline-block;
    padding: 0;
    opacity: 0;
    float: none;
    left: 50%;
}

header div:first-child > .box-content {
    float: left;
}

header .section:first-child img {
    margin: 7px 0 0 10px;
}

header div:last-child > .box-content {
    float: right;
}

header svg {
    max-height: 90px;
    margin-top: 10px;
}

header section {
    position: relative;
    float: none;
    display: flex;
    /*left: 50%;*/
}



/* ------------ Basic Typografie ------------------------------------------------------------------------  */


p.align-left,
h1.align-left,
h2.align-left,
h3.align-left,
h4.align-left,
h5.align-left,
h6.align-left,
td.align-left,
p.text-left,
h1.text-left,
h2.text-left,
h3.text-left,
h4.text-left,
h5.text-left,
h6.text-left,
td.text-left,
input[type=text],
input[type=checkbox],
#nav li ul li a {
    text-align: left !important;
}

p.align-center,
h1.align-center,
h2.align-center,
h3.align-center,
h4.align-center,
h5.align-center,
h6.align-center,
td.align-center,
p.text-center,
h1.text-center,
h2.text-center,
h3.text-center,
h4.text-center,
h5.text-center,
h6.text-center,
td.text-center,
.info-button-small,
a.info-button-small,
li a.info-button-small,
p a.info-button-small,
.input-1, .input-2,
.select-1,
.teaser-box-4 .teaser-content,
.ts-skin tbody td .lead-button-big,
.center {
    text-align: center !important;
}

p.align-right,
h1.align-right,
h2.align-right,
h3.align-right,
h4.align-right,
h5.align-right,
h6.align-right,
td.align-right,
p.text-right,
h1.text-right,
h2.text-right,
h3.text-right,
h4.text-right,
h5.text-right,
h6.text-right,
td.text-right,
.header-navi {
    text-align: right !important;
}

p.align-justify,
h1.align-justify,
h2.align-justify,
h3.align-justify,
h4.align-justify,
h5.align-justify,
h6.align-justify,
td.align-justify {
    text-align: justify;
}


input[type=buttom],
input[type=submit],
input[type=text],
input[type=textfield]{
    border-radius: 0;
    -webkit-appearance: none;
}

div.additional-text-margin {
    padding: 6% !important;
}

.vert-center .additional-text-margin{
    padding-bottom: 0 !important;
}

.big-button,
.info-button-big,
.info-button-big-hback,
input[type=submit],
.lead-button-big,
.lead-button-big-hback,
a.button, a.button-1,
.button-file,
.lead-button {
    white-space: nowrap;
    display: inline-block;
    padding: 10px 20px 10px 20px;
    margin: 0 0 10px 0;
    cursor: pointer;
    transition: background-color 0.4s, padding 0.4s, color 0.4s, text-shadow 0.4s;
}

.lead-button-big:after{
    content: url('../Images/btn-arrow-right.png');
    width: 10px;
    height: 16px;
}

input[type=submit].lead-button-big{
    background-image: url('../Images/btn-arrow-right.png');
    background-repeat: no-repeat;
    background-position: 90%;
    width: auto;
    padding-right: 40px;
    font-weight: 500;
}

.lead-button-big:after,
.info-button-big:after{
    position: relative;
    top: 2px;
    left: 7px;
}

.lead-button-big:hover,
.info-button-big:hover,
a.button:hover,
a.button-1:hover,
.lead-button-big-hback:hover,
.info-button-big-hback:hover,
.lead-button:hover {
    padding: 10px 10px 10px 30px;
}

.btt section{
    padding: 0;
}

/* ------------ boxed content ------------------------------------------------------------------------------------ */

.box-content{
    float: left;
}

.box-content img {
    width: 100%;
    display: block;
}

/* --------------  Modal ------------------ */

.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    opacity: 0;
    display: none;
}

.modal > .modal-wrapper {
    width: 50%;
    margin: 10% auto;
    position: relative;
    box-sizing: border-box;
    display: block;
}

.modal-wrapper .fixed-width {
    width: 100%;
}

.btn-close {
    width: 40px;
    height: 40px;
    background: url(../Images/close-modal-window.svg) no-repeat center;
    display: block;
    position: absolute;
    top: 25px;
    right: 22px;
    z-index: 50;
    cursor: pointer;
}

.modal-wrapper .fixed-width section .col_12:first-child {
    box-sizing: border-box;
    padding: 30px;
}

.mobile-contact-navi {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    box-sizing: border-box;
    padding: 10px;
    text-align: center;
    z-index: 1001;
    border-top: 1px solid #ccc;
}

/* --------------  to sort ------------------ */

.background-video-container{
    width: 100%;
    height: 100%;
    float: left;
}

.slider {
    height: 460px;
    float: left;
}

#back-to-top img {
    width: 70%;
    padding: 15%;
}

/* ----------------  Suche  ----------------------*/

.tx-indexedsearch-icon,
.tx-indexedsearch-info,
.tx-indexedsearch-searchbox,
.tx-indexedsearch-rules{
    display: none;
}

.tx-indexedsearch-title a {
    display: block;
    font-weight: 700;
    font-size: 22px;
    margin-top: 20px;
}

ul.browsebox, .tx-indexedsearch-browsebox{
    float: left;
    display: block;
    width: 100%;
    margin: 0;
}

.browsebox li{
    float: left;
    list-style-type: none;
    margin: 0 10px 0 0;
}
.browsebox li a{
    display: block;
    padding: 15px;
    background-color: #eee;
}

.chosen-results li,
.chosen-single span,
.controls li,
label,
.content-box h1,
.content-box h2,
.content-box h3,
.content-box h4,
.content-box h5,
.content-box h6,
.content-box p,
.content-box li,
section div.background-video-container,
section div .box-content h1,
section div .box-content h2,
section div .box-content h3,
section div .box-content h4,
section div .box-content h5,
section div .box-content h6,
section div .box-content p,
section div .box-content li{
    text-align: left;
}

.controls input[type=submit]{
    float: left;
}



/* ------------ Sidebar Navi ------------------------------------------------------------------------------------ */
.sidebar-navi, .conversion-navi{
    float: left;
    width: 100%;
}

.sidebar-navi ul > li, .conversion-navi ul > li{
    width: 100%;
    float: left;
    list-style-type: none;
}

.sidebar-navi ul > li:last-child, .conversion-navi ul > li:last-child{
    border-bottom:none;
}

.sidebar-navi ul > li > a, .conversion-navi ul > li > a {
    display: inline-block;
    float: left;
    padding: 15px 15px 15px 10px;
    width: 100%;
    box-sizing: border-box;
}

.sidebar-navi ul > li > a > i, .conversion-navi ul > li > a > i{
    width: 40px;
}

/* ------------ Footer ------------------------------------------------------------------------------------ */
footer h4 {
    margin: 0;
}

footer ul {
    margin: 0;
}

footer li {
    margin: 0 0 2px 0;
    list-style-type: none;
}

footer .box-content ul li {
    list-style-type: none;
}

footer a {
    transition: color 0.3s ease;
}

.error input[type=text]{
    background-color: #ffe3e3;
    color: #f00;
    border: 1px solid #f00;
}

.error span:before{
    content:url(../Images/icon-form-error.svg);
    width: 30px;
    height: 30px;
    position: absolute;
    left: -26px;
    top: 0;
}

/* ---------------   Grid Slider -------------------- */

.gridslider .slick-slide {
margin: 0 10px;
}

.gridslider .slick-prev, .gridslider .slick-next{
    top: auto !important;
    bottom: -45px !important;
    width: 40px;
    height: 40px;
}

.gridslider .slick-next {
    right: 10px;
}

.gridslider .slick-prev{
    left: auto !important;
    right: 70px !important;
}

.gridslider .slick-prev::before, .gridslider .slick-next::before{
    font-size: 0 !important;
}

.gridslider .slick-slider {
    padding: 10px 0;
}

.gridslider .slick-track {
    margin: 10px 0;
}

/* ------------ smartphone ------------------------------------------------------------------------------------ */
@media screen and (min-width: 0px) and (max-width: 720px) {

    html, header {
        opacity: 1 !important;
    }

    header{
        height: 60px;
        width: 100%;
        overflow: hidden;
        left: 0 !important;
        margin-left: 0 !important;
      /*  z-index: 0;*/
    }

    #mobile-mainnavi{
        top: 0;
    }

    .mobile-only{
        display: block !important;
    }

    .desktop-only{
        display: none !important;
    }

    .bgimage > img {
        width: 100%;
    }

    .mobile-contact-navi {
        display: block;
    }

    .mobile-contact-navi img {
        height: 100%;
    }

    .modal > .modal-wrapper {
        margin-top: 6%;
        width: 90%;
    }

    .blind {
        display: none;
    }

    #back-to-top {
        display: none !important;
    }

    input, textarea {
        font-size: 16px;
    }

    .bgimage > img {
        width: 230%;
        left:-50%;
    }

    section{
        padding-left:20px !important;
        padding-right:10px !important;
    }

    section, .mm-page, .inner-global-wrap, footer {
        width: 100%;
        box-sizing: border-box;
    }

    .background-video-container{
        display: none;
    }

    header section:last-child {
        box-shadow: none;
    }

    .inner-global-wrap > a{
        top: -20px;
    }
}

/* ------------ tablet portrait ------------------------------------------------------------------------------------ */
@media screen and (min-width: 721px) and (max-width: 800px) {
    /* tablet portrait */

    .modal > .modal-wrapper {
        width: 90%;
    }

    header, .mm-page, .inner-global-wrap, footer, #player {
        width: 100%;
        box-sizing: border-box;
        /*padding: 2%;*/
    }

}

/* ------------ tablet landscape ------------------------------------------------------------------------------------ */
@media screen and (min-width: 801px) and (max-width: 1024px) {

    .modal > .modal-wrapper {
        margin: 2% auto;
    }

    .modal > .modal-wrapper {
        width: 70%;
    }

    header, .mm-page, .inner-global-wrap, footer, #player {
        width: 100%;
        box-sizing: border-box;
        /* padding: 5%;*/
    }
}

/* ------------ small-Size Desktop ------------------------------------------------------------------------------------ */
@media screen and (min-width: 1025px) and (max-width: 1440px) {

}

/* ------------ Mid-Size Desktop ------------------------------------------------------------------------------------ */
@media screen and (min-width: 1441px) and (max-width: 1920px) {

}

/* ------------ big-Size Desktop ------------------------------------------------------------------------------------ */
@media screen and (min-width: 1921px) and (max-width: 5200px) {

}

/* ------------ Desktop General ------------------------------------------------------------------------------------ */
@media screen and (min-width: 721px) and (max-width: 5200px) {
    .desktop-only{
        display: block !important;
    }

    .mobile-only{
        display: none !important;
    }

    .box-content p span.h1,
    .box-content p span.h2,
    .box-content p span.h3,
    .box-content p span.h4,
    .box-content p span.h5,
    .box-content p span.h6{
        padding: 0 !important;
    }
}

@media screen and (min-width: 721px) and (max-width: 5200px) {
    #mobile-mainnavi{
        display: none;
    }
}