/*
Templatenummer: AA009
Dieses Template wurde extra für die Freiwillige Feuerwehr Kell modifiziert.
Verfasser des Stylesheets: Matthias Schmitz
*/



/* Basic Definition */

html {
/*  Scrollleisten nur für den Internetexplorer PC   */
scrollbar-arrow-color: #FFFFFF;/*Farbe der Pfeile*/	;
scrollbar-base-color: #BDAC9A; /*Heller Reflex am linken und oberen Rand*/;
scrollbar-track-color: #CCBEAE;/*Farbe der "Bahn" in der sich der Scrollschieber bewegt*/;
scrollbar-face-color: #FF0000; /*Eigentliche Farbe des Schiebers*/;
scrollbar-highlight-color: #E8DDD3;/*Eigentliche Farbe des Schiebers*/;
scrollbar-shadow-color: #212117; /*Schattenfarbe um Relief darzustellen*/;
}



body        {
font-family: Arial, Helvetica, SunSans-Regular, sans-serif;
background-color: #dadada;
margin: 0;
padding: 0
}


.clear /*  wird bentigt um die ineinandergeschachtelten div Tags wieder aufzuheben  */{ 
clear: both; 
line-height: 0; 
font-size: 0; 
height: 0; 
}
/* ###################################################################### */ 
/* ###########################  Gesamtrahmen  ########################### */ 
/* ###################################################################### */ 
#BORDER   { background-image: url(resources/BORDER.gif); background-repeat: repeat-y; width: 800px }



/* ###################################################################### */ 
/* ########################  Gestaltungsrahmen  ######################### */ 
/* ###################################################################### */ 
#HEADERSTART   {
top: 0;
width: 800px;
height: 200px;
overflow: hidden
}

#HEADER  { background-image: url(resources/HEADER.gif); width: 835px }


#HEADEREND   { background-image: url(resources/HEADEREND.gif); width: 800px; height: 15px; overflow: hidden }


/* ###################################################################### */ 
/* ###########################  Fussbereich  ############################ */ 
/* ###################################################################### */
#FOOTER         {
text-align: left;
width: 800px
}

.footercontent   {
width: 800px;
overflow: hidden
}

.footermenu   {
color: #e8ddd3;
font-size: 10px;
width: 800px;
overflow: hidden
}

.footermenu a:link {
color: #e8ddd3;
text-decoration: none
}

.footermenu a:visited {
color: #e8ddd3;
text-decoration: none
}

.footermenu a:hover {
color: white;
text-decoration: underline
}
/* ###################################################################### */ 
/* #########################  Inhaltsbausteine  ######################### */ 
/* ###################################################################### */ 


/* -------------------  Promotion / Animationsbereich  ------------------ */ 
.promotion   { background-image: url(resources/promotion.gif); background-repeat: no-repeat; width: 700px; height: 100px; float: left; overflow: hidden }


.promotion h1 {
font-size: 15px;
font-weight: bold;
text-align: left;
text-transform: uppercase;
padding-top: 40px;
padding-left: 20px;
}


/* ---------------  Einbindung des Logos als Hintergrund  -------------- */ 
.logo   { background-image: url(resources/logo.gif); width: 100px; height: 100px; float: left }

.logo a   { background-image: url(resources/logo.gif); display: block; width: 100px; height: 100px }


/* ------------------------------  Zusatzmen  -------------------------- */ 
.additionalmenu    {
background-image: url(resources/additionalmenu.gif);
background-repeat: no-repeat;
text-align: left;
width: 790px;
height: 18px;
float: left;
overflow: hidden
}


/* ---------------------------  Hauptnavigation  ----------------------- */ 
.mainmenu  {
background-color: #f00;
text-align: left;
width: 790px;
height: 36px;
float: left;
overflow: hidden;
text-decoration: none;
}

