@charset "utf-8";
/* CSS Document */

*{
	list-style: none;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

body{
	font: small/150% Arial, Verdana, sans-serif;	
	background: #0B2A29 url(../images/background.gif) 50% 0 repeat-y;
}

a:focus { 
	outline: none;
}

h1{
	font-size: 130%;
	padding-bottom: 10px;
	color: #184A49;
}

p{
	font-size: 90%; /* Verdana, Geneva, sans-serif;*/
	padding-bottom: 8px;
	width: 425px;
}

#wrapper{
	width: 952px;
	margin: auto;
	height: 100%;
}

#header,
#body,
#footer {
	position: relative;
	width: 100%;
	clear: both;
}

#header{
	height: 202px;
	background: #184A49 url(../images/bg_top.gif) repeat-x;
	border-bottom: #FFF solid 7px;
	margin-bottom: 2px;
}

#navigation{
	position: absolute;
	top: 30px;
	left: -10px;
}

#navigation ul{
	padding-top: 20px;
}

#navigation li a{
	display:block;
	width: 145px;
	height: 26px;
	color: #FFF;
	font-weight: bolder;
	font-size: 88%;
	padding-left: 35px;
	padding-top: 4px;
	text-transform: uppercase;
	letter-spacing: 1px;
    overflow:hidden; 
    cursor:pointer; 	
}

#navigation li a:hover, #navigation li a.active{
	background: url(../images/button.png) 0 0 no-repeat;
	color: #000;
}

#logo{
	position: absolute;
	top: 10px;
	left: 353px;
	width: 250px;
	height: 175px;
	background: url(../images/3_kronen_logo.png) no-repeat !important;
	background: url(../images/3_kronen_logo.gif) no-repeat;
}

#elemente{
	position: absolute;
	top: 190px;
	right: -50px;
	width: 210px;
	height: 185px;
	background: url(../images/elemente.png) no-repeat !important;
	background: url(../images/elemente.gif) no-repeat;
}



#horse{
	float: right;
	position: absolute;
	top:0;
	right:0;
	width: 130px;
	height: 202px;
	background: url(../images/3_kronen_pferd.png) no-repeat !important;
	background: url(../images/3_kronen_pferd.gif) no-repeat;	
}

#menu_form{
	float: right;
	position: relative;	
	right: 5px;
	bottom: -30px;
}

#menu_select{
	background: url(../images/submenu_bg.png) 100% 100% no-repeat;
	width:325px;
	height: 55px;
	position: absolute;
	right:0px;
	bottom: 0px;
}

#body{
	
}

#content_cd_dvd{
	background: url(../images/katalog-cd-bestellung.jpg) top left no-repeat;	
	height: 297px;
	background-color: #ABCFCF;	
	border-bottom: #CC9933 solid 12px;
	border-top: #FFF solid 2px;	

	padding: 10px;
	padding-left: 75px;
}

#content{
	height: 317px;
	background-color: #ABCFCF;	
	border-bottom: #CC9933 solid 12px;
	border-top: #FFF solid 2px;
}

#content_impressum{
	height: 297px;
	background-color: #ABCFCF;	
	border-bottom: #CC9933 solid 12px;
	border-top: #FFF solid 2px;
	
	padding: 10px;
	padding-left: 75px;
	
}

#content_impressum table{
	font-size: 85%;	
}

#content_impressum a{
	color: #184A49;	
}

#content_impressum a:hover{
	color: #CC9933;
}

#cpicture{
	float: left;
/*	width: 45%;*/
	width:405px;
	height: 317px;
	background-color: #446C71;
}

#slideshow{
	width:405px;
	height: 317px;
	background-color: #446C71;
}

#ctext{
	float: left;
/*	width: 54.9%;*/
	width:530px;
	padding-left:17px;
	padding-top: 15px;
	height: 302px;
	
	overflow:auto; 
	overflow-x:hidden;	
}

#section{
	height: 200px;
	background: #184A49 url(../images/bg_bottom.gif) repeat-x;
	padding-top: 50px;
	padding-left: 76px;
}

