/* 
Inhaltsverzeichnis

01. Grundformatierungen
02. Layoutformatierungen
03. Header und Navigation
04. Bild und Text (Grundlagen)
05. Servicenavigation
06. Produkte
07. Image PopUp
08. Part Formular
09. Part Neuigkeit
10. Part Sitemap

copyright 2008, insyma KOES
*/

/* 01. Grundformatierungen */

html {
	background : #e9e3dd; 
	color : #e0d4c2;
	font-family : Arial, Helvetica, sans-serif; 
	height: 100%;
}
 
body {
	background : #3e312a url('../img/layout/bg_body.gif') 100% 0 repeat-y ; 
	font-size : 80%; 
	margin : 36px auto; 
	padding : 36px;
	position : relative;
	width : 878px;
} 

h1 {
	font-size : 125%;
	font-weight : 700;
	margin : 0 0 10px 0;
}

h2, p.h2 {
	font-weight : 700;
	margin : 5px 0 0 0;
}

p {
	padding-bottom : 10px;
	text-align : justify;
}

p.clear {
	padding : 0;
}
div.clear {
		clear:both;
		display:block;
}
a {
	color : #e0d4c2;
	text-decoration : none;
}

a:hover {
	color : #d68e01;
	text-decoration : underline;
}
a.PopimgBox {
	position: relative;
	z-index: 100;
	
}
table {
	margin-bottom : 20px;
}

td {
	padding : 3px 15px 3px 0;
	border-bottom: 1px solid #7b6b5d;
}

td.header {
	font-weight : 700;
	border : none;
	border-bottom: 2px solid #7b6b5d;
}

td.headerleer {
	width : 0;
	border-bottom: 2px solid #7b6b5d;
}

td.leer {
	width : 0;
	border-bottom : 1px solid #7b6b5d;
}

.invis, div.hide-content {
	display: none;
}

/* 02. Layoutformatierungen */

div#leftcolumn {
	float	: left;
	width : 268px;	
}

div#rightcolumn {
	float : left;
	margin-left : 30px;
	width : 580px;
}



/* 03. Header und Navigation */

ul#slogan {
	letter-spacing : 0.18em;
	margin : 0 0 20px 0;
}

ul#slogan li {
	display : inline;
	padding : 0 20px 20px 0;
}

ul#slogan li h3 {
	color : #b7a38d;
	display : inline;
	font-family : "Times Roman", "Georgia", Georgia, Garamond, serif;
	font-size : 180%;
	line-height : 60px;
}

li#logo img {
	position : absolute;
	right : 0;
	top : 0;
}

li#logo span {
	display : none;
}

ul#navigation {
	background-color : #56463c;
	min-height : 300px;
	padding : 16px 0;
}

ul#navigation li {
	font-family : Arial, Helvetica, sans-serif; 
	padding : 4px 0 4px 20px;
}

ul#navigation li a:hover, ul#navigation li a.activeLink ul#subnavigation li a:hover {
	color : #ffffff;
	text-decoration : none;
}

ul#navigation li.activeDirectory, ul#navigation li.activeDirectory ul#subnavigation ul {
	background : #4e3f36;
	border-top : 1px solid #7b6b5d;
	border-bottom : 1px solid #7b6b5d;
}

ul#navigation li.activeDirectory ul#subnavigation {
	background : #4e3f36;
	border-top : 1px solid #7b6b5d;
	border-bottom : transparent;
	width : 100%;
}

ul#navigation li a.activeLink {
	color : #d68e01;
}

ul#subnavigation li {
	padding : 2px 0 02px 15px;
}

ul#navigation li a.activeLink ul#subnavigation li a {
	color : #e0d4c2;
}

img.emotion {
	display : block;
	float : right;
	margin : 0 0 10px 0;
}

div#rightcolumn ul#breadcrumb {
	border-bottom : 1px solid #7b6b5d;
	font-size : 90%;
	margin : 0 0 10px 0;
	padding : 10px 0 2px 0;
}

ul#breadcrumb li {
	display : inline;
	padding : 0 2px 0 0;
}

/* 04. Bild und Text (Grundlagen) */

div#content {
	text-align: justify;
}

div#content ul { 
	left : 23px;
	list-style : square; 
	list-style-position : outside; 
	margin-left : 23px;
	padding : 10px 10px 0 0; 
	position : relative; 
}

div#content ol { 
	left : 23px;
	list-style-type : decimal; 
	list-style-position : outside; 
	padding : 0 0 0 23px; 
	position : relative; 
	margin-bottom : 20px;
}

a.textlink {
	color : #d68e01;
}

div#content ul#directlinks {
	clear : both;
	margin : 25px 0 0 0;
	padding : 0;
	left : 0;
	width: 600px;
}

p.intro {
	color : #fff;
	letter-spacing : 1px;
}

ul#directlinks li {
	display : inline;
	float : left;
	margin-right : 15px; 
	width : 183px;
}

ul#directlinks li:last-child, ul#directlinks li.last-child {
	margin:0;
}

