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{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li{float:left}.ce_gallery>ul li.col_first{clear:left}.float_left{float:left}.float_right{float:right}.block{overflow:hidden}.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}.ie7 img{-ms-interpolation-mode:bicubic}.ie8 img{width:auto}
body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}
    @font-face{
        font-family:"Ano Bold W00 Italic";
        src:url("../../files/assets/fonts/2466611/9794b02f-dedb-4ab5-842f-578c812d8e04.eot?#iefix");
        src:url("../../files/assets/fonts/2466611/9794b02f-dedb-4ab5-842f-578c812d8e04.eot?#iefix") format("eot"),url("../../files/assets/fonts/2466611/2b061849-7798-4949-84e7-993cce6264fb.woff2") format("woff2"),url("../../files/assets/fonts/2466611/7b59e983-eabc-4b88-9a79-665aa1aaaab5.woff") format("woff"),url("../../files/assets/fonts/2466611/f9894187-80bf-438d-8571-f4ed1b53c4d5.ttf") format("truetype");
    }
    @font-face{
        font-family:"Ano Black W00 Regular";
        src:url("../../files/assets/fonts/2466701/6079a9a6-d433-4dd0-be24-3b7c251a136e.eot?#iefix");
        src:url("../../files/assets/fonts/2466701/6079a9a6-d433-4dd0-be24-3b7c251a136e.eot?#iefix") format("eot"),url("../../files/assets/fonts/2466701/b54876e0-fc3b-4197-9c94-5c162e2de679.woff2") format("woff2"),url("../../files/assets/fonts/2466701/2890e7a9-7fbc-4dbf-9518-a7b9465c927a.woff") format("woff"),url("../../files/assets/fonts/2466701/e1b83941-5a00-46d3-ae58-7e3648b956ac.ttf") format("truetype");
    }
    @font-face{
        font-family:"Ano Bold W00 Regular";
        src:url("../../files/assets/fonts/2466765/84f6f3b9-7129-485c-9cc9-d8d0c92e80c8.eot?#iefix");
        src:url("../../files/assets/fonts/2466765/84f6f3b9-7129-485c-9cc9-d8d0c92e80c8.eot?#iefix") format("eot"),url("../../files/assets/fonts/2466765/9b1d752a-575e-4d49-9cb7-db3223777f47.woff2") format("woff2"),url("../../files/assets/fonts/2466765/b9eb9968-39c3-4d2d-882a-302cf860e114.woff") format("woff"),url("../../files/assets/fonts/2466765/3b3a8903-390b-4c23-afad-64b747b643a2.ttf") format("truetype");
    }
    @font-face{
        font-family:"Ano Regular W00 Regular";
        src:url("../../files/assets/fonts/2466777/30e2b48b-6fc0-4e0a-882a-5938f8d3f153.eot?#iefix");
        src:url("../../files/assets/fonts/2466777/30e2b48b-6fc0-4e0a-882a-5938f8d3f153.eot?#iefix") format("eot"),url("../../files/assets/fonts/2466777/2792b279-5b1b-47b6-839f-5bc9163b442c.woff2") format("woff2"),url("../../files/assets/fonts/2466777/ae29d4a4-5f5c-4a66-b4fe-55286a973389.woff") format("woff"),url("../../files/assets/fonts/2466777/0c05f390-519f-4871-b1f4-ca03c6e364a9.ttf") format("truetype");
    }
    @font-face{
        font-family:"Ano Black W00 Italic";
        src:url("../../files/assets/fonts/2466797/2f4e4985-9a3c-47ff-89eb-b2e9d588c045.eot?#iefix");
        src:url("../../files/assets/fonts/2466797/2f4e4985-9a3c-47ff-89eb-b2e9d588c045.eot?#iefix") format("eot"),url("../../files/assets/fonts/2466797/2e894bce-a318-439d-b9ba-cde6fd2368fd.woff2") format("woff2"),url("../../files/assets/fonts/2466797/a520382a-b7da-4797-b77a-071b3c2568e8.woff") format("woff"),url("../../files/assets/fonts/2466797/806b32d0-48de-43c4-8623-69c827709fdf.ttf") format("truetype");
    }
    @font-face{
        font-family:"Ano Quarter W05 Regular";
        src:url("../../files/assets/fonts/5172470/f5a5d141-56cf-461d-a4a8-e82aaaaf8c8a.eot?#iefix");
        src:url("../../files/assets/fonts/5172470/f5a5d141-56cf-461d-a4a8-e82aaaaf8c8a.eot?#iefix") format("eot"),url("../../files/assets/fonts/5172470/0c8d06a2-42fa-485e-9676-7a7b3fa6bf07.woff2") format("woff2"),url("../../files/assets/fonts/5172470/7758ed67-766a-406b-81e4-1abdf9f7f5ae.woff") format("woff"),url("../../files/assets/fonts/5172470/1978c7ae-2d18-4f27-9251-bc7ba6678881.ttf") format("truetype");
    }


