body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
.content-slider{overflow:hidden;visibility:hidden;position:relative}.slider-wrapper{overflow:hidden;position:relative}.slider-wrapper>*{float:left;width:100%;position:relative}.slider-control{height:30px;position:relative}.slider-control a,.slider-control .slider-menu{position:absolute;top:9px;display:inline-block}.slider-control .slider-prev{left:0}.slider-control .slider-next{right:0}.slider-control .slider-menu{top:0;width:50%;left:50%;margin-left:-25%;font-size:27px;text-align:center}.slider-control .slider-menu b{color:#bbb;cursor:pointer}.slider-control .slider-menu b.active{color:#666}
/* CSS in folgender Reihenfolge

FONTS
RESET
HEADER
BILDUNTERTITEL
LOGO
STANDARD SRUKTUREN
ALLGEMINE FORMATE
ÜBERSCHRIFTEN -LISTEN
LINKS
SPEZIFISCHE FORMATE

SEITENSPEZIFISCHES
------------------
LEISTUNGEN
STELLENANGEBOTE
PROJEKTE
NEWS - EVENTS
DIVERS
DETAILS UND SUMMARY

*/

/* roboto-regular - latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url('../../files/tpi/fonts/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../../files/tpi/fonts/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../files/tpi/fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/tpi/fonts/roboto-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../../files/tpi/fonts/roboto-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../../files/tpi/fonts/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}


/* roboto-condensed-regular - latin */
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 400;
  src: url('../../files/tpi/fonts/roboto-condensed-v25-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../../files/tpi/fonts/roboto-condensed-v25-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../files/tpi/fonts/roboto-condensed-v25-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../files/tpi/fonts/roboto-condensed-v25-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../../files/tpi/fonts/roboto-condensed-v25-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../../files/tpi/fonts/roboto-condensed-v25-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
}


/***	################## RESET ###################	***/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, q, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, nav, header, #wrapper, #tutti {
	border: 0;
	margin: 0;
	padding: 0;
}
article, aside, figure, figure img, figcaption, hgroup, footer, header, nav, section, video, object {
	display: block
}
html, body {
	height: 100%;
	margin: 0;
	padding: 0;
}
body {
	overflow-y: scroll;
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	text-align: center;
	background-color: #DADDE2;
}
#wrapper {
	width: 100%;
	background: #fff;
	position: relative;
	text-align: center;
}
body > #wrapper {
	height: auto;
}
/*** ################### HEADER ####################### ***/
header {
	width: 100%;
}
#banner {
	width: 100%;
	position: relative;
	display: none
}
#banner img {
	width: 100%;
}
#banner .image_container {
	width: 100%;
}
#banner .image_container img {
	border: none;
	width: 100%;
	padding: 0;
	padding-top: 25px;
}

/* NEU FÜR BANNER AUS GALERIE */ 
#banner.ce_gallery.first.block img {
	width: 100%;
}
#banner.ce_gallery > ul li {float:none;}
/* GALERIE BANNER ENDE */

.rsts-skin-default.rsts-main {
	display: none;
}
#slogan {
	display: none;
}
#counter {
	display: inline-block;
	width: 80px;
}
#slogan p {
	line-height: 0.9em;
}
.sloganKleiner {
	font-size: 0.6em;
}
#navMain {
	display: none;
}

/*** ############## BILDUNTERTITEL ########## ############### ***/
#container figure {
	position: relative;
}
.caption {
	overflow: hidden;
	font-size: smaller;
	font-style: italic;
	text-align: center;
	margin-top: -15px;
	box-sizing: border-box;
}
figure figcaption, .rsts-text {
	position: absolute;
	bottom: 0;
	width: 100%;
	background: rgba(255, 255, 255, 0.7);
	text-align: center;
	padding: 0;
	white-space: normal;
	color: #000;
	border-bottom: 1px solid #999;
	opacity: 0;
	transition: opacity .5s ease-in-out;
	-moz-transition: opacity .5s ease-in-out;
	-webkit-transition: opacity .5s ease-in-out;
}
.rsts-text {
	width: 100%;
	font-size: smaller;
	color: #bbb;
	border-bottom: 0;
	bottom: -24px;
	background: transparent
}
#banner figure figcaption {
	width: 100%;
	border-bottom: 0;
	font-size: smaller;
	color: #bbb;
}
#container figcaption {
	position: static;
	margin-top: -18px;
	margin-bottom: 20px;
	line-height: 1.5em;
	opacity: 1;
	color: #333;
	border-bottom: 0;
	font-style: normal;
	max-width: 540px;
}
#container .bildinfo-links figcaption {
	text-align: left;
}
.projektbeispiele #container figcaption {
	text-align: center;
	margin-top: 5px;
	margin-bottom: 0;
}
.newsseite #container figcaption {
	text-align: left;
}
figure:hover figcaption, figure:active figcaption, .rsts-slides:hover .rsts-text, .rsts-slides:focus .rsts-text {
	opacity: 1;
}
/* ############ für die Teaserfotos Untertitel Overlay  ############### */
#container .TTinline figure figcaption, .projekte-uebersicht #container .col-4 figure figcaption {
	position: absolute;
	bottom: 0;
	width: 100%;
	background: rgba(255, 255, 255, 0.7);
	text-align: center;
	padding: 0;
	white-space: normal;
	color: #000;
	margin-bottom: 0;
	border-bottom: 1px solid #999;
	opacity: 0;
	transition: opacity .5s ease-in-out;
	-moz-transition: opacity .5s ease-in-out;
	-webkit-transition: opacity .5s ease-in-out;
}
#container .TTinline figure:hover figcaption, .projekte-uebersicht #container .col-4 figure:hover figcaption {
	opacity: 1;
}
/*** #################  LOGO ############### ***/
#logo {
	position: absolute;
	right: 15px;
	top: 20px;
	z-index: 1000;
	width: 180px;
	height: 27px;
	background-image: url(../../files/tpi/imagesLayout/Trippe_Logo_farbig.svg);
	background-size: cover;
}
#award {
	display: none;
}
/* Navi ausgelagert */

/* ######### STANDARD STRUKTUREN OHNE MQ ############## */
#main {
	width: 100%;
	float: none;
}
/********* container ******************/
#container {
	margin: 0 auto;
	padding: 0;
	text-align: left;
	color: #222;
}
#container .inside {
	text-align: left;
	margin: 0 auto;
	font-size: 1.1em;
	line-height: 1.5em;
}
.full #main {
	width: 100%;
	float: none;
}
.fehlerseite #main .inside {
	width: 94%;
	max-width: 600px;
}
#main .inside {
	margin-top: 20px;
}
/* ############# ALLGEMINE FORMATE ################# */

