/************************************
*	Neues Layout fuer Ruethen.de     *
*  CSS - Nils Decker                *
*	Erstellt am 22.04.2010           *
*************************************/


html, body, table, td, th, ul, ol, p {
	margin:		0;
	padding:	   0;
	border:		0;
	text-align: left;
	
}

a { 
    color: #4d860e; 
    font-weight: bold;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.topnav_short a {
    font-weight: normal;
}

.topnav_short a:hover {
    text-decoration: underline;
}

h1{
   font-family: Arial;
   font-size: 18px;
   text-align: left;
   color: #333;
}

h1.csc-firstHeader {
    margin-top: 0px;
    padding-top: 0px;
}

body {
	width:      100%;
	height:     100%;
	text-align: center;
   font-family: Arial;
   font-size:  14px;
   background: url('images/back.png') repeat-x #E4E4E4;
}

div.outer_frame{
	overflow:   hidden;
	margin:     auto;
	/*margin-top: 20px;*/
	width:      960px;
   background-color: #FFF;

}

p {
   text-align: left;
}

p.bodytext  { margin-bottom: 15px; }

ul {
   text-align: left;
   font-size: 12px;
   padding-left: 30px;
}

ul#top_nav_1 { padding-left: 0px; }

div.csc-textpic div.csc-textpic-imagewrap dl.csc-textpic-image {
   float:left;
   text-align: left;
}

dd.csc-textpic-caption { font-size: 11px; }


/************************************************
/* Header and menus 
/************************************************/
div.header{
	width:	100%;
	height: 223px;
	overflow: hidden;
   margin-bottom: 7px;
	background: url(images/head_banner.jpg) no-repeat top left;
}


div.homelink a {
   display: block; 
   position: absolute;
   width: 320px;
   height: 85px;
}


span.top_nav { position: absolute; top: -1500px; left: -1500px; }

div.topnav_short{
   padding-left:  100px;
   padding-top:   14px;
   padding-right: 100px;
   font-family: Verdana;
   font-size: 13px;
   height:  74px; 
   float:   right;
}
div.topnav_short a{
   color: #000000;
   text-decoration: none;
}

div.topnav_main{ 
   height:  135px;
   float:   left;
   width: 100%;
}

div.menu_left a {
   color: #000000;
   text-decoration: none;
}
div.menu_left a:hover{ text-decoration: underline; } 

div.menu_left{
	width:         199px;
	float:         left;
   font-size:     14px;
}

div.menu_left ul { padding-left: 0px; }

div.menu_left ul{
   margin-top: -8px;
   text-align: left;
   list-style: none;
   background-color: #dddddd;
   display: block;
   font-size: 13px;
}

*+html div.menu_left ul { margin-top: -18px; }
*+html div.menu_left li { display: inline; }


div.sw_logo a {
   display: block;
   margin-top: 20px;
   width:   199px;
   height: 54px; 
   background-repeat: no-repeat;
   background-image: url('images/logo_suedwestfalen.gif');
   background-position: center center;
   background-color: #FFF;
}

div.stadtwerke_logo a {
   display: block;
   margin-top: 10px;
   width:   199px;
   height: 77px;
   background-repeat: no-repeat;
   background-image: url('images/SWR-Logo_180.jpg');
   background-position: center center;
   background-color: #FFF;
}



/**********************/
/* Hauptmenuestruktur */
/**********************/
ul li span.bottom_line a {
        padding-top: 0px;
        display: block;
        width: 181px;
        padding-left: 18px;
        padding-bottom: 3px;
}

ul li span.bottom_line_active a {
        padding-top: 0px;
        display: block;
        width: 181px;
        padding-left: 18px;
        padding-bottom: 3px;
}


ul li ul li span.bottom_line_active a {
        padding-top: 0px;
        display: block;
        width: 165px;
        padding-left: 34px;
        padding-bottom: 3px;
}

ul#left_nav_2 { margin-top: 5px; }

ul li.active span.bottom_line_active a   {
   background-color: #FFF;
   /*text-decoration: underline;*/
}

ul li ul li span.bottom_line a {
        display: block;
        width: 164px;
        padding-bottom: 0px;
        padding-top: 0px;
        padding-bottom: 3px;
        padding-left: 34px;
}

ul li ul li.active a{
      background-color: #FFF;
      text-decoration: underline;
}


div.menu_left  h1 {
   font-family: verdana;
   display:    block;
   margin-top: 0;
   text-align: left;
   padding-left: 10px;
   height:     22px;
   font-size:  14px;
   line-height: 20px;
   color:      #FFFFFF;
   background: url('images/menu_header1.jpg') repeat-x;
}


div.volume{background-color: #E9E9E9; text-align: left;}

div#module-weather{
   margin-top: 10px;
}

div#weather{
    background: url('images/menu_header1.jpg') repeat-x;
    display:    block;
    text-align: left;
    padding-left: 10px;
    margin-top: 0;
    height:     22px;
    font-size:  14px;
    line-height: 20px;
    font-weight: bold;
    color:      #FFFFFF;
}