/* inter-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  src: url('../../files/assets/fonts/inter-v20-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  src: url('../../files/assets/fonts/inter-v20-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: url('../../files/assets/fonts/inter-v20-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('../../files/assets/fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('../../files/assets/fonts/inter-v20-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('../../files/assets/fonts/inter-v20-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('../../files/assets/fonts/inter-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: url('../../files/assets/fonts/inter-v20-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  src: url('../../files/assets/fonts/inter-v20-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
.mm-menu.mm-offcanvas {
    width: 80%;
    min-width: 140px;
    max-width: 320px;
}
.mm-panel.mm-hasnavbar .mm-navbar {
    display: none !important;
}
.mm-panels>.mm-panel.mm-hasnavbar,
.mm-panels>.mm-panel {
	padding-top: 0px;
	/*
	padding: 0px;
	*/
}
.mm-panels>.mm-panel:after, 
.mm-panels>.mm-panel:before {
    content: '';
    display: block;
    height: 0px;
}

.mm-panels .ce_image.logo{
	margin-top:60px;
	margin-bottom:20px;
}
.mm-panels .ce_image.logo img{
	width:60px;
	max-width:100%;
	height:auto;
}
.mm-panels .mm-panel{

}
.mm-panels  .ce_text.nav{
	position:absolute;
	left:0px;
	bottom:20px;
	width:100%;
	font-size:12px;
}
.mm-panels  .ce_text.nav a{
	color:#fff;
	opacity:.5;
}
.mm-panels  .ce_text.nav a:hover{
	opacity:1;
}
.mm-panels  .ce_text.nav ul{
	padding-left:20px;
	padding-right:20px;
}
.mm-panels  .ce_text.nav li{
	display:inline-block;
	padding-left:5px;
	padding-right:5px;
}

.mm-panels .mod_navigation{
	font-size:20px;
	line-height:48px;
	margin-top:60px;
	color:#fff;
}
.mm-panels .mod_navigation ul{

}
.mm-panels .mod_navigation li{
	margin-bottom:5px;
	color:#fff;
	margin-bottom:10px;
}
.mm-panels .mod_navigation li a{
	color:#000;
	display:block;
	background:#fff;
}
.mm-panels .mod_navigation li a:hover{
	color:#fff;
	background:#000;
}
.mm-panels .mod_navigation li:nth-child(1n + 0){
	transform:rotate(-1deg);
}
.mm-panels .mod_navigation li:nth-child(2n + 0){
	transform:rotate(1deg);
}
.mm-panels #close-menu{
	position:absolute;
	top:20px;
	right:20px;
}
.mm-panels #close-menu img{
	width:20px;
	height:auto;
	cursor:pointer;
}

