/* TABLET / SMALL SCREENS */

@media screen and (max-device-width: 980px) ,
screen and (max-width: 1000px) {


    html , body {
        height:auto;
    }
    body {
        background-color:#fff;
        background-image:none;
    }
    
    #mobilehead #menutop li , #mobilehead #menutop li a {
        color:#606060;
    }
    
}

/* TABLET ONLY (LANDSCAPE) / HUGE SCREENS */

@media screen and (max-device-width:980px) {

} 
@media screen and (min-width:1280px ) {

}


/* TABLET ONLY (PORTRAIT) */
/* SMALLER TBALETS / PHONES */

@media screen and (max-device-width:980px) and (orientation:portrait) , screen and (max-device-width:980px) {

    body {
        font-size:110.01%;
    }    
	
}

@media screen and (max-device-width:980px) and (orientation:portrait) , screen and (max-device-width:980px) , screen and (max-width:980px) , print {  

    /* GENERAL / MUSEUMS / MEDIA */

    body {
        overflow:auto;
        overflow-x:hidden;
    }
    .content * {
        -webkit-hyphens:auto !important;
        -moz-hyphens: auto !important;
        -o-hyphens: auto !important;
        -ms-hyphens:auto !important;
        hyphens:auto !important;
    }
    
    body div {
        overflow:hidden !important;
    }
    
    #canvas {
        position:relative;
        width:100%;
        top:0;
        left:auto;
        right:auto;
        height:auto;
        min-height:0;
        margin:0 auto;
        padding:0 0 0 0;
        overflow:visible;
    }
    #menutop , #logo , #top {
        display:none;
    }
    
    #contenthome, #contentmuseum, #contentdates, #contenteducation , #contentinformation , #contenterror {
        position:relative;
        float:right;
        top:0;
        right:5%;
        left:auto !important;
        margin:0 0 3em 0;
        width:65%;
    }
    #menuleft {
        position:relative;
        float:left;
        top:0;
        right:auto;
        margin:1em 2.5% 0 0;
        left:0;
        width:27.5%;
    }
    #menuleft li {
        padding-left:10%;
    }
    
    #contenthead {
        position:relative;
        width:100%;
        height:auto;
        min-width:0;
        margin:0 0 1em 0;
    }
    #contenthead .headoverlay {
        display:none;
    }
    #contenthead img {
        width:100%;
        height:auto;
    }
    
    #contentmain {
        position:relative;
        height:auto;
        min-height:0;
        width:100%;
        min-width:0;
        top:0;
    }
    #contentmain .leftcolumn {
        float:none;
        width:100%;
        clear:both;
        margin:0 0 2em 0;
    }
    #contentmain .rightcolumn , #contentmain .rightcolumnsn , #contentmain .columnmedia {
        float:none;
        width:auto;
        clear:both;
        margin:0 auto 1em 0;
    }
    #contentmain .rightcolumnsn {
        margin:2em auto 1em 0;
        padding:1em 0 0 0;
    }
    #contentmain .rightcolumnsn img {
        width:2em !important;
        height:auto !important;
    }
    #contentmain .columnmedia .mediamobile {
        position:relative;
        width:100%;
        height:auto;
        display:block;
    }
    #contentmain .columnmedia .mediacontrol , #contentmain .columnmedia .mediamedium {
        display:none;
    }
    #contenteducation #contentmain .columnmedia {
        display:none;
    }
    .columnmedia #media_caption {
        width:90%;
        margin:0.5em 5%;
    }
    
    #menuleft ul {
        margin:0 0 1em 0;
    }
    #menuleft li {
        padding-top:0.25em;
        padding-bottom:0.25em;
    }
    #menuleft p.menuheadline {
        padding-bottom:0.5em;
    }
    
    /* SPEC STUFF */
    
    #mobilehead {
        position:relative;
        width:100%;
        display:block;
        margin:0 0 1em 0;
    }
    #mobilehead #logo {
        position:relative;
        left:2.5%;
        width:25%;
        height:auto;
        display:block;
        top:0;
        float:left;
    }
    #mobilehead #menutop {
        position:relative;
        display:block;
        left:auto;
        top:0;
        right:0;
        float:right;
        background:#f6f6f6;
        padding:0 5% 0.25em 1em;
    }
    
    .link {
        margin-top:0.5em;
        margin-bottom:0.5em;
    }

    
    /* DATES / EDU */
    
    #contentdates .datesblock , #contenteducation .datesblock {
        height:auto;
        margin-bottom:0.5em;
        padding-top:0.5em;
        padding-bottom:1em;
        clear:both;
    }
    #contentdates br.clearing , #contenteducation br.clearing {
        display:none;
    }
    #contentdates .datesblockresartium , #contenteducation .datesblockresartium {
        float:left;
        width:50%;
        margin:0 2.5% 0 0;
    }
    #contentdates .datesblocktypetempus , #contentdates .datesblocktypetempus {
        float:right;
        width:45%;
        margin:0;
    }
    #contentdates .datesblockchoice , #contenteducation .datesblockchoice {
        display:none;
    }
    
    #contentdates #contenthead , #contenteducation #contenthead {
        background-color:grey;
        padding:1.25% 2.5%;
        width:95%;
        margin:0 0 2em 0;
    }
    #headfilter, #headresartium, #headtempus, #headlocus, #headeducation {
        position:relative;
        background-color:transparent !important;
        min-width:0;
        min-height:0;
    }
    #headfilter {
        width:100%;
        clear:both;
        background-image:none !important;
        height:auto;
        margin:0 0 0.5em 0;
    }
    #headresartium, #headtempus, #headlocus, #headeducation {
        float:left;
        width:auto;
        min-width:25%;
        max-width:40%;
        left:0;
        margin:0 2.5% 0.25em 0;
    }
    #contenthead h3 {
        padding-bottom:0.25em;
    }
    #contenthead li {
        margin-top:0.25em;
        margin-bottom:0.25em;
    }
    
    
    
    /* HOME */
    
    .homeblocks {
        padding-bottom:2em;
        background-color:#016a9c;
    }
    .homeblocks.paedagogik {
        background-color:#d4450d;
    }
    .homeblocks h2.hometitle {
        font-size:1em;
    }

    

    /* clearing */
    .clearfix:after , #canvas:after , #contentmain:after {
	    content: ".";
	    display: block;
	    clear: both;
	    visibility: hidden;
	    line-height: 0;
	    height: 0;
    }
    .clearfix , #canvas , #contentmain {
	    display: inline-block;
    }
    html[xmlns] .clearfix , html[xmlns] #canvas , html[xmlns] #contentmain {
	    display: block;
    }
    * html .clearfix , * html #canvas , * html #contentmain {
	    height: 1%;
    }
    
}

