/* 
Title:      Deutsche Akademie f�r Fu�ball-Kultur - Screen styles
Author:     Pedro Stoehr, hello@optische.com
Copyright:	2010, Optische Anstalt. All rights resevered (please don't re-use without permission).
*/


/* core 
--------------------------------------------- */

/* Reset 
   -----
   http://meyerweb.com/eric/tools/css/reset/ */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    background: transparent;
    border: 0;
    font-size: 100%;
    margin: 0;
    outline: 0;
    padding: 0;
    vertical-align: baseline;
    }
body {
    line-height: 1;
    }
ol, ul {
    list-style: none;
    }
blockquote, q {
    quotes: none;
    }
blockquote:before, 
blockquote:after, 
q:before, 
q:after {
    content: '';
    content: none;
    }
:focus {
    outline: 0;
    }
ins {
    text-decoration: none;
    }
del {
    text-decoration: line-through;
    }
table {
    border-collapse: collapse;
    border-spacing: 0;
    }

/* Clear Floated Elements
   ----------------------
   http://sonspring.com/journal/clearing-floats
   http://www.positioniseverything.net/easyclearing.html */

html body * span.clear,
html body * div.clear,
html body * li.clear,
html body * dd.clear,
html body * br.clear,
html body * hr.clear {
  	background: none;
  	border: 0;
  	clear: both;
  	display: block;
  	float: none;
  	font-size: 0;
  	height: 0;
  	list-style: none;
  	margin: 0;
  	padding: 0;
  	overflow: hidden;
  	visibility: hidden;
  	width: 0;
    }
.clearfix:after {
    clear: both;
    content: '.';
    display: block;
    height: 0;
    visibility: hidden;
    }
.clearfix {
    display: inline-block;
    }
* html .clearfix {
    height: 1%;
    }
.clearfix {
    display: block;
    }

/* Basic HTML
   ---------- 
   Add whatever you want to your core.css */

hr {
    display: none;
    }
.hideme {
    display: none;
    }

/* grid
--------------------------------------------- */

.container_12,
.container_16 {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}

