/* css autor & webdesigner
darko jergovic
www.dejot.ch 
vielen dank dass sie sich für den css-code interessieren, wenn sie eine website brauchen, dann bitte - zögern sie nicht, kontaktieren Sie mich und geniessen Sie www.filimon.ch -> jetzt!
*/

/*
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: black;
	background: white;
}
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 */

/* dejot.ch - css --> fuer filimon.ch --> seitengeruest
-------------------------------------- */
html { background: transparent url(../images/16.jpg) 0 0 repeat; height: 101%; text-align: center; }
body { background-color: transparent; font: normal 62.5%/1.5 Tahoma, Verdana, sans-serif; }

#alles {
background-color: transparent;
padding-top: 30px;
margin: 0 auto; 
position: relative;
text-align: left;
width: 844px;
font-size: 1.1em; }

#kopf {
background-color: white;
height: 120px;
position: relative;
width: 844px; 
z-index: 30;}

#siteinfo {
position: relative; 
background: transparent url(../images/78.jpg) 0 0 no-repeat;  
height: 325px;
width: 844px;
z-index: 20; }

#inhalt {  
background: white url(../images/19.jpg) repeat-x;
padding: 0 0 30px;
width: 844px; }

#fusszeile {
background: transparent;
clear: both;
color: white;
height: 65px;
position: relative;
padding-bottom: 40px;
width: 844px; }

#kolumne_news { 
color: white;
left: 844px; 
position: absolute;
top: 141px;
width: 226px; }


/* =div ----------------------------------------------- */
#logo { height: 192px; left: -91px; position: absolute; top: 156px;  width: 92px; z-index: 40; }
#inhalt_haupt { background-color: transparent; padding-top: 20px; }
#kolumne_rechts { background-color: transparent; padding-top: 20px; }
#suchform { right: 10px; position: absolute; top: 40px; width: 287px; }
#suchtext { background: transparent url(../images/87.gif) 0 0 no-repeat; border: 0 none; width: 200px; height: 14px; padding: 5px; font-size: 11px; float: left; }

/* =klasse ----------------------------------------------- */
#default #kolumne_rechts li.bild { height: 110px; overflow: hidden; width: 392px; }
#kolumne_rechts.kolumne_rechts-kurz { padding-right: 20px; }

/* =h1 ----------------------------------------------- */
h1 { background-color: transparent; font-size: 1.6em; height: 192px; width: 92px; }
h1 span { display: block; text-indent: -5000px;  }
/* =h2 ----------------------------------------------- */
#inhalt_haupt h2.dienstleistungen { background: transparent url(../images/82.gif) -5px 0 no-repeat; height: 40px; text-indent: -5000px; }
#inhalt_haupt h2.unternehmen { background: transparent url(../images/80.gif) -5px 0 no-repeat; height: 40px; text-indent: -5000px; }
#inhalt_haupt h2.kontakt{ background: transparent url(../images/81.gif) -5px 0 no-repeat; height: 40px; text-indent: -5000px; }
#inhalt_haupt h2.suche{ background: transparent url(../images/83.gif) -5px 0 no-repeat; height: 40px; text-indent: -5000px; }
#inhalt_haupt h2.goodies{ background: transparent url(../images/35.gif) -5px 0 no-repeat; height: 40px; text-indent: -5000px; }
#inhalt_haupt h2.news{ background: transparent url(../images/89.gif) -5px 0 no-repeat; height: 40px; text-indent: -5000px; }
#kolumne_rechts.kolumne_rechts-kurz li.rot h2 {margin: 0 10px 0; }
#default #kolumne_rechts li.rot h2 { padding-top: 0.4em; font-size: 2.4em; margin: 0 20px 0; }
#inhalt_haupt .resultat-detail h2 { border-top: 1px solid #CCC; border-bottom: 2px solid #CCC; color: #666; margin: 0 1px; padding: 0 10px; }
/* =h3 ----------------------------------------------- */
#inhalt_haupt h3 { color: #222; font: bold 1.2em/1.4em Georgia, Geneva, serif; padding: 10px 10px; font-style: italic; margin-bottom: 10px; }
#dienstleistungen #inhalt_haupt h3, 
#unternehmen #inhalt_haupt h3,
#kontakt #inhalt_haupt h3,
#news #inhalt_haupt h3,
#suche #inhalt_haupt h3 { background-color: #F1F1F1; }
#unternehmen #inhalt_haupt h3.jobs { background-color: #CCC; background-image: none; color: #FFF; }