.mm-panels .mod_navigation li.impressum{
	margin-top:80px;
}
.mm-panels .mod_navigation li.impressum,
.mm-panels .mod_navigation li.datenschutz,
.mm-panels .mod_navigation li.agb{
	display:none;
	transform:rotate(0deg);
	background:transparent;
	color:#fff;
	font-size:.7em;
	line-height:normal;
}
.mm-panels .mod_navigation li.impressum a,
.mm-panels .mod_navigation li.datenschutz a,
.mm-panels .mod_navigation li.agb a{
	background:transparent;
	color:#fff;
}
.cookiebar{box-sizing:border-box;position:fixed;left:0;width:100%;padding:.4em 1.2em;background-color:#000;color:rgba(255, 255, 255, .95);font-size:14px;text-align:center;z-index:100000}
.cookiebar *{box-sizing:border-box}
.cookiebar--active{display:flex!important;justify-content:center;align-items:center;flex-wrap:wrap}
.cookiebar--position-top{top:0}
.cookiebar--position-bottom{bottom:0}
.cookiebar__message,.cookiebar__text{margin-right:1.5em}
.cookiebar__link{color:#fff;text-decoration:underline}
.cookiebar__link:hover{text-decoration:none}
.cookiebar__button{margin:0;padding:.4em 1em;border:none;border-radius:0;background-color:rgba(255, 255, 255, 0.5);color:#000;font-weight:700;cursor:pointer}
.cookiebar__button:hover{background-color:rgba(255, 255, 255, 1);}
.cookiebar__analytics{margin-right:1.5em}
.cookiebar__analytics-label{cursor:pointer}
.cookiebar__analytics-checkbox{margin-right:5px}
:root{
	--weiss: #fbf9f9;			/* Textfarbe */
	--schwarz: #000000;
	--accent: #20ab20;			/* Rollover z.B. */
	--paddingTop: 100px;
	--paddingBottom: 100px;
	
}
html {
	scroll-behavior: smooth;
	font-size: 16px;
}
body{
         height:100%;
         font-family:"Inter";
         color: var(--weiss);
         font-size: 1rem;
         line-height: 1.4em;
         font-weight:400;
         background: var(--schwarz);
         font-style:normal;
}
body.bg-ws{
	color: var(--schwarz);
	background: var(--weiss);
}
body.bg-ws .ce_text a{
	color: var(--schwarz);
}
body.bg-ws .ce_text a:hover{
	color: var(--accent);
}

/* Html Elemente */
h1, h2, h3, h4{
	font-family:"Inter";
	line-height:1.1em;
	font-weight: 600;
	text-wrap: pretty;
}
h1, .h1-size{
	font-size:3rem;
	font-weight: 800;
}
h2, .h2-size{
	font-size:3rem;
	text-transform: uppercase;
}
h3, .h3-size,
.legal h2{
	font-size:1.2rem;
}
h4, .h4-size{
	font-size:1.6rem;
	font-weight: 700;
	line-height: 1.6em;
}

@media (max-width: 768px) {

}
@media (max-width: 576px) {
	h1, .h1-size{
		font-size:2.6rem;
		font-weight: 800;
	}
	h2, .h2-size{
		font-size:2.2rem;
		text-transform: uppercase;
	}
}

a:link,
a:visited,
a:hover,
a:active,
a:focus,
div,
video{
         outline: 0px;
}
a{
         color: var(--weiss);
         transition:color .2s;
		 transition:border .2s;
		 transition:opacity .2s;
         text-decoration:none;
}
.mod_article.white a{
	color: var(--schwarz);
}
a:hover,
a:focus,
.mod_article.white a:hover,
.mod_article.white a:focus{
	color: var(--accent);
}

hr{
         border:0;
         color: var(--weiss);
         background-color: var(--weiss);
         height: 1px;
         margin: 20px 0px 20px 0px;
}

/* Allgemeine Formate */
.left{float:left;}
.right{float:right;}
.textleft{text-align:left;}
.textright{text-align:right;}
.textcenter{text-align:center;}

#wrapper,
.mm-page{
	height:100%;
}
#wrapper{
         position:relative;
}
#container{
	position:relative;
}
#main{

}

.mod_article.padding{
	padding-top: var(--paddingTop);
	padding-bottom: var(--paddingBottom);
}

#header{
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	min-height:84px;
	z-index:9999;
	background:transparent;
	transition: all .4s;
}
#header.black{
	background: var(--schwarz);
}

#header .inside{
	display:flex;
	align-items: center;
	width:100%;
}
@media (max-width: 1400px) {

}
@media (max-width: 1200px) {

}
@media (max-width: 992px) {

}
@media (max-width: 768px) {
	#header .inside{
		display:flex;
		align-items: center;
		flex-direction: column;
	}
}
@media (max-width: 576px) {

}

/* Logo */
#header #logo{
	padding: 15px 25px;
	transition: all .4s;
}
.home #header #logo{
	padding: 45px;
}
.home #header.black #logo{
	padding: 15px 45px 15px 45px;
}
#header #logo img{
	width: 45px;
	height: auto;
}
.hauptnavigation{
	text-align: center;
	padding-right:135px;
	text-transform:uppercase;
	flex-grow:2;
}
.hauptnavigation ul{
	margin-bottom:0px;
}
.hauptnavigation li{
	display: inline-block;
	padding: 0 10px 0 10px;
}
@media (max-width: 1400px) {

}
@media (max-width: 1200px) {

}
@media (max-width: 992px) {

}
@media (max-width: 768px) {
	#header #logo{
		padding: 15px 15px 5px 15px;
	}
	.hauptnavigation{
		text-align: center;
		padding-right:0px;
		margin-bottom:10px;
	}
}
@media (max-width: 576px) {

}


#footer{
	background: var(--schwarz);	
	color: var(--weiss);
	font-size: 15px;
	line-height: normal;
	margin-top: 40px;
}
#footer .inside{
	display: flex;
	padding: 40px 0 28px 0;
}
#footer .inside .ce_text,
#footer .inside .mod_customnav{
	flex-grow: 1;
}
#footer .inside .mod_customnav{
	text-align: right;
}
#footer .inside .mod_customnav li{
	display: inline-block;
	padding-left: 10px;
}
#footer a{
	color: var(--weiss);
}
#footer a:hover{
	color: var(--accent);
}




.projekte #header,
.projekte #footer,
.blacknav #header,
.blacknav #footer{
	background:#000;
}
.blacknav #main{
	padding-top: var(--headerHeight);
}
/* Contao Formate ------------------------------------------------------------------------------------------------- */
.mod_article .inner{
   display: -webkit-flex;
   display: -ms-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
}

