/* Joomla Template sh_oceangrey */
/* Template by S.Hilterscheid */

/* #######  Allgemein  ####### */
body , p {
	margin: 0.5em 0;
	font-family: Arial,Helvetica,Sans-Serif;
	font-style: normal;
	font-weight: normal;
	font-size: 12px;
	text-align: justify;
}

body {
	color: #FFFFFF;
	background-color: #262626;
}
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited,
.art-postheader, .art-postheader a, .art-postheader a:link, .art-postheader a:visited, .art-postheader a:hover,
.art-blockheader .t, .art-vmenublockheader .t, .art-logo-text, .art-logo-text a,
h1.art-logo-name, h1.art-logo-name a, h1.art-logo-name a:link, h1.art-logo-name a:visited, h1.art-logo-name a:hover
{
  text-decoration: none;
  font-family: Arial, Helvetica, Sans-Serif;
  font-style: normal;
  font-weight: bold;
  font-size: 28px;
  text-align: left;
}

a,
.art-post li a /* statt ".art-post li a"muss hier "#art-content li a" hin, editor.css ist schon umgestellt */ {
	color: #0AADFF;
}
a:link{
	text-decoration: none;
	color: #0AADFF;
}
a:visited, a.visited {
	text-decoration: none;
	color: #BABABA;
}
a:hover, a.hover {
	text-decoration: none;
	border-bottom: 1px dotted #BABABA;
	color: #BABABA;
}

h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover {
	margin: 0.67em 0;
	font-size: 28px;
	color: #0AADFF;
}

h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover {
	margin: 0.8em 0;
	font-size: 22px;
	color: #0AADFF;
}

h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover {
	margin: 1em 0;
	font-size: 18px;
	font-weight: normal;
	color: #0AADFF;
}

h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover {
	margin: 1.25em 0;
	font-size: 16px;
	color: #CFCFCF;
}

h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
  margin: 1.67em 0;
  font-size: 14px;
  color: #CFCFCF;
}

h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
  margin: 2.33em 0;
  font-size: 14px;
  color: #CFCFCF;
}

h1 a, h1 a:link, h1 a:visited, h1 a:hover,
h2 a, h2 a:link, h2 a:visited, h2 a:hover,
h3 a, h3 a:link, h3 a:visited, h3 a:hover,
h4 a, h4 a:link, h4 a:visited, h4 a:hover,
h5 a, h5 a:link, h5 a:visited, h5 a:hover,
h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
    margin:0;
}
/* #######  ENDE - Allgemein  ####### */

/* #######  Seitenrahmen  ####### */
#art-page-background {
	background-color: #353535;
	border: 3px solid #505050;
	margin: 0 auto;
	width: 974px; /* Gesamtgröße der Box: 0 + 3 + 13 + 974 + 13 + 3 + 0 */
	padding: 0px 13px 13px 13px;
	}
/* #######  ENDE - Seitenrahmen  ####### */

/* #######  Deklarationen_für_Grundgerüst  ####### */

/* #######  Seitenkopf (Header)  ####### */
  #art-header {
/*  border: 3px solid red; */
    margin: 0 auto;
    width: 100%;
    /* height: 200px; */
	background-color: #262626;
    }
/* #######  ENDE: Seitenkopf (Header)  #######*/

  #art-main {
/*  border: 2px dotted yellow; */
    margin: 0 auto;
    width: 100%;
	clear: both;
    }

  #art-footer {
/*  border: 2px dotted red; */
    margin: 0 auto 0 auto;
	padding: 1em 2em;
	background-color: #262626;
    clear: both; /* Erste Element das nicht mehr das Vorgängerelement umfließen soll. */
    }

/* #######  ENDE - Deklarationen_für_Grundgerüst  ####### */

