@charset "utf-8";
/* CSS Document */
@import "navi.css";
@import "page-bottom.css";
@import "detail.css";


html,body{
		margin:0;
		padding:0;
		}

body{ 	background: url(../layout/body-bg.png);
		font-family:Arial;
		color: #999;
		}
	

.de{ text-transform: uppercase; padding:0; margin:0;}
.en{ text-transform: lowercase; padding:0; margin:0;}

.top-navigation-sub li a.de{ margin-right: 10px;}
h1{ font-size: 24px; color:#000;font-weight:normal;margin-bottom:30px !important;}
h2{ font-size: 18px; color:#b66625; font-weight:normal;}
h3{}
h4{}
h5{}
h6{}

a{ text-decoration:none}

.clear-0{clear:both;}
.clear-50{clear:both; height:50px; background:#fff; width:1020px; margin:auto;}
.clear-50s{clear:both; height:50px; background:#fff; width:100%; margin:auto;}

.clear-100{clear:both; height:100px}
.clear-200{clear:both; height:200px}

.left{float: left;}
.right{float: right !important;}

.orange{ color: #b66625 !important;}
h2.green{ color: #093 !important; }

.image-100{ width: 100% !important; }
/********************>SWAP********************/

section.swap{
		width: 170px;
		height: 170px;
		float:left;
		background-repeat:no-repeat;
		background-size:cover;
		background-position:center;
		}
		
section.swap#single{
		margin-right: 30px;
		}
		
section.swap article{
		background-color: #333;
		width: 0px;
		height:170px;
		color: #fff;
		overflow:hidden;
		opacity: 0.8;
		}

section.swap article h1{
		color: #b66625;
		margin: 10px;
		font-size:18px;
		}

section.swap article p{
		margin:10px;
		font-size:14px;
		}

/********************>READ-MORE BUTTON********************/
section.read-more{
		background: #b66625;
		position:relative;
		width: 150px;
		height:35px;
		color: #fff;
		font-size: 20px;
		background-image:url(../layout/pfoten/pfote-hellbraun.png);
		background-position: 127px 10px;
		background-repeat:no-repeat;
		cursor:pointer;
		}
		
section.read-more:hover{
		background-image:url(../layout/pfoten/pfote-schwarz.png);
		transition: background-color 500ms linear;
		-webkit-transition: background-image 500ms;
    	-moz-transition: background-image 500ms;
    	-o-transition: background-image 500ms;
   	 	-ms-transition: background-image 500ms;
    	transition: background-image 500ms;
		}
		
section.read-more:hover  > article{
		background-color: #000;
		-webkit-transition: background-color 500ms linear;
    	-moz-transition: background-color 500ms linear;
    	-o-transition: background-color 500ms linear;
   	 	-ms-transition: background-color 500ms linear;
		}

section.read-more article{
		width: 120px !important;
		height:100%;
		background-color:#c37433;
		}
		

section.read-more article header{
		background-color: transparent;
		color: #fff;
		line-height: 35px;
		width:100%;
		text-align:center;
		cursor:pointer;
		}

section.read-more article header a{
		text-decoration:none;
		color: #fff;
		}

/*****************************************************/
section.line, section.line-small{
		height: 3px;
		width:100%;
		margin: 0px 50px 30px 0px;
		background-image:url(../layout/content-line.png);
		background-repeat:no-repeat;
		background-position:top;
		background-size:cover;
		opacity:0.3;
	}		
!
section.line-small{
		width:300px;}

header{
		position:relative;
		z-index:10;
		}


/********************HEADER********************/
.page-header{
		background: #b66625;
		width:1020px;
		height:300px;
		margin:auto;
		background-image:url(../layout/header-bg.png);
		background-size:cover;
		cursor:pointer;
	}

.page-header img{
	margin-left: 30px;}


/********************OVERALL-PANEL********************/

section.overall-panel{}

section.overall-panel article{
		position:relative;
		margin-bottom: 50px;
		width:465px;
		border: #CCC thin solid;
		overflow:hidden;
		background-position:center;
		background-size: cover;
		}
	
section.overall-panel article img{
		width: 100%;
		/*height: 250px;*/
		background-position:center;
		background-size: cover;

		}
section.overall-panel article h2{ 
		margin-left: 30px;
		}
section.overall-panel article p{ 
		margin-left: 30px;
		}
	
section.overall-panel article section.read-more{
		margin: 30px;
		}

section.overall-panel article section.read-more article{
		border:none;
		}

/********************OVERALL-PANEL-SMALL********************/

section.overall-panel-small{}

section.overall-panel-small article{
		position:relative;
		margin-bottom: 50px;
		width:170px;
		height: 320px;
		border: #CCC thin solid;
		overflow:hidden;
		}
		
section.overall-panel-small article section.swap article{
		height: 170px;
		width: 0px;
		border: none;
		}
section.overall-panel-small article section.swap article img{
		width: 100%;
		overflow: hidden;
		}

section.overall-panel-small article.left{
		margin-right: 25px;}
	
section.overall-panel-small article h2{ 
		position: relative;
		margin: 10px 0px 0px 10px;
		}
section.overall-panel-small article p{ 
		padding:0;
		margin:  10px 0px 0px 10px;
		}
	
section.overall-panel-small article section.read-more{
		position: absolute;
		bottom: 10px;
		left: 10px; 
		}

section.overall-panel-small article section.read-more article{
		border:none;
		height: 35px;
		}

/********************CONTENT********************/

article.home{
		background:#fff;
		position:relative;
		width: 960px;
		height:auto;
		padding:0px 30px 50px 30px;
		margin:auto;
		display:block;
		z-index:0;
		}
		
article.home section.content{
		width:590px;
		float:left;
		}

article.home header{
	  	height:auto;
		background: #fff;
		}
		
article.home img{
	float: left;
	width:25%;
	margin: 0 30px 30px 0px;
	}

article.home footer{}
	
article.home nav{
		position:relative;
		width:310px;
		padding: 0px 30px 0px 30px;
		background: #fff;
		color: #b66625;
		float:right;
		display:block;
		font-size: 18px;
		}	
		
article.home nav ul li{	
		list-style-type:none;
		padding-left: 20px;
		background-image:url(../layout/pfoten/pfote-braun-klein.png);
		background-repeat: no-repeat;
		background-position: left;
		line-height: 30px;
		}

article.home nav ul li:hover{	
		background-image:url(../layout/pfoten/pfote-dunkelrot.png);
		}

article.home nav ul li:hover a{ 
		color: #7c3703;
		}
		
		
article.home nav ul li a{
		text-decoration: none;
		color: #b66625;
		}
/********************CONTENT HALF ********************/

section.half{
	width: 450px;
	float:left;}
	
section.half-right{
	width: 450px;
	float:right;}

/********** DETAIL CONTENT**********/


section.detail article{
		position:relative;
		margin-bottom: 50px;
		width:300px;
		border: #CCC thin solid;
		overflow:hidden;
		}
	
section.detail article img{
		width: 100%;
		margin: 0px;
		padding-bottom: 10px;
		}
		
section.detail article h2{ 
		margin-left: 30px;
		}
		
section.detail article p{ 
		margin-left: 30px;
		}

section.detail article.left{
		margin-right:27px;
        }
	
/**************************************PICTURE BOX***/
section.picture-box{
		width:320px;
	float:right;
	}

section.picture-box article img{
	width: 120px;
	height:auto;
}

article#picture-box-big{
		width: 270px;	
		height: 200px;
		background-image:url(../layout/move-mouse-over-image.png);
		background-position: center;
		background-size: cover;
		z-index:100;
		}

h3#title{
	font-size:14px;
	color: #000;
	height:auto;
	line-height: 24px;
	height:24px;
	width: 260px;
	font-weight:normal;
	margin-top:0px;
	padding-left: 10px;}

/**************************************I2***/

article nav.content-nav{
	width: 200px;
	float:left;
	}

article nav.content-nav-links{
	width:500px;;
	float:left;
	}
	
article nav.content-nav-links ul li {
	background-image:url(../layout/pfoten/pfote-grau-klein.png);
	}

article nav.content-nav-links ul li a{
	color: #666;
	}

	
section.content-right{
	width:320px;
	float:right;
	}
	
section.content-right article{
	margin-bottom: 50px;
	}

section.content-right header{
	  	height:auto;
		background: #fff;
		}
		
section.content-right img{
	float: left;
	width:120px;
	margin: 0 10px 10px 0px;
	}

section.content-right nav.right-sub{
	padding: 0;
	width:320px;
	position:relative;
	top: 50px;}

.fotos{
	width: 400px !important;}
/********************IMAGE-PANEL********************/

section.image-panel{
	width: 1020px;
	margin:auto;
	}



/********************FOOTER********************/

section.footer{
		width: 100%; 
		height: 120px;
		background-color:#000;
		opacity: 0.2;
		}

article.footer-panel{
	width: 1020px;
	margin:auto;
	opacity: 1;
	background-image: url(../layout/footer-logo.png);
	background-repeat: no-repeat;
	background-position: 20px 10px;
	height: 100%;
	text-align:right;
	color: #fff;
	}

article.footer-panel p{
	position: relative;
	top: 10px;
	}

article.footer-panel p a{
	position:relative;
	text-transform:uppercase;
	color:#fff;
	font-size:12px;
	margin: 10px;
	}


/********** FOTOS **********/

section.page-img-box{
	width: 400px;
	float:right;
	text-align:right;
	margin-top:10px;
	}

section.page-img-box img{
	width:120px;}

.gal-thumb{
	width:50px;
	height:50px;
	overflow:hidden;}

img.thumb{
	height:60px;
	width: auto !important; float: left; 
	margin: 10px 5px 10px 5px !important; 
	opacity: 0.7; 
	}

img.thumb:hover{
	opacity: 1;
}

.image-stop{
	display:none;}


img#gallery{
	box-shadow:3px 3px 5px #999;
	border: #666 thin solid;
	width:490px;
	margin: 0px ;
	margin-top: 25px;
	}

section#detail-page{
	padding: 0px !important;
	text-align:center;
	background-image:url(../layout/fotos-bg.png);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: bottom right;
	box-shadow:3px 3px 5px #999;
	border: #666 thin solid;
	position:relative;
	top: 30px;
	}
	
img.click-on{
		width:470px !important;
		margin-top: 60px !important;
		}

h2#image-title{
	width: 490px;
	float:right;
	color: #ccc;
	font-weight: lighter;
	}
	
