/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS framework
 * (en) stylesheet for screen layout
 * (de) Stylesheet für das Bildschirm-Layout
 *
 * @creator       YAML Builder V1.2.1 (http://builder.yaml.de)
 * @file          basemod.css
 * @-yaml-minver  3.3
 */

@media screen, projection
{
  /** 
   * (en) Forcing vertical scrollbars in IE8, Firefox, Webkit & Opera 
   * (de) Erzwingen vertikaler Scrollbalken in IE8, Firefox, Webkit & Opera 
   *
   * @workaround
   * @affected IE8, FF, Webkit, Opera
   * @css-for all
   * @valid CSS3
   */

  body { overflow-y: scroll; }

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

  /* (en) Marginal areas & page background */
  /* (de) Randbereiche & Seitenhintergrund */
  body { background: #fff; padding: 0px;

  }

  /* Layout Alignment | Layout-Ausrichtung */
  .page_margins { margin: 0 auto;	  
  }

  .c80l.fixed_width_888 { width: 877px; }
  .c20r.fixed_width_212 { width: 223px; }
  
  
  
  .c60l.fixed_width_660 { width: 620px; padding-right: 30px; }
  .c40r.fixed_width_440 { width: 450px; }
  
  .c33l.statictext_left { width: 222px; display: block; }
  .c33l.statictext_center { width: 758px; }
  .c33r.statictext_right { width: 120x; }
  
  .subcolumns {
	clear: both;
  }
  
  /* Layout Properties | Layout-Eigenschaften */
  .page_margins { 
	width: 1100px;
	background: #fff;	
  }
  #header {
	z-index: 80;
	position: relative;
	padding: 0px 0px 0px 0px;
	color: #000;
	width:100%;
	height: 67px;
  }
  #header_bg {
    z-index: 30;
	position: absolute;
	background-image: url(http://cdn2.esl.tv/images/header_bg.png);
	background-repeat:repeat-x;
	background-position: center;
	top:0px;
	width:100%;
	height:67px;
  }
  #header_bg_seperator_1 {
	position: absolute;
	left: 0px;
  }
  #header_bg_seperator_2 {
	position: absolute;
	right: 280px;
  }
  #header_bg_seperator_3 {
	position: absolute;
	right: 0px;
  }
  #subheader {
	position: relative;
	padding: 0px 0px 0px 0px;
	z-index: 70;
	color: #fff;
	width:100%;
	height: 21px;
	text-align: right;
  }
  #subheader_bg {
	position: absolute;
	background-image: url(http://cdn2.esl.tv/images/subheader_bg.png);
	background-repeat:repeat-x;
	top:67px;
	width:100%;
	height:21px;
  }

  #main {
	margin: 0;
    z-index: 50;
	top: 0px;			
	position: relative;	
  }
  #main_content {
	clear:both;
	background-color: #fff;
	position:relative;
  }

  .tinystage {
	z-index: 10;
	position: relative;
	width: 1100px;
	height: 70px;	
	#height: 140px;
	padding: 0px;
	margin: 0px auto 0px auto;  /* sitebranding: medium: 110px small: 60px */
	color: #fff;	
  }
  
  .smallstage {
	z-index: 10;
	position: relative;
	width: 1100px;
	height: 170px;	
	#height: 140px;
	padding: 0px;
	margin: 0px auto 0px auto;  /* sitebranding: medium: 110px small: 60px */
	color: #fff;	
  }
  .smallstage.notice {
	z-index: 10;
	position: relative;
	width: 650px;
	height: auto;
	margin-top: 35px;
	padding: 15px;
	color: #ccd;
	line-height: 200%;
	border: 2px dashed #d39a00;
	background-color: #333;
  }
  .smallstage.notice a,a:visited,a:active{
	color: #ccc;
  }
  
  #videoplayer {
	z-index: 10;
	position: relative;
	width: 975px;
	height: 539px;
	padding: 0px;
	margin: 60px auto 40px auto;  /* sitebranding: medium: 110px small: 60px */
  }
  #spotlightplayer {
	z-index: 10;
	position: relative;
	background-color: #000;
	background-image: url(http://cdn2.esl.tv/images/spotlightplayer_bg.png);
	background-repeat: no-repeat;	
	width: 1100px;
	height: 550px;
	padding: 0px;
	margin: 40px auto 40px auto;  /* sitebranding: medium: 110px small: 60px */
	color: #000;	
  }
  #spotlightplayer_threeslots {
	z-index: 10;
	position: relative;
	width: 1100px;
	height: 442px;
	padding: 0px;
	margin: 130px auto 40px auto;  /* sitebranding: medium: 110px small: 60px */
	color: #000;	
  }
  
  #banner_top {
	position: absolute;
	top: -110px;
	width: 100%;	
	padding: 10px;
	text-align: center;
	display: none;
  }
  #teaser_bg {
	position: absolute;
