/*
Farben:
helles blau: bac6d8 (link farbe)
dunkles blau: 103a71 (überschritften)
grau: #525a62 (fließtext)

*/

/* Internet Explorer 10 in Windows 8 and Windows Phone 8 bug
Internet Explorer 10 doesn't differentiate device width from viewport width, and thus doesn't properly apply the media queries in Bootstrap's CSS
*/
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }

/* ========================================================================================================================================= */
/* +++ Basics +++ */
/* ========================================================================================================================================= */
/* @import 'https://fonts.googleapis.com/css?family=Muli:300,400'; */
body {
	font-family: Verdana, Arial, sans-serif;
	font-weight:300;
	font-size: 14px;
	color:#103a71;
}
strong { font-weight:bold; }
/* div vertikal zentrieren */
.divtable { /* div.table */
	display:table;height:100%;
}
.divtablecell {
	display:table-cell;
	vertical-align:middle;
}
article {
	margin-bottom:40px;
}
h1, h2, h3, h4, h5, h6 {
	font-family: Verdana, Arial, sans-serif;
	font-weight: 300;
	font-size: 1.8em;
	color: #103a71;
	margin-top:0;
}
h3, h4, h5, h6 {
	font-size: 1.4em;
}
h2 { margin-bottom:1em; }
h3 { margin-bottom:1em; }

a {
	color: #02BBEE;
}
a:hover, a.active {
	color: #7ebeed;
}
ul {
	padding-left:13px;
	margin-left:0;
	/*list-style-type:none;*/
	list-style-image: url('/css/images/bull.gif');
	color:#103a71;
}

div.anchorset { /* anchor editmode */
	color:#ff0000;
	font-size:2em;
}

.clear { clear:both; }

/* ========================================================================================================================================= */
/* +++ Custom +++ */
/* ========================================================================================================================================= */


#navi_meta_col { height:25px; }
#navi_main_col { height:95px; }  /* s. #logo und Responsive */
#logo img { width:200px; height:110px; } /* s. Responsive */
.logo { padding-left:0; }

#mainnav {
	position:absolute;
	bottom:28px;
	right:15px;
}

header {
	position:fixed;
	width: 100%;
	z-index:1001;
	background: #fff;
}
.shadow { /* container-fluid */
	height:12px;
	-webkit-box-shadow: 0px 6px 6px 0px rgba(231,232,235,1);
	-moz-box-shadow: 0px 6px 6px 0px rgba(231,232,235,1);
	box-shadow: 0px 6px 6px 0px rgba(231,232,235,1);

}

#maincontent {}
.section-wrapper:first-child section {
	padding-top: 175px;
}
section { margin-bottom:30px; }

.vspacer {
	height:1px;
	margin-bottom: 40px;
}
.refimg img {
	margin-bottom: 10px;
}

/* Kontaktbox */
.contactsection {
	color:#fff;
	background-color:#103a71;
	padding:40px 20px;
}

.contactsection h1, 
.contactsection h2,
.contactsection h3,
.contactsection h4,
.contactsection h5,
.contactsection h6 {
	color: #fff;
}

.contactsection a {
	color:#7ebeed;
}
.contactsection a:hover {
	color:#b2d8f4;
}

.formcol { /* s. Responsive */
	padding-left:0;
}
.mapscol { /* s. Responsive */
	padding-right:0;
}

.scrollicon { /* Scroll to top */
	color:#fff;
	display:block;
	text-align:center;
	position:relative;
	background-color:#7ebeed;
	cursor:pointer;
}
.impressum {
	font-size:10px;
	line-height:11px;
}

footer {
	margin-bottom:40px;
	display:none;
}
footer .container { }

footer .creditsright {
	font-size:10px;
	text-align:right;
	margin-bottom:10px;
}
footer .creditsleft {
	font-size:10px;
}


/* Bildcontainer */
/* Übergeordnete Selektoren f. unterschiedliche Verhaltensformen Responsive */
.foto {}
.grafik {}

.foto .imgtextbox {
	position:absolute;
	top:60%;
	right:15px;
	padding:6px 25px;
	background-color:#103a71;
	background: rgb(0, 55, 110);  /* Fall-back for browsers that don't support rgba */
	background: rgba(4, 48, 95, 0.8);
	color:#fff;
}
.grafik .imgtextbox {
	position:absolute;
	top:30%;
	left:15%;
}
.imgheadline { font-size:28px; }
.imgsubheadline { font-size:18px; }

