/*
Theme Name: SKS-Germany beta
Theme URI: 
Author: JOM
Author URI: http://www.jomhh.de
Version: 1.0
Text Domain: jom_sks
*/

/* 1.0 Resets
------------------------------------------------------------------------------*/

  *{ box-sizing:border-box }
  a{ text-decoration: none;}
  a img{ border:none }
  a:visited{ color:#222 }
  a:focus{ outline:none !important }
  a:active{ outline:none !important }

  h1,h2,h3{ 
    font-family: "Open Sans Condensed",Arial,sans-serif; 
    text-transform:uppercase
  }
  
  h1{ font-size:35px; margin-top:0;margin-bottom:0px; color:#ee7203 }
  
  h2,.subline{ 
    font-size:25px;
    text-transform:uppercase;
    font-family:'Open Sans Condensed',Arial, sans-serif; 
    font-weight:300; 
    margin-bottom:30px;
    display:block;
  }
  .subline{
      margin-top:-8px;
  }
  
  @media(min-width:480px){
    h1{ font-size:40px }
    h2,.subline{ 
      font-size:30px;
    }
  }


/* 2.0 Grundelemente 
------------------------------------------------------------------------------*/

  html{
    -ms-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    overflow-y: scroll !important   /* zeige immer den scroll balken */
  }

  html.start, body.start{
        height:100%;
  }

  

  body,html{ 

    width:100%;

    height:100%;

    

    margin:0;

    font-family: 'Open Sans', sans-serif;

    color:#222;

 background-attachment: fixed

    overflow-x:hidden;

    min-width:320px;  



  }  

  

  .touch html.menue-offen{

     /* overflow:hidden; */

  

  }

  

  

  .touch body.menue-offen { 

  /*

   overflow:hidden;  /* Wenn Schiebemenü geöffnet wird, verbiete Scrollen */

  /* height:100%;    */

  }  

  

  .buehne,.buehne-abstand{ 

    min-width:300px;

    max-width:960px;

    margin:0 auto;

    position:relative;

    padding:0 20px;

  }

  

  @media(min-width:725px){

       .buehne,.buehne-abstand{ 

      padding:0 10px;

    }

  }

  .buehne.unrelativ{ position:static }

  .buehne-abstand{ padding:0 10px; }

  .inhalt{ padding-top: 170px;}

  @media (min-width: 725px){

    .inhalt{ padding-top:85px; } 
  } 

  
  .clearfix:before,
  .clearfix:after {
    content: " ";
    display: table;  
  }

  .clearfix:after {
    clear: both;
  }

  .clearfix{ margin:0 }

  



  /* 2.1 Allgemeine Buttons und Schaltflächen 

  ----------------------------------------------------------------------------*/



    .button.hg-grau{ background-color:#615f5f;color:#fff }

    

    .button.hg-weiss{ background-color:#fff;color:#ee7203 }

    

    .button { 

      text-align:center;

      border-radius:6px;

      padding:3px 30px;

      font-size:15px;

      text-transform:uppercase;

      display:inline-block;

      cursor:pointer; 

      text-decoration:none;

    }

    

    .button-type-1{

      text-align:center;

      border-radius:4px;

      font-size:12.2px;

      font-weight:600;

      text-transform:uppercase;

      display:inline-block;

      cursor:pointer;

      padding:6px 12px; 

      padding-right:35px;

      text-decoration:none;

      line-height:20px

    }

    

    .button-type-3{
      text-align:center;
      border-radius:4px;
      font-size:12.2px;
      font-weight:600;
      text-transform:uppercase;
      display:inline-block;
      cursor:pointer;
      padding:6px 12px; 
      text-decoration:none;
      line-height:20px
    }
    
    .button-type-3.hg-orange{ background-color:#ee7203;color:#fff }

    .button-type-1.hg-weiss{ background-color:#fff;color:#ee7203 }

    .button-type-1.download:after{ 
      content: "";
      background:url(img/button-icons/download.png);
      display:inline-block;
      width:18px;
      height:17px;
      margin-top:2px;
      margin-left:5px;
      background-repeat:no-repeat;
      position:absolute    
     }

    

    

    .button-type-2{

      text-align:left;

      border-radius:4px;

      font-size:12.2px;

      font-weight:300;

      text-transform:uppercase;

      display:inline-block;

      cursor:pointer;

      padding:6px 12px;

      text-decoration:none;

      line-height:20px;

      background:none;

      background:background:url('img/ie8/70opacity.png');

      background:rgba(255,255,255,0.2);

      border:2px solid #fff;

      border-radius:4px;

      color:#fff

    }

    

    .button-type-2:focus{

       

    }

    

  .weiterlesen-pfeil-klein{ display:inline-block;width:16px;height:16px;background-image:url('img/weiterlesen-news.png');background-repeat:no-repeat;position:relative;top:2px;

         -webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;    

	transition: all 0.3s ease;  



 }

    

    

  /* 2.1 Positionierung

  ----------------------------------------------------------------------------*/



  @media (min-width:725px){



    *[class*="spa"] .pos-lb{ position:absolute;bottom:0px;left:10px; }

    *[class*="spa"] .pos-rb{ position:absolute;bottom:0px;right:10px: }

  }

            

/* 3.0 Hintergründe

------------------------------------------------------------------------------*/



  .hg-black{ 

    background-color:#000 

  }

  

   /* x.0 Hintergrund  

------------------------------------------------------------------------------*/ 

 .hg-unterseite{         

    background-color:#fff;

    background-image:url( 'img/hg/hg-unterseite.png' );

    background-size:100% auto; 

    background-position:center 70%;

    background-repeat:no-repeat; 

   background-attachment: fixed;

   

  }

  

  

   .hg-start{         

    background-color:#000;

    background-image:url( 'img/hg/hg-start-mobile.jpg' );

   /* background-size:100% auto;   */

    background-position:center 135px;

    background-repeat:no-repeat; 

    background-attachment: fixed;

   

  }

  

  

    

  @media (min-width: 725px){

    .hg-start{ 

    /* background-attachment: scroll;  */

      background-image:url( 'img/hg/hg-start.jpg' );

       background-position:top center;

    }

  }

  

  @media (max-height:320px){

  

      .hg-start{

          background-position:center 85px;

      }

  }

  

  

  

  

/* 4.0 Footer und mobiles Submenu

------------------------------------------------------------------------------*/  

   /* 4.1 Footer

  ----------------------------------------------------------------------------*/  

    #footer .buehne{ position:static;padding:0 20px !important }

    

    #footer{ background:#ee7203;min-height:30px;margin-top:20px; }

    

    #footer ul.sitemap{
      list-style:none;
      text-align:center;
      color: #FFF;
      line-height:32px;
      font-size:18px;
      margin:15px 0;
      padding:0;
      text-transform:uppercase;  
    }

	#footer ul li a{ color: #FFF;}  
	#footer ul li a:hover{ color: #222;
    }  

    #footer .katalog-bild, #footer .marker-bild{ display:none }


    @media (min-width: 725px){

     .mobile-haendlersuche{ display:none }

      #footer{ 
        background:transparent;
        height:103px;
        position:fixed;z-index:1;
        width:100%;
        bottom:10px;
        padding: 0;
        color:#fff; 
        margin-top:0;
        -webkit-backface-visibility: hidden;
      }

      #footer h2,h3{ 
        font-family:'Open Sans',Sans Serif;
        font-weight:300;
        font-size:18px; 
        margin-top:0;
        margin-bottom:5px
      }

      #footer .hg-footer { 
        height:103px;
        position:relative;
        margin:0;
        width:100%;
        display:block;
        margin:0 auto;
        padding:18px 0
      }

      #footer .buehne:before{
          content:"";
          position:absolute;width:100%;height:105px; background-image:url('img/hg/hg-fussmenue.png');
          background-repeat:repeat-x;
          margin-left:10px;
      }
      
      
     body.hg-unterseite #footer:before{
          content:"";
          position:absolute;width:100%;height:264px; bottom:-20px; background-image:url('img/hg/hg-fussmenue-weiss.png');
          pointer-events: none;
          background-repeat:repeat-x;
      }

      #footer .hg-footer:before{ 
        content:"";
        top:0px;
        left:-24px;
        position:absolute;
        background:url('img/navi-hg-footer.png');
        background-size:auto 100%;
        background-repeat:no-repeat;
        display:inline-block;
        width:34px;
        height:103px;
      }

      

      #footer .katalog-bild{ 
        display:block;
        margin-top:0px;
        width:50%;
        float:left;
        margin-right:15px
      }

      #footer .marker-bild{ 
        display:block;
        float:left;
        margin-right:10px;
      }

      #footer ul.sitemap{
        margin:0;
        font-size:13px;
        line-height:16px;
        text-align:right; 
      }

    }

    

    @media (min-width:810px){

      #footer .katalog-bild{ 

        width:100px;

      }  

    }

    

    @media (min-width:865px){

      #footer .katalog-bild{ 

        display:block;

        margin-top:-32px;

        float:left;

        width:auto;

        margin-right:15px

      }

    }

    

  

   

  /* 4.2 Haendlersuche-Formular

  ----------------------------------------------------------------------------*/  

  

    /* 4.2.1 Haendlersuche-Formular als mobiles Submenu

    --------------------------------------------------------------------------*/ 

      .sub-menu-mobile{ 

        position:fixed;

        top:80px;

        height:64px; 

        left:0;

        z-index:1000;

 -webkit-transform: translateZ(0);

  -moz-transform: translateZ(0);

  -o-transform: translateZ(0);

  -ms-transform: translateZ(0);

  transform: translateZ(0);

        color:#fff;

        background:#3a3a3a;

        width:100%; 

        min-width:320px;

        -webkit-backface-visibility: hidden;

    

      }

    

      .sub-menu-mobile .d-katalog{ display:none; }  

      .sub-menu-mobile .haendler-formular{ 

        background:#5b5b5a;

        height:auto;

        top:-405px;

        position:relative;

        padding:30px 20px;

        display:none;

      } 

      

      .sub-menu-mobile h3{ margin-top:0px; } 

      .sub-menu-mobile .haendler-formular.sichtbar{ top:0px;display:block; }

      

      .haendler-suche-button-mobil, .katalog-button-mobil{

        display:block;

        float:left;

        width:50%;

        height:64px;

        line-height:64px;

        padding: 0 20px;

        position:relative;

        text-align:center;

        font-family: 'Open Sans Condensed', sans-serif;

        font-size:20px;

        font-weight:bold;

        text-transform:uppercase;  

        color:#fff;

      }

      .katalog-button-mobil .text{ color:#fff; }

      

      /* Icon vor dem Text im Button (links) */

      .haendler-suche-button-mobil:before{ 

        content:""; 

        display:inline-block;

        background:url('img/marker-s.png');

        background-size:100% auto;

        background-position:center center;

        width:20px;

        height:62px;

        position:absolute;

        background-repeat:no-repeat;

       }

       

      .haendler-suche-button-mobil span.text{ 

        margin-left:25px;

        display:inline-block;

      }

      

      /* Dreieck unter Button */

      .mobile-haendlersuche.aktiv .haendler-suche-button-mobil:after{ 

        content: "";

        margin:0 auto;

        display:block;

        width:0;

        height:0;

        border-left: 10px solid transparent;

        border-right: 10px solid transparent;

        border-top: 10px solid #3a3a3a;

        position:relative;

        z-index:1;

        font-size:16px;

        color:#3a3a3a

      }

       

      /* Icon nach dem Text im Button (rechts) */

      .katalog-button-mobil:after{

        content:"";

        display:inline-block;

        background:url('img/button-icons/download-s.png');

        background-size:100% auto;

        background-position:center center;

        width:25px;

        height:62px;

        position:absolute;

        background-repeat:no-repeat;;

      }

       

      .katalog-button-mobil span.text{ 

        margin-right:8px;

        display:inline-block;

      }

    

       

      .ui-widget { display: none; }

    

        

      #sprach-selektor select { 

        width:58px;
        text-transform:uppercase;
        background:none; 

        -webkit-appearance: listbox;  /* android fix for paddings */

        border:none; 

        color:#fff;

        font-size:19px;

        font-weight:bold;

        font-family: "Open Sans Condensed",sans-serif;

        

      }    /* verschieben gehört nicht zu haendler !!! */

      

      

        

      #haendler-selektor select{ 

        width:100%;

        background:none;

        border:2px solid #fff;

        border-radius:4px;

        background:rgba(255,255,255,0.2);

        padding:0px 12px;

        text-align:left;

        height:36px;

        line-height:30px;

        -webkit-appearance: listbox;

        padding-left:25px;

        color:#fff; margin-bottom:20px;

      }

          

      #haendler-selektor:before{

        content: "\25BC";

        position:absolute;

        margin-top:10px;

        margin-left:10px;

        font-size:12px;

      }

         

        

      .suche-button-haendler{ 

        display:block;

        position:absolute;

        z-index:1;

        width:40px;

        height:36px;

        right:0px;

        cursor:pointer;

        background:url('img/lupe.png');

        background-position:center center;

        background-repeat:no-repeat;

        border:none

      }

        

      #postleitzahlen-feld{ position:relative }

      .postleitzahl{ display:block;width:100%; }

        

      

       @media (max-width: 725px){

        .no-touch  select{ display:inline-block !important }

        .no-touch  .ui-selectmenu{ display:none !important }

       }

       

       @media (min-width:725px){

       

           .no-touch select{ display:none !important }

          .no-touch .ui-selectmenu{ display:inline-block !important }

       }

       

       @media (max-height:320px){

        .sub-menu-mobile{ 

         /* position:absolute; */

          left:0;

         /* top:85px;     */

       /*   display:table; */     /* android fix  omg */

        }

       }

       

    

    /* 4.2.2 Haendlersuche-Formular im festen Footer 

    --------------------------------------------------------------------------*/ 

    @media (min-width: 725px){

   

      .sub-menu-mobile .haendler-formular{ 

        background:#5b5b5a;

        height:auto;

        top:auto;

        position:relative;

        padding:0; 

        display:block;

      }

      .sub-menu-mobile{ 

        position:static;

        background:transparent;

        height:auto

      }

      .sub-menu-mobile .haendler-formular{ background:transparent }

     

      #footer .d-katalog{ display:block; padding-left:30px; }

     

      .ui-widget { display: block; }

      .ui-selectmenu { 

        display: block;

        display: inline-block;

        position: relative;

        height: 2.2em;

        vertical-align: middle;

        text-decoration: none;

        overflow: hidden; 

        zoom: 1; 

      }

      .ui-selectmenu-icon { 

        position:absolute; 

        right:6px; 

        margin-top:-8px; 

        top: 50%; 

      }

      .ui-selectmenu-menu { 

        padding:0; 

        margin:0; 

        position:absolute; 

        top: 0; 

        display: none;

        z-index: 1005;

      }

      .ui-selectmenu-menu  ul { 

        padding:0; 

        margin:0; 

        list-style:none; 

        position: relative; 

        overflow: auto; 

        overflow-y: auto ; 

        overflow-x: hidden; 

        -webkit-overflow-scrolling: touch;

      } 

      .ui-selectmenu-open { display: block; }

      .ui-selectmenu-menu-popup { margin-top: -1px; }

      .ui-selectmenu-menu li { 

        padding:0; 

        margin:0; 

        display: block; 

       /* border-top: 1px dotted transparent;   */

      /*  border-bottom: 1px dotted transparent;   */

        border-right-width: 0 !important; 

        border-left-width: 0 !important; 

        font-weight: normal !important; 

         border-top:1px solid #fff;

      }

      .ui-selectmenu-menu li a,.ui-selectmenu-status { 

        line-height: 1.4em; 

        display: block;

        padding: .405em 2.1em .405em 1em;

        outline:none;

        text-decoration:none;

      }

      .ui-selectmenu-menu li.ui-state-disabled a, .ui-state-disabled { 

        cursor: default; 

      }

      .ui-selectmenu-menu li .ui-icon, .ui-selectmenu-status .ui-icon { 

        position: absolute;

        top: 1em;

        margin-top: -8px;

        left: 0; 

      }

      .ui-selectmenu-status { line-height: 1.4em; }

      .ui-selectmenu-menu li span,.ui-selectmenu-status span { 

        display:block;

        margin-bottom: .2em;

       

        

      }

      .ui-selectmenu-menu li .ui-selectmenu-item-header { font-weight: bold; }

      .ui-selectmenu-menu li .ui-selectmenu-item-footer { opacity: .8; }

      

      .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { text-decoration: none; }

      .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border:none;  }

      .ui-state-hover a, .ui-state-hover a:hover { background:#ee7203;color: #fff !important /*{fcHover}*/; text-decoration: none; }

      #sprach-selektor .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background:url('img/ie8/70opacity.png'); background: rgba(255,255,255,1) }

      .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #222/*{fcActive}*/; text-decoration: none; }

      .ui-widget :active { outline: none; }

      

    

      #sprach-selektor select { width:58px;text-transform:uppercase; }

      

      #sprach-selektor .ui-widget {font-size:19px; font-weight:bold;color:#fff;text-transform:uppercase; }

      #sprach-selektor .ui-widget-content { background:rgba(255,255,255,0.8) }

      #sprach-selektor .ui-widget-content a { color: #666}

    

    

  	

	/* --- TF war am Werk --- */

	

	#sprachwahl-button { border-radius: 6px 6px 0 0;}

	#sprach-selektor .ui-state-active .ui-selectmenu-status{ color: #EE7203;}

	#sprachwahl-menu li { border-top: 1px solid #FFF;}

	.ui-selectmenu-menu li a{ font-weight: 600;}

	.ui-corner-bottom{ border-radius: 0 0 6px 6px;}

	

	#haendlerwahl-menu li{ border-top: 1px solid #FFF;}

	

	/* --- */  

    

    

    

    

    

    

    

    

    

      #haendler-selektor select{ width:110px; }

      #haendler-selektor{ display:inline-block; float:left;margin-right:5px; }

      #haendlerwahl-button{ overflow:hidden;width:138px !important; }

      

      #haendler-selektor .ui-widget { 

        font-size:14px;

        font-weight:300;

        color:#fff;

        border:2px solid #fff;

        border-radius:4px;

        padding:0px 12px;

        text-align:right;

        height:36px;

        line-height:30px;

        background:rgba(255,255,255,0.2);

      }

      #haendler-selektor .ui-selectmenu-status{ 

        overflow:hidden;

        white-space: nowrap 

      } 

       

      #haendler-selektor .ui-selectmenu-status{ padding-right:0px !important }

      #haendler-selektor .ui-widget-content { 

        background:url('img/ie8/70opacity.png');

        background:rgba(255,255,255,0.8);

      }

      #haendler-selektor .ui-widget-content a { color: #666}

      

      .ui-selectmenu-open:after{ content:" "; display:block;height:10px; } 

      #haendlerwahl-menu{ 

        width:150px !important;

        text-align:left !important;

        padding:0px !important;

      }

      

      .suche-button-haendler{ 

        display:block;

        position:absolute;

        z-index:1;

        width:40px;

        height:36px;

        right:0px;

        cursor:pointer;

        background:url('img/lupe.png');

        background-position:center center;

        background-repeat:no-repeat;

        border:none

      }

       

      #postleitzahlen-feld{ float:left;position:relative }

      

      #postleitzahlen-feld .postleitzahl{ 

        padding-right:40px; 

        max-width:149px;

        height:36px; 

      }

      #postleitzahlen-feld  ::-webkit-input-placeholder { color:#fff;}

      

      #postleitzahlen-feld :-moz-placeholder { color:#fff;opacity: 1;}

      

      #postleitzahlen-feld ::-moz-placeholder { color:#fff;opacity: 1;}

      

      #postleitzahlen-feld:-ms-input-placeholder { color:#fff;}

      

      .postleitzahl{ float:right }

    }