.ce_image img{
	position:relative;
	width:100%;
	height:auto;
	/*
	display:block;
	vertical-align:bottom;
	line-height:1;
	*/
}
.ce_image.korr-bottom .image_container{
	/* margin-bottom:-5px; */
}

.mod_article.fullHeight .inner{
    position:relative;
    min-height:100vh;
	width:100%;
}

/* Module -------------------------------------------------------------------------------------------------------- */

::-moz-selection { background: #20ab20; color: #000; }
::selection { background: #20ab20; color: #000; }

/* Button */
.ce_image.btn img{
	width:60px;
	height:auto;
	opacity:.95;
}
.ce_image.btn img:hover{
	width:60px;
	height:auto;
	opacity:1;
}

.ce_image.btn{
	margin-top:40px;
	margin-bottom:40px;
}


/* Video-Player */
video{
   object-fit: inherit;
}

.ce_player{
	margin-bottom:-2px;
}
.ce_player video{
	width:100% !important;
	height:auto;
}
.ce_image.platzhalter img{
	width:100% !important;
	height:auto;
}

/* Navigation Footer */

#footer .ce_text.nav li{
	display:inline;
	padding-left:10px;
}




/* Hamburger Menu */
.menu-button {
  width: 30px;
  height: 30px;
  position: absolute;
  top:30px;
  right:30px;
  cursor: pointer;
  z-index:99999;
  text-indent:-10000px;
  background:url(../../files/assets/images/menuebutton_weiss.svg) no-repeat center transparent;
  background-size: 100% auto;
  opacity:.95;
}
.menu-button:hover {
  opacity:1;
}
.close-button {
  width: 30px;
  height: 30px;
  position: absolute;
  top:30px;
  right:30px;
  cursor: pointer;
  z-index:99998;
  text-indent:-10000px;
  background:url(../../files/assets/images/close.svg) no-repeat center transparent;
  background-size: 100% auto;
  opacity:.95;
}
.close-button:hover {
  opacity:1;
}
.close-button{ display:none; }
.projekt .close-button{ display:block; }
.projekt .menu-button{ display:none; }


/* Navigation */

/* Liste Projekte */
.projektliste {
   display: -webkit-flex;
   display: -ms-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
}
.projektliste .ce_image{
         position:relative;
		 box-sizing: border-box;
		 transition:opacity .2s;
		 background:url(../../files/assets/images/preloader.gif) no-repeat center transparent;
		 background-size:50% auto;
		 padding: 10px;
}
/*
.projektliste .ce_image .kante{
         position:absolute;
		 top:0px;
		 left:0px;
		 width:50px;
		 height:50px;
		 background:url(../../files/assets/images/Dreieck_schwarz.svg) no-repeat transparent;
		 z-index:999999;
}
*/


.projektliste .ce_image .image_container img.lazy{
         position:relative;
         z-index:990;
		 width:100% !important;
		 height:auto !important;
}
.projektliste .ce_image .image_container video{
         position:absolute;
         top:10px;
         left:10px;
         z-index:980;
         width: calc( 100% - 20px ) !important;
         height: calc( 100% - 20px ) !important;
		 object-fit: fill;
}
.projektliste .ce_image .image_container .raster{
		position:absolute;
		top:0px;
         left:0px;
		z-index:997;
		width:100% !important;
         height:100% !important;
		background: url(../../files/assets/css/./files/assets/images/raster.png) center center transparent;
}

.projektliste .ce_image img{
	display:block;
	vertical-align: middle;
}
.projektliste .ce_image a{
         text-decoration:none;
         color:#fff;
}
.projektliste .ce_image .caption{
         position:absolute;
         font-size:22px;
         line-height:normal;
         width: calc( 100% - 20px );
		 height: calc( 100% - 20px );
         top:10px;
		 left: 10px;
         text-align:center;
         /* background-color:rgba(0,0,0,.6); */
         padding: 0px 0px 0px 0px;
         transition:opacity 1s;
         z-index:1000;
		 opacity:0;
		 background: url(../../files/assets/images/verlauf.png) no-repeat center transparent;
		 background-size:100% auto;
		 text-shadow: 1px 1px 2px black; 
}
.projektliste .ce_image .caption a{
         width:100%;
		 height:100%;
		 display:block;
}
.projektliste .ce_image .caption a:hover{
         color: var(--weiss);
}
.projektliste .ce_image .caption a .inner{
         position:absolute;
		 width:100%;
		 height:100%;
		 left:0px;
		 top:0px;
		 min-height:auto !important;
}
.projektliste .ce_image .caption a .inner .mitte{
         position:absolute;
		 width:100%;
		 left:0px;
		 top:40%;
}
.projektliste .ce_image .caption a .inner .unten{
         position:absolute;
		 width:100%;
		 left:0px;
		 bottom:10px;
}
.projektliste .ce_image .caption h1{
		font-weight:400;
		font-size:32px;
        line-height:normal;
		margin-top:0px;
		margin-bottom:0px;
		
}
.projektliste .ce_image .caption h2{
		font-weight:400;
		font-size:16px;
        line-height:normal;
		margin-top:0px;
		margin-bottom:0px;
}
.projektliste .ce_image .caption h3{
		font-weight:400;
		font-size:12px;
        line-height:normal;
		margin-top:0px;
		margin-bottom:0px;
}

.projektliste .ce_image .schatten{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	z-index:1010;
	display:block;
}
.projektliste .ce_image:hover .schatten{
	display:block;
}


.projektliste .ce_image:hover video{
         z-index:995;
}
.projektliste .ce_image:hover img{
         opacity:0;
}
.projektliste .ce_image:hover .caption{
         opacity:1;
}


.projektliste .ce_image .caption .kunde{
         font-size:10px;
         line-height:14px;
}

/* Filter Projekte */
.ce_metamodels_frontendfilter label{
	display:none;
}
.ce_metamodels_frontendfilter .mm_select li.active a{
	color:#9B7A5F;
}

/* Scrollbar */

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: var(--schwarz);
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--weiss);
  opacity:.5;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--schwarz);
}