p, ul, ol {
	margin-bottom: 25px;
	hyphens: auto;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	text-align: left;
}
sup, sub {
	line-height: 0px;
}
sub {
	font-size: 0.6em!important;
	color: #000!Important;
}
img {color:#ccc; font:10px Arial;}

#container .ce_text p:last-child {
	padding-bottom: 15px;
}
.stellenangebote #container .ce_text p:last-child {
	padding-bottom: 55px;
}
#container .leistungen-auflistung p:last-child {
	padding-bottom: 0;
}
/* ############## ÜBERSCHRIFTEN ############# */

h1, h2, h3, h4 {
	color: #004e86;
	font-weight: 400;
	hyphens: none;
}
h1 {
	font-size: 1.3em;
	margin-bottom: 15px;
}
h2 {
	font-size: 1.2em;
	margin-bottom: 15px;
}
h3, h4 {
	margin-top: 25px;
	font-size: 1.1em;
	text-transform: none
}
.fehlerseite h1 {
	font-size: 2em;
	color: #C30;
}
.kontakt h2 {
	font-size: 1.1em;
}
.impressum h1+h2, .datenschutz h1+h2 {
	font-size: 1em;
}
.col-4.TTinline h1, .col-4.TTinline h2, .col-4 h1, .col-4 h2 {
	border-bottom: 1px solid #666;
}
/* #### ###############LISTEN ####################### */
ul {
	margin-left: 5px;
}
ol {
	margin-left: 25px
}
ol li {
	list-style-type: decimal;
}
ol ol {
	margin-top: 0;
}
ol ol li {
	list-style-type: lower-alpha
}
ul li {
	list-style-type: none;
}
ul ul {
	margin-top: 0;
}
ul ul li {
	list-style-type: circle;
}
#main ul {
	list-style-type: none;
	list-style-image: url(../../files/tpi/imagesLayout/bullet-grau.png);
	margin-left: 15px;
}

#main .ce_gallery ul {margin-left: 0;}

#main .projektdetails ul {margin-left:-10px;}
#main ul.unterliste {
	list-style-type: none;
	list-style-image: url(../../files/tpi/imagesLayout/pfeil-rechts.png);
}

/* ############## LINKS ########### */

#container a {
	color: #C60914;
	color: #be152d;
	color: #333;
	text-decoration: none;
	border-bottom: 1px dotted #C60914;
}
#container .ce_text a::before, #container .mod_newslist a::before {
	content: url(../../files/tpi/imagesLayout/internerLink.svg);
	margin-left: 3px;
}
#container .ce_text .image_container a::before {
	content: none;
}
#container a.imgLink {
	border-bottom: 0!important;
}
#container a[target="_blank"]::after {
	content: url(../../files/tpi/imagesLayout/newWindow.svg)
}
#container .ce_image a[target="_blank"]::after, #container .image_container a[target="_blank"]::after {
	content: '';
}
#container a[target="_blank"]::before {
	content: '';
}
li.download-element, .download-element {
	padding-left: 25px;
	list-style-type: none
}
.ext-pdf, .download-element.ext-pdf, #container a.pdf-Link::before  {
	background: url("../../files/tpi/imagesLayout/pdf2.png") left center no-repeat;
	padding: 0 0 0 25px/*!important*/;
}
#container a.pdf-Link[target="_blank"]:after {
	content: "";
}
#container a.pdf-Link:before {
	content: "";
}
.datenschutz #container a, .impressum #container a {
	white-space: nowrap;
}
.nichtTrennen {
	white-space: nowrap;
}
a.print {
	border-bottom: 1px solid #004e86;
}
a.print img {
	display: none;
}
a.print img {
	margin-bottom: -1px
}
a.print::after {
	content: "\0020 Seite drucken";
	color: #004e86;
	font-weight: 600;
}
a.print::before {
	content: url(../../files/tpi/imagesLayout/print.svg);
}
/* ############# SPEZIFISCHE FORMATE ############## */
 
.untertitel {
	font-size: smaller;
}
.bildRahmen {
	padding: 2px;
	border: 1px solid #004288;
	width: calc(100% - 12px)
}
/*
.hervorheben {color:#000; letter-spacing:0.1em;}
.hervorheben::before {content: "❯ ";font-size:1.3em; font-weight:bold; color: #C60914;}
*/
.rot {
	color: #C00;
}
.gross {
	font-size: large;
}
.groesser {
	font-size: larger;
}
.kleiner {
	font-size: smaller;
}
div.kleiner {
	line-height: 1.2em;
}
.weiterlesen {
	display: inline-block;
	margin-top: 5px;
}
.kasten-einfach{padding:5px; border: 1px solid #ccc;}

/* war in Vorgängerversion und könnte hier reaktiviert werden
.kasten-farbig {
	margin-top: 25px;
	padding: 5px 5px 10px;
	border: 1px solid #333;
	border-top: 5px solid #004e86;
	background: #d7e7f2;
}
.kasten-farbig p {
	margin: 6px 0 0;
}
*/

/* nich verwendet??? 
.keinAbstand {
	margin-top: -25px;
	margin-bottom: -15px;
	border-bottom: 2 px solid green;
}*/

.zusatzabstand {
	margin-bottom: 25px;
}
.zusatzabstand-oben {
	margin-top: 45px;
}
/* Link auf Projekte-Übersichtsseite */
.projektbeispiele-GR {
	margin: 15px 0;
}
.projektbeispiele-GR a {
	font-size: 1.15em;
}
.startkasten-aktuelles {
	background: #f0f0f0;
	background: #ebeef3;
	margin-bottom: 15px;
}

.aktuelles h1, .startkasten-aktuelles .layout_upcoming, .startkasten-aktuelles .mod_newslist, .startkasten-aktuelles p {
	margin: 0 10px;
}

 .startkasten-aktuelles p {margin:10px;}


/* ##### LEISTUNGEN Formatierung  für die blauen Icons ######## */

.leistungen-auflistung {
	font-size: 0.9em;
}
.leistungen-auflistung p {
	background: #eee;
	margin-bottom: 10px;
	max-width: calc(560px - 1.5%);
}
.leistungen-auflistung img {
	vertical-align: middle;
}
.leistungen-auflistung-inline p {
	background: #eee;
	margin-top: 10px;
	margin-bottom: 0;
	font-size: 0.9em;
}
.leistungen-auflistung-inline img {
	vertical-align: middle;
}
.leistungen-auflistung-inline p:nth-of-type(odd) {
	border-bottom: 1px solid #43759e;
	color: #43759e;
	max-width: 560px;
}
.leistungen-auflistung-inline p:nth-of-type(even) {
	margin-top: 0;
	padding: 5px;
	padding-left: 10px;
	max-width: calc(560px - 15px);
}
.leistungen-auflistung-inline ul {
	margin-top: 0;
	background: #eee;
}
.leistungen-auflistung-inline ul li {
	background-image: none;
	display: inline-block;
	padding: 0 3px;
	border-right: 1px solid #333;
}
/*############ GALERIEN mit einem Vorschaubild ############### */
#container .ce_gallery li:first-child {
	position: relative;
}
#container .ce_gallery li:not(:first-child) {
	display: none/*!important*/;
}