/* 5.0 Seitenmenü / Schiebemenü

------------------------------------------------------------------------------*/  



.schiebe-menue {

	background: #222222;

	position: fixed;   

  max-width: 320px;

	width:220px;

  height: 100%;

	top: 0;

	z-index: 99999;

  left: -220px;  

  -webkit-overflow-scrolling: touch;   

  -webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;    

	transition: all 0.3s ease;

 transform:translateZ(0);

  height:100%; 

}





.schiebe-menue:before{

   content:" "; 

   display:block; 

   position:absolute;

   z-index:1;

   height:200%;   /* immer über komplette Höhe(mobil Adressbalken Android fix)*/

   width:100%;

   background:#222222

}



.schiebe-menue.menue-offen{

  left:0px;

  /*   

  transform:translate3d(220px,0,0); 

  -webkit-transform:translate3d(220px,0,0); */  

}



.csstransforms3d .schiebe-menue.menue-offen{

  /*left:0px;*/ 

  left:-220px;   

  transform:translateX(220px); 

  -webkit-transform:translateX(220px); 

    -webkit-overflow-scrolling: touch;   

  -webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;    

	transition: all 0.3s ease;  

}







.schiebe-menue #scroller{  

  width:200px;

  height:100%;

  overflow:hidden;

  z-index:10001;

  padding-top:20px;   

}





