
/****************/
/* PageElements */
/***************/

body#root {
 background: #333333;
 color: #CCCCCC;
 font-weight: normal;
 font-size: 11px;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 margin: 0;
 padding: 0;
}

.alignleft {
 margin: 0 10px 0 0!important;
 float: left;
}

.alignright {
 margin: 0 0 0 10px!important;
 float: right;
}

/**************************************/
/* 1. CSS-Modul: COLORS               */
/**************************************/
.neutralColorTrans {background-color: transparent}
.neutralColorWhite {background-color: #fff}
.neutralColorLight {background-color: #5e5e5e}
.neutralColorMedium {background-color: #464646}  
.neutralColorStrong {background-color: #333}   
.neutralColorBlack  {background-color: #000}
.teaserColor {background-color: #9999CC;}
.neutralColorRed { background-color: #E60003; }

/*****************************************************************************/
/* 2. CSS-Modul: LAYOUT                                                      */
/* taken from: Position is Everything                                        */
/* http://positioniseverything.net/articles/onetruelayout/appendix/holygrail */
/*****************************************************************************/

#box { width: 1000px; border-right: 1px solid #000; }
#addEntry { float: none; clear: both; width: 600px; margin: 0; }

#content_wrapper {
 float: left;
 width: 100%;
}
#content {
 margin: 10px 200px 10px 200px;
}
#contentWide {
  margin: 10px 10px 10px 200px;
}
#left {
 float: left;
 margin: 0 0 0 -100%;
 width: 200px;
 }
#right {
 float: right;
 margin: 0 0 0 -100%;
 width: 200px;
 padding: 25px 0 0 0;
}

#container:after {
	content: '[DO NOT LEAVE IT IS NOT REAL]'; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}
#container {
	display: inline-block;
	width: 100%;
	}

#footer {
  clear:left;
  padding:0px;
  margin:0px;
  background-color: #464646;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  height: 20px;
  line-height: 20px;
  width: 100%;
  font-size: 11px;
}
/*    End of Layout Blocks  */

#footer a {
  display: block;
  float: left;
  color: #d1d1d1;
  background-color: #464646;
  line-height: 20px;
  width: 180px;
  padding: 2px 0 0 0;
  text-decoration: none;
  border-right: 1px solid #000;
  padding: 0 0 0 10px;
}
#footer a:hover {
  display: block;
  float: left;
  color: #ccc;
  background-color: #545454;
  line-height: 20px;
  width: 180px;
  padding: 2px 0 0 0;
  text-decoration: none;
  border-right: 1px solid #000;
  padding: 0 0 0 10px;
}
#footer #bookmarking a {
  display: block;
  float: right;
  width: 20px;
  padding: 0;
  background-color: #464646;
  text-decoration: none;
  border-right: 0 none;
  padding: 0 0 0 5px;
}
#footer #bookmarking a img {
  width: 20px;
  height: 20px;
}
#footer #bookmarking a:hover {
  display: block;
  float: right;
  width: 20px;
  background-color: #464646;
  text-decoration: none;
  border-right: 0 none;
}
#top {
  text-align: left;
  background-color: #545454;
  margin: 0;
  padding: 0;
}

#logo {
 background-color: #545454;
 text-align: center;
 height: 55px;
 background-image: url(common/f.gif);
 background-repeat: no-repeat;
 background-position : 60px 5px;
}
#logo img {
  margin-top: 18px;
}

#hotpick {
    margin: 0 5px;
    padding: 0 5px;
    float: right;
    text-align: center;
}
/*
#hotpick h3 {
    background-color: #5e5e5e;
    padding-left: 5px;
    border: 1px solid #111; 
}
*/
#pageNavigation {
  width: 180px;
  height: 20px;
  background-color: #464646;
  margin: 0;
  bottom: 0;
  border-right: 1px solid #000;
  float: left;
}
#pageNavigation a img {
  padding: 4px 0 0 10px;
}

