/* DATEI: zirko.css */



/************************************************* Allgemeines */

body { margin:0px; padding:0px; background-color:#C4D0D8 }

div.aussen { width:90%; max-width:800px; margin:0px auto; background-color:white }

div.inhalt { float:right; width:78% }

h1,h2,p,ul,ol,li,div,td { font-family:Verdana,Tahoma,Arial }

h1 { font-size:120%; line-height:150%; margin:0px; padding:54px 5px 5px 350px; background-color:#EBF0F6; border-bottom:2px solid #204050 }

h2 { font-size:110%; margin:30px 15px 10px; color:#204050; padding-top:10px; border-top:1px dotted #204050 }

p.spr + h2 { margin-top:50px; border:none } /* erste Überschrift */

h3 { font-size:95%; margin:20px 15px 10px; color:#204050 }

div.navi h3 { font-size:90%; color:#204050; border-bottom:1px dotted #204050; margin:20px 0px 0px 10px; padding:1px 1px 1px 8px }

p { font-size:95%; line-height:135%; padding:0px 15px; margin:0px }

p.kleinfett { font-size:80%; font-weight:bold }

p.trenner { width:100%; clear:both; padding-bottom:30px }

p.trenner.duenn { padding:0px; font-size:1%; line-height:1% }

b { color:#204050 }

div.inhalt.fuss + p.trenner { padding-bottom:0px }  /* unter Social Bookmarks weniger Abstand */

div.links { width:50% }  /* Solar-Quick */

div.rechts { width:50%; float:right }  /* Solar-Quick */

ul { list-style-image:url('../bilder/li.png'); list-style-position:outside; padding:0px 7px 0px 24px; margin:0px }

li { font-size:95%; line-height:135%; margin:0px 8px; padding:0px }

ul + p { margin-top:15px }



/************************************************* Links */

a:link,a:visited { color:blue; text-decoration:underline }

a:active { color:blue }

a:hover { color:black; text-decoration:none }


/************************************************* Navigationsspalte */

div.navi { width:22%; float:left; background-color:#EBF0F6 }

div.navi div { background-color:white }

div.navi p { font-size:90%; margin:1px 0px; padding:0px; border-bottom:none }

div.navi p a { border-left:10px solid #D8E0E8; background-color:#EBF0F6; padding:0px 0px 0px 8px; display:block; text-decoration:none }

div.navi p a:hover { background-color:#D8E0E8; border-left:10px solid red }

div.navi h1 { padding:42px 0px 17px; background-color:#D8E0E8; color:blue; text-align:center }

div.navi p#abschluss { padding-bottom:30px }

div.navi p#aktuell { background-color:#D8E0E8; color:black; padding:0px 0px 0px 8px; border-left:10px solid red }

div.navi div.extern p a:hover { border-left:10px solid blue }


/************************************************* Bilder */

img { float:right; border:none; margin:25px 15px 10px 10px; padding:1px }

a img { border:1px solid blue }

a:hover img { border:1px solid red }

img.banner { height:97px; width:300px; margin:15px 15px 0px; float:left }

img.prinzipsk { height:313px; width:228px }

img.zirkomatbild { height:180px; width:228px }

img.ohnezirkomat { height:256px; width:228px }

img.saechsumwelt { height:145px; width:102px; margin:0px 15px 0px 10px }

img.zirkoprotect { height:156px; width:120px; margin:0px 15px 10px 10px }

h2 + img.zirkoprotect { margin-top:-30px }

p.urkunden img { height:232px; width:164px; margin:5px 10px 10px 3px; float:none }

img.heliomat { height:187px; width:250px; margin-top:0px }

div.links img,div.rechts img { height:196px; width:274px; margin:15px 0px 0px 15px; float:none }
    /* regulaere Fotos zu Solar-Quick */

div.links img.solarquickklein, div.rechts img.solarquickklein { height:196px; width:129px; margin-left:87px }
    /* zwei kleine Fotos zu Solar-Quick */

img.zirkomat { width:230px; height:78px; border:none; margin:0px 0px 20px; float:right }

p#valid { text-align:right; margin-top:30px }

p#valid img { width:80px; height:15px; margin:0px 15px 0px; float:none; border:none; }


/************************************************* Sprachwahl */

p.spr { padding:3px; background-color:#D8E0E8; width:22%; text-align:center; float:right }

p.spr a { text-decoration:none }

p.spr img { width:22px; height:12px; border:none; margin:0px 5px 0px 0px; float:none; padding:0px }
   /* erst hier (nach a:hover img) definiert */


/************************************************* Tabelle */

table { margin:12px 15px 0px; padding:0px; background-color:#204050 }

td { font-size:90%; line-height:125%; background-color:#EBF0F6 }

td + td { text-align:right }


/************************************************* Formular */

form { margin:15px 15px 10px }

fieldset { background-color:#EBF0F6; border:1px solid #204050 }

legend { font-size:90%; padding:5px; font-weight:bold; color:#204050 }

table#inner { margin:3px }

table#inner td { text-align:left }

table#inner td.rechts  { text-align:right }

td input[name=vorname] { margin-right:25px }

td input[name=plz] { margin-right:23px }

td.anmerkungen { vertical-align:top }


/************************************************* Fusszeile mit Social Bookmarks */

div.inhalt.fuss p { margin:30px 15px 0px; padding:3px 0px 0px; border-top:1px dotted #204050; font-size:85% }

div.inhalt.fuss p img { width:16px; height:16px; border:1px solid white; margin:5px 1px 0px; padding:1px; float:none }

div.inhalt.fuss a:hover img { border:1px solid red }