ul#directlinks li h5 {
	background-color : #655448;
	color: #b7a38d;
	font-family : "Times Roman", "Georgia", Georgia, Garamond, serif;
	font-size : 160%;
	letter-spacing : 0.1em;
	line-height : 40px;
	padding : 0 0 0 15px;
}

ul#directlinks li p {
	background-color: #3e332b;
	padding : 15px;
}

ul#directlinks li a {
	background: url('../img/layout/pfeil_brown.gif') no-repeat 0 6px;
	color : #b7a38d;
	display : block;
	padding : 0 0 0 20px;
}

ul#directlinks a:hover {
	background: url('../img/layout/pfeil_gold.gif') no-repeat 0 6px;
	color : #d68e01;
}

ul#directlinks li.button a {
	background : #655448;
	border : 1px solid #7b6b5d;
	border-bottom : 1px solid #56463c;
	border-right : 1px solid #56463c;
	color: #b7a38d;
	font-family : "Times Roman", "Georgia", Georgia, Garamond, serif;
	font-size : 140%;
	letter-spacing : 0.1em;
	height : 40px;
	line-height : 40px;	
	margin-bottom : 15px;
	overflow : hidden;
	padding : 0;
	text-align : center;
	text-decoration : none;
}

ul#directlinks li.button a:hover {
	background : #655448;
	border : 1px solid #56463c;
	border-bottom : 1px solid #7b6b5d;
	border-right : 1px solid #7b6b5d;	
	color: #b7a38d;
	text-decoration : none;	
}

div#content ul#links {
	border-top : 1px solid #7b6b5d;
	margin : 15px 0 0 0;
	padding : 5px 0 0 0;	
	left : 0;
}

ul#links li {
	list-style-type : none;
	list-style-position: outside;
	padding-left: 0;
}

ul#links li a {
	background: url('../img/layout/pfeil_brown.gif') no-repeat 0 4px;
	color : #b7a38d;
	padding : 0 0 0 20px;	
}

ul#links a:hover {
	background: url('../img/layout/pfeil_gold.gif') no-repeat 0 4px;
	color : #d68e01;
}


/* 05. Servicenavigation */

ul#servicenavigation {
	clear : both;
	font-family : Arial, Helvetica, sans-serif; 
	height: 0;
	letter-spacing : 0.1em;
	position : relative;
	top : 40px;
}

ul#servicenavigation li {
	color : #322923;
	display : inline;
	padding : 0 10px 0 0;
}

ul#servicenavigation li#lastLiSeparator {
	display : none;
}

ul#servicenavigation li a {
	color : #322923;
}

ul#servicenavigation li a:hover {
	color : #e2001a;
	text-decoration : none;
}

ul#servicenavigation li a.active {
	color : #e2001a;
}

/* 06. Produkte */

div#content ul#produkte {
	padding : 0;
	margin : 0;
	left : 0;
}

div#rightcolumn ul#produkte li {
	list-style-type : none;	
	clear : both;
}

div.imgframe {
	border: 1px solid #7b6b5d;
	float : left;
	height : 80px;
	margin : 0 15px 15px 0;
	padding : 2px;
	width : 80px;
}

div.imgframe div {
	display:block;
	float:left;
	width:80px;
	height:80px;
	line-height:80px;
	overflow:hidden;
	position:relative;
	z-index:1;
}

div.imgframe div img{
	float:left;
	position:absolute;
	top:-40%;
	left:-30%;
}

ul#produkte li p {
	min-height : 95px;
	float :left;
	width : 465px;
}

ul#produkte li p span, ul#produkte li h5  {
	display : block;
	font-size : 105%;
	font-weight : 700;
}

ul#produkte li p a.produktlink {
	background: url('../img/layout/pfeil_brown.gif') no-repeat 0 5px;
	color : #b7a38d;
	display : block;
	padding-left : 20px;
}

ul#produkte li p a.produktlink:hover {
	background: url('../img/layout/pfeil_gold.gif') no-repeat 0 5px;
	color : #d68e01;
}

img.imageLeft {
	border: 1px solid #7b6b5d;
	clear : both;
	float : left;
	margin : 0 30px 15px 0;
	padding : 2px;
}

img.imageRight {
	border: 1px solid #7b6b5d;
	clear : both;
	float : right;
	margin : 0 0 15px 30px;
	padding : 2px;
}

/* removing style */

a.none, a.none:hover {
	background : transparent;
	color : #b7a38d;
	line-height : 60px;
	text-decoration : none;
}

.hide {
	display: none;
}

/* 07. Image PopUp */

div#PopDiv {
	position: absolute;
	background: #3e312a;
	border: 1px solid #7b6b5d;
	padding: 15px;
	z-index: 120;
}

div#PopDiv a {
	display: block;
	margin: 0 0 10px 0;
	padding: 0;
	text-align: right;
}

div#PopDiv img {
	border : 1px solid #7b6b5d;
	display : block;
	margin : 0;
	padding : 2px;
	text-align : center;
}

