html {
    position: relative;
    min-height: 100%;
    overflow-y: scroll;
    -webkit-transition: background-color 1s;
    transition: background-color 1s
}

html.loading {
    /* Replace #333 with the background-color of your choice */
    /* Replace loading.gif with the loading image of your choice */
    background: #333 url('../img/ajax-loader.gif') no-repeat 50% 50%;
    /* Ensures that the transition only runs in one direction */
    -webkit-transition: background-color 0.5s ease;
    transition: background-color 0.5s ease;
}

body {
    font: normal 16px 'Roboto', sans-serif;
    background-color: #fff;
    color: #000;

    -webkit-transition: opacity 1s ease-in;
    transition: opacity 1s ease-in;
    text-rendering: optimizeLegibility;
}

html.loading body {
    /* Make the contents of the body opaque during loading */
    opacity: 0;

    /* Ensures that the transition only runs in one direction */
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
}

 p {
     font-weight: 300!important;
 }

.startslides {
    position: relative;
}

@media (max-width: 767px) {
    .loader {
        display: none;
    }
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.container-fluid {
    max-width: 1900px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 3em;
    padding-right: 3em;
    position: relative;
}

@media (max-width: 991px) {
    .container-fluid {
        padding-left: 15px;
        padding-right: 15px;
    }
}

.footer {
    position: relative;
    bottom: 0;
    width: 100%;
    height: auto;
    color: #000;
    background-color: #fff;
    margin: 40px 0 0 0;
    padding: 30px 0;
    border-top: 1px solid #f2f2f2;
}


@media (max-width: 991px) {
    .footer {
        position: relative;
        bottom: 0;
        width: 100%;
        height: auto;
        color: #000;
        background-color: #fff;
        margin:10px 0 0 0;
        padding: 30px 0;
        border-top: 1px solid #f2f2f2;
    }
}


.footer .row {
    margin-left: -25px;
    margin-right: -25px;
}

.footer p {
     line-height: 1.2em;
     font-size: .8em;
}

.footer a {
    color: #000;
    font-size: .9em;
}


.footer > .container {
    padding-right: 15px;
    padding-left: 15px;

}

.footer .copyright {
    margin-top: 15px;
}


h1,h2,h3,h4,h5,p,li,a {
    color: #000;
    /*text-shadow: 2px 2px 1px rgba(0, 0, 0, 1);   */
}



.navbar-custom {
    background-color: #fff;
    border-color: #fff;
    padding: 20px 0;
    height: 80px;
    z-index: 999;
}

@media (max-width: 767px) {
    .navbar-custom {
        background-color: #fff;
        border-color: #fff;
        padding: 20px 0;
        height: 65px;
        z-index: 999;
    }
}

body.home > .navbar-custom {
    top: -200px;
    background-color: transparent;
    border-color: transparent;
}

body.home > .navbar-home {
   top: 0;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    background-color: #fff;
}


.navbar-custom .navbar-brand {
    color: #fff;
}
.navbar-custom .navbar-brand:hover,
.navbar-custom .navbar-brand:focus {
    color: #c0c0c0;
    background-color: transparent;
}

.navbar-custom .navbar-nav {
    float: right;
    margin-top: 10px;
    position: relative;
}



.navbar-custom .navbar-nav > li {
    display: inline;
    margin:0;
    padding:0;
    position: static;
}


.navbar-custom .navbar-nav > li > a {
    display: block;
    font-size: 1em;
    text-transform: uppercase;
}

.navbar-custom .navbar-nav > li + li {
   /* border-left: 1px solid #fff;*/
    margin-left:.5em;
    padding-left:.5em;
}

.navbar-custom .navbar-nav > li.home-mobil + li {
    border: none;
}


@media (max-width: 992px) {


    .navbar-custom .navbar-nav {
        float: none;
        margin:30px 0 30px 0;
        padding:0;
        background-color: #fff;
    }

    .navbar-custom .navbar-nav  > li {
        display: block;
        margin:0;
        padding:0;
        position: relative;
        border-bottom: 1px solid #f1f1f1;
    }

    #navbar {
        background-color: #fff;
        margin: 0 -5px 0 -5px;
        padding: 10px;
    }


    .navbar-custom .navbar-nav > li + li {
        border-left: none;
        margin-left:0;
        padding-left:0;
    }



}