/* `Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12,
.grid_13,
.grid_14,
.grid_15,
.grid_16 {
	display: inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
}

.container_12 .grid_3,
.container_16 .grid_4 {
	width: 220px;
}

.container_12 .grid_6,
.container_16 .grid_8 {
	width: 460px;
}

.container_12 .grid_9,
.container_16 .grid_12 {
	width: 700px;
}

.container_12 .grid_12,
.container_16 .grid_16 {
	width: 940px;
}

/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* `Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .grid_1 {
	width: 60px;
}

.container_12 .grid_2 {
	width: 140px;
}

.container_12 .grid_4 {
	width: 300px;
}

.container_12 .grid_5 {
	width: 380px;
}

.container_12 .grid_7 {
	width: 540px;
}

.container_12 .grid_8 {
	width: 620px;
}

.container_12 .grid_10 {
	width: 780px;
}

.container_12 .grid_11 {
	width: 860px;
}

/* `Grid >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .grid_1 {
	width: 40px;
}

.container_16 .grid_2 {
	width: 100px;
}

.container_16 .grid_3 {
	width: 160px;
}

.container_16 .grid_5 {
	width: 280px;
}

.container_16 .grid_6 {
	width: 340px;
}

.container_16 .grid_7 {
	width: 400px;
}

.container_16 .grid_9 {
	width: 520px;
}

.container_16 .grid_10 {
	width: 580px;
}

.container_16 .grid_11 {
	width: 640px;
}

.container_16 .grid_13 {
	width: 760px;
}

.container_16 .grid_14 {
	width: 820px;
}

.container_16 .grid_15 {
	width: 880px;
}

/* `Prefix Extra Space >> Global
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_3,
.container_16 .prefix_4 {
	padding-left: 240px;
}

.container_12 .prefix_6,
.container_16 .prefix_8 {
	padding-left: 480px;
}

.container_12 .prefix_9,
.container_16 .prefix_12 {
	padding-left: 720px;
}

/* `Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_1 {
	padding-left: 80px;
}

.container_12 .prefix_2 {
	padding-left: 160px;
}

.container_12 .prefix_4 {
	padding-left: 320px;
}

.container_12 .prefix_5 {
	padding-left: 400px;
}

.container_12 .prefix_7 {
	padding-left: 560px;
}

.container_12 .prefix_8 {
	padding-left: 640px;
}

.container_12 .prefix_10 {
	padding-left: 800px;
}

.container_12 .prefix_11 {
	padding-left: 880px;
}

/* `Prefix Extra Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .prefix_1 {
	padding-left: 60px;
}

.container_16 .prefix_2 {
	padding-left: 120px;
}

.container_16 .prefix_3 {
	padding-left: 180px;
}

.container_16 .prefix_5 {
	padding-left: 300px;
}

.container_16 .prefix_6 {
	padding-left: 360px;
}

.container_16 .prefix_7 {
	padding-left: 420px;
}

.container_16 .prefix_9 {
	padding-left: 540px;
}

.container_16 .prefix_10 {
	padding-left: 600px;
}

.container_16 .prefix_11 {
	padding-left: 660px;
}

.container_16 .prefix_13 {
	padding-left: 780px;
}

.container_16 .prefix_14 {
	padding-left: 840px;
}

.container_16 .prefix_15 {
	padding-left: 900px;
}

/* `Suffix Extra Space >> Global
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_3,
.container_16 .suffix_4 {
	padding-right: 240px;
}

.container_12 .suffix_6,
.container_16 .suffix_8 {
	padding-right: 480px;
}

.container_12 .suffix_9,
.container_16 .suffix_12 {
	padding-right: 720px;
}

/* `Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_1 {
	padding-right: 80px;
}

.container_12 .suffix_2 {
	padding-right: 160px;
}

.container_12 .suffix_4 {
	padding-right: 320px;
}

.container_12 .suffix_5 {
	padding-right: 400px;
}

.container_12 .suffix_7 {
	padding-right: 560px;
}

.container_12 .suffix_8 {
	padding-right: 640px;
}

.container_12 .suffix_10 {
	padding-right: 800px;
}

.container_12 .suffix_11 {
	padding-right: 880px;
}

/* `Suffix Extra Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .suffix_1 {
	padding-right: 60px;
}

.container_16 .suffix_2 {
	padding-right: 120px;
}

.container_16 .suffix_3 {
	padding-right: 180px;
}

.container_16 .suffix_5 {
	padding-right: 300px;
}

.container_16 .suffix_6 {
	padding-right: 360px;
}

.container_16 .suffix_7 {
	padding-right: 420px;
}

.container_16 .suffix_9 {
	padding-right: 540px;
}

.container_16 .suffix_10 {
	padding-right: 600px;
}

.container_16 .suffix_11 {
	padding-right: 660px;
}

.container_16 .suffix_13 {
	padding-right: 780px;
}

.container_16 .suffix_14 {
	padding-right: 840px;
}

.container_16 .suffix_15 {
	padding-right: 900px;
}

/* `Push Space >> Global
----------------------------------------------------------------------------------------------------*/

.container_12 .push_3,
.container_16 .push_4 {
	left: 240px;
}

.container_12 .push_6,
.container_16 .push_8 {
	left: 480px;
}

.container_12 .push_9,
.container_16 .push_12 {
	left: 720px;
}

/* `Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .push_1 {
	left: 80px;
}

.container_12 .push_2 {
	left: 160px;
}

.container_12 .push_4 {
	left: 320px;
}

.container_12 .push_5 {
	left: 400px;
}

.container_12 .push_7 {
	left: 560px;
}

.container_12 .push_8 {
	left: 640px;
}

.container_12 .push_10 {
	left: 800px;
}

.container_12 .push_11 {
	left: 880px;
}

/* `Push Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .push_1 {
	left: 60px;
}

.container_16 .push_2 {
	left: 120px;
}

.container_16 .push_3 {
	left: 180px;
}

.container_16 .push_5 {
	left: 300px;
}

.container_16 .push_6 {
	left: 360px;
}

.container_16 .push_7 {
	left: 420px;
}

.container_16 .push_9 {
	left: 540px;
}

.container_16 .push_10 {
	left: 600px;
}

.container_16 .push_11 {
	left: 660px;
}

.container_16 .push_13 {
	left: 780px;
}

.container_16 .push_14 {
	left: 840px;
}

.container_16 .push_15 {
	left: 900px;
}

/* `Pull Space >> Global
----------------------------------------------------------------------------------------------------*/

.container_12 .pull_3,
.container_16 .pull_4 {
	left: -240px;
}

.container_12 .pull_6,
.container_16 .pull_8 {
	left: -480px;
}

.container_12 .pull_9,
.container_16 .pull_12 {
	left: -720px;
}