/*-- // BreadCrumbs // */
#breadcrumbs {
  background-color: #464646;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  height: 20px;
  line-height: 20px;
  width: 100%;
  float: left;
  font-size: 11px;
}
#breadcrumbs .hint {
  display: block;
  float: left;
  padding: 0 0 0 10px;
  border-right: 1px solid #000;
  height: 20px;
  width: 180px;
} 
#breadcrumbs a {
  display: block;
  float: left;
  color: #d1d1d1;
  background-color: #464646;
  line-height: 20px;
  width: 190px;
  padding: 0;
  text-decoration: none;
  border-right: 1px solid #000;
 text-indent: 10px;
}
#breadcrumbs a:hover {
  display: block;
  float: left;
  color: #ccc;
  background-color: #545454;
  line-height: 20px;
  width: 190px;
  padding: 0;
  text-decoration: none;
  border-right: 1px solid #000;
 text-indent: 10px;
}
#breadcrumbs .now {
  display: block;
  float: left;
  line-height: 20px;
  width: 190px;
  padding: 2px 0 0 0;
  text-decoration: none;
  padding: 0 0 0 10px;
}

/* Wetter Flash Object */
#wetter {
  margin: 20px 0 0 8px;
}

.riva {
  display: block;
}
.modul {
  display: block;
  margin: 0 0 20px 0;
}

/**************/
/* Navigation */
/**************/
ul#treeNavigation {
  list-style-type: none;
  background: #464646;
  margin: 0;
  padding: 0;
  width: 190px;
}

/*////////////*/
/* 1st Level  */
/*////////////*/
ul#treeNavigation li {
  border-bottom: 1px solid #333;
  border-top: 0px;
  margin: 0;
}
ul#treeNavigation li a {
  background-image: url(common/arrow_f.gif);
  background-repeat: no-repeat;
  background-position: 5px 4px;
  padding: 0 0 0 20px;
  line-height: 24px;
  font-size: 11px;
  text-decoration: none;
  color: #fff;
  display: block;
  background-color: #464646;
}
ul#treeNavigation li a:hover {
  background-color: #565656;
}
ul#treeNavigation li a.active {
  line-height: 24px;
  font-size: 11px;
  text-decoration: none;
  color: #fff;
  background-color: #5E5E5E;
}
ul#treeNavigation li a.active:hover {
  line-height: 24px;
  font-size: 11px;
  text-decoration: none;
  color: #fff;
  background-color: #707070;
}
ul#treeNavigation li a.activenode {
  line-height: 24px;
  font-size: 11px;
  text-decoration: none;
  color: #fff;
  background-color: #5E5E5E;
}
ul#treeNavigation li a.activenode:hover {
  line-height: 24px;
  font-size: 11px;
  text-decoration: none;
  color: #fff;
  background-color: #707070;
}

/*////////////*/
/* 2nd Level  */
/*////////////*/

ul#treeNavigation ul {
  list-style-type: none;
  background: #868686;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}
ul#treeNavigation ul li {
  border-bottom: 1px solid #333;
  border-top: 1px solid #333;
  border-bottom: 0px;
}
ul#treeNavigation li ul li a {
  background-image: url(common/arrow_f_sub.gif);
  background-repeat: no-repeat;
  background-position: 10px 4px;
  padding: 0 0 0 25px;
  font-size: 11px;
  text-decoration: none;
  color: #000;
  background-color: #868686;
}
ul#treeNavigation li ul li a:hover {
  background-color: #989898;
}
ul#treeNavigation li ul li a.active {
  font-size: 11px;
  text-decoration: none;
  color: #000;
  background-color: #B1B1B1;
}
ul#treeNavigation li ul li a.active:hover {
  line-height: 24px;
  font-size: 11px;
  text-decoration: none;
  color: #000;
  background-color: #BEBEBE;
}
ul#treeNavigation li ul li a.activenode {
  font-size: 11px;
  text-decoration: none;
  color: #000;
  background-color: #B1B1B1;
}
ul#treeNavigation li ul li a.activenode:hover {
  line-height: 24px;
  font-size: 11px;
  text-decoration: none;
  color: #000;
  background-color: #BEBEBE;
}