div#plan{
    background: url('images/menu_header1.jpg') repeat-x;
    display:    block;
    text-align: left;
    padding-left: 10px;
    margin-top: 0;
    height:     22px;
    font-size:  14px;
    line-height: 20px;
    font-weight: bold;
    color:      #FFFFFF;
}

div#sw_logobox{
    background: url('images/menu_header1.jpg') repeat-x;
    display:    block;
    text-align: left;
    padding-left: 10px;
    margin-top: 0;
    height:     22px;
    font-size:  14px;
    line-height: 20px;
    font-weight: bold;
    color:      #FFFFFF;
}
                                        
div#stadtwerke_logobox{
    background: url('images/menu_header1.jpg') repeat-x;
    display:    block;
    text-align: left;
    padding-left: 10px;
    margin-top: 0;
    height:     22px;
    font-size:  14px;
    line-height: 20px;
    font-weight: bold;
    font-family: Verdana;
    color:      #FFFFFF;
}




div#sw_logobox { color: #FFFFFF; font-family: Verdana; }
div#plan { color: #FFFFFF; font-family: Verdana; }
div#weather a{ color: #FFFFFF; font-family: Verdana; }

div.menu_right{
	width:   160px;
	float:   left;
}

/************************************************
/* Content
/************************************************/

div.content_wrapper{
   width:   100%;
   background-color: #FFF;
}
   

div.content_center{
   background-color: #FFF;
	width:   580px;
	float:   left;
   margin-left: 10px;
   margin-right: 11px;
}

div.content_content {
   background-color: #FFF;
   padding-left: 20px;
   font-size: 12px;
   padding-top: 20px;
}

.content_content ol {
    margin-left: 2em;
    margin-bottom: 1em;
}

.content_content ul {
    margin-bottom: 1em;
}

div.left_content  h1 {
   display:    block;
   height:     22px;
   font-size:  15px;
   color:      #FFFFFF;
   background: url('images/menu_header1.jpg') repeat-x;
}

div.left_content{
   background-color: #e9e9e9;
   margin-bottom: 10px;
}


div.right_content{
   background-color: #E9E9E9;
   margin-bottom: 10px;
}

div.menu_right h1 {
   display:    block;
   margin-top: 0;
   height:     22px;
   font-size:  14px;
   line-height: 20px;
   font-family: verdana;
   color:      #FFFFFF;
   background: url('images/menu_header1.jpg') repeat-x;
   padding-left: 10px;
}

div#aktuelles_head {
   clear: both;
   margin-bottom: -10px;
}

div.content_header {
   background: url('images/menu_header1.jpg') repeat-x;
   height: 22px;
   text-align: left;
   padding-left: 10px;
   color: #FFFFFF;
   line-height: 20px;
   font-size: 10px;
   font-family: verdana;
   font-weight: bold;
}
div.content_header a{
   color: #FFFFFF;
   text-decoration: none;
}

input#form_search_box {
   width: 100px;
  margin-top: 3px;
   margin-bottom: 10px;
   margin-left: 15px;
   border: 1px solid;
}
input#form_search_icon{
   float: right;
   margin-right: 10px; 
}
   
