/* --- Main-CSS für www.sutanet.ch - 2007 --- */
h1 {
position: absolute;
left: -9000px;
}
/* Achtung: h1 ist reserviert als input-Quelle für den Seitentitel! */
/* unbedingt so drin lassen! */

* {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
color: #003333;
}
body {
background-color: #669999;
}
#all {
margin: 20px auto 20px auto;
width: 80%;
min-width: 1040px;
max-width: 1200px;
background-color: #FFFFFF;
}
#head {
background-image: url(../bilder/ecke-oben-links.png);
background-repeat: no-repeat;
height: 113px;
}
#mitte {
margin-left: 127px;
padding-right: 155px;
background-image: url(../bilder/ecke-oben-rechts.png);
background-repeat:no-repeat;
background-position: right top;
height: 113px;
text-align: center;
}
#mitte p {
padding-top: 40px;
background-image:url(../bilder/hg-mitte-oben.png);
background-repeat: repeat;
background-position:top;
height: 53px;
}
#main_section {
background-image:url(../bilder/hg-mitte-links.png);
background-repeat: repeat-y;
background-position:left;
}
#content {
margin-left: 127px;
margin-right: 12px;
padding: 2em 145px 2em 2em;
background-image: url(../bilder/hg-mitte-rechts.png);
background-repeat: repeat-y;
background-position: right;
font-size: 0.8em;
}

/* --- Navigation --- */

#navigation {
margin-top: -10px;
height: 25px;
background-image: url(../bilder/hg-braun.png);
padding-top: 5px;
text-align: center;
}
a#skiplink {
position: absolute;
left: 0px; 
top: -500px;
width: 1px; 
height: 1px;
overflow: hidden; 
}
#navigation li {
display: inline;
}
#navigation a {
margin-right: 15px;
text-decoration: none;
color: #E4E4E4;
}
#index #navigation a.index,
#about #navigation a.about,
#angebot #navigation a.angebot,
#referenzen #navigation a.referenzen,
#tipps #navigation a.tipps,
#kontakt #navigation a.kontakt {
text-transform: uppercase;
font-weight:bold;
color: #c2e2ec;
}
#navigation a:hover {
color: #c2e2ec;
}

/* --- Ende Navigation --- */

/* --- Footer --- */

#footer {
background-image: url(../bilder/ecke-unten-links.png);
background-repeat:no-repeat;
background-position: left;
height: 44px;
padding-left: 126px;
}
#footer #who {
background-image: url(../bilder/ecke-unten-rechts.png);
background-position: right bottom;
background-repeat: no-repeat;
padding-right: 155px;
}
#footer #footer-content {
background-image: url(../bilder/footer-mitte.png);
background-repeat:repeat-x;
width: 100%;
height: 44px;
font-size: 0.6em;
line-height: 3em;
}
#footer p#sutanet {
text-align: right;
}
#footer p#google {
float: left;
padding-left: 3em;
}

/* --- Ende Footer --- */


/* --- allgemeine Formatierung --- */

a.textlink {
color: #009999;
text-decoration: none;
background-image: url(../bilder/link.gif);
background-repeat: repeat-x;
background-position: bottom;
padding-bottom: 0.2em;
}
a.textlink:hover {
color: #7D6859;
background-image: url(../bilder/link-hover.gif);
}
h2 {
margin-bottom: 2em;
}
#content p {
margin-bottom: 1em;
padding-right: 1em;
}
#content ul {
list-style-type: square;
margin-left: 1.2em;
margin-bottom: 1em;
}
.floatleft {
float: left;
}
.floatright {
float: right;
}
.clear {
clear: both;
}
.margintop {
margin-top: 1em;
}
p#flashlink a img,
p#flashlink br {
border: none;
text-decoration: none;
}
/* --- Flash-Film in Fenster --- */
#flash {
padding-top: 1em;
font-size: 0.8em;
background-color: #fff;
text-align: center;
}
/* --- Ende Flash-Film in Fenster --- */
/* --- Google Map auf Kontakt --- */
#wagt_map_1 {
width: 500px;
height: 300px;
border: 1px solid #ccc;
}

