@font-face{font-family: 'Muli';font-style: normal; font-weight: 300; src: local('Muli Light'), local('Muli-Light'), url(../fonts/muli/muli-light.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{ font-family: 'Muli'; font-style: normal;font-weight: 400; src: local('Muli Regular'), local('Muli-Regular'), url(../fonts/muli/muli-regular.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{ font-family: 'Muli'; font-style: normal; font-weight: 600; src: local('Muli SemiBold'), local('Muli-SemiBold'), url(../fonts/muli/muli-semibold.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

html,body{margin: 0;padding: 0;height: 100%}
body{font-size: 1em; font-family: 'Muli', sans-serif; margin:0;background-color:#d7dbdd}
body[rel=intropage]{ background-color: #4e76a4}
.p-wrap{width:1192px; margin: 0 auto}
.p-body{width:1192px; margin: 0 auto}
.p-logo{margin-bottom: 20px}
footer{ position:relative; bottom:0;clear:both; float:none;padding: 10px 0 40px 0;width: 100%;background-color:#4e76a4; color:#fff; line-height:1.2;text-align:center;font-size:.9em;margin:0 auto}
footer table{ width:auto; margin:10px 30px 10px 30px;text-align:left}
footer h4{ color:#fff; font-weight:600; height: 20px;margin-bottom:5px; font-size:1.1em}
footer .h4-spacer{ margin-bottom: 5px; font-size: 1.1em; height: 20px !important; display: block !important}
footer a{color:#fff; text-decoration:none}
footer a:before{content:'» '}
footer a.phone-link:before{content:''}
footer a:hover{color:#fff}
footer span.com{ width: 40px; margin-right:10px}
footer img{ width:180px}
header{position:sticky;top:0;z-index:14;width:100%; height:120px;left:0; text-align: center}
.fixed{position:fixed;z-index:14;background-color:#4e76a4}

*[data-attr="mobile-only"]{ display:none}
#p-teaser{ margin:0;list-style:none;width:100%;max-height:680px; min-height: 380px;height:auto;background-color:#828a8e}
#p-teaser img{ object-fit: cover;height:100% !important;min-height:380px !important;max-height:680px !important; width:100% !important;padding:0;margin:0}
.swiper-slide{max-height:680px;bottom:0}
.p-img-box{position:absolute;z-index: 12;bottom:20px; width:  100%;background: rgba(107,156,164,.8); transition: all 0.2s ease-out;color:#fff}

.p-img-box:hover{ background: rgba(107,156,164,1)}
.p-img-box .inner-padding{padding: 30px;display: inline-block}
.p-img-box .page-topic1, .p-img-box headline_1{ color:#fff;font-family: 'Muli', sans-serif; font-weight: 300 !important;padding:0;margin:0;font-size:22px; text-transform: uppercase}
.p-img-box .page-topic2, .o-img-box headline_2{ color:#fff;font-family: 'Muli', sans-serif; font-size: 1.3em;font-weight: 300 !important;padding:0;margin:2px 0 0 0}
.p-img-box p{ font-family: 'Muli', sans-serif; font-weight: 500 !important; font-size:24px;margin:6px 0 0 0}
.p-img-box a{ background-color:#87cedc;color:#fff;font-size:20px; position:static;padding:20px 60px;display:inline-block;text-decoration:none;border:1px solid transparent; margin: 20px 20px 0 0}

.p-img-box a:hover{background-color:transparent;color:#87cedc;border:1px solid #87cedc}

.p-logo{text-align:right; margin:0; padding:30px 20px 20px 20px; background-color: #fff}
.p-logo img{ width: 40%; height:auto}
.p-language-wrp{margin: 0 auto}
.p-language{ color:#fff; width: 60px; text-align:center;padding: 9px 22px;background-color:#4e76a4; font-size: 1.1em;box-shadow:inset 0 -6px 10px -10px #000000}
.p-language a{color:#fff; text-decoration:none}
.p-language a:hover{color:#cacaca}
.container-mainmenu{ text-align: left;font-size: 1.3em;font-family: 'Muli', sans-serif;font-weight:300;letter-spacing:.1em; width:100%;background-color: #fff; border-top: 1px solid #d0d3d4; border-bottom:1px solid #e1e1de; text-transform: uppercase}
.content-main{text-align: left;color: #4e76a4;font-size: 1.2em;font-family: 'Muli', sans-serif;font-weight:300;line-height:1.6}

.box-main{width: auto}

strong{ font-weight: 600}
.article-image-detail img{ width:100% !important; height:auto}
.article-content-detail{margin-top:60px}
.news-box{margin: 0 0 40px 0;font-size:.85em;background-color:#fff; padding:12px;border:1px dotted #4e76a4}
.news-box a{text-decoration:none;color:#645c29}
.news-box h1{color:#ee7202;font-size:1em;margin:0;text-transform:uppercase}
.news-box .at-date{ font-size:.8em;color:#fff;background-color:#4e76a4;padding:3px 12px;position:absolute;border: 1px dotted #fff; border-left:none;border-top:none}

.news-listing{ flex: 0 0 1;font-size:1em;background-color:#fff}
li.news-listing{ flex-basis: 100%; margin-bottom:30px}

.news-listing:first-of-type{width:100%; float:none;margin: 0 0 30px 0}
.news-listing img{width:25% !important;height:auto; float: left; margin: 0 20px 20px 0}
.news-listing .at-content p{ float: left; display:inline-block; width: auto;box-sizing: border-box}
.news-listing .at-content{padding:20px 20px 20px 20px}
.news-listing .at-link{ float:right}
.news-listing a{text-decoration:underline}
.news-listing h1, .news-listing headline_1{color:#636a6e;font-size:24px;margin:0 0 10px 0; background-color: #eaeded; font-weight:300}
.news-listing h2, .news-listing headline_2{color:#4e76a4;font-size:16px;margin:10px 0 10px 0}
.news-listing .at-date{ font-size:.8em !important;color:#fff;background-color:#4e76a4;padding:15px 20px;margin:0 15px 0 0;position:relative; display:inline-block; font-weight:300}

.list-content{ position: relative}
.a-button{ background-color: #87cedc; color:#fff; text-decoration: none; box-sizing: content-box;padding: 40px; margin: 20px 0}
.a-button:hover{ background-color: #73afbb !important; color:#fff}
.icon-button{ padding-right:90px}
.download{ background: url(../icons/download.png) no-repeat center right+30px #87cedc}

.construction{ background-image: url(../icons/construction.png); background-repeat: no-repeat; background-position: bottom -12px right -12px; background-size: 80px}
.development{ background-image: url(../icons/development.png); background-repeat: no-repeat; background-position: bottom -12px right -12px; background-size: 80px}
.engineering{ background-image: url(../icons/engineering.png); background-repeat: no-repeat; background-position: bottom -12px right -12px; background-size: 80px}
.map{ background-image: url(../global/anfahrtsskizze.jpg); background-repeat: no-repeat; background-size:cover}
.map .a-button{background: url(../icons/home.png) no-repeat center right+30px #87cedc;padding-right:90px}

ul.grid-col-1 .a-button{ display: inline-block;width:auto !important; box-sizing: border-box}
ul .list-content ul{ padding: 0 0 20px}
li.project-listing{ flex-basis: 100%}
ul[category=jobs] .list-content{padding-top: 40px !important}
ul[category=aktuell].flex{ margin:0 !important}
li.project-listing p{margin:0}

.white-box{margin: 0 30px 0 0; clear:both;background-color:#fff}
.white-box:nth-of-type(2n+2){margin-right:0}
.white-box:first-of-type{width:100%; float:none;margin: 0 0 30px 0}
.white-box img{width:100%;height:auto}
.white-box .at-content{padding:40px 20px 20px 20px}
.white-box .at-link{color:#f8841d; font-size:16px}
.white-box a{text-decoration:underline;color:#4e76a4; font-weight: 600}
.white-box h1, .white-box headline_1{color:#4e76a4;font-size:24px;margin:0}
.white-box h2, .white-box headline_2{color:#4e76a4;font-size:16px;margin:6px 0 13px 0}
.white-box .at-date{ font-size:.8em;color:#fff;background-color:#4e76a4;padding:3px 12px;position:absolute;border: 1px dotted #fff; border-left:none;border-top:none}
.white-box:last-of-type{border:none}

.content-main{color: #4e76a4}
.page-topic1, headline_1{margin: 0 0 10px 0;color: #4e76a4;padding-bottom:15px}
.page-topic2, headline_2{margin: 0 0 10px 0; font-style: normal; color: #2a2a2a; font-size: 24px}

.grey headline_1{ color:#fff; text-transform: uppercase; font-weight: 600; margin: 0}
.grey-dark headline_1{ color:#fff; text-transform: uppercase; font-weight: 600; margin: 0}

h1, headline_1{ font-size: 1.2em;color: #4e76a4;background-color: transparent;margin: 0 0 10px 0;line-height:1.4em;font-weight:400;font-family: 'Muli', sans-serif}
h2, headline_2{font-size: 24px;background-color: transparent;margin: 0 0 20px 0;line-height: 1.4em;font-family: 'Muli', sans-serif;font-weight:500}
h2 a, headline_2 a{color: #87cedc;background-color: transparent}
h3, headline_3{font-size: 20px;margin: 0;font-family: 'Muli', sans-serif;font-weight:500}
h4, h5{font-size: 20px;margin: 0;font-family: 'Muli', sans-serif;font-weight:500}
h3,h4, h5{color: #4e76a4;background-color: transparent;margin-bottom: 10px;line-height: 1.3em}
.large{font-size: 2.7em}
a{font-size: 1em;color:#4e76a4;background-color: transparent; text-decoration: underline}
a img{border: none}
a:hover{text-decoration: none;color: #000000;background-color: transparent}

.box-page-intro .page-topic1, box-page-intro headline_1{ font-size:1.4em;padding-bottom:3px}

body[rel=intropage] .p-content{padding-top:68px}
.p-content{ padding-top:90px}
.p-content ul{padding: 0 0 0 0;margin: 0 0 0 20px;list-style: '+ '}
audio{width: 100%}
.pageNavigation ul{padding: 0em;margin: 0 0 0 2em}
#pageSitemap ul li{list-style: none;margin-left: -1em}

.tb{display:inline-table;table-layout: fixed}
.tr{display:table-row}
.td-spc{display:table-cell; width: 60px; background-color:#fff}
.tb .td-spc:nth-of-type(3n){ display:none}
.tb article{display: table-cell;vertical-align:top}

.a-links{ width: 100%;padding-top: 12px}
.a-links a{text-decoration: none; font-weight:600;font-size:.9em}
.a-pageflip-next{ width:60px;height:60px;background:url(../global/a-pageflip-next.png)}
.a-pageflip-next:hover{ width:60px;height:60px;background:url(../global/a-pageflip-next.png) right}
.a-pageflip-previous{ width:60px;height:60px;background:url(../global/a-pageflip-previous.png)}
.a-pageflip-previous:hover{ width:60px;height:60px;background:url(../global/a-pageflip-previous.png) right}

.pageflip-num{font-size:1.4em}
.pageflip-num.listing-page{margin:0}
.pageflip-num a:first-of-type{margin-left:0}
.pageflip-num a:last-of-type{margin-right:0}
.pageflip-num a, .pageflip-current{background-color: #898989; color: #fff; display:inline-block; font-size: 29px; height: 56px; line-height: 55px; margin: 0 7px; text-align: center; width: 56px;text-decoration:none}
.pageflip-num.small{font-size:1.1em}
.pageflip-num.small a, .pageflip-current{background-color: #898989; color: #fff; display:inline-block; font-size: 29px; height: 56px; line-height: 55px; margin: 0 7px; text-align: center; width: 56px;text-decoration:none}
.pageflip-num a:hover, .pageflip-current{background-color:#87cedc}

#ul-page-sitemap li{list-style-type:none}
.image-signature{padding-top:5px;color: #3a3a3a}
.image-copyright{color: #7a7a7a;padding: 0}
.image-signature,.image-copyright{font-size: 0.9em;font-style: italic}
.wrp-image-info{ position: relative; display:block}
.image-info{position: absolute; bottom: 30px; display: inline-block; padding: 20px 30px;background-image: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,1)); font-size: 17px; opacity:0;transition: all 0.2s ease-out}
.image-info .image-signature,.image-info .image-copyright{ color:#fff; font-style: normal; font-weight: 400}
.image-info .image-copyright{ border-bottom: 1px dotted #bdbab8}

.swipe-wrap{position: relative}
.a-left, .a-right{float: left}
.act-img{outline: 2px solid #fff}
.act-img img, .act-img:hover{filter: none;-webkit-filter: none}
.label{margin-right: 6px;color: #f59000;background-color: transparent}
.icon-img-left{float: left;margin-right: 12px}
.icon-img-right{float: right;margin-left: 12px}
.arrows{display: none;position: absolute;z-index: 12}
.arrows a img{opacity:0.85}
.arrows a img:hover{opacity: 1}
#thumb-preview{position: absolute;z-index: 18;box-shadow: 0px 2px 12px #3a3a3a}
#thumb-preview img{ border: 1px solid #fff; margin: 0}

.btn-link{ background-color: #87cedc; border: 1px solid #fff; outline: 1px solid #87cedc; color: #fff; text-decoration: none;margin: 15px 0 10px 0; display: inline-block; text-align:center}

.btn-link.nxt{background-image: url("../global/a-next.png"); background-repeat:no-repeat; background-position: right 10px center;padding: 5px 30px 5px 15px}
.btn-link.prev{background-image: url("../global/a-prev.png"); background-repeat:no-repeat; background-position: left 10px center;padding: 5px 15px 5px 30px}

.btn-link:hover{background-color: #a6013d; border: 1px solid #87cedc; outline: 1px solid #fff; color: #fff}

.box-image-left{}
.box-image-left .f-img{float: left;margin-right: 15px}
.w-50{ width:50% !important}
.w-50 img{width:100%; height:auto}
.characteristics{
   width: 33.3%; background-color: #eae9e7; padding: 18px 24px 24px 24px;box-shadow: 10px 10px 0 #bdbab8; line-height: 1.6; font-size: 16px; color:#4e76a4
}
.characteristics h3{font-size: 1em; font-weight: 600}

/** defaults */
.clear{clear:both;float:none;width:100%;display:block}
.fl{ float:left}
.fr{ float:right}
.rel{ position:relative}
a img{border:none}

.ar{ text-align:right}
.tr{margin: 14px 0 0 0}
.tr .tc:last-of-type img{width:auto;margin-right:0}
.tc{display:table-cell;margin-top:28px}
iframe{margin: 0 0 14px 0;border:none}
/** eo defaults*/

.grid-100 img{width:100%;max-width:100%;height:auto;display:block}

ul.grid-list{list-style:none;padding:0;margin:0}
ul.grid-list{margin-left:-10px}
ul.grid-list .p-grid img, ul.grid-list ul.grid-list .grid_25 img{width:100%;height:auto}
.p-grid{ width:380px; padding:0 0 30px 30px;float:left;box-sizing:border-box}

.grid_25{ width:274px; padding:0 0 30px 30px;float:left;box-sizing:border-box}
.p-grid.wide{width:770px}
.p-grid p{margin-top:0;padding-bottom:6px}

.f-left{float: left}
.f-right{float: right}
.clear{clear: both}
.content-spacer{height: 30px}
.ct-spc-double{clear: both;float:none;height: 60px}
.code-only{display: none}

.filedownload:hover a{color: #585858}
.filedownload.pdf:before{padding-left: 2px; position: relative; top: 2px; margin-right: 5px;content: url('../global/pdf.png')}
.filedownload.mov:before,.filedownload.qt:before,.filedownload.avi:before,.filedownload.mp4:before,.filedownload.mp3:before{padding-left: 2px; position: relative; margin: -2px 0 0 0;content: url('../global/media.png')}
.filedownload.eps:before,.filedownload.gif:before,.filedownload.png:before,.filedownload.tif:before,.filedownload.jpg:before{padding-left: 2px; position: relative; margin: 5px 5px 0 0;content: url('../global/image.png')}
.filedownload.txt:before{padding-left: 2px; position: relative; margin: -2px 0 0 0;content: url('../global/txt.png')}
.filedownload.rtf:before,.filedownload.doc:before{padding-left: 2px; position: relative; margin: -2px 0 0 0;content: url('../global/doc.png')}
.filedownload.xls:before{padding-left: 2px; position: relative; margin: -2px 0 0 0;content: url('../global/xls.png')}

.download-box{width:25%}
.download-box .img-box{}
.download-box img:hover{-webkit-transform: scale3d(1.2, 1.2, 1); transform: scale3d(1.2, 1.2, 1); filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); filter: gray; -webkit-filter: grayscale(100%)}
.download-box img{-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); filter: none; -webkit-filter: grayscale(0%); width: 100%;height:auto}


/** redo*/
	/**ul.grid-list{margin-left:-13px}*/
	ul.grid-list.g25{margin-left:-30px}
	
    .grid-50 img, .grid-100 img{width:100%;height:auto;display:block}
	.p-grid:nth-of-type(3n+1){ clear:left}
	.p-grid{min-width:auto;width:33.3%;margin:0;padding: 0 0 0 13px;overflow:hidden}
	.p-grid img{width:100%;height:auto}
	
	.grid_25:nth-of-type(4+1){ clear:left}
	.grid_25{min-width:auto;width:25%;margin:0 0 10px 0;padding: 0 0 0 10px;overflow:hidden}
	.grid_25 img{width:100%;height:auto}
	
	
	iframe{min-width:auto;width:30.83%; height:auto;margin:0;padding: 0;overflow:hidden}
	iframe:nth-of-type(2n){clear:right; margin-right:0}
	video{ width: 100% !important; height: 100% !important}

video[poster]{object-fit: cover}

#main-nav:target{ width: 100%}
#sidebar-nav:target + .p-body{width: 20%;overflow:hidden}
.sidebar-nav{position: fixed; top: 0; width: 0; height: 100%}

.lightbox{display: none;position: fixed; z-index: 999;top: 0; left: 0; width: 100%; height: 100%; text-align: center; background: rgba(0,0,0,0.8) !important;text-decoration:none}
.lightbox:hover{background: rgba(0,0,0,0.8)}
.lightbox img, #ov-inner.multimedia-video, #ov-inner.multimedia-audio{max-width: 80vw;max-height: 80vh;margin-top: 2%}
.lightbox .caption{text-align: left; background-color: #fff; color:#5a5a5a;max-width:1280px; margin: 0 auto}
.lightbox .caption p{margin: 0; padding: 5px 10px; font-size: 1.1em}
.lightbox:target{outline: none; display: block}
.lightbox-wrp .swiper_container{ width:100%}
.lightbox-wrp .swiper_pagination{ margin: 10px 0 0 10px}
.lightbox-wrp .swiper_pagination .swiper-pagination-bullet:hover, .lightbox-wrp .swiper_pagination .swiper-pagination-bullet-active{ background-color:#e05710;border: 1px solid #e05710}
.lightbox-wrp .swiper_pagination .swiper-pagination-bullet{border: 1px solid #e05710}
.lightbox-wrp .swiper-wrapper{ height: 400 !important; width: auto !important; overflow:hidden}
.lightbox-wrp .swiper-slide{ height: auto !important; width: auto !important; max-height: 600px !important}
.lightbox-wrp .swiper-slide img{ width:100% !important; height: auto !important; max-height: 600px !important; object-fit: scale-down}
.lightbox-wrp .swiper-slide .caption{ width: 100% !important; background-color: #fff; display:block; position:absolute; bottom: 0}
.lightbox-wrp, #ov-inner.multimedia-video, #ov-inner.multimedia-audio{border: 22px solid #fff; border-top: 18px solid #fff;display:inline-block;box-shadow: 0px 3px 6px #444444;max-width: 90%;background: url(../global/loader_24.png) no-repeat center #232627; margin-top: 2%}
.lightbox-wrp{ height: auto !important}
.lightbox-wrp .caption{ width: auto !important; max-width: 100%}
.lightbox-wrp .caption p{ display:inline-block !important}
.lightbox-wrp .caption p{margin: 0; padding: 5px 10px; font-size: 1.1em}

.lbi{position: fixed; z-index: 40000;top: 0; left: 0; width: 100%; height: 100%; text-align: center; background: rgba(0,0,0,0.8) !important;text-decoration:none}
.lbi img{max-width: 100%; height: auto; max-height: 80vh}
.lbi .caption{text-align: left; background-color: #fff; color:#5a5a5a; margin: 0 auto; border-top:1px solid #eaeaea}
.lbi .caption p{display:inline-block !important;margin: 0; padding: 5px 0; font-size: 1em}
.lbi .lb-wrp{overflow:hidden;max-width: 90%; background: url(../global/loader_24.png) no-repeat center #232627; display: inline-block;box-shadow: 0px 6px 12px #000000; outline:1px solid #fff;margin-top: 5%}

.cookie-policy{ background-color:#4f5558; color:#fff; position:static; text-align:center; top:0; left:0; z-index:38;width:100%; display: inline-block !important; font-size: 1em; max-height: 99vh; overflow: auto}
.cookie-policy h3{ color:#fff}
.cookie-policy .a-button a,.cookie-policy button{float: none; clear:both}
.cookie-policy p{margin: 0 auto 10px auto}
.cookie-policy-innerwrap{ width: 1192px; margin: 20px auto 0 auto; text-align: left}

.cookie-policy button{ color: #fff; background-color: #87cedc; padding: 20px 40px;margin-bottom: 10px}

.cookie-policy button:hover{ color:#87cedc; background-color:#fff}
.cookie-policy .feedback-error{color:#3d4b61}
.cookie-policy label.cb-label{ width:45%}

.box-2{ width:66.66%; float:left; display:block;transition: all 0.2s ease-out}
.box-1{ width:33.33%; float:left; display:block;transition: all 0.2s ease-out}
.box-1 .inner-padding{padding: 0 0 0 40px}

#container-article{ background-color:#87cedc; color:#fff}
#container-article h1{ color:#fff; font-size: 37px; font-family: 'Muli', sans-serif; font-weight:400 !important; background-image: none; margin: 0 0 10px 0; padding:0}
#container-article .p-wrap{ padding: 30px 0;font-size: 35px; font-weight:300;}
#container-article .p-wrap p{ margin:0;font-weight: 300 !important}

.mobile-button{ display: none}
.bar1, .bar2, .bar3{ width: 22px; height: 3px; background-color: #626161; margin: 5px 0; transition: 0.4s}
ul.flex {box-sizing: border-box; list-style: outside none none; margin: -30px 0 0 -30px; padding: 0 0 0 -30px !important; display: flex; flex-wrap: wrap; flex-direction: row}
ul.flex li{display: flex;transition: all .2s ease}
ul.flex li .list-content{ width:100%;flex-direction: column;display:flex; margin: 30px 0 0 30px; padding:20px}

ul.grid-col-2 li{ flex-basis: 50% !important}
.grid-col-3 li{ flex-basis: 33.33%}
.grid-col-4 li{ flex-basis: 25%}
ul.flex li img{width:100%;height:auto}

.list-content.white{background-color: #fff}
.list-content.grey{background-color: #828a8e; color:#fff}
.list-content.grey h1{color:#fff}
.list-content.grey-dark{background-color: #636a6e; color:#fff}
.list-content.grey-dark h1{color:#fff}
.list-content.grey-light{background-color: #d7dbdd; color:#fff}
.list-content.grey-light h1{color:#000}

ul.flex li ul{margin: 0}
ul.flex li ul li::before{content:'+';margin-right:10px;color:#87cedc}

.white[rel=tri]{}
.white[rel=tri] .list-content{padding: 56.25% 0 0 0; position: relative; width: 100%}
.white[rel=tri] ul.flex{display: flex;flex-wrap: nowrap;margin: 0 0 0 -70px}
.white[rel=tri] li{ overflow: hidden;margin: 0 0 30px 0;flex-basis: 33.33%; list-style: none}
.white[rel=tri] ul.flex li img{ min-height: 100% !important; object-fit: cover; width: 100%; position: absolute; top: 0; left: 0; bottom: 0; right: 0}
.white{background-color: #fff}

.ul-articlepage{margin: 30px 20px 20px 0 !important; width: 25%; text-transform: uppercase; font-size: 20px !important;border: 1px solid #d0d3d4}
.ul-articlepage li{border-top: 1px solid #d0d3d4; list-style: none}
.ul-articlepage li:first-of-type{border-top:none}

.ul-articlepage li a{ color:#00457b}
.ul-articlepage li a, .ul-articlepage li span{padding:20px; display:block; text-decoration: none}
.ap-link-act span{ background-color: #87cedc;color:#fff}

@media all and (max-width: 1224px){
	*[data-attr="mobile-only"]{ display:block}
	.p-body, header{width:100%}
    .p-content{padding:13px 13px 0 13px}
	.p-wrap,#p-teaser,#p-teaser img{width: 100%}
	.p-logo img{width:60%}
	.p-img-box{margin-left:0}
	.box-page-intro .page-topic1, .box-page-intro headline_1{ font-size:1.2em}
	.box-page-intro .page-topic2, .box-page-intro headline_2{ font-size:1.4em}
	
	.p-grid{display:block}
	.grid-50{min-width:auto;width:48.6%;margin:0;padding: 14px 0 0 0;overflow:hidden}
    .grid-50 img{width:100%;height:auto}
	#p-teaser ul li img{ width:100%;height:auto}
	.rating{ display:block;margin:20px 0 20px 0}
	.swiper-wrapper{ width:100%; height:auto}
	.swiper-slide{width:auto;height:auto}
	.thumbnail_slide .swiper-wrapper .swiper-slide,.swiper-slide img{ width:120px;height:auto}
	.product-box-ov select{margin-bottom:20px}
	
	.grid-50 iframe{width:100%;height:auto;display:block}
    /** redo*/
	ul.grid-list{margin-left:-13px}
	ul.grid-list.g25{margin-left:-30px}
	
    .grid-50 img, .grid-100 img{width:100%;height:auto;display:block}
	.p-grid:nth-of-type(3n+1){ clear:left}
	.p-grid{min-width:auto;width:33.2%;margin:0;padding: 0 0 0 13px;overflow:hidden}
	.p-grid img{width:100%;height:auto}
	
	.grid_25:nth-of-type(4+1){ clear:left}
	.grid_25{min-width:auto;width:25%;margin:0 0 30px 0;padding: 0 0 0 30px;overflow:hidden}
	.grid_25 img{width:100%;height:auto}
	
	iframe{min-width:auto;width:30.83%; height:auto;margin:0;padding: 0 0 0 0;overflow:hidden}
	iframe:nth-of-type(2n){clear:right; margin-right:0}
	video{ width: 100% !important; height: 100% !important}
    
    header{height:auto}
    .p-logo{ }
    .p-logo img{}
    
    .p-img-box{ max-width:100vw; width:100% !important; display: block;bottom:0; left: 0; right:0; margin-left:0 !important}
    .p-img-box .inner-padding{ padding: 60px 60px 40px 60px }
    .mobile-button:hover{cursor:pointer}
	.mobile-button-user{position:relative;float: right;top:-22px;right:14px; text-decoration:none;display:block;background:url('../res/user_menu.png') center no-repeat;width:30px; height:30px}
	.mobile-button-user_hover:hover{cursor:pointer}
    .top-box a{margin-left: 19px}
    #user-nav{display:none}
    #top-menu li:after{ content:''}
    .cookie-policy-innerwrap{ width: auto; margin: 30px 30px 0 30px}
}

@media all and (max-width: 1140px){
	.container-mainmenu{font-size:1.4em; width:auto}
}

@media all and (max-width: 1000px){
	.container-mainmenu{font-size:1.2em}
	.box-customer article .meta .title{font-size:1.3em;padding: .5em}
	.download-box{width:50%}
}
@media all and (max-width: 940px){
	.box-customer article .meta{font-size: 11px}
	.box-customer article .meta .title{font-size:1.2em;padding: .5em}
    
    .box-2{ width:50%; float:left; display:block}
    .box-1{ width:50%; float:left; display:block}
    .swiper-slide .p-body{ position: relative;display:block; bottom:0}
    header{ height: auto}
    .p-logo{ height:auto}
    .p-logo img{ width:100%;margin-top: 10px}
    .header-spacer{height:90px}
    .box-1 .inner-padding{padding: 0 10px 0 30px}
    .image-info{padding:10px 20px; bottom:20px; font-size: 14px}
    
    .news-listing .at-date{margin:0 0 10px; display:inline-block; width:100%;box-sizing: border-box}
    .news-listing h1{ background-color:  #fff; color:#4e76a4; font-weight: 400}
    .ul-articlepage{ }
}
@media all and (max-width: 880px){
	.p-grid{min-width:auto;width:49.9%}
	.p-grid:nth-of-type(2n+1){ clear:left}
	.p-grid:nth-of-type(even){ margin-right:0;clear:right}
	
	ul.grid-list.g25{margin-left:-13px}
	.grid_25:nth-of-type(2+1){ clear:left}
	.grid_25{min-width:auto;width:50%;margin:0 0 13px 0;padding: 0 0 0 13px;overflow:hidden}
	.grid_25 img{width:100%;height:auto}
	
	.box-page-intro .page-topic1, .box-page-intro headline_1{ font-size:1em}
	.box-page-intro .page-topic2, .box-page-intro headline_2{ font-size:1.2em}
	footer{padding-bottom:13px}
	footer table{}
	footer tbody, footer thead{float: left}
	
    footer thead{min-width: 100%}
    footer td,footer th{display: block;width:48.5%;float:left;margin-right:13px; margin-bottom:13px}
	footer td:nth-of-type(even),footer th:nth-of-type(even){clear:right;margin-right:0}
    footer h4{width:100%}
	.box-customer article .meta{font-size: small}
	.box-customer article .meta .title{font-size:1.5em;padding: 0 1em}

    ul.grid-col-2 li, .grid-col-2 li, ul.grid-col-3 li, .grid-col-3 li{ flex-basis: 50% !important}
    
    .grid-col-3 li:nth-last-child(1):nth-child(odd){ flex-basis: 100% !important}
    .a-button{ padding-top: 20px; padding-bottom: 20px}
    
    .white[rel="tri"] ul.flex{ flex-wrap: wrap}
    .white[rel=tri] .grid-col-3 li{flex-basis:50%; margin:0}
    .white[rel=tri] ul.flex li .list-content{}
    .white[rel=tri] .grid-col-3 li:last-of-type{ flex-basis: 100% !important; margin-bottom:30px}
}

@media all and (max-width: 680px){
    #menu-main{ display:none}
    header{height: 90px}
    .p-logo{padding: 0px 20px 5px 20px}
    .mobile-button{ display: block}
	#p-teaser{max-height:100%; min-height: 380px;height:auto !important; background-color:#fff}
	#p-teaser img{ object-fit: cover;height:100% !important;min-height:380px !important;max-height:100vh !important}

	.p-img-box{ max-width:100vw;width:auto;height:auto;display:inline-block; opacity:1}
	.p-img-box .page-topic1, .p-img-box headline_1{ font-family: 'Muli', sans-serif; font-weight: 400 !important;font-size:20px;margin:0}
    .p-img-box p{font-size: 18px}
    .p-img-box .inner-padding{ padding:30px}
    
	.p-grid{min-width:auto;width:100%;float:none; clear:both;margin:0}
	.box-customer article .meta .title{font-size:1.2em;padding: 0 .5em}
	.download-box{width:100%}
	.download-box .img-box{height:60% !important; overflow:hidden}
	.box-page-intro .page-topic2, .box-page-intro headline_2{ font-size:19px}
    .swiper-slide .p-body{ position: static}
    .cookie-policy button{width: 100%}
    
    .box-2{ width:100%; clear:both; display:block; margin-bottom: 13px}
    .box-1{ width:100%; clear:both; display:block}
    .box-1 .inner-padding{padding: 0}
    .page-topic1, headline_1{font-size:1em}
    h2,h3, headline_2, headline_3{ font-size:1.2em}
    h4{font-size:1em;font-weight:400}
    ol{margin-left:0;padding-left:20px}
    .w-50{ width:100% !important}
    .a-links{background-image: none; padding: 0}
    .news-listing .at-link{ float:none}
    .news-listing img{ float:none; clear: right; width: 100% !important; margin-bottom: 10px}
    ul.grid-col-2 li, .grid-col-2 li, ul.grid-col-3 li, .grid-col-3 li{ flex-basis: 100% !important}
}

@media all and (max-width: 480px){
	header{position:relative;width:100%;margin:0;display:block;text-align:left}
    .header-spacer{height:0}
    .p-logo{ padding:10px}
	.p-grid p{ font-size:1em}
	.grid_25{min-width:auto;width:100%;float:none; clear:both;margin:0 0 13px 0}
    footer{font-size:1em}
	footer .phone-link:before{content:''}
	footer td,footer th{display: block;width:98%;float:none;margin-right:14px}
	footer td{margin-bottom:30px}
	footer td:nth-of-type(even),footer th:nth-of-type(even){clear:right;margin-right:0}
    footer h4{width:100%}
	.box-customer article .meta .title{font-size:1.5em;padding: 0 .5em}
    .a-button{ width:100% !important; box-sizing: border-box}
    .cookie-policy label.cb-label{ width:90%}
}