/* =p ----------------------------------------------- */
#inhalt_haupt p { margin: 10px 0; background-color: #FFF; }
#kolumne_rechts.kolumne_rechts-kurz li.rosa p,
#kolumne_rechts.kolumne_rechts-kurz li.tuerkis p { margin: 0 10px 0; }
#default #kolumne_rechts li.rosa p { padding-top: 0.6em; font-size: 1.4em; }
#default #kolumne_rechts li.tuerkis p { padding-top: 0.5em; font-size: 1.2em; } 
#kolumne_rechts p { color: white; font-size: 1.1em; line-height: 1.0em; margin: 0 20px 0; }


/* =a ----------------------------------------------- */
#inhalt_haupt a { background-color: white; color: #222; font-weight: bold; text-decoration: none; margin: 0 0.2em; padding: 0 0.4em; }
#inhalt_haupt a:hover { color: #2DD0FF; }
#kolumne_rechts a { color: white; font-weight: bold; text-decoration: none; }
#kolumne_rechts a:hover { text-decoration: underline; }
#default #kolumne_rechts a:hover { text-decoration: underline; }
#inhalt_haupt .kolumne_rechts-lang ul li a { margin: 0; padding: 0; font-weight: normal; text-decoration: underline; } 
.kolumne_rechts-lang ul li.tuerkis a { display: inline; }

/* =ul ----------------------------------------------- */
#inhalt_haupt ul { background-color: white; padding: 10px 0; list-style-type: disc; list-style-position: inside; }
ul#jobs  { background-color: #FFF; border-bottom: 12px solid #FFF; color: black; list-style-type: none; margin: 0; padding: 0; width: 392px; }
#inhalt_haupt ul#resultat { list-style-type: none; }
/* =li ----------------------------------------------- */
#inhalt_haupt li.linormal{ background-image: none; border-bottom: 1px solid #FFF; padding-left: 20px; width: 352px; float: left; }
ul#jobs li { margin: 0; padding: 0; width: 392px; float: left; background-image: none; border-bottom: 1px solid white; }
ul#jobs li .linksbox { float: left; display: block; width: 140px; font-weight: bold; }
ul#jobs li .rechtsbox { float: right; display: block; width: 220px; }
#kolumne_rechts li { float: left; height: 48px; margin: 2px 0 0; overflow: hidden; width: 186px; }
#kolumne_rechts li.bild { height: 110px; overflow: hidden; width: 186px; }
#kolumne_rechts li.rot { background-color: #e3001B; }
#kolumne_rechts li.rosa { background-color: #FF6376; }
#kolumne_rechts li.tuerkis { background-color: #2DD0FF; height: 24px; }
#kolumne_rechts li.rot h2 { padding-top: 0.9em; color: #FFF; margin: 0 20px 0; font: bold 1.8em/1.5em Georgia, Geneva, serif; font-style: italic; }
#kolumne_rechts li.rosa p,
#kolumne_rechts li.tuerkis p { padding-top: 0.6em; }
#default #kolumne_rechts li { width: 392px; }
#inhalt_haupt li.resultat-detail { border-bottom: 1px solid #CCC; margin-bottom: 10px; }

