/* basic reset */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{  
  margin:0;
  padding:0;
} 
table{
  border-collapse:collapse;
  border-spacing:0;
} 
fieldset,img{
  border:0;
}
address,caption,cite,code,dfn,em,strong,th,var{
  font-style:normal;
  font-weight:normal;
}
ol,ul, dl, dt, dd{
  list-style:none;
}
caption,th{
  text-align:left;
} 
h1,h2,h3,h4,h5,h6{
  font-size:100%;
  font-weight:normal;
}
q:before,q:after{
  content:'';
} 
abbr,acronym{
  border:0;
}

/* common styles */

html{
  margin:     0;
  padding:    0;
  border:     0;
  height:     100%;
}

body{
  color:      #111;
  text-align: left;
  font-family:Arial, Helvetica, Verdana, sans-serif;
  background: #fff url(../images/backgrounds/start_001.jpg) repeat-y right 73px;
  font-size:  13px;
  line-height:140%;
  quotes:     "\201E" "\201C" "\201A" "\2018";
  width:      100%;
  height:     100%;
  min-width:  1003px;
  min-height: 635px;
}

ol{
  list-style-position:inside;
}

h1, h2, h3, h4, h5, h6{
  font-weight:bold;
}
  
a{
  text-decoration:none;
  outline:        0;
  color:          #333;
  cursor:         pointer;
}

a:hover{
  text-decoration:underline;
  color:          #000;
}

a:active{
  text-decoration:underline;
}

.clear_left{
  clear:left;
}

.clear_right{
  clear:right;
}

.clear_both{
  clear:both;
}

.nodisplay{
  display:none;
}

.center{
  text-align:center;
}

/* background-styles */