section.page-img-box#wuerfe, h2.wuerfe#image-title{
	float:none;
	margin:auto;
	 
	}	
	
h2.wuerfe#image-title{ line-height:50px;}	

section.page-img-box#wuerfe{width: 300px; margin-top:30px;}

gal.wuerfe img#gallery{
	margin: auto;
	 }


/********* ZP-BUCH **********/

table#fachbuch, table#fachbuch-2{
	width: 450px;
	float:left;
	}
	
table#fachbuch-2{
	margin-left: 60px; 
	}

table#fachbuch td, table#fachbuch-2 td{
	border-bottom: #ccc thin dashed;}

table#fachbuch td.seite, table#fachbuch-2 td.seite{
	width:20px;
	text-align:right;
	border:none;
	}

/********* PAARUNG **********/

table#paarung{
	width: 100%;
	}
	

table#paarung td{
	border-bottom: #ccc thin dashed;}

table#paarung td.date{
	width:200px;
	text-align:right;
	border:none;
	color: #093;
	}

/********** WÜRFE SUB_SEITEN **********/
body.wurf img{ width: auto; }
body.wurf td{ text-align:center;}
body.wurf p{padding-right:5px;}
body.wurf a{ text-align:center;}

/********** LINKS **********/
article.links a{
	color: #b66625 ;
	}