/* --- Ende Google Map auf Kontakt --- */
address {
margin-bottom: 1.5em;
}
/* --- Skype auf Kontakt --- */
a.skype {
text-decoration: none;
color: #009999;
}
a.skype:hover {
color: #7D6859;
}
/* --- Ende Skype auf Kontakt --- */

/* --- About --- */

ul#hobby {
list-style-type: square;
}
ul#netzwerke {
list-style-type: none;
margin-left: 0;
}
ul#netzwerke a {
background-repeat: no-repeat;
background-position: left;
padding-left: 2em;
}
a#xing {
background-image: url(../bilder/xing-icon.gif);
}
ul a#xing-prof {
text-decoration: none;
padding-left: 0;
color: #009999;
}
ul a#xing-prof:hover {
color: #7D6859;
}
a#femity {
background-image: url(../bilder/femity.gif);
}
a#nefu {
background-image: url(../bilder/nefu-icon.gif);
}
a#foka {
background-image: url(../bilder/foka.jpg);
}
#bild {
margin: 0 1.5em 1.5em 0;
border: 1px solid #CCCCCC;
}

/* --- Ende About --- */

/*--- Formatierung für Tipps --- */

#tipps h2 {
font-size: small;
font-weight: bold;
}
#tipps h3 {
font-size: small;
font-weight: bold;
}
#tipps h4 {
font-size: small;
font-weight: normal;
text-decoration: underline;
margin-bottom: 0.2em;
}
#tipps ul {
list-style-type: square;
}
.AccordionPanelContent ul {
margin-bottom: 1em;
list-style-type: square;
margin-left: 20px;
}
#tipps ul#emotion,
#tipps ul#smile {
list-style-type: none;
margin-left: 0;
}
#tipps ul#smile li {
height: 2em;
}
ul#smile img {
border: none;
}
.Accordion {
margin-right: 10px;
}
#tipps .Accordion h1 {
font-size: medium;
font-weight: bold;
margin-top: 0.5em;
}
#tipps .Accordion a {
color: #0066CC;
}
#tipps .Accordion a:hover {
color: #006666;
}
#tipps .Accordion a:visited {
color: #006666;
}
#tipps .Accordion .AccordionPanelTab a {
font-weight: bold;
color: #006666;
}
/* Amazon */
ul#buchliste {
list-style-type: none;
}
ul#buchliste li {
display: inline;
margin-right: 20px;
}
ul#buchliste img {
border: none;
}
ul#buchliste img.assoc {
width: 1px;
height: 1px;
border:none !important;
margin:0px !important;
}
/* Amazon */
a.print {
background-image: url(../bilder/print.gif);
background-repeat: no-repeat;
background-position: right;
padding-right: 2em;
}
/* --- Ende Tipps --- */

/* --- Referenzen Tabellenformatierung --- */

table#ref {
margin-right: 10px;
}
table#ref, table#ref th, table#ref td {
border: 1px solid #333333; 
border-collapse: collapse;
padding: 5px;
vertical-align: top;
}
table#ref th {
font-weight: normal;
text-align: left;
}
table#ref .th1 {
width: 100px;
}
table#ref .th2 {
width: 200px;
text-align: center;
}
table#ref .th3 {
width: auto;
}
table#ref img {
border: 1px solid #333333;
margin-right: 20px;
margin-bottom: 0.5em;
}
table#ref ul.ref {
list-style-position: outside;
list-style-type: square;
margin-left: 2em;
}
table#ref a {
background: none;
text-decoration: underline;
}
table#ref a:hover {
background: none;
color: #7D6859;
}

/* --- Ende Referenzen Tabellenformatierung --- */

/* --- Angebot --- */


/* --- Ende Angebot --- */

#F404 #content {
min-height: 25em;
}
/* --- Weihnachts-Special --- */
#weihnachten {
padding: 8px 10px 0 0;
background-image: url(../bilder/weihnachtsmannmuetze.gif);
background-repeat: no-repeat;
background-position: top right;
}
#xmas {
padding: 7px  0 0 10px;
background-image: url(../bilder/weihnachtsmannmuetze2.gif);
background-repeat: no-repeat;
background-position: top left;
}
.xmasborder {
border: 1px dotted;
padding: 4px;
margin: 2px;
width: 16em;
}
/* --- Ende Weihnachts-Special --- */

/* Januar 2012 */
p.imgmiddle {
text-align: center;
}