/* `Pull Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .pull_1 {
	left: -80px;
}

.container_12 .pull_2 {
	left: -160px;
}

.container_12 .pull_4 {
	left: -320px;
}

.container_12 .pull_5 {
	left: -400px;
}

.container_12 .pull_7 {
	left: -560px;
}

.container_12 .pull_8 {
	left: -640px;
}

.container_12 .pull_10 {
	left: -800px;
}

.container_12 .pull_11 {
	left: -880px;
}

/* `Pull Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .pull_1 {
	left: -60px;
}

.container_16 .pull_2 {
	left: -120px;
}

.container_16 .pull_3 {
	left: -180px;
}

.container_16 .pull_5 {
	left: -300px;
}

.container_16 .pull_6 {
	left: -360px;
}

.container_16 .pull_7 {
	left: -420px;
}

.container_16 .pull_9 {
	left: -540px;
}

.container_16 .pull_10 {
	left: -600px;
}

.container_16 .pull_11 {
	left: -660px;
}

.container_16 .pull_13 {
	left: -780px;
}

.container_16 .pull_14 {
	left: -840px;
}

.container_16 .pull_15 {
	left: -900px;
}




/* global definitions
--------------------------------------------- */

html, body {
    height: 100%;
    }

* html, * html body {
    overflow:hidden;
    bottom:0;
    height:100%;
}
    
    
body {
    background: #fff url('../img/bd_sky.jpg') no-repeat top center;
    background-attachment: fixed;
    color: #000;
    font-family: Helvetica, Arial, Verdana, sans-serif;
    font-size: 12px;
    font-weight: normal;
    }

/* structure */

/* head */

#head {
    background: url('../img/head_bg.png') no-repeat top center;
    height: 135px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 3;
    }
html>body #head {
    position: fixed;
    }
#head .inner {
    margin: 0 auto;
    position: relative;
    width: 940px;
    }
    
#head h1 a {
    display: block;
    height: 58px;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 0;
    top: 20px;
    text-indent: -9999px;
    width: 340px;    
    }    

/* main navigation */

ul.nav {
    height: 32px;
    list-style: none;
    margin: 40px 0 0 380px;
    padding: 0;	
    z-index: 999;
    }
ul.nav li {
    float: left;
    margin: 0;	
    padding: 0 ;
    position: relative; /* declare X and Y axis base */
    }
ul.nav li a {
    color: #043780;
    display: block;
    float: left;
    font-size: 13px;
    height: 32px;
    line-height: 32px;
    padding: 0 10px;
    text-decoration: none;
    }
ul.nav li a:hover {
    color: #043780;
    text-decoration: underline;
    }    
ul.nav li span { /* drop down trigger styles */
    width: 17px;
    height: 32px;
    float: left;
    background: url(../img/subnav_button.png) no-repeat 50% -8px;
    margin: 0 6px 0 -6px;
    padding: 0;
    }
ul.nav li span.subhover { /*--Hover effect for trigger--*/
    background-position: 50% -56px; 
    cursor: pointer;
    } 
ul.nav li ul.subnav { /*--Important - Keeps subnav from affecting main navigation flow--*/
  	list-style: none;
  	position: absolute; 
  	left: 0; top: 31px;
    background-color: #7b98bf;
  	margin: 0; padding: 0;
  	display: none;
  	float: left;
  	width: 170px;
  	opacity: 0.9;
    -moz-border-radius: 0 0 6px 6px;
    }
ul.nav li ul.subnav li:last-child a:hover {
	  -moz-border-radius: 0 0 6px 6px;
    }
ul.nav li ul.subnav li{
  	margin: 0; padding: 0;
  	clear: both;
  	width: 170px;
    }
html ul.nav li ul.subnav li a {
    color: #fff;
    float: left;
    font-size: 11px;
    height: 24px;
    line-height: 24px;
    width: 150px;
    }
html ul.nav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/
  	background: #043780;
  	color: #fff;
  	text-decoration: none;
    }
ul.nav .current {
    font-weight: bold;
    }

/* page */

#page .inner {
    display: block;
    padding-top: 130px;
    /*padding-bottom: 300px;  /* hierfür gibt es die Abstandhalter */
    z-index: 2;    
    }
#page h2 {
    color: #043882;
    font-size: 22px;
    font-weight: normal;
    margin-bottom: 15px;
    }
#page h3 {
    color: #043882;
    font-size: 18px;
    font-weight: normal;
    margin-bottom: 5px;
    }          
#page p {
    line-height: 1.5;
    margin-bottom: 15px;
    }    

/* teaser */