#scroller{

    position:absolute;

    z-index:20;

}





#scroller #scroller-inner{

  width:240px;

  height:100%;

  overflow:auto;   

  padding-left:20px;

}



.schiebe-menue-logo{ display:none; }



a.startseiten-link{ color:#ee7203;text-decoration:none; }



ul#seiten-menu{ max-width:200px ; overflow:hidden; }

ul#seiten-menu,ul#seiten-menu ul{ list-style:none;padding:0; }

ul#seiten-menu a, a.startseiten-link{ 

  display:block;

  text-decoration:none;

  font-weight:600;

  text-transform:uppercase;

  font-size:17px;

}

ul#seiten-menu > li > ul{ padding-left:20px; }

ul#seiten-menu > li a { color:#ee7203 }

ul#seiten-menu > li ul li a { color:#fff }

ul#seiten-menu > li ul li ul li a { color:#999 }

ul#seiten-menu > li.abstand { margin-bottom:20px }





ul#seiten-menu ul{ margin-bottom:20px; }

ul li ul li{ color:#fff; }

/* Aktive Menupunkte mit Pfeil markieren */
ul#seiten-menu li.menu-item > a:hover:before,
ul#seiten-menu li.current-menu-item > a:before{
	content: "\f345";
	font-family: dashicons;
	position: absolute;
	-webkit-transform: translate(-18px,4px);
	-moz-transform: translate(-18px,4px);
	-ms-transform: translate(-18px,4px);
	-o-transform: translate(-18px,4px);
	transform: translate(-18px,4px);
	color: #FFF;
	-webkit-animation: pfeil 0.7s infinite;
	-moz-animation: pfeil 0.7s infinite;
	-ms-animation: pfeil 0.7s infinite;
	-o-animation: pfeil 0.7s infinite;
	animation: pfeil 0.7s infinite;

	}

