/* CSS Document */

/***********************************************/
/* wwww.besa.de                                */
/***********************************************/

/***********************************************/
/* Layout Divs                                 */
/***********************************************/
#pagelayout {
}

#header {	
}

#content {
	position: relative;
	width: 960px;
}

#logo {
	width: 440px;
	background-color: #ffffff;
	margin-left: 190px;
    padding: 0px;
    text-align: left;
	border: 0px solid blue;
}

#topNav {
	width: 100%;
	background-color: #666666;
	margin-top: 10px;
    padding: 0px;
    text-align: left;
}

#topQuest {
	width: 100%;
	background-color: #ffffff;
	margin-top: 10px;
    padding: 0;
    text-align: left;
}

#contentCenter {
	position: absolute;
	top: 208px;
	left: 250px;
	width: 440px;
}

#contentLeft {
	position: absolute;
	top: 202px;
	left: 0px;
	width: 190px;
}

#contentRight {
	position: absolute;
	top: 202px;
	right: 0px;
	width: 220px;
}

/***********************************************/
/* HTML tag styles                             */
/***********************************************/
BODY {
	margin: 0px;
	padding: 0px;
	color: #000000;
	font-family: Arial, Helvetica, Verdana, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0px; padding: 0px;
}

/* H2 im mittleren Content-Bereich */
H2 {
	font-size: 0.85em;
	color: #666666;
	line-height: 100%;
	margin-bottom: 10px;
}

H3 {
 	font-size: 0.75em;
	line-height: 125%;
}

#contentCenter H3 {
 	font-size: 0.8em;
	margin-bottom: 0.5em;
}

H4 {
 	font-size: 12px;
	line-height: 125%;
}

#contentCenter H4 {
	margin-top: 10px;
	margin-bottom: 5px;
}

P {
	font-size: 0.8em;
	line-height: 140%;
	margin-top: 5px;
	margin-bottom: 15px;
	padding: 0px;
}

TD {
	font-size: 0.8em;
	line-height: 140%;
	margin-top: 5px;
	margin-bottom: 15px;
	padding: 0px;
}

/***********************************************/
/* List styles                                 */
/***********************************************/
#contentLeft UL {
	list-style-type: none;
	font-size: 0.75em;
	color: #333333;
	line-height: 125%;
	margin-top: 8px;
	margin-left: 10px;
	padding: 0px;
}

/* Eigentlich für die Definition von UL ausreichend, aber Opera5/Win braucht auch den auf Null gesetzten Margin des LI-Elementes... */
#contentLeft LI {
	list-style-type: none;
	margin: 0 5px 1em 0;
	padding-left: 0px;
}

#contentLeft H4 {
	margin-bottom: 0.25em;
}

#contentCenter UL {
	list-style-type: none;
	font-size: 0.8em;
	color: #000000;
	line-height: 140%;
	margin-top: 5px;
	margin-bottom: 15px;
	margin-left: 0px;
	padding: 0px;
	padding-left: 0px;
}

/* Eigentlich für die Definition von UL ausreichend, aber Opera5/Win braucht auch den auf Null gesetzten Margin des LI-Elementes... */
#contentCenter LI {
	list-style-type: disc;
	margin-left: 15px;
	padding-left: 0px;
}

#contentRight UL {
	list-style-type: none;
	font-size: 0.75em;
	font-weight: bold;
	color: #ffffff;
	line-height: 120%;
	margin-top: 4px;
	margin-bottom: 3px;
	margin-left: 0px;
	padding: 0px;
	padding-left: 0px;
}

/* Eigentlich für die Definition von UL ausreichend, aber Opera5/Win braucht auch den auf Null gesetzten Margin des LI-Elementes... */
#contentRight LI {
	list-style-type: none;
	margin-left: 10px;
	padding-left: 0px;
}


/***********************************************/
/* More styles                                 */
/***********************************************/
.trenner {
	color: #ffffff;
	font-size: 0.75em;
	font-weight: bold;
	margin-left: 10px;
}

/***********************************************/
/* Link styles                                 */
/***********************************************/
#topNav A:link, #topNav A:visited,
#topNav A:hover, #topNav A:active {
	color: #ffffff;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
	margin-left: 10px;
}

#topNav A:hover {
	text-decoration: underline;
}

#contentLeft A:link, #contentLeft A:visited,
#contentLeft A:hover, #contentLeft A:active {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	margin-right: 5px;
	margin-left: 0px;
}

#contentLeft A:hover {
	text-decoration: underline;
}

#contentRight A:link, #contentRight A:visited,
#contentRight A:hover, #contentRight A:active {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	margin-right: 5px;
	margin-left: 0px;
}

#contentRight A:hover {
	text-decoration: underline;
}


/***********************************************/
/* Header                                      */
/***********************************************/
#header H1 {
	position: absolute;
	top: 0px;
	left: 190px;
	width: 440px;
	height: 108px;
	background-image: url(/_images/logo.jpg);
	background-repeat: no-repeat;
}