/* #######  Deklarationen_für_Einzelbereiche  ####### */
/* #######  Einzelbereiche_Header  ####### */
/* #######  Seitenkopf_Logo  ####### */
	#art-logo {
    margin: 0 auto;
    width: 100%;
    height: 150px;
	background-color: #0AADFF;
	background-image: url('/main_hp/images/header.png');

	}
	.art-logo {
	display: block;
	position: absolute;
	left: 10px;
	top: 10px;
	width: 784px;
	}

	h1.art-logo-name {
	display: block;
	text-align: left;
	}

	h1.art-logo-name, h1.art-logo-name a, h1.art-logo-name a:link, h1.art-logo-name a:visited, h1.art-logo-name a:hover {
	font-size: 26px;
	text-decoration: none;
	padding:  40px 0 0 0;
	margin: 0;
	color: #003A57 !important;
	}

	.art-logo-text {
	display: block;
	text-align: left;
	}

	.art-logo-text, .art-logo-text a	{
	font-weight: normal;
	font-size: 18px;
	padding: 0;
	margin: 0;
	color: #003A57 !important;
	}
	.art-logo-image {
	padding: 0;
	margin: 0;
	float:right;
	}
/* #######  ENDE: Seitenkopf_Logo  ####### */
/* #######  Seitenkopf_User3  ####### */
  #art-user3 {
/*  border: 1px dashed silver; */
    margin: 0 auto;
    width: 100%;
    }
/* #######  ENDE - Seitenkopf_User3  ####### */
/* #######  Seitenkopf_Top  ####### */
  #art-top {
/*  border: 1px dashed silver; */
    margin: 0 auto;
    width: 100%;
    }
/* #######  ENDE - Seitenkopf_Top  ####### */

	#art-breadcrumbs {
/*  border: 1px dashed silver; */
    background-color: #262626;
	margin: 0 auto;
	z-index: 0;
	display: inline-block; /* ist dieser Befehl die Lösung für das Positionsproblem zwischen Breadcrump und search ? */
	width: 78%;
	height: 2em; /* gleiche Höhe bei art-breadcrumbs und art-search, ebenfalls bei border-top von art-content */
    }
#art-breadcrumbs a, #art-breadcrumbs a:link, #art-breadcrumbs a:visited {
	color: #0AADFF;
}

#art-search{
/*  border: 1px dashed silver; */
    background-color: #262626;
    margin: 0 auto;
	z-index: 1;
	padding: 2px 15px 2px 2px;
    display: inline-block;
	width: 18%;
	height: 2em; /* gleiche Höhe bei art-breadcrumbs und art-search */
	text-align: right;
}
#art-search .search{
	background-image: url("/main_hp/images/icon-search.gif");
	background-repeat: no-repeat;
	background-position: 15px 50%;
}
#art-search .inputbox{
	color: #999999; /* gleiche Farbe, wie die Lupe */
	background-color: #353535;
	border: none;
	padding-left: 5px;
}
/* #######  ENDE - Einzelbereiche_Header  ####### */

/* #######  Einzelbereiche_Main  ####### */
/* #######  Main - Left  ####### */

#art-left {
/*  border: 1px dashed silver; */
    margin: 0pt 0pt 1.2em 0pt;
    float: left;
    width: 240px; /* = 974 - 2 * margin - 2 * border (alles 0 für art-left) */
	background-color: #262626;
}
#art-left 	div.moduletable {
	margin: 0px 7px 7px 7px;
	border: 3px solid #505050;
	background-color: #353535;
/*	border-radius: 10px;
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;	*/
}
#art-left	div.moduletable h3 { /* Achtung für "moduletable" wird gerne das Modul-Klassen-Sufix "menu" oder "_menu" in Joomla Menüs angehängt. */
	color: #262626;
	background-color: #0AADFF;
	text-align: center;
	font-weight: bold;
	letter-spacing: 0.2em;
	margin: 0; /* Überschreiben der oben definierten Eigenschaften */
	padding: 1px;
/*	background-image:url('/main_hp/images/menu_1px.png'); */
	background-image:url('/main_hp/images/menu_title_bg_dark2.png');
	background-repeat:repeat-x;
}

