/* CSS-Styhlsheet für web.template */ 

/* Formatierung Basis */
html {
	margin          : 0;
	padding         : 0;
	overflow        : hidden;
}

body {
	font-family     : 'Arial', helvetica, sans-serif;
	font-size       : 0.9em; 
	font-weight     : normal;
	font-style      : normal;
	margin          : 0;
	padding         : 0;
	width           : 100%;
   	height          : 100%;
 	overflow        : hidden;
}

#rahmen {
	position        : absolute;
	z-index         : 0;
	top             : 0;
	left            : 0;
	width           : 100%;
   	height          : 100%;
	margin          : 0;
	padding         : 0;
	border          : none;
	overflow        : hidden;
}


#balken-top {
	position        : absolute; 
	z-index         : 4;
	width			: 100%;
	height          : 15%;
	top             : 0;
	left			: 0;
	margin          : 0;

	overflow        : hidden; 
    box-shadow		: 0 0 7px 0 #A0A0A0;
}

#balken-top img{
	position        : relative; 
	width			: 100%;
	top             : 0;
	left			: 0;
	margin          : 0;
	overflow        : auto;
	overflow-x      : hidden; 
	min-height		: 130px;
}


#iso-zertifiziert {
	position        : absolute; 
	z-index         : 5;
	width			: 7%;
	height          : auto;
	top             : 5px;
	left			: 0;
	margin-left     : 2%;
	vertical-align  : top;
}


#imagebild {
	display         : block;
	position        : absolute; 
	z-index         : 2;
	width			: 460px;
	height          : 75%;
	top             : 25%;
	right			: 60%;
	margin          : 0;
	vertical-align  : top;
}



#title {
	position        : absolute; 
	z-index         : 8;
	width			: 48.5%;
	height			: 2%;
	top             : 21.3%;
	right			: 10%;
	min-width		: 500px;
    font-family     : 'Open Sans',sans-serif;
	color       	: #fff;
	font-size   	: 1.2em;
	line-height 	: 1em;
	font-weight  	: 400;
	font-style   	: normal;
	text-align  	: left;
	padding-top 	: 0;
	margin-top  	: 0;
    white-space 	: nowrap;
}

#rahmen-content {
	background		: transparent;
	position        : absolute; 
	z-index         : 6;
	top             : 0;
	right			: 8%;
	width           : 50.5%; 
   	height          : 95%;
	margin          : 0;
	padding-right   : 10px;
    text-align      : justify;
	overflow        : hidden;
	white-space     : normal;
	min-width		: 600px;
	min-height		: 500px;
}

#fond-content-top {
	position        : absolute; 
	z-index         : 7;
	width			: 100%;
	height			: 9%;
	top             : 0;
	right			: 0;
	margin          : 0;
	overflow        : auto;
	overflow-x      : hidden; 
	min-height		: 60px;
}


#fond-content {
	background		: #fff;
	opacity         : 65%;
	position        : absolute; 
	z-index         : 3;
	top             : 0;
	right			: 8%;
	width           : 50.5%; 
   	height          : 95%;
	margin          : 0;
	padding-right   : 10px;
    text-align      : justify;
	overflow        : hidden;
	white-space     : normal;
	min-width		: 600px;
	min-height		: 500px;
	 box-shadow		: 1px 4px 7px 0 #A0A0A0;
	border-radius	: 0 0 7px 7px;
	filter: alpha(opacity = 85); /* IE 6, 7, 8 */ 
	-ms-filter: "alpha(opacity = 85)"; /* ab IE 8 zusätzlich möglich */ 
	opacity: 0.85; /* alle anderen Browser einschließlich IE 9 */
	
}

/* Formatierung CMS Contentbereich */

#inhalt {
    font-family : 'Arial',helvetica,sans-serif;
    font-size   : 1em;
	position    : absolute;
    height      : 72%;
	width       : 90%;
	min-width   : 300px;
    left        : 5%;
	top         : 10%;
	line-height : 1.4em;
    margin      : 0;
	margin-top  : 90px;
    padding-right: 10px; 
    overflow-x  : hidden;
    overflow-y  : auto;
    text-align  : justify;
    white-space : normal;
    z-index     : 8;
}
	

#inhalt p {
	line-height  : 1.4em;
	margin       : 0;
	padding-right: 20px;
	white-space  : normal;
}


#inhalt h1 {
    font-family  : 'Open Sans',sans-serif;
	color        : #333;
	font-size    : 28px;
	line-height  : 1em;
	margin-bottom: 10px; /* 2px */
	font-weight  : 300;
	font-style   : normal;
	text-align   : left;
	padding-top  : 0;
	margin-top   : 0;
    white-space  : nowrap;
}
#inhalt h1 em,
#inhalt h1 strong {
    font-family  : 'Open Sans',sans-serif;
	color        : #333;
	font-size    : 28px;
	line-height  : 1em;
	margin-bottom: 2px;
	font-weight  : bold;
	font-style   : normal;
	text-align   : left;
	padding-top  : 0;
	margin-top   : 0;
    white-space  : nowrap;
}