/* ... Ausblenden des H1-Texts */
#header H1 SPAN{
	display: none;
}


/***********************************************/
/* TopNav                                      */
/***********************************************/
#topNav {
	position: absolute;
	top: 108px;
	left: 0px;
}

/* ........... Erste Ebene ........... */
#topNav UL {
	margin: 0;
	padding: 0;
	list-style: none;
}
#topNav LI {
	position: relative;
	width: 110px;
	float: left;
}

/* ........... Zweite Ebene ........... */
#topNav LI UL {
	position: absolute;
	left: -9999px; /* ... zuerst versteckt (left:-9999 ist Reader-freundlicher als display:none) */
	width: 110px;
	padding-top: 6px;
}
#topNav LI LI {
	float: none;
	width: auto;
	font-size: 15px;
}

/* ........... Hover-Effekt ........... */
#topNav LI:hover UL,
#topNav LI.sfhover UL {
	left: auto;
	z-index: 100; /* IE-Fix */
}
#topNav LI#menu-contact:hover UL,
#topNav LI#menu-contact.sfhover UL {
	left: auto; /* ... wenn bei #topNav LI UL width: 220px, dann hier -110px und nicht auto) */
	z-index: 100; /* IE-Fix */
}

/* Vergroessern der Hover-Fläche */
#topNav LI A { /* ... Erste Ebene */
	display: block;
	height: 19px;
	padding: 5px 0 0 0;
}
#topNav LI LI A { /* ... Zweite Ebene */
	display: block;
	padding: 0;
	height: 18px;
}

/* ........... Ausnahme: Menu:HOME ........... */
#topNav #menu-home {
	width: 190px;
}
#topNav #menu-home A {
	float: left;
}

/* ........... Farben der Menupunkte ........... */
#topNav #menu-products,
#topNav #menu-products UL {
	background-color: #ce3131;
}

#topNav #menu-tutorials,
#topNav #menu-tutorials UL {
	background-color: #ff6331;
}

#topNav #menu-updates,
#topNav #menu-updates UL {
	background-color: #ff9c00;
}

#topNav #menu-events,
#topNav #menu-events UL {
	background-color: #cebd9c;
}

#topNav #menu-publications,
#topNav #menu-publications UL {
	background-color: #9c9cce;
}

#topNav #menu-faqs,
#topNav #menu-faqs UL {
	background-color: #3163ce;
}

#topNav #menu-contact,
#topNav #menu-contact UL {
	background-color: #31319c;
}

/***********************************************/
/* Submenu                                     */
/***********************************************/
#contentLeft .submenu {
	margin: 0 0 1.5em 0;
	padding: 0;
}

#contentLeft .submenu UL {
	margin: 0;
	padding: 0;
}

#contentLeft .submenu LI {
	margin: 0 0 2px 0;
}

#contentLeft .submenu H3 {
	padding: 5px 0 3px 10px;
	margin: 0px;
 	color: #ffffff;
	font-size: 1em;
}

#contentLeft .submenu H4 {
	margin: 0;
	padding: 3px 0 3px 10px;
 	color: #ffffff;
	font-size: 1.3em;
	font-weight: normal;
	background-color: #999999;
}

#contentLeft .submenu H4:hover {
	background-color: #7d7d7d;
}

#contentLeft .submenu H4.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #666666;
}

/* ........... Anpassung an einzelne Themen ........... */
/* ... Imprint ... */
BODY#imprint #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #666666;
}

BODY#imprint #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #666666;
}

BODY#imprint #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #666666;
}

BODY#imprint #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color: #666666;
	font-weight: bold;
	text-decoration: none;
}

BODY#imprint #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color: #666666;
	font-weight: bold;
}

BODY#imprint #contentCenter A:hover {  /* Auszeichnung Links im Fließtext */
	color: #ffffff;
	font-weight: bold;
	background-color: #666666;
	text-decoration: none;
}

/* ... Products ... */
BODY#products #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #a52727;
}

BODY#products #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #ce3131;
}

BODY#products #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #ce3131;
}

BODY#products #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color: #ce3131;
	font-weight: bold;
	text-decoration: none;
}

BODY#products #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color:  #ce3131;
	font-weight: bold;
}

BODY#products #contentCenter A:hover {  /* Auszeichnung Links im Fließtext */
	color: #ffffff;
	font-weight: bold;
	background-color: #ce3131;
	text-decoration: none;
}

/* ... Tutorials ... */
BODY#tutorials #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #cc4f27;
}

BODY#tutorials #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #ff6331;
}

BODY#tutorials #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #ff6331;
}

BODY#tutorials #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color:  #ff6331;
	font-weight: bold;
	text-decoration: none;
}

BODY#tutorials #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color:  #ff6331;
	font-weight: bold;
}