ul#seiten-menu li.menu-item > a:hover:before{ color: #EE7203;} 
	
ul#seiten-menu li.current-menu-ancestor > a:before,
ul#seiten-menu li.current-page-ancestor > a:before{ display: none;}

ul#seiten-menu li.current-menu-ancestor > a:hover:before,
ul#seiten-menu li.current-page-ancestor > a:hover:before{
	display: block;
	}

@keyframes pfeil {
    0%   {-webkit-transform: translate(-18px,4px);
		  -moz-transform: translate(-18px,4px);
		  -ms-transform: translate(-18px,4px);
		  -o-transform: translate(-18px,4px);
		  transform: translate(-18px,4px);}
	50%  {-webkit-transform: translate(-28px,4px);
		  -moz-transform: translate(-28px,4px);
		  -ms-transform: translate(-28px,4px);
		  -o-transform: translate(-28px,4px);
		  transform: translate(-28px,4px);}
    100% {-webkit-transform: translate(-18px,4px);
		  -moz-transform: translate(-18px,4px);
		  -ms-transform: translate(-18px,4px);
		  -o-transform: translate(-18px,4px);
		  transform: translate(-18px,4px);}
}

@-webkit-keyframes pfeil {
    0%   {-webkit-transform: translate(-18px,4px);
		  transform: translate(-18px,4px);}
	50%  {-webkit-transform: translate(-28px,4px);
		  transform: translate(-28px,4px);}
    100% {-webkit-transform: translate(-18px,4px);
		  transform: translate(-18px,4px);}
}


.csstransforms3d .seiten-menu-button{

   /*

    transform:translateZ(0);

  -webkit-transform:translateZ(0);   */

}



.seiten-menu-button{

   

    

     background-image:url('img/menu-button-mobil.png');

     background-position:left center;

     background-repeat:no-repeat;

     width:55px;

     height:85px;  

     position:absolute;

     z-index:999;

     display:block;

     top:0px;

     right:-54px; 

      transform:translateZ(0);

 

}





  /* 5.1 Ansicht Tablet und Desktop

  ----------------------------------------------------------------------------*/  

  @media (min-width: 400px){

    .schiebe-menue {

        width:320px;

        left:-320px; 

             

    } 

    

  

.schiebe-menue.menue-offen{

  left:0px;   



}  

    

    

 .csstransforms3d .schiebe-menue.menue-offen{

  /*left:0px;*/   

 

  transform:translateX(-320px,0,0); 

  -webkit-transform:translateX(-320px,0,0);  

    -webkit-overflow-scrolling: touch;   

  -webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;    

	transition: all 0.3s ease;

}

      

    .schiebe-menue-logo{

      margin:40px 80px;

      display:block;
      z-index:9999;
      position:absolute;

      display:block;

    }  

    

    .schiebe-menue #scroller{  

      width:320px;

      height:100%;

      overflow:hidden;

      z-index:1000;

      padding-top:20px;

    }

  

    #scroller #scroller-inner{

      width:340px;

      height:100%;

      overflow:auto;

      padding-left:20px;

    }

    .schiebe-menue #scroller{ 

      padding-top:186px; 

    } 

    #scroller #scroller-inner{

    padding-left:80px;

    }   

  }





  @media (min-width: 1080px){

  

    .seiten-menu-button{

            background-image:url('img/menu-button.png');

            background-repeat:no-repeat;

      z-index:999;

      display:block;

      top:100px;

      right:-94px;

      cursor:pointer;

        width:94px;

      height:114px;

    }

    

    .seiten-menu-button.gluehen{  

        background-image:url('img/menu-button-gluehen.png'); 

    } 

    

  }





/* 6.0 Obere Navigation

------------------------------------------------------------------------------*/ 



.customize-support nav#obere-navigation {

  top:32px;

}



nav#obere-navigation{ 

  height:85px;

  padding:10px 0;

  background:#000;

  position:fixed;

  z-index:9999;

   -webkit-transform: translateZ(0);

  -moz-transform: translateZ(0);

  -o-transform: translateZ(0);

  -ms-transform: translateZ(0);

  transform: translateZ(0);

 opacity:1;



 

  top:-1px;

  left:0;

  width:100%; 

  font-family: 'Open Sans Condensed', sans-serif;

 

}



nav#obere-navigation > .buehne{ padding-left:10px;padding-right:20px }

nav#obere-navigation:before{ 

  content:"";

  line-height:65px;

  height:65px;

  position:absolute;

  margin:0;

  padding:0;

  background:#ee7203;

  width:50%;

  display:block;

}

nav#obere-navigation .hg{ 

  float:left;

  line-height:65px;

  height:65px;

  position:relative;

  margin:0;

  padding:0;

  background:#ee7203;

  width:85%;

  display:block;

  margin:0 auto;

}



nav#obere-navigation  ul.haupt, nav#obere-navigation  ul.neben{ 

  margin:0;

  padding:0;

  list-style:none; 

}

nav#obere-navigation  ul.neben{ margin-left:0px; float:right; }

nav#obere-navigation  ul.haupt li,nav#obere-navigation  ul.neben > li{ 

  float:left; 

}

nav#obere-navigation  ul.haupt li a,nav#obere-navigation  ul.neben > li > a{ 

  color:#fff;

  text-decoration:none;

  text-transform:uppercase;

  font-size:19px;

  font-weight:bold;

  margin:0 10px;

}



nav#obere-navigation  ul.haupt li:first-child  a { margin-left:0px }

nav#obere-navigation  ul.haupt li a{ position:relative; }



nav#obere-navigation  ul.haupt li a:after{ 

  content:"";

  display:block;

  left:50%;

  margin-left:-5px;

  bottom:-10px;

  width: 16px; 

	height:10px; 

   background:url('img/dreieck-oben.png');

  background-position:center center;

  background-repeat:no-repeat;

  visibility:hidden;

  position:absolute;

  -webkit-transition: all  ease-out 0.3s;

  -moz-transition: all ease-out 0.3s;

  -o-transition: all ease-out 0.3s;

  transition: all ease-out 0.3s;

}