/* Video Player */
.ce_player{
	position:relative;
}
.ce_player.detail{
	padding-bottom:0px;
}
#video-controls {
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0;
	padding: 5px;
	background:transparent;
	transition:opacity .2s;
	opacity:0;
}
.ce_player:hover #video-controls{
	opacity:1;
}

#video-container:hover #video-controls {

}

button {
	background: rgba(0,0,0,.5);
	border: 0;
	color: #EEE;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
}

button:hover {
	cursor: pointer;
}

#seek-bar {
	width: 360px;
}

#volume-bar {
	width: 60px;
}


/* Text mit Hintergrund */
.ce_text.bgtext{
	padding-top:20px;
	padding-bottom:20px;
}
.ce_text.bgtext p{
	background:#fff;
	color:#000;
	display:inline-block;
	clear:both;
	padding:8px;
}
.ce_text.bgtext p a{
	background:#000;
	color:#fff;
	padding:4px;
	display:inline-block;
	transform:rotate(-1deg);
}
.ce_text.bgtext p a:hover{
	background:#fff;
	color:#000;
	opacity:1;
}
.ce_text.bgtext p:nth-child(1n + 0){
	transform:rotate(-1deg);
}
.ce_text.bgtext p:nth-child(2n + 0){
	transform:rotate(1deg);
}


/* Layout -------------------------------------------------------------------------------------------------------- */

/* Home */
.home #video .ce_player{
	position:relative;
	z-index:800;
	margin-bottom:-5px;
	background:url(../../files/assets/images/preloader.gif) no-repeat center var(--schwarz);
	background-size:180px auto;
}
.home #header #logo{

}
.home #video .ce_text.logo,
.home #video .ce_image.logo{
	position:absolute;
	top:50%;
	left:0px;
	line-height:normal;
	font-weight:400;
	letter-spacing: -.02em;
	z-index:900;
	opacity:1;
	transition:opacity .2s;
	width:100%;
	margin-top:-150px;
}
.home #video .ce_text.logo img{
	width:140px;
	height:auto;
	max-width:65%;
	margin-bottom:70px;
	margin-right:19px;
}
.home #video{
	position:relative;
}
/*
.home #video .ce_text.logo{
	margin-top:16%;
}
*/
.home #video .ce_text.logo p{
	display:inline-block;
	margin:0px auto;
}
.mod_article.white{
	background: var(--weiss);
	color: var(--schwarz);
}
.home #welcome .inner{
	display: flex;
	align-items: center;
}
.home #welcome .inner h1{
		margin-top: 0em;
	}
@media (max-width: 1200px) {

}
@media (max-width: 992px) {
	.home #welcome .inner h1{
		margin-top: 1em;
	}
}
@media (max-width: 768px) {

}
@media (max-width: 576px) {

}


.home #contact .ce_image.logo{
	text-align:center;
}
.home #contact .ce_image.logo img{
	width: 448px;
	height:auto;
}
.home #contact h3{
	margin-bottom: 36px;
}