a.sectionlinkbar {
	color:#fff;
	display:block;
	text-align:center;
	position:relative;
	/* background: rgb(64, 91, 69);  Fall-back for browsers that don't support rgba */
	background-color: #02BBEE;
	margin-top:-20px;
}

/* Navigationskästen Management-Training, eLearning */
.boxmantraining { }
.boxelearning { }



/* Container */
.valign { /* Text vertikal mittig */
	display:table-cell;
	vertical-align: middle;
	float:none;
}
.text { }

.valign-top { /* Text vertikal oben */
	display:table-cell;
	vertical-align: top;
	float:none;
}

.valign-btm { /* Text vertikal unten */
	display:table-cell;
	vertical-align: bottom;
	float:none;
}




/* ========================================================================================================================================= */
/* +++ JSSOR SLIDER +++ */
/* ========================================================================================================================================= */

.jssort01 {
	position: absolute;
	/* size of thumbnail navigator container */
	width: 850px;
	height: 105px;
}

.jssort01 .p {
	position: absolute;
	top: 0;
	left: 0;
	width: 140px;
	height: 105px;
}

.jssort01 .t {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.jssort01 .w {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

.jssort01 .c {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 140px;
	height: 105px;
	_background: none;

	background-color:#000;
	filter: alpha(opacity = 40);
	-ms-filter:"alpha(opacity = 40)";
	opacity:0.4;
}

.jssort01 .pav .c { /* active img */
	width: 140px;
	height: 105px;
	background-position: 50% 50%;
	background:none;
	filter: alpha(opacity = 100);
	-ms-filter:"alpha(opacity = 100)";
	opacity:1;
}

.jssort01 .p:hover .c {
	top: 0px;
	left: 0px;
	width: 140px;
	height: 105px;
	/* border: #006d43 2px solid; */
	background-position: 50% 50%;
	background:none;
	filter: alpha(opacity = 80);
	-ms-filter:"alpha(opacity = 80)";
	opacity:1;
	cursor:pointer;
}

.jssort01 .p.pdn .c {
	background-position: 50% 50%;
	width: 140px;
	height: 105px;
	border: #000 2px solid;
}

* html .jssort01 .c, * html .jssort01 .pdn .c, * html .jssort01 .pav .c {
	/* ie quirks mode adjust */
	width /**/: 140px;
	height /**/: 105px;
}
.caption { position:absolute; z-index:333; left:10px; top:544px; color:#fff; font-size:14px; }

/* jssor slider bullet navigator skin 05 css */
/*
.jssorb05 div           (normal)
.jssorb05 div:hover     (normal mouseover)
.jssorb05 .av           (active)
.jssorb05 .av:hover     (active mouseover)
.jssorb05 .dn           (mousedown)
*/
.jssorb05 {
	position: absolute;

}
.jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
	position: absolute;

	/* size of bullet element */
	width: 6px;
	height: 12px;
	background: url(/css/images/jssor/b05.png) no-repeat;
	overflow: hidden;
	cursor: pointer;
}
.jssorb05 div { background-position: -7px -7px; }
.jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
.jssorb05 .av { background-position: -67px -7px; }
.jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }



/* ========================================================================================================================================= */
/* +++ Formulare +++ */
/* ========================================================================================================================================= */
.formleft {
	padding-left:35px;
}
.formright {

}
/* Einzelne Formularfelder 3, in Reihe */
.leftfield { /* s. Responsive */
	padding-top:4px;
	padding-right:2px;

}
.centerfield { /* s. Responsive */
	padding-left:2px;
	padding-right:2px;
	padding-top:4px;
}
.rightfield { /* s. Responsive */
	padding-left:2px;
	padding-top:4px;
	text-align:right;
}


.lj_inputunit { display:none; }

#err_msg {
	color:#ff0;
	font-size:13px;
}
#feedback { 
	text-align:right;
	margin-bottom:40px;
}

select {
	border: 2px solid #e5e7e9;
	border-radius: 6px;
	height: 46px;
	padding: 12px;
	outline: none;
}
/*
.form-group:after {
display:block; content:".";
height:0; line-height:0;
clear:both; visibility:hidden;
}
*/

.form-control {
	height: 30px; padding: 6px;
	border:1px solid #879cb8;
	background-color:#879cb8;
	color:#103a71;
	margin-bottom:10px;
	-webkit-border-radius:0px;
	-moz-border-radius:0px;
	border-radius:0px;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
}