/*
.navbar-custom .navbar-nav > li + li:before {
    content: " | ";
}
*/


.navbar-custom .navbar-nav > li > a {
    color: #000;
    margin:0;
    padding:0;
    display: block;
}
.navbar-custom .navbar-nav > li > a:hover,
.navbar-custom .navbar-nav > li > a:focus {
    color: #c0c0c0;
    background-color: transparent;
}
.navbar-custom .navbar-nav > .active > a,
.navbar-custom .navbar-nav > .active > a:hover,
.navbar-custom .navbar-nav > .active > a:focus {
    color: #000;
    background-color: transparent;
    border-bottom: 2px solid #000;
}
.navbar-custom .navbar-nav > .disabled > a,
.navbar-custom .navbar-nav > .disabled > a:hover,
.navbar-custom .navbar-nav > .disabled > a:focus {
    color: #ccc;
    background-color: transparent;
}

@media (max-width: 992px) {

    .navbar-custom .navbar-nav li > a {
        color: #000;
        border-bottom: none;
        line-height: 2em;
        padding: 0 10px;
    }


    .navbar-custom .navbar-nav li > a:hover,
    .navbar-custom .navbar-nav li > a:focus {
        color: #000;
        background-color: #f1f1f1;
    }

    .navbar-custom .navbar-nav > .active > a,
    .navbar-custom .navbar-nav > .active > a:hover,
    .navbar-custom .navbar-nav > .active > a:focus {
        color: #000;
        background-color: #f1f1f1;
        border-bottom: none;
        line-height: 2em;
    }
}


.navbar-custom .navbar-toggle {
    border-color: transparent;
    background-color: inherit;
    position: relative;
    z-index: 1000;
    margin-top: 0;
}
.navbar-custom .navbar-toggle:hover,
.navbar-custom .navbar-toggle:focus {
    background-color: #ddd;
}
.navbar-custom .navbar-toggle .icon-bar {
    background-color: #888;
}
.navbar-custom .navbar-collapse,
.navbar-custom .navbar-form {
    border-color: #e7e7e7;
}
.navbar-custom .navbar-nav > .open > a,
.navbar-custom .navbar-nav > .open > a:hover,
.navbar-custom .navbar-nav > .open > a:focus {
    color: #555;
    background-color: #e7e7e7;
}
@media (max-width: 767px) {
    .navbar-custom .navbar-nav .open .dropdown-menu > li > a {
        color: #777;
    }
    .navbar-custom .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-custom .navbar-nav .open .dropdown-menu > li > a:focus {
        color: #333;
        background-color: transparent;
    }
    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #555;
        background-color: #e7e7e7;
    }
    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #333;
        background-color: transparent;
    }
}
.navbar-custom .navbar-link {
    color: #777;
}
.navbar-custom .navbar-link:hover {
    color: #333;
}
.navbar-custom .btn-link {
    color: #777;
}
.navbar-custom .btn-link:hover,
.navbar-custom .btn-link:focus {
    color: #333;
}
.navbar-custom .btn-link[disabled]:hover,
fieldset[disabled] .navbar-custom .btn-link:hover,
.navbar-custom .btn-link[disabled]:focus,
fieldset[disabled] .navbar-custom .btn-link:focus {
    color: #ccc;
}



ul.subnav {
    position: absolute;
    right: 0;
    margin: 10px 0 0 0;
    padding:0;
    /**/display: none;
}


.subnav > li {
    display: inline-block;
    margin: 0 0 0 10px;
    text-align: right;
}

.subnav > li a {
    color: #000;
    display: block;
    font-size: 1em;
}


.navbar-custom .collapse.in ul.subnav {
    position: relative;
    display: block!important;
}