.mainmenu1-norm a   {
color: white;
display: block;
font-size: 11px;
float: left;
width: 129px;
text-align: center;
margin-top: 8px;
margin-bottom: 3px;
padding-bottom: 2px;
border-style: solid;
border-width: 1px;
border-color: #ff5a5a #8c0000 #8c0000 #ff5a5a
}

.mainmenu1-norm a:hover    {
color: #FF0000;
text-decoration: none;
background-color: #FFFFFF;
}

.mainmenu1-act a    {
color: FF0000;
display: block;
font-size: 11px;
float: left;
width: 129px;
text-align: center;
margin-top: 8px;
margin-bottom: 3px;
padding-bottom: 2px;
border-style: solid;
border-width: 1px;
border-color: #ff5a5a #8c0000 #8c0000 #ff5a5a;
background-color: #FFFFFF;
}

.mainmenu1-act a:hover    {
color: #FF0000;
text-decoration: none;
background-color: #FFFFFF;
}





/* ----------------------  Optionale Unternavigation  ------------------ */ 
.submenu     {
background-color: #f00;
text-align: left;
width: 790px;
height: 46px;
float: left;
text-decoration: none;
}


.submenu1-norm a   {
color: white;
font-size: 10px;
float: left;
text-align: center;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 10px;
margin-right: 10px;
padding-bottom: 0px;
text-decoration: none;
}

.submenu1-norm a:hover    {
color: #FF0000;
text-decoration: none;
background-color: #FFFFFF;
text-decoration: none;
}

.submenu1-act a    {
color: white;
font-weight: bold;
font-size: 10px;
float: left;
text-align: center;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 10px;
margin-right: 10px;
padding-bottom: 0px;
text-decoration: none;
}

.submenu1-act a:hover    {
color: white;
text-decoration: none;
background-color: #FFFFFF;
}




/* ----------  Optionale Contentspalte (3spaltiger Auftritt)  ---------- */ 
.subcontent {
}




/* -------------------  Brotkrummenpfad / Seitenpfad  ----------------- */ 
.sitepath  {
color: #7c6752 !important;
font-size: 9px;
text-align: left;
padding-left: 20px;
width: 235px;
height: 20px;
float: left;
overflow: hidden
}

.sitepath a:link  {
color: #7c6752 !important;
text-decoration: none
}

.sitepath a:hover {
color: white !important;
text-decoration: none;
}

.sitepath a:visited  {
color: #7c6752 !important;
text-decoration: none
}

/* ------------------------  Eigentlicher Inhalt  ---------------------- */ 

.content  {
color: black;
text-align: left;
margin-left: 8px;
width: 770px;
float: left
}

.contentend  {
text-align: left;
width: 20px;
height: 50px;
float: left
}


.contentstart  {
text-align: left;
width: 20px;
height: 50px;
float: left
}

.content a:link {
color: black;
font-weight: 700;
text-decoration: none;
}

.content a:hover  {
color: #FF0000;
font-weight: 700;
text-decoration: underline;
}

.content a:visited {
color: black;
font-weight: 700;
text-decoration: none;
}

.content ul  {
color: #787878;
font-size: 12px;
line-height: 18px;
padding-left: 330px;
margin: 0 0 0 20px;
}

.content li   {
font-size: 12px;
line-height: 20px;
list-style-image: url(resources/bullet.gif)
}


.content h1   {
color: #FF0000;
font-size: 20px;
font-weight: 700;
margin: 0;
padding: 0 0 0 330px
}

.content h2   {
color: #FF0000;
font-size: 15px;
font-style: italic;
font-weight: 400;
text-decoration: none;
margin: 0;
padding: 0 0 0 330px
}

.content h3 {
color: black;
font-size: 11px;
font-weight: 700;
text-decoration: none;
margin: 0;
padding: 0 0 0 330px
}

/*Bilduntertitel*/
.content small {
font-size: 10px;
color: #787878;
}


.content p   {
color: #787878;
font-size: 12px;
line-height: 18px;
padding-left: 330px;
}

