@font-face { font-family: 'scala'; src: url('/static/fonts/ScalaSansWeb.eot'); src: url('/static/fonts/ScalaSansWeb.eot?iefix') format('eot'), url('/static/fonts/ScalaSansWeb.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'scala'; src: url('/static/fonts/ScalaSansWeb-Bold.eot'); src: url('/static/fonts/ScalaSansWeb-Bold.eot?iefix') format('eot'), url('/static/fonts/ScalaSansWeb-Bold.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'emcon'; src: url('/static/fonts/ems-icons.eot?v=1') format('eot'), url('/static/fonts/ems-icons.woff?v=1') format('woff'), url('/static/fonts/ems-icons.ttf?v=1') format('truetype'); } @font-face { font-family: 'emconold'; src: url('/static/fonts/old/emicon.eot?') format('eot'), url('/static/fonts/old/emicon.woff') format('woff'), url('/static/fonts/old/emicon.ttf') format('truetype'); } @font-face { font-family: fas; /* icon font */ src: url("/static/fonts/fa-solid-900.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: far; /* icon font */ src: url("/static/fonts/fa-regular-400.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: fab; /* icon font */ src: url("/static/fonts/fa-brands-400.woff") format("woff"); font-weight: normal; font-style: normal; } body { font-family: scala, Helvetica, Helvetica Neue, Arial; font-size: 10px; background: #fff; } a { color: rgb(237,127,0); text-decoration: none; } div { position: relative; } textarea { resize: vertical; } img { border: 0; vertical-align: bottom; } .header__container { background-size: 100%; } .header__container .key { width: 100%; margin-top: 103px; height: auto; } .header__container .key__intropic { width: 100%; margin-top: 103px; height: auto; } .header__container__ref .key { max-width: 100%; margin-top: 103px; height: auto; } .header__container__start, .header__container__vk { min-height: auto; } .header__container__ref { min-height: 650px; background-size: auto; background-color: #f7f7fd; } .background { background-position: center 103px; background-repeat: no-repeat; text-align: center; } .headwrapper { position: absolute; top: 0; width: 100%; } .header__container__start .headwrapper, .header__container__ref .headwrapper, .header__container__vk .headwrapper { position: relative; } .wrapper { width: 1180px; margin: auto; } header { position: fixed; top:0; left: 0; background: #fff; transition: transform .25s .1s ease-in-out; width: 100%; z-index: 1000; } header nav { font-size: 2em; text-transform: uppercase; position: absolute; right: calc(23px + 50% - 590px); vertical-align: middle; } header nav .elem { display: inline-block; } header nav .label { margin: 0 12px; } header nav #navicon { margin-right: 46px; } header nav a { color: #000; text-decoration: none; } header nav, header nav * { vertical-align: middle; } header { height: 95px; } .down header { transform: translate3d(0, -100px, 0); } .down .header__container__start header { transform: none; } .header__container__start header { height: 150px; background: none; position: absolute; } header nav { top: 34px; } .header__container__start header nav { top: 80px } #logo { position: absolute; left: calc(26px + 50% - 590px); max-width: 220px; height: auto; } #logo.meteo { bottom: 5px; } #logo.compact { bottom: 25px; max-height: 40px; width: auto; } .header__container__start #logo__emsys { display: none; } .header__container__start #logo { bottom: 25px; max-width: 185px; left: calc(26px + 50% - 590px + 50px); } .header__container__start #logo__vpp { position: absolute; bottom: 46px; max-height: 27px; width: auto; left: calc(26px + 50% - 590px + 40px + 185px + 70px); } .header__container__start #logo__grid { position: absolute; bottom: 46px; max-height: 27px; width: auto; left: calc(26px + 50% - 590px + 40px + 185px + 70px + 155px); } .gradient { background: url('/static/images/wfade.png') repeat-x; width: 100%; height: 343px; position: absolute; top: 0; left: 0; } #navicon { border: 2px solid #000; border-radius: 6px; margin-top: -3px; } nav .label { cursor: pointer; } #nav__main { position: absolute; display: none; background: rgba(255,255,255,0.975); width: 100%; top: 0; height: auto; z-index: 100; font-size: 2.1em; padding-top: 120px; border-bottom: 2px solid rgb(237,127,0); min-height: 100vh; box-sizing: border-box; } .header__container__start #nav__main { padding-top: 120px; } #nav__main ul { margin: 0; padding: 0; list-style: none; } #nav__main .nav__col { display: inline-block; width: 225px; vertical-align: top; text-align: left; margin: 20px 18px 20px 18px; padding: 0; } #nav__main .nav__col:first-child { margin-left: 0; } #nav__main .nav__col li { border-bottom: 1px solid #c8c7c6; } #nav__main .nav__col li li { border-top: 1px solid #c8c7c6; border-bottom: none; font-size: 0.8em; padding-left: 6px; } #nav__main .nav__col li li a:before { content: "- "; } #nav__main .nav__col li .nav__cat { display: inline-block; padding: 12px 0; } #nav__main .nav__col li .nav__sub__cat { display: inline-block; padding: 12px 0; color: rgb(237,127,0); cursor: pointer; background: url('/static/images/nav-arrow.png') right center no-repeat; width: 100%; } #nav__main .nav__col li a { display: inline-block; padding: 12px 0; width: 100%; color: rgb(237,127,0); text-decoration: none; } #nav__main .nav__col li a.current { color: rgb(50,115,181); } #nav__main .nav__col li li a { width: auto; } #nav__main .nav__col li ul { display: none; } #nav__main .nav__col li ul.current { display: block; } #nav__main .nav__row { list-style: none; display: flex; flex-wrap: wrap; vertical-align: top; text-align: left; margin: 30px auto; width: 920px; } #nav__main .nav__row li { flex-grow: 1; margin: 1px; background: #e9e7e5; } #nav__main .nav__row li a { color: rgb(237,127,0); text-decoration: none; display: block; padding: 12px; } #nav__main .nav__row li a:hover { background: rgb(237,127,0); color: #fff; transition: all 0.3s; } #nav__main .nav__row li a.nav__news::before { content: " "; font-family: far; } #nav__main .nav__row li a.nav__events::before { content: " "; font-family: far; } #nav__main .nav__row li a.nav__ei::before { content: " "; font-family: far; } #nav__main .nav__row li a.nav__dl::before { content: " "; font-family: far; } #nav__main .nav__row li a.nav__ct::before { content: " "; font-family: fas; } #nav__main .nav__row li.nav__contact { width: 100%; flex-grow: 4; background: none; text-align: center; margin-top: 1em; } .rsLinklist { list-style: none; margin: 0; padding: 0; margin-top: 40px; } .rsLinklist li { margin-top: 10px; } .rsLinklist li:first-child { margin-top: 0; } .rsLinklist a { display: inline-block; background: rgba(237,127,0,0.75); text-decoration: none; font-size: 2.2em; line-height: 1.2em; padding: 15px 0; width: 300px; text-align: center; color: #fff; } .rsLinklist a:hover { background: rgba(237,127,0,1)!important; } .dimmer .rsLinklist a { background: rgba(237,127,0,0.6); } .claim { font-size: 4.8em; line-height: 1.25em; margin-top: 400px; color: #fff; text-shadow: 0 0 5px #333; padding: 0 30px 0 30px; box-sizing: border-box; } .mobile { font-size: 3em; display: none!important; text-shadow: 0 0 5px #333; } .rsContent #weather img.sandwich { position: absolute!important; top: 0; left: 0; height: auto; min-width: 100%; } .rsTmb .icon { font-family: emcon; font-size: 3em; line-height: 1em; } .rsTmb .text { line-height: 1em; } .head__small { font-size: 2em; text-transform: uppercase; font-weight: bold; margin-bottom: 0.5em; } .main { padding: 30px 0; } .rsContainer .rsContent .medatext { margin-left: 60%; width: 30%; padding: 20px; background: rgba(0,0,0,0.3); text-align: left; font-size: 2em; color: #fff; } .medatext { display: none; } .medatext a { color: #fff; text-decoration: underline; } #news__button__row { margin-bottom: 2px; padding: 0.5em 0; } #dates__button__row { margin-bottom: 2px; padding: 0.5em 0; } .dates__entry { margin: 1em 0 1.5em 0; } #news__button { width: 48px; height: 48px; border: none; text-align: center; background: rgb(237,127,0); border-radius: 24px; padding: 10px 0 0 0; -webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s; } #news__slider { font-size: 2.0em; line-height: 1.4em; } #news__slider h2 { font-size: 1.8em; font-weight: bold; line-height: 1em; } .contentSlider { width: 940px; margin: 0 100px; min-height: 270px; } #news__wrapper { border-bottom: 2px solid #e9e7e5; margin-bottom: 3em; padding-bottom: 2em; } #slider__prev, #slider__next { position: absolute; top: 80px; padding: 20px; cursor: pointer; } #slider__prev { left: 0; } #slider__next { right: 0; } .rotated { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } #bc { font-size: 1.8em; margin-bottom: 2em; padding: 0 20px; line-height: 1.5em; } #bc .parent { display: inline-block; margin-right: 15px; } #bc ul { list-style: none; margin: 0; padding: 0; display: inline; } #bc li { display: inline-block; margin-right: 15px; } #bc a.current { color: rgb(50,115,181); } #bc li.current > a { color: rgb(50,115,181); } #bc .tabindex { display: block; margin-top: -75px; margin-bottom: 115px; } #bc .tabindex > li { background: #e1e2e3; line-height: 40px; margin-right: 5px; } #bc .tabindex > li > a { line-height: 40px; padding: 0 1em; } #bc .tabindex > li.current { background: #fff; line-height: 50px; margin-top: -5px; } #bc .tabindex ul { position: absolute; top: 60px; left: 20px; } #bc .tabindex .parent { display: none; } #bc .notevwh { display: none; } .headgrad::after { content: " "; position: absolute; left: 0; bottom: 0; height: 50px; width: 100%; background: linear-gradient(0deg, rgba(0,0,0,0.36) 0%, rgba(0,0,0,0) 100%); } section { margin-top: 1em; padding: 20px; } section h1 { font-size: 3.4em; font-weight: bold; margin-top: 0; } section h2 { font-size: 3.0em; font-weight: normal; } section h1.set { margin-bottom: 0.8em; } section h2.set { margin-top: -0.6em; } section .text__block { font-size: 2em; line-height: 1.3em; } #start { padding: 0 20px; } #start h1 { font-size: 1.6em; line-height: 1.2em; } #start h2 { font-size: 1.4em; line-height: 1.2em; } .cols__one, cols__two { min-height: 500px; -webkit-hyphenate-limit-before: 3; -webkit-hyphenate-limit-after: 3; -webkit-hyphenate-limit-chars: 6 3 3; -webkit-hyphenate-limit-lines: 3; -webkit-hyphenate-limit-last: always; -webkit-hyphenate-limit-zone: 8%; -moz-hyphenate-limit-chars: 6 3 3; -moz-hyphenate-limit-lines: 3; -moz-hyphenate-limit-last: always; -moz-hyphenate-limit-zone: 8%; -ms-hyphenate-limit-chars: 6 3 3; -ms-hyphenate-limit-lines: 3; -ms-hyphenate-limit-last: always; -ms-hyphenate-limit-zone: 8%; hyphenate-limit-chars: 6 3 3; hyphenate-limit-lines: 3; hyphenate-limit-last: always; hyphenate-limit-zone: 8%; } .cols__one .head { float: left; width: 340px; text-align: right; } .cols__one .text__block { float: right; width: 740px; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; -moz-hyphens: auto; } .nohyphens .cols__one .text__block { -ms-hyphens: manual; -webkit-hyphens: manual; hyphens: manual; -moz-hyphens: manual; } .cols__one .text__block h2, .cols__one .index__wrapper h2 { float: left; width: 340px; text-align: right; margin-left: -400px; font-size: 1.5em; line-height: 1.2em; margin-top: 0.7em; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; -moz-hyphens: auto; } .cols__one .index__wrapper h2 { font-size: 3em; margin-top: 0; margin-right: 60px; } .cols__one .text__block h2 + p { margin-top: 1em; } .cols__one .text__block p:first-child { margin-top: 0; } .cols__one .text__block ul:first-child { margin-top: 0; } .cols__one .MitBeschriftung { max-width: 480px; } .cols__one .Bildunterschrift { margin: 0; max-width: 220px; margin-left: 15px; } .cols__two .text__block { column-count: 2; column-gap: 60px; -moz-column-count: 2; -moz-column-gap: 60px; -webkit-column-count: 2; -webkit-column-gap: 60px; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; -moz-hyphens: auto; } .nohyphens .cols__two .text__block { -ms-hyphens: manual; -webkit-hyphens: manual; hyphens: manual; -moz-hyphens: manual; } .cols__two .text__block.columnfree { column-count: 1; column-gap: 0; -moz-column-count: 1; -moz-column-gap: 0; -webkit-column-count: 1; -webkit-column-gap: 0; } .cols__two .text__block .Spaltenwechsel { break-before: column; -moz-break-before: column; -webkit-column-break-before: always; display: block; } .cols__two .text__block .keinSpaltenwechsel { break-inside: avoid; page-break-inside: avoid; -webkit-column-break-inside: avoid; display: block; } .text__block img { max-width: 100%; height: auto; max-height: 920px; } .Bildunterschrift, .Bildunterschrift__frei { display: inline-block; margin-top: 0.5em; font-size: 0.8em; line-height: 1.4em; font-style: italic; } .KeinUmbruch { white-space: nowrap; } .text__block > h3:first-child { margin-top: 0; } .text__block > ul:first-child { margin-top: 0; } .examcol { clear: both; border-top: 2px solid #c9c9c9; } .examcol h2 { float: left; width: 340px; text-align: right; margin: 1.5em 0; } section.boxed { background: #fdefe0; margin-bottom: 4em; } .text__block p:first-child { margin: 0; } section.boxed .text__block p:first-child { margin-top: 1em; } section.notes { font-size: 1.7em; color: #949494; border-top: 2px solid #c9c9c9; border-bottom: 2px solid #c9c9c9; line-height: 1.4em; margin-bottom: 50px; } .box__head { font-size: 3em; text-align: right; position: absolute; margin-top: 20px; left: 20px; width: 340px; line-height: 1em; } section.topline { border-top: 2px solid #c9c9c9; } section.bottomline { border-bottom: 2px solid #c9c9c9; margin-bottom: 3em; } .cols__one section.notes, .cols__one section.topline { float: right; width: 740px; } .cols__one .index__wrapper { float: right; width: 800px; } .cols__two .box__head { text-align: left; position: relative; left: auto; margin-top: 0; margin-bottom: 0.6em; width: auto; line-height: 1em; } #footer__container { background: #4c4c4c; color: #fff; } footer { min-height: 224px; text-align: center; } footer .col { display: inline-block; vertical-align: top; font-size: 1.8em; width: 33%; } footer .left { float: left; text-align: left; } footer .right { float: right; text-align: right; } footer a { color: #fff; } footer a:hover { color: rgb(237,127,0); } #full-width-slider { width: 100%; color: #000; background: url('/static/images/startbg.jpg'); background-position: center center; background-size: cover; } #full-width-meteo { width: 100%; color: #000; overflow: hidden; height: 775px !important; } #full-width-slider:before { content: " "; background: url('/static/images/bfade.png') left bottom repeat-x, url('/static/images/wfade.png') left top repeat-x; width: 100%; height: 605px; position: absolute; top: 0; left: 0; } #full-width-meteo:before { content: " "; background: url('/static/images/wfade.png') left top repeat-x; width: 100%; height: 605px; position: absolute; top: 0; left: 0; } #meteo-button { position: absolute; top: 700px; width: 100%; font-size: 2em; } #meteo-button a { color: #fff; display: inline-block; border: 2px solid #fff; border-radius: 4px; padding: 0.5em 0.8em; } .infoBlockLeftBlack { width: 1180px; margin-left: calc(50% - 1180px / 2); text-align: left; position: absolute; top: 260px!important; } .fullWidth { max-width: 1400px; margin: 0 auto 24px; } /* .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 853px !important; } */ .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 605px !important; } .infoBlockLeftBlack { top: 100px; } .claim { margin-top: 190px; } .header__container__start header { height: 110px; } .header__container__start header nav { top: 35px; } #messe { top: 280px; } #efre__box { position: absolute; top: 478px; right: 20px; background: rgba(0,0,0,0.5); padding: 10px; border: 1px solid rgba(255,255,255,0.5) } .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } section:before, section:after { content: " "; display: table; } section:after { clear: both; } section { *zoom: 1; } .index__wrapper { margin-right: -60px; display: flex; justify-content: flex-start; flex-flow: row wrap; } .teaser__box::after { content: " "; flex: 0 0 32%;; } .teaser__box { display: inline-block; width: 340px; margin-right: 58px; margin-bottom: 70px; } .teaser__headline { font-size: 2.4em; margin: 1em 0 0.65em 0; } .teaser__text { font-size: 2.0em; line-height: 1.2em; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } .nohyphens .teaser__text { -ms-hyphens: manual; -webkit-hyphens: manual; hyphens: manual; -moz-hyphens: manual; } .teaser__text p { margin: 0 0 0.5em; } .teaser__state { position: absolute; left: 5px; bottom: 5px; color: #fff; padding: 3px; background: rgba(0,0,0,0.5); font-size: 1.8em; font-family: scala; } .active::before { content: " "; font-family: fas; } .inactive::before { content: " "; font-family: far; } .examicon { font-family: emconold; display: block; text-align: right; font-size: 2em; line-height: 1em; } .exam { padding-top: 3em; } .exam .teaser__box { background: #f4f5f6; margin-bottom: 50px; } .exam .teaser__headline { padding: 0 10px; font-size: 2.2em; } .exam .teaser__text { padding: 0 10px; font-size: 1.9em; } .indexlink { display: inline-block; font-size: 1.2em; margin-bottom: 2em; background: #f4f5f6; padding: 10px; } .indexlink a::before { content: " "; font-family: fas; } .teaser__indexlink { clear: both; display: inline-block; font-size: 2.2em; margin-bottom: 2em; background: #f4f5f6; padding: 10px; margin-right: 60px; } .teaser__indexlink a::before { content: " "; font-family: fas; } .blog__box { display: block; margin-bottom: 30px; background: #f4f5f6; padding-bottom: 1px } .blog__date { font-size: 1.8em; line-height: 1.2em; margin: 15px; } .blog__headline { font-size: 2.2em; margin: 15px; } .blog__text { font-size: 1.8em; line-height: 1.2em; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin: 15px; } .nohyphens .blog__text { -ms-hyphens: manual; -webkit-hyphens: manual; hyphens: manual; -moz-hyphens: manual; } .teaser__blog { margin-top: 3em; } .blog__pic { float: left; margin-right: 2em; } .mag__box { display: block; margin-bottom: 30px; padding-bottom: 1px } .mag__headline { font-size: 2.2em; margin: 15px 0; } .mag__text { font-size: 1.8em; line-height: 1.2em; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin: 15px 0; } .nohyphens .mag__text { -ms-hyphens: manual; -webkit-hyphens: manual; hyphens: manual; -moz-hyphens: manual; } .job { margin: 4em 0; } .job:first-child { margin-top: 2em; } .job__label { font-size: 1.6em; display: inline-block; background: #fd7800; padding: 0.5em 0.7em 0.3em 0.7em; color: #fff; } .job__link { font-size: 2.4em; line-height: 1.2em; margin: 0.4em 0; } .job__text { font-size: 2em; line-height: 1.2em; } .col__head { font-size: 2.8em; line-height: 1.2em; font-weight: bold; margin-bottom: 1em; } .leftcol { width: 540px; float: left; } .rightcol { width: 540px; float: right; } .form textarea { width: 100%; height: 440px; box-sizing: border-box; } .form input[type=text] { width: 100%; box-sizing: border-box } .form input[type=number] { width: 100%; box-sizing: border-box } .form .base { font-size: 1em; padding: 0.7em; border: 1px solid #c4c4c4; margin-bottom: 0.5em; color: #a6a6a6; } .form input[type=submit] { background: rgb(237,127,0); color: #fff; border: none; text-align: left; padding: 0.7em; margin: 1.5em 0; } .form.col2 .base { color: #000; } .form.col2 fieldset { margin-top: 2em; border: none; background: #f4f5f6; padding: 1.2em; } .form.col2 fieldset p:first-of-type { margin-top: 0; } .form.col2 fieldset p:last-child { margin-bottom: 0; } .form.col2 legend { font-size: 1.2em; padding-bottom: 0.5em; } .form.col2 .hint { font-size: 0.8125em; } .form.col2 input[type=text] { width: calc(50% - 0.25em); } .form.col2 input[type=text]:nth-of-type(odd) { margin-right: 0.25em; } .form.col2 input[type=number] { width: calc(50% - 0.25em); } .form.col2 input[type=number]:nth-of-type(odd) { margin-right: 0.25em; } .form.col2 .logger__block { margin-bottom: 2em; } .form.col2 .logger__wrapper { width: calc(50% - 0.25em); margin-bottom: 0.25em; display: inline-block; } .form.col2 .logger__wrapper:nth-of-type(odd) { margin-right: 0.25em; } .form.col2 .logger__wrapper input[type=text] { width: 100%; } .form.col2 .logger__wrapper input[type=number] { width: 100%; } .form.col2 .input__hint { margin-left: 30px; } .form.col2 .mene__hint { color: rgb(50,115,181); display: none; } .form.col2 .solar { display: none; } .form.col2 .nonsolar { display: none; } .form.col2 button.switch { width: calc(50% - 0.25em); font-size: 1.2em; background: rgb(237,127,0); color: #fff; border: none; padding: 1em 0; vertical-align: middle; margin-bottom: 0.5em; } .form.col2 button.switch:nth-of-type(odd) { margin-right: 0.25em; } .form.col2 button.selected { background: rgb(237,127,0); } .form.col2 button.selected:before { content: " "; font-family: "fas"; } .form.col2 button.notselected { background: #bbb; } .form.col2 .hidden-row { display: none; } .form.col2 button.plus { background: rgb(237,127,0); border: none; color: #fff; padding: 0.5em 0.75em; width: auto; font-size: 1.2em; } .form *::placeholder { color: #a6a6a6; opacity: 1; } .form input[type='checkbox'] { display: none; } .form input[type='radio'] { display: none; } .form input[type='checkbox']:checked + label::before, .form input[type='checkbox']:not(:checked) + label::before, .form input[type='radio']:checked + label::before, .form input[type='radio']:not(:checked) + label::before { content:' '; display:inline-block; width: 20px; height:20px; position: relative; top: 4px; border: 1px solid #bbb; background: white; margin-right: 10px; } .form input[type=radio]:checked + label::before, .form input[type=radio]:not(:checked) + label::before { border-radius: 30px; } .form input[type='checkbox']:hover + label::before, .form .form input[type='radio']:hover + label::before { background:#ddd; box-shadow: inset 0 0 0 5px white; } .form input[type='checkbox']:checked + label::before, .form input[type='radio']:checked + label::before { background:black; box-shadow: inset 0 0 0 5px white; border: 1px solid #bbb; } .news__date { font-size: 2em; line-height: 1.3em; margin-bottom: 1.3em; } .news__nav ul { margin: 0; padding: 0; list-style: none; font-size: 1em; border-bottom: 10px solid #a3a3a3; margin-top: -0.5em; } .news__nav ul li { display: inline-block; } .news__nav ul li a { display: inline-block; margin-bottom: 2px; margin-right: 2px; background: rgb(237,127,0); color: #fff; padding: 15px 15px 7px 15px; } .news__nav ul li.current { background: #a3a3a3; padding: 15px 15px 7px 15px; color: #fff; padding-bottom: 9px; margin-right: 2px; } .news__nav ul.bottom { border: none; margin: 5em 0; border-top: 4px solid #a3a3a3; } .news__nav ul.bottom li.current { padding: 15px 15px 7px 15px; color: #fff; padding-top: 17px; } .news__entry { margin: 4em 0; } .cols__one .text__block .news__entry h2 { font-size: 1.4em; margin-left: 0; text-align: left; float: none; width: auto; } .cols__one .text__block .news__entry h2 + p { margin-top: 1em; } .news__entry .news__meta { float: left; width: 340px; text-align: right; margin-left: -400px; } .news__meta .news__date { font-size: 0.8em; line-height: 2em; font-weight: bold; background: url("/static/images/date-square.gif") left center no-repeat; padding-left: 1.5em; display: inline-block; margin-bottom: 0; } .news__meta .news__pictos { margin-top: 0.9em; } .news__meta .news__pictos img { vertical-align: middle; margin-left: 0.5em; } .news__img { float: left; margin-right: 40px; margin-bottom: 10px; } .news__text { margin-left: 220px; min-height: 155px; margin-bottom: 25px; } .ems { color: rgb(237,127,0); } .inside { color: #000; } a:hover .inside { color: rgb(237,127,0); } .blogindex__date__wrap { display: inline-block; margin-bottom: 2em; background: #fd7800; padding: 0; } .blogindex__date { color: #fff; font-size: 2em; line-height: 1.3em; margin: 0; margin-right: 3px; border-top: 4px solid #fff; border-bottom: 4px solid #fff; padding: 12px 12px 6px 40px; } .blogindex__date:after { content: " "; position: absolute; top: 0; left: -25px; background: #fff; width: 44px; height: 44px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .anch100 { position: absolute; top: -100px; } .cal__entry { line-height: 1.3; margin-bottom: 6em; clear: both; } .cal__entry .text__block { border-left: 1px solid #c4c4c4; padding: 0.5em 1em; box-sizing: border-box; } .cal__date { text-align: left; font-size: 2em; padding: 0.5em 0; } .cal__label { text-transform: uppercase; } .cal__headline { font-size: 1.5em; margin: 0.8em 0 0.4em 0; font-weight: bold; } .cal__location { font-size: 1.2em; margin: 0.4em 0 1.2em 0; } .cal__link a { padding: 1em 0; text-decoration: none; display: inline-block; } .cal__link a:before { content: ""; font-family: fas; height: 1.8em; width: 1.8em; font-size: 0.8em; line-height: 1.8em; text-align: center; color: #fff; background: rgb(237,127,0); border-radius: 0.9em; margin-right: 0.5em; display: inline-block; } .col12 { width: 740px; float: left; } .col12 section:first-child { padding-top: 0; } .col12 .box__head { text-align: left; position: relative; left: auto; width: auto; } .col3 { width: 340px; float: right; } .text__block h2 { font-size: 1.5em; line-height: 1.2em; margin-top: 0.7em; } .extend__de:after { content: "… mehr"; display: block; position: absolute; bottom: -1.6em; left: 0; font-size: 0.7em; } .extend__en:after { content: "… more"; display: block; position: absolute; bottom: -1.6em; left: 0; font-size: 0.7em; } .extend__fr:after { content: "… plus"; display: block; position: absolute; bottom: -1.6em; left: 0; font-size: 0.7em; } .extend__es:after { content: "… más"; display: block; position: absolute; bottom: -1.6em; left: 0; font-size: 0.7em; } .withpic .extend__de:after, .withpic .extend__en:after, .withpic .extend__fr:after, .withpic .extend__es:after { left: 220px; } .elastic-video { position: relative; padding-bottom: 55%; padding-top: 15px; height: 0; overflow: hidden; margin-bottom: -0.5em; } .elastic-video-3-4 { position: relative; padding-bottom: 73%; padding-top: 15px; height: 0; overflow: hidden; margin-bottom: -0.5em; } .elastic-video iframe, .elastic-video video { position: absolute; top: 0; left: 0; width: 100%!important; height: 100%!important; } .elastic-video-3-4 iframe, .elastic-video-3-4 video { position: absolute; top: 0; left: 0; width: 100%!important; height: 100%!important; } .videopic:after { content: " "; top: 0; left: 0; position: absolute; width: 100%; height: 100%; background: url("/static/images/play.png") center center no-repeat; } #references { background: #e9e7e5; padding-top: 30px; } #references h2 { margin-top: 0; } .ref__box { display: inline-block; margin: 0 7px 10px 0; } .ref__box a { display: block; width: 220px; height: 140px; text-align: center; line-height: 140px; background: rgba(255,255,255,0.23); } .ref__box a:hover { background: rgba(255,255,255,1); } .ref__box a * { vertical-align: middle; } .better { background: #f1f9fc!important; } .better .ref__box a { background: rgba(255,255,255,0.36); } .better .ref__box a:hover { background: rgba(255,255,255,1); } .zit__header { margin-top: -200px; text-align: left; margin-bottom: 30px; } .zit__row { } .zit__over { display: inline-block; width: 340px; padding: 20px; background: rgba(255,255,255,0.8); margin-left: 17px; font-size: 2em; line-height: 1.3em; vertical-align: top; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } .zit__over:first-child { margin-left: 0px; } .zit__autor { font-size: 0.9em; font-style: italic; margin-top: 0.7em; } .zit__anf, .zit__end { font-size: 1.5em; color: rgb(237,127,0); line-height: 0.8em; } .zit__header h1 { font-size: 3.4em; font-weight: bold; margin-top: 0; margin-bottom: 0.8em; } .zit__header h2 { font-size: 3.0em; font-weight: normal; margin-top: -0.6em; } .Bild-links { float: left; margin: 0 20px 12px 0; } .Bild-rechts { float: right; margin: 0 0 12px 20px; } #schaubild { width: 1180px; margin: auto; margin-top: 25px; } #schaubildsingle { width: 1180px; margin: auto; } .vkpart { display: none; position: absolute; } #overlay { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 808px; background: rgba(255,255,255,0.8); text-align: center; } .overlay__text { display: none; background: #fff; margin: auto; text-align: left; margin-top: 150px; width: 700px; max-height: 500px; overflow-y: scroll; border: 2px solid rgb(237,127,0); padding: 24px; font-size: 2em; line-height: 1.3em; } .overlay__text h2 { font-size: 1.5em; font-weight: normal; } #overlay .close { position: absolute; top: 150px; right: calc(50% - 350px); padding: 5px 10px; color: #fff; background: rgb(237,127,0); cursor: pointer; font-size: 2em; line-height: 1.3em; } .winclose { position: absolute; top: 0; right: 0; padding: 5px 10px; color: #fff; background: rgb(237,127,0); cursor: pointer; font-size: 2em; line-height: 1.3em; } a.linkalstext { color: #000; text-decoration: none; cursor: text; } a#skip2m { position: absolute; left: -999px; z-index: 10000; } a#skip2m:focus { left: 40px; } .moth { text-transform: uppercase; } .Seitenindex { background: #f7f7f7; padding: 0.5em 1em; margin: 0; list-style: none; } .Seitenindex li { margin: 0.4em 0; } .Seitenindex li:first-child { text-transform: uppercase; font-size: 1.11em; } #messe { position: absolute; width: auto; display: inline-block; background: #fff; top: 450px; left: 30px; border: 3px solid #009ee0; border-radius: 15px; padding: 0 20px; font-size: 1.6em; box-shadow: 3px 3px 8px #000; line-height: 1.3em; -moz-transform: rotate(-10deg); -ms-transform: rotate(-10deg); -o-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } .curlang { position: relative; cursor: pointer; display: block; text-align: left; width: 75px; box-sizing: border-box; padding: 9px 13px 5px 13px; background: url("/static/images/arrow-select.png") 48px center no-repeat;} .actlang { background: rgba(255,255,255,0.8) url("/static/images/arrow-select-out.png") 48px center no-repeat; } #langselect { position: absolute; display: none; top: 34px; left: 0; margin: 0; padding: 0; list-style: none; text-align: left; padding-top: 1px; } #langselect li { width: 75px; background: rgba(255,255,255,0.8); box-sizing: border-box; margin-bottom: 1px; } #langselect li a { display: block; color: rgb(237,127,0); padding: 9px 13px 5px 13px; } #langselect li a:hover { background: rgb(237,127,0); color: #fff; } #nav__main ul#langlist { position: relative; display: none; margin: 0 0 40px 0; padding: 0 20px; list-style: none; text-align: left; text-transform: uppercase; } #nav__main ul#langlist li { display: inline-block; } #nav__main ul#langlist li a { display: block; color: rgb(237,127,0); padding: 9px 13px 5px 13px; } #nav__main ul#langlist li a:hover { background: rgb(237,127,0); color: #fff; } .pagination { margin: 2em 0; font-size: 1.8em; margin-left: 420px; } .linkview { display: inline-block; color: #fff; text-align: center; background: rgb(237,127,0); line-height: 36px; width: 36px; margin: 0 3px 6px 0; } span.linkview { color: #fff; background: #ccc; } .pagination a:hover { text-decoration: underline; } .pleft { background: rgb(237,127,0) url("/static/images/page-left.png") center no-repeat; } .pright { background: rgb(237,127,0) url("/static/images/page-right.png") center no-repeat; } #facts { padding: 8em 0 3em 0; } #facts:before { content: " "; position: absolute; left: 50%; width: 3em; height: 3em; top: -1.5em; background: #e9e7e5; margin-left: -2em; transform: rotate(45deg); } #facts__head { text-align: center; margin-bottom: 3em; } .facts__row { display: flex; margin: 2em 0; justify-content: center; } .facts__entry { padding: 1.8em 1.2em; border-right: 1px solid #e9e7e5; text-align: center; min-width: 25%; } .facts__entry:last-child { border: none; } .facts__bam { font-size: 4.8em; text-transform: uppercase; } .facts__bamlong { font-size: 3.6em; text-transform: uppercase; } .facts__cat { font-size: 2.2em; text-transform: uppercase; margin-top: 0.8em; } .facts__claim { font-size: 1.8em; margin-top: 1em; } .facts__claim .default { width: 100%; } table.default { margin: auto; } #keyservice { background: #e9e7e5; padding: 3em 0; margin: 0 calc((100vw - 1140px) / -2); } #keyservice .env { display: block; text-align: center; font-size: 3em; line-height: 1.1; } #keyservice .envtext { display: block; font-size: 2em; line-height: 1.3; } #keyservice #opener { display: block; font-size: 2.4em; margin-top: 1.2em; text-align: center; } #keyservice .ic-double:before { content: ""; font-family: fas; display: block; margin-bottom: 1.5em; } #keyservice .ic-rocket:before { content: ""; font-family: fas; display: block; margin-bottom: 1.5em; } #keyservice .ic-modules:before { content: ""; font-family: fas; display: block; margin-bottom: 1.5em; } #doors { display: flex; margin: 7em 0; } #doors #usecases { width: 50%; } #doors #usecases .usecases__entry { width: 85%; margin-bottom: 40px; } #doors #usecases .usecases__entry .usecases__image { display: block; float: left; margin-right: 40px; } #doors #usecases .usecases__entry .usecases__text { margin-left: 190px; } #doors #usecases .usecases__entry .usecases__label { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: rgb(237,127,0); color: #fff; text-align: center; padding-top: 45%; box-sizing: border-box; font-size: 1.8em; text-transform: uppercase; } #doors #usecases .usecases__entry .usecases__image a { opacity: 1; transition: opacity 0.3s; } #doors #usecases .usecases__entry .usecases__image a:hover { opacity: 0.2; } #doors #usecases .usecases__entry h2 { font-weight: bold; font-size: 2.1em; margin: 0 0 1.2em 0; text-transform: uppercase; } #doors #usecases .usecases__entry span { font-size: 1.8em; } #doors #news__block { border: 2px solid #e9e7e5; padding: 3em; width: 50%; box-sizing: border-box; margin-top: -5em; } #doors #news__block .news__date { font-size: 1.8em; margin-bottom: 0; } #doors #news__block .news__date:before { content: " "; display: inline-block; width: 0.5em; height: 0.5em; margin-right: 0.5em; margin-bottom: 0.1em; background: #a3a3a3; } #doors #news__block h2 { font-weight: normal; font-size: 2em; margin-top: 0.2em; } #doors #news__block .cal__meta { font-size: 1.8em; } #doors #news__block .cal__text { font-size: 1.6em; } #doors #news__block .cal__title { font-size: 2em; font-weight: bold; line-height: 1.5em; } a.button { border: none; background: #fd7800; font-size: 1.8em; padding: 0.2em 0.5em; color: #fff; position: absolute; top: 0; right: 0; } a.news:before { content: " "; font-family: far; } a.dates:before { content: " "; font-family: far; } .center { text-align: center; } .hide { display: none; } .usecase { margin: 2em 0; background: #f4f5f6; } .usecase__text { padding: 0 1em 2em 1em; } .usecase__link { padding: 0.8em; font-size: 1.1em; } .usecase__link a::before { content: " "; font-family: fas; } .usecase__text .extend__de:after, .usecase__text .extend__en:after, .usecase__text .extend__fr:after, .usecase__text .extend__es:after { bottom: 1em; left: 1em; font-size: 1em; font-weight: normal; font-size: 0.625em; } .usecase__text h4 br { display: none; } .usecase__text h3 { font-size: 1em; } .usecase__text h3.top { font-size: 1.6em; } div[style="z-index: 1000;text-align:right;font-size:10px;color:grey;display:block !important;"] { font-size: 0!important; line-height: 0; height: 0; } .over__label { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: rgb(237,127,0); color: #fff; text-align: center; padding-top: 28%; box-sizing: border-box; font-size: 1.8em; text-transform: uppercase; } .over__box { display: inline-block; } .over__box a { opacity: 1; transition: opacity 0.3s; } .over__box a:hover { opacity: 0.2; } .linkedincom { display: inline-block; margin-right: 1em; } .linkedincom::before { content: " "; font-family: fab; } .instacom::before { content: " "; font-family: fab; } .box__holder { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 0 2em 0; } .box__container { width: 32%; padding: 0.7em; margin-top: 1em; box-sizing: border-box; border: 1px solid #000; font-size: 0.875em; line-height: 1.3em; } .box__container ul { margin-left: 0; padding-left: 0.8em; margin-bottom: 0 } .sub__holder { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0; } .sub__container { width: 48%; margin-bottom: 2em; box-sizing: border-box; } .sub__container:nth-last-child(1):nth-child(2n+1) { width: 100%; margin-bottom: 0; } .sub__container ul { margin-left: 0; padding-left: 0.8em; margin-bottom: 0 } .sub__link { font-size: 1.2em; line-height: 1.2; } .sub__link a:before { content: " "; font-family: fas } .rsTab:before { content: ""; position: absolute; height: 120px; width: 1.5px; background: rgba(112,112,112,0.5); top: -140px; left: 61px; } ul.tab__nav { list-style: none; margin: 0; padding: 0; display: flex; border-bottom: 1px solid #000; padding-left: 2em; } ul.tab__nav li { padding: 12px 12px 0 12px; background: #F4F5F6; margin-top: 9px; border-bottom: 4px solid #fff; margin-right: 4px; } ul.tab__nav li.isactive { padding: 20px 20px 0 20px; background: #fff; border: 1px solid #000; border-bottom: 1px solid #fff; margin-bottom: -1px; margin-top: 0; } .tab__vpp img, .tab__grid img { height: 23px; width: auto; } .tab__emsys img { height: 45px; width: auto; } .acc__block { border: 1px solid #bbb; padding: 1px 0; margin-bottom: 1em; } .tab__card { margin-bottom: 4em; } .tab__card h2 { margin-top: 2em; } .future h2 { margin-top: 2em; } .tab__card h3 { font-size: 2em; cursor: pointer; padding: 1em; margin: 0; } .tab__card h3:after { content: ""; font-family: fas; position: absolute; right: 1em; color: #F29303; } .tab__card .prehint { font-weight: normal; } .joblist { padding: 0 2em; } .inner_elem { padding: 0 2em 2em 2em; } .ishidden { border-color: #000; } .ishidden h3:after { content: ""; font-family: fas; } .ishidden .joblist { display: none; } .ishidden .inner_elem { display: none; } .isinactive { cursor: pointer; } .roundview__container { display: flex; flex-wrap: wrap; gap: 20px; margin: 50px 0; } .roundview__entry { width: calc(20% - 16px); } .roundview__entry img { width: 100%; height: auto; } .roundview__entry a:after { position: absolute; top: 0; left: 0; display: block; content: ""; width: 100%; height: 100%; background: url("/static/images/icon-360.svg") center no-repeat; background-size: 40%; } .roundview__entry { transition: transform .3s; } .roundview__entry:hover { transform: scale(1.1); box-shadow: 0 0 1em 0 rgba(0,0,0,0.24); } .metrowall__container { display: grid; grid-gap: 20px; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 230px; } .metrowall__entry { object-fit: cover; } .metrowall__entry img { object-fit: cover; max-height: 100%; width: 100%; } .metrowall__entry:nth-child(1){ grid-column: span 2; } .metrowall__entry:nth-child(9) { grid-column: span 2; } .metrowall__entry:nth-child(11) { grid-column: span 4; } .metrowall__entry:nth-child(14) { grid-column: span 2; } .metrowall__entry:nth-child(16) { grid-column: span 2; } .metrowall__entry:nth-child(20) { grid-column: span 2; } .metrowall__entry { transition: transform .3s; } .metrowall__entry:hover { transform: scale(1.025); box-shadow: 0 0 1em 0 rgba(0,0,0,0.24); } .text__news .date { font-size: 0.875em; } .text__news .date:before { content: " "; display: inline-block; width: 0.5em; height: 0.5em; margin-right: 0.5em; margin-bottom: 0.1em; background: #a3a3a3; } .text__news__all { margin-top: 2em; } .text__news__all a:before { content: " "; font-family: fas; } .key__head__container { position: absolute; bottom: -40px; left: calc(50vw - 570px); z-index: 1; text-align: left; max-width: 1140px; } .key__head1 { color: #fff; font-size: 4.8em; line-height: 1.2; font-weight: normal; } .key__head2 { display: inline-block; padding: 30px; background: #fff; margin: 0 0 0 -30px; font-size: 3.6em; line-height: 1.2; font-weight: normal; } .key__headgrad:after { content: " "; position: absolute; left: 0; bottom: 0; height: 444px; width: 100%; background: linear-gradient(0deg, rgba(0,0,0,0.36) 0%, rgba(0,0,0,0) 100%); } @media screen and (max-width:1279px) { body, html { overflow-x: hidden; } #logo { left: calc(26px + 50% - 480px); } .header__container__start #logo { left: calc(26px + 50% - 480px + 50px); } .header__container__start #logo__vpp { left: calc(26px + 50% - 480px + 40px + 185px + 70px); } .header__container__start #logo__grid { left: calc(26px + 50% - 480px + 40px + 185px + 70px + 155px); } .infoBlockLeftBlack { width: 960px; margin-left: calc(50% - 960px / 2); } #nav__main { font-size: 1.8em; } #nav__main .nav__col { width: 190px; } header nav { right: calc(23px + 50% - 480px); } .claim { font-size: 4.2em; } .wrapper { width: 960px; margin: auto; } .header__container .key { width: auto; height: 267px; margin-left: auto; margin-right: auto; margin-left: -640px; padding-left: 50%; } .header__container .key__intropic { width: auto; height: 467px; margin-left: auto; margin-right: auto; margin-left: -640px; padding-left: 50%; } .background { background-size: auto; } .header__container__ref { background-size: 100% auto; } .cols__one .head { float: none; text-align: left; width: auto; } .cols__one .text__block { float: none; width: auto; } .cols__one section.notes, .cols__one section.topline { float: none; width: auto; } .cols__one .text__block h2 { float: none; width: auto; text-align: left; margin: 1.5em auto auto; } .cols__one .text__block h2 + p { margin-top: 1em; } footer .col { font-size: 1.6em; } .contentSlider { width: 720px; } .teaser__box { width: 280px; margin-right: 38px; margin-bottom: 38px; font-size: 0.8em; } .teaser__box img { max-width: 280px; height: auto; } .teaser__indexlink { margin-left: 320px; } .leftcol, .rightcol { width: 440px; } .cols__one .text__block .news__entry h2 { margin: 0.5em 0; } .news__entry .news__meta { float: none; width: auto; text-align: left; margin-left: 0; } .news__meta .news__pictos { margin-top: 0; display: inline-block; margin-left: 0.5em; } .zit__over { width: 267px; font-size: 1.8em; } #schaubild { margin-left: -110px; } .box__head { font-size: 3em; text-align: left; position: relative; margin-top: 20px; left: auto; width: auto; } .blogindex__date { margin: 0; margin-left: 3px; padding: 12px 40px 6px 12px; } .blogindex__date:after { left: auto; right: -25px; } .col12 { width: 598px; float: left; } .col3 { width: 280px; float: right; } .blog__box img, .mag__box img { max-width: 100%; height: auto; } .videopic:after { background-size: 60px; } .pagination { margin-left: 20px; } .facts__bam { font-size: 4.2em; } .facts__bamlong { font-size: 3.2em; } .facts__cat { font-size: 2em; } .facts__claim { font-size: 1.5em; } #keyservice { margin: 0 calc((100vw - 920px) / -2); } #doors #usecases .usecases__entry { width: 95%; margin-bottom: 30px; } #doors #usecases .usecases__entry .usecases__image { margin-right: 30px; } #doors #usecases .usecases__entry .usecases__text { margin-left: 180px; } .examcol h2 { float: none; width: auto; text-align: left; } .usecase { margin: 2em 0 4em 0; } .usecase:last-child { margin: 2em 0; } .cols__one .index__wrapper { width: 660px; } .cols__one .index__wrapper h2 { width: 280px; text-align: left; margin-left: -340px; } .examicon { text-align: left; } .key__head__container { left: calc(50vw - 460px); max-width: 920px; } .key__head1 { font-size: 4.2em; } .key__head2 { font-size: 3em; } } @media screen and (max-width:1023px) { #logo { left: calc(26px + 50% - 375px); } .header__container__start #logo__emsys { position: absolute; bottom: 32px; left: calc(26px + 50% - 375px); display: block; width: 100px; height: auto; } .header__container__start #logo, .header__container__start #logo__vpp, .header__container__start #logo__grid { display: none; } .rsTab::before { display: none; } .infoBlockLeftBlack { width: 100%; margin-left: auto; text-align: center; } header nav { right: calc(23px + 50% - 375px); } .wrapper { width: 750px; margin: auto; } #nav__main { font-size: 1.6em; } #nav__main .nav__col { width: 160px; margin: 10px; } #nav__main .nav__row { width: 710px; } .contentSlider { width: 510px; } .cols__one .Bildunterschrift { max-width: 210px; } .teaser__box { height: 34em; width: 340px; margin-right: 28px; font-size: 1em; } .teaser__box img { max-width: 340px; height: auto; } .teaser__indexlink { margin-left: 0; } .leftcol, .rightcol { width: 100%; float: none; } .zit__header { margin-top: -50px; } .zit__over { width: auto; font-size: 2em; margin-top: 30px; margin-left: 0; } .zit__over:first-child { margin-top: 0; } .col12 { width: 710px; float: none; } .col3 { width: 710px; float: none; display: flex; flex-wrap: wrap; justify-content: space-between; } .col__head { width: 100%; } .blog__box, .mag__box { width: 340px; } .col3__inner { padding: 20px; } .videopic:after { background-size: auto; } .facts__row { flex-wrap: wrap; border-top: 1px solid #e9e7e5; } .facts__entry { width: 50%; box-sizing: border-box; border: none; } #keyservice { margin: 0 calc((100vw - 710px) / -2); } #doors { display: block; margin-top: 3em; } #doors #usecases { width: 100%; } #doors #news__block { width: 100%; margin-top: 0; } #doors #usecases .usecases__entry { margin-bottom: 40px; } #doors #usecases .usecases__entry .usecases__image { margin-right: 40px; } #doors #usecases .usecases__entry .usecases__text { margin-left: 190px; } .cols__one .index__wrapper { width: auto; } .cols__one .index__wrapper h2 { width: 100%; margin-left: 0; float: none; } .examicon { text-align: right; margin-top: -0.8em; } .header__container__start .rsTabs { text-align: center; padding-left: 0; } #efre__box { position: relative; display: inline-block; top: auto; right: auto; background: rgba(0,0,0,0.8); margin-top: 3em; } #bc { font-size: 1.5em; margin-bottom: 2em; padding: 0 10px; line-height: 1.5em; } .metrowall__container { grid-gap: 10px; grid-auto-rows: 160px; } .key__head__container { left: calc(50vw - 355px); max-width: 710px; } .key__head1 { font-size: 3.8em; } .key__head2 { font-size: 2.4em; } .blog__pic { float: none; margin-right: 0; } } @media screen and (max-width:767px) { #logo { left: 26px; } .header__container__start #logo__emsys { left: 26px; bottom: 36px; } header nav { right: 23px; } .wrapper { width: auto; margin: auto; } #nav__main { height: auto; } #nav__main .nav__col { width: auto; display: block; padding: 0 20px; margin: 0; margin-bottom: 40px; } #nav__main .nav__row { width: auto; border: none; margin: 30px 20px 40px 20px; line-height: 1.8em; } #nav__main .nav__row li a { padding: 10px; } header nav .label { display: none; } footer .left, footer .right { float: none; text-align: left; } footer .col { display: block; padding: 20px; width: auto; } .infoBlock img { max-width: 90%; height: auto; } .contentSlider { width: 70%; margin: 0 15%; } .cols__two .text__block { column-count: 1; -moz-column-count: 1; -webkit-column-count: 1; } .header__container__start header { height: 120px; } .header__container__start header nav { top: 50px; } .infoBlockLeftBlack { top: 150px; } .cols__one .Bildunterschrift { max-width: 100%; margin-left: 0; } .cols__one .MitBeschriftung { max-width: 100%; } .teaser__box { height: auto; width: auto; margin-right: 0; font-size: 1em; } .teaser__box img { max-width: 100%; height: auto; } .index__wrapper { margin: 0; } .claim { font-size: 3.6em; } /* .mobile { display: block!important; } */ .zit__header { margin-left: 20px; margin-right: 20px; } .col12, .col3 { width: auto; } .blog__box, .mag__box { width: calc(50% - 15px); } #messe { position: relative; width: calc(90%-40px); margin: 0 5% 5% 5%; display: block; top: 0!important; left: 0!important; border: 3px solid #009ee0; border-radius: 15px; padding: 0 20px; font-size: 1.6em; box-shadow: none; -moz-transform: none; -ms-transform: none; -o-transform: none; -webkit-transform: none; transform: none; } #keyservice { margin: 0 -20px; padding: 6em 20px 3em 20px; } .examicon { margin-right: 0; } #bc .tabindex { display: inline; margin-top: 0; margin-bottom: 0; } #bc .tabindex > li { display: none } #bc .tabindex > li.current { display: inline-block; line-height: 1.5em; margin-top: 0; } #bc .tabindex > li.current > a { display: none; } #bc .tabindex ul { position: relative; top: auto; left: auto; display: inline; } #bc .tabindex .parent { display: inline; } .headgrad::after { display: none; } .notOnMobile { display: none; } .box__container { width: 48.5%; } .metrowall__container { grid-template-columns: 1fr 1fr; } .metrowall__entry:nth-child(4){ grid-column: span 2; grid-row: span 2; } .metrowall__entry:nth-child(9){ grid-column: span 2; grid-row: span 2; } .metrowall__entry:nth-child(11) { grid-column: span 1; } .metrowall__entry:nth-child(12) { grid-column: span 2; } .metrowall__entry:nth-child(14) { grid-column: span 1; } .metrowall__entry:nth-child(15) { grid-column: span 2; } .metrowall__entry:nth-child(16) { grid-column: span 1; } .roundview__entry { width: 100%; } .key__head__container { left: 20px; max-width: calc(100vw - 40px); } .key__head1 { font-size: 3.8em; } .key__head2 { font-size: 2.4em; padding: 20px; margin-left: -20px; } .sub__container { width: 100%; } .sub__link { font-size: 1em; } .form.col2 input[type=text] { width: 100%; } .form.col2 input[type=text]:nth-of-type(odd) { margin-right: 0; } .form.col2 .logger__wrapper { width: 100%; display: block; } .form.col2 .logger__wrapper:nth-of-type(odd) { margin-right: 0; } .form.col2 input[type=text] { width: 100%; } } @media screen and (max-width:539px) { .header__container__start #logo__emsys { bottom: 20px; } #nav__main { padding-top: 100px; } #nav__main .nav__row { flex-wrap: wrap; } #nav__main .nav__row li { width: auto; } #nav__main .nav__row li { width: calc(50% - 2px); } footer .col img { max-width: 100%; height: auto; } #logo { max-width: 200px; height: auto; } .header__container { background-size: 200%; } .header__container .key { height: 160px; margin-left: -380px; } .header__container .key__intropic { height: 280px; margin-left: -380px; } .header__container__start #logo { max-width: 200px; height: auto; } .header__container__start { min-height: 360px; background-position: center 93px; } .header__container__start header { height: 80px!important; } .header__container__start header nav { top: 20px!important; } .claim { font-size: 2.4em; } .claim br { display: inline; clear: none; content: ' '; } .claim br::after { content: ' '; } header { height: 80px; } header nav { top: 20px; } header nav .language { display: none; } #nav__main ul#langlist { display: block; } .header__container .key { margin-top: 80px; } .header__container .key__intropic { margin-top: 80px; } header nav #navicon { margin-right:0; border: none; } .contentSlider { width: 90%; margin: 0 5%; } #slider__prev, #slider__next { display: none; } section.boxed { margin-top: 1em; } .box__head { position: relative; margin-top: 0; margin-bottom: 0.5em; } .facts__row { border-top: none} .facts__entry { width: 100%; border-top: 1px solid #e9e7e5; border-bottom: 1px solid #e9e7e5; margin-bottom: -1px; } #doors { flex-wrap: wrap; } #doors #usecases { width: auto; } #doors #news__block { width: auto; } #doors #usecases .usecases__entry { margin-bottom: 30px; } #doors #usecases .usecases__entry .usecases__image { margin-right: 20px; } #doors #usecases .usecases__entry .usecases__image img { width: 100px; height: auto; } #doors #usecases .usecases__entry .usecases__text { margin-left: 120px; } #doors #usecases .usecases__entry h2 { margin-bottom: 0.5em; } .news__img { margin-right: 20px; } .news__img img { max-width: 120px; height: auto; } .news__text { margin-left: 0px; } .withpic .extend__de:after, .withpic .extend__en:after, .withpic .extend__fr:after, .withpic .extend__es:after { left: 0px; } .box__container { width: 100%; } .tab__vpp img, .tab__grid img, .tab__emsys img { max-width: 100%; height: auto; } .blog__box, .mag__box { width: 100%; } .blog__box img, .mag__box img { width: 100%; } ul.tab__nav { padding-left: 0; } .key__head1 { font-size: 2.8em; } .key__head2 { font-size: 2.2em; } .form.col2 legend { font-size: 1em; } .form.col2 button.switch { width: 100%; } .form.col2 button.switch:nth-of-type(odd) { margin-right: 0; margin-bottom: 0.5em; } } @media screen and (max-width:360px) { #nav__main { padding-top: 100px; } #nav__main .nav__row li { width: 100%; } } /* @media screen and (max-width:540px) and (min-height:550px) { .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 550px !important; } .infoBlockLeftBlack { top: 120px; } .rsLinklist { margin-top: 0; } .mobile { margin-top: 270px; } } @media screen and (max-width:800px) and (min-height:860px) { .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 750px !important; } .infoBlockLeftBlack { top: 180px; } .rsLinklist { margin-top: 60px; } .mobile { margin-top: 400px; } } @media screen and (max-width:800px) and (min-height:960px) { .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 835px !important; } .mobile { margin-top: 500px; } } */ @media screen and (max-height:1024px) { /* .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 900px !important; } */ } @media screen and (max-height:768px) { .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 605px !important; } .infoBlockLeftBlack { top: 100px; } .claim { margin-top: 190px; } .header__container__start header { height: 110px; } .header__container__start header nav { top: 35px; } #messe { top: 280px; } } @media screen and (max-width:539px) and (max-height:670px) { .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 520px !important; } #full-width-slider:before { height: 520px; } .claim { margin-top: 160px; } .header__container__start header nav { top: 20px; } .mobile { margin-top: 320px; } .infoBlockLeftBlack { top: 200px!important; } } @media screen and (max-width:539px) and (max-height:580px) { .heroSlider .rsOverflow, .royalSlider.heroSlider { height: 470px !important; } #full-width-slider:before { height: 470px; } .claim { margin-top: 110px; } }