/* $Id: styles.css,v 1.0 07.06.2006 14:39 kniebes Exp $ 
 * 
 * monolytic style sheet include
 * 
 * Markus Kniebes, kniebes@gmail.com
 * 
 ******************************************************************************/
 
* {
	padding: 0; 
	margin: 0;
}

html { 	height: 101%; }

body {
	font: 0.7em/1.7em "Lucida Grande", Verdana, Arial, Helvetica; sans-serif;
	text-align: center; 
	padding-top: 30px;
	color: #333;
	background-color: #D3D7D7; 
	background-image: url(/_design/bg-body.gif);
	background-position: center;
}

#framebox {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 100px;
	background-color: #D3D7D7;
	background-image: url(/_design/bg-image.gif);
	text-align: center; 
}

#htmlframe {
	margin: 20px auto 0 auto;
	width: 100px; 
	height: 100px;
	border: 5px solid #FFF;
	background-color: #FFF;
	padding: 0;
	font-size: 11px;
	overflow: auto;
}

#frameboxfooter {
	margin: 0 auto;
	padding: 0px 10px;
	width: 690px;
	text-align: right;
	font-size: 11px;
	background-color: #FFF;
}
#frameboxfooter a, 
#frameboxfooter img {
	border: 0; 
	margin: 2px;
}

#container {
	margin: 0 auto;
	width: 600px; 
	background-image: url(/_design/bg-container.gif);
	background-repeat: repeat-y;
}

#top {
	width: 600px; 
	height: 25px; 
	background-color: #B7BBBB;
	background-image: url(/_design/bg-top.gif);
	background-repeat: no-repeat;
	background-position: bottom; 
}
	 

#bottom {
	width: 600px; 
	padding: 20px 0;
	height: auto; 
	background-color: #B7BBBB;
	background-image: url(/_design/bg-bottom.gif);
	background-repeat: no-repeat;
	background-position: top; 
}
#bottom img,
#bottom a {
	border: 0;
	color: #000;
}

#vfh {
	margin: 0 25px; 
	height: 60px;
}

#eyes {
	margin: 0 25px; 
	padding: 0;
	background-image: url(/_design/bg-augen.jpg);
	background-repeat: no-repeat;
	height: 160px;
}

#activityindicator {
	width: 36px; 
	height: 36px; 
	margin: 39px 0 0 265px;
	padding: 0;
	background-repeat: no-repeat; 
}
.active {
	background-image: url(/_design/activity-indicator.gif);
}
.inactive {
	background-image: none; 
}

#navigation {
	margin: 0 25px; 
	background-image: url(/_design/bg-navigation.gif);
	background-repeat: no-repeat;
	background-position: top; 
	height: 34px;
}
#navigation ul {
	list-style-type: none; 
	height: 20px; 
	margin: 0; 
	padding: 0;
	overflow: hidden;
}
#navigation ul li {
	float: left; 
	border-left: 1px solid #FDFFFB;
	border-right: 1px solid #C8CAC6;
	margin: 0;
	padding: 0;
}
#navigation ul li.left {
	border-left: 0;
}
#navigation ul li.right {
	border-right: 0;
}
#navigation ul li a {
	display: block;
	padding: 0;
	text-decoration: none; 
	color: #A66;
	line-height: 1.8em; 
	text-align: center;
}
#navigation ul li a:hover {
/*	font-weight: bold; */
	color: #A33;
	text-decoration: underline;
}


#content {
	clear: both;
	margin: 0 25px; 
	padding: 20px 40px 60px 40px;
	background-image: url(/_design/bg-content.gif);
	background-repeat: no-repeat;
	background-position: bottom; 
	height: auto;
	text-align: left;
}

#footer {
	margin: 0 25px; 
	padding: 30px 20px;
	text-align: right;
	background-image: url(/_design/bg-footer.gif);
	background-repeat: no-repeat;
	background-position: top; 
	height: auto;
}




