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

	Template Name: Alex Flach
	Description: Full Screen 
	Author: BFY Design & Development
	Author URI: http://www.bfy.ch/

	
	1.	CSS Reset
	2.	Document Setup (body, common classes, structure etc)
	3.	Main Content Styles
		3.1 Popup Slide out Style
		3.2 Popup form style
		3.3 error style
		3.4 Success page style
		3.5 Full Screen Slider - http://buildinternet.com/project/supersized/
	4.	Footer
		4.1 Footer Social Icons
		4.2 Countdown Style
	5. iPad Portrait View
	6. Phone landscape View
	7. Phone Portrait View
	8. Phone to iPad reset
		
		
---------------------------------------------------------------------------------
/* 1. CSS Reset
-------------------------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
html,body {
	margin:0;
	padding:0;
	height:100%;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
input{
	border:1px solid #b0b0b0;
	padding:3px 5px 4px;
	color:#979797;
	width:190px;
}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

/*----------------------------------------------------
 2.	Document Setup
------------------------------------------------------*/
body{
	font-family: "HelveticaNeueMedium", "HelveticaNeue-Medium", "Helvetica Neue Medium", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosRegular', "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; font-weight:500; font-stretch:normal;
	background: #fff;
	font-weight: normal;
	font-size: 15px;
	color: #fff;
	height:100%;
}
.ie7 body{
	overflow:hidden;
}
a{
	color: #5F5C61;
	text-decoration: none;
	outline:none;
}
.container{
	position: relative;
	text-align: center;
	margin:0 auto;
	width:100%;
	padding:30px 0 0;
	height:100%;
	overflow:hidden;
	background:url(../images/patterns/pat1.png) repeat scroll 0 0;
}
.clr{
	clear: both;
}

/* Logo
------------------------------------------------------*/
#logo {
	display:inline-block;
	margin:0 auto 60px;
}
h1{
	font-size:100px;
	color:#FFFFFF;
	text-transform:uppercase;
}
h1.title {
	padding: 0 5%;
    width: 90%;
}
h3.coming {
	background:#140d17;
	text-transform:uppercase;
	font-size:24px;
	line-height:140%;
	padding:10px 5%; 
	width:90%;
	margin:0 auto 33px;
}
h3.coming span {
	display:block;
	text-transform:none;
	font-size:1.7em;
	line-height:normal;
	height:21px;
}

/*----------------------------------------------------
3.	Main Content Styles 
------------------------------------------------------*/

/* 3.1 Popup Slide out Style*/

#popup {
	color:#fff;
	padding:117px 43px 93px 40px;
	background:url(../images/popupbg.png) 0 0 no-repeat;
	width:410px;
	height:162px;
	text-align:center;
	margin:0 auto 0;
	position:absolute;
	bottom:-500px;
	left:0;
	right:0;
}
#popup h2 {
	font-size:36px;
	text-transform:uppercase;
	line-height:normal;
	padding:0;
	margin:0 0 15px;
}
#popup p {
	font-size:15px;
	line-height:22px;
	color:#bdbec3;
	margin:0 0 15px;
}
#popup a {
	position:absolute;
	top:26px;
	left:0; right:0;
	margin:0 auto;
	width:32px;
	height:32px;
	font-size:0;
	text-indent:-100000px;
	background:url(../images/link.png) 0 0 no-repeat #2b2c2e;
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	border-radius:50px;
	transition: background 1s;
	-webkit-transition: background 1s;
	-moz-transition: background 1s;
	-o-transition: background 1s;
}
#popup a.none {
	display:none;
}
#popup a#close,
#popup a#close2 {background:url(../images/close.png) 0 0 no-repeat #6c6a6f;}
#popup a#close:hover,
#popup a#close2:hover {
	background-color:#2b2c2e;
}
#popup a.contact {
	background:url(../images/link.png) -32px 0 no-repeat #888c95;
	top:305px !important;
}
#popup a:hover,
#popup a.contact:hover,
#popup a.contact.act {
	background-color:#6c6a6f;
	transition: background 1s;
	-webkit-transition: background 1s;
	-moz-transition: background 1s;
	-o-transition: background 1s;
}
.abs {
	position:absolute;
	width:410px;
}
#infodiv {
	padding-top:48px;
}