#art-left 	div.moduletable ul {
/*	list-style-image: url('/main_hp/images/icon-list.png'); */
	list-style-type:none;
	padding: 0;
}
/* Menü - nicht aktiv */
#art-left ul.menu li a , /* Hauptebene */
#art-left ul.menu li.parent ul a , /* erste Unterebene, wichtig um "Menü - aktiv" zu überschreiben */
#art-left ul.menu li.parent span.separator { /* Hauptebene - Überschrift von Unterebenen */
	color: #fff;
	font-size: 1.2em;
	text-decoration: none;
	background-color:#353535;
	display:block; /* ohne wäre width:100% nicht wirksam, da es nur auf Blockelemente anwendbar ist */
	margin:1px 2px; /*seitlich müssen es zwei sein, da sich oben und unten je zwei Kästen berühren und daher auch auf 2 kommen */
	padding: 5px 15px;
	text-align:left;
/*	background-image:url('/main_hp/images/menu_1px_bg.png');
	background-repeat:repeat-x;   */
	background-image:url('/main_hp/images/menu_ltr_bg.png');
	background-repeat:repeat-y;
	border-left: 5px solid #262626;
}
#art-left ul.menu li.parent ul li a { /* li.parent ist notwendig, um die Formatierungen in der Rangfolge höher zu stellen */
	padding-left: 30px; /* 15px erste Ebene + 15px zweite Ebene */
}
/*#art-left ul.menu li.parent span.separator,*/ /* !!! IST FALSCH !!! Darf nur gelten, wenn Eintrag auch aktiv */
#art-left ul.menu li a:hover,
#art-left ul.menu li.parent li:hover a,
#art-left ul.menu li:hover span.separator { /* eventuell wieder abschalten, übergeordneten Kapiteltitel hovern */
	background-color: #0AADFF;
	border-style:none;
/*	background-image:url('/main_hp/images/menu_1px.png');
	background-repeat:repeat-x;   */
	background-image:url('/main_hp/images/menu_ltr_hov.png'); /* vorher: menu_ltr_hov_dark2.png */
	background-repeat:repeat-y;
	border-left: 5px solid #262626;
}
/* Menü - aktiv */
#art-left ul.menu li.active a ,
#art-left ul.menu li.active li.active a,
#art-left ul.menu li.active span.separator { /* active und hover sind nach link und visited zu definieren. Sonst werden deren Eigenschaften übernommen */
	color: #0AADFF;
	font-size: 1.2em;
	text-decoration: none;
	text-align:right;
	border-left: 5px solid #0AADFF;
}
#art-left ul.menu li.active span.separator {
	text-align:left;
}

#art-left ul.menu li.active a:hover,
#art-left ul.menu li.active li.active a:hover,
#art-left ul.menu li:hover span.separator {
	color: #fff;
	background-color: #0AADFF;
/*	background-image:url('/main_hp/images/menu_1px.png');
	background-repeat:repeat-x;   */
	background-image:url('/main_hp/images/menu_ltr_hov.png');
	background-repeat:repeat-y;
}
/* Menü - Untermenü */
#art-left ul.menu ul, /* keine Anzeige erste Untermenüebene */
#art-left ul.menu li:hover ul ul { /* keine Anzeige zweite Untermenüebene, auch dann nicht, wenn erste Ebene angezeigt (gehovert) wird */
	display:none; /* Untermenü wird normalerweise nicht angezeigt */
}
#art-left ul.menu li:hover ul , #art-left ul.menu li.active ul ,
#art-left ul.menu li:hover li:hover ul , #art-left ul.menu li.active li.avtice ul {
	display:block;
}



/* #######  ENDE - Main - Left  ####### */
/* #######  Main - content  ####### */
  #art-content {
/*  border: 1px dashed silver; */
	width: 714px; /* = 974 - 240px(art-left) - 0px (2*margin) - 0px (2*border) - 20px (2 * padding) */
	float: right;
	padding: 0 10px 1.2em 10px;
/*	padding-top: 4em ; *//* art-breadcrumps und art-content border-top müssen die selbe Höhe haben, wie padding-top */
    }
/* #######  Main - content  - heading ####### */
#art-content .contentheading, #art-content .componentheading {
	margin: 0.67em 0; /* gleiche Werte: "#art-content p.buttonheading", "#art-content .contentheading, #art-content .componentheading" */
	color: #0AADFF;
	font-size: 28px;
	font-weight: bold;
	float:left;
	display:inline-block;
	width: 614px;
}
#art-content .componentheading {
	width: 100%;
}
#art-content p.buttonheading {
	margin: 0.67em 0; /* gleiche Werte: "#art-content p.buttonheading", "#art-content .contentheading, #art-content .componentheading" */
	font-size: 28px; /* ist notwendig, damit das Margin in der Einheit "em" die richtige Höhe bekommt*/
	font-weight:bold;
	display:inline-block;
