@font-face {
font-family:'pixyfoto';
/* first for IE 4–8 */
src: url('../assets/fonts/pixyfoto.eot');
src: url("../assets/fonts/pixyfoto.eot")format("embedded-opentype"),/*?#iefix*/
url("../assets/fonts/pixyfoto.woff") format("woff");
}
@font-face {
font-family:'pixyfoto-regular';
/* first for IE 4–8 */
src: url('../assets/fonts/pixyfoto-Regular.eot');
src: url("../assets/fonts/pixyfoto-Regular.eot")format("embedded-opentype"),/*?#iefix*/
url("../assets/fonts/pixyfoto-Regular.woff") format("woff");
}
@font-face {
font-family:'pixyfoto-medium';
/* first for IE 4–8 */
src: url("../assets/fonts/pixyfoto-Medium.eot");
/* then for WOFF-capable browsers */
src: url("../assets/fonts/pixyfoto-Medium.eot")format("embedded-opentype"),
url("../assets/fonts/pixyfoto-Medium.woff") format("woff");
}
@font-face {
font-family:'pixyfoto-bold';
/* first for IE 4–8 */
src: url("../assets/fonts/pixyfoto-Bold.eot");
/* then for WOFF-capable browsers */
src: url("../assets/fonts/pixyfoto-Bold.eot")format("embedded-opentype"),
url("../assets/fonts/pixyfoto-Bold.woff") format("woff");
}
@font-face {
font-family:'pixyfoto-light';
/* first for IE 4–8 */
src: url("../assets/fonts/pixyfoto-Light.eot");
/* then for WOFF-capable browsers */
src: url("../assets/fonts/pixyfoto-Light.eot")format("embedded-opentype"),
url("../assets/fonts/pixyfoto-Light.woff") format("woff");
}

.pixyfoto {
font-family:'pixyfoto';
}
.pixyfoto-regular {
font-family:'pixyfoto-regular';
}
.pixyfoto-medium {
font-family:'pixyfoto-medium';
}
.pixyfoto-bold {
font-family:'pixyfoto-bold';
}
.pixyfoto-light {
font-family:'pixyfoto-light';
}

body.login {
	background: url(../images/background/overlay.png), url(../images/background/overlay.png), url(../images/background/kind-mauer.jpg);
	background-position: top left, top left, center;
	background-repeat: repeat, repeat, no-repeat;
	background-size: auto, auto,cover;
	background-attachment: fixed, fixed, fixed;
	margin: 0;
}

button { border-radius:0 !important;cursor:pointer !important; }