.b-modal {
	background:none !important;
	background-color:none !important;
}
.info {
	background:url(../images/info.png) 0 0 no-repeat;
	width:269px;
	height:73px;
	display:block;
	margin:0 auto 0;
	font-size:0;
	text-indent:-10000px;
	cursor:pointer;
	position:absolute;
	bottom:110px;
	left:0;
	right:0;
}
a.pinfo {
	position:absolute;
	top:26px;
	left:0; right:0;
	margin:0 auto;
	width:32px;
	height:32px;
	font-size:0;
	text-indent:-100000px;
	background:url(../images/link.png) 0 0 no-repeat #6c6a6f;
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	border-radius:50px;
	transition: background 1s;
	-webkit-transition: background 1s;
	-moz-transition: background 1s;
	-o-transition: background 1s;
}


/* 3.2 Popup form style*/

#popup input {
	width:167px;
	height:27px;
	background:#f8f8f8;
	font-size:13px;
	line-height:27px;
	color:#a0a2a7;
	padding:4px 16px;
	margin:0 11px 18px 0;
	border:none;
	float:left;
	letter-spacing:-0.04em;
}
#popup input#subemail {
	float:left;
	width:223px;
	margin-right:0;
}
#popup textarea {
	width:378px;
	height:44px;
	background:#f8f8f8;
	font-size:14px;
	line-height:18px;
	color:#a0a2a7;
	padding:16px;
	margin-right:0;
	margin-bottom:10px;
	float:none;
	border:none;
	font-family: "HelveticaNeueMedium", "HelveticaNeue-Medium", "Helvetica Neue Medium", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosRegular', "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; font-weight:500; font-stretch:normal;
}
#popup input.btn {
	width:123px;
	height:35px;
	padding:0;
	margin:0 auto;
	display:block;
	background:#6c6a6f;
	float:none;
	cursor:pointer;
	font-size:18px;
	color:#fff;
	font-weight:bold;
	opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;

}
#popup input.btn:hover {
	opacity: 0.8;
}
#popup input.btn2 {
	width:153px;
	height:35px;
	padding:0;
	margin:0 auto;
	display:block;
	background:#6c6a6f;
	float:none;
	cursor:pointer;
	font-size:15px;
	color:#fff;
	font-weight:bold;
	float:right;
	opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
	letter-spacing:-0.02em;
}
#popup input.btn2:hover {
	opacity: 0.8;
}

/* 3.3 error style*/
.error_message {
	color:#6c6a6f;
	padding-bottom:15px;
	font-size:12px;
}

/* 3.4 Success page style*/
#success_page {
	color:#9ce726;
	padding-bottom:10px;
	font-size:12px;
}
.button.b-close, .button.bClose {
	position:absolute;
	right:-7px;
	top:-7px;
	width:24px;
	height:26px;
	background:url(../images/cross.png) 0 0 no-repeat;
	font-size:0;
	text-indent:-100000px;
	cursor:pointer;
}

/* 3.5 Full Screen Slider - http://buildinternet.com/project/supersized/ */

#supersized-loader {
   position: absolute;
    top: 40px;
    right: 30px;
    z-index: 0;
    width: 31px;
    height: 31px;
    margin: -16px 0 0 -16px;
    text-indent: -999em;
    background: url(images/progress.gif) no-repeat center center;
}

#supersized {
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    overflow: hidden;
    z-index: -999;
    height: 100%;
    width: 100%;
}

#supersized img {
    width: auto;
    height: auto;
    position: relative;
    display: none;
    outline: none;
    border: none;
}

#supersized.speed img {
    -ms-interpolation-mode: nearest-neighbor;
    image-rendering: -moz-crisp-edges;
} /*Speed*/

#supersized.quality img {
    -ms-interpolation-mode: bicubic;
    image-rendering: optimizeQuality;
} /*Quality*/

#supersized li {
    display: block;
    list-style: none;
    z-index: -30;
    position: fixed;
    overflow: hidden;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#supersized a {
    width: 100%;
    height: 100%;
    display: block;
}

#supersized li.prevslide { z-index: -20 }

#supersized li.activeslide { z-index: -10 }

#supersized li.image-loading {
    background: #111 url(images/progress.gif) no-repeat center center;
    width: 100%;
    height: 100%;
}

#supersized li.image-loading img { visibility: hidden }

#supersized li.prevslide img, #supersized li.activeslide img { display: inline }

#controls-wrapper {
    margin: 0 auto;
    height: 31px;
    width: 100%;
    bottom: 0px;
    left: 0;
    z-index: 4;
    background: url(images/bg-form.png) repeat;
    position: fixed;
}

#controls {
    overflow: hidden;
    height: 100%;
    position: relative;
    text-align: left;
    z-index: 5;
}

#slidecounter {
    float: left;
    color: #999;
    font: 12px;
    text-shadow: #000 0 -1px 0;
    margin: 0px 10px 0 15px;
    line-height: 31px;
}