div.volume table { width: 560px !important; }

div.volume table.contenttable td {
   border-top:1px solid gray;
   padding:0 5px;
   vertical-align:top;
}

.tb10 {
   margin-top:       10px;
   margin-bottom:    20px; 
}

.t50 { margin-top:   50px; }
.r10 { margin-right: 10px; }
.r15 { margin-right: 15px; }
.r20 { margin-right: 20px; }
.l10 { margin-left:  10px; }

.w100 { width:       100px; }
.w150 { width:       150px; }
.w260 { width:       260px; }
.w440 { width:       420px; }

/************************************************
/* Footer 
/************************************************/

div.footer{
   margin-top: 30px;
   width:   100%;
   height: 22px;
   float:   left;
   line-height: 23px;
   color:   #FFFFFF;
   font-size: 15px;
   background: url('images/menu_header1.jpg') repeat-x;
}

div.footer a {
   color: #FFFFFF;
}

div.footer_left {
   float: left;
   width: 47%;
   text-align: left;
   padding-left: 15px;
}

div.footer_right {
   float: right;
   width: 47%;
   text-align: right;
   padding-right: 15px;
}


/************************************************
/* Horizontal Top menu graphics 
/************************************************/
a#li1 {background: url('images/topnav_1.jpg') no-repeat;}
a#li2 {background: url('images/topnav_2.jpg')  no-repeat;}
a#li3 {background: url('images/topnav_3.jpg')  no-repeat;}
a#li4 {background: url('images/topnav_4.jpg')  no-repeat;}
a#li5 {background: url('images/topnav_5.jpg')  no-repeat;}
a#li6 {background: url('images/topnav_6.jpg')  no-repeat;}
a#li7 {background: url('images/topnav_7.jpg')  no-repeat;}

a#li7 { width: 145px; }

a.top_nav {
	display: block;
	width: 134px;
	height: 135px;
	text-decoration: underline;
}

ul#top_nav_1 li {
   overflow: hidden;
	float: left;
	list-style: none;
	padding-right: 4px;
	width: 133px;
	height: 135px;
}

ul#top_nav_1 li.topnav_last {
	padding-right: 	0;
   width: 138px;
}

/************************************************
/* END Top Menu
/************************************************/

/************************************************
/* News Formatierung
/************************************************ */

.clear {
    overflow:hidden;
    padding-bottom:6px;
    width:100%;
}

.news-single-img {
    float: left;
    margin-right: 15px;
}

.news-single-item {
    padding-top: 20px;
}

.news-single-timedata {
    
}

.clearer {
    clear: both;
    padding-top: 20px;
    border: none;
    border-bottom: 1px solid grey;
}

.clearfix:after {
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;}

.clearfix { display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

/*
.module {
   font-family:Arial,Helvetica,sanf-sarif;
   margin-top:5px;
   display:block;
   border-bottom:2px solid #B22222;
   border-top:2px solid #B22222;}

*/
/*
.module-spacer {
   border-top:1px solid gray;
   margin-top:5px;}
*/
/*
.module-headline {
   font-size:80%;
   padding:0 10px;
   height:1.7em;
   line-height:1.5em;
   background-color:#F08080;}
*/
div.volume .element {
   display:block;
   width:100%;
   margin-top:15px;}

div.volume .line { border-top:1px solid gray; }

div.volume .element .image {
   width:125px;
   float:left;}

div.volume .element .rechts .preis { float:left; }

div.volume .element .rechts .box { float:right; }

div.volume .teaser {
   margin-bottom:15px;
   width:525px;}

   div.volume .teaser .teaser_img { width:120px; }

   div.volume .teaser .teaser_txt { width:390px; }

div.volume .sm_01_item {
   margin-top:15px;
   border-bottom:1px solid gray;}

div.volume .sm_02_item { margin-left:  50px; }
div.volume .sm_03_item { margin-left:  100px; }
div.volume .latest_item { padding:     10px 10px 15px 10px; }

   div.volume .latest_item .latest_title {
      font-size: 12px;
      line-height:1.5em;}

   div.volume .latest_item .latest_date {
      font-size:75%;
      text-align:right;}

   div.volume .latest_item .latest_subheader {
      font-size:70%;}

   div.volume .latest_item .latest_more {
      font-size:70%;}

   div.volume .list_item { display:block; }

   div.volume .list_item .list_image{ width:120px; }

   div.volume .list_item .list_subheader {
      text-align:left;
      width:390px;}

div.volume .list_item p { margin:0; }

div.volume .single_item {
   display:block;
   margin-bottom:10px;}

/* html>body div.volume .single_item {
   margin-top:20px;} */

   div.volume .single_item .single_title { width:430px; }

   div.volume .single_item .single_date {  
      text-align:right;
      width:      80px;}

   div.volume .single_item .single_image { margin:0 15px 10px 0; }

/* div.volume img {
   border:1px solid gray;} */

div.volume #mailform label {
   width:210px;
   float:left;}