nav#obere-navigation  ul.haupt li a{ display:block;}

 

nav#obere-navigation  ul.haupt li a:hover, 

nav#obere-navigation  ul.haupt li.current-menu-item a{ 

  color:#222 

}



nav#obere-navigation  ul.haupt li.current-menu-item a:after, 

nav#obere-navigation  ul.haupt li a:hover:after { 

  content:"";

  display:block;

  left:50%;

  visibility:visible;

  margin-left:-5px;

  bottom:0px;

  width:16px;

  height:10px;

  background:url('img/dreieck-oben.png');

  background-position:center center;

  background-repeat:no-repeat;

  position:absolute;

 

}

nav#obere-navigation .hg:after{ 

  content:"";

  top:0;

  right:-19px;

  position:absolute;

  background:url('img/navi-hg.png');

  clear:both;

  background-repeat:no-repeat;

  display:inline-block;

  width:20px;

  height:65px; 

}



#sks-logo{ float:left;margin-left:26px; }



@media (min-width:320px){

  #sks-logo{ 

     margin-left:32px

  }

}



@media (min-width:400px){

  #sks-logo{ ;margin-left:42px; }

}

 

nav#obere-navigation ul.neben > li > a.share{

  height:65px;  

  background-image:url('img/share-button-mobile.png');

  background-position:center center;

  background-repeat:no-repeat; 

  width:30px;

  display:inline-block;

  background-size:100% auto;

}


 a.facebook.fixed-button, a.youtube.fixed-button{ display:none }
 


@media (min-width:1080px){


  nav#obere-navigation ul.neben > li > a.share.desktop{ display:none }
  
  
  a.facebook.fixed-button,  a.youtube.fixed-button{ 
    display:block;
    left:0;
    z-index:9;
    top:230px;

    width:48px;

    height:52px;

    background-image:url('img/facebook-button.png');

    background-position:center center;

    background-repeat:no-repeat; 

    margin:0;

  }
  
   a.youtube.fixed-button{  top:290px;     background-image:url('img/yt-button.png'); }



  .fixed-button{ position:fixed;-webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); transform:translateX(0);  }



  nav#obere-navigation  ul.haupt li a,nav#obere-navigation  ul.neben > li > a{ 

    margin:0 20px; 

  }

}



.claim{ display:none;}

.claim{ color:#fff;font-weight:bold;font-size:24px;text-transform:uppercase;width:100%;max-width:960px; }

.claim-unten{ text-align:center;color:#fff;position:relative;font-size:30px;display:block;margin:20px;

 text-shadow:

      0 0 10px #000000,

      0 0 20px #000000,

      0 0 30px #000000,

      0 0 40px #000000,

      0 0 70px #000000,

      0 0 80px #000000;

}





@media (min-width: 725px){

    .claim{ display:inline-block; margin-left:50px; float:left;width:60% }

    .claim-unten{ visibility:hidden;

      text-shadow:

      0 0 10px #000000,

      0 0 20px #000000,

      0 0 30px #000000,

      0 0 40px #000000,

      0 0 70px #000000,

      0 0 80px #000000;

      font-size:36px;

    }

    

    ul.neben{ float:right }  

}



@media (min-width: 1080px){

    .claim{ display:none }

    .claim-unten{ display:block;visibility:visible;top:-50px; }

    li.sprache{ float:right;margin-right:20px; } 



  

}



@media (min-height:750px) and (min-width:1024px){ 

    .claim-unten{ top:-20px !important; 

    }

}









 

/* Desktop */

nav#obere-navigation .hg ul.haupt{ display:block }

   

/* Tablet */

@media (max-width: 1024px) and (min-width: 840px){

  

}

  

@media (max-width: 1079px){ 

  nav#obere-navigation .hg ul.haupt{ display:none}

  nav#obere-navigation .hg{ width:75%  }

  

}

 

 

 @media (max-width:570px){

     nav#obere-navigation .hg{ width:60%  }

 }

 

 @media (max-width:340px){

     nav#obere-navigation .hg{ width:60%  }

 }

  

.suche-button{ 
  cursor:pointer;
  display:inline-block;
  background-image:url('img/lupe.png');
  background-position:center center; 
  width:20px;
  height:66px;
  background-repeat:no-repeat;
}

#suchfeld-buehne{ 
	display: none; 
	position: fixed; 
	top: 74px; 
	width: 100%; 
	z-index: 9999;
	background: #666;
	border-top: 10px solid #000;
	}
#suchfeld-eingabe{ 
	width: 100%;
	left: 0;
	margin-left: auto;
	margin-right: auto;
	padding: 6px 0;
	}

#suchfeld-eingabe input{
	border: none;
	width: 58%;
	padding: 8px 8px;
	font-family:'Open Sans Condensed',Arial, sans-serif;
	font-size: 1.2em;
	font-weight: 600;
	text-transform: uppercase; 
	color: #666;
	background: #FFF;
	margin-right: 10px;
	border: 2px solid #666;
	background-clip: border-box;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	-ms-border-radius: 7px;
	-o-border-radius: 7px;
	border-radius: 7px;
	-webkit-transition: 0.3s border;
	-moz-transition: 0.3s border;
	-ms-transition: 0.3s border;
	-o-transition: 0.3s border;
	transition: 0.3s border;
	}
	
#suchfeld-eingabe input:focus,
#suchfeld-eingabe input:hover{
	border: 2px solid #EE7203;
	-webkit-transition: 0.3s border;
	-moz-transition: 0.3s border;
	-ms-transition: 0.3s border;
	-o-transition: 0.3s border;
	transition: 0.3s border;
	}
	
#suchfeld-eingabe input[type='submit']{
	border: 1px solid #555;
	max-width: 100px;
	height: 44px;
	font-weight: 600;
	color: #FFF;
	background: #444;
	text-transform: uppercase; 
	margin: 0; padding: 0;
	cursor: pointer;
	margin-right: 0;
	-webkit-transition: 0.3s background;
	-moz-transition: 0.3s background;
	-ms-transition: 0.3s background;
	-o-transition: 0.3s background;
	transition: 0.3s background;
	}
	
#suchfeld-eingabe input[type='submit']:hover{
	background: #000;
	-webkit-transition: 0.3s background;
	-moz-transition: 0.3s background;
	-ms-transition: 0.3s background;
	-o-transition: 0.3s background;
	transition: 0.3s background;
	}


/* 7.0 12-Spalten Raster
------------------------------------------------------------------------------*/ 


/* 7.1 12-Spalten Raster  - Zeilen
----------------------------------------------------------------------------*/ 

.z:before,
.z:after {
	content: " ";
	display: table;  
	}

.z:after {
	clear: both;
	}