#slidecaption {
    overflow: hidden;
    float: left;
    color: #FFF;
    font: 400 12px;
    text-shadow: #000 1px 1px 2px;
    margin: 0 20px 0 0;
    line-height: 31px;
}

#navigation {
    float: right;
    margin: 0px 20px 0 0;
}

#play-button { 
	float: left; 	
}

#prevslide, #nextslide {
    position: relative;
}

ul#slide-list {
    padding: 15px 0;
    float: left;
    position: absolute;
    left: 50%;
}

ul#slide-list li {
    list-style: none;
    width: 12px;
    height: 12px;
    float: left;
    margin: 0 5px 0 0;
}

ul#slide-list li.current-slide a, ul#slide-list li.current-slide a:hover { 
	background-position: 0 0px 
}

ul#slide-list li a {
    display: block;
    width: 12px;
    height: 12px;
    background: url('images/nav-dot.png') no-repeat 0 -24px;
}

ul#slide-list li a:hover {
    background-position: 0 -12px;
    cursor: pointer;
}

#tray-button {
    position: absolute;
    bottom: 0;
    right: 10px;
	width: 31px;
	height: 31px;
	-webkit-transition:background 0.2s linear; 
	-moz-transition:background 0.2s linear;
	-0-transition:background 0.2s linear;
	transition:background 0.2s linear;
	margin-right:1px;
}

#tray-button:hover {
    background-position: 0 1px;
    cursor: pointer;
}

/* Slider Progress Bar
    ----------------------------*/
#progress-back {
    z-index: 5;
    position: fixed;
    bottom: 31px;
    left: 0;
    height: 3px;
    width: 100%;
    background: url('images/progress-back.png') repeat-x;
}

#progress-bar {
    position: relative;
    height: 3px;
    width: 100%;
}

/* Thumbnail Navigation
    ----------------------------*/
.centered-controls {
	width:117px;
	height:31px;
	margin:0 auto;
}

.centered-controls a {
    height: 31px;
    width: 31px;
    float: left;
	-webkit-transition:background 0.2s linear; 
	-moz-transition:background 0.2s linear;
	-0-transition:background 0.2s linear;
	transition:background 0.2s linear;
	margin-right:1px;
}

.centered-controls a:hover {
	cursor:pointer;
}	

#nextthumb, #prevthumb {
    z-index: 2;
    display: none;
    position: fixed;
    bottom: 61px;
    height: 75px;
    width: 100px;
    overflow: hidden;
    background: #ddd;
    border: 1px solid #fff;
    -webkit-box-shadow: 0 0 5px #000;
}

#nextthumb { right: 12px }

#prevthumb { left: 12px }

#nextthumb img, #prevthumb img {
    width: 150px;
    height: auto;
}

#nextthumb:active, #prevthumb:active { bottom: 59px }

#nextthumb:hover, #prevthumb:hover { cursor: pointer }

#kontakt{
	font-size:18px;
	width:260px;
	line-height:150%;
	color:#140d17;
	margin:0 auto;
}
#kontakt p {
	float:left;
	text-align:left;
}
#kontakt span {
	float:left;
	width:80px;
}
#kontakt a {
	text-decoration:none;
	color:#140d17;
}



/* ---------------------------------------------------
4. Footer
------------------------------------------------------*/
#footer {
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	min-height:110px;
	background:#140d17;
	border-top:1px solid #201e20;
	text-align:center;
	font-size:12px;
	color:#6c6a6f;
}

/* 4.1 Footer Social Icons*/
#footer a.standard {
	display:inline-block;
	width:32px;
	height:32px;
	font-size:0;
	text-indent:-10000px;
	margin:0 3px;
	background:url(../images/social.gif) 0 0 no-repeat;
	
	transition: background .5s;
	-webkit-transition: background .5s;
	-moz-transition: background .5s;
	-o-transition: background .5s;
}
#footer a:hover {
	background-position:0 100%;
}
#footer a.fb {
	background-position:-32px 0;
}
#footer a.fb:hover {
	background-position:-32px 100%;
}
#footer a.gp {
	background-position:-64px 0;
}
#footer a.gp:hover {
	background-position:-64px 100%;
}
#footer a.pin {
	background-position:-96px 0;
}
#footer a.pin:hover {
	background-position:-96px 100%;
}
#footer a.glb {
	background-position:-128px 0;
}
#footer a.glb:hover {
	background-position:-128px 100%;
}
#footer a.a {
	background-position:-160px 0;
}
#footer a.a:hover {
	background-position:-160px 100%;
}
#footer a.in {
	background-position:-192px 0;
}
#footer a.in:hover {
	background-position:-192px 100%;
}
#footer p {
	padding:10px 0;
}