/*	background-image: url(http://cdn2.esl.tv/images/teaser_bg/600_default.jpg); */
	background-repeat: no-repeat;
	background-position:center;
	background-color: #333333;
	top:87px;
	width:100%;
	height:602px;	/* sitebranding: medium : 652px small 602 */
  }
  
  #teaser_bottom_bg {
    z-index: 10;
	position: absolute;
	background-image: url(http://cdn2.esl.tv/images/teaser_bottom_line.png);
	background-color: #306fcd;
	background-repeat: repeat-x;
	background-position:center;
	top:688px;	/* sitebranding: medium 738pxpx small 688 */
	width:100%;
	height:38px;
  }
  .teaser_bottom_bg_kernschatten {
    z-index: 50;
	position: absolute;
	background-repeat: no-repeat;
	background-position:center;
	top:0px;
	width:100%;
	height:100%;
	position: absolute;
  }
  .teaser_bottom_bg_kernschatten.videoplayer {
	background-image: url(http://cdn2.esl.tv/images/videoplayer_kernschatten.png);
  }  
  .teaser_bottom_bg_kernschatten.spotlight {
	background-image: url(http://cdn2.esl.tv/images/spotlightplayer_kernschatten.png);
  }  
  
  #footer { 
	color:#666; clear:both;
	background-image: url(http://cdn2.esl.tv/images/footer_bg.jpg);
	background-repeat: repeat-x;
	margin-top: 120px;
    z-index: 50;
	height: 1000px;
	position: relative;	
	padding: 10px 0 0 0;
	background-color: #363636;
  }

  #footer_content { 
	width: 1100px;
	margin: auto;
  }
  #footer_bottom { 
	background: #444;
	height: 0px;
	width: 100%;
  }
  
  #header_logo {
	position:absolute;
	width:184px;
	height:81px;
	top:3px;	
	left:10px;
	z-index: 100;
  }

  #header_userbox {
	position:absolute;
	margin: 0px 0px 0px 0px;
	width:280px;
	height:50px;
	bottom:0px;	
	right:0px;
	z-index: 100;
  }
	
  /*-------------------------------------------------------------------------*/

  /**
   * (en) Formatting content container
   * (de) Formatierung der Inhalts-Container
   *
   */

  #col1 { float: left; width: 300px}
  #col2 { display:none}
  #col3 { width: auto; margin: 0 0 0 300px}
  #col1_content { padding: 0 10px 0 20px }
  #col3_content { padding: 0 20px 0 10px }
	
  .c60l	{
	# background-image: url(http://cdn2.esl.tv/images/bg_content_c60l.png);
	# background-repeat:repeat-y;
	border-right: 1px solid #ccc;
  }
  /*-------------------------------------------------------------------------*/
 
    #horizon        
	{
        text-align: center;
        position: absolute;
        top: 50%;
        left: 0px;
        width: 100%;
        height: 1px;
        overflow: visible;
        visibility: visible;
        display: block
	} 
  
}