/**@import url(http://fonts.googleapis.com/css?family=Oxygen|Tienne|Open+Sans:400,700);**/
/**Beispiel für Einbau von googleFonts mit mehreren Schriftschnitten**/
/**h1 { font-family: ‘Metrophobic’, Arial, serif; font-weight: 400; }**/

@import url(http://fonts.googleapis.com/css?family=Cabin:400,400italic,500,500italic,600,600italic,700,700italic);

body {
  margin: 0;
  padding: 0;
  border: 0;
  background-color: #416cb3;
  background-image: url(../../user_upload/otterbach/kita-otterbach/grafiken/page_back.png);
  background-repeat: repeat;
  background-position: left top;  
  font: normal 105% 'Cabin', Verdana, Arial, Helvetica, sans-serif;
}

#positionierung {
  background-color: #transparent;
  margin-top: 0px;
}

#kopf {
  background-image: url(../images/back_transparent.png);
  background-repeat: no-repeat;
  background-color: transparent;
  height: 346px;
  overflow: hidden;
  padding-bottom: 0px;
}

#kopf_sp1 {
  height: 100%;
  overflow: hidden;
  width: 980px;
  margin-top:0px;
  z-index: 1;
}

#kopfbild {
  padding: 0px 0 0 0px;
}

#kopf_sp2 {
  height: 100%;
  overflow: visible;
  width: 200px;
  position: relative;
  top: -330px;
  left: 20px;
  z-index: 2;
}

#logo {
  padding: 0 0;
}

#hauptnavigation {
  clear: both;
  float: none;
  margin-left: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0px 0 0 0px;
  height: 30px;
  width: 980px;
  background-color: #282828;
  border-bottom: 1px solid #282828;
  border-top: 1px solid #282828;
}

#tabsJ {margin-left:20px;}

#hauptnavigation ul li a {
  display: block;
  color: #fff;
  text-decoration: none;
  font: bold 95% Times, serif;
  border-right: 1px solid #fff;
  border-left: 0px;
  padding: 4px 20px 0 5px;
  height: 26px;
  /*margin: 0 10px 0 0;*/
  float: left;
}

#hauptnavigation ul li a:hover,
#hauptnavigation ul li a.aktiv
{
  position: relative;
  border-right: 1px solid #fff;
  margin-right: 2px;
  padding-right: 20px;
}

#hauptnavigation ul li a#first {
  border-color: #fff;
  background-color: #282828;
  color: #fff;
}

#hauptnavigation ul li a#first:hover,
#hauptnavigation ul li a#first.aktiv
{
  border-color: #fff;
  background-color: #282828;
  color: #fff;
  text-decoration: underline; 
}

#hauptnavigation ul li a#last {
  border-right: 0px solid #fff;
  border-color: #fff;
  background-color: #282828;
  color: #fff;
}

#hauptnavigation ul li a#last:hover,
#hauptnavigation ul li a#last.aktiv
{
  border-color: #fff;
  background-color: #282828;
  color: #fff;
  text-decoration: underline;  
}

#hauptnavigation ul li a#black {
  border-color: #fff;
  background-color: #282828;
  color: #fff;
}

#hauptnavigation ul li a#black:hover,
#hauptnavigation ul li a#black.aktiv
{
  border-color: #fff;
  background-color: #282828;
  color: #fff;
  text-decoration: underline;
}

#inhalte {
  overflow: auto;
  width:100%;
  background-color:#fff;
  background-image: url(../../images/hdf_hintergrund_inhalt.png);
  background-repeat: repeat-y;
  background-position: left top;
  padding-bottom: 0px;
}

#inhalte_sp1 {
  float: left;
  width: 270px;
  padding: 0 0 0 0px;
  margin: 20px 0 20px 0;
  overflow: hidden;
}

#inhalte_sp2 {
  float: right;
  width: 695px;
  padding: 0 15px 0 0px;
  overflow: hidden;
}

#content_oben {
  margin-left: 10px;
  min-height: 400px;  
}
.abstand {
    background-color: #fff;
    display: block;
    height: 38px;
    width: 270px;
}

/* Farben der Rubriken */

/* Kontextnavigation */

.kontextnavigation ul li a {
  display: block;
  background-image: url(../../images/pfeil_navi_grau.gif);
  background-repeat: no-repeat;
  background-position: 10px 11px;
  font-size: 80%;
  font-weight: bold;
  color: #474747;
  text-decoration: none;
  padding: 10px 0 10px 30px;
  border-bottom: 1px dotted #000;
}

.lila .kontextnavigation ul li a:hover,
.lila .kontextnavigation ul li a.aktiv
{
  background-image: url(../../images/pfeil_navi_schwarz.gif);
  background-color: #EEE;
  color: #000;
}


/* Ebene 3 Navi links */

.kontextnavigation ul li ul li ul {
border-bottom:0px solid #FFFFFF;
margin:0;
}

.kontextnavigation ul li ul li ul li a {
background-image:url(../../images/pfeil_schwarz.gif);
background-position:8px 9px;
background-repeat:no-repeat;
border-bottom:0 solid #FFFFFF;
font-size:80%;
font-weight:normal;
margin-left:32px;
padding:4px 0 4px 22px;
}

