body     {font-family:Arial,Helvetica,sans-serif; border:0; margin:0;}
.mitte   {position:relative; top:0px; left:0px; color:#000000; background-color:#ffffff; width:100%; height:94vh; margin:0 auto;}
.topnav  {display:block; top:0px; left:0px; width:100%; height:75px;
          background-color:#0000c0; color:#ffffff; font-size:1em;}
.doff    {display:none;}
.gray    {position:absolute; top:0; left:0; width:100%; height:100vh; min-height:-webkit-fill-available; z-index:20; background-color:#000000;
          opacity:0.6; filter:Alpha(opacity=60);}
.tab1    {display:table; width:calc(100% - 10px); padding:0 5px;}
.tab2    {display:table; width:100%;}
.spalt1  {display:table-cell; width:35px; padding-right:5px; vertical-align:middle;}
.spalt2  {display:table-cell; vertical-align:middle;}
.spalt3  {display:none;}
.spalt4  {display:table-cell; font-size:0.9em; text-align:right; width:150px; vertical-align:middle;}
.menupic {height:28px; border:1px solid white; border-radius:3px; width:calc(100% - 2px); max-width:28px;}
.logo    {margin-left:10px; padding-top:3px; width:calc(100% - 10px); max-width:190px; height:35px; vertical-align:middle;}
.row2    {display:block;}
.suchm   {width:95%; height:auto; margin-left:2.5%; margin-top:2px;}
.suchs   {background-color:#FFFFFF; color:#000000; box-sizing:border-box; height:auto; padding-left:7px; padding-top:5px; padding-bottom:5px;
          font-size:1em; width:calc(99% - 35px);
          border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; border:1px solid #0000C0;}
.suchl   {float:right; margin-left:5px;}
.baskz   {text-align:center; color:#FFDF00; font-weight:bold; float:right; margin:0 10px; width:40px; height:32px; background-image: url('basket.svg');}
.main    {padding-top:calc(100vh - 100px); width:100%; position:relative;}
#nav     {position:absolute; top:0px; left:0; width:213px; height:calc(100vh - 90px); overflow:auto;
          border:0; background-color:#ffffff; padding:10px 5px 0 10px; text-align:left; z-index:40;}
iframe   {position:absolute; top:0; left:0; width:100%; height:calc(100vh - 80px); border:0; background-color:#ffffff; float:right;}
.navoff  {display:none;}
.navon   {display:block;}
.killnav {display:block; text-align:right; font-weight:bold;}

.but3a       {background-color:#F8F8E7; color:#000000; text-align:center; padding:3px 6px; float:right; margin-top:5px;
              border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;}
.but3a:hover {background-color:#F9D90C; color:#000000;}
.but4        {font-size:1em; background-color:#F8F8E7; color:#000000; text-align:center; vertical-align:middle; padding-top:2px;
              display:block; width:190px; height:22px; margin-top:7px;  white-space:nowrap;
              border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; border:1px solid #000000;
              box-shadow:2px 2px 2px #000000; -moz-box-shadow:2px 2px 2px #000000; -webkit-box-shadow:2px 2px 2px #000000;}
.but4:hover  {background-color:#0000C0; color:#FFFFFF;}

a               {text-decoration:none;}
a.top           {font-size:1em; color:#000000;}
a.options       {font-size:0.875em; background-color:#ffffff; color:#000000; text-align:center; vertical-align:middle;
                 display:block; width:175px; height:17px; padding:2px; margin-left:5px; margin-top:7px;
                 border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; border:1px solid #0000c0;}
a.options:hover {background-color:#0000C0; color:#FFFFFF;}

.button       {font-size:1em; background-color:#F8F8E7; color:#000000; text-align:center; padding:2px 5px;
               border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;}
.button:hover {background-color:#F9D90C; color:#000000;}

.rtable     {font-size:0.9em; color:#000000; background-color:#ffffff; border:0; width:98%; margin:10px 5px;}
.header1    {background-color:#FFDF00; color:#000000; margin:10px 0; padding:8px; font-size:1.25em; font-weight:bold;}

.ptxt       {padding-left:0.9em; text-indent:-0.85em}
.arow       {display:table; color:#000000; background-color:#F8F8E7; padding:2px; margin:5px 0; width:62%; max-width:360px;
             border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; border:1px solid #000000;}
.arow:hover {background-color:#0000C0; color:#FFFFFF;}
.acell1     {display:table-cell; width:55px;}
.acell2     {display:table-cell;}

.wbuy {display:none; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:40; width:300px;
       border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; border:1px solid #ffffff;
       color:#FFFFFF; background-color:#0000C0; line-height:20px; padding:7px;
       font-size:0.9em; text-align:left;}
.buyi {background-color:#FFFFFF; color:#000000; box-sizing:border-box; height:auto; padding:3px 0 3px 7px; font-size:1em; width:130px;
       border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; border:1px solid #0000C0;}

img      {border:0; max-width:100%;}
.prod    {width:33%; height:auto; margin-left:1%; margin-right:1%; float:right; font-size:0.75em; text-align:center;}
.phr     {border:1px solid #0000c0;}
.sub     {position:relative; top:0.3em; font-size:75%;}
.sup     {position:relative; bottom:0.3em; font-size:75%;}
br.cb    {clear:both;}
.red     {color:#FF0000;}
.left    {float:left;}
.fright  {float:right;}
h1       {font-size:1.15em; margin:0;}
.noprint {margin-top:10px;}

@media screen and (min-width:750px) {
  .topnav    {height:40px; font-size:1em;}
  .tab2      {display:none;}
  .spalt1    {display:none;}
  .spalt3    {display:table-cell; text-align:right; padding-right:3px; vertical-align:middle;}
  .spalt4    {font-size:1em; width:170px; padding-right:10px;}
  .logo      {margin-left:5px;}
  .main      {float:right; padding-top:calc(100vh - 60px);}
  #nav       {height:calc(100vh - 50px);}
  iframe     {left:235px; width:calc(100% - 235px); height:calc(100vh - 40px);}
  .navoff    {display:block;}
  .logo      {margin-left:10px; height:35px; width:200px;}
  .killnav   {display:none;}
  .rtable    {font-size:1em;}
  .ptxt      {padding-left:1em; text-indent:-0.9em}
  .acell1    {width:60px;}
  .wbuy      {width:350px; line-height:25px; padding:10px 10px 0px 10px; font-size:1em;}
  .buyi      {width:150px;}
  a.button   {font-size:1em;}
  .prod      {width:25%;}
  .prodv     {float:right; padding-left:30px; padding-bottom:30px;}
  }

@media screen and (min-width:990px) {
  .mbody     {background-image:url(bg.svg); background-repeat:no-repeat;}
  .mitte     {width:990px;}
  }