.navbar-custom .collapse.in ul.subnav > li  {
    float: none;
    position: relative;
    display: block!important;
    text-align: left;
    margin-left: 30px;
}


@media (max-width: 991px) {

    ul.subnav {
        display: block!important;
        position: static!important;
        right: auto;
        left: 0!important;
        margin: 0!important;
        padding:0!important;
    }


    ul.subnav > li  {
        float: none;
        position: relative;
        display: block!important;
        text-align: left;
        margin-left: 30px;
    }

    .subnav > li a {
        color: #000!important;
    }

}


.navbar-brand {
    display: block;
    margin-top: -5px;
    padding-top: 0!important;
    margin-right: 20px;
}

.logo {
    width: 100%;
    margin: 0!important;
    padding: 0!important;
    position: relative;
    z-index: 9999;
}

.logo-startslider {
    margin-top: 5%!important;
    padding: 10px!important;
    position: absolute;
    left: 0;
    z-index: 9999;
    width: 300px;
}

.logo-startslider img {
    width: 200px;
    margin-left: 90px;

}


@media (max-width: 543px) {
    .logo {
        width: 70%;
    }


    .logo-startslider img {
        width: 60%;
        margin-left: 10px;
    }

    .logo-startslider {
        margin-top: 5%!important;
        padding: 10px!important;
        position: absolute;
        left: 0;
        z-index: 9999;
        width: 150px;
        background-color: #fff;
    }

}

.main {

    margin-top: 20px;
}


.content-home {

    padding: 50px 0;
}



body.projekte .main   {

    margin-top: 30px;
}

body.news .filter-group {
    display: none;
}


.pagehead-wrapper {
    position: relative;
    height: 100vh;
    background-color: transparent;
    z-index: 100;
}



.pagehead {
    /*height: 100vh;
      border-bottom: 3em solid #fff;*/
    z-index: 10;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    position: absolute;
    width: 100%;
}



/*
.pagehead img {
    display: block;
    width: 100%;
    height: auto;
    position: static;
} */
.pagehead h1 {
     position: absolute;
    bottom: 50px;
    background-color: #fff;
    padding: 20px;
}


@media (max-width: 1199px) {
    .pagehead h1 {

        bottom: 80px;
    }
}


.content-back-link {
    display: none;

}

.projekt-details .content-back-link {
    display: block;
    position: absolute;
    top: 60px;
    right: 48px;
    z-index:9999;
}

.content-back-link a {
    display: block;
    background-color: #fff;
    padding: 3px;
}

.content-back-link a:hover {
    display: block;
    background-color: #eee;
}

 .content {
     margin: 50px 0;
 }

.content p {
    line-height: 1.8em;

}

.content ul > li {
    line-height: 1.8em;
    list-style: square;

}

.csc-sitemap {
    margin-top: 50px;
}


.content-head {
    padding: 0 0 30px 10px;
}

.abstand-unten {
    padding-bottom: 20px!important;
}

.abstand-oben {
    padding-top: 20px!important;
}

.abstand-special {
    margin-bottom: 50px!important;
}

/**Leitartikel */
.lead {
   font-size: 1.3em;
    font-weight: 700;
    padding: 30px 0;
}

@media (max-width: 768px) {
    .lead {
        font-size: 1.1em;
        font-weight: 700;
        padding: 10px 0;
        line-height: normal;
    }
}



.caption {
    font-size: .9em;
    margin-top: 10px;
}


.fancybox {
    cursor: zoom-in;
}

/**** Grid Isotope ****/

.grid {

}

.filter-group  {
    margin: 0 auto;
    text-align: center;
    position: fixed;
    top: 80px;
    left: 0;
    z-index: 9999;
    background-color: #fff;
    width: 100%;
    padding: 30px 30px 15px 0;
}
.filter-group a {
    text-transform: uppercase;
}


@media (max-width: 1199px) {
    .filter-group  {
        margin: 0 auto;
        text-align: center;
        top: 90px;
        z-index: 9999;
        background-color: #fff;
        width: 100%;
        padding: 0;
    }
}