.gruen .kontextnavigation ul li ul li ul li a:hover, .gruen .kontextnavigation ul li ul li ul li a.aktiv,
.lila .kontextnavigation ul li ul li ul li a:hover, .lila .kontextnavigation ul li ul li ul li a.aktiv,
.rot .kontextnavigation ul li ul li ul li a:hover, .rot .kontextnavigation ul li ul li ul li a.aktiv,
.gelb .kontextnavigation ul li ul li ul li a:hover, .gelb .kontextnavigation ul li ul li ul li a.aktiv,
.blau .kontextnavigation ul li ul li ul li a:hover, .blau .kontextnavigation ul li ul li ul li a.aktiv,
.schwarz .kontextnavigation ul li ul li ul li a:hover, .schwarz .kontextnavigation ul li ul li ul li a.aktiv,
.grau .kontextnavigation ul li ul li ul li a:hover, .grau .kontextnavigation ul li ul li ul li a.aktiv {
background-image:url(../../images/pfeil_schwarz.gif);
background-position:8px 9px;
background-repeat:no-repeat;
}


.tx-t3scontent-pi1 {
    width:635px!important;
    padding: 0px!important;
  margin-bottom:20px;
}
.tx-t3scontent-pi1 a {font-weight:bold; }
.tx-t3scontent-pi1-tab ul li a {font-weight:bold; font-size: 85%; font: Georgia, "Times New Roman", Times, serif;}
.tx-t3scontent-pi1 h3 {
  font:1em Georgia, "Times New Roman", Times, serif!important;
  font-weight:bold; 
  line-height:100%!important;
  display:block!important;
  padding-bottom:0px!important;
  color: #000000!important;
  text-transform:none!important;
  letter-spacing:normal!important;
}
.tx-t3scontent-pi1 p { 
  font-size: 75%;
  line-height: 140%;
  margin: 0.5em 0 0 0;}

.tx-t3scontent-pi1 .csc-header .csc-header-n1 {display:none;}

#block {
  border-bottom: 2px solid #ffffff; 
  background: transparent;
  margin-bottom: 10px;
}
#block h1 {
  height: 20px;
  font-size:1em;
  background:transparent;
  color:#840000;
  border:0px;
  padding: 0 10px;
  margin-top: 5px;
  margin-bottom: 0px;
}
#blocktext {
  border-top: 0px solid #d4ebf8;
  padding-top:0px;
}
#blocktext p {
  font-size: 0.8em;
  line-height: 1.3em;
  padding: 0 10px 0px 10px;
}

.teaserspalte h1 {
  height: 20px;
  font-size:1em;
  background:transparent;
  color:#840000;
  border:0px;
  margin:0.2em 0 0 0; 
  padding: 0 10px;
  }

.teaserspalte h2 {
  height: 20px;
  font-size:1em;
  background:transparent;
  color:#000000;
  border:0px;
  margin:0.2em 0 0 0; 
  padding: 0 25px;
  }

.teaserspalte p {
  font-size: 0.8em;
  line-height: 1.3em;
  padding: 0 10px 0 10px;
}
  
#inhalte_sp2 h1, h2, h3, h4, h5, h6 {
  color:#1E65B4;
}

#inhalte_sp2 h1 {
font-size:115%;
}

#inhalte_sp2 h2 {
font-size:1.1em;
}

#inhalte_sp2 h3 {
font-size:1em;
font-weight:bold;
}

#inhalte_sp2 h4 {
font-size:0.9em;
}

#inhalte_sp2 h5 {
font-size:0.8em;
}

#inhalte_sp2 h6 {
font-size:0.7em;
}

#inhalte_sp2 p {
font-size:1em;
}

#inhalte_sp2 ul {
    font-size: 1em;
	line-height:1.8em;
}

#inhalte_sp2 ul li ul {
    font-size: 1em;
}

#inhalte_sp2 ol {
    font-size: 1em;
}

.content_sp1 {
  width: 410px;
  float: left;
  margin-right: 10px;
  margin-bottom: 0px;
  overflow: hidden;
}

.content_sp2 {
  float: right;
  overflow: hidden;
  width: 200px;
}

.copytext {
  font-size: 100%;
  line-height: 1.1em;
  margin: 1em 0 0 0;
}

.teaserspalte table.contenttable {
    background-color: #ffffff;
    border: 0 none;
    border-collapse: collapse;
    margin: 0 0px;
    padding: 0;
}

.teaserspalte table.contenttable td {
    border: 0px solid #FFFFFF;
    padding: 0px 0px;
	vertical-align: middle;
}

.teaserspalte table.contenttable p {
    font-size: 1em;
    line-height: 1.3em;
    padding: 0;
}

.teaserspalte table.contenttable h2 {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    color: #000000;
    font-size: 1.2em;
    height: 10px;
    margin: 0em 0 0;
    padding: 0 0px;
}

.align-center {text-align:center;}