/* IN BETWEEN */

@media screen and (max-device-width:780px) and (orientation:portrait) , screen and (max-device-width:780px) , screen and (max-width:780px) , print {  

    .homeblocks {
        padding-bottom:4em;
    }
    .homeblocks h2.hometitle {
        font-size:0.76em;
    }
    .homeblocks .homenote {
    }
    
}




@media screen and (max-device-width:540px) and (orientation:portrait) , screen and (max-device-width:540px) {  
    body {
        font-size:105.01%;
    }
    
}


/* SMALLEST SCREENS */

@media screen and (max-device-width:580px) , screen and (max-width:580px) {

    
    body {
    }
    
    #menuleft , #mobilehead #menutop {
        display:none;
    }
    #mobilehead #smartnavigation #menutop {
        display:block;
    }
    #mobilehead #logo {
        right:0;
        left:auto;
        width:40%;
        left:55%;
        float:none;
    }
    
    #contenthome, #contentmuseum, #contentdates, #contenteducation , #contentinformation , #contenterror {
        width:90%;
        right:auto;
        left:auto;
        margin:0 5% 3em 5%;
    }
    
    #contentdates #contenthead , #contentdates #contenthead  {
/* FILTER */

        
    
    }
    #contentdates #contenthead .switches , #contentdates #contenthead .switchesselected {
        display:none;
    }
    #contentdates #headresartium , #contentdates #headtempus , #contentdates #headlocus {
        display:block;
        float:none;
        clear:both;
        width:auto;
        min-width:0;
        max-width:100%;
    }
    #contentdates .mobilefilter {
        margin:0 0 0.5em 10px;
        width:90%;
    }
    
    /* FILTER */
    
    #contentdates .mobilefilter {
        float:none;
        display:block;
        border-radius:0.5em;
        padding:0.125em;
        border:1px solid #a0a0a0;
        border-bottom:1px solid #505050;
        border-right:1px solid #505050;
    }
    #contentdates .mobilefilter.filtersubmit {
        float:none;
        clear:both;
        background-color:#fff;
        color:#303030;
        margin-bottom:1em;
    }
    #contentdates .mobilefilter.filterseparator {
        clear:both;
        height:0;
        border:0px none;
    }
    
    /* HOME */
    
    .homeblocks {
        padding-bottom:0;
        background-color:#016a9c;
    }
    .homeblocks.homeblock1 ,
    .homeblocks.homeblock2 ,
    .homeblocks.homeblock3 {
        clear:both !important;
        float:none !important;
        width:96% !important;
        margin:0 2% 0.5em 2% !important;
        min-height:6em !important;
    }
    .homeblocks.homeblock4 {
        width:46% !important;
        margin:0 2% 0.5em 2% !important;
        height:4em !important;
    }    
    .homeblocks img {
        display:none !important;
    }
    .homeblocks.homeblock3 h2.hometitle {
        font-size:1.25em;
    }
    .homeblocks.homeblock4 h2.hometitle {
        left:10%;
        font-size:0.76em;
    }
    .homeblocks.homeblock3 .hometitle , .homeblocks.homeblock3 .homenote {
        position:relative;
        margin:0.5em 0;
        top:0;
        bottom:auto;
    }
    .homeblocks.homeblock4 .homenote {
        display:none;
    }
    
    .homeblocks.special {
        background-color:#943008;
    }

    
    .homenewsitem {
        width:46% !important;
        margin:0 2% 0.5em 2% !important;
        height:6em !important;
    }
    .homenewsitem p {
        margin-left:10% !important;
        margin-right:5%;
    }
    