/* ############### Zitat ################## */
blockquote {
	text-align: center;
	color: #666;
}
blockquote p::before {
	color: #888;
	content: "“";
	display: block;
	font: italic 300%/1 Cochin, Georgia, "Times New Roman", serif;
	height: 0;
	margin-bottom: 20px;
}
blockquote p {
	text-align: center;
	margin-bottom: 5px;
	margin-top: -15px;
}
blockquote .kleiner {
	font-weight: bold;
}
/* ############# für module in inserts ####### */
.TTinline p {
	display: inline;
}
.TTinline .image_container {
	margin-bottom: 15px;
}
.TTinline {
	margin-bottom: 25px;
	hyphens: auto;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
}
.TTinline .teasereingabe {
	margin-bottom: 5px;
}
.noFlex {
	width: 100%;
	flex-wrap: wrap
}
/* ############# SEITENSPEZIFISCHES ############## */ 

/* ################### Leistungen ###################### */

/*falsche ausrichtung bei flex verhindern...*/
p.back {
	width: 100%;
}
.leistungsspektrum p.back a, .stellenangebote .mod_newsreader p.back a, p.back a {
	background: #d9dbe0;
	padding: 3px;
	border: 1px solid #666;
	border-radius: 5px;
	width: 4.5em;
	text-align: center;
	display: block;
	clear: both;
}
/* bilder Leistungen*/
.image_container.float_below {
	margin-top: 25px;
}
.image_container img {
	padding: 2px;
	border: 1px solid #ABAEB3;
	margin-bottom: 25px;
	margin-bottom: 20px;
}
.projektbeispiele #container .image_container img {
	margin-bottom: 0;
	max-width: 96%;
}
.projektbeispiele #container .image_container {
	margin-bottom: 0;
}
.image_container.float_right {
	margin-left: 0;
}
.image_container float_left {
	margin-right: 30px;
}
/* ============== STEKKENANGEBOTE  ======================== */

.stellenangebote #main .inside {
	margin-top: 0;
	padding-top: 20px;
}
.stellenangebote #slogan {
	display: none;
}
.stellenangebote ul {
	margin-left: 20px;
}
.stellenangebote .mod_newsreader {
	padding-top: 25px;
}
.stellenangebote .mod_newslist {
	margin-top: 0;
	margin-bottom: 25px;
}
.stellenangebote .mod_newslist .layout_simple:first-child {margin-top:-30px;}
.stellenangebote .mod_newslist time, .stellenangebote .mod_newsreader p.info time {display: none;}

.stellenangebote .syndication {
	margin-bottom: -70px;
	position: absolute;
	bottom: 170px;
}
.ausblenden {
	display: none;
}
/* ============== PROJEKTE  ======================== */

.projektbeispiele h1 {
	font-size: 1.35em;
	border-bottom: 1px solid #004e86;
	margin-bottom: 40px;
}
.projektbeispiele h2 {
	font-size: 1.2em;
}
.projektdetails hr + p {
	margin: 0;
}
.projektbeispiele .back {
	display: none;
}
.pagination li {
	display: inline-block;
	margin-right: 8px;
}
.pagination li.next a, .pagination li.previous a {
	background: #d9dbe0;
	padding: 3px;
	border: 1px solid #666;
	border-radius: 5px;
	width: 5em;
	text-align: center;
	font-size: 0.9em;
	display: inline-block;
}
.pagination li.last, .pagination li.first {
	display: none;
}
.projektuebersicht-link a::before {
	content: url(../../files/tpi/imagesLayout/internerLink.svg);
	margin-left: 3px;
}
/*######## Listen - Projekte ###########*/
.projektbeispiele .projektdetails:nth-child(odd) ul {
	margin-left: 0;
}
.projektbeispiele .projektdetails:nth-child(odd) ul li {
	list-style-position: inside;
	margin-left: 1em;
}
.projektbeispiele .projektdetails:nth-child(even) ul {
	margin-left: 25px;
	margin-left: -10px;
	padding-left: 25px;
}
.projektbeispiele .projektdetails:nth-child(odd) ul.unterliste li {
	margin-left: 8px;
}
.projektdetails:last-child hr, .projektdetails:last-child hr + p {
	display: none;
}
.link-projektuebersicht {
	font-size: 0.9em;
	margin-top: 25px;
	margin-bottom: 25px;
}
.link-projektuebersicht a {
	border-bottom: 1px dotted #E10613;
}
/* ============== NEWS und EVENTS  ======================== */

.newsseite .info {
	margin-top: -15px;
	font-size: smaller;
}
.newsseite .mod_newsarchive .layout_full h1, .newsseite .mod_newsreader .layout_full h1 {
	font-size: 1em;
	font-weight: bold;
}
.newsseite .pagination, .veranstaltungen .pagination {
	display: none;
}
.mod_newsreader h2, .mod_newsarchive h2 {
	font-weight: 600;
	font-size: 1em;
}
.newsseite .layout_short .teaser, .start .mod_newslist .teaser {
	margin-top: -20px
}
.newsseite time {
	font-size: 0.9em;
	color: #666
}
.newsseite .layout_simple {
	padding-bottom: 10px;
	margin-bottom: 10px;
	line-height: 1.2em;
}
.newsseite .mod_newslist a {
	margin-bottom: 15px
}
.newsseite .mod_newslist time {
	display: block
}
.newsseite .layout_upcoming {
	padding-bottom: 10px;
	margin-bottom: 10px;
	line-height: 1.2em;
}
.newsseite .layout_upcoming time {
	display: block;
	margin-bottom: 0;
}
.newsseite #container .ce_text p:last-child {
	margin-bottom: 0;
}
.start .mod_newslist h3 a {
	text-transform: none;
}
.veranstaltungen .mod_eventlist {
	margin-bottom: 25px;
}
.veranstaltungen .layout_simple {
	border-bottom: 1px dotted #333;
	margin-bottom: 10px;
}
.veranstaltungen .layout_simple time {
	font-size: smaller;
}
.veranstaltungen .layout_upcoming {
	border-bottom: 1px dotted #333;
	margin-bottom: 15px;
	padding-bottom: 5px;
}
.veranstaltungen .mod_eventlist .layout_full {
	margin-bottom: 15px;
	padding: 10px 5px;
	border: 1px solid #333;
	border-top: 5px solid #999;
}
.veranstaltungen .mod_eventlist .layout_full h2 {
	font-size: 1em;
	margin: 0;
	font-weight: bold
}
.veranstaltungen .mod_eventlist .layout_full p {
	margin: 0;
}
.veranstaltungen .mod_eventlist .layout_full time {
	font-size: smaller;
}