.csc-textpic-caption {
  font-size:70%;
}
/* ##########################
** ### TYPO3 Mailformular ###
** ##########################
*/
.csc-mailform-field label {display:block; font-size:1em; margin-top:1em; min-width:150px;}
.csc-mailform-radio label {display:inline; margin-left:0.3em;}
.csc-mailform-radio legend {display:none;}
.csc-mailform-submit {margin-top:1em;}

legend {
padding-left:10px;
padding-right:10px;
border: 0px;
}

fieldset {
border:0px;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:10px;
border: 1px solid #C0C0C0;
}

.radiolayout {
width:60%;
padding-top:15px;
padding-bottom:15px;
}

.formu {
width:80%;
padding-top:10px;
padding-bottom:10px;
padding-left:110px;
border: 1px solid #C0C0C0;
}

.mf-radio {
border:0px;
}

.mf-text {
color: #000000;
border: 1px solid #C0C0C0;
margin-bottom: 5px;
}

.mf-check {
border: 0px;
}
.mf-select {
border:0px;
}

.mf-input {
border: 1px solid #C0C0C0;
margin-bottom: 5px;
}

.mf-submit {
color: #ffffff;
background-color: #C0C0C0;
border: 0px;
}

/* #############################
** ### tt_news #################
** #############################
*/
.tx-ttnews-browsebox {text-align:center; padding:0; margin:1.2em 0 1em 0; padding:1px; border:1px solid #ccd; background:#f0f0f4;}
.tx-ttnews-browsebox a, .tx-ttnews-browsebox strong {padding:0 0.4em 0.4em 0; margin:0; background:transparent;}

/* LATEST Ansicht */
.news-latest-container {margin-top:0px;padding:0px;}
.news-latest-item {margin-bottom:0em;}
.news-latest-item h2 {font-size:1em; padding-top:0px;margin:0px;}
.news-latest-item a {font-size:0.8em; color:#840000; text-decoration:underline;}
.news-latest-item a:hover {background:transparent;}
.news-latest-item img {padding-right:1em; padding-top:0.5em; float:left;}
.news-latest-morelink {padding:1px; padding-left: 5px; border:1px solid #ccd; background:#f0f0f4; text-align:center;}
.news-latest-morelink a {color:#840000;}

/* LIST Ansicht */
.news-list-item {margin-bottom:0.5em;}
.news-list-item h2 {padding-top:0;}
.news-list-item h2 a {color:#840000; text-decoration:underline;}
.news-list-item h2 a:hover {background:transparent;}
.news-list-item h2 span.news-list-date {color:#aaa; font-weight:normal;}
.news-list-morelink {padding:1px; padding-left: 5px; border:0px solid #ccd; text-align:left;}
.news-list-morelink a {color:#840000;}
.news-list-morelink a:hover {background:transparent;}
.news-list-category {color:#aaa;}

/* SINGLE Ansicht */
.news-single-item h1 {font-size:1em;}
.news-single-item h2 {font-size:0.9em; font-style:italic;}
.news-single-item h3 {margin-bottom:1em; margin-top:1em; color:#000; padding:0.5em; background:#f0f0f4; border-left:8px #E0E7F5 solid;}
.news-single-img {padding-right:15px;  float:left;}
.news-single-img p {padding:0; margin:0;}
.news-single-timedata {font-size:0.8em; color:#aaa; margin-bottom:1em;}
.news-single-additional-info {}
.news-single-additional-info dd {margin-top:-1em;}
.news-single-additional-info dt {margin-bottom:1.4em; color:#aaa;}

/* CATEGORY Menu */
.news-catmenu {font-size:0.8em; margin-top:2em; padding:1em; background:#eee; border:1px dotted black;}
.news-catmenu a {display:inline; padding-left:2px;}
.news-catmenu a:hover {background:transparent; font-style:italic; font-weight:bold;}
.news-catmenu .news-catmenu-NO {height:16px;}
p.news-catmenu-header {line-height:1em; margin:0;}



/*-----------------------------------  clearer  -----------------------------------*/
/* prevent floated images from overlapping the div-containers they are wrapped in  */

.news-latest-container HR.clearer
{
  clear:left;
  height:1px;
  border:none;
  padding:0;
  margin:0;
}
.news-list-container HR.clearer,
.news-list2-container HR.clearer,
.news-list3-container HR.clearer,
.news-single-item HR.cl-left,
.news-single-item HR.cl-right
 {
  clear:right;
  height:1px;
  border:none;
  padding:0;
  margin:0;
}
.news-list2-container HR.clearer,
.news-list3-container HR.clearer {
  clear:both;
}

.news-single-item HR.cl-left {
  clear:left;
}

/* Fusszeile */
/*******************************************/

#fusszeile {
  float: none;
  clear: both;
  text-align: right;
  font-size: 85%;
  padding-top: 5px;
  padding-right:2px;
  overflow: hidden;
  height: 35px;
}

#fusszeile {
  background-image: url(../../images/hdf_footer_bg.png);
  background-repeat: no-repeat;
  background-position: -2px top;
}

#fusszeile a {
  color: #000;
  text-decoration: none;
  padding: 0 3px 0 3px;
}

#fusszeile a:hover {
  text-decoration: underline;
}