/*! normalize.css v1.1.3 | MIT License | git.io/normalize */
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}button,html,input,select,textarea{font-family:sans-serif}body{margin:0}a:active,a:focus,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:after,q:before{content:'';content:none}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ol,nav ul{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure,form{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}


@font-face {
	font-family: 'Ernst';
	src: url('../fonts/ernst-regularbackg.eot');
	src: url('../fonts/ernst-regularbackg.eot?#iefix') format('embedded-opentype'),
	url('../fonts/ernst-regularbackg.woff') format('woff'),
	url('../fonts/ernst-regularbackg.ttf') format('truetype'),
	url('../fonts/ernst-regularbackg.svg#Ernst-RegularBackg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Typenoksidi';
	src: url('../fonts/Typenoksidi.eot');
	src: url('../fonts/Typenoksidi.eot?#iefix') format('embedded-opentype'),
	url('../fonts/Typenoksidi.woff') format('woff'),
	url('../fonts/Typenoksidi.ttf') format('truetype'),
	url('../fonts/Typenoksidi.svg#Typenoksidi') format('svg');
	font-weight: normal;
	font-style: normal;
}
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
	min-height: 100%;
}

body {
	padding: 0;
	margin: 0;
	background-color: #010101;
	font-family: 'Typenoksidi', "Courier New", 'Courier', monospace;
	font-size: 16px;
	line-height: 1.3;
	min-height: 100%;
}

body.orange {
	background-color: #ffb400;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

.h2-size, h2					{ font-size: 25px; }
.h3-size, h3					{ font-size: 25px; }
.h4-size, h4					{ font-size: 20px; }
.h5-size, h5					{ font-size: 16px; }

h1, h2, h3, h4, h5 				{ font-weight: normal; }

h1								{ margin: 15px 0 10px 0; font-family: 'Ernst', "Arial Black", Gadget, sans-serif; font-size: 52px; text-align: right; text-transform: uppercase; line-height: 1; }
.en h1							{ font-size: 90px;}
.fun-right h1					{ font-family: 'Typenoksidi', "Courier New", 'Courier', monospace; text-align: left; font-size: 28px; margin: 0 0 20px 0; line-height: 1.3; }
h2								{ margin: 20px 0 0; font-family: 'Typenoksidi', "Courier New", 'Courier', monospace; text-align: right; }
h3								{ margin: 0; font-family: 'Typenoksidi', "Courier New", 'Courier', monospace; color: #c00000; }
h4								{ margin: 0; font-family: 'Typenoksidi', "Courier New", 'Courier', monospace; color: #c00000; }
h5								{ margin: 0; font-family: 'Typenoksidi', "Courier New", 'Courier', monospace; }
header p						{ text-transform: uppercase; margin-bottom: 0; }
a, a:visited, h1 a:hover		{ text-decoration: none; color: #000; }
a:hover							{ color: #fff; }
a.to-sponsors:hover				{ color: #c00000; }

p								{ margin: 0 0 1em 0; }

ul								{ margin: 0; padding: 0; list-style: none; }
ul li:before					{ content: '- '; padding-right: 10px;}

.email							{ font-family: "Courier New", 'Courier', monospace; }
a.email:hover					{ color: #c00000; }

.not-capital					{ text-transform: lowercase; }
.caption						{ font-size: 12px; font-style: italic; }

.centered h1					{ margin: 35px 0 20px; font-size: 75px; text-align: center; line-height: 1; }
.centered.en h1					{ margin: 20px 0 0; font-size: 106px; }
.centered h2					{ margin: 0; text-align: center; }

nav.language					{ position: absolute; margin-right: -512px; top: 8px; right: 50%; font-family: "Courier New", 'Courier', monospace; font-size: 10px; text-align: right; z-index: 999; }
nav.language ul					{ margin: 0; padding: 0; }
nav.language li					{ display: inline-block; }
nav.language li:before			{ display: none; }
nav.language li a 				{ color: #444; }
nav.language li a:hover			{ color: #fff; }

header 							{ text-align: right; }
header.centerbox				{ padding-top: 22px; }
.centered header				{ text-align: center; }
.headerbox						{ margin: 0 auto; min-width: 1024px; background: url('../img/background-header.png') no-repeat center bottom; height: 285px; position:relative; z-index: 900; }
.headerbox h3					{ color: #fff; font-family: 'Typenoksidi', "Courier New", 'Courier', monospace; font-size: 24px; text-align: center; width: 330px; margin-top: 48px; -ms-transform: rotate(-2deg); -webkit-transform: rotate(-2deg); transform: rotate(-2deg); }

header nav li:before			{ display: none; }
a.navitem						{ display: block; position: absolute; padding: 2px 25px; text-align: center; background-color: #d20202; color: #fff; }
.navitem:hover					{ background-color: #7e0202; color: #ccc; }

.navitem.one					{ left: 23px; top: 33px; -ms-transform: rotate(21deg); -webkit-transform: rotate(21deg); transform: rotate(21deg);}
.navitem.two					{ left: -3px; top: 83px; -ms-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg);}
.navitem.three					{ left: -29px; top: 132px; -ms-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg);}

.navitem.four					{ left: 203px; top: 42px; -ms-transform: rotate(-14deg); -webkit-transform: rotate(-14deg); transform: rotate(-14deg);}
.navitem.five					{ left: 253px; top: 87px; -ms-transform: rotate(-2deg); -webkit-transform: rotate(-2deg); transform: rotate(-2deg);}
.navitem.six					{ left: 224px; top: 132px; -ms-transform: rotate(7deg); -webkit-transform: rotate(7deg); transform: rotate(7deg);}

.content						{ background-color: #ffb400; position: relative; z-index: 10; margin-top: -110px; padding: 90px 0 10px 0; min-height: 200px; min-width: 1024px; }
.redline						{ background-color: #d20202; position: relative; z-index: 10; font-size: 18px; color: #fff; padding: 8px 0; line-height: 1; }
.redline p						{ margin: 0; }


#content-wrapper 				{ position: relative; margin: 0 auto; width: 1024px; padding-top: 20px; min-height: 748px; }
#content-wrapper.centered 		{ margin-top: 60px; }
.centerbox						{ margin: 0 auto; width: 1024px; position: relative; }
.centered						{ text-align: center; }

.home							{ background: url('../img/background-home-bong.jpg') no-repeat 220px 240px; }
.entry-button					{ margin: 120px 0 0 200px; }
.en .entry-button				{ margin: 95px 0 0 200px; }
.entry-button a 				{ display: block; }
.de .image-btn					{ margin:0 auto 20px auto; width: 165px; height: 110px; background: url('../img/background-entry-button_de.png') no-repeat 0 0; }
.en .image-btn					{ margin:0 auto 20px auto; width: 145px; height: 144px; background: url('../img/background-entry-button_en.png') no-repeat 0 0; }
.fr .image-btn					{ margin:0 auto 20px auto; width: 165px; height: 109px; background: url('../img/background-entry-button_fr.png') no-repeat 0 0; }
a.enter-btn						{ font-size: 25px; color: #fff; text-transform: uppercase; }
a.enter-btn:hover				{ color: #c00000; }


a.rules							{ text-transform: uppercase; }
a.rules:hover					{ color: #c00000; }
a.rules-inline					{ display: block; margin-top: 10px; color: #c00000; }
.twenty-rules					{ margin: 0 0 0 80px; float: left; font-size: 20px; line-height: 2; text-align: left; white-space: nowrap; }

.button							{ position: absolute; }

.sylvie							{ top: 104px; left: -35px; width: 388px; height: 161px; background: url('../img/sylvie-portrait.png') no-repeat 0 0; }
.facebook						{ top: 245px; left: 720px; width: 62px; height: 60px; background: url('../img/facebook.png') no-repeat 0 0; }
.youtube						{ top: 320px; left: 720px; width: 69px; height: 73px; background: url('../img/youtube.jpg') no-repeat 0 0; }
.to-sponsors					{ top: 220px; left: 720px; width: 151px; height: 136px; background: url('../img/tickets_de.png') no-repeat 0 0; z-index: 5; }
.en .to-sponsors				{ background: url('../img/tickets_en.png') no-repeat 0 0; }
.fr .to-sponsors				{ background: url('../img/tickets_fr.png') no-repeat 0 0; }

.twocolumns						{ margin: 50px auto 0; width: 760px; }
.left-col						{ float: left; width: 120px; padding-top: 10px; }
.action-btn						{ display: block; margin-bottom: 10px; padding: 8px 15px; font-size: 18px; background: rgba(0,0,0,0.4); line-height: 1; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 48px;}
.sound							{ position: absolute; padding: 0; top: -5px; right: -55px; width: 30px; height: 30px; }
.on 							{ background: rgba(0,0,0,0.4) url('../img/audio-on.png') no-repeat center center; }
.off 							{ background: rgba(0,0,0,0.4) url('../img/audio-off.png') no-repeat center center; }
.sponsoring						{ position: absolute; bottom: 0; right: 5px; padding: 20px 15px; background: #c00000; border: solid 2px #600000; text-align: center; }

.newsletter-form				{ display: block; position: absolute; width: 146px; right: 0; top: 0; }
.newsletter-form h5				{ margin-bottom: 10px;}
.newsletter-form input			{ display: block; margin: 0 0 10px 0; padding: 2%; border: solid 1px #999; width: 96%; font-family: Arial, Helvetica, sans-serif;  }
.newsletter-form input[type="submit"] { margin-top: 20px; padding: 10px 5px; background: rgba(0,0,0,0.6); border: 0; color: #fff; font-weight: normal; font-family:'Typenoksidi', "Courier New", 'Courier', monospace; }
.newsletter-form input[type="submit"]:hover	{ color: #c00000; }
.newsletter-form select			{ display: block; margin: 0 0 10px 0; padding: 2%; width: 100%; }

.fun-left .newsletter-form		{ display: block; position: relative; width: 146px; margin: 0 auto; }

.bong							{ position: absolute; top: 76px; right: 46px; width: 258px; height: 366px; z-index: 0; background: url( '../img/background-trailer-bong.png') no-repeat 0 0; }

.info-column					{ float: left; width: 360px; }
.info-column p					{ font-size: 14px; line-height: 1.4; }
.sponsor-info					{ margin-top: 30px; }
.sponsor-list					{ position: absolute; right: -60px; top: 220px; }
.sponsor-list					{ position: absolute; right: -60px; top: 230px; }
.buy-tickets-btn				{ display: inline-block; width: 260px; height: 98px; background: url('../img/tickets_kaufen_de.png') no-repeat 0 0; }
.en .buy-tickets-btn			{ background: url('../img/tickets_kaufen_en.png') no-repeat 0 0; }
.fr .buy-tickets-btn			{ background: url('../img/tickets_kaufen_fr.png') no-repeat 0 0; }
.follow-on-facebook				{ display: inline-block; margin-top: 30px; width: 121px; height: 47px; background: url('../img/follow_on_facebook.png') no-repeat 0 0; }
.back-to-teaser					{ position: absolute; top: 90px; }

footer							{ width: 100%; min-width: 1024px; height: 450px; background: #010101 url('../img/party_crowd.jpg') repeat-x top center; z-index: 0; }
footer .credits					{ margin-top: 15px; background: #010101; }
footer .linklist				{ padding-top: 210px; }
footer p						{ padding: 30px 0 55px 0; font-size: 12px; color: #999; line-height: 1.5; background: url('../img/credits.png') no-repeat center bottom; }
footer .promolink				{ display: inline-block; padding: 3px; margin: 0 15px; width: 150px; background: #258e00; text-align: center; }

#order-form-floater 			{ position: fixed; display: none; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.75); z-index: 20000; }
#order-form-floater .action-btn	{ position: absolute; top: 40px; right: 40px; font-size: 42px; color: #fff; background: rgba(255,255,255,0.5); }
#order-form-floater .action-btn:hover { color: #000; }
.overlay-box					{ margin: 100px auto 0; padding: 30px; width: 500px; background: rgba(255,255,255,1); -webkit-border-radius: 24px; -moz-border-radius: 24px; border-radius: 24px; }
.order-form h4					{ margin-bottom: 30px; text-align: center; }
.order-form label,
.order-form input,
.order-form select 				{ display: block; font-family: "Courier New", 'Courier', monospace;  }
.order-form input[type='text']	{ width: 96%; margin: 0 0 30px 0; padding: 8px 2%; font-size: 18px; line-height: 1; border: #aaa solid 1px; }
.order-form input[type='submit'] { margin: 0 auto; font-size: 18px; color: #fff; padding: 15px 60px; background: #c00000; border: 0; text-align: center; -webkit-border-radius: 48px; -moz-border-radius: 48px; border-radius: 48px; }
.order-form input[type='submit']:hover { color: #000; background: #ddd; }
.order-form #sponsoring			{ float: right; width: 66%; }
.order-form #currency			{ float: left; width: 25%; height: 38px; padding: 8px 2%; font-size: 18px; line-height: 1; border: #aaa solid 1px; background: #fff; -webkit-appearance: none; }
.order-form input.error			{ border: dashed 1px #c00000; }


.castlist						{ margin-bottom: 20px; -ms-transform: rotate(-2deg); -webkit-transform: rotate(-2deg); transform: rotate(-2deg); }
.castlist li:before				{ display:none; }
.realname, .actorname			{ margin: 0; padding: 0; float: left; }
.realname						{ text-align: right; }
.actorname						{ margin-left: 20px; color: #fff }
.actorname a					{ color: #fff; }
.actorname a:hover				{ color: #222; }
.locations						{ text-align: center; float: left; width: 345px; }

.slideshow						{ position: absolute; margin-left: -100px; left: 50%; top: -50px; right: 0; bottom: -30px; overflow: hidden; }
.slideshow img					{ position: absolute; display: block; margin: auto; top: -3000px; left: -3000px; bottom: -3000px; right: -3000px; max-height: 100%; opacity: 0; }
.nextslide						{ position: absolute; bottom: 10px; right: 20px; color: #fff; font-size: 24px;}

.fun-left						{ float: left; width: 33%; }
.fun-right						{ float: right; width: 66%; }

/* photostack */

.photostack {
	position:absolute;
	margin:20px;
	z-index: 0;
	left: 390px;
	top: 215px;
}
.photostack div{
	height:0;
}
div.photo {
	position: absolute;
	padding: 20px 20px 60px 20px;
	background: #FFFFFF;
	height: 350px;
	width: 350px;
	-moz-box-shadow:    1px 1px 10px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 1px 1px 10px 3px rgba(0,0,0,0.3);
	box-shadow:         1px 1px 10px 3px rgba(0,0,0,0.3);
}

div.photo p {
	font-size: 18px;
	margin-top: 10px;
	line-height: 1;
}

div.photo .jobtitle {
	font-size: 14px;
	color: #ccc;
	line-height: 1;
}

.photostackwrapper{
	overflow:hidden;
	height:500px;
}
.placeholder{
	outline:solid 1px red;
}

.photostack .photo img, .photostack .photo span img{
	display:block;
}

div.caption{
	display: none;
}





/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (max-height: 880px ) {
	footer							{ height: 100px; background-position: bottom center; }
	footer .credits					{ display: none; }
	footer .linklist				{ padding-top: 65px; }
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

	.de .image-btn		{ background-image: url('../img/background-entry-button_de@2x.png'); background-size: 165px 110px; }
	.en .image-btn		{ background-image: url('../img/background-entry-button_en@2x.png'); background-size: 145px 144px; }
	.fr .image-btn		{ background-image: url('../img/background-entry-button_fr@2x.png'); background-size: 165px 109px; }
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: "";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

	.action-btn,
	.language {
		display: none;
	}
}