/*	float:right; unnötig */
	right: 0px;
	width: 100px;
}
#art-content .buttonheading a img {
	border : none;
	margin: 0 5px;
	width:16px;
	height:16px;
	right:0px;
}
/* #######  ENDE - Main - content  - heading ####### */
/* #######  Main - Content - Error  ####### */
#system-message
{
margin:10px 0 20px 0;
padding: 0 !important;
background:#fff;
border:solid 0px;
}
#system-message dt { font-weight: bold; }
#system-message dd { margin: 0;  font-weight: bold; text-indent: 0px;background:#fff;padding:0 }
#system-message dd ul { color: #93246F; margin-bottom: 10px; list-style: none; padding: 0px; border-top: 3px solid #93246F; border-bottom: 3px solid #93246F;}

/* System Standard Messages */
#system-message dt.message { display: none; }
#system-message dd.message {  }
#system-message dd.message ul { background: #F2E3ED}

/* System Error Messages */
#system-message dt.error { display: none; }
#system-message dd.error {  }
#system-message dd.error ul { color: #93246F; background: #F2E3ED ; border-top: 3px solid #93246F; border-bottom: 3px solid #93246F;margin:0}

/* System Notice Messages */
#system-message dt.notice { display: none; }
#system-message dd.notice {  }
#system-message dd.notice ul { color: #93246F; background: #F2E3ED; border-top: 3px solid #93246F; border-bottom: 3px solid #93246F;}
/* #######  ENDE - Main - Content - Error  ####### */
/* #######  ENDE - Main - Content  ####### */
/* #######  ENDE - Einzelbereiche_Main  ####### */

/* #######  Einzelbereiche_Footer  ####### */
/* #######  Einzelbereiche_Footer_Menu  ####### */
#art-footer-menu {
	background-color: #262626;
}
#art-footer-menu h3 {
	display: none; /* keine Anzeige der Menüüberschrift */
}
#art-footer-menu  div.moduletable ul.menu{
	margin: 0;
	padding: 0;
}
#art-footer-menu div.moduletable ul.menu li {
	display: inline; /* Shows each item side-by-side */
	list-style-type: none; /* Gets rid of the bullet points */
	float: left;
	padding-right: 2em; /* Provides horizontal separation between menu items */
/*  border-left: 2px solid #505050; */ /* soll dieser Eintrag genutzt werden, muss display auf "inline-BLOCK" stehen */
}
/*  #art-footer-menu div.moduletable ul.menu li:first-child {
	border-left: none;
} */

#art-footer-menu div.moduletable ul.menu a {
	display: block;
}
#art-footer-menu a , #art-footer-menu a:link , #art-footer-menu a:visited  {
	color: #0AADFF;
	border-bottom: 1px dotted #0AADFF;
}
#art-footer-menu a:hover , #art-footer-menu a.hover {
	text-decoration: none;
	border-bottom: 1px dotted #BABABA;
	color: #BABABA;
}

/* #######  ENDE - Einzelbereiche_Footer_Menu  ####### */

/* #######  Einzelbereiche_Footer_inner  ####### */
#art-footer-inner {
/*  border: 1px dashed silver; */
	background-color: #262626;
	text-align: right;
}
#art-footer-inner a , #art-footer-inner a:link , #art-footer-inner a:visited  {
	color: #0AADFF;
	margin: 5px;
}
#art-footer-inner a img {
	border-style: none;
}
#art-footer-inner a:hover , #art-footer-inner a.hover {
	text-decoration: none;
	border-bottom: 1px dotted #BABABA;
	color: #BABABA;
}
/* #######  ENDE - Einzelbereiche_Footer_inner  ####### */

/* #######  Einzelbereiche_Footer_outer  ####### */
#art-footer-outer {
	margin: 0px auto;
	background-color: #262626;
	text-align: center;
}
/* #######  ENDE - Einzelbereiche_Footer_outer  ####### */