.home #video .ce_text.logo h1{
	font-size:50px;
	font-weight:300;
	margin-top:0px;
}
.home #texte{
	margin-top:40px;
	margin-bottom:60px;
}
.home #texte h1{
	font-size:1.4em;
}
.home #projekte{
	padding-bottom:60px;
}
.home #animation-header{
	position: relative;
}
.home #animation-header .ce_image.logo{
	display: inline-block;
	position:absolute;
	top:50%;
	left: 50%;
	transform: translate(-50%,-50%);
	max-width: 80%;
}
.home #animation-header .ce_image.logo img{
	width: 800px;
	height:auto;
}
.home #animation-header .caption{
	text-align:center;
	margin-top: 20px;
}
.home #animation-header .ce_text.claim{
	display: inline-block;
	position:absolute;
	right: 50px;
	bottom: 50px;
	font-size:15px;
    line-height:normal;
	text-transform: uppercase;
}
@media (max-width: 992px) {
	.home #animation-header .ce_text.claim{
		width:100%;
		text-align:center;
		right: auto;
		left:0px;
		bottom: 50px;
	}

}
@media (max-width: 768px) {

}
@media (max-width: 576px) {

}
.home #welcome{
	padding-top: calc( var(--paddingTop) * 1.5 );
	padding-bottom: calc( var(--paddingBottom) * 1.5 );
}
.home #service .inner{
	position: relative;
	display: flex;
	flex-wrap: nowrap;
}
.home #service .service-teaser{
	position: relative;
	padding-top: calc( var(--paddingTop) * 1 );
	padding-bottom: calc( var(--paddingBottom) * 1 );
	padding-left: 100px;
	padding-right: 100px;
	box-sizing: border-box;
	text-wrap: pretty;
}
.home #service .service-teaser h2{
	font-size:2.4rem;
}
.home #service .service-teaser.create{
	background: url(../../files/amstart/home/home-create-01.webp) no-repeat center var(--schwarz);
	background-size: cover;
}
.home #service .service-teaser.embedded{
	background: url(../../files/amstart/home/home-embedded-01.webp) no-repeat center var(--schwarz);
	background-size: cover;
}
.home #service .service-teaser.lab{
	background: url(../../files/amstart/home/home-lab-01.webp) no-repeat center var(--schwarz);
	background-size: cover;
}
hr.max{
	max-width:40px;
}

@media (max-width: 1400px) {
	.home #service .service-teaser{
		padding-left: 60px;
		padding-right: 60px;
	}
}
@media (max-width: 1200px) {
	.home #service .service-teaser{
		padding-left: 40px;
		padding-right: 40px;
	}
}
@media (max-width: 992px) {
	.home #service .service-teaser{
		padding-top: calc( var(--paddingTop) * .5 );
		padding-bottom: calc( var(--paddingBottom) * .6 );
	}
	.home #service .service-teaser{
		padding-left: 150px;
		padding-right: 30px;
	}
	.home #service .service-teaser p{
		max-width: 60%;
	}
}
@media (max-width: 768px) {

}
@media (max-width: 576px) {
	.home #service .service-teaser{
		padding-left: 40px;
		padding-right: 40px;
	}
	.home #service .service-teaser p{
		max-width: 100%;
	}
}
.home #about{
		padding-top: calc( var(--paddingTop) * .8 );
		padding-bottom: calc( var(--paddingBottom) * .4 );
	}
.home #about .inner{
	align-items: center;
}


.home #contact{
	
}
.home #contact .inner{
	flex-direction: column;
}
@media (max-width: 576px) {
	.home #contact .ce_image img{
		max-width:80%;
		height: auto;
	}
}
/* About */

.about #about .ce_player,
.about #about .ce_image
{
	position:absolute;
	z-index:900;
	background:url(../../files/assets/images/preloader.gif) no-repeat center var(--schwarz);
	background-size:180px auto;
}

.about #about .ce_text{
	position:relative;
	z-index:910;
	margin-top:40px;
}

/* Leistungen */
.leistungen #leistungen .ce_player{
	position:absolute;
	z-index:900;
	background:url(../../files/assets/images/preloader.gif) no-repeat center var(--schwarz);
	background-size:180px auto;
}
.leistungen #leistungen .ce_text{
	position:relative;
	z-index:910;
	margin-top:40px;
}

/* Kontakt */
.kontakt #kontakt .ce_player{
	position:relative;
	z-index:900;
	background:url(../../files/assets/images/preloader.gif) no-repeat center var(--schwarz);
	background-size:180px auto;
}
.kontakt #kontakt .ce_text{
	position:absolute;
	z-index:910;
	margin-top:140px;
}
.kontakt #kontakt hr{
         border:0;
         color: var(--schwarz);
         background-color: var(--schwarz);
         height: 1px;
         margin: 0px 0px 0px 0px;
}
.kontakt #kontakt p.mail{
         transform:rotate(1deg) !important;
}



/* Projekte Liste */
.projekte .ce_metamodel_content{
	padding-top:84px;
}


/* Projekt Detail */
.projekt #projekt{
	font-size:18px;
         line-height:normal;
}
.projekt #projekt .workdone{
	font-size:14px;
         line-height:normal;
}
.projekt .ce_metamodel_content{
	margin-bottom:40px;
	padding-top:90px;
}
.projekt .ce_player{
	background:url(../../files/assets/images/preloader.gif) no-repeat center var(--schwarz);
	background-size:180px auto;
}.projekt .ce_player.morevideos{
	margin-top:40px;
}
.projekt .arrow img{
		margin-top:50%;
}