#anmeldung-wrapper {
	/*left: -9px;
	right: 0px;
	top: -31px;
	bottom: 0px;*/
	height:100%;
	width:100%;
	/*min-width: 950px;
	min-height: 550px;*/
	box-sizing: border-box;
	position: absolute;
	z-index: 3;	
}
#anmeldung-container {
	/*margin-top: -198px;
	margin-left: -180px;
	left: 50%;
	top: 50%;*/
	/*width: 500px;
	height: 500px;*/
	width: 400px;
	height: 230px;
	opacity: 1;
	z-index:5;
	overflow: visible !important;
	background-color: rgba(255,255,255,0.75);
	border-radius: /*60px*/ 0;
    position: relative;
	/*-webkit-box-shadow: 0px 0px 40px 40px rgba(116, 116, 116, 0.5);  WebKit 0px 0px 7px 4px rgba(116, 116, 116, 0.8);*/
	/*-moz-box-shadow: 0px 0px 40px 40px rgba(116, 116, 116, 0.5);  Firefox 0px 0px 7px 4px rgba(116, 116, 116, 0.8);*/
	box-shadow: none; /*0px 0px 70px 40px rgba(116, 116, 116, 0.5);  Standard  0px 0px 7px 4px rgba(116, 116, 116, 0.8);*/
}
#anmeldung-form1 {
    left: 0px;
	margin-left:15px;
    width: 95%;
    top: 0px;
    height: 100%;
    z-index: 5;
	overflow: visible !important;
}
#anmeldung-form2 {
    left: 0px;
	margin-left:8px;
    width: 100%;
    top: 0px;
    height: 100%;
    z-index: 5;
	overflow: visible !important;
}
#anmeldung-form99 {
    left: 0px;
	margin-left:8px;
    width: 100%;
    top: 0px;
    height: 100%;
    z-index: 5;
	overflow: visible !important;
}
.div-view {
    cursor: default;
    overflow: hidden;
    margin: 0px;
    border: 0px solid transparent;
    -moz-user-select: none;
}
.div-logo {
	left: 114px;
	padding-top:10px;
	z-index: 10;
	/*pointer-events: none;*/
	text-align:center;
	margin: 20px 0 10px 0;
}
.div-header {
	font-family:'pixyfoto-medium', Arial, Helvetica, sans-serif;
	font-weight:300;
	letter-spacing:0.01em;
    text-align: left;
    color: /*#5F7883*/#444;
    left: 0px;
    right: 0px;
    font-size: 23px;
    z-index: 10;
    background-color: inherit;
    /*pointer-events: none;*/
	cursor:default;
	top: 131px;
	margin:0px 20px 20px 33px;
}
.div-text {
    text-align: left;
    color: /*#5F7883*/#444;
    left: 0px;
    right: 0px;
    font-size: 20px;
	line-height:26px;
    z-index: 10;
    background-color: none;
   /* pointer-events: none;*/
	cursor:default;
	margin:0px 30px 20px 33px;
	white-space:normal;
}
#text .kasten {
	bottom:0;
	border:1px solid black;
	width: 400px;
	height: auto;
	opacity: 1;
	z-index:5;
	overflow: visible !important;
	background-color: rgba(0,0,0,0.65);
	border-radius: /*60px*/ 0;
    position: absolute;
	-webkit-box-shadow: /*0px 0px 40px 40px rgba(116, 116, 116, 0.5);  WebKit */0px 0px 7px 4px rgba(116, 116, 116, 0.8);
	-moz-box-shadow: /*0px 0px 40px 40px rgba(116, 116, 116, 0.5);  Firefox */0px 0px 7px 4px rgba(116, 116, 116, 0.8);
	box-shadow: /*0px 0px 70px 40px rgba(116, 116, 116, 0.5);  Standard */ 0px 0px 7px 4px rgba(116, 116, 116, 0.8);
	padding:10px 15px 10px 15px;
	display:none;
}
#text .kasten .div-text {
	color: #FFF;
	font-size: 16px;
	display:none;
	margin:10px 0 10px 0;
	background-color:none;
}

#error, #text, #success, #online {
	width: 400px;
	height: 250px;
}
#error .errortext1, #error .errortext2, #error .errortext3, #notok {
	bottom:0;
	color: #FFF;
	font-size: 16px;
	border:1px solid red;
	width: 400px;
	height: auto;
	opacity: 1;
	z-index:5;
	overflow: visible !important;
	background-color: rgba(220,20,60,0.75);
	border-radius: /*60px*/ 0;
    position: absolute;
	-webkit-box-shadow: /*0px 0px 40px 40px rgba(116, 116, 116, 0.5);  WebKit */0px 0px 7px 4px rgba(116, 116, 116, 0.8);
	-moz-box-shadow: /*0px 0px 40px 40px rgba(116, 116, 116, 0.5);  Firefox */0px 0px 7px 4px rgba(116, 116, 116, 0.8);
	box-shadow: /*0px 0px 70px 40px rgba(116, 116, 116, 0.5);  Standard */ 0px 0px 7px 4px rgba(116, 116, 116, 0.8);
	padding:10px 30px 10px 30px;
	white-space:pre-wrap;
}

