/* RESPONSIVE CSS
-------------------------------------------------- */

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

  #vorhang-top {
   background-image: url("../bilder/vorhang/vorhang_top.png");
   background-size:100% 150px;
  }
}



@media screen and  (min-width: 1081px) and (max-width: 2500px) { 

  #vorhang-top {
   background-image: url("../bilder/vorhang/vorhang_top.png");
   background-size:auto;
  }
}



@media screen and (max-width: 1340px) {
  #person-links, #person-rechts, #rosen1, #rosen2, #person-rechts-text, #person-links-text {
    display:none !important;
  }

  #scaramouche, #columbina { display:block;}

  #vorhang-left {
    margin-top:20px;
    margin-left:-65px;
  }

  #vorhang-right {
    margin-top:20px;
    margin-right:-65px;
  }

}


@media screen and  (min-width: 1081px) and (max-width: 1900px) { 
  /* #vorhang-top {
   background-image: url("../bilder/vorhang_oben_1.png");
   background-size:auto;
  } */

}


@media screen and (max-width: 1080px) {
  
  #vorhang-top {
   background-image: url("../bilder/vorhang/vorhang_top_small.png");
   background-size:auto;
  }

  #vorhang-left {
    position:fixed;
    height:1273px;
    width:100px;
    top:0px;
    left:0;
    z-index:6;
    display: block;
    margin-top:0px;
    margin-left:-10px;
    
    background-image: url("../bilder/vorhang/vorhang_links_small.png");
    background-position: top left;
    background-repeat: no-repeat;
    background-size: auto; 
  }


  #vorhang-right {
    position:fixed;
    height:1273px;
    width:100px;
    top:0;
    right:0;
    z-index:6;
    display: block;
    margin-top:0px;
    margin-right:-10px;
    
    background-image: url("../bilder/vorhang/vorhang_rechts_small.png");
    background-position: top right;
    background-repeat: no-repeat;
    background-size: auto; 
  }

}



@media screen and (max-width: 940px)   { 
  #vorhang-left { margin-left:-50px;  }
  #vorhang-right { margin-right:-50px; }
}

@media screen and (max-width: 875px)   { 
  #vorhang-left { margin-left:-68px;  }
  #vorhang-right { margin-right:-68px; }
}


@media screen and (max-width: 840px)   { 
   ul.menu a { padding: 8px 10px;  }
   #fblink { right:40px; }

}


@media screen and (max-width: 830px)   { 
 .container {
      padding-left: 40px !important;
      padding-right: 40px !important; 
  }
}




@media screen and (min-width: 768px) { 
    .slicknav_menu { display:none;  }   /* turn off mobile menu */
 
}



