/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) and (max-width: 479px){
    article.uk-article article{
        min-height: 100px !important;
        height: 100%
    }

    article.uk-article article .content-box{
        width: 90%;
    }

    #start .start-image-overlay {
        display: inline-block;
        padding: 10px;
        max-width: 90%;
        width: auto !important;
        min-height: 160px;
        background-color: rgba(255,255,255,0.5);
        color: #000000;
    }

    #start h1, #ueber-uns h1, #vorstand h1, #projekte h1, #kontakt h1{
        position: relative;
        line-height: 1.5em;
        font-size: 1.5em;
    }

    #start h2, #ueber-uns h2, #vorstand h2, #projekte h2, #kontakt h2{
        position: relative;
        line-height: 1em;
        font-size: 1em;
    }

    #vorstand .vorstand-box {
        display: block;
        margin: 0 0 10px 0;
        width: 100% !important;
    }

    #projekte .projekt-box {
        margin: 0 auto !important;
        padding: 0;
        width: 100% !important;
        float: none;
    }

    #kontakt .content-box .box-left, #kontakt .content-box .box-right{
        width: 100% !important;
        float: none;
        diaplay: block;
    }

    #dsgvo-btn{
        word-wrap:break-word;
        white-space: normal;
    }

    footer{
        font-size: 0.8em;
    }

    footer ul.uk-subnav{
        text-align: left;
        display: block;
    }

    footer ul.uk-subnav li{
        float: none;
    }

    footer ul.uk-subnav li:before, footer ul.uk-subnav li:after{
        content: " ";
        display: none;
    }

    #cboxWrapper article.uk-article article h1, article.uk-article div.datenschutz article h1{
        font-size: 1em ;
        font-weight: bold;
    }
    #cboxWrapper article.uk-article article h2, article.uk-article div.datenschutz article h2{
        font-size: 1em ;
        font-weight: normal;
    }
    #cboxWrapper article.uk-article article h3, article.uk-article div.datenschutz article h3{
        font-size: 1em ;
        font-style: italic;
        padding:0;
        margin:0;
    }

    #cboxWrapper article.uk-article article, article.uk-article div.datenschutz article{
        min-height: 1em;
        height: auto !important;
        height: 100%;
        width: 90% !important;
        text-align: left;
    }

    #cboxWrapper article.uk-article article{
        font-size: 0.8em;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) and (max-width: 767px){
    article.uk-article article{
        min-height: 100px !important;
        height: 100%
    }

    article.uk-article article .content-box{
        width: 90%;
    }

    #start .start-image-overlay {
        display: inline-block;
        padding: 10px;
        max-width: 90%;
        width: auto !important;
        min-height: 160px;
        background-color: rgba(255,255,255,0.5);
        color: #000000;
    }

    #start h1, #ueber-uns h1, #vorstand h1, #projekte h1, #kontakt h1{
        position: relative;
        line-height: 1.5em;
        font-size: 1.5em;
    }

    #start h2, #ueber-uns h2, #vorstand h2, #projekte h2, #kontakt h2{
        position: relative;
        line-height: 1em;
        font-size: 1em;
    }

    #vorstand .vorstand-box {
        display: block;
        margin: 0 0 10px 0;
        width: 100% !important;
    }

    #projekte .projekt-box {
        padding: 0;
        width: 100% !important;
        float: none;
    }
    #projekte .portfolio-thumb{
        margin: 0 auto !important;
    }
    #kontakt .content-box .box-left, #kontakt .content-box .box-right{
        width: 100% !important;
        float: none;
        diaplay: block;
    }

    #dsgvo-btn{
        word-wrap:break-word;
        white-space: normal;
    }

    footer{
        font-size: 0.8em;
    }



    #cboxWrapper article.uk-article article h1, article.uk-article div.datenschutz article h1{
        font-size: 1.2em ;
        font-weight: bold;
    }
    #cboxWrapper article.uk-article article h2, article.uk-article div.datenschutz article h2{
        font-size: 1em ;
        font-weight: normal;
    }
    #cboxWrapper article.uk-article article h3, article.uk-article div.datenschutz article h3{
        font-size: 1em ;
        font-style: italic;
        padding:0;
        margin:0;
    }

    #cboxWrapper article.uk-article article, article.uk-article div.datenschutz article{
        min-height: 1em;
        height: auto !important;
        height: 100%;
        width: 90% !important;
        text-align: left;
    }

    #cboxWrapper article.uk-article article{
        font-size: 1em;
    }
}


/* Small Devices, Tablets */
@media only screen and (min-width : 768px) and (max-width: 991px) {
    article.uk-article article{
        min-height: 100px !important;
        height: 100%
    }

    article.uk-article article .content-box{
        width: 90%;
    }

    #start .start-image-overlay {
        display: inline-block;
        padding: 10px;
        max-width: 90%;
        width: auto !important;
        min-height: 160px;
        background-color: rgba(255,255,255,0.5);
        color: #000000;
    }

    #start h1, #ueber-uns h1, #vorstand h1, #projekte h1, #kontakt h1{
        position: relative;
        line-height: 1.5em;
        font-size: 1.5em;
    }

    #start h2, #ueber-uns h2, #vorstand h2, #projekte h2, #kontakt h2{
        position: relative;
        line-height: 1em;
        font-size: 1em;
    }

    #vorstand .vorstand-box {
        display: block;
        margin: 0 0 10px 0;
        width: 100% !important;
    }

    #projekte .projekt-box {
        padding: 0;
        width: 50% !important;
        float: left;
    }
    #projekte .portfolio-thumb{
        margin: 0 auto !important;
    }
    #kontakt .content-box .box-left, #kontakt .content-box .box-right{
        width: 100% !important;
        float: none;
        diaplay: block;
    }


    #cboxWrapper article.uk-article article h1, article.uk-article div.datenschutz article h1{
        font-size: 1.2em ;
        font-weight: bold;
    }
    #cboxWrapper article.uk-article article h2, article.uk-article div.datenschutz article h2{
        font-size: 1em ;
        font-weight: normal;
    }
    #cboxWrapper article.uk-article article h3, article.uk-article div.datenschutz article h3{
        font-size: 1em ;
        font-style: italic;
        padding:0;
        margin:0;
    }

    #cboxWrapper article.uk-article article, article.uk-article div.datenschutz article{
        min-height: 1em;
        height: auto !important;
        height: 100%;
        width: 90% !important;
        text-align: left;
    }

    #cboxWrapper article.uk-article article{
        font-size: 1em;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) and (max-width: 1199px){
    article.uk-article article{
        min-height: 100px !important;
        height: 100%
    }

    article.uk-article article .content-box{
        width: 90%;
    }
    #vorstand .vorstand-box{
        display: inline-block;
        min-height: 400px;
        width: 30%;
    }

}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    article article div {
        max-width: 1200px;
    }
}

/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}