ul,ol { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; font-weight:normal; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input, dl, dt, dd { margin:0; padding:0 }
address { font-style:normal }
table {	border:none; padding:0px; margin:0px; border-spacing:0px; font-size:1em;}
tr { border:none; padding:0px; margin:0px; }
td { border:none; padding:0px; margin:0px; vertical-align:top; border-spacing:0px; }
legend { display:none; }
div, p, li { background-repeat:no-repeat; }

/* ### reset some basic style ################################################### */

dl			{margin: 0 0 0 0;}
dl dt		{margin: 0 0 0 0;}
dl dd+dt	{margin-top: 0;}
dl dd		{margin: 0 0 0 0;}

ol			{list-style: none;}
ol li		{margin: 0 0 0 0;}
ol li ol	{margin: 0 0 0 0;}
ol li ul	{margin: 0 0 0 0;}

p			{margin-bottom: 0em; }

ul			{list-style: none;}
ul li		{margin: 0 0 0 0;}
ul li ul	{margin: 0 0 0 0; list-style: none;}
ul li ol	{margin: 0 0 0 0;}

pre			{font-size:1.2em; }


a, a:link, visited {
	color:#000000;
	text-decoration: underline;
}

a:hover {
	color:#8F2B27;
	text-decoration: none;
}

/* ################################################## HTML ################################################ *
*   This is the part where the HTML settings for all display sizes is specified
*
*/

html { min-height: 99%; margin-bottom: 1px; }

/* ### BODY ###################################################################### */
  body  {
	margin: 0;
	padding: 0;
	text-align: center;
	color: #000000;
	background-color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
    }

/* \*/ * html body { text-align:center; font-size: xx-small; } /* *//* IE 5.5 Hack */

.clearfloat { /* Diese Klasse sollte in einem div- oder break-Element platziert werden und das letzte Element vor dem Schließen eines Containers sein, der wiederum einen vollständigen Float enthalten sollte. */
    	clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px; }

.clearer {
	display:block;
	clear:both;
	line-height:0;
	height:1px;
	font-size:0;
	visibility:hidden;
}

.clear { clear:both; }

.floatLeft { float:left; }
.floatRight { float:right; }

#site-content { padding: 10px; }



#column {
	background: #FFFFFF;
	text-align: left;
	width: 100%;
	margin: 0 auto;
	max-width: 850px;	
    } 
	
#top {
	margin:0;
	padding: 8px 0px;
	text-align: left;
	background-color: #FFFFFF;
	font-size: 11px;
	color: #333333;
	margin-top: 15px;
	width: 80%;
}
.topnav .icon{
    display: none
}

/* . ####### KLEINER BILDSCHIRM #####*/
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media only screen and (max-width: 600px){
    /* alle außer das erste child ausblenden*/
    .topnav a:not(:first-child) {display: none;}
    /* das vormals versteckte icon anzeigen*/
    .topnav a.icon{
        float: right;
        display: block;       
    }
    #top {
	margin:0;
	padding: 8px 0px;
	text-align: left;
	background-color: #FFFFFF;
	font-size: 11px;
	color: #333333;
	/*margin-top: 15px;*/
	width: 95%;
    position: fixed;
    top: 0;
    z-index: 101;
}
    
}
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media only screen and (max-width: 600px){
    .topnav.responsive {position: relative;}
    .topnav.responsive a.icon{
        position: absolute;
        right: 0;
        top: 8px;
    }
    .topnav.responsive a{
        float:none;
        display: block;
        text-align: left;
    }
}

/* ####### GROSSER SCREEN ##### */
@media only screen and (min-width: 600px) {
#header {
	padding: 0 0;
	background-color: #FFFFFF;
	background-image: url(bg_header.jpg);
	height: 110px;
    } 
}
/* ######## KLEINER SCREEN   ########### */
@media only screen and (max-width: 600px) {
#header {
	padding: 0 0;
	background-color: #FFFFFF;
	background-image: url(bg_header.jpg);
	/*height: 65px;*/
    top: 20px;
    } 
#header img{
	padding: 0 0;
	background-color: #FFFFFF;
	background-image: url(bg_header.jpg);
	height: auto;
    max-width: 100%;
    } 
}
#header h1 {
	margin: 0;
	padding: 10px 0;
	color: #CC3399;
	font-weight: normal;
	padding-top: 40px;
    }

	
	
#navitop {
	margin:0;
	padding: 0 10px;
	border-bottom: 1px dotted #999999;
	text-align: left;
	background-color: #FFFFFF;
	font-size: 12px;
	padding-top: 8px;
	padding-bottom: 8px;
	color: #666666;

}

.small {
	font-size: 10px;
}

/*######### GROSSER SCREEN   ######*/
@media only screen and (min-width: 600px) {
#content {
	text-align: center;
	background-color: #FFFFFF;
	padding:10px 0px 10px 0;
	margin: 0 auto;
	display: block;
    }
}