.z{ margin:0 -10px }

  

  /* 7.2 12-Spalten Raster  - Spaleten mit Breakpoints

  ----------------------------------------------------------------------------*/ 

  

    /* 7.2.1 Breakpoint-0    (0 - 480px)

    --------------------------------------------------------------------------*/ 

      .spa-br0-1, .spa-br0-2, .spa-br0-3, .spa-br0-4, .spa-br0-5, 

      .spa-br0-6, .spa-br0-7, .spa-br0-8, .spa-br0-9, .spa-br0-10, 

      .spa-br0-11, .spa-br0-12{

        position: relative;

        min-height: 1px;

        padding-left: 10px;

        padding-right: 10px;

        float:left;

      }

      

        .spa-br0-12 {

          width: 100%;

        }

        .spa-br0-11 {

          width: 91.66666667%;

        }

        .spa-br0-10 {

          width: 83.33333333%;

        }

        .spa-br0-9 {

          width: 75%;

        }

        .spa-br0-8 {

          width: 66.66666667%;

        }

        .spa-br0-7 {

          width: 58.33333333%;

        }

        .spa-br0-6 {

          width: 50%;

        }

        .spa-br0-5 {

          width: 41.66666667%;

        }

        .spa-br0-4 {

          width: 33.33333333%;

        }

        .spa-br0-3 {

          width: 25%;

        }

        .spa-br0-2 {

          width: 16.66666667%;

        }

        .spa-br0-1 {

          width: 8.33333333%;

        } 

      



    /* 7.2.1 Breakpoint-10    ( >=480 )

    --------------------------------------------------------------------------*/ 

      @media (min-width: 480px) {

        .spa-br10-1, .spa-br10-2, .spa-br10-3, .spa-br10-4, .spa-br10-5, 

        .spa-br10-6, .spa-br10-7, .spa-br10-8, .spa-br10-9, .spa-br10-10, 

        .spa-br10-11, .spa-br10-12 {

          float: left;   

        }

       .z{ margin:0 -10px}

      

        .spa-br10-1, .spa-br10-2, .spa-br10-3, .spa-br10-4, .spa-br10-5,

        .spa-br10-6, .spa-br10-7, .spa-br10-8, .spa-br10-9, .spa-br10-10, 

        .spa-br10-11, .spa-br10-12{

          position: relative; 

          min-height: 1px;

          padding-left: 10px;

          padding-right: 10px;

       }

      

        .z-s-padding{ margin:0 -7px }

       .s-padding{ padding-left:7px;padding-right:7px }  

      

        .spa-br10-12 {

          width: 100%;

        }

        .spa-br10-11 {

          width: 91.66666667%;

        }

        .spa-br10-10 {

          width: 83.33333333%;

        }

        .spa-br10-9 {

          width: 75%;

        }

        .spa-br10-8 {

          width: 66.66666667%;

        }

        .spa-br10-7 {

          width: 58.33333333%;

        }

        .spa-br10-6 {

          width: 50%;

        }

        .spa-br10-5 {

          width: 41.66666667%;

        }

        .spa-br10-4 {

          width: 33.33333333%;

        }

        .spa-br10-3 {

          width: 25%;

        }

        .spa-br10-2 {

          width: 16.66666667%;

        }

        .spa-br10-1 {

          width: 8.33333333%;

        } 

      }

      

      

          /* 7.2.1 Breakpoint-20    ( >= 660px)

    --------------------------------------------------------------------------*/ 

      @media (min-width: 660px) {

        .spa-br20-1, .spa-br20-2, .spa-br20-3, .spa-br20-4, .spa-br20-5, 

        .spa-br20-6, .spa-br20-7, .spa-br20-8, .spa-br20-9, .spa-br20-10, 

        .spa-br20-11, .spa-br20-12 {

          float: left;   

        }

       .z{ margin:0 -10px}

      

        .spa-br20-1, .spa-br20-2, .spa-br20-3, .spa-br20-4, .spa-br20-5,

        .spa-br20-6, .spa-br20-7, .spa-br20-8, .spa-br20-9, .spa-br20-10, 

        .spa-br20-11, .spa-br20-12{

          position: relative; 

          min-height: 1px;

          padding-left: 10px;

          padding-right: 10px;

       }

      

        .z-s-padding{ margin:0 -7px }

       .s-padding{ padding-left:7px;padding-right:7px }  

      

        .spa-br20-12 {

          width: 100%;

        }

        .spa-br20-11 {

          width: 91.66666667%;

        }

        .spa-br20-10 {

          width: 83.33333333%;

        }

        .spa-br20-9 {

          width: 75%;

        }

        .spa-br20-8 {

          width: 66.66666667%;

        }

        .spa-br20-7 {

          width: 58.33333333%;

        }

        .spa-br20-6 {

          width: 50%;

        }

        .spa-br20-5 {

          width: 41.66666667%;

        }

        .spa-br20-4 {

          width: 33.33333333%;

        }

        .spa-br20-3 {

          width: 25%;

        }

        .spa-br20-2 {

          width: 16.66666667%;

        }

        .spa-br20-1 {

          width: 8.33333333%;

        } 

      }

 



    /* 7.2.1 Breakpoint-30    ( >= 725px)

    --------------------------------------------------------------------------*/ 

      @media (min-width: 725px) {

        .spa-br30-1, .spa-br30-2, .spa-br30-3, .spa-br30-4, .spa-br30-5, 

        .spa-br30-6, .spa-br30-7, .spa-br30-8, .spa-br30-9, .spa-br30-10, 

        .spa-br30-11, .spa-br30-12 {

          float: left;

        }

        .z{ margin:0 -10px}

    

        .spa-br30-1, .spa-br30-2, .spa-br30-3, .spa-br30-4, .spa-br30-5, 

        .spa-br30-6, .spa-br30-7, .spa-br30-8, .spa-br30-9, .spa-br30-10, 

        .spa-br30-11, .spa-br30-12{

          position: relative;

          min-height: 1px;

          padding-left: 10px;

          padding-right: 10px;

        }

    

        .spa-br30-12 {

          width: 100%;

        }

        .spa-br30-11 {

          width: 91.66666667%;

        }

        .spa-br30-10 {

          width: 83.33333333%;

        }

        .spa-br30-9 {

          width: 75%;

        }

        .spa-br30-8 {

          width: 66.66666667%;

        }

        .spa-br30-7 {

          width: 58.33333333%;

        }

        .spa-br30-6 {

          width: 50%;

        }

        .spa-br30-5 {

          width: 41.66666667%;

        }

        .spa-br30-4 {

          width: 33.33333333%;

        }

        .spa-br30-3 {

          width: 25%;

        }

        .spa-br30-2 {

          width: 16.66666667%;

        }

        .spa-br30-1 {

          width: 8.33333333%;

        }  

        .push-br30-6 {

          left: 50%;

        }

        .pull-br30-6 {

          right: 50%;

        }  

        

        .push-br30-5 {

          left: 41.66666667%;

        }

        .pull-br30-5 {

          right: 41.66666667%;

        }  

        

        

            .push-br30-7 {

          left: 58.33333333%;

        }

        .pull-br30-7 {

          right: 58.33333333%;

        } 

        

        

      } 

  

  

   

    /* 7.2.1 Breakpoint-40    ( >= 865px)

    --------------------------------------------------------------------------*/ 

    @media (min-width: 865px) {

      .spa-br40-1, .spa-br40-2, .spa-br40-3, .spa-br40-4, .spa-br40-5, 

      .spa-br40-6, .spa-br40-7, .spa-br40-8, .spa-br40-9, .spa-br40-10, 

      .spa-br40-11, .spa-br40-12 {

        float: left;

    

      }

  

      .z{ margin:0 -10px}

  

      .spa-br40-1, .spa-br40-2, .spa-br40-3, .spa-br40-4, .spa-br40-5, 

      .spa-br40-6, .spa-br40-7, .spa-br40-8, .spa-br40-9, .spa-br40-10, 

      .spa-br40-11, .spa-br40-12{

        position: relative; 

        min-height: 1px;

        padding-left: 10px;

        padding-right: 10px;

      }

      

      .z-s-padding{ margin:0 -7px }

      .s-padding{ padding-left:7px;padding-right:7px }  

      

      .spa-br40-12 {

        width: 100%;

      }

      .spa-br40-11 {

        width: 91.66666667%;

      }

      .spa-br40-10 {

        width: 83.33333333%;

      }

      .spa-br40-9 {

        width: 75%;

      }

      .spa-br40-8 {

        width: 66.66666667%;

      }

      .spa-br40-7 {

        width: 58.33333333%;

      }

      .spa-br40-6 {

        width: 50%;

      }

      .spa-br40-5 {

        width: 41.66666667%;

      }

      .spa-br40-4 {

        width: 33.33333333%;

      }

      .spa-br40-3 {

        width: 25%;

      }

      .spa-br40-2 {

        width: 16.66666667%;

      }

      .spa-br40-1 {

        width: 8.33333333%;

      }

      

        .push-br40-6 {

          left: 50%;

        }

        .pull-br40-6 {

          right: 50%;

        }  

       

    }

     

