@charset "UTF-8";
/* CSS Document */

/* Font Open Sans */
@font-face {
  font-family: 'Open Sans';
  font-style: lighter;
  font-weight: 300;
  src: url('../layout/fonts/OpenSans-Light.ttf') format('truetype'); 
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../layout/fonts/OpenSans-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Open Sans';
  font-style: bold;
  font-weight: 600;
  src: url('../layout/fonts/OpenSans-SemiBold.ttf') format('truetype');
}

/* Template */
body {
    font-family: 'Open Sans',Arial, Helvetica, sans-serif;
    font-size: 14px;
	font-weight: 300;
    line-height: 1.42857143;
    color: #434548;
	margin:0px;
	background-color: #ececec;
}


h1{
	font-size: 15px;
	font-weight: lighter;
	float: right;
	margin-bottom: 0px;
	margin-top: 30px;
}

h4{
	font-weight: 400;
}

.box{
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 13;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
}

.login{
	max-width: 360px;
	background-color: #fff;
	margin: 20px;
}

.login .logo{
	width: 90%;
	padding:10px 5%;
	float: left;
	border-bottom: 1px solid #d41217;
}

.login .logo img{
	width: 130px;
}

.login .eingabe{
	width: 88%;
	padding: 28px 6%;
	float: left;
}

.login .eingabe .text{
	width: 95%;
	border: solid 1px #c1c1c1;
	border-radius: 4px;
	padding: 10px 2%;
	margin: 8px 0px;
	font-size: 13px;
}

.login .eingabe .info{
	margin-top: 13px;
}

.login .eingabe .zu{
	text-decoration:none;
	color:#434548;
}

.login .eingabe .zu:hover{
	color:#d41217;
}

.login .eingabe .log {
    font-family: 'Open Sans',Arial, Helvetica, sans-serif;
    cursor: pointer;
    background-color: #fff;
    color: #535151;
    font-size: 12px;
    padding: 8px 40px;
    border: solid 1px #c1c1c1;
    border-radius: 4px;
	margin-top: 20px;
	margin-right: 0.5%;
	float: right;
    -webkit-appearance: none;
}

.login .eingabe .log:hover {
    background-color: #d41217;
    color: #fff;
    border-color: #d41217;
}

.login .footer{
	background-color: #595959;
	float: left;
	width: 96%;
	padding: 2%;
	color: #fff;
	font-size: 13px;
	border-top: 1px solid #d41217;
}

.login .footer a{
	color:#FFF;
	text-decoration: none;
}

.login .footer a:hover{
	color: #c8c8c8;
}

.login .footer .rechts{
	float: right;
}


.toggle, [id^=drop] {
  display: none;
}

[id^=drop]:checked + .dropdown {
  display: block !important;
}

.language {
    position: relative;
}

.toggle {
 	display: block;
	cursor: pointer;
	width: 95%;
	border: solid 1px #c1c1c1;
	border-radius: 4px;
	padding: 10px 2%;
	margin: 8px 0px;
	font-size: 13px;
	text-indent: 33px;
}
.dropdown {
    position: absolute;
    left: 0px;
    right: auto;
    top: 36px;
    z-index: 40;
    display: none;
    width: 99%;
    background-color: #fff;
    border: 1px solid #ccc;
    border-top: 1px solid #d41217;
}

.dropdown input {
    font-family: 'Open Sans',Arial, Helvetica, sans-serif;
	width:100%;
    cursor: pointer;
    background-color: #e6e6e6;;
    color: #535151;
    font-size: 13px;
	font-weight:lighter;
    padding: 10px 7px 10px 40px;
	border: 0px;
    border-top: solid 1px #c1c1c1;
    -webkit-appearance: none;
	text-align: left;
}

.dropdown form:first-child input{
	border-top: 0px;
}

.DE,
.EN,
.FR{
	background-image: url(../layout/img/flagge.svg);
	background-repeat: no-repeat;
	background-size: 30px;
}
.DE{
	background-position: 4px 9px;
}
.EN{
    background-position: 4px -27px;
}
.FR{
    background-position: 4px -65px;
}