/*######### KLEINER SCREEN   ######*/
@media only screen and (max-width: 600px) {
#content {
	text-align: center;
	background-color: #FFFFFF;
	padding:10px 0px 10px 0;
	margin: 0 auto;
	display: block;
    /*top: 20px;*/
    }
}

/* ######## GROSSER SCREEN   ########### */
@media only screen and (min-width: 600px) {
#sidebar1 {
	float: left;
	padding: 0px 0 0px 0 0;
	width: 10%;
	margin-top: 15px;
	background-color: #FFFFFF;
	text-align: left;
	left: 0px;
	position: relative;
    }
	
#sidebar1 img { 
    float:left;
    }
}

/* ######## KLEINER SCREEN   ########### */
/*
@media only screen and (max-width: 600px) {
#sidebar1 {
	float: none;
	padding: 0px 0 0px 0 0;
	width: 80%;
	margin-top: 15px;
	background-color: #FFFFFF;
	text-align: center;
	left: 0px;
	position: relative;
    }
	
#sidebar1 img { 
    }
}*/


    
/* ######## GROSSER SCREEN   ########### */
@media only screen and (min-width: 600px) {
#sidebar2 {
	float: right;
	width: 29%;
	text-align: right;
	right: 0px;
	position: relative;
    }
#sidebar2_referenzen{
	float: right;
	width: 29%;
	text-align: right;
	right: 0px;
	position: relative;
    }
}
/* ###### KLEINER SCREEN ###### */

@media only screen and (max-width: 600px) {
#sidebar2 {
    display: none
    }
    
#sidebar2_referenzen{
	float: none;
	text-align: left;
	right: 0px;
	position: relative;
	padding: 10px 0px 30px 10px;
	width: 86%;
    }
    
#sidebar2_referenzen .hide{
        display: none;
    }
    
#sidebar2_referenzen h2{
    padding-bottom: 5px;
    letter-spacing: 1px;
	font-size: 14px;
    text-align: center;
    }
}

#sidebar2 h2 { 
	font-weight: normal;
	padding-bottom: 3px;
	font-family: Arial, Helvetica, sans-serif;
	color: #8F2B27;
	letter-spacing: 1px;
}
#sidebar2_referenzen h2 { 
	font-weight: normal;
	padding-bottom: 3px;
	font-family: Arial, Helvetica, sans-serif;
	color: #8F2B27;
	letter-spacing: 1px;
}


.kundenstimmen {
	text-align: left;
	color: #333;
}

/* ###################  GROSSER SCREEN ########### */
@media only screen and (min-width: 600px) {
#main {
	width: 72%;
	float: right;
	margin-top: 15px;
    } 
}

/* ################# KLEINER SCREEN ########### */
/*@media only screen and (max-width: 600px) {
    #main {
	width: 80%;
	float: none;
	margin-top: 15px;
    } 
}*/
	
	
/* ###################  GROSSER SCREEN ########### */
@media only screen and (min-width: 600px) {
#main-content-block {
	float: left;
	text-align: left;
	position: relative;
	padding: 80px 0px 30px 10px;
	width: 66%;
	line-height: 18px;
	z-index: 100;
	background-color: #FFFFFF;
	background: blur;
    }
}
/* ################# KLEINER SCREEN ########### */
@media only screen and (max-width: 600px) {
#main-content-block {
	float: none;
	text-align: left;
	position: relative;
	padding: 10px 0px 30px 10px;
	width: 86%;
	line-height: 18px;
	z-index: 100;
	background-color: #FFFFFF;
	background: blur;
    }
    
#main-content-block h2{
    text-align: center;
    }
#main-content-block h1{
    text-align: center;
    }
#main-content-block h3{
    text-align: center;
    }
}
	
img { border:none}

#main-content-block img { float:left; }
	
#main-content-block h1{
	font-weight: normal;
	font-size: 18px;
	padding-bottom: 8px;
	font-family: Arial, Helvetica, sans-serif;
	color: #666666;
	letter-spacing: 1px;
	}
	
	#main-content-block h2{
	font-weight: normal;
	padding-bottom: 5px;
	font-family: Arial, Helvetica, sans-serif;
	color: #8F2B27;
	letter-spacing: 1px;
	font-size: 14px;
	}
	
	#main-content-block h3{
	font-weight: normal;
	font-size: 18px;
	padding-bottom: 8px !important;
	font-family: Arial, Helvetica, sans-serif;
	color: #666666;
	letter-spacing: 1px;
	}
	
	#main-content-block ul {
	margin-left: 30px;
	color: #000000;
	font-size: 100%;
	}
	
	#main-content-block ul li {
	list-style-type: square;
	margin-bottom: 8px;
	}
	