#motto{
	width: 800px;
	height: 75px;
	background: url(../images/3_kronen_motto.png) no-repeat !important;
	background: url(../images/3_kronen_motto.gif) no-repeat;		
}

#footer{
	height: 30px;
	width: 952px;	
	background-color: #262321;
	color: #FFF;
	font-size: 85%;	
 	position: fixed;
    bottom: 0px;
}

#footer ul{
	position: absolute;
	right: 20px;
	top: 0.5em;
}

#footer ul,
#footer ul * {
	float: left;
}

#footer li{
	margin-right: 1em;
}

#footer li a{
	color:#fff;
	padding-left: 20px;
}


/* tooltip styling */ 
.tooltip { 
    display:none; 
    height:200px; 
    padding:8px 10px 8px 10px; 
    width:200px; 
    font-size:11px; 
    color:#fff; 
} 
 
.tooltip a { 
    color:#ad4; 
    font-size:11px; 
    font-weight:bold; 
}

#subnavi {
	padding-top: 8px;
}

#subnavi li a{
	display:block;
	width: 145px;
	height: 14px;
	color: #FFF;
	font-weight: bolder;
	font-size: 88%;
	padding-top: 2px;
	text-transform: uppercase;
	letter-spacing: 1px;
    overflow:hidden; 
    cursor:pointer; 	
}

#subnavi li a:hover, #subnavi li a.active{
	background: none;
	color: #CC9933;
}

#pedigree{
	position: absolute; 
	top: 5px; 
	right: 25px;
}

#video{
	position: absolute; 
	top: 170px; 
	right: 25px;
}

#bilder{
	position: absolute; 
	top: 95px; 
	right: 25px;
}
 
/* styling for elements inside overlay */
.details { 
  /*  position:absolute; 
    top:15px; 
    right:15px; 
    font-size:11px; 
    color:#fff; 
    width:350px; */
} 
 
.simple_overlay h3 { 
    color       : #184a49; 
    padding-top : 13px; 
	padding-left: 185px;
	font: bolder 1.4em Georgia, "Times New Roman", Times, serif;
}

/* the overlayed element */ 
.simple_overlay { 
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10000; 
     
    /* styling */ 
    background:#FFF url(../images/pedigree_background.gif); 
     
    width:525px;     
    min-height:500px; 
    border:2px solid #666; 
     
    /* CSS3 styling for latest browsers */ 
/*    -moz-box-shadow:0 0 90px 5px #000; 
    -webkit-box-shadow: 0 0 90px #000;     */
} 
 
/* close button positioned on upper right corner */ 
.simple_overlay .close { 
    background-image:url(../images/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

/* the overlayed element */ 
.simple_overlay_vid { 
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10001; 
     
    /* styling */ 
} 
 
/* close button positioned on upper right corner */ 
.simple_overlay_vid .close { 
    background-image:url(../images/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

/*-----------------------------------------------*/

#pedig {
	font-size: 100%;
	width: 500px;
	padding-top: 10px;
	padding-left: 10px;
}

#pedig td {
	vertical-align: middle;
	text-align: left;
}

#pedig #rank1 {
	height: 124px;
}

#pedig #rank2 {
	height: 70px;
}

#pedig #rank3 {
	height: 40px;
}

#pedig #top {
	min-height: 10px;
	background: url(../images/klammer_oben.gif) 0 0 no-repeat;
	height: 50%;
}

#pedig #bottom {
	min-height: 10px;
	background: url(../images/klammer_unten.gif) 0 100% no-repeat;
	height: 50%;
}

#pedig .hengst {
	color:#36F;
}

#pedig .stute {
	color: #C69;
}

.divider {
	background-color: #abcfcf;	
}

.even {
	background: #7dafc1 url(../images/background_shadow.png) repeat-x;	
}

.uneven {
	background: #6499ab url(../images/background_shadow.png) repeat-x;	
}

.shadow {
	background: url(../images/table_shadow_bottom.gif) repeat-x;	
}

#decktaxe td{
	font-size: 110%;
	padding: 5px 0px 5px 30px;
	color: #fff;
	font-weight: bold;
}

