/** 
 * @creator        Data Network Alfeld e.V. (http://www.dna-ev.de)
 * @file           layout.css 
 * @description    Definition der Bereiche (Layout) 
 * 
 */ 

@media screen, projection, print { 

 /* definition von Hilfsklassen */
 .nachlinks { float: left; }
 .nachrechts { float: right; }
 .clearlinks { clear: left; }
 .clearrechts { clear: right; }
 
 .clearfloats { clear: both; }
 .border1px { border:1pt solid #696969; }

 /* definition eines zentrierten Bereiches mit fester Breite */
 #umalles { margin-top: 5px; margin-bottom: 5px; margin-left: auto; margin-right: auto; padding: 0px; background-color: #fff; width: 980px; max-width: 980px; } 
 
 /* definition des Reiter Bereiches */
 #reiter {width: 980px; margin:0px 0px 3px 0px; height:20px; text-align:left; font-size:0.90em; font-weight:bold; color: #807365; }
 .reiteritem {padding:3px 0px 0px 0px; list-style-type: none; width:125px; height:20px; text-align:center; float:left; background:url("../img/reiter.jpg") no-repeat scroll center bottom #fff;}
 #reiter a {text-decoration:none; color:#807365;}
 #reiter a:focus, #reiter a:hover, #reiter a:active {text-decoration:none; color: #b03f02; background:none;} 
 #reiter .selected {color:#999;}
 #reiter ul {margin:0px; padding:0px;}

 /* definition des Kopf Bereiches, abhängig von der Klasse wird das  Hintergrundbild ausgewechselt */
 #kopf { margin: 0px; padding: 0px; background-color: #fff; text-align: left; width: 980px; max-width: 980px; height:125px; max-height: 125px;  background-repeat: no-repeat; } 
 .kopf-home { background-image: url(../img/kopf/startseite.jpg); }
 .kopf-stadt{ background-image: url(../img/kopf/stadt.jpg); }
 .kopf-wirtschaft { background-image: url(../img/kopf/wirtschaft.jpg); }
 .kopf-leben { background-image: url(../img/kopf/leben.jpg); }
 .kopf-bildung { background-image: url(../img/kopf/bildung.jpg); }
 .kopf-gastro { background-image: url(../img/kopf/gastronomie.jpg); }
 .kopf-freizeit { background-image: url(../img/kopf/freizeit.jpg); }
 .kopf-marktplatz { background-image: url(../img/kopf/marktplatz.jpg); }
 .kopf-region { background-image: url(../img/kopf/region.jpg); }
 .kopf-default { background-image: url(../img/kopf/default.jpg); }
 
 /* #pfad {float:left; margin: 0px; padding: 0px; background-color: #fff; text-align: left; width: 740px; max-width: 740px; height:35px; max-height: 35px; background-repeat: no-repeat;} */
 /* definition des Stadtwappen Bereiches, damit es anklickbar wird */
 /* #alfeld-wappen { width: 84px; position: relative; top: 13px; left: 28px; float:left; clear:left;}  */
 /* #Sondernavigation { width: 135px; position: relative; top: -86px; left: 845px; font-size: 0.8em; text-align: right; } */
 /* #Spachen { width: 135px; position: relative; top: -80px; left: 845px; font-size: 0.8em; text-align: right; }  */
 /* definition des Alfeld LOGO Bereiches */
 /* #alfeld-logo { width: 308px; position: relative; top: -74px; left: 672px; } */ 
 
 #alfeld-wappen { width: 84px; margin:15px 0px 0px 28px; float:left; clear:left;} 
 
 /* Bereich um Sondernavigation und alfeld-logo */
 #Sonderbereich { float:right; border: 0pt solid #0f0; width:350px; height:125px; }
 #Sondernavigation { clear:right; width: 135px; font-size: 0.8em; text-align: right; float:right; }
 #Spachen { clear:right;  margin:7px 0px 3px 0px; width: 135px; font-size: 0.8em; text-align: right; float:right; } 
 #alfeld-logo { clear:right;  width: 308px; margin:0px 0px 18px 0px; float:right; } 

 /* definition des Kopfzeilen Bereiches, beinhaltet: Pfadnavigation oder Quicklinks */
 #kopfzeile { float:left; margin: 5px 0px 5px 0px; padding: 0px; background-color: #fff; text-align: left; width: 724px; max-width: 724px; height: 35px; max-height: 35px; overflow: auto; } 

 /* definition des Such Bereiches */
 /* aus suche:    position: relative; top: -61px; right: -740px; */
 #suche { float:right;  margin: 5px 0px 5px 0px; padding: 0px; color: #333; background: #d1e0ec; z-index:10; width:240px; height:33px; text-align:left; overflow: hidden; display: block; background-repeat: no-repeat; background-image: url(../img/rand/suche.png);  }
 #sucheeingabe { padding: 2px 0px 0px 30px; }

/*
 #sucheerweitert { margin: 3px 0px 0px 0px; padding: 5px; }
 #sucheschliessen { margin: 0px 0px 0px 0px; padding: 5px; text-align: right; }
*/

 #ac_results ul { z-index:20; }

 /* definition eines Bereiches um die drei Spalten: navigation, inhalt und rand  */
 #uminhalt { clear: both; margin: 0px; padding: 0px; background-color: #fff; width: 980px; max-width: 980px; } 

 /* definition des Navigations Bereiches */
 #navigation { margin: 0px; padding: 0px; float: left; background-color: #fff; width: 240px; max-width: 240px; } 
 
 /* definition des Inhalt Bereiches bei Dreispaltigem Layout */
 #inhalt3spaltig { margin: 0px 255px 0px 255px; padding: 0px; background-color: #fff; text-align: left; } 

 /* definition des Inhalt Bereiches bei Zweispaltigem Layout */
 #inhalt2spaltig { margin: 0px 0px 0px 255px; padding: 0px; background-color: #fff; text-align: left; } 

 /* definition eines Bereiches inerhalb von inhalt, fix für den clear:both bug von typos text-pic content */
 #ininhalt3spaltig { float:left; width:470px; max-width:470px; margin: 0px 0px 5px 0px; overflow: hidden;}

 /* definition eines Bereiches inerhalb von inhalt, fix für den clear:both bug von typos text-pic content */
 #ininhalt2spaltig { float:left; width:725px; max-width:725px; margin: 0px 0px 5px 0px; overflow: hidden;}

 /* definition des Rand Bereiches, abhängig von der Klasse wird der entsprechende boxenkopf definiert */
 #rand { margin: 0px; float: right; background-color: #fff; text-align: left; width: 240px; max-width: 240px; overflow: hidden; }
 .box { padding: 5px 5px 5px 5px; margin: 0px 0px 20px 0px; display: block; background-color: #e3e3de; width: 230px; max-width: 230px; }
 .box .csc-header { margin: -5px -5px 5px -5px; text-align: left; height: 30px; max-height: 30px; background-color: #e3e3de; background-repeat: no-repeat; }
 .rand-home .csc-header { background-color: #e60d2e; background-image: url(../img/rand/startseite.png); }
 .rand-stadt .csc-header { background-color: #007dcc; background-image: url(../img/rand/stadt.png); }
 .rand-wirtschaft .csc-header { background-color: #8a9199; background-image: url(../img/rand/wirtschaft.png); }
 .rand-leben .csc-header { background-color: #00b052; background-image: url(../img/rand/leben.png); }
 .rand-bildung .csc-header { background-color: #b52670; background-image: url(../img/rand/bildung.png); }
 .rand-gastro .csc-header { background-color: #f28000; background-image: url(../img/rand/gastronomie.png); }
 .rand-freizeit .csc-header { background-color: #00a39c; background-image: url(../img/rand/freizeit.png); }
 .rand-marktplatz .csc-header { background-color: #f7d417; background-image: url(../img/rand/marktplatz.png); }
 .rand-region .csc-header { background-color: #007336; background-image: url(../img/rand/region.png); }
 .rand-default .csc-header { background-color: #165788; background-image: url(../img/rand/default.png); }  

 /* definition des Fuß Bereiches */
 #fuss { clear: both; margin: 0px; padding: 40px 0px 15px 0px; background-color: #fff; text-align: left; width: 980px; max-width: 980px; }
 #fuss-li { float:left; }
 #fuss-re { float:right; }



}