#email-btn {
    text-align: left;
    color: /*#5F7883*/#444;
    /*left: 0px;
    right: 0px;*/
    font-size: 14px;
    z-index: 10;
    background-color: none;
	/*margin:50px 25px 20px 5px;*/
}

#login-btn {
    color: /*#5F7883*/#000;
    /*left: 0px;
    right: 0px;*/
    font-size: 14px;
    z-index: 10;
    background-color: none;
	/*margin:20px 60px 20px 0px;*/
}
.btn.btn-login {
	border-radius:30px !important;
	background-color: #fff;
	border: 1px solid #bbb;
	width: auto;
	color:#555;
	font-size:19px;
	margin-right:30px;
	margin-top:20px;
}

.btn.btn-login.btn-success {
	background-color: /*#10B8A9*/rgb(255, 149, 82);
	border: 1px solid /*#10B8A9*/rgb(255, 149, 82);
	width: auto;
	color:#fff;
	box-shadow:none;
}

.form-control {  }
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="url"], input[type="tel"], textarea {
	/*line-height: 45px;
	color: #333;
	font-size: 19px;
	background:rgba(255,255,255,0.6);
	font-family: inherit;
	border:1px solid #B3B3B3;
	width: 90%;
	display: block;*/
	/*height:45px;*/
	border-radius:1px;
	border:1px solid #bbb;
	color:#111 !important;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="url"]:focus, input[type="tel"], textarea:focus {
	/*background: rgba(255,255,255,0.5) !important;*/
}
input[type="text"].login, input[type="password"].login { /*width: 40%;margin: 0 0 20px 20px;display:inline-block; */}

.icheckbox_square-aero ~ label, .iradio_square-aero ~ label { font-size:16px; color: #5F7883;vertical-align: middle;}
.left-inner-addon {
    position: relative;
}
.left-inner-addon input {
    padding-left: 45px;    
}
.left-inner-addon i {
    position: absolute;
    padding: 10px 12px;
    pointer-events: none;
}

.right-inner-addon {
    position: relative;
}
.right-inner-addon input {
    padding-right: 30px;    
}
.right-inner-addon i {
    position: absolute;
    right: 0px;
    padding: 10px 12px;
    pointer-events: none;
}
#submitAnmeldung {
	background:url(../images/formular/login-inaktiv.png);
	background-repeat:no-repeat;
	background-position:center right;
	width:70%;
	top: 280px;
	z-index: 30;
	height: 70px;
	position:absolute;
	cursor:default;
	right:30px;
	margin-top:30px;
}
#submitAnmeldung.active {
	background:url(../images/formular/login-hover.png);
	background-repeat:no-repeat;
	background-position:center right;
	cursor:pointer;
}

#checkboxAngemeldet { padding: 20px 0 0 25px; }
#checkboxAngemeldet label { font-weight:normal; padding-left:5px; vertical-align: top; }

#forgotPw { position:absolute; bottom: 10px; right: 10px; z-index:10; padding-left:10px;}
#forgotPw, #forgotPw a { color: #fff; font-size:14px; font-weight:normal; font-family: "Helvetica Neue",Verdana,Geneva,sans-serif;}
#forgotPw a:link, #forgotPw a:link:hover, #forgotPw a:link:visited { text-decoration: none; color: #fff; font-size:14px; font-weight:normal; font-family: "Helvetica Neue",Verdana,Geneva,sans-serif;}

