/* voreinstellung, patch */
 
 html { height: 101% } /* Scrollbar im Firefox */
 
 * { margin: 0; padding: 0; } /* alle Ränder weg */
 
  /* Abstände restaurieren */
 p, h1, h2, h3, h4, ul, ol { margin-bottom: 1em; }
 li { margin-left: 1em; }
 
 /* Body Farbe und Schrift */
 
 body { 
 color: #000000;

 background-color: silver;
  background-color: #F5F5F5;
  background-color: #F4EFE9;
 font-family: Arial, "Trebuchet MS", Calibri, Verdana, Arial, Helvetica, sans-serif;
 font-size: small;
  
 }
 
 h1 { font-size: 200%; color: #808080;
 margin-top: 2%;
 }
 
 h3 { 
 font-size: 115%; 
 margin-top: 3%;
 }
 
 h4 { 
 font-size: 100%;
 margin-top: 1%;
 }
 
 dd {
 margin-left: 65px;
 }
  
 /* wrapper */
 
 #wrapper {
 color: #000000;
 color: auto;
  min-width: 800px;
 max-width: 1100px;
 margin-right: auto;
 margin-left: auto;
 border-left: 1px solid silver;
 border-right: 1px solid grey;
 font-size: 100%;
 background-color: #FFFFFF;
 /*   background:url(blauverlauf_unten.jpg) bottom left no-repeat; */
    overflow: hidden;
  margin-top: 0px;
  margin-bottom: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  box-shadow: 10px 10px 25px grey;
 
    }
 
 /* Navigation oben */
 
 #navi-oben {
 text-align: left ;
  background-color: #333366;
 background:url(hintergrund_navi-oben.jpg) top right;
 /* width: 1228px; */
 margin: 0px;
 height: 27px;
 padding-top: 10px; 
 padding-right: 30px;
 padding-left: 23%;
 margin-left: 0%;
 }
 
 /* Listelemente nebeneinander... */
 
 #navi-oben li {
 font-family: arial, "Trebuchet MS", arial;
 font-weight: bold;
 display: inline;
 margin-left: 0;
 list-style-type: none; 
 font-size: 115%;
  }
 
 
 /* Links */
    
 #navi-oben a {
 color: #000000;
 background-color: #738BB5;
 padding: 6px 10px 8px 10px;
 text-decoration: none;
   border-top-left-radius: 3px;
   border-top-right-radius: 3px; 
 }
 
 /* Link Farbe im mouseover Zustand */
 
 #navi-oben a:hover {
 color: navy;
 background-color: #FFCC33;
 }
 
 /* Link Farbe im kurzen Zustand des angewählt werdens */
 
 #navi-oben a:active {
 color: #000000;
 background-color: #FFCC33;
 border-bottom: 0px solid white;
  }
 

 /* Kopfbereich */

 #kopfbereich {
  height: 81px;
 width: 100%;

  background-color: #FFFFFF;
 background:url(hintergrund_cd.jpg) top right no-repeat;
 }
 
 /*
 #home #kopfbereich {
 background:url(hintergrund_home.jpg) top right no-repeat;
 }
 #software #kopfbereich {
 background:url(hintergrund_software.jpg) top right no-repeat;
 }
 #service #kopfbereich {
 background:url(hintergrund_service.jpg) top right no-repeat;
 }
 #sykasoft #kopfbereich {
 background:url(hintergrund_sykasoft.jpg) top right no-repeat;
 }
 #kontakt #kopfbereich {
 background:url(hintergrund_kontakt.jpg) top right no-repeat;
 }
 */
 
 
 #kopfbereich p { text-align: left; padding-right: 25px; padding-top: 27px; }
 
 
 
 /* Inhalt - Container */
 
 #inhalt {
  text-align: center;
 color: black;
 background-color: white;
 /* background:url(navigation_grauverlauf.jpg) top left ; */
 width: 100%;
 }
 
 /* Navigation rechts - jetzt links */
 
 #navigation {
  float: left;
  width: 20em;
  height: 101%;
   text-align: right;
 top: 0;
 left: 0;
 background-color: auto;
 /*  background:url(hintergrund_NEU5.jpg) top right no-repeat; */

 padding: 0px;
 margin-top: 0px;
 padding-top: 8px;

    }
 
 #navigation h1 { font-size: 150%; color: #808080;
 margin-top: 2%;
 }

 
 #navigation li {
 display: block;
 color: grey;
 list-style-type: none; 
 font-size: 110%;
  font-weight: bold;
  margin-top: 8px;
  margin-bottom: 8px;
     margin-right: 0px;
   padding-right: 20px;
   }
  
 #navigation a {
 color: #333366;
 background-color: #FFFFFF;
 padding: 4px 8px 4px 8px;
 border: 0px solid #8c8c8c;
 text-decoration: none; 
 }
  
 #navigation li a:hover {
 color: #FFFFFF;
 background-color: #660033;
  border-bottom-color: #8c8c8c;
 }
 
 #navigation a:active {
 color: #000000;
 background-color: #FFFFFF; 
 }
 
 #navigation h1 {padding-right: 20px;} 
 
 /* Farbe für aktuell angewählten Link: Navigation rechts */
 
 #home #li-home a, #software #li-software a, #service #li-service a, #sykasoft #li-sykasoft a, #kontakt #li-kontakt a
   { color: #000000;
 background-color: #FFFFFF;
 } 
 
 /* Inhaltsbereich */
 
 #inhaltsbereich {
  text-align: left;
  background-color: #FFFFFF;
 padding: 0px;
 padding-top: 25px;
 border: 0px silver solid;
 /* border-top: 30px #CC9933 solid; */
 /* margin: 80px; */
 /* margin-top: 132px; */
 margin-left: 28%;
 margin-left: 274px;
 margin-right: 8%; 
 }

 #inhaltstartseite {
  text-align: left;
  background-color: #FFFFFF;
 padding: 0px;
 padding-top: 10px;
 border: 0px silver solid;

 margin-left: 11%;
 margin-right: 8%; 
 }


 #inhaltsbereich li {
 list-style-type: square; 
  padding: 5px;
 }
 

 #inhaltsbereich a:visited {
 color: #663366;
  }
  
  #inhaltsbereich a {
 color: #333366;
 color: navy;
 }

 #inhaltsbereich a:hover {
 color: #0000CC;
 text-decoration: underline;
 }
 
 #inhalt a:active {
 border: 0px;
 }
 
 /*
 #inhaltstartseite a {
 color: #333366;
 text-decoration: none;
 font-weight: bold;
 } 
 
 
 #inhaltstartseite a:hover {
 color: #0000CC;
 text-decoration: underline;
 }
 
 
 #inhaltstartseite a:active {
 border: 0px;
 }
 
 */
 
 
 #spalterechts {
 background-color: white;
 text-align: left;
 float: right;
 width: 20%;
 margin-top: 0%;
 padding-top: 1%;
 margin-right: 0%;
 padding-right: 2%;
 margin-left: 3%;
 padding-left: 2%;
 border-left: 2px dotted silver;
  border-bottom: 2px dotted silver;
  margin-bottom: 2%;

 }
 
  #spalterechts a:visited {
 color: #663366;
  }
  
  #spalterechts a {
 color: #333366;
 color: navy;
 }
 
  #spalterechts a:hover {
 color: #0000CC;
 text-decoration: underline;
 }
 
 
 

 #kopfbereich a:visited {
 color: #663366;
 } 
 
 #kopfbereich a {
 color: #333366;
 text-decoration: none;
 font-weight: bold;
 /* border-bottom: 1px #333366 dotted; */
 } 


 #kopfbereich a:hover {
 color: #0000CC;
 text-decoration: underline;
 }

 
 
 
 strong {
 color: #333333;
 font-size: 105%;
 }
 
 /* KLassen für Bilder links oder rechts */
 
 .bildlinks {
    float:left;
    width: auto;
    padding: 3px;
    margin-right: 20px;
    margin-bottom: 10px;
 }
 
 .bildlinksklein {
    float:left;
    width: auto;
    padding: 3px;
    margin-right: 10px;
    margin-bottom: 1px;
    }
 
 .bildrechts {
    float:right;
    width: auto;
    padding: 3px;
    margin-left: 20px;
    margin-top: 5px;
    margin-bottom: 10px;
 }
 
  .bildrechtsklein {
    float:right;
    width: auto;
    padding: 3px;
    margin-left: 10px;
    margin-top: 5px;
    margin-bottom: 1px;
 }
 
 /* Klasse für Text mit Hintergrund */
 
 .boxgelb {
 background-color: #FFCC33;
 padding: 7px;
 }
 
  .boxblau {
 background-color: #738BB5;
 padding: 7px;
 }
 
   .boxrot {
  background-color: #660033;
  padding: 7px;
 }
 
 
 /* kann gelöscht werden
  
  #inhaltstartseite .boxblau a {
 color: black;
 /* background-color: #FFFFFF; */
 text-decoration: none;
 font-weight: bold;
 /* border-bottom: 1px #333366 dotted; */
 }
 
   #inhaltstartseite .boxrot a {
 color: white;
 /* background-color: #FFFFFF; */
 text-decoration: none;
 font-weight: bold;
 /* border-bottom: 1px #333366 dotted; */
 }
 
     #inhaltstartseite .boxgelb a {
 color: black;
 /* background-color: #FFFFFF; */
 text-decoration: none;
 font-weight: bold;
 /* border-bottom: 1px #333366 dotted; */
 }
 
  #inhaltstartseite .boxblau a:hover {
 color: navy;
 /* background-color: #FFFFFF; */
 text-decoration: underline;
 font-weight: bold;
 }
 
  #inhaltstartseite .boxrot a:hover {
 color: white;
 /* background-color: #FFFFFF; */
 text-decoration: underline;
 font-weight: bold;
 }
 
  #inhaltstartseite .boxgelb a:hover {
 color: navy;
 /* background-color: #FFFFFF; */
 text-decoration: underline;
 font-weight: bold;
 }

