/* css autor & webdesigner
darko jergovic
www.dejot.ch 
vielen dank dass sie sich für den css-code interessieren ( be & feel motivated - dnot't copy), wenn sie eine website brauchen, dann bitte - zögern sie nicht! */


/*
start eric meyers reset css - setzt alle browserwerte zurueck */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; 	padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
/* 
remember to define focus styles! */
:focus { outline: 0; }
body { line-height: 1; color: #000; background: #fff; }
ol, ul { list-style: none; }
/* 
tables still need 'cellspacing="0"' in the markup */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
/* 
stop eric meyers reset.css */

html { font: normal 62.5%/1.6 Arial, Verdana, sans-serif; background-color: #002344; height:101%; text-align:center; }
body { font-size: 1em; font-weight: normal; text-decoration: none; background: #fff url(../images/2.gif) repeat-x 0 125px; color: #000; }

/* start 
=tags  */
/* sammeldefinitionen */
h2, h3, h4, ul, ol, p { padding: 0; margin: 0 10px 1.5em; }
#inhalt h2, #inhalt h3, #inhalt h4, #inhalt h5 { clear: both; }

.artikel h2, .artikel h3, .artikel h4, .artikel ul, .artikel ol { clear: both; }

/* =a */
a { color: #4F7BA5; text-decoration: none; outline: none; }
a:hover, a.breadcrumb:hover { color: #4f7ba5; }
a.breadcrumb { margin: 0 10px 1.5em 0; }
a.skip { display: none; }
h1 a { width: 251px; height: 70px; display: block; }
h2 a { width: 220px; height: 43px; display: block; }
#aktuell01 h2 a:hover { width: 220px; height: 43px; display: block; background: transparent url(../images/78.png) 0 0 no-repeat;  }
#aktuell02 h2 a:hover { width: 220px; height: 43px; display: block; background: transparent url(../images/80.png) 0 0 no-repeat;  }
#aktuell01 p a { color: #4a9748; }
#footer #titelfooter a { margin: 20px 0 5px; width: 178px; height: 50px; display: block; text-indent: -5000px; background: transparent url(../images/37.png) 0 0 no-repeat; }
#footer a { margin: 0 5px; padding: 0.4em 0; font-size: 1.1em; color: #666; text-decoration: underline; }
#hauptnavigation li a { height: 40px; display: block; text-indent: -5000px; }
#linkliste li a { margin: 0; padding: 0; border-bottom: 1px solid #4F7BA5; font-weight: bold; line-height: 1.2em; }
#linkliste li a:hover { color: #4F7BA5; border-bottom: none; }
#m_start {  width: 160px; background: transparent url(../images/6.gif) 0 0 no-repeat; }
#m_zueri4two { width: 178px; background: transparent url(../images/5.gif) 0 0 no-repeat; }
#m_funktion { width: 190px; background: transparent url(../images/7.gif) 0 0 no-repeat; }
#m_kontakt { width: 168px; background: transparent url(../images/8.gif) 0 0 no-repeat; }
#m_start.active, #m_start:hover  { background: transparent url(../images/6.gif) 0 -52px no-repeat; }
#m_zueri4two.active, #m_zueri4two:hover  { background: transparent url(../images/5.gif) 0 -52px no-repeat; }
#m_funktion.active, #m_funktion:hover { background: transparent url(../images/7.gif) 0 -52px no-repeat; }
#m_kontakt.active, #m_kontakt:hover { background: transparent url(../images/8.gif) 0 -52px no-repeat; }
#unternavi a { width: 180px; height: auto; color: #222; display: block; font-size: 1.2em; font-weight: normal; text-decoration: none; }
#unternavi a:hover, #unternavi a.active { padding-left: 20px; color: #4F7BA5; background: transparent url(../images/84.gif) 0 2px no-repeat; }
#schnellkontakt a:hover { color: #4F7BA5; }

.artikelnavigation a { border-bottom: 1px dotted #4F7BA5; color: #222; display: block; font-weight: bold; text-decoration: none; }
.artikelnavigation .next a { padding: 0 40px 0 0; float: right; background: transparent url(../images/87.gif) right 50% no-repeat; }
.artikelnavigation .prev a { padding: 0 0 0 40px; float: left; background: transparent url(../images/88.gif) left 50% no-repeat; }
.artikel li a { border-bottom: 1px dotted #4F7BA5; }
.artikel li a:hover { border-bottom: none; }
.exclink { margin: 8px 0 12px; padding: 0.2em 0; width: 100%; display: block; border-bottom: 4px solid #dbecfa; }
.kategoriearttitel li a { color: #000; }
a.zuangebote { width: 225px; height: 43px; margin-top: 18px; display: block; text-indent: -5000px; background: transparent url(../images/93.png) 0 0 no-repeat; }
a.zuangebote:hover { background: transparent url(../images/94.png) 0 0 no-repeat; }
a.zunews { width: 225px; height: 43px; display: block; text-indent: -5000px; background: transparent url(../images/89.png) 0 0 no-repeat; }
a.zunews:hover { background: transparent url(../images/90.png) 0 0 no-repeat; }
#footcontent .artikel a { color:#4A9748; margin:0; padding:10px 0 5px; border: none; text-decoration: none; display: inline; }

/* =blockquote */
blockquote, pre { margin: 10px 0; padding: 0.2em 0.9em 0.9em 5em; width: 280px; border-top: 3px solid #4f7ba5; border-bottom: 1px solid #4f7ba5; background: #ECF3FE url(../images/55.gif) 0.4em 0.4em no-repeat;  }
pre { display: block; }

/* =button */
#suchform button { margin: 8px 0; padding: 0; width: 40px; height: 30px; background-color: transparent; border: none; text-indent: -5000px; outline: none; }

/* =em */
em { border-bottom:1px dotted #4F7BA5; font-size:1em; font-style:italic; font-weight:normal; }

/* =fieldset */
#suchfeld { width: 230px; height: 68px; border: none; background: transparent url(../images/39.gif) 0 0 no-repeat;  }

/* =h1 */
h1 { width: 251px; height: 70px; position: absolute; top: 0; right: 0; text-indent: -5000px; background: transparent url(../images/3.jpg) 0 0 no-repeat; }

/* =h2 */
#aktuell01 h2 { margin: 0; width: 220px; height: 43px; color: #4f7ba5; text-indent: -5000px; background: transparent url(../images/77.png) 0 0 no-repeat; }
#aktuell02 h2 { margin: 0 0 7px 10px; width: 220px; height: 43px; color: #4f7ba5; text-indent: -5000px; background: transparent url(../images/79.png) 0 0 no-repeat; }
#linkliste h2 { margin-bottom: 7px; width: 220px; height: 43px; color: #4f7ba5; text-indent: -5000px; background: transparent url(../images/82.png) 0 0 no-repeat; }
#schnellkontakt h2 { margin: 0 0 7px 10px; width: 220px; height: 43px; color: #4f7ba5; text-indent: -5000px; background: transparent url(../images/83.png) 0 0 no-repeat; }
#default h2.hauptartikel { margin: 0; padding: 0; width: 100%; height: 50px; text-indent: -2000px; background: transparent url(../images/14.png) 0 0 no-repeat; }
#zueri4two h2.hauptartikel { margin: 0; padding: 0; width: 100%; height: 50px; text-indent: -2000px; background: transparent url(../images/16.png) 0 0 no-repeat; }
#funktion h2.hauptartikel { margin: 0; padding: 0; width: 100%; height: 50px; text-indent: -2000px; background: transparent url(../images/18.png) 0 0 no-repeat; }
#kontakt h2.hauptartikel { margin: 0; padding: 0; width: 100%; height: 50px; text-indent: -2000px; background: transparent url(../images/92.png) 0 0 no-repeat; }
#newsseite h2.hauptartikel { margin: 0; padding: 0; width: 100%; height: 50px; text-indent: -2000px; background: transparent url(../images/22.png) 0 0 no-repeat; }
#suche h2.hauptartikel { margin: 0; padding: 0; width: 100%; height: 50px; text-indent: -2000px; background: transparent url(../images/24.png) 0 0 no-repeat; }
#angebote h2.hauptartikel { margin: 0; padding: 0; width: 100%; height: 50px; text-indent: -2000px; background: transparent url(../images/56.png) 0 0 no-repeat; }
h2 { font-size: 1.6em; margin-bottom: 1.8em; }

/* =h3 */
h3 { font-size: 1.2em; }
.kategorienliste h3, .kategorienlistendiv h3 { margin: 0; padding: 0.6em; color: #000; font-weight: bold; background-color: #fff;  }
#default .kategorienlistendiv h3 { font-family: Georgia, Times, serif; font-weight: bold; font-style: italic; }
#default h3.hauptartikel,
#zueri4two h3.hauptartikel,
#funktion h3.hauptartikel,
#kontakt h3.hauptartikel,
#newsseite h3.hauptartikel, #suche h3.hauptartikel { padding: 0.3em 0.2em; background-color: #FFF; color: #222; font-weight: normal; border-bottom: 1px solid #4f7ba5; }
#aktuell01 h3 { margin: 0 0 10px; padding: 0.8em 0.6em; background-color: #ECF3FE; color: #000; font-size: 1em; font-style: normal; }
#kontakt h3.hauptartikel { margin:0 0 1.5em; }
#footer #h3 { margin: 0; padding: 0; }
h3.alleangebote { font-family: Georgia, Times, serif; font-weight: bold; font-style: italic; }
#footcontent .artikel h3 { margin: 0; padding: 0 0 10px; font: bold 1.5em/1.5 Georgia, Times, serif; font-style: italic;  background-color: #002344; color: #fff; border: none; }

/* =h4 */
h4 { padding:0.4em 0 0.2em; border-bottom: 1px dotted #4F7BA5; font-size: 1.2em; font-weight: bold; }
.angebot h4 { padding: 0.4em 0 0.2em; border-top: 1px dotted #4F7BA5; border-bottom: 1px solid #4F7BA5; clear: both; }
#kontakt .kol460 h4 { margin: 0 20px 1.5em 0; }


/* =img */
img { margin: 20px; } 				
.kol220 img { margin: 0 10px 10px 0; float: left; }
.artikeleinleitend { margin: 0 10px 18px; }	
.angebot .artikeleinleitend img { margin: 0; padding: 1em 0; }
#footcontent .artikel img { margin: 0 10px 10px 0; padding: 0; float: left; width: 60px; height: 60px; border: 3px solid #fff; }
						   		
/* =input */
#suchfeld input { width: 158px; font-size: 1.0em; background-color: transparent; border: none; color: #666; font-style: italic; }
#kontaktform li input { border: 2px solid #4F7BA5; display: block; width: 250px; float: right; padding: 5px; }
#kontaktform #kartenauswahl li input.zemCheckbox { margin: 10px; width: 20px; height: 20px; border: none; }
#kontaktgrund li input { width: auto; border: none; }
.zemRequired, .zemCheckbox { font: normal 1.1em/1.6 Arial, Verdana, sans-serif; }
#bemerkungen { margin: 0; padding: 5px; width: 250px; height: 100px; float: right; border: 2px solid #4F7BA5; }

/* =label */
#kontaktform li label { display: block; width: 140px; float: left; padding-left: 10px; }
#kontaktgrund li label { width: 200px; }

/* =legend */
#kontaktform legend { display: none; }

/* =li */
#aktuell02 li { margin: 0 0 4px 10px ; padding: 10px 0; height: 51px; border-bottom: 1px solid #4f7ba5; background: #ECF3FE url(../images/38.gif) 187px 5px no-repeat; }
#hauptnavigation li { width: auto; height: 40px; float: left; border-left: 2px solid #4f7ba5; }
#kontaktform li { margin: 0; padding: 10px; width: 440px; height: 30px; border-bottom: 5px solid #fff; background-color: #ECF3FE;  }
#kontaktform #mitteilung li { height: 120px; }
#linkliste li { margin-bottom: 4px; padding: 0.2em 0.8em 0.2em  2em; width: 196px; height: auto; display: block; background: transparent url(../images/81.gif) 0 0.2em no-repeat; }
#unternavi li  { margin: 0; padding: 10px; width: 200px; height: auto; float: left; background-color: #fff; border-bottom: 1px solid #4F7BA5; }
div.angebotlinks ul li { margin: 1px 0 0 ; padding: 0.2em 0.4em; background-color: #fff; background-image: none; }

#kartenauswahl li { height: 85px; }
#kontaktform li label.zueri4two { margin: 5px; padding: 5px; width:96px; height: 65px; float:left; display:block; text-indent: -5000px; border: 2px solid #4F7BA5; background: #fff url(../images/57t.jpg) center center no-repeat;
}
#kontaktform li label.zueri4touri { margin: 5px; padding: 5px; width:96px; height: 65px; float:left; display:block; text-indent: -5000px; border: 2px solid #4F7BA5; background: #fff url(../images/58t.jpg) center center no-repeat;
}

.artikel li { margin: 1px 0 0; padding: 0.4em 1em 0.4em 2.2em; background: #ECF3FE url(../images/84.gif) 0 0.3em no-repeat; }
.kategorienliste li { margin: 0 0 30px; padding: 1em; background-color: #f0f0f0; background-image: none; }
.kategoriearttitel li { margin: 2px 0 0; padding: 0.4em 1em 0.4em 2.2em; background: #ECF3FE url(../images/84.gif) 0.4em 0.5em no-repeat; border-bottom: 1px solid #4F7BA5;  font-size: 1.1em; line-height: 1.5em; text-transform: uppercase; }

#schnellkontakt li { margin: 0 0 5px 10px; padding: 0.8em 0.6em; background-color: #ECF3FE; line-height: 1.4em; }

/* =p */
p { line-height: 1.4em; }
.angebotlinks p { color: #666; font-size: 0.9em; font-style: normal; line-height: 1.2em; }
#aktuell02 p { padding-right: 1.8em; }
#aktuell01 p { margin: 0 0 10px; width: 118px; float: right; }
#kontakt .flinks p { margin: 0 10px 1.5em 0; }
#kontakt .frechts p { margin: 0 0 1.5em 20px; }
#kontakt .flinks blockquote p { margin:  0 10px 1.5em 10px; }
#footcontent .artikel p { margin: 0; padding: 0 0 20px; font-size: 1.2em; line-height: 1.6em; }

/* =span */
#aktuell02 span { color: #4F7BA5; font-size: 0.9em; font-style: italic; }
#titelfooter { width: 178px; height: 50px; display: block; margin: 20px auto 10px; }
a.breadcrumb span { color: #222; }

/* =strong */

strong { font-weight: bold; }

/* =ul */
#aktuell02 ul,
#schnellkontakt ul { margin: 0; padding: 0; }
#hauptnavigation ul { margin: 0px; padding: 0px; list-style-type: none; }
#kontaktform ul { margin: 0 0 1.5em; padding: 10px 0; width: 460px; list-style-type: none; }

#unternavi ul { margin: 50px 0 0; padding: 0; width: 220px; border-top: 1px solid #4F7BA5; overflow: hidden; }
.artikel ul { font-size:1em; list-style-type:none; overflow:hidden; }
ul.kategorienliste { margin: 0; font-size:1em; list-style-type:none; overflow:hidden; }
ul.kategoriearttitel  { margin: 0; font-size:1em; list-style-type:none; overflow:hidden; }
.angebotlinks ul { margin: 0; padding: 0; }

/* ende =tags */

/* ---------------------------------------------- layout ---------------------------------------------- */

/* =div */
#alles { width: 960px; margin: 0 auto; padding: 0; position: relative; font-size: 1.2em; text-align: left; background-color: transparent; }
#aktuell01 div { margin: 5px 10px 0 0; padding: 0; min-height: 58px; overflow: hidden; }
.angebot { padding: 0 0 10px; }
.angebotrechts { margin: 0; padding: 0; float: right; width: 360px; }
.angebotlinks { margin: 0; padding: 0; float: left; width: 120px; }
.angebot .artikeleinleitend { width: 460px; height: auto; border-bottom: 2px solid #4F7BA5; border-top: 1px solid #4F7BA5; overflow: hidden; }
.artikelnavigation { margin: 0; padding: 40px 0 10px; width: 100%; overflow: hidden; }
#badge { width: 207px; height: 207px; position: absolute; top: 20px; right: -125px; text-indent: -5000px; z-index: 10; }
.kategorienlistendiv { margin: 0 0 30px; padding: 1em; background-color: #f0f0f0; background-image: none;  }

#footer { width: 100%;  margin: 0; padding-bottom: 40px; background-color: #002344; border-top: 6px dashed #fff; }


#hauptnavigation { width: auto; height: 40px; position: absolute; top: 75px; left: 0;  background-color: #fff; font-size: 1.4em; }
#inhalt { width: 960px; padding: 20px 0; position: relative; background-color: #fff; color: #222; overflow: hidden; }
#kopf { height: 125px; width: 960px; position: relative; background-color: #fff; }

#schnellkontakt { margin: 18px 0 0; padding-bottom: 30px; width: 100%; }
#siteinfo { width: 960px; height: 282px; background: transparent url(../images/68.jpg) 0 0 no-repeat; }
#suchform { width: 230px; height: 68px; margin: 0; float: left; }
#suchfeldrahmen { width: 158px; height: 32px; padding: 15px; float: left; }
#unternavi { margin:  0 10px; position: relative; background-color: #fff; }
#kontaktform { margin: 0 0 0 20px; }

#footcontent { width: 990px; margin: 0 auto; padding: 20px 0 0; background-color: #002344; color: #A7CBE7; }
#footcontent .artikel, #footcontent #linkliste { width: 300px; margin: 0 15px; float: left; background-color: #002344; overflow: hidden; text-align: left; }
#footcontent #linkliste { margin: 0 15px; float: left; background-color: #FFF; overflow: hidden; text-align: left; font-size: 1.2em; }

/* ende 
festes layout website ---------------------------- layout ---------------------------------------------- */

/* ------------------------ start klassen ------------------------ */

.artikel { margin-bottom: 20px; }
.kolflex { width: auto; }
.kol960 { width: 960px; } 
.kol460 { width: 480px; } 
.kol220 { width: 240px; }
.flinks { float: left; }
.frechts { float: right; }
.cboth { clear: both; }
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* ------------------------ ende klassen ------------------------ */


#umbau { margin: 0 auto; padding: 0; width: 502px; height: 504px; position: absolute; left: 30%; top: 64px; color: #000; text-indent: -5000px; background: transparent url(../images/36.png) 0 0 no-repeat }