body.leitbild{ background: #fff url(../images/backgrounds/leit_001.jpg) repeat-y right 73px; }
body.qualitaet{ background: #fff url(../images/backgrounds/quali_001.jpg) repeat-y right 73px; }
body.geschichte{ background: #fff url(../images/backgrounds/geschichte_001.jpg) repeat-y right 73px; }
body.stellenangebote{ background: #fff url(../images/backgrounds/stellen_001.jpg) repeat-y right 73px; }
body.leistungstabelle{ background: #fff url(../images/backgrounds/hze_001.jpg) repeat-y right 73px; }
body.wohngruppenverbund{ background: #fff url(../images/backgrounds/pamp_001.jpg) repeat-y right 73px; }
body.haus-wustrower-strasse{ background: #fff url(../images/backgrounds/wusi_001.jpg) repeat-y right 73px; }
body.haus-singerstrasse{ background: #fff url(../images/backgrounds/singer_001.jpg) repeat-y right 73px; }
body.haus-charlottenburger-strasse{ background: #fff url(../images/backgrounds/charli_001.jpg) repeat-y right 73px; }
body.wg-intensivleistung{ background: #fff url(../images/backgrounds/intensiv_001.jpg) repeat-y right 73px; }
body.wg-regelleistung{ background: #fff url(../images/backgrounds/regel_001.jpg) repeat-y right 73px; }
body.wg-geringe-betreuungsdichte{ background: #fff url(../images/backgrounds/gebe_001.jpg) repeat-y right 73px; }
body.therapeutische-angebote{ background: #fff url(../images/backgrounds/twg_001.jpg) repeat-y right 73px; }
body.maeander{ background: #fff url(../images/backgrounds/mae_001.jpg) repeat-y right 73px; }
body.mobile{ background: #fff url(../images/backgrounds/mob_001.jpg) repeat-y right 73px; }
body.perle, body.familien-schaffen-es{ background: #fff url(../images/backgrounds/perle_001.jpg) repeat-y right 73px; }
body.flexible-hilfen{ background: #fff url(../images/backgrounds/flexhi_001.jpg) repeat-y right 73px; }
body.ambulante-hilfen, body.team{ background: #fff url(../images/backgrounds/ah_001.jpg) repeat-y right 73px; }
body.jugendwohngemeinschaft{ background: #fff url(../images/backgrounds/bjw_001.jpg) repeat-y right 73px; }
body.betreutes-einzelwohnen, body.regelangebot-mit-12-wochenstunden, body.intensivangebot-mit-15-wochenstunden, body.geringe-betreuung-mit-9-wochenstunden, body.geringste-betreuung-mit-6-wochenstunden{ background: #fff url(../images/backgrounds/bew_001.jpg) repeat-y right 73px; }
body.jugendgerichtshilfe{ background: #fff url(../images/backgrounds/jgg_001.jpg) repeat-y right 73px; }
body.cool-statt-knast{ background: #fff url(../images/backgrounds/cool_001.jpg) repeat-y right 73px; }
body.jugendberufshilfe{ background: #fff url(../images/backgrounds/jbh_001.jpg) repeat-y right 73px; }
body.schulsozialarbeit{ background: #fff url(../images/backgrounds/jbh_002.jpg) repeat-y right 73px; }
body.rathausschule{ background: #fff url(../images/backgrounds/jbh_007.jpg) repeat-y right 73px; }
body.philipp-reiss-schule{ background: #fff url(../images/backgrounds/jbh_008.jpg) repeat-y right 73px; }
body.sonnenuhr-grundschule{ background: #fff url(../images/backgrounds/jbh_009.jpg) repeat-y right 73px; }
body.berufsorientierung{ background: #fff url(../images/backgrounds/jbh_003.jpg) repeat-y right 73px; }
body.an-der-schule{ background: #fff url(../images/backgrounds/jbh_010.jpg) repeat-y right 73px; }
body.vbo-in-mitte{ background: #fff url(../images/backgrounds/jbh_018.jpg) repeat-y right 73px; }
body.imbilde-in-lichtenberg{ background: #fff url(../images/backgrounds/jbh_019.jpg) repeat-y right 73px; }
body.nach-der-schule{ background: #fff url(../images/backgrounds/jbh_011.jpg) repeat-y right 73px; }
body.mae-u25-in-lichtenberg{ background: #fff url(../images/backgrounds/jbh_020.jpg) repeat-y right 73px; }
body.abo-in-mitte{ background: #fff url(../images/backgrounds/jbh_021.jpg) repeat-y right 73px; }
body.fstj-in-mitte{ background: #fff url(../images/backgrounds/jbh_022.jpg) repeat-y right 73px; }
body.jam-in-mitte{ background: #fff url(../images/backgrounds/jbh_023.jpg) repeat-y right 73px; }
body.jobcoach-in-mitte{ background: #fff url(../images/backgrounds/jbh_024.jpg) repeat-y right 73px; }
body.beratung{ background: #fff url(../images/backgrounds/jbh_004.jpg) repeat-y right 73px; }
body.mentos-mitte{ background: #fff url(../images/backgrounds/jbh_012.jpg) repeat-y right 73px; }
body.jfe-willi-saenger{ background: #fff url(../images/backgrounds/jbh_013.jpg) repeat-y right 73px; }
body.ausbildung{ background: #fff url(../images/backgrounds/jbh_005.jpg) repeat-y right 73px; }
body.maler-und-lackierer{ background: #fff url(../images/backgrounds/jbh_014.jpg) repeat-y right 73px; }
body.bauten--und-objektbeschichter{ background: #fff url(../images/backgrounds/jbh_015.jpg) repeat-y right 73px; }
body.temporaere-projekte{ background: #fff url(../images/backgrounds/jbh_006.jpg) repeat-y right 73px; }
body.m-m{ background: #fff url(../images/backgrounds/jbh_016.jpg) repeat-y right 73px; }
body.soziale-stadt{ background: #fff url(../images/backgrounds/jbh_017.jpg) repeat-y right 73px; }
body.jugendfreizeiteinrichtungen{ background: #fff url(../images/backgrounds/jfe_001.jpg) repeat-y right 73px; }
body.willis{ background: #fff url(../images/backgrounds/jbh_013.jpg) repeat-y right 73px; }
body.spenden, body.direkt-online-spenden, body.einzugsermaechtigung, body.einzugsermaechtigung-fax-formular{ background: #fff url(../images/backgrounds/spenden_001.jpg) repeat-y right 73px; }
body.spendenprojekte-2010{ background: #fff url(../images/backgrounds/spenden_002.jpg) repeat-y right 73px; }
body.geldauflagen{ background: #fff url(../images/backgrounds/spenden_003.jpg) repeat-y right 73px; }

/* layout */

#header{
  position:     relative;
  padding:      37px 0px 0px 0px;
  margin:       0px;
  width:        100%;
  z-index:      150;
  background:   #fff;
  height:       36px;
  overflow:     hidden;
}

#header a{
  border-right: 431px solid #fff;
  display:      block;
  padding:      0px;
  text-indent:  -2800px;
  overflow:     hidden;
  background:   #fff url(../images/header_tagline.gif) no-repeat right top;
  float:        right;
  height:       36px;
  line-height:  100%;
  width:        609px;
}

#header span{
  display:block;
}

.logo{
  position:     absolute;
  top:          36px;
  right:        67px;
  line-height:  100%;
  padding:      0px;
  margin:       0px;
  height:       128px;
  width:        128px;
  background:   transparent url(../images/nwik_logo.gif) no-repeat 0 0;
  text-indent:  -800px;
  z-index:      200;
  overflow:     hidden;
}

#main{
  position:     relative;
  z-index:      20;
  border-right: 37px solid #fff;
}

body > #main{
  background: transparent url(../images/lines.png) 0 0;
}

#navigation{
  margin:     25px 7px 0px 0px;
  float:      right;
  position:   relative;
  height:     498px;
}

#navigation ul{
  margin:     0px 0px 7px 0px;
  padding:    20px 15px 0px 7px;
  background: #000;
  width:      176px;
}

.mainmenu{
  height: 152px;
}

#navigation li a{
  font-size:    14px;
  line-height:  20px;
  font-weight:  normal;
  color:        #fff;
}

#navigation li a:hover, #navigation li.selected a{
  color:            #ccc;
  text-decoration:  underline;
}

#navigation li a:hover{
  color: #fff;
}

#navigation li.spacer_menuitem{
  height:16px;
}

#navigation li.spacer_menuitem span{
  display:none;
}

#navigation .secondarymenu{
 padding:     0px;
 margin:      0px;
 width:       198px; 
 background:  none;
}

#navigation .secondarymenu li{
  padding:      0px 0px 7px 0px;
  line-height:  100%;
}

#navigation .secondarymenu li.highlight{
  padding: 0px;
}

#navigation .secondarymenu li a{
  background:   #000;
  padding:      12px 0px 12px 7px;
  line-height:  100%;
  display:      block;
}

#navigation .secondarymenu li.highlight a{
  background:   #f49e00;
}

#content{
  padding:    25px 30px 35px 0px;
  width:      765px;
  float:      right;
}

.submenu{
  background: #fff;
  width:      168px;
  padding:    20px 15px 20px 15px;
  float:      left;
  margin:     0px 7px 0px 0px;
  min-height: 132px;
}

.submenu a{
  display:      block;
  font-size:    14px;
  line-height:  18px;
  font-weight:  normal;
  color:        #999;
  padding:      0px 0px 3px 0px;
}

.submenu a:hover, .submenu li.selected a{
  color:            #000;
  text-decoration:  underline;
}

.submenu li.selected a{
  text-decoration:  none;
}

.submenu li.sub a{
  font-size:    11px;
  line-height:  140%;
  padding:      0px 0px 0px 10px;
}

.main_content{
  background: #fff;
  width:      487px;
  float:      left;
  margin:     0px 7px 40px 0px;
  padding:    20px 55px 0px 15px;
}

.with_submenu .main_content{
  width:      368px;
  padding:    20px 15px 0px 15px;
}

.leistungstabelle .with_submenu .main_content{
  width:      765px;
  padding:    0px;
  margin:     7px 7px 40px 0px;
  background: none;
} 

.additional_info{
  position:   relative;
  width:      198px;
  float:      left;
  height:     498px;
}

.additional_info .position_bottom{
  position: absolute;
  bottom:   0px;
  left:     0px;
}

.additional_info .position_bottom div{
  padding:    20px 15px 12px 15px;
  background: #fff;
  height:     152px;
  width:      168px;
}

.additional_info a{
  text-decoration:underline;
}

/* headlines */

#content h1, #content h2, #content h3, #content h5{
  font-size:      13px;
  text-transform: uppercase;
  font-weight:    normal;
}

#content h1, #content h5{
  padding-bottom: 18px;
}

#content .main_content h2{
  font-weight:    bold;
  padding-bottom: 6px;
}

#content .main_content h3{
  font-weight:  bold;
  color:        #F49E00;
}

#content .main_content h6{
  font-size:      12px;
  text-transform: uppercase;
  font-weight:    bold;
}

.leistungstabelle .with_submenu .main_content h1{
  display: none;
}

#content p{
  font-size:      12px;
  line-height:    18px;
  padding-bottom: 16px;
  font-weight:    normal;
}

#content p.legal_notice{
  font-size:      10px;
  line-height:    16px;
}

#content p.block{
  font-size:    11px;
  line-height:  17px;
}

#content p.block strong{
  font-size: 10px;
}

#content p img{
  float:    right;
  padding:  4px 0px 4px 4px;
}

#content p strong, #content .main_content strong{
  font-weight: bold;
}

#content .main_content a{
  color:        #F49E00;
  font-weight:  bold;
}

#content .main_content a.external, #content .main_content span.external a{
  color:        #666;
  font-weight:  normal;
}

#content .main_content img.screen{
  clear:  both;
  margin: 20px 0px 8px 0px;
}

#content .main_content img.screen.first{
  clear:  both;
  margin: 0px 0px 8px 0px;
}

.main_content ul{
  list-style-type:      disc;
  list-style-image:     url(../images/list_underscore.gif);
  list-style-position:  outside;
  margin-left:          40px;
  padding-bottom:       16px;
  font-size:            12px;
}

.main_content ul li{
  padding: 0px 0px 5px 0px;
}

.main_content ol{
  list-style-type:      decimal;
  list-style-position:  outside;
  margin-left:          30px;
  padding-bottom:       16px;
  font-size:            12px;
}

/* home */

.home #content .main_content{
  padding:  20px 35px 20px 15px;
  width:    507px;
}

.home #content .main_content h2, .home #content .main_content h3, .home #content .main_content h4, .home #content .main_content h5, .home #content .main_content h6{
  clear:  both;
  width:  360px;
}

.home #content .main_content h2, .home #content .main_content h3{
  font-size:  11px;
}

.home #content .main_content p{
  padding-bottom: 0px;
  width:          336px;
  clear:          left;
  float:          left;
}

.home #content .main_content img{
  float:    right;
  width:    144px;
  clear:    right;
  display:  block;
}

#content .main_content p.separator{
  display:      block;
  width:        336px;
  height:       1px;
  line-height:  100%;
  clear:        both;
  margin:       19px 0px 19px 0px;
  padding:      0px;
  background:   #afafaf;
  overflow:     hidden;
  text-indent:  -800px;
  border-right: 150px solid #fff;
}

#content.with_submenu .main_content p.separator{
  border-right: none;
}

/* einzugsermaechtigung */

body.einzugsermaechtigung #content form{
  font-size: 12px;
}

body.einzugsermaechtigung #content .main_content h6{
  padding:  16px 0px 4px 0px;
  clear:    both;
}

.einzugsermaechtigung_persoenlichedaten_zeile input, body.einzugsermaechtigung select, body.einzugsermaechtigung input.betrag{
  background:   #ddd;
  border:       none;
  line-height:  100%;
  padding:      2px;
}

#einzugsermaechtigung_ichhelfemit_betrag, #einzugsermaechtigung_ichhelfemit_wieoft{
  float:  left;
  width:  100px;
}

#einzugsermaechtigung_ichhelfemit_betrag label, #einzugsermaechtigung_ichhelfemit_wieoft label{
  display:  block;
  clear:    both;
  padding:  0px 0px 2px 0px;
}

.einzugsermaechtigung_persoenlichedaten_zeile label{
  background:   #FFF;
  display:      block;
  float:        left;
  line-height:  100%;
  padding:      3px 12px 3px 0px;
  height:       14px;
}

.einzugsermaechtigung_persoenlichedaten_zeile input{
  display:  block;
  float:    left;
  margin:   0;
  width:    auto;
}

.einzugsermaechtigung_persoenlichedaten_zeile{
  background: #DDD;
  clear:      both;
  float:      left;
  margin:     0px 0px 7px 0px;
  width:      100%;
  height:     18px;
  overflow:   hidden;
}

.einzugsermaechtigung_persoenlichedaten_zeile.error, .einzugsermaechtigung_persoenlichedaten_zeile.error input{
  background: #ffaaaa;
}

.einzugsermaechtigung_persoenlichedaten_zeile.no_background{
  background: #fff;
  height:     22px;
}

body.einzugsermaechtigung .legal{
  font-size:  11px;
  clear:      both;
  float:      left;
  display:    block;
  width:      200px;
}

#in_strasse, #in_postleitzahl{
  border-right:12px solid #fff;
}

.einzugsermaechtigung_submit{
  background:     #F49E00;
  border:         none;
  color:          #FFFFFF;
  font-size:      13px;
  font-weight:    bold;
  margin:         10px 0 15px 0px;
  padding:        4px;
  text-transform: uppercase;
}

/* quotes */

blockquote{
  padding:    0px 40px 16px 28px;
  background: transparent url(../images/quotes.gif) no-repeat 0 0;
  color:      #222;
  font-size:  12px;
}

blockquote em{
  font-style: italic;
  font-size:  11px;
}

/* tables */

table{
  background:       none;
  border-collapse:  collapse;
  border-spacing:   0px;
  border:           none;
}

tr.groups td, tr.groups td.label, th{
  background: #e5e5e5;
}

tbody > tr.groups td{
  background: transparent url(../images/table_groups.png) repeat 0 0;
}

tr.family_analog td, tr.family_analog td.label{
  background: #fbd4b4;
}

tbody > tr.family_analog td{
  background: transparent url(../images/table_family_analog.png) repeat 0 0;
}

tr.individual td, tr.individual td.label{
  background: #b6dde8;
}

tbody > tr.individual td{
  background: transparent url(../images/table_individual.png) repeat 0 0;
}

th, td{
  padding:        9px 9px 9px 9px;
  vertical-align: top;
  font-weight:    bold;
  font-size:      12px;
  border-right:   1px dashed #333;
}

th{
  width:  108px;
}

th.first_th{
  width:  90px;
}

td{
  font-size:    11px;
  border-top:   1px dashed #333;
}

td.label{
  font-size: 12px;
}

#content tr td.filled{
  background: #fff;
}

tr{
  min-height: 27px;
}

/* footer */

#footer{
  position:   relative;
  padding:    0 854px 0 0;
  float:      right;
  width:      146px;
}

#main > #footer{
  background: #000;
  bottom:     0;
  position:   fixed;
  right:      891px;
  padding:    0px;
  float:      none;
}

#footer a{
  display:        block;
  background:     #000;
  padding:        10px 10px 10px 10px;
  color:          #fff;
  font-size:      9px;
  text-transform: uppercase;
  float:          left;
}