*/
 
 /* Klasse für Text rechts */
 #weiter {
 text-align: right;
 width: 50px;
  font-size: 75%;
 }
 
 /* KLasse für Logo */
 
 .logo {
width: auto;
padding: 15px 30px 10px 30px;
 }


#logounten {margin, padding: 0px; float: right; display:none;}


/*Fusszeile Adresse */
 
 #adresse {  background-color: #CCCCCC; 
 padding: 1em;
 }
 
 #adresse p { 
 display: none;
  font-size: 80%;
 }
 
 #adresse h3 {
 font-size: 100%;
 text-align: right;
  margin-top: 0%;
 }
 
 /* Das Kontaktformular */
 
 form {
 background-color: #CCCCCC;
 width: 400px;
 padding: 20px;
 border: 1px solid #8c8c8c;
 }
 
 label {
 /* display: block; */
 cursor: pointer;
 }
 input#name, input#branche, input#position, input#strasse, input#plz, input#ort, input#telefon, input#fax, input#email, textarea {
 width: 300px;
 border: 1px solid #333366;
 margin-bottom: 5px;
 margin-top: 5px;
 }
 textarea {
 height: 7em;
 width: 400px;
 }
  #netviewer {
  float:right
   }

#table, table1 {width: 100%; font-size: 100%;}
#table2 {width: 100%;}
#table2 {font-size: 70%;}

   



  
   
     @media only screen and (orientation: portrait) and (min-width: 50px) and (max-width: 480px)
{
#body {max-width: auto; }
#wrapper {min-width: 100px;}
#wrapper {max-width: 340px; background-color: white;}
#wrapper {margin-bottom: 0px;}
#kopf {float: none; width: 320px; margin-top: 160px; margin-bottom: 0px;  height: auto; }
#kopf p {text-align: left;}
#kopf img {display: none;}
#kopfbereich {background: white; width: 320px; height: 80px; max-height: 80px; }
/* #kopfbereich p {display: none;} */
#kopfbereich a {display: auto;}
#kopfbereich p {font-size: 70%; text-align: right;}
#kopfbereich p {padding: 0px; padding-right: 3px; padding-top: 6px; }
#kopfbereich a {display: inline;}
 .logo {max-width: 60%; padding: 15px 5px 15px 10px; }


#navi-oben {margin: 0px; margin-left: 0px; padding-left: 3%; width: 320px;}
#navi-oben li {font-size: 100%; padding-top: 0px; padding-left: 1px;}
#navi-oben a {margin: 0px; padding: 4px; padding-bottom:5px;}
#navi-oben {height: 21px;}
#navi-oben {background:url(hintergrund_navi-oben.jpg) top center;}

 h1 { font-size: 150%; margin-top: 1%; }
  h2 { font-size: 110%; }
  h3, h4 { font-size: 100%; }
 
 strong {
 color: #333333;
 font-size: 100%;
 }  

img {max-width: 100%; height: auto;}
.bildlinks {max-width: 40%; padding: 0px; margin-bottom: 5px; margin-right: 15px; margin-left: 0px; margin-top: 0px;}
.bildrechts {max-width: 40%;}
 
.bildrechts {float: right; padding: 0px; margin-left: 10px; margin-right: 0px;}
/*.bildlinks {float: none; padding: 0px;} */

/* #rechts {float: none;} */
#spalterechts {display: none;}
#navigation {float: leftt; width: 300px; text-align: left; padding-left: 7px; margin-bottom: 10px; height: auto;}
#navigation li {display: inline;}
#navigation li {padding: 0px; font-size: 110%; font-weight: auto; margin: 0px; padding-right: 3px; border-right: 1px solid silver;}
#navigation p {font-size: 50%;}

#navigation a {padding: 2px 2px 0px 0px;}
#navigation a img {float: right; padding:0px; margin-left: 10px; padding-top: 0px; margin-top: -45px; max-width: 20%;}
#navigation h1 {display: left; margin-top:0px;} 

#inhaltsbereich {margin-top: 10px; margin-left: 7px; max-width: auto; margin-right: 5%; }
/* #inhalt {background-color: white;} */
#inhalt {margin-top: 20px; margin-left: 0px; margin-right: 0px; padding-left: 10px; padding-right: 0px; max-width: auto;}
.fettgrau {display: none; text-align: right;}
#fuss {padding: 20px; margin: 0px; text-align: left; 

}
#fuss {padding: 0em; max-width: auto;}
#fuss p {font-size: 80%;}
#adresse {padding: 1em; max-width: auto;}

#logounten {max-width: 50%; margin-top: 60px; display:block }
#logounten p {text-align:bottm;}

 #adresse p { 
 display: inline;
  font-size: 80%;
 }
 #table, table1, table2 th, td, thead {font-size: 95%;}
 #table1 {font-size: 95%;}
 #table, table1, table2 {max-width: 100%;}

 #table2 th, td, thead {font-size: 80%;}
 #table2 img {max-width: 50%;}
 /* #table2 td {display:none;} */
 
 
 #netviewer {
  float:none; margin-right: 5px;
   }