.home #animation-header{
	position:relative;
}

.home #animation-header canvas {
	position:absolute;
	bottom:0px;
	left:0px;
  width: 100%;
  height: 100%;
  background:#fff;
  padding:0;
  margin:0;
  box-sizing:border-box;
  z-index:-1;
  object-fit:cover;
}


.mod_article:not(.fluid) .inner,
#footer .inside{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .mod_article:not(.fluid) .inner,
  #footer .inside{
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .mod_article:not(.fluid) .inner,
  #footer .inside{
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .mod_article:not(.fluid) .inner,
  #footer .inside{
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .mod_article:not(.fluid) .inner,
  #footer .inside{
    max-width: 1200px;
  }
}

@media (min-width: 1400px) {
  .mod_article:not(.fluid) .inner,
  #footer .inside{
    max-width: 1400px;
  }
}





.w20, .w25, .w30, .w33, .w35, .w40, .w50, .w60, .w65, .w75, .w100{
	float:left;
    display:table-cell;
	vertical-align: middle;
	box-sizing: border-box;
}
.w20{
	width:20%;
}
.w25{
	width:25%;
}
.w30{
	width:30%;
}
.w33{
	width:33.33%;
}
.w35{
	width:35%;
}
.w40{
	width:40%;
}
.w50{
	width:50%;
}
.w60{
	width:60%;
}
.w65{
	width:65%;
}
.w75{
	width:75%;
}
.w100{
	width:100%;
}
#footer .w25, 
#footer .w50{
	border:0 !important;
}
.offset10{
	margin-left:10%;
}
.offset12{
	margin-left:12.5%;
}
.offset20{
	margin-left:20%;
}
.offset25{
	margin-left:25%;
}
.offset50{
	margin-left:50%;
}
.offset60{
	margin-left:60%;
}
.offset70{
	margin-left:70%;
}
.offset75{
	margin-left:75%;
}
.offset80{
	margin-left:80%;
}


.home #video .ce_text.logo img{

}
.home #video .ce_image.logo.desktop{ display:block !important; }
.home #video .ce_image.logo.mobile{ display:none !important; }

#close-menu{ display:none !important; }

@media (min-width:980px) and (max-width:1120px)
{

.projektliste .ce_image .caption a .inner .mitte{
		 top:10px !important;
}
.projektliste .ce_image .caption h1{
		font-size:24px !important;
        line-height:normal !important;
}
.projektliste .ce_image .caption h2{
		font-size:14px !important;
        line-height:normal !important;
}

}
/**
 * Reduce the overall width and the width of the grid columns if the screen
 * width is less than 980px (e.g. on a portrait tablet)
 */
@media (min-width:768px) and (max-width:979px)
{

.projektliste .ce_image .caption a .inner .mitte{
		 top:20px !important;
}
.projektliste .ce_image .caption h1{
		font-size:18px !important;
        line-height:20px !important;
}
.projektliste .ce_image .caption h2{
		font-size:12px !important;
        line-height:14px !important;
}
.projektliste .ce_image .caption h3{
		font-size:12px !important;
        line-height:14px !important;
		display:none !important;
}


}

/**
 * Remove all floats and fixed widths if the screen width is less than 768
 * pixel (e.g. on a mobile phone)
 */
@media (max-width:767px)
{
	
	body{
		font-size:18px !important;
	}
	
	#footer.sticky{
		position:relative !important;
	}
	
.projektliste .ce_image .caption a .inner .mitte{
		 top:20px !important;
}
.projektliste .ce_image .caption h1{
		font-size:18px !important;
        line-height:normal !important;
}
.projektliste .ce_image .caption h2{
		font-size:12px !important;
        line-height:14px !important;
}
.projektliste .ce_image .caption h3{
		font-size:12px !important;
        line-height:14px !important;
		display:none !important;
}

.menu-button{
	top:27px !important;
}	

	#footer{
		padding-bottom:10px;
	}
	
		#footer .ce_text{
			text-align:center !important;
		}