/* Ajax inset 
*/
#anav {
	margin: 0 25px;
	border-top: 1px solid #FDFFFB;
	border-bottom: 1px solid #C8CAC6;
	text-align: left;
	color: #335;
}
#anav .box {
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #C8CAC6;
	padding: 5px 0;
	background-image: url(/_design/bg-anav.gif);
	background-repeat: no-repeat; 
	background-position: top;
}
#anav .lastbox {
	border-top: 1px solid #FFF;
	padding: 5px 0;
	background-image: url(/_design/bg-anav.gif);
	background-repeat: no-repeat; 
	background-position: top;
}
#anav h3 { 
	padding: 10px 20px;
	font-size: 1.2em; 
	font-weight: bold; 
	text-align: center;
	border-bottom: 1px solid #C8CAC6;
	background-image: url(/_design/bg-anav.gif);
	background-repeat: no-repeat; 
	background-position: top;	
}
#anav h4 {
	padding: 2px 0 2px 20px; 
	background-color: transparent; 
	text-align: center;
	letter-spacing: 2px; 
}
#anav h5 {
	letter-spacing: 2px; 
	text-transform: uppercase; 
	font-size: 1em;
}
#anav a {
	border: 0; 
}
#anav ul {
	margin: 0 0 20px 0; 
	padding: 0 20px; 
	list-style-type: none;
}
#anav ul li {
	padding: 0 5px 0 20px;
}
#anav fieldset {
	border: 0; 
	padding: 10px 60px;
}
#anav label.left {
	float: left;
	text-align: right;
	width: 90px;
	margin-right: 10px;
}
#anav input.text, 
#anav textarea {
	border: 1px solid #FFF;
	background-color: #D3D7D7;
	padding: 1px; 
	font: 1em "Lucida Grande", Verdana, Arial, Helvetica; sans-serif;
	background-image: url(/_design/bg-input.gif);
}
#anav input:focus, 
#anav textarea:focus {
	border: 1px solid #F66;
}
#anav input.text { width: 300px; }
#anav textarea { width: 400px; }
#anav input.submit {
	font: 0.9em "Lucida Grande", Verdana, Arial, Helvetica; sans-serif;
	font-weight: bold; 
	padding: 1px 5px;
	background-color: #D3D7D7;
	border-width: 1px; 
	border-style: solid; 
	border-color: #FFF #C8CAC6 #C8CAC6 #FFF; 
}




/*******************************************************************************
 * 
 * Imagereplacement for graphics headings 
 *
 ******************************************************************************/

.replace { 
	position:relative; 
	margin:0px; 
	padding:0px; 
	/* hide overflow:hidden from IE5/Mac */ 
	/* \*/ 
	overflow: hidden; 
	/* */ 
} 
.replace span { 
	display:block; 
	position:absolute; 
	top:0px; 
	left:0px; 
	z-index:1; /*for Opera 5 and 6*/ 
}

/* Heading */
#head-vfh,
#head-vfh span { 
	width: 550px; 
	height: 60px; 
	background-image: url(/_design/bg-vomfeenhaus.jpg); 
	font-size: 10px; 
} 


/* News */
#head-news,
#head-news span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-news.jpg); 
	font-size: 10px; 
} 

/* Galerien */
#head-galerien,
#head-galerien span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-galerien.jpg); 
	font-size: 10px; 
} 

/* Gaestebuch */
#head-gb,
#head-gb span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-gaestebuch.jpg); 
	font-size: 10px; 
} 

/* Impressum */
#head9,
#head9 span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-impressum.jpg); 
	font-size: 10px; 
} 

/* Ueber uns */
#head8,
#head8 span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-ueber-uns.jpg); 
	font-size: 10px; 
} 

/* Dei Hobbyzucht */
#head28,
#head28 span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-hobbyzucht.jpg); 
	font-size: 10px; 
} 

/* Leonard */
#head11,
#head11 span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-leonard.jpg); 
	font-size: 10px; 
} 

/* Valentin */
#head31,
#head31 span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-valentin.jpg); 
	font-size: 10px; 
} 

/* Links */
#head13,
#head13 span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-links.jpg); 
	font-size: 10px; 
} 

/* Wendy */
#head17,
#head17 span { 
	width: 470px; 
	height: 85px; 
	background-image: url(/_design/headlines/hl-wendy.jpg); 
	font-size: 10px; 
} 




/*******************************************************************************
 * 
 * Text related styles 
 *
 ******************************************************************************/

h1 {
	font-size: 1.1em; 
	font-weight: bold; 	
	text-transform: uppercase; 
}