.content .csc-mailform {
float: left;
border: #FF0000 solid 1px;
text-align: right;
margin-left: 330px;
width: 410px;
background-color: #FEFEFE;
}


.csc-form-label-req {
vertical-align: top;
text-align: left;
padding: 0px;
margin: 0px;
}

.csc-form-label {
vertical-align: top;
text-align: left;
padding: 0px;
margin: 0px;
}

/*wichtig bei Bildern links neben Text, da der Text dann in der Tabelle erscheint*/
.content td p {
padding-left:0px;
}

.content td h1 {
padding: 0px
}

.content td h2 {
padding: 0px;
}

.content td h3 {
padding: 0px
}


.tr-odd  {
background-color: #dcdcdc;
color: #363636;
}

.tr-even {
background-color: #dcdcdc;
color: #363636;
}

.tr-0 {
background-color: #ff0000;
color: #FFFFFF;
}

.content tr  {
padding: 5px 5px 5px 0;
border-bottom: 1px dotted white;
}

.content td  {
font-size: 12px;
line-height: 18px;
vertical-align: top;
}



.content input {
width: 100%;
font-size: 11px;
color: #000000;
font-family: Arial, Helvetica, SunSans-Regular, sans-serif;
background-color: #FFFFFF;
}

.content textarea {
width: 100%;
font-family: Arial, Helvetica, SunSans-Regular, sans-serif;
font-size: 11px;
color: #000000;
background-color: #FFFFFF;
}


.address {
margin-right: 20px;
float: left;
}

.trenner  {
background-image: url(resources/trenner.gif);
background-repeat: no-repeat;
width: 760px;
height: 30px;
}

.news  {
width: 100%;
float: left;
padding-bottom: 10px;
}

.news small {
color: #dcdcdc;
font-size: 9px;
}





.newsbild  {
margin-right: 10px;
width: 320px;
float: left;
padding-bottom: 10 px;
}

.news-single-img  {
margin-right: 10px;
width: 120px;
float: left;
}

.newslink {
color: black;
font-size: 10px;
text-decoration: none;
text-align: right;
width: 97%;
height: 20px;
border-bottom: 1px dotted white;
}

.newslink a:link {
color: black;
text-decoration: none;
}

.newslink a:hover {
color: #FF0000;
text-decoration: none;
}

.newstext   {
}

.newstext p {
padding: 0px;
}



/* -------------------  Definition der Highlightbereiche  ----------------- */ 
.highlight      {
width: 790px;
float: left
}

.highlightstart       { background-image: url(resources/highlightstart.gif); background-repeat: no-repeat; margin: 0; padding: 0; width: 226px; height: 10px; float: left; overflow: hidden }

.highlightcontent        { background-image: url(resources/highlightcontent.gif); background-repeat: repeat-y; text-align: left; margin: 0; padding: 0; width: 226px; float: left }

.highlightcontent h1     {
color: black;
font-size: 10px;
font-weight: 700;
text-decoration: none;
padding-right: 10px;
padding-left: 10px
}

.highlightcontent p    { color: gray; font-size: 10px; padding-right: 10px; padding-left: 10px }
.highlightcontent a:link { color: #5c5959; font-weight: 700; text-decoration: none }
.highlightcontent a:visited { color: #5c5959; font-weight: 700; text-decoration: none }
.highlightcontent a:hover { color: black; font-weight: 700; text-decoration: underline }
.highlightend       { background-image: url(resources/highlightend.gif); background-repeat: no-repeat; margin: 0 0 10px; padding: 0; width: 226px; height: 12px; float: left }


/* ------------------------  verhindert die ineinderverschachtelung der Contentelemente  ---------------------- */ 

.contentelement   {
float: left;
overflow:hidden;
width: 97%;
}

/* ------------------------  Typo3 CSS Definitionen  ---------------------- */ 
.csc-frame-frame1  {
width: 300px;
}