/*////////////*/
/* 3rd Level  */
/*////////////*/

ul#treeNavigation li ul li ul li a {
  background-image: url(common/arrow_f_sub.gif);
  background-repeat: no-repeat;
  background-position: 15px 4px;
  padding: 0 0 0 30px;
  font-size: 11px;
  text-decoration: none;
  color: #000;
  background-color: #C0C0C0;
}
ul#treeNavigation li ul li ul li a:hover {
  background-color: #d3d3d3;
}

/***************/
/*   Links     */
/***************/
a {
	color: #9999CC;
	text-decoration : none;
}
a:hover {
	color: #9999CC;
	text-decoration : underline;  
}
a:active {
	color: #9999CC;
}
a:visited {
	color: #9999CC;
}

/*********************/
/* Textbody-Elements */
/*********************/
h1, p.heading1 {
	color : #CCCCCC;
	font-size: 12px;
	font-weight: bold;
	margin: 0 0 10px 0;
}

h2, p.heading2 {
	color : #A0A0A0;
	font-size: 12px;
	font-style : italic;
	font-weight: bold;
}

h3 {
	color : #A0A0A0;
	font-size: 11px;
	font-style : italic;
}
p {
	color : #CCCCCC;
	font-size: 11px;
	margin: 0 0 10px 0;
}


/*  Listen  */
#content ul {
  margin: 0 0 10px 10px;
  list-style-position: inside;  
}
#contentWide ul {
  margin: 0 0 10px 10px;
  list-style-position: inside;  
}
ul li {
  color : #CCCCCC;
  margin: 0 0 0 10px;
  padding: 0;
  list-style-position: outside;
  font-size: 11px;
}
ul#index {
  display: block;
  float: none;
  clear: both;
  margin: 0 0 0 10px;
  padding: 0;
}
ul#index li {
  margin: 0 0 5px 20px;
}

/**********************/
/*  ZMS Graphics   */
/**********************/
div.ZMSGraphic {
  background-color: transparent;
  margin: 0;
  padding: 0;
}
div.ZMSGraphic .graphic {
  margin: 10px;
}
div.ZMSGraphic .text {
  margin: 0;
  padding: 0;
}
div.ZMSGraphic .graphic img {
  display: block;
  border: 0;
}
div.ZMSGraphic a.zoom {
  text-align: right;
  display: block;
  height: 18px;
  width: 18px;
  background: transparent url(http://www.frosthelm.de/common/css/zoom.gif) 0 0 no-repeat;
  border-bottom:1px solid #999999;
  border-right:1px solid #999999;
}
div.ZMSGraphic a.zoom:hover {
  background-color: #444;
}
div.ZMSGraphic a.zoom img{
  border: 0;
  float: right;
  background-color: #4A4A4A;
}

/*
.ZMSGraphic.right {
  float: right;
  margin:0 0 0 10px !important;
}
*/
/**********************/
/* Teaser */
/**********************/
#teaser {
  width: 188px;
  padding: 0;
  margin: 10px 2px 0 5px;
}

.ZMSTeaserContainer {
  width: 188px;
  border:1px solid #000000;
  margin-bottom:5px;
}

.ZMSTeaserContainer .graphic img.title {
  padding: 0;
  margin: 0;
}
.ZMSTeaserElement {
  width: 188px;
}

.ZMSTeaserElement .title {
  padding: 4px;
  text-align: center;
  border-bottom: 1px solid #000;
}
#right .ZMSTeaserContainer .ZMSTeaserElement .title  {
  color: #000;
}
.ZMSTeaserElement .text {
  padding: 4px;
  text-align: left;
  width: 180px;
}