/* ###### GROSSER SCREEN ###### */
@media only screen and (min-width: 600px){
#footer {
	padding: 0 0px;
	margin-bottom: 15px;
	width: 100%;
	float: right;
	text-align: right;
	background-image: url(bg_footer2.jpg);
	background-repeat: no-repeat;
	padding-bottom: 20px;

    } 
#footer p {
	margin: 0;
	padding: 10px 0;
	letter-spacing: 1px;
	font-size: 11px;
	margin-top: 5px;
    display: inline;
    }
    
#footer .hide{
        
    }
}
/* ###### KLEINER SCREEN ###### */
@media only screen and (max-width: 800px){
#footer {
	padding: 10px 0px;
	margin-bottom: 15px;
	width: 100%;
	float: left;
	text-align: left;
	background-image: url(bg_footer.jpg);
    background-size: contain;
	background-repeat: no-repeat;
    } 
#footer p {
	margin: 0;
	padding: 0px 0;
	letter-spacing: 1px;
	font-size: 11px;
	margin-top: 5px;
    text-align: center;
    }
    #footer br{
        display: none;
    }
#footer .hide{
        display: none;
    }
}
#footer a{
    text-decoration: none;
}

    

.top {   }
    
/* ######## START LINKS ######## */
    
a.top:link,	a.top:visited, a.top:active {
	color:#333333 !important;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0 10px 0 0;
	width: 100%;
    }


a.top:hover {
	color:#8F2B27 !important;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0 10px 0 0;
}

a.top1:link, a.top1:visited, a.top1:active {
	color:#8F2B27;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0 10px 0 0;
}

a.top1:hover {
	color:#8F2B27;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0 10px 0 0;
}

.bottom {   }

a.bottom:link,	a.bottom:visited, a.bottom:active {
	color:#333333 !important;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0px 0px 0 0;
	line-height: 20px;
	width: 90px;
}
a.bottom:hover {
	color:#8F2B27 !important;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0px 0px 0 0;
		line-height: 20px;
}

a.bottom1:link, a.bottom1:visited, a.bottom1:active {
	color: #8F2B27;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0px 0px 0 0;
	line-height: 20px;
}

a.bottom:hover {
	color: #8F2B27;
	text-decoration: none;
	letter-spacing: 1px;
	padding: 0px 0px 0 0;
	line-height: 20px;
}












#telefon {
	position: static;
	z-index: 300;
	width: 260;
	height: 20px;
	float: right;
	right: 0px;
	top: 160px;
}


.big {

	font-weight: normal;
	color: #000000;
	padding-left: 2px;
	letter-spacing: 1px;
}


.big-top {
	font-size:18px;
	font-weight: normal;
	color: #CCCCCC;
	padding-left: 0px;
}

a.big-top:link, a.big-top:visited, a.big-top:active {
	color: #8F2B27 !important;
	text-decoration: underline;
	letter-spacing: 1px;
	padding: 0 10px 0 0;
    color: #8F2B27;
	font-size: 14px;
}

a.big-top:hover {
	color: #999999;
	text-decoration: none;
	padding: 0;
}


.wichtig { color:#8F2B27; }

#formular {
	width: 380px;
	height: 500px;

}





/* ### Galerie Lightbox 2014  ################################# */

	.image-set ul li {
	display: block;
	margin-bottom: 8px;
}
	.image-set ul img {
	border: 1px solid #CCCCCC;
	margin-bottom: 0px;
	}
	.image-set ul a:hover img {
	border: 1px solid #8F2B27;
	color: #666666;
	margin-bottom: 0px;
	}
	.image-set ul a:hover { color: #fff; }
.frame {
	border: none;
	width: 380px;
}



/* ### Galerie Lightbox  ################################# */
	#gallery {
	padding: 0px 0 0 0;
	width: 100%;
	text-align: center !important;
	z-index: 1000;
	}
	
	#gallery ul {
	list-style: none;
	text-align: center;
}
	#gallery ul li {
	display: block;
	margin-bottom: 8px;
}
	#gallery ul img {
	border: 1px solid #CCCCCC;
	margin-bottom: 8px;
	}
	#gallery ul a:hover img {
	border: 1px solid #8F2B27;
	color: #666666;
	margin-bottom: 8px;
	}
	#gallery ul a:hover { color: #fff; }
.frame {
	border: none;
	width: 380px;


}
/* ### Kontaktformular  ################################# */

.button{
border-bottom: black 1px solid;
border-left: #297394 1px solid;
border-right: black 1px solid;
border-top: #297394 1px solid;
font-family:Verdana;
font-size: 11px;
text-align:left;
padding-left:5px;
padding-top:2px;
padding-bottom:2px;
font-weight:bolder;
color:black;
background-color:#dfdfdf;
cursor:pointer;
display:inline;
width:auto;
}
.text{
background-color:whitesmoke;
color:#297394;
border:0 !important;
}
.select{
background-color:whitesmoke;
color:#297394;
}