@charset "UTF-8"; /*© Christof Grusdat*/

#copy {
   z-index: 1;
   position: absolute;
   padding: 1px 4px;
   border: 1px solid dimgray;
   font-style: italic;
   background-color: #ffd700;
}

.ausblenden {
   -webkit-transition: opacity 1s ease-in;
      -moz-transition: opacity 1s ease-in;
       -ms-transition: opacity 1s ease-in;
        -o-transition: opacity 1s ease-in;
           transition: opacity 1s ease-in;
   opacity: 0;
}

/*AJAX*/
.ajax_laden   * {
   cursor: progress !important;
}

.ajax   main {
   padding-bottom: 40px;
}

main > #ladebutton,
main > #ladebalken {
   margin: 15px auto 0;
}

main > #ladebalken {
   font-size: .9em;
   display: block !important;
   width: 300px;
   line-height: 1.6em;
   padding: 0;
   border: 1px inset dimgray;
   text-align: center;
   color: dimgray;
   background-color: transparent;
}
@keyframes ladeanimation1 {
   from {
      width: 25%;
   }
   to {
      left: 75%;
      width: 25%;
   }
}
@keyframes ladeanimation2 {
   from {
      -webkit-background-image: linear-gradient(to right, #ff4646, #ffd700);
         -moz-background-image: linear-gradient(to right, #ff4646, #ffd700);
           -o-background-image: linear-gradient(to right, #ff4646, #ffd700);
              background-image: linear-gradient(to right, #ff4646, #ffd700);
   }
   to {
      -webkit-background-image: linear-gradient(to left, #ff4646, #ffd700);
         -moz-background-image: linear-gradient(to left, #ff4646, #ffd700);
           -o-background-image: linear-gradient(to left, #ff4646, #ffd700);
              background-image: linear-gradient(to left, #ff4646, #ffd700);
   }
}
main > #ladebalken::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #ffd700;
   animation: ladeanimation1 1s ease-in-out infinite alternate,
              ladeanimation2 2s linear infinite;
}
main > #ladebalken > span {
   position: relative;
}

#ajax_pause,
.ajax   #letzte_angebot ~ *, .ajax_laden   #letzte_angebot ~ *,
.ajax   footer, .ajax_laden   footer {
   display: none;
}
.ajax   #letzte_angebot {
   margin-bottom: 3px;
}



@media (min-width: 1024px)
{
   #vz   main   dfn {
      position: relative;
      top: -34px;
   }

   #wichtig,
   #wichtig:first-child + * {
      margin-top: 0;
   }

   #wichtig {
      display: none;
   }

   .ajax   #top, .ajax_laden   #top {
      padding-bottom: 15px;
   }

   #a_nav,
   #ajax_pause {
      font-size: 15px;
      min-width: 80px;
      margin-left: 25px;
      padding: 1px 2px 2px;
      vertical-align: -2px;
      font-style: italic;
      color: dimgray;
   }

   #a_nav > span,
   #ajax_pause > span {
      font-size: 18px;
      font-weight: bold;
      vertical-align: 1px;
   }

   .fix   #ajax_pause  {
      display: inline-block;
   }

   /*scrollabhängige Fixierung: Kopfleiste*/
   .fix   #kopfleiste {
      z-index: 2;
      position: fixed;
      top: 0;
      max-width: 1200px;
      width: 100%;
      padding: 3px 0 2px;
      border-bottom-width: 4px;
      background-clip: border-box;
   }

   .fix   #kopfleiste   * {
      outline-offset: 0;
	  top: 5%;
   }

   .fix   #logo {
      font-size: 26px;
      margin: 0 15px;
      padding: 0 5px;
      vertical-align: middle;
      outline-offset: -1px;
   }
   .fix   #logo > img {
      height: 29px;
      width: 28px;
      margin-right: 8px;
      vertical-align: -7px;
   }

   .fix   #deal,
   .fix   #suche > input + input
   {
      -webkit-transition-duration: 0s;
         -moz-transition-duration: 0s;
          -ms-transition-duration: 0s;
           -o-transition-duration: 0s;
              transition-duration: 0s;
   }

   .fix   #deal {
      font-size: 17px;
      width: 198px;
      padding: 2px 0;
   }

   .fix   #suche {
      z-index: 2;
      position: fixed;
      top: 0.25%;
      padding: 2px;
   }

   .fix   #suche > input:first-child {
      font-size: 17px;
      width: 272px;
      height: 26px;
      padding: 0 5px;
   }
   .fix   #suche > input.button {
      height: 20px;
      width: 55px;
   }

   .fix   nav {
      padding-top: 87px;
   }
}



@media (max-width: 1023px)
{
   .ajax   main, .ajax_laden   main {
      padding-bottom: 10px;
   }

   .ajax   main + aside, .ajax_laden   main + aside {
      display: none;
   }

   #wichtig {
      margin: 1em 0 .5em;
   }

   #wichtig > div {
      padding: 5px 0;
   }

   #wichtig   li + li {
      padding-top: .2em;
   }

   #wichtig   ul.grob > li {
      margin-left: 7%;
   }

   /*#wichtig   ul > li.ober::before {
      content: "\1F783";
      font-size: 10px;
      margin-left: -11px;
      width: 11px;
      vertical-align: 2px;
      font-weight: bold;
      color: gray;
   }*/
   #wichtig   ul > li.ober ~ li {
      margin-left: 10%;
   }
   #wichtig   ul > li.ober ~ li.ober ~ li {

      margin-left: 13%;
   }

   #wichtig   ul > li.grp {
      margin-top: .5em;
   }

   #wichtig   ul.grob > li > a {
      display: inline-block;
      padding: 2px 0;
   }
}