/* ****** Datei ****** */
.teaserElement {
  width: 188px;
  padding: 0;
  margin: 10px 2px 0 5px;
  background-color: #5e5e5e;
  border: 1px solid #000;
  font-size: 11px;
  border-collapse : collapse;
}
.teaserElement .title {
  text-align: center;
  width: 188px;
  height: 15px;
  color: #000;
  font-weight: bold;
  padding: 4px;
  background-color: #464646;
  border-bottom: 1px solid #000;
}
/**********************/
/* Google Maps        */
/**********************/
#map { 
 font-size: 10px;
 color: #111;
 float: none;
 clear: both;
 margin: 20px 0 10px 0;
}

.mapH {
 font-weight: bold;
}
.mapP {
 font-size: 9px;
}

/*******************/
/* Gaestebuch      */
/*******************/
form#guestbook {
  float: none;
  clear: both;
  display:table;
}

/* Eintraege */
.guestbookItem {
  margin: 20px 0 0 0;
  padding: 5px;
  font-size: 11px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  border-left: 1px solid #000;
}
.entryTitle {
  background-color: #5e5e5e;
  border: 1px solid #000;
  font-weight: bold;
  font-size: 11px;
  padding: 5px;
  font-size: 9pt;
  color: #ccc;
  float: none;
  clear: both;
}
.entryComment {
  background-color: #464646;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #000;
  padding: 10px 5px 10px 5px;
  line-height: 12pt;
  font-size: 11px;
  color: #ccc;
}
.entryItem {
  width: 120px;
/*  height: 15px; */
  display: block;
  float: left;
}
.entry {
  width: 440px;
/*  height: 18px; */
  display: block;
}
#bookNav {
  display: block;
  margin: 20px 0 0 0;
  padding: 5px;
}

/*  Eintrag hinzufuegen  */
#addEntry span {
  margin: 0 0 10px 0;
}
#addEntry form input, .entry input {
 font-weight: normal;
 font-size: 11px;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 background-color: #dedede;
 border:1px solid #000000;
}
#addEntry form .addTitle input {
 width: 480px;
 margin: 0 0 5px 0;
}
#addEntry form .addComment textarea {
 font-weight: normal;
 font-size: 11px;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 background-color: #dedede;
 width: 480px;
 border:1px solid #000000;
}
#addEntry form .buttons {
 padding-left: 120px;
 width: 100%;
 float: none;
 clear: both;
}
form .buttons input {
 font-weight: normal;
 font-size: 11px;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 width: 130px;
 margin: 10px 10px 0 0;
 float: left;
}
#addEntry sup {
  color: gray;
 font-size: 11px;
}
input.error,
textarea.error {
  border:1px dotted red !important;
  background-color:#FFDEDE !important;
}
label.error {
  color: red;
  display: block;
}

.clearer {
  clear: both;
  float: none;
}

/*******************/
/*    Tabellen     */
/*******************/

#content .ZMSTable, #contentWide .ZMSTable {
  table-layout: auto;
  border-collapse: collapse;
  border: 0;
  width: auto;
  display: block;
  margin-bottom: 10px;
  clear: left;
  float: left;
}
#content .ZMSTable col, #contentWide .ZMSTable col {
  width: auto;
}
#content .ZMSTable caption, #contentWide .ZMSTable caption {
  background-color: #4A4A4A;
  color: #ccc;
  font-weight: bold;
  white-space: nowrap;
  padding: 3px;
  border-bottom: 1px dashed #000;
}
#content .ZMSTable tr.odd td, #contentWide .ZMSTable tr.odd td {
  background-color: #464646;
  white-space: nowrap;
  padding: 3px;
}

#content .ZMSTable tr.even td, #contentWide .ZMSTable tr.even td {
  background-color: #5e5e5e;
  white-space: nowrap;
  padding: 3px;
}
#content .ZMSTable tr.even td p, #content .ZMSTable tr.odd td p,
#contentWide .ZMSTable tr.even td p, #contentWide .ZMSTable tr.odd td p {
  color: #ccc;
  margin: 0;
}

/*************************/
/* Content Teaser Objekte */
/*************************/

.contentTeaser {
  float: left;
  border: 1px solid #000;
  margin: 10px 15px 0 0;
  width: 180px;
  background-color: #545454;
  padding: 0;
 }

