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


/* ###################################################################################################################################################################### */
/*																	... aus styleSP.css																					  */
/* ###################################################################################################################################################################### */


@import url('../../css/fonts/michroma_regular_macroman/michroma.css');
@import url('../../css/fonts/fontawesome/css/font-awesome.css');
@import url('menu.css');

.video { width:100%; height:auto; }

body,p,input,label,select,radio,checkbox, .btn {font-size:18px;}
label {font-weight:normal;}

/* --------------------------------- Headline-Formate -------------------------------------------- */

h1, h2, h3, h4 {font-family:'michromaregular', sans-serif; font-weight:normal; letter-spacing:1px; }

h1 {font-size:38px; line-height:1.3; color:#777; padding-bottom:15px; margin-bottom:0px; border-bottom: 1px solid #CCC;}

h2 {font-size:32px !important; /*text-transform:uppercase;*/ line-height:1.3; color:rgba(24,149,118,1.00) !important;  padding-bottom:15px; border-bottom: 1px solid #CCC; }

h3 { color:#000; line-height:1.3 !important;  margin-top:0px !important; margin-bottom:20px !important; }

h4 { color:#777; line-height:1.3 !important;  margin-top:0px !important; }

@media only screen and (max-width:991px) 	{ 
	h1 { font-size:26px !important; margin-bottom:20px; }
	h2 { font-size:22px !important; text-transform:none !important; }
	h3 { font-size:18px !important; }
	h4 { font-size:16px !important; }
}
@media only screen and (max-width:479px) 	{ 
	h1 { font-size:19px !important; margin-bottom:20px; }
	h2 { font-size:16px !important; text-transform:none !important; }
	h3, h4 { font-size:14px !important; }
}

/* --------------------------------- links -------------------------------------------- */

a {
  color:rgba(20,126,100,1.00);
  -webkit-transition: color 400ms, background-color 400ms;
  -moz-transition: color 400ms, background-color 400ms;
  -o-transition: color 400ms, background-color 400ms;
  transition: color 400ms, background-color 400ms;
}
a:hover, a:focus {
  text-decoration: none;
  color:rgba(20,126,100,1.00) ;
}

/* ###################################################################################################################################################################### */
/*																	... Bootstrap-Anpassungen 																			  */
/* ###################################################################################################################################################################### */

.btn {margin:5px 0px;}

.btn.big { font-size:18px; min-width:200px; }

.btn-success {
    background-image: -webkit-linear-gradient(270deg,rgba(43,176,144,1.00) 0.04%,rgba(24,149,118,1.00) 100%);
    background-image: -o-linear-gradient(270deg,rgba(43,176,144,1.00) 0.04%,rgba(24,149,118,1.00) 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641));
    background-image: -moz-linear-gradient(270deg,rgba(43,176,144,1.00) 0.04%,rgba(24,149,118,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(43,176,144,1.00) 0.04%,rgba(24,149,118,1.00) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #3e8f3e;
}
.btn-success {
    color: #fff;
    background-color: rgba(24,149,118,1.00);
    border-color: #4cae4c;
}
.btn-success:focus,
.btn-success.focus {
    color: #fff;
    background-color: rgba(27,168,133,1.00);
    border-color: #255625;
}
.btn-success:hover {
  color: #fff;
  background-color: rgba(27,168,133,1.00);
  border-color: rgba(24,149,118,1.00);
}

.eLearning.CONTENT .row.start { padding-left:10px; padding-right:10px; }

.eLearning.CONTENT .col-md-6 { 
	width:48%; 
	margin:1% 1%;
	padding: 2% 1%;
	border:1px solid #999;
}

.eLearning.CONTENT .col-md-6.start { 
	background:rgba(248,248,248,1.00); 
	border-radius:6px;
	border:1px solid #999;
	padding-top:10px;
	padding-bottom:10px;
}

.eLearning.CONTENT .col-md-6.start h2 { font-size: 24px !important; min-height:120px; }

.eLearning.CONTENT .col-md-6.start .Kennung { float:right; margin-top:0 !important; text-align:right; border-bottom:1px solid #999; }

.eLearning.CONTENT .col-md-6 .ThemeImageBlock { float:left; width:100%; height:320px; text-align:center; }

.eLearning.CONTENT .col-md-6 .ThemeImageBlock img { max-height:298px; width:auto; }

.eLearning.CONTENT .col-md-6 .Voraussetzungen { float:left; min-height:90px !important; }


@media (min-width:768px) and (max-width: 991px) {
		.eLearning.CONTENT .col-md-6.start .Voraussetzungen { 
		min-height:90px; 
	}
	.eLearning.CONTENT .col-md-6.start h2 { 
		min-height:100px; 
	}
	.eLearning.CONTENT .col-md-6 { 
		float:left;
		width:48%; 
		margin:1% 1%;
		padding: 2% 1%;
	}
}
@media (max-width:767px) {
	
	.eLearning.CONTENT .col-md-6.start { 
		margin-bottom:25px; 
	}
	
	.eLearning.CONTENT .col-md-6.start .Voraussetzungen { 
		min-height:60px; 
	}
	
	.eLearning.CONTENT .col-md-6.start h2 { 
		min-height:50px; 
	}
	.eLearning.CONTENT .col-md-6 { 
		width:96%; 
		margin:2% 2%;
		padding: 1% 1%;
	}
}



/* ###################################################################################################################################################################### */

body {
    /*background-image: url(css-images/Moendals-Energi.jpg);*/
    background-repeat: no-repeat;
    background-size: cover;
}
@media (max-width: 991px) { body { background-image:none; } }

.eLearning { 
	margin-top: 5px;
	border: 1px solid rgba(24,149,118,1.00);
	border-radius:8px;
}

.eLearning.HEADER {
    padding-top:6px;
	padding-bottom:6px;
}

.eLearning.CONTENT {
   padding:0px 10px;
}

.eLearning.FOOTER {
    padding-top:6px;
	padding-bottom:6px;
}

.eLearning.HEADER,
.eLearning.FOOTER {
	background:rgba(24,149,118,1.00);
	color:white;
}

/* =================================================================================== KOPF */
.eLearning.HEADER .THEME { 
	font-family:'michromaregular', sans-serif; 
	font-weight:normal;
	text-align:left;
	letter-spacing:1px;
}

.eLearning.HEADER .IMAGE {
	text-align:right;
}

.eLearning.HEADER .IMAGE img {
	height:40px;
	width:auto;
	float:right;
}

.eLearning.HEADER .THEME,
.eLearning.HEADER .IMAGE {
	float:left;
	width:48%;
	margin:0% 1%;
	padding:0 6px;
}

.eLearning.HEADER .THEME img,
.eLearning.HEADER .IMAGE img {
	height:36px;
	width:auto;
}
@media(max-width:767px){
	.eLearning.HEADER .THEME img,
	.eLearning.HEADER .IMAGE img {
		height:28px;
	}
	.eLearning.HEADER .THEME img { margin-top:-5px }
	.eLearning.HEADER .IMAGE img { margin-top: 3px; }
}

/* ====================================================================================================== INHALT */
.eLearning.CONTENT,
.eLearning.PRESENTATION{
	background:white;
}

.eLearning.PRESENTATION { padding:10px 10px; }
.eLearning.PRESENTATION .Presenter { padding:0; }

/* -------------------------------------------------------------------------------------------------- iFrame */
.eLearning.PRESENTATION .Presenter iframe.SlideFrame { width:100%; height:740px; border:0px; }

/* --------------------------------------------------------------------------- max 1199px breit */
@media (min-width:992px) and (max-width:1199px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { height:600px; }
}

@media (max-width:767px){
	.eLearning.HEADER,
	.navbar,
	.eLearning.CONTENT,
	.eLearning.PRESENTATION,
	.eLearning.FOOTER { 
		border-radius:0px; 
		border:0px;
		border-color:none;
		margin:0;
	}
}

/* --------------------------------------------------------------------------- 900px quer (HiDPI Screen) */
@media (max-width:1440px) and (max-height:900px) {
	.eLearning.FOOTER { display:none; }
}
/* --------------------------------------------------------------------------- 950px hoch (Laptop touch) */
@media (max-width:1280px) and (max-height:950px) {
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:720px; 
	}
}
/* --------------------------------------------------------------------------- 846px quer (Galaxy Note 9) */
@media (max-width:846px) and (max-height:414px) {
	.eLearning.PRESENTATION { padding:0px 10px; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:10% !important; 
		margin-top:20px;
		width:600px !important; 
		height:370px !important; 
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- iPad Pro */
@media (max-height:834px) {
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:620px; 
	}
}
/* --------------------------------------------------------------------------- iPhone X/XS quer */
@media (max-width:812px) and (max-height:375px) {
	body { background:rgba(24,149,118,1.00); }
	.eLearning.PRESENTATION { padding:0px 10px; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:12.5% !important; 
		width:75% !important; 
		height:360px !important;
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- Galaxy S9/S9+ quer */
@media (max-width:740px) and (max-height:360px) {
	body {background:white;}
	.eLearning.PRESENTATION { padding:0px 10px; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-top:8px;
		margin-left:7.5% !important; 
		width:85% !important; 
		height:335px !important;  
	}
	
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- iPhone 6/7/8 Plus quer */
@media (max-width:736px) and (max-height:414px) {
	
	.eLearning.PRESENTATION { padding:0px 10px; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:10% !important; 
		margin-top:20px;
		width:600px !important; 
		height:360px !important;  
	}
	
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- iPhone 6/7/8 quer */
@media (max-width:667px) and (max-height:375px) {
	body {background:white;}
	.eLearning.PRESENTATION { padding:0px 10px !important; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:7.5% !important; 
		margin-top:12px;
		width:85% !important; 
		height:345px !important;
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- Galaxy Note3/S5 quer */
@media (max-width:640px) and (max-height:360px) {
	body {background:white;}
	.eLearning.PRESENTATION { padding:0px 10px; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-top:12px;
		margin-left:7.5% !important; 
		width:85% !important; 
		height:335px !important;
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- iPhone 5/SE quer */
@media (max-width:568px) and (max-height:320px) {
	body {background:white !important;}
	.eLearning.PRESENTATION { padding:0px 10px; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:7.5% !important; 
		width:85% !important; 
		height:300px !important;
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- iPhone 4 quer */
@media (max-width:480px) and (max-height:320px) {
	body {background:white !important;}
	.eLearning.PRESENTATION { padding:0px 10px; border:0px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:2.5% !important; 
		width:95% !important; 
		height:300px !important;
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.FOOTER {display:none !important;}
}
/* --------------------------------------------------------------------------- iPhone 6/7/8 Plus hoch */
@media (max-width:414px) and (max-height:736px) {
	body { background:rgba(24,149,118,1.00); }
	
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:720px; 
	}
	
	
	.eLearning.HEADER,
	.eLearning.FOOTER { display:block; }
	
	.eLearning.PRESENTATION { padding:10px 0px; }
}
/* --------------------------------------------------------------------------- iPhone X/XS hoch */
@media (max-width:375px) and (max-height:812px) {
	body { background:rgba(24,149,118,1.00); }
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:720px; 
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.CONTENT,
	.eLearning.PRESENTATION,
	.eLearning.FOOTER { 
		border-radius:0px; 
		border:0px;
		border-color:none;
		margin:0;
	}
	.eLearning.HEADER,
	.eLearning.FOOTER { display:block; }
	
	.eLearning.PRESENTATION { padding:10px 0px; }
}
/* --------------------------------------------------------------------------- iPhone 6/7/8 hoch */
@media (max-width:375px) and (max-height:667px) {
	body { background:rgba(24,149,118,1.00); }
	
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:720px; 
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.CONTENT,
	.eLearning.PRESENTATION,
	.eLearning.FOOTER { 
		border-radius:0px; 
		border:0px;
		border-color:none;
		margin:0;
	}
	.eLearning.HEADER,
	.eLearning.FOOTER { display:block; }
	
	.eLearning.PRESENTATION { padding:10px 0px; }
}
/* --------------------------------------------------------------------------- iPhone 5/SE hoch */
@media (max-width:320px) and (max-height:568px) {
	body { background:rgba(24,149,118,1.00); }
	
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:-1.5% !important; 
		width:310px !important; 
		height:250px !important; 
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.CONTENT,
	.eLearning.PRESENTATION,
	.eLearning.FOOTER { 
		border-radius:0px; 
		border:0px;
		border-color:none;
		margin:0;
	}
	.eLearning.HEADER,
	.eLearning.FOOTER { display:block; }
	
	.eLearning.PRESENTATION { padding:10px 0px; }
}
/* --------------------------------------------------------------------------- iPhone 4 hoch */
@media (max-width:320px) and (max-height:480px) {
	body { background:rgba(24,149,118,1.00); }
	
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:720px; 
	}
	.eLearning.HEADER,
	.navbar,
	.eLearning.CONTENT,
	.eLearning.PRESENTATION,
	.eLearning.FOOTER { 
		border-radius:0px; 
		border:0px;
		border-color:none;
		margin:0;
	}
	.eLearning.HEADER,
	.eLearning.FOOTER { display:block; }
	
	.eLearning.PRESENTATION { padding:10px 0px; }
}

/* --------------------------------------------------------------------------- 800px hoch */
@media (max-height:800px) {
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:720px; 
	}
	.eLearning.HEADER,
	.eLearning.FOOTER { display:none; }
}
/* --------------------------------------------------------------------------- 768px hoch */
@media (max-height:768px) {
	.eLearning.PRESENTATION { padding:0px 10px; }
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		margin-left:1%; 
		width:98%; 
		height:600px; 
	}
	.eLearning.HEADER { display:block; padding-top:4px; padding-bottom:4px; }
	.eLearning.FOOTER { display:block; font-size:14px; }
}
/* --------------------------------------------------------------------------- 950px breit */
@media (min-width:950px) and (max-width:991px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { 
		height:470px;
		margin-left:1%; 
		width:98%;
	}
}

@media (min-width:800px) and (max-width:949px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { height:470px; }
}

@media (min-width:768px) and (max-width:799px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { height:450px; }
}

@media (min-width:600px) and (max-width:767px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { height:390px; }
}

@media (min-width:480px) and (max-width:599px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { height:330px; }
}

@media (min-width:360px) and (max-width:479px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { height:270px; }
}

@media (min-width:320px) and (max-width:359px) {
	.eLearning.PRESENTATION .Presenter iframe.SlideFrame { height:270px; }
}

/* =================================================================================================== FUß */
.eLearning.FOOTER {
	margin-bottom:20px;
}

.eLearning.FOOTER a {
	color:white; 
}
@media (max-width: 991px) {
	.eLearning.FOOTER .col-md-6.left 	{ float:left;  width:75%; }
	.eLearning.FOOTER .col-md-6.right 	{ float:right; width:25%; }
}
@media (max-width:767px) {
	.eLearning.FOOTER .col-md-6.left, 
	.eLearning.FOOTER .col-md-6.right { float:left; width:100%; text-align:center !important; }
}
@media (max-width: 479px) {
	.eLearning.FOOTER					{ font-size:13px; }
	.eLearning.FOOTER .col-md-6.left, 
	.eLearning.FOOTER .col-md-6.right	{ float:left; text-align:center; width:100%; }
}


/* =================================================================================== GRID-Anpassungen */

/*.eLearning.CONTENT .row {margin-bottom:20px;}*/

/* =================================================================================== Sonderformate */
.infobox { 
	border:1px solid rgba(24,149,118,1.00);
	border-radius:6px;
	background:rgba(24,149,118,0.15);
}

.infobox {
    padding: 1% 2% 1% 60px;
    background-repeat: no-repeat;
    background-image: url(css-images/info-gruen.png);
    background-position: 1% 10px;
    background-size: 30px auto;
}

.Anmeldung input[type="text"],
.Anmeldung input[type="email"],
.Anmeldung select {
	min-width:300px;
	font-size:18px;
	padding:5px;
	text-align:center;
}

.Anmeldung select { 
	text-align:center;
	border:1px solid #DDDDDD;
	margin-bottom:10px;
}