/* CSS Document */
/* SmartPhones: media="only screen and (min-device-width: 320px) and (max-device-width: 960px)"  */
@charset "utf-8";
html { padding:0; margin:0; font-family: "Times New Roman", Georgia, Times, serif; font-size: 1em; line-height: 1.5em;}
body { margin:0; padding:0; max-width: 960px; height: 100% ; background-color: #F8F8F8; color: #333333 ;}

img { border: none; margin: 0; padding: 0; }
p { margin-top: 0px;  padding-top: 0px; width: 100% ;}
a { color: #333 ; text-decoration: underline ;}


.header { background-color: transparent ; margin: 0 ; padding: 0 0 1% 0;min-height: 105px; width: 100%; padding: 0 ; margin: 0;  } 
.logo {  float: left ; width: 100%; height: 120px; position: relative ; }
.logo a img { border: none ;  }
.mylogo { position: absolute; top: 0 ; height: 53px; width: 100%; background: url(/design/mobile/logo.png) center  center no-repeat; }
.mysublogo {position: absolute; top: 60px ;  height: 57px; width: 100%; background: url(/design/mobile/sub_logo.png) center  center no-repeat; }

.wrapper { float: left; width: 100%; background-color: #999; } 
.menu-wiper { float: right; height: auto ; text-align: right;  cursor: pointer; padding: 5px 0 ; margin: 3px 0 0 0; background-color: #999 ; text-decoration: none; }

.body { float: left; padding: 0 ; width: 100%; min-height: 200px ; margin: 0;  background-color: white ; font-family: Arial, Helvetica, sans-serif; font-size: 1em; } 

.body ul { width: 96%; float: left; margin: 5px 5px; padding: 0 2%;}
.body ul li { list-style:none; background:url(/design_new/accept.png) top left no-repeat; padding:0px 20px 5px 20px; margin:0 ; line-height: 1.4em ; font-size: 1.0em ; font-family: Arial, Helvetica, sans-serif; color:#5c5c5c; }
.body ol { width: 100%;  margin: 20px 5px 5px 15px; padding:0; }
.body ol li { margin: 0 0 5px 20px; list-style: decimal; line-height: 1.4em ; font-size: 1.0em ; font-family: Arial, Helvetica, sans-serif; }



#content { float: left; padding: 0 ; width: 100%; height: auto; min-height: 200px ; margin: 0;  background-color: transparent ; color: #333333 ; font-family: "Times New Roman", Georgia, Times, serif; font-size: 1em; text-align: left ; overflow: hidden ; } 
#content #padder { padding: 0%; width: 98% ; margin: 5px 1%;}
#content img { float: left; padding: 5px 0; margin: 0 10px 10px 0;}
#content h1 { font-size: 1.2em ; color: #333333 ; margin: 0;} 
#content h2 { font-size: 1.1em ; color: #333333 ; margin: 2em 0 1em 0; background-color: #eee; padding: 5px; }

#content .tel { display: inline-block; padding: 15px 5px ; background: #aaa url(/design/mobile/phone_icon.png) center center  no-repeat; width: auto ; height: auto ;} 
#content p { width: auto; } 

#content ul { width: 96%; float: left; margin: 5px 5px; padding: 0 2%;}
#content ul li { list-style:none; background:url(/design_new/accept.png) top left no-repeat; padding:0px 20px 5px 20px; margin:0 ; line-height: 1.4em ; font-size: 1.0em ; font-family: "Times New Roman", Georgia, Times, serif;color:#5c5c5c; }
#content ol { width: 100%;  margin: 20px 5px 5px 15px; padding:0; }
#content ol li { margin: 0 0 5px 20px; list-style: decimal; line-height: 1.4em ; font-size: 1.0em ; font-family: "Times New Roman", Georgia, Times, serif; }

#content .left_col{ float: left; padding: 0; margin: 0; width: 30% ; }
#content .right_col{ float: right; padding: 0; margin: 0 0 0 2%; width: 68% ; overflow: hidden;}

.floatleft { float: left; width: 98%; margin: 1% ; }

.teaser {color: white; background-color: #5186b8;}
.teaser ul li { color: white ; }
.teaser h1 { margin: 0 ; padding: 5px 2%; width: 96%; }
.teaser h2 { margin: 0 ; padding: 0 2%; width: 96%; }

.content { float: left; width: 96%; padding: 0 2%; margin: 0;  }
.content p, .content table { float: left; }
.content img { float: left; width: 100%; }
.content .phone { float: left; width: 100%; height: 53px; padding: 5px 0; background-color: transparent ; }


/********** footer **********/
#footer {  float: left; width: 100%; height: auto; padding: 0; margin: 0; border-top: 1px solid #d4d4d4; position: relative; bottom: 0; left: 0; font-family: "Times New Roman", Georgia, Times, serif; font-size: 1em; line-height: 1.6em; background-color: #eee; }
#footer .mobile { float: left; width: 100%;}
#footer .address {
	display: none ;	
	float: left;
	padding: 0 1%;
	width: 98%;
	min-height: 50px;
	color: white;
	background-color: #0062bb;
}
#footer .address h3 { margin: 1% 0; font-weight: bold; font-size: 1.2em;}
#footer .address a { color: white }
#footer .submenu { float: left ; width: 100%; height: 53px; padding: 5px 0; background-color: orange ; color: white;   } 
a.phone_icon { float: left; width: 151px; height: 59px;  margin: 0 10px 0 0px; background: url(/design/mobile/phone_icon_text.png) 10px center no-repeat; text-decoration: none; }
a.phone_icon span { margin: 0px 0 0 75px; font-size: 1.6em; font-weight: bold; line-height: 53px; color: white; text-decoration: none; } 
#footer .submenu a.email_icon { float: left ; width: 141px; height: 59px;  margin: 0 0 0 10px; background: url(/design/mobile/email_icon_text.png) center center no-repeat;}
#footer .submenu a.desktop_icon {
	float: left;
	width: 100%;
	height: 53px;
	line-height: 53px;
	margin: 0;
	background: #eee ;
	color: #333;
	text-align: center;
	font-size: 1.4em;
	text-transform:uppercase;
	text-decoration: none;
}
#footer .submenu a span { display: none; }


#topmenu { float: left; width: 100%; display: none ;} 
#topmenu ul {  float: left; } 
#topmenu ul li {
	display: inline;
	width: 30%;
	height: auto;
	list-style: none;
	padding: 10px ;
	background: #0062bb ;
	color: white;
} 

#topmenu ul li a { color: white ;  text-decoration: none ; }


/* Wenn auf einem Handy und wenn landscape oder portrait */
/* 1. alter iPhone 2 portrait */
@media screen and (max-width: 320px) and (orientation:portrait) {
	body { width: 100%; min-width: 320px; max-width: 480px; }
    .main {
        margin-left:  10px;
        margin-right: 10px;
        width:        100%;
        max-width:    300px;
    }
}


@media screen and (max-width:800px) and (orientation:portrait) {
	body { width: 100%; min-width: 320px; max-width: 960px; }
    .main {
        margin-left:  10px;
        margin-right: 10px;
        width:        100%;
        max-width:    380px;
    }
}
@media screen and (max-width:800px) and (orientation:landscape) {
	body { width: 100%; min-width: 400px; }	
    .main {
	    margin-left: 20px;		
        width:     100%;
        max-width: 665px;
    }
}


.menu {
    font-size: 1.0em;
	width: 100%;
	display: inline-block;  
	padding: 0;
	margin: 0;
	background-color: #aaa;
}

.menu .first {
    width:   140px;
    display: inline-block;
    border:  1px solid black;
}

.menu .first {
    color:            #ccc;
    background-color: #0062bb;
}

.menu .first > a {
    font-weight: bold;
}

.Sub {display: none; }

/* ------------------------- */ 
/* dynamic Sub Menu 2 spaltig Vertikal */
ul#menu-2v { 
	margin: 0; 
	padding: 2% 0 ; 
	list-style: none; 
	position: relative; 
	float: left ;
	display: inline-block;
	width: 100%;
	height: auto;
	background-color: transparent ;		
}

ul#menu-2v li {
	float: left;
	display: inline;
	position: relative;
	width: 48%;
	background-color: #eee;
	margin: 1% 1% 1% 1%;
	padding: 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
	border-radius: 5px;
}

/* Root Menu */
ul#menu-2v a {
	font: bold 1.0em  "Times New Roman", Georgia, Times, serif; 
	float: left;
	padding: 2% 2%;
	margin: 0;
	display: block;
	color: #333  ;
	text-decoration: none;
	width: 96%;
	height: 1%;
}