#decktaxe th{
	font-size: 110%;
	padding: 5px 0px 5px 20px;
	text-align: left;
}

#bestellung {
	position: absolute;
	right: 30px;
	top: 20px;
	border-top: #fff 1px solid;
	background: #6499ab url(../images/background_shadow.png) repeat-x;
	height: 280px;
	width: 445px;
}

#newsletter {
	position: absolute;
	right: 70px;
	top: 60px;
	border-top: #fff 1px solid;
	background: #6499ab url(../images/background_shadow.png) repeat-x;	
	height: 250px;
	width: 445px;	
}

#bestellung td, #newsletter td{
	font-size: 90%;
	padding: 4px 0px 2px 5px;
	color: #fff;
}

#bestellung td.first, #newsletter td.first{
	padding: 4px 0px 2px 20px;
}

.bestellung_header{
	font-size: 110%;
	padding-bottom: 10px;
	color: #fff;
	font-weight: bolder;
	font-style: italic;
}

#status{
	text-align:left;
	width: 16px;
}

.trenner {
	background: url(../images/table_divider.gif) 0% 100% repeat-x;	
}

#left_image {
	position: absolute;
	left: 43px;
	top: 80px;
}

#right_image {
	position: absolute;
	right: 95px;
	top: 80px;
}


/*-----------------------------------------------*/


/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 405px;
	height:317px;

	/* custom decorations */
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

/* single scrollable item */
.scrollable div {
	float:left;
	cursor:pointer;
	width:405px;
	height:317px;
}

/* active item */
.scrollable .active {
	border:2px solid #000;
	z-index:9999;
	position:relative;
}


/*-----------------------------------------------*/

#searchForm INPUT {
	PADDING-RIGHT: 2px;
	PADDING-LEFT: 2px;
	FONT-SIZE: 0.9em;
	PADDING-BOTTOM: 2px;
	MARGIN: 0px;
	PADDING-TOP: 2px
}
FORM {
	float: left;
	PADDING-RIGHT: 0px;
	PADDING-LEFT: 400px;
	PADDING-BOTTOM: 0px;
	MARGIN: 0px;
	PADDING-TOP: 0px
}

INPUT {
	BORDER-RIGHT: #999 1px solid;
	BORDER-TOP: #999 1px solid;
	FONT: 0.9em Arial, Helvetica, sans-serif;
	BORDER-LEFT: #999 1px solid;
	BORDER-BOTTOM: #999 1px solid
}
TEXTAREA {
	BORDER-RIGHT: #999 1px solid;
	BORDER-TOP: #999 1px solid;
	FONT: 1.1em Arial, Helvetica, sans-serif;
	BORDER-LEFT: #999 1px solid;
	BORDER-BOTTOM: #999 1px solid
}
INPUT {
	PADDING-RIGHT: 2px;
	PADDING-LEFT: 2px;
	PADDING-BOTTOM: 2px;
	PADDING-TOP: 2px;
	/*height: 12px;*/
}

TEXTAREA {
	PADDING-RIGHT: 2px;
	PADDING-LEFT: 2px;
	PADDING-BOTTOM: 2px;
	PADDING-TOP: 2px
}
INPUT[type=checkbox] {
	BORDER-TOP-STYLE: none;
	BORDER-RIGHT-STYLE: none;
	BORDER-LEFT-STYLE: none;
	BORDER-BOTTOM-STYLE: none
}
INPUT[type=radio] {
	BORDER-TOP-STYLE: none;
	BORDER-RIGHT-STYLE: none;
	BORDER-LEFT-STYLE: none;
	BORDER-BOTTOM-STYLE: none
}
INPUT.checkbox {
	BORDER-TOP-STYLE: none;
	BORDER-RIGHT-STYLE: none;
	BORDER-LEFT-STYLE: none;
	BORDER-BOTTOM-STYLE: none
}
INPUT.radio {
	BORDER-TOP-STYLE: none;
	BORDER-RIGHT-STYLE: none;
	BORDER-LEFT-STYLE: none;
	BORDER-BOTTOM-STYLE: none
}