.veranstaltungen .location span:first-child {
	font-weight: bold;
}
/* ###### neu für eventlist mit Links - teaser ###### */
.veranstaltungen .mod_eventlist .header .day, .veranstaltungen .mod_eventlist .header .date {
	display: none;
}
.veranstaltungen .mod_eventlist .layout_teaser h2 {
	font-size: 1em;
	margin-bottom: 0;
}
/* für evtl. Weiterleitungen in der Liste */
#container .mod_eventlist h2 a{
	color:#004e86;
	border-bottom:none;
}
.veranstaltungen p.more {
margin-bottom:0;}
#container .mod_eventlist p.more a::before { content: url(../../files/tpi/imagesLayout/internerLink.svg);
	margin-left: 3px;}
	
/* Ende */

.veranstaltungen .mod_eventlist .layout_teaser .time {
	display: inline;
}
.veranstaltungen .mod_eventlist .layout_teaser .location {
	display: inline;
}
.veranstaltungen .mod_eventlist .layout_teaser p:last-child {
	padding-bottom:0!important;
}
.veranstaltungen .mod_eventlist .layout_teaser div[itemprop="description"] p {
	margin-bottom: 0;
}
.veranstaltungen .mod_eventlist .layout_teaser {
	padding-bottom: 15px;
	border-bottom: 2px solid #ccc;
}


/*################ kommende mit Teaserlayout #######################*/
.veranstaltungen .mod_eventlist.termine-kommende .layout_teaser {
	margin-bottom: 15px;
	padding: 10px 5px;
	border: 1px solid #333;
	border-top: 5px solid #999;
}
.veranstaltungen .mod_eventlist.termine-kommende .layout_teaser h2 {
	font-size: 1em;
	margin: 0;
	font-weight: bold
}
.veranstaltungen .mod_eventlist.termine-kommende .layout_teaser p {
	margin: 0;
}
.veranstaltungen .mod_eventlist.termine-kommende .layout_teaser time {
	/*font-size: smaller;*/
	display:block;
}
/* ################################################################## */

.mod_eventreader {width: 90%; max-width:960px;margin: 0 auto;}

.newsseite .mod_newsreader .back, .projekte-uebersicht .back, .leistungen-uebersicht .back {
	display: none;
}
.news-extra .empty {
	display: none;
}
.newsseite .col-6 h2 {
	border-bottom: 1px solid #666;
	padding-left: 8px;
	padding-top: 10px;
}
.newsseite .layout_full h2 {
	border-bottom: 0;
	padding-left: 0;
}

/* Für die Anzeige Auf Aktuelles Einstiegsseite */
.veranstaltungen .layout_upcoming  p.location, .newsseite .layout_upcoming  p.location{display:inline;}

/* ############## interne Archive ############### */
.terminArchiv .time {display:none}
.terminArchiv .location, .terminArchiv p{margin-bottom:0;padding-bottom:0;}
.newsArchiv p {padding-bottom:0;}
.newsArchiv .layout_full p {margin-bottom:10px;}
.newsArchiv .layout_full {border-bottom:1px solid #999;margin-bottom:25px;}
.terminArchiv .mod_eventlist p:last-child, .newsArchiv .mod_newslist p:last-child {padding-bottom:0!important;}
.terminArchiv .layout_teaser {padding-bottom:10px; border-bottom: 1px solid #999; margin-bottom: 20px;}


.ce_download h1, .ce_download h2, .ce_download h3 {
	font-size: 0.95em;
	font-weight: 400;
	margin-top: 0;
	border-bottom: 0!important;
	margin-bottom: 0;
}
.ce_download p {
	font-size: 0.95em;
}

.impressum #main .inside, .datenschutz #main .inside, .impressum-var2 #main .inside {
	padding-top: 25px;
	padding-top: 45px;
	margin-top: 0;
}
/*########## details und summary  - NUR FÜR DIE eNTWICKLUNG ######## */
/*für die Infoboxen*/
summary {
	width: 315px;
	background: #e2e2e2;
	border-radius: 7px;
	border: 1px solid #666;
	padding: 5px;
	font-size: 0.9em;
	right: 2px;
	margin-bottom: 10px;
}
.datenschutz summary {
	margin-top: 75px;
}
details div {
	z-index: 999;
}
details > div {
	width: 315px;
	background: #f1f1f1;
	position: absolute;
	margin-top: -13px;
	padding-top: 30px;
	padding: 5px 5px 10px;
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 7px;
	border: 1px solid #666;
	border-top: 0;
	font-size: 0.9em;
	line-height: 1em;
}
details > div p {
	margin: 5px
}
summary, details {
	display: block;
}
#main details, #main details > div, #main summary {
	width: 600px;
	width: 360px;
}
#main details {
	margin-left: 22%;
} /*fallback*/
#main details {
	margin-left: calc(50% - 300px)
}
#main details {
	margin-left: calc(96% - 370px);
}
#main details li {
	line-height: 1.4em
}
.start summary {
	width: 480px;
}
.start #main details, .start #main details > div, .start #main summary {
	width: 480px;
}
.start #main details {
	margin-left: calc(96% - 480px);
}
/*für release todos */
.toDo {
	background: #CFF;
}
 @media print {
body {
	margin: 0;
	padding: 0;
	background: #fff !important;
	font-size: 14px;
	height: auto;
	font-family: Arial, Helvetica, sans-serif!important;
}
 @page {
 margin: 1.5cm 1.2cm 1.2cm 2.5cm;
}
.syndication, .back, details, .partner {
	display: none;
}
figure, img {
	page-break-inside: avoid;
}
.projektdetails {
	page-break-after: always;
}
body {
	font-family: Arial, Helvetica, sans-serif;
}
}

/* cols und flexbox */
#container, footer .inside {
	width: 90%;
}
/* ############### cols Ansicht kleine BS ###############*/

.col-12, .col-10, .col-8, .col-8-rechts, .col-6, .col-4, 
/**/.col-7, .col-5, .col-3, .col-2 {
	width: 96%;
	width: 100%;
	padding: 0; 
	padding-bottom:10px;
}
.start .col-6 {margin-top:0;}
.col-4 p, .col-6 p {
	hyphens: auto
}

.projekte-uebersicht .flexbox p{
	line-height: 1.3em;
	font-size: 0.9em;
	margin-top: 6px;
}

.start .col-6 {width:96%;}
.start .flexbox a.weiterlesen {white-space:nowrap}


 @media screen and (min-width : 480px) {
#container {
	width: 90%;
}
#main .flexbox {
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19 */
	display: -ms-flexbox;      /* IE 10 */
	display: -webkit-flex;     /* Chrome neu*/
	display: flex;
	/*-js-display: flex;*/
	flex-direction: row;
	justify-content: space-around;
	-webkit-justify-content: space-around;
	align-items: stretch;
	-webkit-align-items: stretch;
	flex-wrap: wrap;
	flex-grow: 0;
}
.start #main .flexbox {
	justify-content: space-around;
	-webkit-justify-content: space-around;
}
.kontakt #main .flexbox {
	justify-content: space-between;
	-webkit-justify-content: space-between;
}
.noFlex {
	width: 100%;
	text-align:left;
	flex-wrap: wrap
}