p#imgCaption {
	font-size : 105%;
	text-align : center;
	padding : 5px 0 0 0;
}

/* 08. Part Formular */

fieldset {
	border: none;
	clear: both;
}

div#content fieldset ol {
	left : 0;
	list-style-type: none;
	margin : 0;
	padding : 0;
}

fieldset ol li {
	clear: both;
	margin: 3px 0 3px 0;
}

label {
	color: #e0d4c2;
	display: block;
	float: left;
	width: 150px;
}

li input, li textarea, li select {
	background: #6d5b4e;
	border: none;
	color: #e0d4c2;
	font-size: 100%;
	height: 15px;
	margin: 0;
	padding: 3px;
	scrollbar-face-color: #56463c;
	scrollbar-highlight-color: #b7a38d;
	scrollbar-3dlight-color: #7b6b5d;
	scrollbar-darkshadow-color: #3e312a;
	scrollbar-shadow-color: #3e332b;
	scrollbar-arrow-color: #e0d4c2;
	scrollbar-track-color: #e0d4c2;
	width: 340px;
}

li textarea {
	font-family : Arial, Helvetica, sans-serif;
	height: 100px;	
	overflow: auto;
}

li select {
	background: #6d5b4e;
	border : 1px solid #6d5b4e;
	padding: 2px;
	height: auto;
	width: 345px;
}

span.CheckBox {
	width: 100%;
	display: inline-block;
}

span.CheckBox input {
	border : 1px solid #e0d4c2;
	float : left;
	margin : 0 15px 0 150px;
	padding : 0;
	width	: 15px;
}

span.CheckBox label {
	white-space : nowrap;
}

span.RadioButton input[type=radio] {
	background : none;
	float : left;
	margin : 0 10px 10px 0;
	padding : 0;
	width : 15px;
}

span.RadioButton label {
	width : 70px;
}

p input {
	background-color: #322923;
	border : 1px solid #6d5b4e;
	border-bottom : 1px solid #56463c;
	border-right : 1px solid #56463c;
	color : #e0d4c2;
	padding : 5px 20px;
	margin : 15px 0 0 150px; 
}

div#danke {
	padding: 0 0 20px 0;
}

div.ValidationSummary ul {
	border-bottom : 1px solid #7b6b5d;
	margin-bottom : 20px;
}

div.ValidationSummary li {
	padding-bottom : 5px;	
}

/* 09. Part Neuigkeit */

div#neuigkeit {
	background-color : #56463c;
	font-weight : 700;
	margin-top : 30px;
	padding : 20px;
	text-align : left;
}


div#neuigkeit p {
	background-color: #655448;
	color : #e0d4c2;
	font-size : 90%;
	font-weight : normal;
	padding : 15px 15px 2px 15px;
	width : 196px;
	text-align: left;
}

div#neuigkeit a {
	background: #655448 url('../img/layout/pfeil_brown.gif') no-repeat 15px 7px;
	color : #b7a38d;
	display : block;
	font-size : 90%;
	font-weight : normal;
	padding : 2px 15px 15px 35px;
	width : 176px;
}

div#neuigkeit a:hover {
	background: #655448 url('../img/layout/pfeil_gold.gif') no-repeat 15px 7px;
	color : #d68e01;
}


div#neuigkeit div {
	overflow : hidden;
	width : 226px;
}

div#neuigkeit div a, div#neuigkeit div a:hover {
	background : none;
	padding : 0;
}

div#neuigkeit div a img {
	display : block;
	margin : 9px 0 0 0;
}

/* 10. Part Sitemap */

div#content div.part_sitemap {
	margin-top : -40px;
}

div#content div.part_sitemap ul {
	left : 0;
	margin : 0 0 10px 0;
}

div.part_sitemap ul li {
	list-style-type : none;
	list-style-position: outside;
	padding: 0;
}

div.part_sitemap ul li a {
	background: url('../img/layout/pfeil_brown.gif') no-repeat 0 4px;
	color : #b7a38d;
	padding : 0 0 0 20px;	
}

div.part_sitemap ul a:hover {
	background: url('../img/layout/pfeil_gold.gif') no-repeat 0 4px;
	color : #d68e01;
}

div#content div.part_sitemap ul li ul {
	margin-left : 23px;
}

div#content div.part_sitemap h2 {
	font-size: 105%;
	letter-spacing : 1px;
	padding: 0px;
	margin: 30px 0 5px 0;
}

div#content div.part_sitemap h3 a {
	background : none;
	font-size: 100%;
	font-weight: bold;
	padding: 0px;
	margin: 0;
}

/* 11. Part Film */
div.film p {
	margin: 0;
}
div.film p a.show-link {
	background: url('../img/layout/pfeil_brown.gif') no-repeat 0 5px;
	color : #b7a38d;
	display : block;
	padding-left : 20px;
	
}
div.film p a.show-link:hover {
	background: url('../img/layout/pfeil_gold.gif') no-repeat 0 5px;
	color : #d68e01;
}