@media (max-width: 992px) {
    .filter-group  {
        margin: 0 auto;
        text-align: center;
        position: relative;
        top: 10px;
        z-index: 9999;
        background-color: #fff;
        width: 100%;
        padding: 0;
    }
}



.filter-group ul {
    margin:0!important;
    padding:0 20px 0 0!important;
}

.filter-group li {
     display: inline-block;
    text-align: left;
     padding: 10px;
     margin:0!important;

 }

.filter-group li a {
     color: #000;
    font-size: 1em;
    border-bottom: 2px solid transparent;

}

@media (max-width: 1199px) {
    .filter-group li a {
        color: #000;
        font-size: .85em;
        border-bottom: 2px solid transparent;
    }
}

.is-checked {
    border-bottom: 2px solid #000;
}

.grid {
    margin-top: 100px;
}

@media (max-width: 992px) {

    .grid {
        margin-top: 10px;
    }
}


.grid-item {
     margin: 0;
    padding:1px;
    overflow: hidden;
}

.grid-item:hover img {
    -webkit-transform:scale(1.05);
    transform:scale(1.05);
}

.grid-item img {
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
}


.grid-item.col-sm-2  {
    border-bottom: 1px solid transparent;
}

.grid-item-captcha {
    position: absolute;
    bottom: 5px;
    left:0;
    background-color: #fff;
    color: #000;
    line-height: 2em;
    padding: 10px;
}


.refgallery .grid {
    margin-top: 30px;
}

.refgallery .grid img:hover {
    cursor: crosshair;
}

/******* Superslides *********************/

.wide-container {
   padding: 3em;
    margin:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}


@media (max-width: 991px) {
    .wide-container {
        padding: 15px;
    }
}


#slides {
    height: 80vh;
}


.wide-container #slides {
}


.slides-navigation {
    margin: 0 auto;
    position: absolute;
    z-index: 3;
    top: 46%;
    width: 100%;
}
.slides-navigation a {
    position: absolute;
    display: block;
    z-index: 9999;
}
.slides-navigation a.prev {
    left: 20px;
    color: #fff;
}
.slides-navigation a.next {
    right: 20px;
    color: #fff;
}

.wide-container #slides a.prev {
    left: 10px;

}

.wide-container #slides a.next {
    right: 10px;

}

.slides-pagination {
    display: none;
}

#contentslider {

}

.contentslides {

}

#contentslider .slides-container  li {
    overflow: hidden;
    position: relative;

}

#contentslider .slides-container  li img {
    position: relative;
    z-index: 0;
}




.pagedown {
    position: absolute;
    bottom: 20px;
    left: 50%;
    margin-left: -50px;
    width: 100px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    color: #fff;
    z-index: 9999;
}



/***** slick-slider   *******/

#slider {
    margin: 0;
    padding:0;
}

#slider div.slider-item {
    background-color: #fff!important;
}

#slider div.slider-item img {
    margin: 0 auto;
}



/*****  News Home **************/
.news {
    display: block;
    margin: 50px 0;
    padding: 0 0 50px 0;
}

.news-item {
    margin: 0 0 40px 0;
    padding:0;
    display: block;
}

.news-list-image {
    margin:0;
    padding:0;
}


.news .link-back {
    position: relative;
    z-index: 9999;
    font-size: 1.1em;
}

.news-single .article {
    display: block;
    margin-bottom: 40px;
}

.news-single .article-headline {
    margin: 40px 0;
}


.news-single .article:before,
.news-single .article:after{
    content: " ";
    display: table;
}

.news-single .article:after{
    clear: both;
}


/**** Bildanimation ****/


.picanileft {
    opacity: 0;
}


.picaniright {
    opacity: 0;
}

.picanileft.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    transition: all 5s linear;
    -webkit-transition: all 5s linear;
    transition-delay: 5s;
    -webkit-transition-delay: 5s;
    opacity: 1;
}

.picaniright.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
    transition: all 5s linear;
    -webkit-transition: all 5s linear;
    transition-delay: 5s;
    -webkit-transition-delay: 5s;
    opacity: 1;
}