article.links img{
	margin-bottom:50px;
	width:100%;}


/********** KOTNAKT **********/
form{z-index:0; text-align:left; margin:auto; margin-top:50px; }

form label{
		width: 200px;
		float:left;
		height: 20px;
		margin: 8px 0px 0px 0px;
		color: #093;
		line-height:20px;
			padding-top: 7px;

		}
		
form input{
	width: 330px;
	background-color: #ccc;
	height: 25px;
	border:none;
	margin: 2px 0px 2px 0px;
	padding-left: 10px;
	padding-top: 5px;
	color: #333;
	box-shadow: inset #fff 0px 3px 5px;
	}

textarea{
	width:330px;
	height: 200px;
	background-color: #ccc;
	border: none;
	margin: 2px 0px 2px 0px;
	overflow: hidden;
	padding-left: 10px;
	padding-top: 10px;
	color: #333;
	resize:none;
	z-index:0;
	box-shadow: inset #fff 0px 3px 5px;
	background-image:url(../welpen/export/export.jpg);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	}

input#submit{
	width:340px;
	margin-top:0px;
	margin-left: 200px;
	color: #666;
	font-weight: bold;  }

input#submit:hover{
	color: #093;
	background-color: #aaa;
	}


.errMessage{ width: 430px; float:right }
.errText{ color: #fff !important;}

/********** FACEBOOK **********/
#atwLink{ visibility:hidden;}