/*
		*[class*="w"] {
                float:none !important;
                display:block !important;
                width:100% !important;
        }
		.ce_text:not(.service-teaser){
			margin-left:40px !important;
			margin-right:40px !important;
		}
		.home #video .ce_text.logo{
			margin-left:0px !important;
			margin-right:0px !important;
		}
*/		
		
        /**
         * Reduce the offset widths
         */
		 /*
        *[class*="offset"] {
                margin-left:20px !important;
				margin-right:20px !important;
        }
		*/
		.projektliste .ce_image.w25{
			width:50% !important;
			float:left !important;
		}
		
		.mm-panels .ce_text.nav ul{
			padding:0 !important;
		}
		.mm-panels .ce_text.nav{
			margin:0 !important;
		}
		
		.home #video{
			/* display:none !important; */
		}
		.home #footer.sticky{
			position:absolute !important;
		}


		.home #texte{
			margin-top:50% !important;
			margin-bottom:0px !important;
		}
		.home #texte h1{
			font-size:1.2em !important;
		}

		
		.kontakt #kontakt .ce_text{
			position:relative !important;
		}
		.kontakt #kontakt .ce_player video{
			width:190% !important;
			height:auto;
		}
		.about #about{
			padding-top:20px;
			padding-bottom:20px;
		}
		.about #about .ce_player{
			display:none !important;
		}
		
		.about #about .ce_player,
		.about #about .ce_image
		{
			position:relative !important;
		}
		.about #about .ce_player video{
			width:180% !important;
			height:auto;
		}
		.about #about .ce_text{
			margin-top:0px !important;
		}
		
		.projekte #portfolio{
			padding-bottom:20px;
		}
		.projekt .ce_metamodel_content{
			padding-top:20px !important;
		}
		.projekt #footer.sticky{
			position:absolute !important;
		}
		
		.leistungen #leistungen{
			padding-top:20px;
			padding-bottom:20px;
		}
		.leistungen #leistungen .ce_player{
			display:none !important;
			position:relative !important;
		}
		.leistungen #leistungen .ce_player video{
			width:150% !important;
			height:auto;
		}

		

		.kontakt #kontakt .ce_player{
			display:none !important;
		}
		.kontakt #kontakt .ce_text{
			width:auto !important;
		}
		.kontakt #footer.sticky{
			position:absolute !important;
		}
		

		.ce_hyperlink.btn{
			width:100% !important;
		}
		
		.projekt #arrow-left,
		.projekt #arrow-right{
			display:none !important;
		}
		.projekte .ce_metamodel_content{
			padding-top:10px !important;
		}
		.projekt .ce_metamodel_content{
			margin-bottom:10px !important;
		}
		#footer .ce_text.first p{
			padding-left:0px !important;
		}
		#footer .ce_text.last ul{
			padding-right:0px !important;
		}


.home #video .ce_text.logo,
.home #video .ce_image.logo{

}	
.home #video .ce_image.logo img{
	max-width:85% !important;
}
#footer{
	text-align: center;
}
#footer .inside{
	flex-direction: column;
}
#footer .inside .ce_text{
	order: 2;
	margin-top:20px;
}
#footer .inside .mod_customnav{
	order: 1;
	text-align:center;
}
#footer .inside .mod_customnav li{
	display:block;
	margin-bottom: 10px;
}
		

.projekte .mod_article .inner .ce_metamodel_content.first,
.projekt .mod_article .inner .ce_metamodel_content{
	margin-top:84px !important;
}	
.projekte .mod_article .inner .ce_metamodel_content.first{
	padding-top:0px !important;
}	
.leistungen #header,
.leistungen #footer,
.kontakt #header{
	background:#000 !important;
	opacity:1 !important;
}
		
.home #video .ce_image.logo.desktop{ display:none !important; }
.home #video .ce_image.logo.mobile{ display:block !important; }		
		
.home #video .ce_image.logo{
	bottom:60px !important;
}	

.leistungen #footer,
.impressum #footer,
.datenschutz #footer,
.agb #footer{
	position:relative !important;
}

body.leistungen .mod_article .inner,
body.kontakt .mod_article .inner{
	background:url(../../files/amstart/Backgroundvideos/bg-mobile-service-kontakt.jpg) no-repeat center bottom #000;
	background-size:100% auto;
}
.leistungen #leistungen .ce_text{ margin-top:80px !important; }
.kontakt .vide,
.leistungen .vide{ display:none !important; }
		
.mm-menu.mm-offcanvas{ 
	width:100% !important;
	max-width:100% !important;	
}		

#close-menu{ display:block !important; }



.mm-panels .mod_navigation li.impressum,
.mm-panels .mod_navigation li.datenschutz,
.mm-panels .mod_navigation li.agb{
	display:block !important;
}



}

@media (max-width: 1200px) {

}
@media (max-width: 992px) {
	.w20, .w25, .w30, .w33, .w35, .w40, .w50, .w60, .w65, .w75, .w100{
		float:none;
		display:block;
		vertical-align: middle;
		box-sizing: border-box;
		width: auto;
		margin-left:0px !important;
		margin-right:0px !important;
		box-sizing: border-box;
		padding-left:30px !important;
		padding-right:30px !important;
	}
	.w100.projektliste,
	.w33.projekt{
		padding-left:0px !important;
		padding-right:0px !important;
	}
	*[class*="offset"] {
        margin-left:0px !important;
		margin-right:0px !important;
		box-sizing: border-box;
    }
	.mod_article .inner{
		flex-direction: column;
	}	
}
@media (max-width: 768px) {

}
@media (max-width: 576px) {

}