/* SMART NAVIGATION */

    #smartnavigation {
        position:absolute;
        top:0;
        left:5%;
        width:90%;
        display:block;
        height:6em;
    }
    
    #smartnavigation #smarthead {
        position:absolute;
        z-index:99;
        width:45%;
        top:0;
        height:1.25em;
        margin:1em 0;
        padding:1em 0;
        text-align:center;
        font-weight:bold;
        background-color:#fff;
        color:red;
        border-radius:0.5em;
        cursor:pointer;
    }
    
    #smartnavigation #smartbody {
        display:none;
        padding-top:3em !important;
    }

    #smartnavigation li {
        font-size:0.76em !important;
        font-weight:normal !important;
        color:#fff !important;
        margin:0 0 0.5em 0 !important;
        float:none !important;
        padding:0 !important;
        text-align:left !important;
    }
    #smartnavigation .langswitch {
        background-image:none !important;
    }
    #smartnavigation li a {
        color:#fff !important;
    }
    #smartnavigation div {
        background-color:transparent !important;
        padding:0 !important;
        margin:1em 0 !important;
        float:none !important;
        text-align:left !important;
        right:auto !important;
    }
    #smartnavigation .menuheadline {
        margin:0 0 0.5em 0;
        color:#c0c0c0 !important;
    }
    
    
        
    .link-ls p.desc {
        display:none;
    }
    .content-ls figure.image-right ,
    .content-ls figure.image-left {
        clear:both;
        float:none;
        margin:1em 0 2em 0;
        width:100%;
    }
    .content-ls figure.portrait {
        text-align:center;
    }
    .content-ls figure.portrait img {
        width:65%;
        display:inline;
    }
    .content-ls figure.portrait figcaption {
        text-align:center;
    }
    
    .content-ls h1 {
        font-size:1.75em;
    }
    .content-ls h2 {
        font-size:1.25em;
    }
    .link-ls.overview h2 {
        padding-top:0;
    }
    
    .video-embedded iframe {
        width:100%;
    }
    

    
    #menutop li.leichte-sprache {
        background-image:url(media/ls/icon-leichte-sprache-selected.png) !important;
        background-color:transparent !important;
    }
    #menutop li.gebaerdensprache {
        background-image:url(media/ls/icon-gebaerdensprache-selected.png) !important;
        background-color:transparent !important;    
    }
    
}



/* SMALLEST SCREENS PORTRAIT */

@media screen and (max-device-width:720px) and (orientation:portrait) , screen and (max-width:720px) {

    /*body {
        background-color:rgba(255,0,0,0.25) !important;
    }*/
    

}