/* 8.0 Breadcrumb

------------------------------------------------------------------------------*/   





#breadcrumb a, .breadcrumb_last{ 

  text-transform:uppercase;

  font-size:12px;

  color:#000;

  text-decoration:none;

  font-weight:600;

}





#breadcrumb a:first-child{ color:#ee7203 }

#breadcrumb a:hover{ color:#ee7203 }

#breadcrumb a:after{ content:"\00a0// "; } 

#breadcrumb .breadcrumb_last{ text-decoration:underline } 

#breadcrumb .breadcrumb_last:hover{ color:#000 }

#breadcrumb .breadcrumb_last:after{ content:""; }

#breadcrumb { margin:0;margin-bottom:10px; }











@media (min-width:725px){

  #breadcrumb { margin:30px 0 ; margin-bottom:20px}

  

  .inhalts-box #breadcrumb{ margin:0;margin-bottom:10px }

}





/* 9.0 Upgrade Screen für alte Browser

------------------------------------------------------------------------------*/   

#upgrade-screen{ 

  position:fixed;

  top:0;

  left:0;

  width:100%;

  height:100%;

  background:#000;

  color:#fff;

  padding-top:100px;

  text-align:center

}









   /* x.3.1  Boxen mit transparenten Hintergrund

  ----------------------------------------------------------------------------*/ 

  .inhalts-box{

    width:100%;

    background:url('img/ie8/60opacity.png');

    background:rgba(255,255,255,.6);

     

    border-radius:10px;padding:10px;    

    position:relative;

  }



  .inhalts-box-innen{

    

    border-radius:10px;

    width:100%;

    height:100%;

      background:url('img/ie8/70opacity.png');

    background:rgba(255,255,255,.7);

    font-size:14px;  

    position:relative;

  }

  

  .inhalts-box-innen > .z{ padding:20px; }

  

  .inhalts-box-innen > #breadcrumb.z{ padding:20px 0 }



  .inhalts-box-innen::before, .inhalts-box-innen::after {

    content: " ";

    display: table;

}



  .inhalts-box-innen h2 { 

    font-family: 'Open Sans Condensed', sans-serif; 

    font-weight:700;

    color:#ee7203;

    margin:0px;

    margin-bottom:25px;

  }


.filter-button.inaktiv img {
	  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
	/*
	-webkit-filter: grayscale(1); -webkit-filter: grayscale(100%);
	filter: gray; filter: grayscale(100%);  */
	}

 
.tooltip:after { 
	content: attr(data-tooltip); 
	position: absolute;
	background: #ee7203; 
	padding: 10px 25px; 
	font-size: 14px;
	color: #FFF; 
	-webkit-border-radius: 7px; 
	-moz-border-radius : 7px;
	-ms-border-radius : 7px;
	-o-border-radius : 7px; 
	border-radius : 7px;
	display: none; 
	text-decoration: none;
	}

.tooltip:before { 
	content: ""; 
	position: absolute;
	width: 0; 
	height: 0; 
	border-top: 10px solid #ee7203; 
	border-left: 10px solid transparent; 
	border-right: 10px solid transparent; 
	display: none; 	 
	}
.tooltip:hover:after {} 
.tooltip:hover:before {}
.tooltip:hover:before, .tooltip:hover:after { display: block;}
 
@media(max-width: 750px ){
	.touch .tooltip:before, .touch .tooltip:after,
	.tooltip:before, .tooltip:after,
	.tooltip:hover:before, .tooltip:hover:after { display: none;}
}


 /** lade balken für ajax **/

#loader-screen{ width:100%;height:100%;background:rgba(255,255,255,0.6);position:fixed;z-index:2;display:block;top:0;left:0;display:none; }
#loader{  }
.loading {
  display: block;
  position:absolute;
  top:50%;margin-top:-25px ;
  margin-left:-25px;left:50%;
  border-width: 5px;
  border-radius: 50%;
  -webkit-animation: spin 1s linear infinite;
     -moz-animation: spin 1s linear infinite;
       -o-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
  }

.style-1 {
  border-style: solid;
  border-color: #444 transparent;
  }

.style-2 {
  border-style: double;
  border-color: #444 transparent;
  }

.circle {
  border-style: solid;
  border-color: #000 #EE7203 #EE7203;
  width:50px;
  height:50px;
  }

@-webkit-keyframes spin { 100% { -webkit-transform: rotate(359deg); } }
@-moz-keyframes spin { 100% { -moz-transform: rotate(359deg); } }
@-o-keyframes spin { 100% { -moz-transform: rotate(359deg); } }
@keyframes spin { 100% {  transform: rotate(359deg); } }

  
/* =WordPress Core - (Artikel/Beitraege) -------------------------------------------------------------- */