.teaser {
    background-repeat: no-repeat;
    background-position: 0px 0px;
    height: 280px;
    margin-bottom: 20px;
    position: relative;
    }
.teaser .topic p { font-size: 16px; position: absolute; top: 240px; left: 0; }
.teaser .topic a {  background: url('../img/app_black_90.png'); color: white; padding: 5px 10px 5px 20px; text-decoration: none; } 

.teaser_small {
	margin-bottom: 20px;
}
/* newsbox */

.newsbox {
    margin-bottom: 20px;
    }
.newsbox img {
    float: left;
    margin-right: 20px;
    }

/* sidebar */

/* was ist was */

.wiw {
    background: url(../img/wiw_logo_small.gif) no-repeat 186px 2px;
    background-color: #fff;
  	border: 4px solid #04afea;
  	margin-bottom: 20px;
  	padding: 0;
  	} 
.wiw h4 {
    border-bottom: 1px dashed #04afea;
    color: #04afea;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 8px 10px 8px 10px;
    }
.wiw p {
    line-height: 1.3;
    margin: 0;
    padding: 0 10px;
    }
.wiw a {
    color: #d92b56 !important;
    text-decoration: underline;
    }

/* foot and additional */

#max {
    background-image: url('../img/bd_max.png');
    background-repeat: no-repeat;
    background-position: 0px 0px;
    position: absolute;
    right: 10px; 
	/*bottom: 130px;*/
	bottom: 10px;
    height: 490px;
    z-index:4;
    width: 170px;
    }
html>body #max {
    position: fixed;
    }

#gras {
    background-image: url('../img/bd_gras.png');
    background-repeat: no-repeat;
    background-position: 0px 0px;
    position:absolute;
    left: 0; 
	/*bottom:155px;*/
	bottom: 45px;
    height: 60px;
    z-index:6;
    width: 100%;
    }
html>body #gras {
    position: fixed;
    }
#foot .inner {
    background-image: url('../img/bd_dirt.jpg');
    background-repeat: repeat;
    background-position: 0px 0px;
    position:absolute;
    top:0; left:0; right:0; bottom:0;
    z-index:5;
}
#foot {
    color: #fff;
    position:fixed;
    bottom:0; left:0; right:0;
    margin:0;
    /*height: 165px;*/
	height: 55px;
    z-index:5;
}
#foot h4 {
    text-transform: uppercase;
    margin-bottom: 10px;
    }

#foot p {
    color: #978b71;
    }
#foot .about {
	margin-top: 10px;
    }
#foot .about p {
    font-size: 11px;
    line-height: 1.3;
    text-align: justify;
    }
#foot .sponsors {
    /*background-image: url('../img/foot_sponsors.png');
    background-repeat: no-repeat;
    background-position: -7px 40px;*/
    height: 50px;
    position: relative;
    }
#foot .sponsors h4 {
    color: #978b71;
    padding-left: 10px;
	margin-top: 25px;
    }
#foot .sponsors ul,
#foot .sponsors li {
    list-style-type: none;
    margin: 0;
    padding: 0;    
    } 
#foot .sponsors li {
    float: left;
	display: inline;
}    
#foot a.nbg_online {
	background: url('../img/foot_sponsors_bottom.png') no-repeat 0px 0px;
    cursor: pointer;
    display: block;
    height: 42px;
    position: absolute;
    top: 5px;
    left: 125px;    
    text-indent: -9999px;
    width: 160px;
    }     
#foot a.kuf {
	background: url('../img/foot_sponsors_bottom.png') no-repeat -160px 0px;
    cursor: pointer;
    display: block;
    height: 42px;
    position: absolute;
    top: 5px;
    left: 285px;    
    text-indent: -9999px;
    width: 40px;
    }
#foot a.easy_credit {
	background: url('../img/foot_sponsors_bottom.png') no-repeat -200px 0px;
    cursor: pointer;
    display: block;
    height: 42px;
    position: absolute;
    top: 5px;
    left: 325px;    
    text-indent: -9999px;
    width: 120px;
    }
#foot a.kicker {
	background: url('../img/foot_sponsors_bottom.png') no-repeat -320px 0px;
    cursor: pointer;
    display: block;
    height: 42px;
    position: absolute;
    top: 5px;
    left: 445px;    
    text-indent: -9999px;
    width: 100px;
    } 
#foot .contact {
    font-size: 11px;
    line-height: 1.3;
    text-align: right;
	margin-top: 10px;
    }
#foot .contact p {
    margin-bottom: 11px;
    } 