::-moz-placeholder { color:#ccc !important;font-weight:normal;}
::-webkit-input-placeholder {color:#ccc  !important;font-weight:normal;}
::-ms-input-placeholder {color:#ccc !important; font-weight:normal !important;}

input:-webkit-autofill, input::-webkit-autofill:focus, :focus, input::focus:-webkit-autofill, 
input:-webkit-autofill:focus,  input:focus:-webkit-autofill  {
	-webkit-box-shadow: inset 0 0px 1000px #fff  !important;
	outline: 0 none !important;
}

input:focus, textarea:focus { outline:none; }
/*Safari Hack*/
html:not([dummy]) form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea  {
  line-height:1.5em;
}

textarea { resize: none; }

input[type=text]::-ms-clear {  display: none; width : 0; height: 0; }
input[type=text]::-ms-reveal {  display: none; width : 0; height: 0; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }

/* === HTML5 validation styles === */	
input:required, textarea:required, div.required {
	background: /*#F7F9FB*/ #FFF url(../images/required5.png) no-repeat 98% center;
}
input[type="number"]:required {
	background: /*#F7F9FB*/ #FFF url(../images/required5.png) no-repeat 80% center;
}

input:required:valid, textarea:required:valid, div.valid {
	background-image: url(../images/valid5.png);background-repeat: no-repeat; background-position:99% center;
}

input[type="number"]:required:valid {
	background-image: url(../images/media/pics/template/valid5.png);background-repeat:no-repeat; background-position:80% center;
}

input:focus:invalid, textarea:focus:invalid, div.invalid {
	background: #F7F9FB url(../images/invalid5.png) no-repeat 98% center;
	border: 1px solid #FF8484;
}

input:focus:invalid,
textarea:focus:invalid,
select:focus:invalid {
  box-shadow:none  !important;
}

input[type="number"]:focus:invalid {
	background: #fff url(../images/media/pics/template/invalid5.png) no-repeat 80% center;
}

#pwd { font-weight:bold; font-size:22px; }
label { display:none; /*height:1px;left:-999em;overflow:hidden;position:absolute;*/}
label:after, label.two-rows:after  { content: '\a'; white-space: pre; }

.anmeldungError, .error { color: #EC4242;padding:0;margin-top:30px;}
#successNote { color: #1C976E;}
ul.errorMessages {list-style-type: none;color: #FF4D33; margin-left:0; }
ul.errorMessages li {color:inherit;padding-left:50px; }
ul.errorMessages li:before {content:"";margin-left: 0;}
ul.errorMessages img {margin-left:50px; }

/* Notebook, Tablet landscape */
@media screen and (min-width: 768px) and (max-width: 1200px) {
	
	#anmeldung-container {	}
	#text .kasten {	}

}	

/* alle Smartphones Portrait*/
@media all and (max-width: 767px) {

	#anmeldung-container {
		width:340px;
		height: 190px;
	}
	.div-text { margin-left:23px;margin-right:15px;font-size:16px;line-height:25px;}
	.div-header {
		font-size: 18px;
		top: 131px;
	}
	.div-logo {
	}

	#div-form1 { margin-top:-5px !important; }
	#anmeldung-form1 { margin-left:5px; }
	#nickname, #email { margin-bottom:10px; }
	.btn.btn-login {
		margin-top:0px;
		margin-bottom:10px !important;
		font-size:16px;
	}
	
	#error, #text, #success, #online {
		width: 340px;
	}
	#text .kasten {
		width: 340px;
	}
	#error .errortext1, #error .errortext2, #error .errortext3, #notok {
		font-size: 14px;
		width:340px;
		padding:10px 20px 10px 20px;
		line-height:20px;
		background-color: rgba(220,20,60,1); 
	}

	input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="url"], input[type="tel"], textarea {

	}
	#email { font-size:14px;}
	#form2 i.fa-envelope { font-size:18px !important; display:none; }
	#form2 .left-inner-addon input { padding-left: 10px; }

	#submitAnmeldung {
		top: 250px;
		background-size:35px auto;
	}
	#submitAnmeldung.active {
		background-size:35px auto;
	}

	#forgotPw { z-index:10; padding-left:10px;}
	#forgotPw, #forgotPw a { font-size:10px; }
	#forgotPw a:link, #forgotPw a:link:hover, #forgotPw a:link:visited { color: #fff; font-size:10px; }

}