body {
	background-color:#102755;
	font-family:Roboto;
	font-weight:300;
	color:#FFF;
	font-size:12pt;
}

body.login { 
	background-image: url(/img/global/bg-orb.jpg); 
	background-size: cover; 
	background-position: center center;
	background-attachment: fixed; 
}

h1 {
	font-family:Roboto;
	color:#FFF;
	font-size:24px;
}

a {
	text-decoration: none !important;
	color: #FFF;
}

.cont_head {
	display: flex; 
	justify-content: center; 
	align-items: center;
}

.cont_logo {
	width:55%; 
	position:relative; 
	float:left;
}

	.logo {
		height:60px;
		margin-top:10px;
	}

	.koop_logo {
		height:60px;
		margin-top:10px;
		margin-left: 40px;
	}

.ueberschrift {
	width:41%; 
	position:relative; 
	float:left; 
	font-family:Roboto; 
	color:#ECCC72; 
	font-weight:300; 
	font-size:40px; 
	text-align:right; 
	margin-top:22px;
}

.cont_main {
	width:100%; 
	height:70%; 
	margin-top:25px; 
	display: flex; 
	justify-content: center; 
	align-items: center;
}

.cont_main_text {
	width:100%; 
	margin-top:70px; 
	margin-bottom:70px;
	display: flex; 
	justify-content: center; 
	align-items: center;
}

.video {
	width:66%; 
	height:100%; 
	position:relative; 
}

.chat {
	width:30%; 
	height:100%; 
	position:relative; 
	float:left; 
	margin-left:15px;
}

