/**************************************************
*
*	CONTAINER STYLES
*
**************************************************/

#horiz_container_outer
{
	width:900px;
	overflow-x:hidden;
	overflow-y:hidden;
	position:relative;
	height:510px;
	margin:5px auto;
	border:1px dotted rgb(153, 113, 10);
	background-image:url(../img/trans-schwarz.png);
}

#horiz_container_pedigree
{
	width:2000px;
	margin:0px;
	padding:0px;
	height:500px;
}
#horiz_container_rueckblick
{
	width:10000px;
	margin:0px;
	padding:0px;
	height:500px;
}
#horiz_container ul, #horiz_container_rueckblick ul

{
	margin:0px; padding:0px;
	float:left;
}

#horiz_container_inner
{
	padding-top:5px;
	padding-left:0px;
}

#horiz_container li, #horiz_container_rueckblick li
{
	list-style:none;
	display: inline-table;
	margin:0px;
}

#horiz_container li img, #horiz_container_rueckblick li img
{
	padding:0px;
	margin:0px;
}




/**************************************************
*
*	SCROLLING STYLES
*
**************************************************/

#scrollbar 
{ 
    position:relative;
	float:left;
    width:840px; height:15px;
    display:block;
    font-size:1px;
    top:0px;
    margin:0px auto;
	margin-left:10px;
}

#track 
{ 
    position:absolute; left:0px; top:0;
    width:840px; height:15px; 
    background: #000;
    -webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	border:#FFBD10 solid 1px;
}

#dragBar 
{
    position:absolute; left:0px; top:0px;
    width:20px; height:13px; 
    -webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
background-color:#FFBD10;

}  
  
#left_scroll
{ 
	position:absolute; 
	border-color: transparent gray transparent transparent;
	border-style: solid;
	border-width: 5px;
	width: 0;
	height: 0px;
	cursor:pointer;
	top:1px;
	left:-15px;
}  

#right_scroll 
{ 
	position:absolute; 
	right:-15px; 
	top:1px;
	border-color: transparent transparent transparent gray;
	border-style: solid;
	border-width: 5px;
	width: 0;
	height: 0px;
	cursor:pointer;
}
#dre {
	position:relative;
	float:left;
	color:#FFF;
	margin-left:30px;
}
#dri {
	position:relative;
	float:right;
	color:#FFF;
	margin-right:30px;
}
/* Prevent selection problem */
#scrollbar, #track, #dragBar, #left, #right {
    -moz-user-select: none;
    -khtml-user-select: none;
}

/**************************************************
*
*	Stammbaum
*
**************************************************/

#pedigree_1 {
	width:650px;
	height:450px;
	background-image:url(../img/pedigree-element-anfang.png);
	background-repeat:no-repeat;
	background-position:center right;
	float:left;
}
#pedigree_2 {
	width:1040px;
	height:450px;
	background-image:url(../img/pedigree-element-standard.png);
	background-repeat:repeat-x;
	background-position:center left;
	float:left;
}
.wappen-h {
	position:absolute;
	width:160px;
	height:56px;
	background-image:url(../img/pedigree-wappen-h.jpg);
	background-position:right;
	background-repeat:no-repeat;
}
.wappen-w {
	position:absolute;
	width:160px;
	height:56px;
	background-image:url(../img/pedigree-wappen-w.jpg);
	background-position:right;
	background-repeat:no-repeat;
}
.wappen-w-inaktiv {
	position:absolute;
	width:160px;
	height:56px;
	background-image:url(../img/pedigree-wappen-w-inaktiv.jpg);
	background-position:right;
	background-repeat:no-repeat;
}
.wappen-h-inaktiv {
	position:absolute;
	width:160px;
	height:56px;
	background-image:url(../img/pedigree-wappen-h-inaktiv.jpg);
	background-position:right;
	background-repeat:no-repeat;
}
.wappen-w:hover {
	background-image:url(../img/pedigree-wappen-w-hover.jpg);
}
.wappen-h:hover {
	background-image:url(../img/pedigree-wappen-h-hover.jpg);
}
.pedigree-info {
	padding-top:10px;
	padding-right:60px;
	text-align:right;
	font-size:12px;
	color:#FFF;
}