.col-12, .col-8 {
	width: 100%;
}
.col-12, .col-10, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2 {
	width: 100%;
}
.col-12, .col-10, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2 {
	margin-top: 30px;
	margin-top:0;
	padding-bottom: 10px;
}
.col-4.TTinline {border-bottom:1px dotted #666;}

.start .col-4 {width:96%;}
.projekte-uebersicht .col-4 {width:100%;width:96%}

.col-4 .image_container, .col-5 .image_container, .col-6 .image_container, .col-7 .image_container{
	width: 100%;
}

#main .image_container {width:98%;/*max-width:540px;*/}

}
 @media screen and (min-width : 560px) {
	 .start .col-4, .projekte-uebersicht .col-4 {width:45%;}
 }
 @media screen and (min-width : 600px) {
	 .projekte-uebersicht .col-4 {width:45%;}
	 .projekte-uebersicht .col-4 figure + p {width:100%;}
	  .col-4 {
	width: 45%; 
}
.newsArchiv .col-4, .terminArchiv .col-4 {width:100%}
}
 @media screen and (min-width : 768px) {
	 .start .col-6 img {width:75%; height:auto;margin:auto}
	 .start .col-6 {margin-top:30px;}
	 .col-4,.col-6,.col-8 {
	width: 45%
}
.newsArchiv .col-4, .terminArchiv .col-4 {width:45%}

 .col-7{
	width: 46%
}
 .col-5{
	width: 45%
}
  .kontakt .col-6 { width: 45%}
  /*.kontakt .col-6 p, */
}
 @media screen and (min-width : 920px) {
/* ############### cols ###############*/
.col-4, .col-5, .col-6, .col-7, .col-8 {
	width: 45%;
}
}

 @media screen and (min-width : 960px) {
/* eine col ~ 7.5 */				
.col-3 {
	width: 22.5%
}
/*3 Boxen 1/3 > col-4 > 3x = 90% 
verteilte 6 Zwischenräume von 1,666666666666667 */
.col-4 {
	width: 33.33333333333333%;
	width: 30%;
}
.newsArchiv .col-4, .terminArchiv .col-4  {width:30%}
.start .col-4{width:30%;}
.projekte-uebersicht .col-4 {width:30%;}
.col-5 {
	width: 37.5%
}
.col-6, .start .col-6{
	width: 45%;
	width: 47%;
}

.col-7 {
	width:52.5%
}
.col-8{
	width: 60%
}
.col-9 {
	width: 67.5%
}
.col-10 {width:97%;}

 .start .col-6 img {width:96%; width:100%; }
}


 @media only screen and (min-width: 1920px) {
	 .kontakt .col-6 {width: 45%;}
 }


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

/* NAVI */
/************ navMain ********/
#navMain {
	width: 100%;
	text-align:left;
	height:150px;
}
#navMain li {
	text-transform: uppercase;
	list-style-type: none;
	padding: 0;
	background: transparent;
	font-size: 1em;
}


/*####### level_1 alllgemeines ###########*/
#navMain ul.level_1 {
	line-height: 1.4em;
	padding: 5px 0;
	font-size: 1em;
	background: #f0f0f0; background:#e3e6ea;
	position:relative;
}
#navMain ul.level_1 li {
	/**/border-top: 1px solid transparent;
}
#navMain ul.level_1 li:hover ul.level_2, #navMain ul.level_1 li:focus ul.level_2 {display:block;}
 
#navMain ul.level_1 li.active, #navMain ul.level_1 li.trail {
	color: #004e86;
	border-top: 1px solid #004e86;
}
#navMain strong.active, #navZusatz strong.active,  #navSub strong.active {font-weight:400;}
#navMain li.trail strong.trail {font-weight:400;}

#navMain ul.level_1 li a {
	text-decoration: none;
	color: #333;
	display: block;
	border-top:1px solid transparent;
}
#navMain ul.level_1 li a:hover {
	color: #004e86;
	border-top:1px solid #004e86;
}


/*####### level_2 alllgemeines ###########*/

#navMain ul.level_2 {position: absolute; left:0; top:1.6em; width:200px; height:auto;padding:5px 0 12px 0;}
#navMain ul.level_2 li a {/*min-width:80px;*/width:12em;}

#navMain, #navZusatz, #logo {
	display: none;
}
#navMain li.impressum, #navMain li.datenschutz {display:none;}


/* ############ SITEMAP ############## */

/* nav mobile */
.navButton {padding:10px 12px; background:#045086;color:#fff; padding-top:15px;text-align:left;}
.navButton p {margin-bottom:0;}
.navButton a {color: #fff;padding-top:-20px;text-decoration:none;}

.sitemap .level_1 {margin-bottom:10px;margin-left:15px;}
.sitemap .level_2 {margin-top:0;margin-bottom:15px;}
.sitemap .level_1 li {margin:0;}
.sitemap .level_2 li{margin-top:0}
.sitemap .level_1 li a {color:#004e86!important; font-weight:600;}
.sitemap .level_2 li a {color:#666!important; font-weight:400;}
.sitemap header {display:none;}
.sitemap img {vertical-align:middle;}

/* #################### Mediaqueries ###############*/

	  @media only screen and (min-width: 920px) {
#navMain {
	display: block;
	width:100%;
	height:90px;
	overflow:visible;
	position: fixed;
	z-index: 999;
}

.navButton {display: none;}

/* ######## level_1 ######*/

#navMain ul.level_1 {
	margin:0;
	width: 100%;
	padding:40px 0 55px 0;
	padding-left:5%;
}
#navMain ul.level_1 li {
	list-style-type: none;
	float: left;
	width: auto;
	padding: 0;
	margin-right: 15px;
	margin-left:5px;
	position: relative;
	background: transparent;
	font-size: 1.1em;
}

#navMain a {
	text-decoration: none;
	color: #333;
	display: block
}

/* ######## level_2 ######*/

#navMain ul.level_2 {background:#f0f0f0; background:#e3e6ea;
	margin-top:0;
	font-size:0.8em;
	display:none;
	text-align:left;
	margin-left:0;
	overflow:visible;
	padding-left:1px;
	}
	#navMain .level_2 li{width:12em;
	background-color: #f0f0f0;
	margin-left:0!important;
	border-top:0!important;
	}
	
	#navMain .level_2 li a,#navMain .level_2 li.active {
		padding:3px 0;
		padding-left:3px;
		border-top:0!important;
		border-left:5px solid transparent;
		border-bottom:1px solid transparent;
	}
	#navMain .level_2 li.active, #navMain .level_2 li.trail a  {border-left:5px solid #004e86;min-width:80px;}
	#navMain .level_2 li a:hover, #navMain .level_2 li a:focus {/**/padding-left:3px;border-left:5px solid #004e86;border-bottom:1px solid #004e86;}
	#navMain ul.level_1 ul.level_2 .leistungsspektrum a.trail {padding-left:3px;}

	  }
	  @media print {
.navButton, #navMain{display:none;}	
}