h2 {
	font-size: 1.2em; 
	font-weight: normal; 	
	text-align: center;
	text-transform: uppercase; 
	letter-spacing: 5px; 
	color: #336;
}

h3 {
	font-size: 1em; 
	font-weight: bold; 	
	padding: 10px 0 0 10px;
	margin: 0;
	background-image: url(/_design/bg-content.gif);
	background-repeat: no-repeat; 
	background-position: bottom;	
}
h3 a {
	border: 0; 
	text-decoration: none; 
	color: #333;
}

h4 {
	font-size: 1.0em; 
	font-weight: bold; 	
	margin: 0;
	padding: 0 20px; 
	background-color: #D3D7D7; 	
}
h4 a {
	display: block;
	border: 0; 
	text-decoration: none; 
	color: #686A6E;
}

p {
	margin-bottom: 7px; 
}
p.subtitle {
	margin: 0; 
	color: #999;
}
p.newsfooter {
	text-align: right; 
	color: #A66;
	font-size: 0.9em;
	padding-right: 20px; 
	background-image: url(/_design/bg-anav.gif);
	background-repeat: repeat-x;
	background-position: top; 	
	border-top: 1px solid #FFF; 
	border-right: 1px solid #D3D7D7; 	
}
p.newsfooter a {
	color: #A66;
	border: 0;
}

p.le { 
	float: left; 
}
p.re {
	float: right;
}

pre, 
code {
	font: 1em "Courier New", Mono; 
	color: #446;
}


ul, 
ol {
	padding-left: 12px; 
	margin-left: 12px;
}


a {
	color: #A33;
	text-decoration: none; 
	border-bottom: 1px dotted #3A3;
}
a.nob {
	border-bottom: 0; 
}

a.rsslink {
	padding-left: 12px;
	background-image: url(/_design/feed-icon-10x10.png);
	background-repeat: no-repeat;
	background-position: left center;
}

pre {
	font: 11px "Courier New", Mono; 
}

span.bright {
	color: #999;
}

/* Artikel / Newsartikel */
.article,
.newsarticle {
	clear: both;
	margin-bottom: 50px; 
}
.articlebody {
	margin: 0;
	padding: 10px; 
	background-image: url(/_design/bg-anav.gif);
	background-repeat: repeat-x;
	background-position: top; 
	border-top: 1px solid #FFF;
	border-left: 1px solid #D3D7D7; 
	border-right: 1px solid #D3D7D7; 
	border-bottom: 1px solid #D3D7D7; 
}



/*******************************************************************************
 * 
 * Comment and Guestbook related styles
 *
 ******************************************************************************/

.comments_error {
	color: #A33; 
}

ol.comments {
	list-style-position: inside;
	margin: 0; 
	padding: 0; 
}
ul.guestbook {
	list-style-type: none;
	margin: 0 0 20px 0; 
	padding: 0;
	border-top: 1px solid #D3D7D7; 	
}
ol.comments li,
ul.guestbook li {
	margin: 0;
	padding: 10px;
}
ul.guestbook li.middle {
	background-image: url(/_design/bg-anav.gif);
	background-repeat: repeat-x;
	background-position: top; 
	border-top: 1px solid #FFF;
	border-left: 1px solid #D3D7D7; 
	border-right: 1px solid #D3D7D7; 
	border-bottom: 1px solid #D3D7D7; 
}

ol.comments h4 {
	display: inline;
	padding: 0; 
	font-size: 0.9em; 
	font-weight: bold; 
	background-color: transparent; 
}
ul.guestbook h4 {
	padding: 0; 
	font-size: 0.9em; 
	font-weight: bold; 
	background-color: transparent; 
}
ol.comments a,
ul.guestbook a {
	border: 0; 
	display: inline;
}

p.comment label.left {
	float: left;
	text-align: right;
	width: 90px;
	margin-right: 10px;
}
p.comment input, 
p.comment textarea {
	border: 1px solid #FFF;
	background-color: #D3D7D7;
	padding: 1px; 
	font: 1em "Lucida Grande", Verdana, Arial, Helvetica; sans-serif;
	background-image: url(/_design/bg-input.gif);
}
p.comment input:focus, 
p.comment textarea:focus {
	border: 1px solid #F66;
}
p.comment input { width: 200px; }
p.comment textarea { width: 300px; }
input.submit,
input[type=submit] {
	font: 0.9em "Lucida Grande", Verdana, Arial, Helvetica; sans-serif;
	font-weight: bold; 
	padding: 1px 5px;
	background-color: #D3D7D7;
	border-width: 1px; 
	border-style: solid; 
	border-color: #FFF #C8CAC6 #C8CAC6 #FFF; 
}





