/********************************************************************************************/
/*////////////////////////////////////////////////////////////////////////////////////////////
/* Import des typos
/////////////////////////////////////////////////////////////////////////////////////////////
/********************************************************************************************/
/* Gotham Light */
@font-face
{
	font-family: 'Gotham-Light';
	src:url('../../master/font/gotham/Gotham-Light.eot'); /* IE9 Compat Modes */
	src:url('../../master/font/gotham/Gotham-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('../../master/font/gotham/Gotham-Light.woff') format('woff'), /* Modern Browsers */
		url('../../master/font/gotham/Gotham-Light.ttf')  format('truetype'), /* Safari, Android, iOS */
		url('../../master/font/gotham/Gotham-Light.svg#svgFontName') format('svg'); /* Legacy iOS */
}
/* Gotham Bold */
@font-face
{
	font-family: 'Gotham-Bold';
	src:url('../../master/font/gotham/Gotham-Bold.eot'); /* IE9 Compat Modes */
	src:url('../../master/font/gotham/Gotham-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('../../master/font/gotham/Gotham-Bold.woff') format('woff'), /* Modern Browsers */
		url('../../master/font/gotham/Gotham-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
		url('../../master/font/gotham/Gotham-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */
}


/********************************************************************************************/
/* Login
/********************************************************************************************/
body,
html
{
	padding:0;
	margin:0;
	background:#888;
	overflow:hidden;
	width:100vw;
	height:100vh;
	font-family:"Gotham-Light";
}

/********************************************************************************************/
/* Parallax Scene
/********************************************************************************************/
#scene
{
	width:110vw;
	height:110vh;
	padding:0;
	margin:0;
	position:absolute;
	top:-10%;
	left:-10%;
	overflow:hidden;
}
#scene .layer
{
	height:120%;
	width:120%;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	position:absolute;
	
}
#scene .layer0
{
	-webkit-filter: blur(0px);
	-moz-filter: blur(0px);
	-ms-filter: blur(0px);
	-o-filter: blur(0px);
	filter: blur(0px);
	background-image:url('../../../media/common/login_layer0.png');
}
#scene .layer1
{
	-webkit-filter: blur(4px);
	-moz-filter: blur(4px);
	-ms-filter: blur(4px);
	-o-filter: blur(4px);
	filter: blur(4px);
	background-image:url('../../../media/common/login_layer1.png');
	top:65% !important;
	left:85% !important;
	width:55px;
	height:76px;
}
#scene .layer2
{
	-webkit-filter: blur(8px);
	-moz-filter: blur(8px);
	-ms-filter: blur(8px);
	-o-filter: blur(8px);
	filter: blur(8px);
	background-image:url('../../../media/common/login_layer2.png');
	top:40% !important;
	left:50% !important;
	width:70px;
	height:94px;
}
#scene .layer3
{
	-webkit-filter: blur(14px);
	-moz-filter: blur(14px);
	-ms-filter: blur(14px);
	-o-filter: blur(14px);
	filter: blur(14px);
	background-image:url('../../../media/common/login_layer3.png');
	top:40% !important;
	left:15% !important;
	width:75px;
	height:96px;
}
#scene .layer4
{
	-webkit-filter: blur(18px);
	-moz-filter: blur(18px);
	-ms-filter: blur(18px);
	-o-filter: blur(18px);
	filter: blur(18px);
	background-image:url('../../../media/common/login_layer4.png');
	top:75% !important;
	left:20% !important;
	width:94px;
	height:124px;
}
#scene .layer5
{
	-webkit-filter: blur(24px);
	-moz-filter: blur(24px);
	-ms-filter: blur(24px);
	-o-filter: blur(24px);
	filter: blur(24px);
	background-image:url('../../../media/common/login_layer5.png');
	top:5% !important;
	left:45% !important;
	width:110px;
	height:121px;
}
#scene .layer6
{
	-webkit-filter: blur(28px);
	-moz-filter: blur(28px);
	-ms-filter: blur(28px);
	-o-filter: blur(28px);
	filter: blur(28px);
	background-image:url('../../../media/common/login_layer6.png');
	top:75% !important;
	left:40% !important;
	width:175px;
	height:219px;
}
#scene .layer7
{
	-webkit-filter: blur(32px);
	-moz-filter: blur(32px);
	-ms-filter: blur(32px);
	-o-filter: blur(32px);
	filter: blur(32px);
	background-image:url('../../../media/common/login_layer7.png');
	top:50% !important;
	left:60% !important;
	width:302px;
	height:398px;
}

/********************************************************************************************/
/* Page
/********************************************************************************************/
#overlay
{
	z-index:2;
	background: -moz-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.2) 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.2))); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.2) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.2) 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.2) 100%); /* IE10+ */
	background: radial-gradient(ellipse at center,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.2) 100%); /* W3C */
}
#overlay > ul
{
	min-height:100vh !important;
}
@media (min-width:480px)
{
	#overlay > ul > li > div
	{
		width:400px;
	}
}
@media (max-width:480px)
{
	#overlay > ul > li > div
	{
		width:100%;
	}
}
.uk-card-default
{
	background:rgba(0,0,0,0.5) !important;
}

/********************************************************************************************/
/* Login form
/********************************************************************************************/
/* Flipping profile pics */
#profilepic
{
	height:90px;
	width:90px;
	border-radius:50%;
	margin:0 auto 20px auto;
	background-color:rgba(255,255,255,0.1);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	overflow:hidden;
	-webkit-transition: all .15s ease-out; 
	-moz-transition: all .15s ease-out; 
	-o-transition: all .15s ease-out; 
	transition: all .15s ease-out;
}
#profilepic
{
    -webkit-perspective: 600px;
    -moz-perspective: 600px;
}
#profilepic>*
{
    position: absolute;
    top: 0;
	left:0;
	height:100%;
	width:100%;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
    -o-transition: all .15s ease-in-out;
    -ms-transition: all .15s ease-in-out;
    -moz-transition: all .15s ease-in-out;
    -webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out;
    -moz-transform-style: preserve-3d;
    -moz-backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
	overflow:hidden !important;
	border-radius:50%;
	border:1px solid rgba(255,255,255,0.4);
}
#profilepic .front {
	background-size:50%;
    z-index: 9;
    -webkit-transform: rotateX(0deg) rotateY(0deg);
    -moz-transform: rotateX(0deg) rotateY(0deg);
}
#profilepic.flipped .front {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
}
#profilepic .back {
    z-index: 8;
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
}
#profilepic .back img{
    opacity:0.5;
}
#profilepic.flipped .back {
    z-index: 10;
    -webkit-transform: rotateX(0deg) rotateY(0deg);
    -moz-transform: rotateX(0deg) rotateY(0deg);
}


form fieldset
{
	padding:0;
	border:0;
	margin:0;
}
label
{
	display:none !important;
}
input,
button
{
	color:#eee !important;
	border-radius:2px !important;
	text-align:center;
}
input
{
	background:transparent !important;
}
div.uk-margin
{
	margin:0 0 5px 0 !important;
}

/* Placeholder */
::-webkit-input-placeholder {
   color: rgba(255,255,255,0.3);
	font-family:"Gotham-Light";
}
:-moz-placeholder { /* Firefox 18- */
   color: rgba(255,255,255,0.3);
	font-family:"Gotham-Light";
}
::-moz-placeholder {  /* Firefox 19+ */
   color: rgba(255,255,255,0.3);
	font-family:"Gotham-Light";
}
:-ms-input-placeholder {  
   color: rgba(255,255,255,0.3);
	font-family:"Gotham-Light";
}
input:-webkit-autofill {
	background: transparent !important;
}