/* ########### FOOTER ############ */
footer {
	width: 100%;
	background-color: #dadde2;
	color: #555;
	text-align: center;
	margin-bottom: 0;
	margin-top: 30px;
	padding-top: 20px;
	letter-spacing: 0.05em;
	line-height: 1.5em;
}

footer .inside {
	margin:auto;
}
footer p {margin-bottom:0;}

footer a {
	color: #333!important;
}
footer h3 {margin-top:0; margin-bottom:8px;}


.projekte-uebersicht footer {
	background-color: #fff;
	height: auto;
}

.projekte-uebersicht footer, .projektbeispiele footer {
	background-color: #fff;
	color: #333;
	border-top: 5px solid #dadde2;
	padding-bottom:25px;
}
.projekte-uebersicht #wrapper, .projektbeispiele #wrapper{
	/*margin-bottom:60px;*/
	border-bottom:48px solid #DADDE2;
}

.projekte-uebersicht footer p, .projektbeispiele footer p { margin-bottom:15px;}

.footer1, .footer2 {
	width: 100%;
	text-align: center;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px dotted #ccc;
}

.footer1 p, .footer2 p {
	margin-left: 30px;
	margin-left:0;
	margin-top: 0;
	text-align:center;
}

/* ######### SM ICONS ############# */

.footer2 .sm img {padding:0 6px;}
    .footer2 .sm img:hover{
       transform:scale(1.15); 
    }
.footer2 .sm a {border-bottom:0!important}

.footer2 .sm p {margin-top:1.5em;text-align:center;}

/* ############ LINKS FOOTER ############## */
.footer1 a, .footer2 a{
	text-decoration: none
}
.footer1 a:hover, .footer2 a:hover, .footer1 a:focus, .footer2 a:focus{
	border-bottom: 1px dotted #000
}

.footer-bottom p {text-align:center;padding-bottom:20px;}

/* top-links */
.to-top, .to-top-projekte {
	border-radius: 50%;
	border: 1px solid #666;
	background-color: #efefef;
	width: 30px;
	height: 30px;
	font-size: 2em;
	text-align: center;
	position: absolute;
	right: 5px;
	top: -35px;
}
.to-top-projekte {
	top: -85px;top:-40px;
}

.to-top a, .to-top-projekte a {
	border-bottom: 0;
	text-decoration: none;
	color: #049!important;
	display: block;
}

/* ################# PROJEKTE KUNDENLOGOS ################## */

.projekte-ImpDS {position:absolute;right:25px; padding-top:40px;}

#footer .projekte-ImpDS a {text-decoration:none;}
#footer .projekte-ImpDS a:hover, #footer .projekte-ImpDS a:focus {border-bottom:1px dotted #000}

.kundenlogos {
	text-align: center;
}
.kundenlogos ul {margin-bottom:0!important;text-align:center}
.kundenlogos img {
	margin: 0;
	width: 100%;
	height: auto;
}
.kundenlogos ul li {
	float:none; display: inline-block;
/*die prozentualen Größen und Abstände werden immer per mediaqueries angepasst*/
	width: 28%;
}
 @media only screen and (min-width: 480px) {
	 .sloganKunden {
	color: #333;
	text-align: center;
}
.sloganKunden p {
	margin-top: 0;
	text-align: center
}
.sloganKunden .gross {
	font-size: 1.3em;
}
}

 @media only screen and (min-width: 880px) {
	 
	 /* ################ footer ############# */
footer {
	text-align: center;
}
footer .inside {
	margin: 20px auto;
	text-align: left;
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19 */
	display: flex;
	-js-display: flex;
	display: -webkit-flex;
	flex-direction: row;
	justify-content: /*space-around;*/space-between;
	-webkit-justify-content: space-between;
	align-items: stretch;
	-webkit-align-items: stretch;
	flex-wrap: wrap;
	flex-grow: 0;
}

.projekte-uebersicht footer .inside, .projektbeispiele footer .inside {
	flex: none;
	display: block;
	padding-top:20px;
}
.projekte-ImpDS {padding-top:60px;} /* noch verwendet?? */

.footer1, .footer2 {
	border-bottom: 0;
	padding: 10px;
	box-sizing: border-box;
}
.footer-bottom {
	width:100%;
	border-top:1px solid #666;
}

.footer1 p, .footer2 p {text-align:left;}
.footer1 {
	width: 32%;
	width: 55%;
}
.footer2 {
	width: 24%;
	width: 41%;
}

.footer1 {width:46%;}
.footer2 {width:49%;}

/*############### PÜFEN ################## */

/* ############# Anordung für Footer bei TEaserkarten ###### */	 
.start .footer1, .leistungen-uebersicht .footer2{
	width: 66.5%;
}
.start .footer2, .leistungen-uebersicht .footer2{
	width: 31.5%;
}

.to-top {
	right: 10px;
	top: -55px;
}
.to-top-projekte {
	top: -85px;top:-60px;
}

/* ###### kundelogos footer ########### 
.kundenlogos ul li {
	width: 10%;
}*/
.sloganKunden .gross {
	font-size: 1.6em;
}
	 .footer2 .sm p {margin-top:1.5em;text-align:right;}
	 .footer2 .sm p img:last-child {padding-right:0;}	 
}

 @media only screen and (min-width: 1024px) {
.sloganKunden .gross {
	font-size: 1.7em;
}
}

@media print {
#footer {display:none;}	
}

/* ##############################
            MEDIAQUERIES
################################*/

.ueber-uns .partner .ce_image {
	width:98%;}
.ueber-uns .partner .image_container img{border:0}

/*video dsgvo Version*/
 .YoutubeVorschau {
      position: relative;
      /*max-width: 800px;*/
      margin: 0 auto;
      }
      .YoutubeVorschau img {
      vertical-align: middle;
	  border:none;
	  padding:0;
	  /*padding-bottom:150px;*/
      }
	  
	  #main .YoutubeVorschau figure.image_container {width:100%}
	  
      .YoutubeVorschau .infotext {
      position: relative;
	  top:-100px;top:-50px;
	  /*position: static;*/
      background: rgb(0, 0, 0); /* Fallback color */
      background: rgba(0, 0, 0, 0.7); /* Black background with 0.5 opacity */
      color: #ffffff;
      /*width: 100%;*/width:inherit;
      padding: 15px;
	  font-size:0.8em; line-height:1.2em;max-width:530px;
      }
