/* open-sans-300 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: url('fonts/open-sans-v34-latin-300.eot'); /* IE9 Compat Modes */
src: local(''),
        url('fonts/open-sans-v34-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/open-sans-v34-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
        url('fonts/open-sans-v34-latin-300.woff') format('woff'), /* Modern Browsers */
        url('fonts/open-sans-v34-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/open-sans-v34-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: url('fonts/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */
src: local(''),
        url('fonts/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('fonts/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('fonts/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: url('fonts/open-sans-v34-latin-600.eot'); /* IE9 Compat Modes */
src: local(''),
        url('fonts/open-sans-v34-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/open-sans-v34-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
        url('fonts/open-sans-v34-latin-600.woff') format('woff'), /* Modern Browsers */
        url('fonts/open-sans-v34-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/open-sans-v34-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-300italic - latin */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
src: url('fonts/open-sans-v34-latin-300italic.eot'); /* IE9 Compat Modes */
src: local(''),
        url('fonts/open-sans-v34-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/open-sans-v34-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('fonts/open-sans-v34-latin-300italic.woff') format('woff'), /* Modern Browsers */
        url('fonts/open-sans-v34-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/open-sans-v34-latin-300italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-italic - latin */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
src: url('fonts/open-sans-v34-latin-italic.eot'); /* IE9 Compat Modes */
src: local(''),
        url('fonts/open-sans-v34-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/open-sans-v34-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('fonts/open-sans-v34-latin-italic.woff') format('woff'), /* Modern Browsers */
        url('fonts/open-sans-v34-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/open-sans-v34-latin-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600italic - latin */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
src: url('fonts/open-sans-v34-latin-600italic.eot'); /* IE9 Compat Modes */
src: local(''),
        url('fonts/open-sans-v34-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/open-sans-v34-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('fonts/open-sans-v34-latin-600italic.woff') format('woff'), /* Modern Browsers */
        url('fonts/open-sans-v34-latin-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/open-sans-v34-latin-600italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}



body{
    width:100%;
    height:100%;
    font-size:16px;
    font-family: 'Open Sans', Arial, sans-serif;
    line-height: 1.3;
}

a:link, a:visited{ color:#333; text-decoration:none }

p{ margin-bottom:1em; }
p a:link, p a:visited{ color:#006cb4; }

h1{
    text-transform: uppercase;
    font-size: 1.2em;
    font-weight: 600;
    line-height: 2em;
}

h2{
    text-transform: none;
    font-size: 1.2em;
    font-weight: 100;
    font-style:italic;
    margin-top: 0.2em;
    line-height: 2em;
}

h3{
    text-transform: none;
    font-size: 1em;
    font-weight: 600;
    margin-bottom: 0.2em;
    line-height: 2em;
}

i, em{ font-style: italic; }

img{ max-width:100%;height:auto; }

#conti{
    position:relative;
    display: block;
    width:70%;
    min-height:1000px;
    max-width:1200px;
    min-width: 800px;
    background:#fff;
    margin:auto;
    padding-bottom:100px;
    text-align: center;
}

.imgConti{
    position:relative;
    display: inline-block;
    width:100%;
    height:auto;
    background-size: cover;
    background-repeat: no-repeat;
    /*margin: auto;*/
    margin-bottom: 2em;
}

#bannerCon{
    position: relative;
    width:100%;
    height:auto;
    min-height: 750px;
    margin: auto;
    margin-bottom: 2em;
    overflow: hidden;
}

.bSlide{
    position:absolute;
    display: block;
    width:100%;
    height:auto;
    background-size: contain;
    background-repeat: no-repeat;
}

#topHead{
    position: relative;
    width:100%;
    height:auto;
    margin: 0px;
    padding: 0px;
    text-align: left;
}

/* HAUPTNAVI /////////////////////////////////////////////////////// */

#menu{
    width:100%;
    text-align: right;
    /*margin-left: 4em;*/
    margin-top: 1em;
    font-size: 0.9em;
    line-height: 1.6em;
    text-transform: lowercase;
    letter-spacing: 0.1em;
}

#menu a{
    position: relative;
    display: block;
    margin-left: 2em;
}

#menu a:link, #menu a:visited{ color:#666; }

/* ////////////////////////////////////////////////////////////////// */

#leftBox{
    position: relative;
    width:30%;
    display: inline-block;
    margin:0px;
    margin-right:2%;
}

#rightBox{
    position: relative;
    width:65%;
    display: inline-block;
    text-align: right;
}

#logo{
    position:relative;
    display: block;
    width:100%;
    background-image:url(nav/logo.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    min-height:50px;
    top:2em;
}

#dConti{
    position: relative;
    text-align: right;
    width:100%
}

#addressBox{
    position:absolute;
    top:0px;
    left:5%;
    width:20%;
    font-size: 0.9em;
    line-height: 2em;
    color: #666;
    /*text-transform: uppercase;*/
    margin-top: 1em;
    text-align: left;
    font-weight:100;
}

#yList{
    position:relative;
    display: inline-block;
    width:100%;
    /*border: 1px solid orange;*/
    text-align: left;
    font-size: 12px;
    margin-top: 1em;
}

#titleBox{
    position:relative;
    display: inline-block;
    width:80%;
    /*border: 1px solid orange;*/
    text-align: left;
    font-size: 24px;
    margin-bottom: 2em;
    text-align: right;
}

.dateLine, .exhiLine{
    position: relative;
    display: inline-block;
    margin-right: 1em;
    vertical-align: top;
    line-height: 1em;
    margin-bottom: 0.4em;
}

#titleBox h1{
    text-transform: uppercase;
    font-size: 1.2em;
    font-weight: 600;
    line-height: 1em;
}

#titleBox h2{
    text-transform: none;
    font-size: 1.2em;
    font-weight: 100;
    font-style:italic;
    margin-top: 0.2em;
    line-height: 1em;
}

.artBox{
    position:relative;
    width: 100%;
    margin-bottom:1.5em;
}

.dateBox{
    position:relative;
    display:inline-block;
    line-height: 1.5em;
    width: 40%;
    margin-right: 2%;
    text-align: right;
    vertical-align: top;
}

.exhiBox{
    position:relative;
    display:inline-block;
    /*width: 50%;*/
    max-width:400px;
/*    border: 1px solid red;*/
}

.exhiBox h1{
    text-transform: uppercase;
    line-height: 1.5em;
    font-size: 1.2em;
    font-weight: 600;
}

.exhiBox h2{
    text-transform: none;
    line-height: 0.5em;
    font-size: 1.2em;
    font-weight: 100;
    font-style:italic;
}

#pConti{
    margin-left:32%;
    margin-bottom:3em;
    width:60%;
    text-align:left;
    font-size: 16px;
}