#inhalt h2 {
    font-family   : 'Gilda Display', serif;
	color         : #f29000;
	font-size     : 19px;
	line-height   : 1em;
	margin-bottom : 2px;
	font-weight   : 400;
	font-style    : normal;
	text-align    : left;
	padding-top   : 0;
	margin-top    : 0;

}
#inhalt h2 em,
#inhalt h2 strong {
    font-family   : 'Gilda Display', serif;
	color         : #000;
	font-size     : 19px;
	line-height   : 1em;
	margin-bottom : 2px;
	font-weight   : bold;
	font-style    : normal;
	text-align    : left;
	padding-top   : 0;
	margin-top    : 0;
}

#inhalt h3 { 
    font-family   : 'Open Sans',sans-serif;
	color         : #969696;
	font-size     : 1.2em;
	font-weight   : normal;
	font-style    : normal;
	font-stretch  : condensed;
	text-align    : left;
	letter-spacing: 1px;
	line-height   : 1em;
	padding-bottom: 0;
}
#inhalt h4 { 
    font-family  : 'Open Sans',sans-serif;
	color        : #333;
	font-size    : 20px;
	line-height  : 1.2em;
	margin-bottom: 10px; 
	font-weight  : 300;
	font-style   : normal;
	text-align   : left;
	padding-top  : 0;
	margin-top   : 0;
	margin-left  : 1px;
}
#inhalt h5 { 
    font-family  : 'Open Sans',sans-serif;
	color        : #333;
	font-size    : 13px;
	line-height  : 1.2em;
	margin-top   : -3px; 
	font-weight  : 600;
	font-style   : normal;
	text-align   : left;
}


#inhalt em,
#inhalt strong,
#inhalt b {
	font-family : 'Arial', helvetica, sans-serif;
	color       : #000; 
	font-weight : bold;
	font-size   : 1em; 
	font-style  : normal;
}

#inhalt a {
	font-family   : 'Arial', helvetica, sans-serif;
	color          : #000;
	font-variant   : normal;
	font-weight    : normal;
	text-decoration: none;
}
#inhalt a:hover {
	font-family   : 'Arial', helvetica, sans-serif;
	color          : #f29000;
	font-variant   : normal;
	font-weight    : normal;
	text-decoration: underline;
}

#inhalt img,
#inhalt p img,
#inhalt a img {
	border         : none;
	margin         : 8px;
	margin-left    : 0;
	margin-top     : 0;
	float          : left;
	clear          : left;
}

#inhalt table.strip a img {
	width: 95%;
	margin: 0;
	padding: 0;
}
#inhalt table.strip {
	width: 104%;
}
#inhalt form div#mod_files_admin input.submit {
	color: #fff;
	background-color: #fff;
	border: none;
	width: 200px;
	height:30px;
}
#inhalt form div#mod_files_keyword input#keyword.submit {
	display: none;
}
	
#inhalt ul  {
	list-style    : none;
	line-height   : 1.4em;
	vertical-align: top;
	text-align    : left;
	padding-left  : 0;
	margin        : 0;
}


#inhalt  ul li {
	font-family         : 'Arial', helvetica, sans-serif;
	background          : url(/fond-auflistung.png);
	background-repeat   : no-repeat;
	background-position : 0 2px;
	padding-left        : 13px;
	line-height         : 1.4em;
	margin-left         : 0px;
	vertical-align      : top;
	text-align          : left;
}


/* Formatierung für Suchergebnisse */
#inhalt ul li h3 a {
	font-family    : 'Arial', helvetica, sans-serif;
	font-size      : 0.8em;
	font-variant   : normal;
	font-weight    : normal;
	list-style     : none;
	vertical-align : top;
	line-height    : 1.4em;
	letter-spacing : 0;
	text-align     : left;
	text-decoration: none;
	color          : #000;
}

#inhalt ul li h3 a:hover {
	font-family   : 'Arial', helvetica, sans-serif;
	font-size      : 0.8em;
	font-variant   : normal;
	font-weight    : normal;
	list-style     : none;
	vertical-align : top;
	letter-spacing : 0;
	line-height    : 1.4em;
	text-align     : left;
	text-decoration: none;
	color          : #ab883f;
}


#inhalt table{
	vertical-align : top;
    width          : 100%;
	margin         : 0; 
	padding        : 0;
	padding-right  : 0px;
	text-align     : justify;
}