#container .infotext a {color:#FCC; letter-spacing:0.1em;}
#container .infotext a[target="_blank"]:after {
	content: "";
}

#main .mod_newsreader .image_container.float_left, #main .mod_newsarchive .image_container.float_left {float:none;}


@media only screen and (min-width: 480px) {
	
/*** ############## BANNER HEADER ################ ***/

#banner {
	display: block;
	background:#fff;
}
#banner img {
	margin-top: 80px;
	margin-top: 30px;
	margin-top:-25px;
}

.rsts-skin-default.rsts-main {display:block;}
	 
/* =============== slogan =============== */

#slogan {
	display: block;
	position: absolute;
	text-align: left;
	bottom:32px;
	left: 0;
	left:3%;
	padding: 5px 10px 0 0;
	font-size: 2em;
	letter-spacing: 0.02em;
	z-index: 997;
	max-width: 17em;
	color:#f2d9b2;
	color:#fff;
	text-shadow:1px 1px 5px black;
}
.projekte-uebersicht #slogan {text-shadow:2px 2px 5px black;} /* Variante mit Zähler */

#slogan p {
	font-weight: 300;
	padding: 0 15px;
}

.rsts-view {padding-top:95px;padding-top:0}
.rsts-slide {padding-bottom:18px;}

.rsts-slide, #banner .image_container {
background:#fff;}

a.rsts-next, a.rsts-prev{bottom:20px!important;}

/* nav Main ausgelagert */

/*** ========== ALLGEMINES =============== ***/

.full #container {
	padding-top: 50px;
	padding-top:0;
}
.start.full #container {
	/**/padding-top: 0;
}

ul.einzug {margin-left:15px;}


/* ####### FLEXBOXEN  ############*/
#container .flex {
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19 */
	display: flex;
	-js-display: flex;
	display: -webkit-flex;
	flex-direction: row;
	justify-content: space-around;/*space-between;*/
	-webkit-justify-content: space-around;
	align-items: stretch;
	-webkit-align-items: stretch;
	flex-wrap: wrap;
	flex-grow: 0;
}
.kundenlogos ul {
	margin-bottom: 25px;
}
.kundenlogos ul li {
	width: 21%;
}


h1.noFlex {margin-left:1.66%;}
.stellenangebote h1.noFlex {margin-left:0%;}
 
 .stellenangebote .mod_newsreader {padding-top:50px;}
 
 .ueber-uns .flex.partner {
	justify-content: space-around!important;
	-webkit-justify-content: space-around!important;
}	
 .ueber-uns .partner .ce_image img {border:0;width:75%;}
 
 	#main .mod_newsreader .image_container.float_left, #main .mod_newsarchive .image_container.float_left{float:left;}
	#main .mod_newsreader .image_container, #main .mod_newsarchive .image_container  {width:auto;}
	#main .mod_newsreader .image_container img, #main .mod_newsarchive .image_container img { margin-bottom:0;margin: 5px 15px 0 0;}
	
	
 @media only screen and (min-width: 600px) {

#award {
	display: block;
	position: absolute;
	right: 15px;
	bottom: 1.8em;
	bottom: 2.2em;
	bottom:29px;bottom:25px;bottom:0;
	width: 100px;
	height: 80px;
	background: #fff;
	z-index: 998
}
h1.noFlex {margin-left:2.5%;}
.stellenangebote h1.noFlex {margin-left:0;}
.stellenangebote .mod_newsreader {padding-top:30px;}

/*################## für Projektdetailseiten #############################*/
.projektbeispiele #container .image_container {/*padding-bottom:0;*/ width:48%; }
.projektbeispiele #container .image_container img {max-width:100%;}

/* projektdetails für die alternierenden Blöcke */
.projektdetails hr {
	clear:both;
	height: 1px;
	text-align: center;
	border: none;
	border-top: 1px solid #ccc;
	color: #ccc;
	margin-top:25px;
	padding-bottom: 15px;
	background-image: url(../../files/tpi/imagesLayout/pfeil-nUnten.png);
	background-position: bottom center;
	background-repeat: no-repeat;
}

.projektdetails:nth-child(odd) .image_container {
	padding-bottom:10px;
	float:left;
	width:48%;
	margin-right:2%;
}
.projektdetails:nth-child(even) .image_container {
	padding-bottom:10px;
	float:right;
	width:48%;
	margin-left:2%;
}
	
	.ueber-uns .partner .ce_image {
	/*width:31%;*/ width:45%;}

}

 @media only screen and (min-width: 768px) {
	#main .mod_eventreader .image_container {width:auto;}
	#main .mod_eventreader .image_container img { margin-bottom:0;margin: 5px 15px 0 0;}
 }


 @media only screen and (min-width: 880px) {
	 
/* ############## header ###### */

#start-sidebar h2.first {
	margin-top: 0;
}
#slogan {
	font-size: 2em;	
	left:5.3%;
}
.start #slogan, .ueber-uns #slogan, .stellenangebote #slogan{bottom:30px;}

#award {
	width: 120px;
	height: 95px;
}
/*.rsts-view {padding-top:95px;}*/

 
/************ Boxen ********/
#container {
	text-align: left;
}
#container {
	padding-top: 0;
	min-height: 65vh; min-height: 38vh;
}

.kontakt #main .inside {max-width:700px;}

.impressum .keinUmbruch p:nth-of-type(1) {width:47%;float:left;}
.impressum .keinUmbruch p:nth-of-type(2) {margin-left:4.5%;width:46%;float:left;}

.stellenangebote .keinUmbruch p:nth-of-type(1) {width:47%;float:left;}
.stellenangebote .keinUmbruch p:nth-of-type(2) {margin-left:4.5%;width:46%;float:left;}

.stellenangebote-details #main {padding-top:90px;}


.infos-todos #container {width: 90%;max-width:900px;margin:auto}
.infos-todos #main {width: 100%;}
.infos-todos h1 {margin-top:90px;}
.infos-todos .ce_accordionSingle ul li:last-child {margin-bottom:150px;}
.infos-todos .ce_accordionSingle ul ul {margin-top:0;}
.infos-todos .ce_accordionSingle ul ul li:last-child {margin-bottom:0}

.clearing {
	clear: both;
}

}
@media only screen and (min-width: 900px) {
#slogan {
	font-size: 2em;
}

	.ueber-uns .partner .ce_image {
	width:31%;}


h1.noFlex {margin-left:2.5%;}
.datenschutz #main, .impressum #main {/**/padding-top:0;} 

}

@media only screen and (min-width: 920px) {

	#logo {
	position: fixed;
	top:34px;
	display:block!important;
}

#banner img {
	margin-top: 70px;
}

.rsts-view {padding-top:95px;}