#pConti p, .pConti  p{ font-size: 0.9em; line-height: 1.8em; color:#666 }
#pConti .bu{ font-size: 0.8em; line-height: 2em; color:#666;margin-bottom:4em; font-style: italic; }

.pConti ul{
    font-size: 0.9em;
    line-height: 1.8em;
    color:#666;
    padding-left: 20px;
    list-style-type: square;
    margin-bottom: 1em;
}

strong{
    font-weight: bold;
}

/*///////////////////////////////////////////////////////////////////////*/

.pConti{
    margin-left:32%;
    margin-bottom:3em;
    width:60%;
    text-align:left;
    font-size: 16px;
    vertical-align:text-top;
}

.iConti{
    position:relative;
    display: inline-block;
    width:30%;
    vertical-align:text-top;
    margin-right:20px;
}

.iConti img{ width:100%; margin-top:5px; vertical-align:text-top; }

.tConti{
    position:relative;
    display: inline-block;
    width:65%;
    vertical-align:text-top;
}

.terminator{
    clear:both;
}

.socMedia_icon{
    position:relative;
    display:inline-block;
    float:left;
    width:40px;
    height:40px;
    background-repeat:no-repeat;
    padding:4em;
    margin-left:30px;
}

#menuToggle input{ opacity: 0; }

/* ////////////////////////////////////////////////////////////// */

@media all and (max-width:1500px) {
    
    #conti{
        width:100%;
    }

}