/* #######  ENDE - Einzelbereiche_Footer  ####### */

/* #######  ENDE - Deklarationen_für_Einzelbereiche  ####### */

/* ######################################################################### */
/* Einstellungen für Systemkomponenten von Joomla (../system/css/system.css) */
/* ######################################################################### */

/* Unpublished */
.system-unpublished {
background: #e8edf1;
border-top: 4px solid #c4d3df;
border-bottom: 4px solid #c4d3df;
}

/* System Messages */
#system-message    { margin-bottom: 10px; padding: 0;}
#system-message dt { font-weight: bold; }
#system-message dd { margin: 0; font-weight: bold; text-indent: 30px; }
#system-message dd ul { color: #0055BB; margin-bottom: 10px; list-style: none; padding: 10px; border-top: 3px solid #84A7DB; border-bottom: 3px solid #84A7DB;}

/* System Standard Messages */
#system-message dt.message { display: none; }
#system-message dd.message {  }

/* System Error Messages */
#system-message dt.error { display: none; }
#system-message dd.error ul { color: #c00; background-color: #E6C0C0; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B;}

/* System Notice Messages */
#system-message dt.notice { display: none; }
#system-message dd.notice ul { color: #c00; background: #EFE7B8; border-top: 3px solid #F0DC7E; border-bottom: 3px solid #F0DC7E;}

/* Debug */
#system-debug     { color: #ccc; background-color: #fff; padding: 10px; margin: 10px; }
#system-debug div { font-size: 11px;}
/* ######################################################################### */


/* ################################################################ */
/*   Einstellungen für zusätzliche Module, Plugins und Components   */
/* ################################################################ */

/* ########################### contacts ########################### */
div.contact {
margin:10px 0;
}

address {
font-style:normal;
margin:10px 0;
}

address p {
line-height:1em;
}

.contact label {
float:left;
font-weight:bold;
width:14em;
margin:10px 0 0;
}

span.marker {
margin:0 10px 0 0;
}

.contact_email_checkbox label {
float:none !important;
}

.contact label.copy {
width:90%;
padding:0 0 0 10px;
}

.contact form {
/*  background:#EFDEEA; */
/*  color:#000; */
	padding: 20px;
	margin: 10px 0;
	}

.contact input {
	background:#fff;
	border:solid 2px #505050/*#C39*/;
	color:#000;
	padding:2px 2px 0;
	margin:10px 0 0;
	}
.contact .button {
	background:url(/main_hp/images/pfeil.gif) #262626/*#000*/ no-repeat;
	border:0;
	color: #0AADFF /*#fff*/;
	font-weight:bold;
	margin:20px 10px 0 0;
	padding:0 0 0 30px;
	cursor:pointer;
	}
.contact .button:hover  {
	text-decoration: none;
	border-bottom: 1px dotted #BABABA;
	color: #BABABA;
	}

label.textarea {
float:none !important;
margin:10px 0;
display:block;
width:100%;
}

#contact_text {
width:80%;
height:150px;
}

.contact input.invalid,.contact textarea.invalid {
border:solid 2px red;
}

.contact label.invalid {
color:red;
}
/* ########################### ENDE - contacts ########################### */

/* ########################### CountDown ########################### */
#art-left .cdub_main{
	text-align: center;
}
#art-left .cdub_main h2 {
	text-align: center; /* Überschreiben der Default Template Einstellungen */
}
#art-left .cdub_bold{
	font-weight: bold;
	display: block;
	padding-top: 6pt;
}
#art-left .cdub_none{display: none;}
#art-left .cdub_font{
	font-size: 22px;
	font-weight: bold;
}
#art-left .cdub_font_dyn{
	font-size: 22px;
	font-weight: bold;
}
#art-left .cdub_font2{
	font-size: 14px;
	display: block;
	padding-bottom: 6pt;
}
#art-left .cdub_font3{
	font-size: 16px;
	font-weight: bold;
	display: block;
	padding-bottom: 6pt;
}
/* ########################### ENDE - CountDown ########################### */

/* ########################### Login ########################### */
#art-content #com-form-login table,
#art-content #login table {
	width: 100%;
	clear:both;
}
/* ########################### ENDE - Login ########################### */