.links {
   float:left;
   margin-right:10px;}

.rechts { float:right; }

/*******************/
/* Content Bereich */
/*******************/

divdiv.volume { background-color: #FFF; }

.teaser .element {
	display:block;
	width:100%;
	margin-top:15px;}

.line { 
    border-top:1px solid grey;
    padding-top: 6px; 
}
	
div.volume .element .image {
	width:125px;
	float:left;}

div.volume .element .rechts .preis { float:left; }
div.volume .element .rechts .box { float:right; }
div.volume .line .rechts { float: right;}

.teaser {
	margin-bottom:15px;
	width:525px;}
	
.teaser .teaser_img {
		width:120px;
      float: left;
      }
	
.teaser .teaser_txt { width:390px; }

.teaser .sm_01_item {
	margin-top:15px;
	border-bottom:1px solid gray;}

.teaser .sm_02_item { margin-left:50px; }

div.volume .sm_03_item  { margin-left: 100px; }
div.volume .latest_item { padding:     10px 10px 15px 10px; }
	
.teaser .latest_item .latest_title {
		font-size:75%;
		line-height:1.5em;}
	
.teaser .latest_item .latest_date {
		font-size:75%;
		text-align:right;}

.teaser a { line-height: 20px; }

.latest_item .latest_subheader {	font-size:70%; }
	
.latest_item .latest_more { font-size:70%; }

.list_item { display:block; }
	
.teaser .list_item .list_image{
		width:120px;}
	
.teaser .list_item .list_subheader {
		text-align:left;
		width:390px;}
	
.teaser .list_item p { margin:0; }

.teaser .single_item {
	display:block;
	margin-bottom:10px;}

/* html>body div.volume .single_item {
	margin-top:20px;} */

.single_item .single_title { width:430px; }

.single_item .single_date {
		text-align:right;
		width:80px;}
	
.single_item .single_image { margin:0 15px 10px 0; }

/* div.volume img {
	border:1px solid gray;} */

#mailform label {
	width:210px;
	float:left;
}

/* default styles for extension "tx_a1teasermenu_pi1" */
    table.tx-a1teasermenu-pi1 {padding: 0 0 0 0px; spacing: 0 0 0 0px; border: 0 0 0 0px;}
    tr.tx-a1teasermenu-pi1 {}
    td.tx-a1teasermenu-pi1 {vertical-align: top;}


/* FONTSIZER  */
#fontsize  {
     color: #454545;
     float: right;
     margin-right: 10px;
     margin-top: -2px;
     margin-bottom: 10px;
     }
#fontsize a {
     text-decoration: none;
     color: #454545;
}



#fontsize .a1 {
   width: 10px;
   color: #454545;
   font-size:1.6em;
	font-weight:bold;
	text-align:center;
	padding:2px;
}

#fontsize .a2 {
   width: 10px;
   color: #454545;
	font-size:1.2em;
	font-weight:bold;
	text-align:center;
	padding:2px;
}

#fontsize .a3 {

        width: 10px;

        color: #454545;

	font-size:1em;

	font-weight:bold;

	text-align:center;

	padding:2px;

}