@media all and (max-width:800px) {

    #conti{
        width:100%;
        min-width: 0;
    }

    #leftBox, #rightBox{
        width:100%;
        display: block;
    }

    #logo{
        position:relative;
        right:0px;
        display: block;
        width:100%;
        background-image:url(nav/logo.jpg);
        background-size:80%;
        background-position: top right;
        min-height:50px;
        top:1em;
        margin-bottom: 2em;
    }

    #titleBox{
        position:relative;
        display: inline-block;
        width:80%;
        text-align: left;
        font-size: 24px;
        margin-top: 0em;
        text-align: right;
        margin-right: 1em;
    }
    

    #dConti{
        width:100%;
        min-width: none;
        display: flex;
        flex-direction: column;
    }

    #addressBox{
        position: relative;
        left: 1em;
        display:inline-block;
        width:90%;
        order: 3;
    }

    #pConti, .pConti{
        position: relative;
        display:inline-block;
        width:90%;
        order:1;
        min-width: none;
        margin-left:1em;
        margin-bottom:1em;
        text-align:left;
    }

    #yList{
        position:relative;
        display: inline-block;
        order:2;
        width:90%;
        text-align: left;
        font-size: 1em;
        margin-top: 0;
    }

    .artBox{
        margin-left:1em;
    }

    .dateBox{
        position:relative;
        display:block;
        line-height: 1.5em;
        width: 40%;
        margin-right: 1em;
        text-align: left;
        vertical-align: top;
    }
    
    /* .dateLine, .exhiLine{
        position: relative;
        display: inline-block;
        margin-right: 1em;
        vertical-align: top;
        line-height: 1.5em;
        margin-bottom: 0.4em;
    } */

    .exhiBox{
        max-width: none;
    }

    .exhiBox h1{
        line-height: 1.5em;
        padding: 0px;
        margin: 0px;
        margin-top: 0.5em;
        margin-bottom: 0.2em;
    }

    .exhiBox h2{
        line-height: 1.5em;
        padding: 0px;
        margin: 0px;
    }

    .exhiBox br{
        display: none;
    }

    #pConti p{
        font-size: 1em;
    }

    /* #menu a{ padding-left: 1.5em;} */

    /* Menu by Erik Terwan * 24th of November 2015 * MIT License */

    #menuToggle{
        
        position: absolute;
        display: block;
        width:100%;
        height:100%;
        
        top: 15px;
        left: 15px;
        
        z-index: 21;
        
        -webkit-user-select: none;
        user-select: none;
        /* border:1px solid red; */

    }

    #menuToggle a{
        text-decoration: none;
        color: #232323;
        transition: color 0.3s ease;
    }

    #menuToggle input{
        display: block;
        width: 40px;
        height: 32px;
        position: absolute;
        top: -7px;
        left: -5px;
        
        cursor: pointer;
        
        opacity: 0; /* hide this */
        z-index: 22; /* and place it over the hamburger */
        
        -webkit-touch-callout: none;
    }

    #menuToggle span{
        display: block;
        width: 33px;
        height: 4px;
        margin-bottom: 5px;
        position: relative;
        
        background: #232323;
        /*border-radius: 3px;*/
        
        z-index: 21;
        
        transform-origin: 4px 0px;
        
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                    background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                    opacity 0.55s ease;
    }
    
    #menuToggle span:first-child{
        transform-origin: 0% 0%;
    }
    
    #menuToggle span:nth-last-child(2){
        transform-origin: 0% 100%;
    }

    #menuToggle input:checked ~ span{
        opacity: 1;
        transform: rotate(45deg) translate(-2px, -1px);
        background: #232323;
    }

    #menuToggle input:checked ~ span:nth-last-child(3){
        opacity: 0;
        transform: rotate(0deg) scale(0.2, 0.2);
    }

    #menuToggle input:checked ~ span:nth-last-child(2){
        transform: rotate(-45deg) translate(0, -1px);
    }

    #menu{
        position:absolute;
        top:30px;
        left:-15px;
        width:100%;
        display: block;
        background: rgb(255,255,255,0.95);
        text-align: left;
        padding-top:1em;
        padding-bottom:1em;
        min-height:40em;
        font-size: 1em;
        line-height: 2em;
        z-index: 20;
        /* visibility: visible; */
        -webkit-font-smoothing: antialiased;
        /* to stop flickering of text in safari */

        /**/
        /* left:-5px;
        width: 95%; */

/* 
        margin: -40px 0 0 -50px;
        padding: 40px;
        padding-top: 75px; */
    
        list-style-type: none;
    
        transform-origin: 0% 0%;
        transform: translate(-100%, 0);
    
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
        
    }

    #menuToggle input:checked ~ ul{
        transform: none;
      }

}