/* =img ----------------------------------------------- */
img { background-color: #444; }
#inhalt_haupt p img { margin: 0 auto; }
#inhalt_haupt .linksbild { margin: 10px 10px 10px 0; float: left; }
#inhalt_haupt .rechtsbild { margin: 10px 0 10px 10px; float: right; }
#inhalt_haupt .artikelbox { background-color: #FFF; margin-bottom: 20px; width: 392px; }
h1 img,
img#badge { background-color: transparent; }

/* =strong ----------------------------------------------- */
strong { font-weight: bold; }
/* =button ----------------------------------------------- */
button { border: none; background: transparent url(../images/5.jpg) 10px -8px no-repeat; height: 45px; text-indent: -5000px; outline: none; width: 75px; }

/* =suche anpassung ----------------------------------------------- */
#suche #container_nav_seite { display: none; }

/*
kontakt */
#kontaktform { background-color: #F5F5F5; }
#kontaktform legend { display: none; }
#kontaktform ul { background-color: #F5F5F5; list-style-type: none; margin: 0px; padding: 0px; width: 392px; }
#kontaktform li { border-bottom: 1px solid white; margin: 0; padding: 10px; width: 372px; height: 30px; }
#kontaktform #mitteilung li { height: 120px; width: 372px; }
#bemerkungen { border: 2px solid #CCC; margin: 0; padding: 5px; width: 180px; height: 100px; float: right; }
.zemRequired { font: normal 1.1em/1.6 Arial, Verdana, sans-serif; }
#kontaktform li label { display: block; width: 140px; float: left; padding-left: 10px; }
#kontaktform li input { border: 2px solid #CCC; display: block; width: 180px; float: right; padding: 5px; }

/*
news kolumne - inhalt */
#kolumne_news h2 { background: transparent url(../images/93.jpg) 0 -1px no-repeat; color: #E3001B; font-size: 2.4em; font-weight: bold; width: 226px; height: 105px; margin: 10px 0 0; text-indent: -5000px; }
#kolumne_news ul { padding-bottom: 40px; }
#kolumne_news li { margin: 10px 0; }
#kolumne_news a:hover { text-decoration: underline; color: #2DD0FF; }
#kolumne_news p { margin: 10px 20px 0; color: #FFF;}
#kolumne_news p span { color: #FFF; display: block; margin: 2px 0; }
#kolumne_news p.first { margin-bottom: -5px }
#kolumne_news span, #kolumne_news a { background-color: #291500; color: #2DD0FF; padding: 2px 8px; text-decoration: none; }
 
/*
fusszeile - inhalt */
#fusszeile #vcard { left: 570px; position: absolute; top: 10px; }
#fusszeile #webinfo { color: #2DD0FF; position: absolute; top: 10px; right: 0; }
#fusszeile p { line-height: 1.2em; padding: 0; }

/*
sprüche sticker brandings */
#spruch { background: transparent url(../images/sticker.png) no-repeat; height: 90px; left: 0; position: absolute; top: 0; text-indent: -5000px; outline: none; width: 220px; z-index: 150; }
/* #preisliste { display: block; width: 210px; height: 210px; text-indent: -5000px; background: transparent url(../images/77.png) 0 0 no-repeat; position: absolute; left: 5px; top: 0; } */

/* ----------------------------------------------- 
=diverse elemente, welche ich nicht separieren moechte =navigation
----------------------------------------------- */

/*
hauptnavigation - haupt ----------------------------------------------- */
#nav_haupt { font-size: 1.6em; height: 35px; position: absolute; right: 0; top: 91px; text-decoration: none; z-index: 41; }
#nav_haupt ul { list-style: none; margin: 0; padding: 0; }
#nav_haupt ul li { float: left; margin: 0; padding: 0; }
#nav_haupt ul li a { color: #E3001B; display: block; height: 35px; margin: 0 1px; padding: 0; text-decoration: none; text-indent: -5000px; outline: none; }
#nav_haupt ul li#navh_startseite a { background: transparent url(../images/8.gif) no-repeat; width: 101px; }
#nav_haupt ul li#navh_unternehmen a { background: transparent url(../images/10.gif) no-repeat; width: 124px; }
#nav_haupt ul li#navh_dienstleistungen a { background: transparent url(../images/12.gif) no-repeat; width: 142px; }
#nav_haupt ul li#navh_kontakt a { background: transparent url(../images/14.gif) no-repeat; width: 90px; }
#nav_haupt ul li#navh_startseite a:hover, #nav_haupt ul li#navh_startseite a.active 
{ background: transparent url(../images/9.gif) no-repeat; width: 101px; }
#nav_haupt ul li#navh_unternehmen a:hover, #nav_haupt ul li#navh_unternehmen a.active  
{ background: transparent url(../images/11.gif) no-repeat; width: 124px; }
#nav_haupt ul li#navh_dienstleistungen a:hover, #nav_haupt ul li#navh_dienstleistungen a.active  
{ background: transparent url(../images/13.gif) no-repeat; width: 142px; }
#nav_haupt ul li#navh_kontakt a:hover, #nav_haupt ul li#navh_kontakt a.active  
{ background: transparent url(../images/15.gif) no-repeat; width: 90px; }

/*
unternavigationen - links  ----------------------------------------------- */
ul#nav_seite { border-bottom: 1px solid #999; list-style-type: none; margin: 0; padding: 48px 0 0; }
ul#nav_seite li { vertical-align: middle; width: 186px; }
ul#nav_seite li a { border-top: 1px solid #999; display: block; margin: 1px 0 0; padding: 2px 12px; width: 162px; }

ul#nav_seite li a:link,
ul#nav_seite li a:visited { color: #222; font-size: 1.1em; font-weight: normal; margin: 0; }
ul#nav_seite li a:hover { background-color: #CCC; color: white; text-decoration: none; }
ul#nav_seite li.act a { font-weight: bold; }

/*  ---> unternavigation submenu <---   ----------------------------------------------- */
ul#nav_seite li ul { list-style-type: none; margin: 0; padding: 0; }
ul#nav_seite li ul li { vertical-align: middle; width: 186px; }
ul#nav_seite li ul li a { display: block; margin: 1px 0 0; padding: 2px 12px 2px 20px; width: 154px; }

ul#nav_seite li ul li a:link,
ul#nav_seite li ul li a:visited,
ul#nav_seite li ul li a:hover { background-color: white; color: #222; font-size: 1.1em; font-weight: normal; }
ul#nav_seite li ul li a:hover { text-decoration: underline; }
ul#nav_seite li ul li.act a { background-color: #F1F1F1; color: #222; font-weight: bold; text-decoration: none; }

/*
klassen für frameworking  ----------------------------------------------- */
.kolumne_links-kurz { float: left; width: 186px; padding-left: 20px; }
.kolumne_links-lang { float: left; width: 392px; padding-left: 20px; }

.kolumne_links-xlang { float: left; width: 598px; padding-left: 20px; } /* xlang ist extralang */
.kolumne_rechts-xlang { float: right; width: 598px; padding-right: 20px; } /* xlang ist extralang */

.kolumne_rechts-kurz { float: right; width: 186px; padding-right: 20px; }
.kolumne_rechts-lang { float: right; width: 392px; padding-right: 20px; }

.kolumne_links-lang .kolumne_links-kurz, 
.kolumne_links-lang .kolumne_rechts-kurz, 
.kolumne_links-xlang .kolumne_links-kurz, 
.kolumne_links-xlang .kolumne_rechts-kurz, 
.kolumne_links-xlang .kolumne_links-lang, 
.kolumne_links-xlang .kolumne_rechts-lang { padding-left: 0; padding-right: 0; }
/* klassen für frameworking --> ende  ----------------------------------------------- */
/* klassen für frameworking seitenbezogen  ----------------------------------------------- */
#kolumne_rechts.kolumne_rechts-lang { padding-right: 20px; }
#inhalt_haupt.kolumne_links-lang { padding-left: 20px; }
#inhalt_haupt.kolumne_links-xlang { padding-left: 20px; }

/* 
andere nützliche layoutklassen  ----------------------------------------------- */
.links { float: left; }
.rechts { float: right; }
.beide { clear: both }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }/* einfaches clearen von floats */
.artlink a span { color: #2DD0FF; margin: 0 0.4em; }
.artikelbox h4 { padding: 10px; font-weight: bold; text-decoration: underline; }
.artikelbox h5 { padding: 10px; font-weight: bold; }

/*  
bildergalerie artikelauflistung dass css für lightbox ist in einem separaten css file  ----------------------------------------------- */
#inhalt_haupt ul.bildergalerie { background-color: #FFF; list-style-type: none; list-style-position: outside; margin: 0 10px; padding: 0 0 12px; }
#inhalt_haupt .bildergalerie li { margin: 0; padding: 0; width: auto; float: left; background-color: white; background-image: none;  border-bottom: 3px solid #E5EFFA; }
#inhalt_haupt .bildergalerie li a { background-color:white; color:#666; font-weight:bold; margin: 0; padding: 0;
 text-decoration:none; }