@media screen and (max-width: 767px) { 
    
  #navigation, .menu  { display:none !important; z-index:0 !important; }
    
  #wrapper {  display:block !important;  }
  #homelink, .hlink { display:none;}
  #header { margin-top: 150px; }
      
  #wrap-footer {
    padding:0px 0px 0px 0px;
    position:static;
    vertical-align : bottom;
    width:100%;
    height:auto !important;
   /* overflow:hidden; */
    display: block !important;
    vertical-align : bottom;
   }

  #footer .container { padding:0px 0px 0px 0px !important;}
  #footer .row { margin-bottom: 0px !important; margin:0px !important;}
  .show-mobile { display: block; padding:0px 0px 0px 0px !important; }

  #footer-m2,
  #footer-m3,
  #footer-m4 {
      display:block;
      width:auto;
  }
 
  #columbina { display:none;}
  #scaramouche { margin-left: 25px;  }

  .home #content { padding-top: 50px;  } 


    .col-xs-6 { margin-bottom: 30px !important; }

    .col-sm-4:after,.col-xs-12:after { 
    content: "";
    display: block;
    height: 20px;
    }

   
    #meguralink .megura:after{ display:none !important;} 


    /*  Mobile Menu Core Style   */
    .js .navbar-collapse {  display:none !important; }
    .js .mnenu {    display:block; z-index:50; }

    .slicknav_btn { position: relative; display: block; vertical-align: middle; float: left;  cursor: pointer; padding:20px 0px 45px 15px; /*margin-top:25px !important; */ width:100%;}

    .slicknav_menu  .slicknav_menutxt { display:none; }
    .slicknav_menu .slicknav_icon { float: left; margin:0px; padding:8px; background-color:#fff  }
    .slicknav_menu .slicknav_no-text { margin: 0 }
    .slicknav_menu .slicknav_icon-bar { display: block; width: 23px; height: 4px;  }
    .slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar { margin-top: 0.188em }

    .slicknav_nav { clear: both }
    .slicknav_nav ul,
    .slicknav_nav li { display: block }
    .slicknav_nav .slicknav_arrow { font-size: 28px; margin: 0 0 0 0; float:right; /*padding-right:15px; */ width:40px; font-weight:bold; }
    .slicknav_nav .slicknav_item { cursor: pointer; }
    .slicknav_nav .slicknav_row { display: block; }
    .slicknav_nav a { display: block }
    .slicknav_nav .slicknav_item a,
    .slicknav_nav .slicknav_parent-link a { display: inline }
    .slicknav_menu:before,
    .slicknav_menu:after { content: " "; display: table; }
    .slicknav_menu:after { clear: both }
    /* IE6/7 support */
    .slicknav_menu { *zoom: 1 }

   


    /*  User Default Style
        Change the following styles to modify the appearance of the menu.
    */
   .slicknav_menu {
        font-size:17px;
    }
    /* Button */
    .slicknav_btn {
       /* margin: 0px 0px 3px 0px; */
        text-decoration:none;
        background-color:none;
    }
    /* Button Text */
    .slicknav_menu  .slicknav_menutxt {
        color: #FFF;
        font-weight: bold;
        text-shadow: 0 1px 3px #000;
    }
    /* Button Lines */
    .slicknav_menu .slicknav_icon-bar {
      background-color:#B90000;
     }
     
     
    .slicknav_menu {
        background-color:transparent;
        position:absolute; 
        left:0;
        right:0;
        margin-left:auto;
        margin-right:auto;
        z-index:350;
     
        width: 100%;
        max-width:768px;
        padding: 0px 0px 0px 0px !important;
      }

    .slicknav_nav {
      color:#fff;
      margin:0px !important;
      padding:0px 0px 0px 0px ;
      background-color: #B90000;
      width: 100%; 
      border-top:1px solid #333;
    }


    .slicknav_nav, .slicknav_nav ul {
        list-style: none;
        overflow:hidden;
       
    }
    .slicknav_nav ul {
        padding:0;
        margin:0 0 0 0;
    } 


    .slicknav_nav .slicknav_row {
             margin:0px 0px;
    }
    
    .slicknav_nav  li a {
        padding:6px 0px 6px 0px; 
        text-decoration:none;
        color:#fff; 
       display:block;  
    } 

   .slicknav_open:first-child {
     background-color:#B90000;
   }

  
   li.home { display:block;}
   
    .slicknav_nav .slicknav_item a,
    .slicknav_nav .slicknav_parent-link a {       }


    .slicknav_nav li     {border-bottom:1px solid #333; margin-bottom:0px !important;  } 
    .slicknav_nav li a   { padding-left:15px; text-transform:uppercase; font-weight:700 !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; letter-spacing:1px; } 
    .slicknav_nav li a:hover   {  background-color:#EEEEEE !important; color:#000000 !important;  } 
    .slicknav_row a { padding-left:0px !important; margin-left:0px !important; }
    

    /* 2. Stufe  */
    .slicknav_nav li ul li   {  border-bottom:none !important; }
    .slicknav_nav li ul li a {  padding-left:30px; font-weight:400 !important; font-size:16px; text-transform:none;   -webkit-font-smoothing: subpixel-antialiased;   -moz-osx-font-smoothing: auto; letter-spacing:initial !important;  }
    .slicknav_nav li ul li a.active, ul.dropdown a.active { color:#000 !important;}

    .slicknav_nav .slicknav_row:hover {  color:#000;   }
    .slicknav_nav .slicknav_row:hover a, .slicknav_nav .slicknav_row:hover a.active  { color:#000 !important;  }
    
    .slicknav_nav ul li:last-child  { margin-bottom:6px;}
    ul.dropdown li:last-child a { margin-bottom: 6px !important; /* padding:15px 0px 0px 15px !important; */   }
    ul.dropdown li:last-child a a { padding: 0px !important; }
    ul.dropdown a { /* padding:15px 0px 0px 15px !important; */ }
   
    .dropdown li {
      display: block !important;
      float: none !important;
      margin-right: 0px !important;
      text-align:left !important;
    }


       

   /* 3. Stufe  */
    .slicknav_nav li ul li ul li a       {   font-weight:400; padding-top: 3px; padding-bottom:3px; font-size:13px !important; color:#000 !important;}
    .slicknav_nav li ul li ul li a.slicknav_row a { padding-left:0px !important; margin-left:0px !important; }
    ul.dropdown2 li a { padding:15px 0px 0px 30px !important; }


     
    
    li.slicknav_open {  background-color:#EEEEEE !important;   }
    li.slicknav_open a {   color:#000 !important;    }

    .dropdown { overflow: hidden !important; width:100% !important;}
  
    ul.menu-mobile li span.slicknav_arrow { padding-right:25px; float:right !important; margin-top:0px; }
    ul.menu-mobile li > ul li span.slicknav_arrow { padding-right:15px !important; margin-right:18px; width:20px; margin-top:-9px; text-align:center; font-weight:normal; font-size:24px; } 

    li.slicknav_open {  background-color:#EEEEEE !important;   }
    li.slicknav_open a {   color:#000 !important;    }

    .dropdown {
      position: relative;
      margin-top:initial !important;
      display:none;
       left: initial !important;
      right: initial !important;
      margin-left: initial !important;
      margin-right: initial !important;
      background-color:#EEEEEE;
      border-top:none !important;
      border-bottom:none !important;
    }
  li.active .dropdown {  display:block; margin:initial !important; }
  li.slicknav_open span.slicknav_arrow { padding-left:4px; margin-top:-2px; }
   
}






@media screen and  (max-width: 600px) { 
  body {
      background-attachment: fixed;
      background-image: url("../bilder/main_bg_mobile.jpg");
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
  }

/*
  #vorhang-top {
    position:fixed;
    height:140px;
    background-image: url("../bilder/vorhang_oben_mobile.png");
  }
*/
  #vorhang-left { display:none;  }
  #vorhang-right { display:none; }

  #divider {
    width:160px;
    height:92px;
    margin-top:15px;
    background-size:cover;
  }
  
  .home #content {
    padding-top: 30px;
   }

  #button-tickets {
    width:200px;
    height:199px;
    background-size: cover;
  }

  #twrapper {
    position: relative;
    width:200px;
    height:199px;
  }

  #tickets {
     font-size: 30px;
  }

  #herein {
     font-size: 32px;
  }


 .container {
      padding-left: 15px !important;
      padding-right: 15px !important; 
  }

}




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

div.csc-textpic-imagewrap
    {
    float:none;
    clear:both;
    display:block;
    }


    div.csc-textpic-text {
    float:none;
    clear:both;
    margin-left:0px !important;
    margin-right:0px !important;
    }

    div.csc-textpic-imagecolumn {
        float:none;
        clear:both;
        display:block;
        margin-left:0px;
        margin-bottom:25px;
    }

  div.csc-textpic-intext-right .csc-textpic-imagewrap, div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {
    margin-left: 0px;
  }
   

  div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {
    float: left;
}

div.csc-textpic div.csc-textpic-imagecolumn {
    margin-bottom:10px !important;
    }



}



@media screen and  (max-width: 480px) { 
    
    .slicknav_menu {
    	width: 100%;
    }

    .slicknav_nav {
    padding:0px 0px 0px 0px !important;
    width:100% !important;
    }

 
  #header { margin-top: 130px; }
 
  .before, .after { display:none;  }
  #ptitle { width:100%; }

  #vorhang-top {
    height:100px;
    background:none;
    background-color:#B90000 !important;
  }


  #maske {
    position:fixed;
    top: 4px;
    left: 50%;
    transform: translateX(-50%);
    width:93px;
    height:82px;
    z-index:25;
     
    background-image: url("../bilder/theater-maske_small.png");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: auto; 
  }

}



@media screen and  (max-width: 380px) { 
  
   .slicknav_nav li a {
      letter-spacing: 0px;
      padding-left: 10px;
   }

    .slicknav_nav .slicknav_arrow {  width:30px; }

 }