.stellenangebote .mod_newsreader {padding-top:120px;}
.impressum h1, .datenschutz h1{padding-top:90px;}	
.termindetails #main {padding-top:90px;}

.terminArchiv #wrapper, .newsArchiv #wrapper {margin-top:-20px;}
.terminArchiv #container .inside, .newsArchiv #container .inside {padding-top:120px;padding-left:15px; border-left:5px solid orange;}
/*.terminArchiv footer, .newsArchiv footer {display:none;}*/

}

 @media only screen and (min-width: 980px) {
	 
#logo {
width: 220px;
	height: 33px;
	top:30px
}
h1.noFlex {margin-left:1.66%;}

.stellenangebote h1.noFlex {margin-left:1.66%;}

}
 @media only screen and (min-width: 1024px) {
#logo {
width: 240px;
	height: 36px;
	top:25px
}

#logo {
	text-align: left;
	padding-right: 20px
	
}

#container, footer .inside, #slogan .inside {
	max-width: 1000px;
}
#main .inside {
	padding-left:0;
}

#slogan {
	font-size: 3em;
}
#counter {width:120px}
.start #slogan, .ueber-uns #slogan, .stellenangebote #slogan{/*bottom:25px;bottom:32px;*/bottom:28px;}
.kundenlogos ul li {
	width: 13%;
}
}
 @media only screen and (min-width: 1120px) {

#slogan {
	font-size: 3em;
}
#award {
	width: 130px;
	height: 103px;
	right: 15px;
}

.kundenlogos ul li {
	/**/width: 11%;width:10%;
}

.ueber-uns .partner .ce_image {
	/*width:16%;*/ width:24%;}
}

 @media only screen and (min-width: 1280px) {
#container, footer .inside, #slogan .inside {
	max-width: 1120px;
	
}
 }

 @media only screen and (min-width: 1600px) {
#container, footer .inside, #slogan .inside {
	max-width: 1280px;
}
.kontakt #main .inside {max-width:800px;}
picture {
	-webkit-filter: brightness(1.1);
	filter: brightness(1.1);
}
 }
 
  @media only screen and (min-width: 2400px) {
#container .inside {font-size:1.2em;}
details {font-size:0.87em;}
.kontakt #main .inside {max-width:960px;}
 }



 @media only screen and (max-device-width: 1024px) and (orientation: portrait) {
#container .flex {
	/*display: inline-block;*/
}
}
 @media only screen and (max-device-width: 1024px) and (orientation: landscape) {
.sloganKunden {
	/*height: 4em;*/
}
#container .flex {
	/*display: inline-block;*/
}
}


/* ######################## SITEMAP & MOBILE NAV ######################### */
/*transition für sitemap*/

.sitemap {animation:fadein 1.5s;-moz-animation:fadein 1.5s;-webkit-animation:fadein 1.5s; }
.sitemap h1 {margin-top:20px;}

@keyframes fadein{from{opacity:0;}to{opacity:1;}}@-moz-keyframes fadein{from{opacity:0;}to{opacity:1;}}@-webkit-keyframes fadein{from{opacity:0;}to{opacity:1;}}@-o-keyframes fadein{from{opacity:0;}to{opacity:1;}}


/* ############## zum TESTEN ##### 	
#navMain ul {
	background: yellow;
}

 @media only screen and (min-width: 480px) {
#container .inside {
	background: lightgreen;
}
}
@media only screen and (min-width: 620px) {
#container .inside {
	background: skyblue;
}
}
@media only screen and (min-width: 768px) {
#container .inside {
	background: yellow;
}
}
 @media only screen and (min-width: 880px) {
#container .inside {
	background: cyan;
}
#slogan {bottom:50px;bottom:32px;}
}
@media only screen and (min-width: 960px) {
#container .inside {
	background: lightsalmon;
}
}
 @media only screen and (min-width: 1024px) {
#container .inside {
	background: orange;
}
}
 @media only screen and (min-width: 1120px) {
#container .inside {
	background: magenta;
}
} 
.floatR {background:peachpuff;}
.floatL {background:sandybrown;}

.zweispaltig .floatR, .zweispaltig .floatL {
	border:1px solid #ccc;}

	#main {background:yellow;}
*/

/*	.flexbox {background:skyblue;}
	.mehrspaltig {background: orange;}
	
	#main .inside {background:yellow;}
	#container {background:cyan;}
	header {background:orange;}*/
	

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

.stellenangebote .mehrspaltig h2{border-bottom:1px solid #999;}

/* ################## SPALTENSATZ ##################### */
.mehrspaltig {
	column-count: 1;
	margin-bottom:25px; /*background:cyan;*/
}
.mehrspaltig img {
	float: left;
}
.mehrspaltig p, .mehrspaltig ul {
	margin-bottom: 0; margin-bottom:8px;
}

.datenschutz ul {
    margin-left: 15px;
}
.datenschutz .mehrspaltig a {padding-right:0;}

.impressum h2, .datenschutz h2{margin-top:0;color:#000; margin-bottom:0; font-size:1em; font-weight:bold;border-bottom:1px solid #999;} 
.impressum .mehrspaltig h2, .datenschutz .mehrspaltig h2 {color:#000; margin-bottom:0; font-size:1em; font-weight:bold;}
.impressum .mehrspaltig h2:first-child, .datenschutz .mehrspaltig h2:first-child  {margin-top:0!important;}

.eineSpalte p {width:47%;}

.mehrspaltig a {
	padding-right: 30px;
}
footer .mehrspaltig a {
	padding-right: 0;
}

footer .mehrspaltig {
	-webkit-column-count: 1;
	column-count: 1;
}

 @media only screen and (min-width: 820px) {
.mehrspaltig {
	column-count: 2;
	column-gap:2em;
}


.mehrspaltig h1, .mehrspaltig h2 {
	-webkit-column-span: all;
	-moz-column-span: all;
	column-span: all;
	/*background:yellow;*/
}

.datenschutz .mehrspaltig h3, .impressum .mehrspaltig h3, .impressum .keinUmbruch h3  {
    color: #000;
    margin-bottom: 10px;
    font-size: 1em;
    font-weight: bold;
	border-bottom: 1px solid #999;
	column-break-before: column;
	column-span: all;
}

.impressum-var2 .mehrspaltig h4, .impressum .mehrspaltig h4   {color:#333; font-size:1em;font-weight:bold;margin-top:10px;}
.impressum-var2 .mehrspaltig h4:first-child, .impressum .mehrspaltig h4:first-child {margin-top:0;}


.stellenangebote p.back {margin-top:45px;}
.stellenangebote .mehrspaltig h2 {margin-top:25px;margin-bottom:10px;padding-top:12px}
.stellenangebote .mehrspaltig h2 img {padding-right:8px;}
.stellenangebote .mehrspaltig img {float:none;}
.stellenangebote .mehrspaltig h2.wirBieten img {margin-bottom:-3px;}
}