.post img{ max-width:100%; height:auto }
.post p a{ color: #EE7203; font-weight: 600; text-decoration: underline;}
.post p a:hover{ color: #222;}

.post ul{ padding-left: 10px;}
.post li{ padding-left: 15px;}

img.alignnone,
a img.alignnone,
p img.alignnone {
    margin: 5px 0 20px 0;
}

img.aligncenter,
a img.aligncenter,
p img.aligncenter,
div.aligncenter {
    display: block;
	max-width: 100%;
	height: auto;
    margin: 5px auto 15px auto;
}

img.alignright,
a img.alignright,
p img.alignright {
    display: block;
	max-width:100%;
	height: auto;
    margin: 0 0 15px 0;
}

img.alignleft,
a img.alignleft,
p img.alignleft {
    display:block;
    max-width:100%; 
	height:auto;
    margin-bottom:15px;
}

@media(min-width: 750px ){

img.alignleft,
a img.alignleft,
p img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;  
    max-width: 45%;
}

img.alignright,
a img.alignright,
p img.alignright {
    float: right;
    margin: 5px 0 20px 20px;  
    max-width: 45%;
}

}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone { margin: 5px 20px 20px 0;}
.wp-caption.alignleft { margin: 5px 20px 20px 0;}
.wp-caption.alignright { margin: 5px 0 20px 20px;}

.wp-caption img { 
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */

.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}



/* WP Page Navi - Seitennavigation in News (<- 1 2 3 ->) */

.wp-pagenavi{ 
	position: relative;
	font-size: 18px;
	font-weight: 600;
	color: #EE7203;
	text-align: right;
	}
	
.vor-zurueck{ margin-top: 45px;}

.wp-pagenav:after{ clear: both;}
.wp-pagenavi .current{ 
	position: relative;
	display: inline-block;
	width: 45px; 
	height: 52px; 
	background: url(img/schaltflaechen-page-navi-bubble-aktiv.png) center center no-repeat; 
	vertical-align: middle;
	line-height: 52px;
	text-align: center; 
	}

.wp-pagenavi a{ 
	display: inline-block; 
	width: 52px; 
	height: 52px; 
	background: url(img/schaltflaechen-page-navi-bubble.png) center center no-repeat;
	vertical-align: middle;
	text-align: center;
	margin: 0;
	padding: 0;
	color: #FFF;
	line-height: 52px;
	text-decoration: none;
	}
	
.wp-pagenavi a.page{
	background: url(img/schaltflaechen-page-navi-bubble.png) center center no-repeat;
	}
	
.wp-pagenavi a.page:hover{
	background: url(img/schaltflaechen-page-navi-bubble-aktiv.png) center center no-repeat;
	color: #EE7203;
	}

.wp-pagenavi .vor,
.wp-pagenavi .zurueck{ display: inline-block; margin-bottom: 5px;}
		
.wp-pagenavi .vor a,
.wp-pagenavi .zurueck a,
.wp-pagenavi a.first,
.wp-pagenavi a.last,
.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink{ 
	width: 55px;
	font-size: 28px;
	line-height: 47px;
	}

.wp-pagenavi a.first,
.wp-pagenavi a.last{ 
	font-size: 24px;
	line-height: 47px;
	}

.wp-pagenavi .zurueck a,
.wp-pagenavi a.first,
.wp-pagenavi a.previouspostslink{ 
	background: url(img/schaltflaechen-page-navi-links.png) center center no-repeat;
	}

.wp-pagenavi .vor a,
.wp-pagenavi a.last,
.wp-pagenavi a.nextpostslink{ 
	background: url(img/schaltflaechen-page-navi-rechts.png) center center no-repeat;
	}

@media (max-width: 853px){

.wp-pagenavi .page,
.wp-pagenavi .extend{ }
.wp-pagenavi .vor a,
.wp-pagenavi .zurueck a,
.wp-pagenavi a.first,
.wp-pagenavi a.last,
.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink{ 
	width: 44px;
	background-size: 100% auto;
	}
} 

@media (max-width: 750px){

.wp-pagenavi{ text-align: center;}

.wp-pagenavi .page,
.wp-pagenavi .extend{ display:none;}

.wp-pagenavi .vor a,
.wp-pagenavi .zurueck a,
.wp-pagenavi a.first,
.wp-pagenavi a.last,
.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink{ 
	width: 48px;
	background-size: 100% auto;
	}
  
} 


.socialmedia-tooltip{
  z-index:1001;position:fixed;top:0px;width:100%;padding:0 20px;height:64px;line-height:30px;
  font-family: "Open Sans Condensed",sans-serif;
font-size: 20px;
font-weight: bold;
text-transform: uppercase;
  color:#fff;background:#222;left:0;
   transition:         all.25s ease-in-out;
  -webkit-transition: all .25s ease-in-out;
  -moz-transition:    all .25s ease-in-out;
  -o-transition:      all .25s ease-in-out;
  overflow:hidden;
}

.socialmedia-tooltip.aktiv{ display:block;top:80px; }
.socialmedia-tooltip .facebook-s{ display:block; float:left;width:30px;height:64px;margin-right:10px; background-image:url('img/facebook-button-s.png');background-position:center;background-repeat:no-repeat; }
.socialmedia-tooltip .yt-s{ display:block;float:left;width:30px;height:64px;margin-right:10px;  background-image:url('img/yt-button-s.png');background-position:center;background-repeat:no-repeat; }
.socialmedia-tooltip .text{ display:block;float:left;height:64px;line-height:64px;margin-right:15px; }

@media( min-width:1080px ){
  .socialmedia-tooltip{ display:none }
   .socialmedia-tooltip.aktiv{ display:none }
}


/* Contact Form 7 - Kontaktformular */

.wpcf7{}
.wpcf7-form{}

.wpcf7-form input,
.wpcf7-form textarea,
.wpcf7-form select{ 
	font-family: 'Open Sans', sans-serif;
	font-size: 14px; 
	width: 100%; 
	padding: 7px 12px;
	border: 2px solid #FFF; 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	}

.wpcf7-form span.trennzeichen{ width: 5%; display: inline-block; text-align: center;}
.wpcf7-form span.trennzeichen-leer{ width: 2%; display: inline-block; text-align: center;}

.wpcf7-form input.strasse{ width: 73%;}
.wpcf7-form input.hausnummer{ width: 25%;}

.wpcf7-form input.plz {	width: 35%;}
.wpcf7-form input.stadt{ width: 60%;}
	
.wpcf7-form .your-address .wpcf7-not-valid-tip,
.wpcf7-form .your-zipcode .wpcf7-not-valid-tip{ display: none;}

.wpcf7-form input[type='submit']{ 
	border: none;
	background: #666;
	font-weight: 600;
	color: #FFF;
	text-transform: uppercase;
	}
.wpcf7-form input[type='submit']:hover,
.wpcf7-form input[type='submit']:focus:hover{ 
	border: none;
	background: #EE7203;
	cursor: pointer;
	}
.wpcf7-form input[type='submit']:focus{
	border: none;
	background: #666;
	}
	
.wpcf7-form input:hover, .wpcf7-form input:focus,
.wpcf7-form textarea:hover, .wpcf7-form textarea:focus{ border: 2px solid #EE7203;}

.wpcf7-form textarea{ height: 150px; resize: none;}
.wpcf7-form select{ background: #FCE3CD;}
.wpcf7-form option{ background: #FFF; border-color: #FFF;}
	
.wpcf7-form .wpcf7-select{ display: block!important; }
.wpcf7-form .wpcf7-not-valid-tip{ color: #EE7203; font-weight: 600; }
.wpcf7-form .wpcf7-not-valid{ border: 2px solid #EE7203;}

.wpcf7-response-output{ 
	color: #FFF; 
	padding: 20px!important; 
	margin: 0!important;
	background: #CCC;
	border: none!important; 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;}
	
.wpcf7-validation-errors{ background: #EE7203; }
.wpcf7-mail-sent-ok{ background: #046F00;}


      .lupe{
                    cursor: pointer;
    display: inline-block;
    background-image: url('img/lupe.png');
    background-position: center center;
    width: 40px;
    height: 30px;
    position:relative; top:8px;
    background-repeat: no-repeat;
    border-radius:5px;
    -webkit-border-radius:5px;
    margin-left:10px;
  
  
    background-color:green;
    }