/*  Formatierung  */
.contentTeaserHead {
  display: block;
  padding: 3px 5px 3px 5px;
  background-color: #464646;
  color: #ccc;
  font-size: 11px;
  font-weight: bold;
  text-align: center;
  text-transform : uppercase;
  line-height: 12pt;
  width: 170px;
}

#content .contentTeaser ul, #content .contentTeaser li,
#contentWide .contentTeaser ul, #contentWide .contentTeaser li {
  list-style: none;
  margin: 0;
  padding: 0;
  list-style-position: outside;
}
.contentTeaser ul li a, .contentTeaser ul li a:visited {
  color: #eee;
  text-decoration: none;
  font-size: 11px;
  height: 10pt;
  padding: 2px 2px 2px 5px;
  display: block;
  border-top: 1px solid #000;
}
.contentTeaser ul li a:hover {
  color: #eee;
  text-decoration: none;
  font-size: 11px;
  height: 10pt;
  padding: 2px 2px 2px 5px;
  display:block;
  border-top: 1px solid #000;
  background-color: #5e5e5e;
}

/*******************/
/* Sitemap         */
/*******************/

TD.sitemapTitle0 {
  background-color: #464646;
}

TD.sitemapTitle1 {
  background-color: #5E5E5E;
}

A.sitemapTitle0:link, A.sitemapTitle0:visited ,
A.sitemapTitle1:link, A.sitemapTitle1:visited {
  display: block;
  float: left;
  color: #d1d1d1;
  background-color: #464646;
  line-height: 20px;
  width: 180px;
  padding: 2px 0 0 0;
  text-decoration: none;
  border-right: 1px solid #000;
  padding: 0 0 0 10px;
}

A.sitemapTitle0:hover, A.sitemapTitle0:active ,
A.sitemapTitle1:hover, A.sitemapTitle1:active {
  display: block;
  float: left;
  color: #ccc;
  background-color: #545454;
  line-height: 20px;
  width: 180px;
  padding: 2px 0 0 0;
  text-decoration: none;
  border-right: 1px solid #000;
  padding: 0 0 0 10px;
}

A.sitemapElement0:link, A.sitemapElement0:visited {
  font-weight: normal;
  text-decoration: none;
  color: #ccc;
}
A.sitemapElement1:link, A.sitemapElement1:visited {
  font-weight: bold;
  text-decoration: none;
  color: #ccc;
}

A.sitemapElement0:hover, A.sitemapElement0:active ,
A.sitemapElement1:hover, A.sitemapElement1:active {
  color: #ccc;
  text-decoration: underline;
}


/*************************/
/* Management Interface  */
/*************************/

a.zmi img { margin-right: 3px; }

.cmsTxtColorStrong0 { color: #000066; } /* primColorStrong0 */
.cmsTxtColorStrong1 { color: #666666; } /* neutralColorStrong0 */
.cmsBgColorStrong0 { background-color: #000066; } /* primColorStrong0 */
.cmsBgColorStrong1 { background-color: #CCCCCC; } /* neutralColorLight0 */
.cmsBgColorMedium0 { background-color: #E8F2F9; } /* primColorLight0 */
.cmsBgColorLight0 { background-color: #FFFFFF; } /* neutralColorWhite */

.ftTH { background-color:#cccccc; }
.ftTD { background-color:#efefef; }

/*  ZMI Interface */
table tr td h1, 
table tr td h2, 
table tr td h3, 
table tr td div.ZMSGraphic div.text p,
table tr td p,
table tr td ul,
table tr td li {
 color: #000;
}

input {
  font-size: 9pt;
}
p.emphasis {
  background-color: #ccc;
  border: 1px dashed #333;
  padding: 10px;
  margin: 10px;
  font-size: 8pt;
  color: #000;
  float: none;
  clear: both;
}

/* EDIT Button */
#footer a.edit, #footer a.edit:hover {
  background-color: #464646;
  text-decoration: none;
  display: inline;
  text-align: right;
  color: #222;
  float: right;
  border: 0;
  width: 5px;
  height: 5px;
}