#inhalt table thead tr th,
#inhalt table tr,
#inhalt table td,
#inhalt table tr.even td,
#inhalt table tr.odd td  {
	vertical-align : top;
    width          : auto;
	margin         : 0; 
	padding        : 0;
	border         : none; 
	padding-right  : 20px;
}

#inhalt table thead tr th {
	vertical-align : top;
    width          : auto;
	margin         : 0; 
	padding        : 0;
	border         : none; 
	text-align     : left;
}

#inhalt table img {
	margin         : 0;

	padding        : 0;

	border         : none;
}
#inhalt table p {
	line-height  : 1.4em;
	margin       : 0;
}

#inhalt table a img { 
	border         : none;
	margin         : 0;
	padding        : 0;
	text-align     : left;
	float          : none;
	clear          : none;
    text-decoration: none;
}

#fond-inhalt {
	background-color : #e3e3e3; 
	position         : fixed;
	z-index          : 1;
	bottom           : -10px;
	left             : 0;
	min-height       : 620px;
}




#navigation {
	position        : absolute;
	z-index         : 7;
	top             : 0;
	left            : 16%;
	margin-left     : -33px;
	width           : 700px;
}


#navigation-fond {
	background-image   : url(/fond-navigation.png);
	background-repeat  : no-repeat;
	background-position: top right;
	background-color   : transparent;
	position           : absolute;
	z-index            : 4;
	top                : 0;
	left               : 0;
	padding-left       : 650px;
	width              : 16%;
   	height             : 48px;
}

/* IE 5.x PNG Bugfixing */
* html #navigation-fond {
	background-image   : url(/fond-navigation.jpg);
	background-repeat  : no-repeat;
	background-position: top right;
	background-color   : transparent;
	position           : absolute;
	z-index            : 4;
	top                : 0;
	left               : 0;
	padding-left       : 670px;
	width              : 16%;
   	height             : 48px;
}




#funktionen {
    background-color: transparent;
    color: #454545;
    font-family: 'Arial',helvetica,sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    height: 50px;
    width: 236px;
	display: block;
    left: 2.2%;
    bottom: 5%;
    list-style-type: none;
    position: absolute;
    text-align: left;
    text-decoration: none;
    z-index: 6;
	border-bottom: 2px dotted #808080;
	line-height: 3em;
}


#funktionen ul,
#funktionen ul li,
#funktionen ul li em,
#funktionen a,
#funktionen ul li a,
#funktionen li {
	padding         : 0;
	margin-left     : 5px;
	font-family     : 'Arial', helvetica, sans-serif;
	font-style      : normal;
	font-weight     : normal;
	color           : #000;
	text-decoration : none;
	list-style-type : none;
	line-height     : 1.8em;
}

#funktionen a:hover,
#funktionen ul li a:hover {
	color           : #ab883f;
	text-decoration : none;

}



#fond-schriftzug {
	background-color: transparent;
	position        : absolute;
	z-index         : 2;
	bottom          : -2%;
	left            : -5%;
	width           : 100%;
	height          : 48%;
	padding         : 0;
}

/* IE 5.5 Bugifx */
* html #fond-schriftzug img {
	display            : none;
}
* html #fond-schriftzug  {
	background-image   : url(/fond-schriftzug.gif);
	background-repeat  : no-repeat;
	background-position: bottom left;
	background-color   : transparent;
	position           : absolute;
	z-index            : 2;
	bottom             : -2%;
	left               : -5%;
	width              : 100%;
	height             : 100%;
	padding            : 0;
}

#fond-banderole {
	background-color: transparent;
	position        : absolute;
	z-index         : 3;
	top             : 0;
	right           : 0;
	width           : 23%;
	height          : 100%;
	text-align      : right;
}


#werkschmiede-animation {
	background-color: transparent;
	position        : absolute;
	z-index         : 6;	
	top             : 26%;
	left            : 16%;
	width           : 520px;
   	height          : 400px;
	margin-left     : 270px;
	margin-top      : 50px;
}


#logo {
    background    : transparent;
    position      : absolute;
    right         : 8%;
    top           : 0.5%;
	height        : 16%;
    vertical-align: top;
    z-index       : 9;
}

#logo a img {
	height: 87%;
}

#teaser {
    margin: 0;
    min-width: 600px;
    overflow: hidden;
    padding-right: 10px;
    position: absolute;
    right: 8%;
  	height: 16%;
    top: 0.5%;
    z-index         : 8;
    width: 50.5%;

}
#teaser a img {
    vertical-align: top;
	height: 87%;
}

