
/*-----------------------------------------------------------------------------*/
/* MEDIA QUERIES */


@media only screen 
and (max-width : 480px) 
{
      body { font-size:16px; }

      .ccButton { margin-top:8px; }

      #menuarea { width:auto; }
      #menuNav { display:none; }
      #headline { height:auto; }
      #headarea { height: 80px; margin: 0 auto; padding: 0px 0 11px 0; text-align: center; width: 100%; }

      #logo     { width:225px; height:138px; padding: 0; background:url('../images/logo.png') 10px 0 no-repeat; background-size: 225px 138px; }
      #logo img { height: auto; width: auto;  }
       
      .logosub { width: 177px; height: 120px; top: 91px; background-size: 170px; background-position: -11px -111px; }

 
   /* NAVIGATION */

      nav        { display:none; }    

      #mobilebox { float:right; margin:40px 10px 0 0;}
      #mobilemenu { display:none; position:absolute; z-index:999; top:96px; }

      #tabletbutton { display:none; }
      #tabletmenu   { display:none; position:absolute; left: -9999px; }


      .normbutton { margin-bottom:10px; }

      h2 { margin:0 0 5px 0; } 
  

   /* TOP IMAGES */
        
     /*
      #imgContainer { width:100%; height:200px; background-size:contain; background-position: center center;}
     */

      .mainslider { width:100%; height:320px; text-align:center; }
      .sliderow   { width:100%; height:320px; }
      .innerrow   { width:100%; height:320px; }

      .mitslider  { width:100%; }

      .actionBar   {  width:82%; margin:0 auto; padding:4%; height:auto; top:50%; left:5%; background: rgba(75,75,77,.95); border-radius:5px; text-align:left; }
      .actionBar h1 { color:#fff; font-size:20px; margin-bottom:0px; font-weight:bold; }
      .actionBar h2 { color:#fff; font-size:18px; margin-bottom:0px; border:none; margin:0; padding-bottom:0; }
      .actionBar p  { font-size:15px; font-weight:normal; } 


      #imgContainerTQ { width:100%; height:320px; text-align:center; }
      .smallTeaser { width:80%; margin:0 auto; left:0; padding:10px; /*text-align:center;*/ }


   /* START PAGE STYLES */

      .contentHome { background: rgba(255, 255, 255, 0.94) none repeat scroll 0 0; clear: both; display: block; margin: 0 auto 0; padding: 5%; text-align: left; width: 90%; }
      .startBlockRightBg { height:auto; }

      .formbuttonspacer { margin:0 0 15px 0; }
      .textzone { height:187px; }

   /* PAGE STYLES */ 

      .space25 { display: none; }
      .space33 { display: none; }

      .col100  { margin:0; }
      .col66   { display: block; width: 100%; margin:0px 0 5px 0; }
      .col33   { display: block; width: 100%; margin:10px 0 25px 0; }
      .col25   { display: block; width: 100%; }
      .col12   { display: block; width: 45.5%; }
      

      .contentFull   { padding:5%; width: 90%; margin: 55px auto 0 auto; }
      .contentFull p { text-align:left; }
      .contentGold21 { float: none; padding: 0; width: 100%; }
      .contentGold12 { float: none; padding: 0; width: 100%; height:auto; margin-left:0; }

      .col50  { display:block; width:100%; }
      .space50 { float:none; margin:0; }

      .belegung { display:none; }
      .belegungresp { display:block; }

      .vereinlogin { border-radius: 5px; background:#23985d; padding:0px; }  

      .imghover { width:auto; }
      
     

  /* SUBPAGE FULL CONTENT */

     .content   { padding: 5% 5% 15% 5%; width: 90%; margin: 0 auto 0 auto; }
     .content p { text-align:left; }
     p.center { text-align:center; } 
     


     .content h1 { margin-top:0%; }

  /* SPECIAL NAV AKTIONEN / KULTURELLES */

     .classicNavButton { display:none; }
     .archiveNavButton { display:block; }


  /* FOOTER STUFF    */

     #footbar   { padding: 10% 5%;  position: relative; text-align: left; width: 90%; height:auto; z-index: 1; }
     #footbar .col25 { margin:0; }

     footer ul { display: inline; line-height: 1.4em; list-style-type: none; margin: 0; text-align:left; padding:0; float:none; }
     footer li { margin-left:0px; }


}


@media only screen 
and (min-width : 481px) and (max-width : 768px)
{

      body { font-size:16px; }

      .ccButton { margin-top:8px; }

      #menuarea { width:auto; }
      #menuNav { display:none; }
      #headline { height:auto; }

      #headarea { height: 105px; margin: 0 auto; padding: 11px 0 11px 0; text-align: center; width: 100%; }

      #logo     { width:100%; margin:0 auto; text-align:center; }
      #logo img { height: auto; width: auto;  }

      .logosub { top: 127px; background-size: 220px; background-position: -26px -144px; }

       
   /* NAVIGATION */

      nav        { display:none; }    

   /* HIDE MOBILE MENU ELEMENTS */

      #mobilebox  { display:none; }
      #mobilemenu { display:none; position:absolute; left: -9999px; }

      .normbutton { margin-bottom:10px; }

      h2 { margin:0 0 5px 0; } 
  

   /* TOP IMAGES */
        
      .mainslider { width:100%; height:320px; text-align:center; }
      .sliderow   { width:100%; height:320px; }
      .innerrow   { width:100%; height:320px; }

      .mitslider { width:70%; margin:0 5% 0 15%; padding:0 0 5% 0; /*background:#c3c3a0;*/ }

      .actionBar   {  width:82%; margin:0 auto; padding:4%; height:auto; top:50%; left:5%; background: rgba(75,75,77,.95); border-radius:5px; text-align:left; }
      .actionBar h1 { color:#fff; font-size:20px; margin-bottom:0px; font-weight:bold; }
      .actionBar h2 { color:#fff; font-size:18px; margin-bottom:0px; border:none; margin:0; padding-bottom:0; }
      .actionBar p  { font-size:15px; font-weight:normal; } 

      #imgContainerTQ { width:100%; height:320px; text-align:center; }
      .smallTeaser { width:80%; margin:0 auto; left:0; padding:10px; /* top:68%;*/ /*text-align:center;*/ }


   /* START PAGE STYLES */

      .contentHome { background: rgba(255, 255, 255, 0.94) none repeat scroll 0 0; clear: both; display: block; margin: 0 auto 0; padding: 5%; text-align: left; width: 90%; }
      .startBlockRightBg { height:auto; }

      .formbuttonspacer { margin:0 0 15px 0; }
      .textzone { height:187px; }

   /* PAGE STYLES */ 

      .space25 { margin-right:2%; }
      .space33 { display: none; }

      .col100  { margin:0; }
      .col66   { display: block; width: 100%; margin:0px 0 5px 0; }
      .col33   { display: block; width: 100%; margin:10px 0 25px 0; }
      .col25   { display: block; width: 48%; }
      .col12   { display: block; width: 31.3333333333%; }

      .respSep25 { clear:both; }

      .col50  { display:block; width:100%; }
      .space50 { float:none; margin:0; }

      
      .contentFull   { padding:5%; width: 90%; margin: 55px auto 0 auto; }
      .contentFull p { text-align:left; }
      .contentGold21 { float: none; padding: 0; width: 100%; }
      .contentGold12 { float: none; padding: 0; width: 100%; height:auto; margin-left:0; }

      .belegung { display:none; }
      .belegungresp { display:block; }

      .vereinlogin { border-radius: 5px; background:#23985d; padding:0px; }  

      .imghover { width:auto; }
      
     

  /* SUBPAGE FULL CONTENT */

     .content   { padding: 5% 5% 15% 5%; width: 90%; margin: 0 auto 0 auto; }
     .content p { text-align:left; }
     p.center   { text-align:center; } 
     
     .content h1 { margin-top:0%; }

  /* SPECIAL NAV AKTIONEN / KULTURELLES */

     .classicNavButton { display:none; }
     .archiveNavButton { display:block; }



  /* FOOTER STUFF    */

     #footbar   { padding: 10% 5%;  position: relative; text-align: left; width: 90%; height:auto; z-index: 1; }
     #footbar .col25 { float:left; display:block; width:50%; }
     #footbar .space25 { margin-right:0; } 
     #footbar .specialclear { clear:both; }

     footer ul { display: inline; line-height: 1.4em; list-style-type: none; margin: 0; text-align:left; padding:0; float:none; }
     footer li { margin-left:0px; }

}

@media only screen 
and (min-width : 600px) and (max-width : 768px)
{
      .col66   { display: block; width: 48%; margin:0px 4% 5px 0; }

      .col33   { display: block; width: 48%; margin:10px 0 25px 0; }

      div.contentHome > .col33 { display: block; width: 100%; margin:10px 0 25px 0; }
      .smallTeaser { width:80%; margin:0 auto; left:0; padding:10px; top:68%; /*text-align:center;*/ } 

       .mitslider { width:90%; margin:0 5% 0 10%; padding:0 0 5% 0; /*background:#c3c3a0;*/ }

   /* SPECIAL NAV AKTIONEN / KULTURELLES */

     .classicNavButton { display:none; }
     .archiveNavButton { display:block; }


}

@media only screen 
and (min-width : 769px) and (max-width : 1023px)
{

      body { font-size:16px; }

      .ccButton { margin-top:8px; }

      #menuarea { width:auto; }
      #menuNav { display:none; }
      #headline { height:auto; }

      #headarea { height: 105px; margin: 0 auto; padding: 11px 0 11px 0; text-align: center; width: 100%; }


      #logo     { width:100%; margin:0 auto; text-align:center; }
      #logo img { height: auto; width: auto;  }

      .logosub { top: 127px; background-size: 220px; background-position: -26px -144px;  }
      
   /* NAVIGATION */

      nav        { display:none; }    
      h2 { margin:0 0 5px 0; } 
  

   /* TOP IMAGES */
        
      .mainslider { width:100%; height:320px; text-align:center; }
      .sliderow   { width:100%; height:320px; }
      .innerrow   { width:100%; height:320px; } 

      /*.mitslider  { width:100%; } */

       .mitslider { width:100%; margin:0 5% 0 0; padding:0 0 5% 0; /*background:#c3c3a0;*/ }

      .actionBar   {  width:82%; margin:0 auto; padding:4%; height:auto; top:50%; left:5%; background: rgba(75,75,77,.95); border-radius:5px; text-align:left; }
      .actionBar h1 { color:#fff; font-size:20px; margin-bottom:0px; font-weight:bold; }
      .actionBar h2 { color:#fff; font-size:18px; margin-bottom:0px; border:none; margin:0; padding-bottom:0; }
      .actionBar p  { font-size:15px; font-weight:normal; } 


      #imgContainerTQ { width:100%; height:320px; text-align:center; }
      .smallTeaser { width:80%; margin:0 auto; left:0; padding:10px;  top:68%; /*text-align:center;*/ }


   /* START PAGE STYLES */

      .contentHome { background: rgba(255, 255, 255, 0.94) none repeat scroll 0 0; clear: both; display: block; margin: 0 auto 0; padding: 5%; text-align: left; width: 90%; }
      /* .startBlockLeftBg { height: 100%; max-height:678px; }  */
      .startBlockRightBg { height:auto; }

      .formbuttonspacer { margin:0 0 15px 0; }
      .textzone { height:187px; }

   /* PAGE STYLES */ 

/*
      .space25 { margin-right:2%; }
      .space33 { display: none; }

      .col100  { margin:0; }
      .col66   { display: block; width: 100%; margin:0px 0 5px 0; }
      .col33   { display: block; width: 100%; margin:10px 0 25px 0; }
      .col25   { display: block; width: 48%; }

      .respSep25 { clear:both; }

      .col50  { display:block; width:100%; }
      .space50 { float:none; margin:0; }

      
      .contentFull   { padding:5%; width: 90%; margin: 55px auto 0 auto; }
      .contentFull p { text-align:left; }
      .contentGold21 { float: none; padding: 0; width: 100%; }
      .contentGold12 { float: none; padding: 0; width: 100%; height:auto; margin-left:0; }

      .normbutton { margin-bottom:10px; }

      .belegung { display:none; }
      .belegungresp { display:block; }

      .vereinlogin { border-radius: 5px; background:#23985d; padding:0px; }  

      .imghover { width:auto; }
      
*/     

  /* SUBPAGE FULL CONTENT */

     .content   { padding: 5% 5% 15% 5%; width: 90%; margin: 0 auto 0 auto; }
     .content p { text-align:left; }
     p.center   { text-align:center; } 
     
     .content h1 { margin-top:0%; }


  /* FOOTER STUFF    */

     #footbar   { padding: 10% 5%;  position: relative; text-align: left; width: 90%; height:auto; z-index: 1; }
     #footbar .col25 { float:left; display:block; width:50%; }
     #footbar .space25 { margin-right:0; } 
     #footbar .specialclear { clear:both; }

     footer ul { display: inline; line-height: 1.4em; list-style-type: none; margin: 0; text-align:left; padding:0; float:none; }
     footer li { margin-left:0px; }


  /* HIDE MOBILE MENU ELEMENTS */

     #mobilebox  { display:none; }
     #mobilemenu { display:none; position:absolute; left: -9999px; }
 
}


@media only screen 
and (min-width : 1024px) and (max-width : 1199px)
{
 
     #horizon { max-width:1024px; }
     #menuarea { margin: 56px 0 0 320px; }
     #headarea { width:980px; } 

     .logosub { background-position: -10px -147px; }

  /* SLIDER STUFF */

     .mainslider { width:100%; margin:0 auto; }
     .mitslider  { width:90%; padding: 0 5% 0 5%; margin:0 auto; }

  /* PAGE */
   
     #imgContainerTQ { width:1024px; }

     .content     { width:944px; }
     .contentHome { width:944px; }

     .startBlockRightBg { min-height: 528px; }
     .startBlockLeftBg  { min-height: 528px; }

     .normbutton { margin-bottom:10px; }


  /* FOOTER */

     #footbar { width:944px; padding:34px 40px 0;}


  /* HIDE MOBILE MENU ELEMENTS */

     #mobilebox  { display:none; }
     #mobilemenu { display:none; position:absolute; left: -9999px; }

     #tabletbutton { display:none; }
     #tabletmenu   { display:none; position:absolute; left: -9999px; }

     
}

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

  /* HIDE ELEMENTS */
    
     #mobilebox  { display:none; }
     #mobilemenu { display:none; position:absolute; left: -9999px; }

     #tabletbutton { display:none; }
     #tabletmenu   { display:none; position:absolute; left: -9999px; }


}