BODY#tutorials #contentCenter A:hover {  /* Auszeichnung Links im Fließtext */
	color: #ffffff;
	font-weight: bold;
	background-color: #ff6331;
	text-decoration: none;
}

/* ... Updates ... */
BODY#updates #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #cd7d00;
}

BODY#updates #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #ff9c00;
}

BODY#updates #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #ff9c00;
}

BODY#updates #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color:  #ff9c00;
	font-weight: bold;
	text-decoration: none;

}

BODY#updates #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color:  #ff9c00;
	font-weight: bold;
}

BODY#updates #contentCenter A:hover {  /* Auszeichnung Links im Fließtext */
	color: #ffffff;
	font-weight: bold;
	background-color: #ff9c00;
	text-decoration: none;
}

/* ... Events ... */
BODY#events #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #a6987d;
}

BODY#events #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #cebd9c;
}

BODY#events #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #B4A588;
}

BODY#events #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color: #B4A588;
	font-weight: bold;
	text-decoration: none;
}

BODY#events #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color: #B4A588;
	font-weight: bold;
}

BODY#events #contentCenter A:hover {  /* Auszeichnung Links im Fließtext */
	color: #ffffff;
	font-weight: bold;
	background-color: #B4A588;
	text-decoration: none;
}

/* ... Publications ... */
BODY#publications #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #7f7fa7;
}

BODY#publications #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #9c9cce;
}

BODY#publications #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #9c9cce;
}

BODY#publications #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color: #9c9cce;
	font-weight: bold;
	text-decoration: none;
}

BODY#publications #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color: #9c9cce;
	font-weight: bold;
}

/* ... FAQs ... */
BODY#faqs #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #274fa5;
}

BODY#faqs #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #3163ce;
}

BODY#faqs #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #3163ce;
}

BODY#faqs #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color: #3163ce;
	font-weight: bold;
	text-decoration: none;
}

BODY#faqs #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color: #3163ce;
	font-weight: bold;
}

BODY#faqs #contentCenter A:hover {  /* Auszeichnung Links im Fließtext */
	color: #ffffff;
	font-weight: bold;
	background-color: #3163ce;
	text-decoration: none;
}

/* ... Contact ... */
BODY#contact #contentLeft .submenu H3.selected { /* Submenu-Bg Selected, dunkler */
	background-color: #202066;
}

BODY#contact #contentLeft .submenu H3 { /* Submenu-Bg normal, hell */
	background-color: #31319c;
}

BODY#contact #contentCenter H2 {  /* Auszeichnung im Fließtext (hell) */
	color: #31319c;
}

BODY#contact #contentCenter A:link, A:visited, A:hover, A:active {  /* Auszeichnung Links im Fließtext */
	color: #31319c;
	font-weight: bold;
	text-decoration: none;
}

BODY#contact #contentCenter A:visited {  /* Auszeichnung Links im Fließtext, nötig wegen #footer A:visited */
	color: #31319c;
	font-weight: bold;
}

BODY#contact #contentCenter A:hover {  /* Auszeichnung Links im Fließtext */
	color: #ffffff;
	font-weight: bold;
	background-color: #31319c;
	text-decoration: none;
}

/***********************************************/
/* Box                                         */
/***********************************************/
.box {
	margin: 0 0 1.5em 0;
	padding: 0 0 5px 0;
	background-color: #999999;
}

.box H3 {
	padding: 6px 5px 2px 10px;
 	color: #ffffff;
}

#contentLeft .box H3 {
	text-transform: uppercase;
}

.box P {
	margin: 0;
	padding: 6px 5px 3px 10px;
	color: #ffffff;
	font-weight: bold;
	font-size: 0.75em;
	line-height: 125%;
}

.box img {
	border-top: 2px solid #ffffff;
	border-bottom: 2px solid #ffffff;
}

/***********************************************/
/* Pop-up                                      */
/***********************************************/
#popupLeft {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 780px;
	float: left;
}

#popupRight {
	position: absolute;
	top: 0px;
	left: 795px;
	width: 190px;
	height: auto;
	padding-right: 10px;
	overflow: auto;
}

#popupRight H3 {
	margin-top: 15px;
}

#popupRight A:link, A:visited, A:hover, A:active {
	color: #666666;
	font-weight: bold;
	text-decoration: none;
}

#popupRight A:hover {
	color: #666666;
	font-weight: bold;
	text-decoration: underline;
}

/***********************************************/
/* Footer                                      */
/***********************************************/
#footer {
	margin: 2em 0 2em 0;
	font-size: 0.85em;
	color: #666666;
}

#footer P {
	margin: 0; padding: 0;
}

#footer A:link, #footer A:visited, #footer A:hover, #footer A:active {
	color: #666666 !important;
	font-weight: normal !important;
	text-decoration: none !important;
	background-color: #ffffff !important;
}