
/* Highlight*/


.is-style-hervorheben {
	/* border-left: 4px solid #F07D00;*/
	color: #000;
	font-family: Quicksand; 
	margin: 25px 100px 25px 100px;
	padding: 25px 25px 25px 25px;
	font-size: 1.2em;
	
	 --b:2px;   /* thickness of the border */
  --c: #005E80;   /* color of the border */
  --w:50px;  /* width of border */
  

  border:var(--b) solid transparent; /* space for the border */
  --g:#0000 90deg,var(--c) 0;
  background:
    conic-gradient(from 90deg  at top    var(--b) left  var(--b),var(--g)) 0    0,
    conic-gradient(from 180deg at top    var(--b) right var(--b),var(--g)) 100% 0,
    conic-gradient(from 0deg   at bottom var(--b) left  var(--b),var(--g)) 0    100%,
    conic-gradient(from -90deg at bottom var(--b) right var(--b),var(--g)) 100% 100%;
  background-size:var(--w) var(--w);
  background-origin:border-box;
  background-repeat:no-repeat;
	
	
	
	
}

@media (max-width: 900px) {
	
	.is-style-hervorheben {
	margin-left: 0px;
	padding: 15px 15px 15px 15px;
	text-align: left; 
	margin-top: 25px;
	margin-bottom: 25px;
	font-size: 1.2em;
	}
		
	}




/* Arbeitsauftrag*/


.is-style-arbeitsauftrag {
	 
	border-left: 2px solid #005E80;
	color: #000;
	margin-left: 100px;
	padding: 25px 150px 25px 50px;
	text-align: left; 
	margin-top: 50px;
	margin-bottom: 50px;
	font-size: 1.2em;
	
	
	
}

.is-style-arbeitsauftrag ul {
	 
	list-style-position: outside
	
	
	
}



@media (max-width: 900px) {
	
	.is-style-arbeitsauftrag {
	margin-top: 50px;
	margin-left: 0px;
	padding: 5px 5px 5px 20px;
	text-align: left; 
	margin-top: 25px;
	margin-bottom: 25px;
	font-size: 1.2em;
	}
		
	}



	
.is-style-arbeitsauftrag:before {
	display: block;
	color: #F07D00;
	content: "Arbeitsauftrag";
	font-family: Quicksand;
	letter-spacing: 5px;
	font-size: 16px;
  position: absolute;
	font-weight: bold; 
  font-size: 1m;
  margin-left: -1em;
  margin-top: -1.9em;
	z-index: 1;
  opacity: 0.6;
}

.is-style-arbeitsauftrag:hover::before {
	opacity: 1;
}



/* Impuls*/
.is-style-impuls {
	 
	border-left: 2px solid #F07D00;
	color: #000;
	margin-top: 50px;
	margin-bottom: 50px;
	margin-left: 100px;
	padding: 25px 150px 25px 50px;
  font-size: 1.2em;
}

@media (max-width: 900px) {
	
	.is-style-impuls {
  margin-top: 50px;
	margin-left: 0px;
	padding: 5px 5px 5px 20px;
	text-align: left; 
	margin-top: 25px;
	margin-bottom: 25px;
	font-size: 1.2em;
	}
		
	}




.is-style-impuls:before {
	color: #005E80;
	content: "Impuls";
	font-family: Quicksand;
	letter-spacing: 5px;
  font-size: 16px;
  position: absolute;
  font-size: 0.8em;
	font-weight: bold; 
  margin-left: -1em;
  margin-top: -1.9em;
	z-index:1;
  opacity: 0.6;
}

.is-style-impuls:hover::before {
	opacity: 1;
}


/* Hinweis Dezent */

.is-style-hinweisdezent {
	background-color: #E8E9EB;
	padding: 15px;
	border-radius: 5px;
}

@media (max-width: 900px) {
	
	.is-style-hinweisdezent {
	margin-top: 50px;
	margin-left: 0px;
	padding: 5px 5px 5px 20px;
	text-align: left; 
	margin-top: 25px;
	margin-bottom: 25px;
	font-size: 1.2em;
	}
		
	}


.is-style-hinweisdezent:before {
	color: #005E80;
	content: "Hinweis";
	font-family: Quicksand;
	letter-spacing: 5px;
  font-size: 16px;
  position: absolute;
  
	font-weight: bold; 
  
  margin-top: -1.9em;
	z-index:1;
  opacity: 0.6;
}


/* Medientipp */

.is-style-medientipp {
	background-color: #f0cda8;
	
	padding: 15px;
	border-radius: 5px;
}

@media (max-width: 900px) {
	
	.is-style-medientipp {
	margin-top: 50px;
	margin-left: 0px;
	padding: 5px 5px 5px 20px;
	text-align: left; 
	margin-top: 25px;
	margin-bottom: 25px;
	font-size: 1.2em;
	}
		
	}


.is-style-medientipp:before {
	color: #005E80;
	content: "Medium";
	font-family: Quicksand;
	letter-spacing: 5px;
  font-size: 16px;
  position: absolute;
  
	font-weight: bold; 
  
  margin-top: -1.9em;
	z-index:1;
  opacity: 0.6;
}

	