.form-control:focus {
	border-color:#c6c6c6;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
}

::-webkit-input-placeholder {
	color:#103a71;
}
:-moz-placeholder {
	color:#103a71;
}
::-moz-placeholder {
	color:#103a71;
}
:-ms-input-placeholder {
	color:#103a71;
}

.form-group {
	margin-bottom: 10px;
}
.btn-primary, .btn-lg {
	font-size:14px;
	padding: 0px 0px;

	border:none;
	color:#7ebeed;
	background-color:transparent; 
}
.btn:hover, .btn-primary:hover, .btn-primary:active {
	color:#b2d8f4 !important;
	text-decoration: underline;
	background-color:transparent !important; 
	background-image:none;
	border:none;
	outline: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.btn-lg {
	padding-right:0;
	border-radius:0;
}

.input_error {
	background-color:#ff0;
	color:#000;
}

/* ========================================================================================================================================= */
/* +++ Responsive +++ */
/* ========================================================================================================================================= */
@media (max-width: 991px) {	
	.logo { padding-left:15px; }

	h1, h2, h3, h4, h5, h6 {
		font-size: 1.6em;
	}
	h3, h4, h5, h6 {
		font-size: 1.2em;
	}
	h2 { margin-bottom:1em; }
	h3 { margin-bottom:1em; }

	/* Bildcontainer */
	.foto .imgtextbox {

	}
	.foto .imgheadline, .grafik .imgheadline { font-size:24px; }
	.foto .imgsubheadline, .grafik .imgsubheadline { font-size:16px; }

	.grafik .imgtextbox {
		top:20%;
		left:20%;
	}
	/* /Bildcontainer */

}

@media (max-width: 767px) {	
	.marginbtm { /* Container, nur xs */
		margin-bottom:20px;
	}
	.margintop { /* Container, nur xs */
		margin-top:20px;
	}

	/* Bildcontainer */
	.foto .imgtextbox {

	}
	.foto .imgheadline, .grafik .imgheadline { font-size:20px; }
	.foto .imgsubheadline, .grafik .imgsubheadline { font-size:14px; }

	.grafik .imgtextbox {
		top:20%;
		left:15%;
	}
	/* /Bildcontainer */

	.contactsection {
		padding:40px 20px;
	}

	#mainnav { 
		position: relative;
		bottom:0;
		right:0;
	}
	#navi_main_col {
		height: auto;
		padding-top:12px;
		float:left;
	}

	.shadow { margin-left:-15px; margin-right:-15px; }
	ul.nav-main, ul.nav-sub {
		display:none;
	}
	.valign { /* Text vertikal mittig */
		display:block;
		vertical-align: top;
		float:left;
	}
	.valign-top { /* Text vertikal oben */
		display:block;
		vertical-align: top;
		float:left;
	}
	.valign-btm { /* Text vertikal unten */
		display:block;
		vertical-align: top;
		float:left;
	}
	.formcol {
		padding-left:15px;
	}
	.mapscol {
		padding-right:15px;
	}

	footer .container {
		padding-left:15px;
	}

}

@media (max-width: 568px) {
	/* Bildcontainer */
	.foto .imgtextbox {
		position:relative;
		top:0;
		left:0;
		margin-bottom:10px;
	}
	.foto.txthell { color:#fff; }

	.grafik .imgheadline { font-size:18px; }
	.grafik .imgsubheadline { font-size:13px; }

	.grafik .imgtextbox {
		top:20%;
		left:15%;
	}

	/* /Bildcontainer */

	h1, h2, h3, h4, h5, h6 {
		font-size: 1.3em;
	}
	h3, h4, h5, h6 {
		font-size: 1.1em;
	}
	h2 { margin-bottom:1em; }
	h3 { margin-bottom:1em; }
}

@media (max-width: 480px) {
	.grafik .imgheadline { font-size:18px; }
	.grafik .imgsubheadline { font-size:10px; }
	.grafik .imgtextbox {
		top:7%;
		left:7%;
	}
}

@media (max-width: 340px) {
	.grafik .imgheadline { font-size:16px; }
	.grafik .imgsubheadline { font-size:9px; }
	.grafik .imgtextbox {
		top:5%;
		left:8%;
	}
}


/* Display mobile only
**************************************************************** **/
@media (max-width: 767px) {
	.desktop-only { display:none !important; }
}
/* Display on desktop only
**************************************************************** **/
@media (min-width: 768px) {
	.xs-only { display:none !important; }
}