/*******************************************************************************
 * 
 * Banner and Link related styles
 *
 ******************************************************************************/
 
ul.links {
	padding: 0; 
	margin: 0; 
	list-style-type: none; 
	border-left: 1px solid #D3D7D7; 
	border-right: 1px solid #D3D7D7; 
	border-bottom: 1px solid #D3D7D7; 
	background-image: url(/_design/bg-anav.gif);
	background-repeat: repeat-x;
	background-position: top; 
}
ul.links img {
	border: 1px solid #000;
}
ul.links li {
	height: 18px; 
	overflow: hidden;
}
ul.links li a {
	border: 0; 
	display: block; 
	padding: 0 0 0 20px; 
}
ul.links li a:hover {
	background-color: #D3D7D7;
}






/*******************************************************************************
 * 
 * Gallery related styles
 *
 ******************************************************************************/

div.galleryphotos {
	border-left: 1px solid #D3D7D7; 
	border-right: 1px solid #D3D7D7; 
	border-bottom: 1px solid #D3D7D7; 
	background-image: url(/_design/bg-anav.gif);
	background-repeat: repeat-x;
	background-position: top; 
	text-align: left;
}
div.galleryphotos ul {
	list-style-type: none;
	margin: 0 0 1px 0;
	padding: 20px 0 10px 16px;
}
div.galleryphotos ul li {
	display: inline; 
	margin: 6px;
	width: 132px; 
	height: 92px;
	overflow: hidden;
}
div.galleryphotos ul li a {
	border: 0; 
	padding: 0;
	margin: 0;
	background-color: transparent;
}
div.galleryphotos ul img {
	border: 0; 
	background-image: url(/_design/bg-gallerythumb.gif);
	padding: 6px;
}

.thumb a {
	border: 0; 
	padding: 0;
	margin: 0;
	background-color: transparent;
}

.thumb img {
	border: 0; 
	background-image: url(/_design/bg-gallerythumb.gif);
	padding: 6px;
}


/*******************************************************************************
 * 
 * Lightbox related styles
 *
 ******************************************************************************/

#lightbox {
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img, 
#lightbox a { 
	border: none; 
}

#outerImageContainer {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}

#imageContainer {
	padding: 10px;
}

#loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#imageContainer>#hoverNav { 
	left: 0;
}
#hoverNav a { 
	outline: none;
}

#prevLink, 
#nextLink {
	width: 49%;
	height: 100%;
	background: transparent url(/_design/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
}
#prevLink { 
	left: 0; 
	float: left;
}
#nextLink { 
	right: 0; 
	float: right;
}
#prevLink:hover, 
#prevLink:visited:hover { 
	background: url(/_design/prev.gif) left 15% no-repeat; 
}
#nextLink:hover, 
#nextLink:visited:hover { 
	background: url(/_design/next.gif) right 15% no-repeat; 
}


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
}

#imageData{
	padding:0 10px;
}
#imageData #imageDetails { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#imageData #caption { 
	font-weight: bold;	
}
#imageData #numberDisplay { 
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
	}
#imageData #bottomNavClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;
}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #D3D7D7;
	background-image: url(/_design/bg-image.gif);
}

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
}	


/* Stammbaum */
table.stammbaum {
	font: 10px "Lucida Grande", Arial, Helvetica, Sans-Serif;
	margin: 0;
	padding: 0;
}
table.stammbaum tr.head {
	background-color: #CCCCCC;
	border-bottom: 1px solid #B7BBBB;
	font-weight:: bold;
}
table.stammbaum td {
	border-bottom: 1px solid #B7BBBB;
	border-right: 1px solid #B7BBBB;
	padding: 2px;
	margin: 1px 0 0 0;
}
table.stammbaum td.vater {
	background-color: #ECF0F1;
}
table.stammbaum td.mutter {
	background-color: #F1F0EC;
}