#foot .contact strong {
    color: #fff;
    }
#foot .contact a {
    color: #54b0c2;
    }                                     

#foot .service {
	text-align: right;
}	

#foot ul.service-nav {
	list-style-type: none;
	float: right;
}

#foot ul.service-nav li {
	float: left;
	display: inline;
	padding: 10px;
}

#foot ul.service-nav li a {
    color: #54b0c2;
}

#foot .copyline {
	clear: both;
	padding: 0 10px;
}

#foot .copyline a {
	color: #54b0c2;
}
	
	
/* dock 
--------------------------------------------- */

#dock {
    background-color: #333;
    background-color: #182F4F;
    background-image: url('../img/dock_grad.png');
    background-repeat: repeat-x;
    background-position: 0px bottom;
    font-size: 11px;
    height: 28px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    }
html>body #dock {
    position: fixed;
    }
#dock .inner {
    position: relative;
    }
#dock .service a {
    background-color: #232323;
    color: #fff !important;
    display: block;
    padding: 2px 10px 3px 10px !important;
    text-decoration: none;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    }
#dock .service a:hover {
    background-color: #000;
    }

#dock .spacer {
    color: #555;
    padding: 0 4px;
    }
	
#dock p.service {
    right: 188px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 4px;
    }
#dock p.service a{
    float: left;
    margin-right: 4px;
    }
form.search input.query {
    -moz-border-radius: 10px;
    } 
#dock .sponsors-dock {
    color: #fff;
    left: 10px;
    line-height: 26px;
    position: absolute;
}
#dock .sponsors-dock {
    color: #fff;
    left: 10px;
    line-height: 26px;
    position: absolute;
}
#dock .sponsors-dock {
    color: #fff;
    left: 10px;
    line-height: 26px;
    position: absolute;
}

#dock .sponsors-dock h4 {
	margin-top: 3px;
}

#dock .sponsors-dock ul,
#dock .sponsors-dock li {
    list-style-type: none;
    margin: 0;
    padding: 0;    
    }    
#dock .sponsors-dock a.nbg_online {
	background: url('../img/foot_sponsors_dock.png') no-repeat -5px 0px;
    cursor: pointer;
    display: block;
    height: 26px;
    position: absolute;
    top: 1px;
    left: 125px;    
    text-indent: -9999px;
    width: 125px;
    }     
#dock .sponsors-dock a.tafelhalle {
	background: url('../img/foot_sponsors_dock.png') no-repeat -140px 0px;
    cursor: pointer;
    display: block;
    height: 26px;
    position: absolute;
    top: 1px;
    left: 250px;    
    text-indent: -9999px;
    width: 100px;
    }
#dock .sponsors-dock a.kuf {
	background: url('../img/foot_sponsors_dock.png') no-repeat -250px 0px;
    cursor: pointer;
    display: block;
    height: 26px;
    position: absolute;
    top: 1px;
    left: 360px;    
    text-indent: -9999px;
    width: 30px;
    }
#dock .sponsors-dock a.easy_credit {
	background: url('../img/foot_sponsors_dock.png') no-repeat -290px 0px;
    cursor: pointer;
    display: block;
    height: 26px;
    position: absolute;
    top: 1px;
    left: 390px;    
    text-indent: -9999px;
    width: 75px;
    }
#dock .sponsors-dock a.kicker {
	background: url('../img/foot_sponsors_dock.png') no-repeat -380px 0px;
    cursor: pointer;
    display: block;
    height: 28px;
    position: absolute;
    top: 1px;
    left: 470px;    
    text-indent: -9999px;
    width: 85px;
    } 	
form.search { position: absolute; right: 10px; top: 5px; }
form.search legend { display: none; }
form.search input.query { background: #888; border: 0; color: #222; float: left; font: 11px 'Arial', Helvetica, sans-serif; font-weight: bold; height: 14px; line-height: 14px; padding: 3px 8px 0 8px; width: 140px; }
form.search input.query:focus { background: #fff; }
form.search label.uberlabel { display: none; }
form.search label.uberlabel-apply { color: #999; font-size: 16px; font-weight: bold; letter-spacing: -1px; padding: 0 8px; position: absolute; top: 2px; left: 0; z-index: 1; }
form.search input.button { background: url('../img/search-icon.png') no-repeat 50% 3px; border: 0; color: #000; cursor: pointer; display: block; float: left; font-size: 11px; height: 17px; margin-left: 4px; text-indent: -9999px; width: 17px; }