/* 4.2 Countdown Style */

#countdown {
	padding:0;
	position:relative;
}
.hasCountdown {
}
.item {
	display: inline-block;
	position: relative;
	text-align:center;
	margin:0 12px;
	padding:0;
	text-transform:uppercase;
	font-size:13px;
	width:142px;
	height:142px;
	-moz-border-radius:90px;
	-webkit-border-radius:90px;
	border-radius:90px;
	
	/* Fallback for web browsers that don't support RGBa */
    background-color: rgb(95, 95, 95);
    /* RGBa with 0.6 opacity */
    background-color: rgba(95, 95, 95, 0.8);
    /* For IE 8*/
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; 
	filter: alpha(opacity=80);
	
	transition: background 1s;
	-webkit-transition: background 1s;
	-moz-transition: background 1s;
	-o-transition: background 1s;
}
.item span {
	clear:both;
	color:#fff;
	display:inline-block;
	text-transform:lowercase;
	padding:0;
}
.item p {
	text-align:center;
	margin:30px 0 0;
	font-size:48px;
	padding:0;
}

/* ---------------------------------------------------
5. iPad Portrait View
------------------------------------------------------*/
@media (max-width: 768px) {
	.container {
		padding-top:30px;
		min-height:800px;
	}
	.container h1 {
		font-size:68px;
		line-height:105%;
		margin-bottom:10px;
	}	
	h3.coming {
		margin-bottom:45px;
	}
	.item {
		margin-bottom:15px;
		display:inline-block;
		margin:10px;
		padding-top:15px;
		height:127px;
	}
	.item p {
		padding:0;
		margin:15px 0 0;
	}	
	#footer {
		position:relative;
		position:absolute;
		z-index:9999;
	}
	.container h1 {
		/*font-size:62px;*/
	}
}

/* ---------------------------------------------------
6. Phone landscape View
------------------------------------------------------*/
@media all and (max-width: 699px) and (min-width: 480px) {

	#countdown {
		margin-bottom:50px;
		min-height:800px;
	}
	.container h1 {
		font-size:68px;
		line-height:105%;
		margin-bottom:10px;
	}
	.container {
		height:auto;
	}	
}

/* ---------------------------------------------------
7. Phone Portrait View
------------------------------------------------------*/
@media (max-width: 350px) {
	.container {
		height:auto;
		min-height:800px;
		padding: 10px 0 0;
	}
	.container h1 {
		font-size:68px;
		line-height:105%;
		margin-bottom:10px;
	}
	
h3.coming {
	font-size:18px;
	line-height:140%;
	padding:10px 5%; 
}
	.hasCountdown {
		height:auto;
		margin-bottom:50px;
	}
	h3.coming {
		width:auto;
		font-size:20px;
		display:inline-block;
	}
	#infodiv {
		padding-top:25px;
	}	
	.item {
		display:inline-block;
		font-size: 12px;
		height: 75px;
		margin: 10px;
		padding: 25px 0 0;
		width: 100px;
	}
	.item p {
		font-size:25px;
		padding:0;
		margin-top:0;
	}	
	#popup {
		width:auto;
		background:transparent !important;
		padding:0;
		height:220px;
		width:90%;
		margin:0 auto;
		padding-top:40px;
		/* Fallback for web browsers that don't support RGBa */
		background-color: rgb(0, 0, 0);
		/* RGBa with 0.6 opacity */
		background-color: rgba(0, 0, 0, 0.8);
		/* For IE 8*/
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
	}
	#popup a {
		top:10px;
	}
	#popup a.contact {
		top:370px !important
	}
	.abs {
		width:100%;
	}
	#popup h2 {
		font-size:25px;
		margin:15px 0;
	}
	#popup p {
		font-size:14px;
		line-height:20px;
	}
	#popup input {
		float:none;
		width:75%;
		height:16px;
		line-height:16px;
		margin:0 0 8px;
	}
	#popup input#subemail {
		float:none;
		height:24px;
		line-height:24px;
	}
	#popup input#email {
		float:none !important;
	}
	#popup textarea {
		height:20px;
		width:75%;
	}
	#popup input.btn {
		height:40px;
		line-height:40px;
	}
	#popup input.btn2 {
		float:none;
		height:40px;
		line-height:40px;
		width:200px;
	}
}

/*----------------------------------------------------
8. Phone to iPad reset
------------------------------------------------------*/
@media (max-width: 768px) {
	body { -webkit-text-size-adjust:none;}
}