.welcome {
	width: 60%; 
	padding: 2%; 
	border: 1px solid #eee; 
	border-radius: 15px;
	text-align: center;
}

	.welcome DIV.title { font-size: 40px; font-weight: 300; color: #ECCC72;  }
	.welcome DIV.subtitle { font-size: 24px; font-weight: 300; margin-top: 20px; }
	.welcome DIV.field { margin-top: 20px; }
	.welcome DIV.field INPUT.email { font-size: 24px; font-weight: 300; border: 0px; width: 480px; padding: 8px 8px 8px 16px; border-radius: 10px; outline: 0; }
	.welcome DIV.field { margin-top: 20px; margin-bottom: 8px; }
	.welcome DIV.field BUTTON.but {
			background-color:#ECCC72;
			padding: 8px 20px 8px 20px;
			font-family: Roboto;
			font-size: 24px;
			border-radius:10px;	
			border: 0 solid;
			margin-left: 20px;
			cursor: pointer;
			transition-duration: 0.4s;
		}
	.welcome DIV.field BUTTON.but:hover { background-color: #f2db9c; color: #333; transition-duration: 0.4s; } 
	.welcome DIV.message { font-size: 20px; font-weight: 300; color: #FF3333; margin-top: 20px; }
	.mandatory		{ background: #ffcaca !important; }


.cont_tel {
	text-align:center; 
	margin-top:15px;
}

	.tel_area { 
		display: flex; 
		width: 97%; 
		margin: auto; 
	}

		.tel_left { 
			width: 68%;
		} 

			.tel_left .hotline {
				font-family:Roboto; 
				color:#FFF; 
				font-weight:300; 
				font-size:40px;
				float: left; 
			}

			.tel_left BUTTON.docbut { 
				background-color:#ECCC72;
				padding: 8px 20px 8px 20px;
				font-family: Roboto;
				font-size: 24px;
				border-radius:10px;	
				border: 0 solid;
				margin-left: 40px;
				cursor: pointer;
				float: right; 
				transition-duration: 0.4s;
			}
			
			.tel_left BUTTON.docbut:hover { background-color: #f2db9c; color: #333; transition-duration: 0.4s; } 

		.tel_right { 
			width: 32%; 
			text-align: left;  
		}


.cont_docs {
	text-align:center; 
	margin-top:15px;
}

	.docs_area { 
		display: flex; 
		width: 97%; 
		margin: auto; 
	}

		.docs_left { 
			width: 68%;
			text-align: left;  
		} 
		
			.docs_box { width: 96%; border: 1px solid #f0f0f0; padding: 2% 2% 1% 2%; border-radius: 10px; } 
			A.docs_link, A.docs_link:link { display: inline-block; width: 49%; font-size: 20px; border-color: #999; margin-bottom: 1%; } 
			A.docs_link:even { margin-left: 2%; } 
			A.docs_link:hover { color: #eccc72; } 
			.di { color: #eccc72; }
			SPAN#neu { background-color: #bb1111; } 
			SPAN#neu SMALL { color: #fff; } 
			SPAN.doc_neu { background-color: #bb1111; } 
			SPAN.doc_neu SMALL { color: #fff; } 

		.docs_right { 
			width: 32%; 
			text-align: left;  
		}


.cont_footer {
	text-align:center; 
	margin-top:15px;
}

.hotline {
	font-family:Roboto; 
	color:#FFF; 
	font-weight:300; 
	font-size:40px;
}

.copy {
	font-family:Roboto; 
	color:#FFF; 
	font-weight:300; 
	font-size:14px;
}


@media all and (min-width: 1024px) and (max-width: 1390px) {

	.video {
		width:66%; 
	}

	.chat {
		width:30%; 
	}

	.logo {
		height:45px;
		margin-top:0px;
	}

	.koop_logo {
		height:45px;
		margin-top:0px;
		margin-left: 30px; 
	}

	.ueberschrift {
		font-size:30px; 
		margin-top:10px;
	}

	.welcome DIV.field INPUT.email { margin-bottom: 2px; }

}


@media all and (max-width: 1279px) {
	.tel_left   { width: 100%; }
	.tel_right 	{ width: 0%; }
	.docs_left   { width: 100%; }
	.docs_right 	{ width: 0%; }
}


@media all and (max-width: 1023px) {

	.logo {
		height:30px;
		margin-top:0px;
	}

	.koop_logo {
		height:30px;
		margin-top:0px;
		margin-left: 30px; 
	}

	.ueberschrift {
		font-size:20px; 
		margin-top:10px;
	}

	.cont_main {
		display: block; 
	}

	.video {
		width:100%; 
	}

	.chat {
		width:100%; 
		margin-left:0px;
		margin-top:10px;
		margin-bottom:10px;
	}

	.welcome {
		margin: auto; 
	}
	
	DIV.welcome DIV.field INPUT.email { width: 380px; } 
	
	.welcome BUTTON.but { 
		margin-top: 20px; 
	}

	.hotline {
		font-size:32px;
	}

}


@media all and (max-width: 1023px) and (orientation:portrait) {
	
	DIV.cont_head { display: flex; flex-direction: column; } 
	DIV.cont_logo { width: 100%; text-align: center; }
	DIV.ueberschrift { width: 100%; text-align: center; font-size:20px; }
	DIV.welcome 	{ width: 96%; margin: auto; }
	DIV.welcome DIV.title 	{ font-size: 32px; }
	DIV.welcome DIV.subtitle 	{ font-size: 20px; }
	DIV.welcome DIV.field INPUT.email { width: 300px; } 
	DIV.welcome BUTTON.but { margin-left: 2px !important; }
	DIV.tel_left 	{ text-align: center; }
	SPAN.hotline 	{ float: none !important; font-size:20px; }
	BUTTON.docbut 	{ float: none !important; margin-left: 0px !important; margin-top: 10px; }
}


@media all and (max-width: 767px) and (orientation:portrait) {
	
	DIV.tel_left SPAN.hotline 	{ float: none !important; font-size:20px; }
	DIV.docs_area  { width: 95%; }
	A.docs_link  { width: 100% !important; } 
	A.docs_link:even  { margin-right: 0% !important; } 
}



/*
@media all and (orientation:portrait) {

	.cont_main {
		display: block; 
	}

	.video {
		width:100%; 
	}

	.chat {
		width:100%; 
		margin-left:0px;
		margin-top:10px;
		margin-bottom:10px;
	}

	.hotline {
		font-size:20px;
	}

}
*/