#sidebar {
	background-color:transparent;
	background-image: url(/sidebar.png);
	border-bottom-left-radius: 20px;
	border-top-left-radius: 20px;
	height: 250px;
	position: fixed;
	right: -275px;
	top: 35%;
	transition: right 0.4s ease 0s;
	width: 310px;
	z-index: 30000;
	 box-shadow		: 0px 0px 6px 0px #A0A0A0;
}
#iframe-sidebar {
	border     : none;
	margin-left: 70px;
	margin-top :3px;
	width      : 250px;
}

#sidebar:hover, 
#sidebar:focus {
  right: 0;
}

#suche {
   z-index         : 7; 
   position        : absolute;
   overflow        : hidden; 
   top             : 7px;   
   left            : 10px;    
   width           : 94px;    
   height          : 48px; 
   font-family     : 'Arial', helvetica, sans-serif;
   font-weight     : normal;
   font-size       : 1em; 
   text-align      : left;
}

.search input {
   background-image   : url(/fond-suchfeld.png);
   background-repeat  : no-repeat;
   background-position: left;
   background-color   : transparent;
   font-family        : 'Arial', helvetica, sans-serif;
   font-weight        : normal;
   font-style         : normal;
   font-stretch       : normal;
   font-size          : 0.9em;
   clear              : both;
   width              : 94px;
   height             : 17px;
   margin-top         : 0;
   padding-top        : 2px;
   padding-left       : 5px;
   border             : none;
   color              : #000;
}

.search input.submit {
   border             : none;
   background-image   : url(/fond-suchbutton.jpg);
   background-repeat  : no-repeat;
   background-position: left;
   background-color   : transparent;
   font-family        : 'Arial', helvetica, sans-serif;
   font-weight        : normal;
   font-style         : normal;
   font-stretch       : normal;
   font-size          : 0.9em;
   color              : #000;
   text-align         : left;
   float              : left;
   width              : 94px;
   height             : 17px;
   margin-top         : 0;
   margin-left        : 4px;
   padding-left       : 15px;
   padding-top        : 3px;
}
.search input.submit a:focus,
.search input.submit a:active,
.search input a:focus,
.search input a:active,
#suche  a:focus,
#suche  a:active {
	outline         : none;
}

#login {
	background      : none;
	position        : absolute;
	z-index         : 8;
	bottom          : 1px;
	left            : 1px;
	width           : 20px;
	height          : 20px;
	margin          : 0;
	padding         : 0;
}


#login form.default input {
	background-color : #e3e3e3; 
	border            : none;
	color             : #e3e3e3;
	position          : absolute;	
	width             : 20px;
	height            : 20px;
	left              : 0;	
	top               : 0;
}
#login form.default input.submit {
	color             : #e3e3e3;
	width             : 20px;
	height            : 20px;
	font-size         : 1px;
}

#login form.usermanager input{
    background        : #e3e3e3;
	border            : none;
	color             : #e3e3e3;
	position          : absolute;	
	width             : 5px;
	height            : 5px;
	left              : 25px;	
	top               : 0;
}


* Mobile Startseite *
@media screen and (-webkit-min-device-pixel-ratio:0) { #werkschmiede-animation {
	background-color: transparent;
	position        : absolute;
	z-index         : 6;	
	top             : 26%;
	left            : 16%;
	width           : 290px;
   	height          : 200px;
	margin-left     : 270px;
	margin-top      : 50px;
}}	

@media screen and (-webkit-min-device-pixel-ratio:0) { #werkschmiede-logo {
	background-color: transparent;
	position        : absolute;
	z-index         : 6;
	top             : 2%;
	left            : 16%;
	width           : 25%;
	height          : 25%;
	min-width       : 140px;
	vertical-align  : top;
	margin-left     : 340px;
	margin-top      : 25px;
}}	


@media (max-width: 1680px) { 
	#imagebild {
	width           : 460px;
	top             : 28%;
	right			: 58%;
}}
@media (max-width: 1580px) { 
	#imagebild {
	width           : 460px;
	top             : 28%;
	right			: 55%;
}}
@media (max-width: 1380px) { 
	#imagebild {
	width           : 460px;
	top             : 28%;
	right			: 48%;
}}
@media (max-width: 1280px) { 
	#imagebild {
	width           : 460px;
	top             : 28%;
	right			: 41%;
}}
@media (max-width: 1180px) { 
	#imagebild {
	width           : 460px;
	top             : 28%;
	right			: 37%;
}}
@media (max-width: 1024px) { 
	#imagebild {
	  display: none !important;

}}


@media only screen and (max-device-width: 1000px) { 
	#imagebild {
    display: none !important;
}}

#rahmen-iframe {
	width: 670px;
	height: 470px;
	margin-top : 0;
	margin-left: -5px;
	overflow: hidden;
}
	

#inhalt #iframe-blog   {
	margin-left: -90px;
	margin-top: -170px;

}