/* Root Menu Hover Persistence */
ul#menu-2v a:hover, ul#menu-2v li:hover a , ul#menu-2v a.active1 {
	color: black ;	
}

table , tr , td { border: none ; } 
.table p { width: 100% !important; }
.table a { color: #333 !important ; }
.adr p { width: 100%  !important; }
.adr a { color: #333  !important; }

#map_canvas { float: left; width: 96%; height: 300px ; margin: 10px 2% 10px 0;}
.clr { clear: both; }

.project  { float: left; width: 100%;  height: auto; }  
.project img { width: 96% ; min-width: 320px ; margin: 0 1%; padding: 1%; border: 1px solid #eee; } 


/*******************/
/*  News Block     */
/*******************/
.newslist {
	margin: 0;
	width: 100%;
	display: block;
}

.news {
	display:block;
	width:100%;
	height: auto;
	margin:0 0 15px 0;
	clear: both;
}
.news h2, .news h3  {
	margin-bottom: 0.5em;
}

.news p {
	display: inline-block;
	width: auto;
	
}

.news a { color: #333; }

.dateblock {
	text-align:center;
	width:50px;
	font-family:Arial;
	background-color:#f8f8f8;
	padding:5px 0 0 0;
	margin: 0 10px 10px 0;	
	float:left;
	display: inline-block;
	border:solid 1px #ccc;
}
.day {
	font-size: 18px;
	position: relative;
	top: -3px;
}
.month {
	font-size: 12px;
	text-transform: uppercase;
}
.year {
	font-size: 12px;
	position: relative;
	top: -6px;
}