/* moved by compressor */ @charset "UTF-8"; /* specific page styles for extension "tx_cssstyledcontent" */ .csc-textpic-intext-right-nowrap .csc-textpic-text { margin-right: 160px; } .csc-textpic-intext-left-nowrap .csc-textpic-text { margin-left: 160px; } .csc-textpic-intext-left-nowrap-180 .csc-textpic-text { margin-left: 180px; } .femanager_flashmessages>div{background-position:10px 12px;background-repeat:no-repeat;margin-bottom:4px;padding:12px 12px 12px 36px}.femanager_flashmessages>.message-error{background-color:#f6d3cf;background-image:url('../../typo3/sysext/t3skin/icons/gfx/error.png');border:1px solid #d66c68;color:#aa0225}.femanager_flashmessages>.message-warning{background-color:#fbf6de;background-image:url('../../typo3/sysext/t3skin/icons/gfx/warning.png');border:1px solid #b1905c;color:#9e7d4a}.femanager_flashmessages>.message-ok{background-color:#cdeaca;background-image:url('../../typo3/sysext/t3skin/icons/gfx/ok.png');border:1px solid #58b548;color:#3b7826}.femanager_flashmessages>.message-information{background-color:#eaf7ff;background-image:url('../../typo3/sysext/t3skin/icons/gfx/information.png');border:1px solid #c5dbe6;color:#4c73a1}.femanager_flashmessages>.message-notice{background-color:#f6f7fa;background-image:url('../../typo3/sysext/t3skin/icons/gfx/notice.png');border:1px solid #c2cbcf;color:#444}.femanager_note{background-position:10px 12px;background-repeat:no-repeat;margin-bottom:4px;padding:12px 12px 12px 36px;background-color:#f6f7fa;background-image:url('../../typo3/sysext/t3skin/icons/gfx/notice.png');border:1px solid #c2cbcf;color:#444;list-style-type:none;margin-left:0}.femanager_error{background-position:10px 12px;background-repeat:no-repeat;margin-bottom:4px;padding:12px 12px 12px 36px;background-color:#f6d3cf;background-image:url('../../typo3/sysext/t3skin/icons/gfx/error.png');border:1px solid #d66c68;color:#aa0225;list-style-type:none;margin-left:0}  @font-face { font-family: "TheSansRegular"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_B4_500_.eot"); } @font-face { font-family: "TheSansRegular"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_B4_500_.woff") format("woff"); } @font-face { font-family: "TheSansBold"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_LP_7_.eot"); } @font-face { font-family: "TheSansBold"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_LP_7_.woff") format("woff"); } @font-face { font-family: "TheSansExtraBold"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_800_.eot"); } @font-face { font-family: "TheSansExtraBold"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_800_.woff") format("woff"); } @font-face { font-family: "TheSansItalic"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/Ista_TheSans_5i.eot"); } @font-face { font-family: "TheSansItalic"; src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/Ista_TheSans_5i.woff") format("woff"); } @font-face { font-family: 'icomoon'; src: url("/fileadmin/twt_customer/base/system/templates/fonts/icomoon.eot"); } @font-face { font-family: 'icomoon'; src: url(data:application/x-font-ttf;charset=utf-8;base64,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) format("truetype"), url(data:application/font-woff;charset=utf-8;base64,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) format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'VideoJS'; src: url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.eot"); src: url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.eot?#iefix") format("embedded-opentype"), url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.woff") format("woff"), url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.ttf") format("truetype"), url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.svg#icomoon") format("svg"); font-weight: normal; font-style: normal; } .icon, .fancybox-inner .checked li:before, .content button:before, .content .buttonlink:before, .content .formular .form-input-tsr input:before, .formular .form-input-tsr .content input:before, .content .formular .form-input-tb input:before, .formular .form-input-tb .content input:before, .content .formular .form-button button:before, .formular .form-button .content button:before, .fancybox span:before, .userroles .grid-20 .csc .aboveleft-image + .content-wrapper:before, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper:before, .footernavigation a:before, .content .grid-100 .trail li a:after, .content .grid-75 .trail li a:after, .content .grid-100 .trail li.first a, .content .grid-75 .trail li.first a, .accordion dt a:before, .accordion dt.active a:before, .content .grid-75 ul.checked li:before, .content .grid-100 ul.checked li:before, .visual-wrapper .csc ul.checked li:before, .fancybox span, .fancybox-inner .csc .checked li:before, .download-teaser div div a:before, .mail:before, .phone:before, .web:before, .address:before, .fax:before, .content .outer-grid ul.history strong:after, .postfix button:before, .styledSelect:before, .formular .has-success:before, .formular .help-block:before, .form-help-text:after, .form-step li:after, .metanavigation-toggle a:after, .metanavigation-dropdown a:after, li.metanavigation-worldwide > a:before, a.metanavigation-close:before, .metanavigation-layer .grid .grid-50 .metanavigation-login button:after, .metanavigation-layer .grid .grid-50 .buttonlink:after, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:after, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:after, .metanavigation-layer .grid .grid-50 .formular .form-input-tb input:after, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:after, .metanavigation-layer .grid .grid-50 .formular .form-button button:after, .formular .form-button .metanavigation-layer .grid .grid-50 button:after, .visual-switch strong:before, .visual-switch a:before, .visual-buttons a:after, .directsearch button:after, .directsearch .toggle-search:after, .mainnavigation .submenu > li > a:after, .mainnavigation .submenu .submenu .mainnavigation-teaser a:before, .dl-trigger:before, .dl-menu .dl-sub:before, .dl-indentionlevel a:first-child:before, .util-pagination span:before, .util-prev:before, .util-next:before { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-email21:before, .mail:before { content: "\e613"; } .icon-phone16:before, .phone:before { content: "\e614"; } .icon-pin56:before, .address:before { content: "\e615"; } .icon-printer11:before, .fax:before { content: "\e616"; } .icon-error6:before, .formular .form-error .help-block:before, .formular .has-error .help-block:before { content: "\e612"; } .icon-dot_arrow_down:before, .dl-menu .dl-sub:before { content: "\e607"; } .icon-home:before, .content .grid-100 .trail li.first a:before, .content .grid-75 .trail li.first a:before, .web:before, .dl-indentionlevel a:first-child:before { content: "\e611"; } .icon-slider_outline:before, .visual-switch a:before, .util-pagination span:before { content: "\e601"; } .icon-zoom:before, .fancybox span.first:before { content: "\e600"; } .icon-search:before, .fancybox span:before, .directsearch .toggle-search:after, .dl-menuheader .directsearch button:after { content: "\e602"; } .icon-accordion_meta_down:before, .accordion dt a:before, .metanavigation-toggle:not(.active) > a:after, .metanavigation-dropdown:not(.active) > a:after { content: "\e603"; } .icon-slider_left:before, .content .outer-grid ul.history li:nth-child(2n+2) strong:after, .form-help-text:after, .util-prev:before { content: "\e604"; } .icon-slider_link_right:before, .content button:before, .content .buttonlink:before, .content .formular .form-input-tsr input:before, .formular .form-input-tsr .content input:before, .content .formular .form-input-tb input:before, .formular .form-input-tb .content input:before, .content .formular .form-button button:before, .formular .form-button .content button:before, .userroles .grid-20 .csc .aboveleft-image + .content-wrapper:before, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper:before, .footernavigation a:before, .download-teaser div div a:before, .content .outer-grid ul.history li:nth-child(2n+1) strong:after, .form-help-above .form-help-text:after, .form-help-left:after, .form-step li:after, .metanavigation-layer .grid .grid-50 .metanavigation-login button:after, .metanavigation-layer .grid .grid-50 .buttonlink:after, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:after, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:after, .metanavigation-layer .grid .grid-50 .formular .form-input-tb input:after, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:after, .metanavigation-layer .grid .grid-50 .formular .form-button button:after, .formular .form-button .metanavigation-layer .grid .grid-50 button:after, .directsearch button:after, .mainnavigation .submenu .submenu .mainnavigation-teaser a:before, .util-next:before { content: "\e605"; } .icon-accordion_meta_up:before, .accordion dt.active a:before, .metanavigation-toggle.active > a:after, .metanavigation-dropdown.active > a:after { content: "\e606"; } .icon-arrow_open_down:before, .styledSelect:before { content: "\e608"; } .icon-stage_arrow_left:before, .visual-buttons .switch-back:after { content: "\e609"; } .icon-stage_arrow_right:before, .content .grid-100 .trail li a:after, .content .grid-75 .trail li a:after, .postfix button:before, .visual-buttons .switch-forth:after, .mainnavigation .submenu > li > a:after { content: "\e60a"; } .icon-arrow_open_up:before { content: "\e60b"; } .icon-check_list:before, .fancybox-inner .checked li:before, .content .grid-75 ul.checked li:before, .content .grid-100 ul.checked li:before, .visual-wrapper .csc ul.checked li:before, .fancybox-inner .csc .checked li:before, .formular .has-success:before { content: "\e60c"; } .icon-world_meta:before, li.metanavigation-worldwide > a:before { content: "\e60d"; } .icon-mobile_menu:before, .dl-trigger:before { content: "\e60e"; } .icon-mobile_close:before, a.metanavigation-close:before, .dl-active:before { content: "\e60f"; } .icon-slider_dot:before, .visual-switch strong:before, .util-page.active-page span:before, .util-page:hover span:before { content: "\e610"; } html, body { margin: 0; padding: 0; border: 0; outline: 0; } html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; } img { -ms-interpolation-mode: bicubic; } div, span, object, iframe, noscript, h1, h2, h3, h4, h5, h6, p, blockquote, q, br, hr, a, abbr, acronym, address, cite, del, em, i, img, a img, ins, small, strong, b, sub, sup, mark, pre, code, dfn, kbd, samp, tt, var, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; } details, figcaption, summary, nav, header, footer, main, section, aside, article, figure, video, audio, canvas { display: block; margin: 0; padding: 0; border: 0; } video, audio { display: inline-block; } small { font-size: 0.8em; } ins { text-decoration: none; border-bottom: 1px dashed; padding-bottom: 0.1em; } legend { color: #000; } table { border-collapse: collapse; border-spacing: 0; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } sup, sub { vertical-align: baseline; position: relative; top: -0.3em; font-size: 0.8em; } sub { top: 0.3em; } input, textarea, select, button { font-weight: normal; font-family: inherit; font-size: 100%; } button, select { text-transform: none; } textarea { overflow: auto; vertical-align: top; } input[type=submit], input[type=reset], input[type=button], input[type=image], button, select, .pointer { cursor: pointer; -webkit-font-smoothing: antialiased; } button, input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } abbr[title], acronym[title] { cursor: help; } pre, code, kbd, samp { font-family: monospace, sans-serif; white-space: pre-wrap; } /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; -webkit-transform: translateZ(0); } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 0; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-inner .csc { max-width: 750px; margin: 0 auto; } .fancybox-inner ul li { background: url(/fileadmin/twt_customer/base/system/templates/images/bullet.png) 3px 7px no-repeat; padding-left: 1.5em; } .fancybox-inner .checked { list-style-image: none; } .fancybox-inner .checked li { background: none; position: relative; padding-left: 25px; } .fancybox-inner .checked li:before { color: #84b400; position: absolute; left: 0; font-size: 20px; } .fancybox-inner ol li { font-size: 1.5em; line-height: 1.33333; margin: 0 0 0.5em; } .fancybox-inner li li { font-size: 1em; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox-ista-blue_sprite.png"); } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; } #fancybox-loading div { width: 44px; height: 44px; background: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox_loading.gif") center center no-repeat; } .fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url("/fileadmin/twt_customer/base/system/templates/images/fancybox/blank.gif"); /* helps IE */ -webkit-tap-highlight-color: transparent; z-index: 8040; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-prev span { left: 10px; background-position: 0 -36px; } .fancybox-next span { right: 10px; background-position: 0 -72px; } .fancybox-nav:hover span { visibility: visible; } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; } /* Overlay helper */ .fancybox-lock { overflow: hidden !important; width: auto; } .fancybox-lock body { overflow: hidden !important; } .fancybox-lock-test { overflow-y: hidden !important; } .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox_overlay.png"); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; } /* Title helper */ .fancybox-title { visibility: hidden; font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; position: relative; text-shadow: none; z-index: 8050; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 10px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, 0.8); } /*Retina graphics!*/ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox-ista-blue_sprite@2x.png"); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ } #fancybox-loading div { background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox_loading@2x.gif"); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } } #fancybox-thumbs { position: fixed; left: 0; width: 100%; overflow: hidden; z-index: 8050; } #fancybox-thumbs.bottom { bottom: 2px; } #fancybox-thumbs.top { top: 2px; } #fancybox-thumbs ul { position: relative; list-style: none; margin: 0; padding: 0; } #fancybox-thumbs ul li { float: left; padding: 1px; opacity: 0.5; } #fancybox-thumbs ul li.active { opacity: 0.75; padding: 0; border: 1px solid #fff; } #fancybox-thumbs ul li:hover { opacity: 1; } #fancybox-thumbs ul li a { display: block; position: relative; overflow: hidden; border: 1px solid #222; background: #111; outline: none; } #fancybox-thumbs ul li img { display: block; position: relative; border: 0; padding: 0; max-width: none; } #fancybox-buttons { position: fixed; left: 0; width: 100%; z-index: 8050; } #fancybox-buttons.top { top: 10px; } #fancybox-buttons.bottom { bottom: 10px; } #fancybox-buttons ul { display: block; width: 166px; height: 30px; margin: 0 auto; padding: 0; list-style: none; border: 1px solid #111; border-radius: 3px; -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); -moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); background: #323232; background: -moz-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #444444), color-stop(50%, #343434), color-stop(50%, #292929), color-stop(100%, #333333)); background: -webkit-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%); background: -o-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%); background: -ms-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%); background: linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#222222',GradientType=0 ); } #fancybox-buttons ul li { float: left; margin: 0; padding: 0; } #fancybox-buttons a { display: block; width: 30px; height: 30px; text-indent: -9999px; background-color: transparent; background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox_buttons.png"); background-repeat: no-repeat; outline: none; opacity: 0.8; } #fancybox-buttons a:hover { opacity: 1; } #fancybox-buttons a.btnPrev { background-position: 5px 0; } #fancybox-buttons a.btnNext { background-position: -33px 0; border-right: 1px solid #3e3e3e; } #fancybox-buttons a.btnPlay { background-position: 0 -30px; } #fancybox-buttons a.btnPlayOn { background-position: -30px -30px; } #fancybox-buttons a.btnToggle { background-position: 3px -60px; border-left: 1px solid #111; border-right: 1px solid #3e3e3e; width: 35px; } #fancybox-buttons a.btnToggleOn { background-position: -27px -60px; } #fancybox-buttons a.btnClose { border-left: 1px solid #111; width: 35px; background-position: -56px 0px; } #fancybox-buttons a.btnDisabled { opacity: 0.4; cursor: default; } /* dropdown menu */ .dropdown-content { display: block; position: absolute; top: 100%; left: 0; width: 100%; max-height: 0; padding: 0; opacity: 0; background: #fff; z-index: 199; -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); -webkit-transition: opacity 0.6s ease; -moz-transition: opacity 0.6s ease; -ms-transition: opacity 0.6s ease; transition: opacity 0.6s ease; } .dropdown-content.show { max-height: none; opacity: 1; } .dropdown-content nav { padding-bottom: 10px; } .dropdown-content a { display: block; padding: 7px 7px 7px 14px; font-size: 1.4em; color: #0a2864; } .dropdown-content a:link, .dropdown-content a:visited, .dropdown-content a:active { color: #0a2864; } .dropdown-content a:hover { color: #84b400; } @media screen and (max-width: 767px) { .dropdown-content a { padding: 7px 6px; } } /* >> elemente formatieren >> Inhaltsbereiche > Grid > wrapper > innerwrapper > header > content > footer >> Module > metanavigation > logo > mediastage > direktsuche > mainnavigation > sidenavigation > footernavigation(en) > trail > accordion base > glossar > downloads > Produktseite > Teaser > Basis Typo3 Elemente >> helfer */ /* >> elemente */ body { background: #fff; color: #3e3e3e; /* 62.5% = 10px, line-height 1.2 = 120% = 12px */ font: 62.5%/1.2 Arial, Verdana, sans-serif; word-wrap: break-word; } h1 a:link, h1 a:active, h1 a:visited, h2 a:link, h2 a:active, h2 a:visited, h3 a:link, h3 a:active, h3 a:visited, h4 a:link, h4 a:active, h4 a:visited, h5 a:link, h5 a:active, h5 a:visited, h6 a:link, h6 a:active, h6 a:visited, div.looks_like_a_headline a:link, div.looks_like_a_headline a:active, div.looks_like_a_headline a:visited { text-decoration: none; color: #0a2864; } h1 a:hover, h1 a:focus, h2 a:hover, h2 a:focus, h3 a:hover, h3 a:focus, h4 a:hover, h4 a:focus, h5 a:hover, h5 a:focus, h6 a:hover, h6 a:focus, div.looks_like_a_headline a:hover, div.looks_like_a_headline a:focus { color: #84b400; } h1, h2, h4, h5, div.looks_like_a_headline { margin-bottom: 10px; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-weight: normal; color: #0a2864; } h1 { font-size: 2.9em; line-height: 1.241379; } @media only screen and (max-width: 767px) { h1 { font-size: 2.4em; line-height: 1.125; } } h2, div.looks_like_a_headline { font-size: 2.7em; line-height: 1.1111111; } @media only screen and (max-width: 767px) { h2, div.looks_like_a_headline { font-size: 2.4em; line-height: 1.125; } } h3 { font-size: 2.2em; line-height: 1.18181818; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-weight: normal; color: #84b400; } h4 { font-size: 1.8em; } h5 { font-size: 1.5em; line-height: 1.333333333; } h6 { font-size: 1.5em; font-weight: normal; line-height: 1.333333333; color: #3e3e3e; } p { font-size: 1.5em; line-height: 1.33333; margin: 0 0 1em 0; } img { max-width: 100%; height: auto; } dt { font-weight: bold; } ul, dl { margin-bottom: 1em; list-style: none; font-size: 1.5em; padding-left: 17px; } ul ul, ul ol, dl ul, dl ol { margin-bottom: 0; font-size: 1em; } @media screen and (min-width: 1024px) { .no-touch .has-mediastage .content { position: relative; top: -43px; margin-bottom: -43px; } } .content .grid-75 ul li ul li, .content .grid-100 ul li ul li, .content ul li ul li { font-size: 1.0em; } blockquote { margin: 35px 0 35px 0; padding-left: 60px; position: relative; font-size: 1.5em; color: #6c7ea2; } blockquote p { font-size: 1em; } blockquote:before { content: '”'; position: absolute; top: -20px; left: 20px; font-size: 7em; color: #ced4e0; } /* Links */ a:link, a:visited, a:active { color: #3e3e3e; } a:hover, a:focus { color: #84b400; } a[name], a:hover[name], a.name { color: inherit; text-decoration: none; } th a:link, tfoot a:link { color: #fff; } /* Buttons */ .buttonlink, .formular .form-input-tsr input, .formular .form-input-tb input, .formular .form-button button, button { background: #0a2864; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.4em; padding: 10px 20px; text-decoration: none; color: #fff; line-height: 1.2; border: none; margin: 0 0 15px; display: inline-block; } p .buttonlink, p .formular .form-input-tsr input, .formular .form-input-tsr p input, p .formular .form-input-tb input, .formular .form-input-tb p input, p .formular .form-button button, .formular .form-button p button, p button { font-size: 1em; margin-bottom: 0; } .buttonlink:hover, .formular .form-input-tsr input:hover, .formular .form-input-tb input:hover, .formular .form-button button:hover, button:hover { background: #84b400; } .buttonlink:link, .formular .form-input-tsr input:link, .formular .form-input-tb input:link, .formular .form-button button:link, .buttonlink:visited, .formular .form-input-tsr input:visited, .formular .form-input-tb input:visited, .formular .form-button button:visited, .buttonlink:active, .formular .form-input-tsr input:active, .formular .form-input-tb input:active, .formular .form-button button:active, button:link, button:visited, button:active { color: white; } .content button, .content .buttonlink, .content .formular .form-input-tsr input, .formular .form-input-tsr .content input, .content .formular .form-input-tb input, .formular .form-input-tb .content input, .content .formular .form-button button, .formular .form-button .content button { position: relative; padding: 10px 31px 10px 20px; } .content button:before, .content .buttonlink:before, .content .formular .form-input-tsr input:before, .formular .form-input-tsr .content input:before, .content .formular .form-input-tb input:before, .formular .form-input-tb .content input:before, .content .formular .form-button button:before, .formular .form-button .content button:before { position: absolute; right: 12px; top: 50%; margin-top: -7px; float: right; } /* > header = Kopfbereich der Seite */ @media only screen and (min-width: 1024px) { header { background: #0a2864; } } @media only screen and (max-width: 1023px) { header { border-bottom: 3px solid #0a2864; } } /* grid klassen */ .grid { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; max-width: 1240px; padding: 10px 20px; margin: 0 auto 56px auto; } .grid.visible-overflow { overflow: visible; } .grid.teaser-slider-33, .grid.teaser-slider-25 { margin-bottom: 41px; } @media only screen and (max-width: 1023px) { .grid.teaser-slider-33, .grid.teaser-slider-25 { margin-bottom: 15px; } } @media only screen and (max-width: 1023px) { .grid { margin-bottom: 30px; } .grid:not(.grid-background) > div:not(.grid):last-child { margin-bottom: 0; } } @media only screen and (max-width: 767px) { .grid { padding: 10px 0px; } } .grid .grid { max-width: 100%; background: rgba(255, 255, 255, 0.9); padding: 0; } .grid > h1, .grid > h2, .grid > h3, .grid > h4, .grid > h5, .grid > h6, .grid > div.looks_like_a_headline { padding: 0 15px; } .grid > div:not(.grid) { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; padding: 10px 15px 0 15px; } .grid-20 { width: 20%; } .grid-25 { width: 25%; } .grid-33 { width: 33.3333333333%; } .grid-50 { width: 50%; } .grid-66 { width: 66%; } .grid-75 { width: 75%; } .grid-75 > div:not(.csc) { padding-left: 15px; padding-right: 15px; } @media only screen and (max-width: 767px) { .grid-75 > div:not(.csc) { padding-left: 0; padding-right: 0; } } .grid-75 > .csc { padding-left: 30px; padding-right: 30px; } @media screen and (max-width: 1260px) { .grid-75 > .csc { padding-right: 30px; } } @media only screen and (max-width: 767px) { .grid-75 > .csc { padding-left: 15px; padding-right: 15px; } } @media only screen and (max-width: 767px) { .grid-20, .grid-25, .grid-33, .grid-50, .grid-66, .grid-75 { width: 100%; } } .grid-100, .userroles .grid-20, .teaser-slider-25 .grid-25, .teaser-slider-33 .grid-33 { width: 100%; } .outer-grid { padding: 0; overflow: visible; margin-bottom: 0; } .outer-grid > div:not(.grid) { padding: 0 30px 0 15px; } @media screen and (max-width: 1170px) and (min-width: 1024px) { .outer-grid > div:not(.grid) { padding: 0 30px; } } @media only screen and (max-width: 767px) { .outer-grid > div:not(.grid) { padding: 0; } } .outer-grid > .grid-100 > .csc, .outer-grid > .grid-100 .group, .outer-grid > .grid-75 > .csc, .outer-grid > .grid-75 .group { margin-bottom: 56px; } .outer-grid > .grid-100 > .csc > .grid, .outer-grid > .grid-100 .group > .grid, .outer-grid > .grid-75 > .csc > .grid, .outer-grid > .grid-75 .group > .grid { margin-bottom: 0; } @media only screen and (max-width: 1023px) { .outer-grid > .grid-100 > .csc, .outer-grid > .grid-100 .group, .outer-grid > .grid-75 > .csc, .outer-grid > .grid-75 .group { margin-bottom: 30px; } } @media only screen and (min-width: 768px) { .outer-grid > div.grid-100 { padding: 0 20px; } } @media screen and (max-width: 1170px) and (min-width: 1024px) { .outer-grid > div.grid-100 { padding: 0 15px; } } @media only screen and (max-width: 767px) { .outer-grid > div.grid-100 { padding: 0; } } .outer-grid > div.grid-25 { padding-left: 35px; padding-right: 0; } .outer-grid > div.grid-75 { padding: 0; } @media only screen and (max-width: 1023px) { .outer-grid > div { padding-top: 0; padding-bottom: 0; } .outer-grid > .grid-25 { display: none; } .outer-grid > div.grid-75 { width: 100%; padding: 0; } } .outer-grid .grid.grid-background { width: 100%; background-color: #e6e9ef; position: relative; display: table; overflow: visible; padding: 45px 15px 70px 15px; } @media only screen and (max-width: 767px) { .outer-grid .grid.grid-background { display: inline-block; } .outer-grid .grid.grid-background.teaser-slider-25, .outer-grid .grid.grid-background.teaser-slider-33, .outer-grid .grid.grid-background.userroles { padding: 10px 0 60px 0; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) { padding: 10px 0 0 0; } } .outer-grid .grid.grid-background .grid-25, .outer-grid .grid.grid-background .grid-33, .outer-grid .grid.grid-background .grid-50, .outer-grid .grid.grid-background .grid-66 { background: transparent; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 > .csc, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 > .csc, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 > .csc, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 > .csc, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 > .csc { background: #fff; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .button-wrapper { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .intext-left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .intext-right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .intext-left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .intext-right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .intext-left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .intext-right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .intext-left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .intext-right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .intext-left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .intext-right-image + .content-wrapper { padding-top: 1.5em; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image p { padding-left: 20px; } @media only screen and (min-width: 768px) { .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .aboveleft-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .aboveleft-image ~ .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .abovecenter-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .abovecenter-image ~ .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image ~ .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-right-image + .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-right-image ~ .button-wrapper { padding-left: 20px; padding-right: 20px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .aboveleft-image ~ .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .abovecenter-image ~ .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image ~ .button-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-right-image ~ .button-wrapper { margin-bottom: 15px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .csc { padding: 30px 30px 15px 30px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .button-wrapper { margin-bottom: 15px; } } @media only screen and (max-width: 767px) { .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .content-wrapper, .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .button-wrapper { padding-left: 15px; padding-right: 15px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image p { padding-left: 15px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .button-wrapper { margin-bottom: 15px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .csc { padding: 15px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .button-wrapper { margin-bottom: 15px; } } .outer-grid .grid.grid-background > .grid-empty { background-color: #e6e9ef; } .outer-grid > .grid-100 .grid-background { padding: 45px 0 70px 0; } .outer-grid > .grid-100 .grid-background:after, .outer-grid > .grid-100 .grid-background:before { background-color: #e6e9ef; position: absolute; width: 100%; height: 100%; content: ""; z-index: 0; top: 0; display: block; } .outer-grid > .grid-100 .grid-background:before { right: 100%; } .outer-grid > .grid-100 .grid-background:after { left: 100%; } .grid-extra-padding { padding-top: 80px; padding-bottom: 80px; } .grid-margin-top { margin-top: 66px; } /* > Textausrichtungen, wie sie in Typo3 verwendet werden */ /* rechtsbuendiger Text */ .align-right { text-align: right; } /* zentrierter Text */ .align-center { text-align: center; } /* eingerueckter Text */ .indent { margin-left: 25px; } /* > Bildervorlagen, wie sie in Typo3 verwendet werden */ /* Bilder im Text */ .image-wrapper { float: left; max-width: 100%; margin: 0 0 10px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .image-wrapper a { display: block; } .enlarge-image .image-wrapper img { margin-bottom: 0; } .left-image, .intext-left-image { float: left; } .right-image, .intext-right-image { float: right; } .left-image, .right-image, .intext-right-image, .intext-left-image { max-width: 30%; } .grid-75 > .csc .left-image, .grid-75 > .csc .right-image, .grid-75 > .csc .intext-right-image, .grid-75 > .csc .intext-left-image { max-width: 33%; } /* nicht floatende Bilder */ .abovecenter-image, .aboveleft-image, .aboveright-image, .intext-left-image, .intext-right-image { margin: 0 0 10px 0; } .content .abovecenter-image { display: table; margin: 0 auto; } .abovecenter-image .image-wrapper { float: left; } .intext-left-image .image-wrapper, .grid-75 .left-image .image-wrapper { padding-right: 20px; } .intext-right-image .image-wrapper, .aboveright-image .image-wrapper, .right-image .image-wrapper { padding-left: 20px; padding-right: 0; } .aboveright-image .image-wrapper { float: right; } /* Enlarge Images */ .fancybox, .fancybox:link, .fancybox:visited, .fancybox:hover, .fancybox:focus, .fancybox:active { text-decoration: none; position: relative; line-height: 1; } .fancybox span { position: absolute; right: 5px; bottom: 5px; display: block; color: #3e3e3e; } .fancybox span:before { font-size: 1.6em; } p { margin: 0 0 25px 0; } /* p als Caption */ .left-image p, .right-image p, .intext-left-image p, .intext-right-image p, .abovecenter-image p, .aboveleft-image p, .aboveright-image p { margin: 15px 0 0 0; font-size: 1.1em; } .csc { position: relative; } .button-wrapper a.buttonlink { margin-bottom: 0; } /* > teaser */ .grid-20 .aboveleft-image .image-wrapper, .grid-25 .aboveleft-image .image-wrapper, .grid-33 .aboveleft-image .image-wrapper, .grid-50 .aboveleft-image .image-wrapper, .grid-66 .aboveleft-image .image-wrapper, .grid-75 .aboveleft-image .image-wrapper { margin-right: 0; } /* > Verhalten der Standardcontent Elemente innerhalb der Grids */ .outer-grid .grid .abovecenter-image { margin-bottom: 10px; } .outer-grid .grid .abovecenter-image + .content-wrapper { text-align: center; padding-top: 0; } .outer-grid .grid .abovecenter-image ~ .button-wrapper { text-align: center; width: 100%; } .outer-grid .grid .grid-20, .outer-grid .grid .grid-25, .outer-grid .grid .grid-33, .outer-grid .grid .grid-50 { position: relative; background: #fff; } .outer-grid .grid .grid-20 .image-wrapper, .outer-grid .grid .grid-25 .image-wrapper, .outer-grid .grid .grid-33 .image-wrapper, .outer-grid .grid .grid-50 .image-wrapper { margin-bottom: 0; } .outer-grid .grid .grid-20 .image-wrapper img, .outer-grid .grid .grid-25 .image-wrapper img, .outer-grid .grid .grid-33 .image-wrapper img, .outer-grid .grid .grid-50 .image-wrapper img { display: block; } .outer-grid .grid .grid-20 .content-wrapper, .outer-grid .grid .grid-25 .content-wrapper, .outer-grid .grid .grid-33 .content-wrapper, .outer-grid .grid .grid-50 .content-wrapper { margin-bottom: 50px; } .outer-grid .grid .grid-20 .button-wrapper, .outer-grid .grid .grid-25 .button-wrapper, .outer-grid .grid .grid-33 .button-wrapper, .outer-grid .grid .grid-50 .button-wrapper { position: absolute; bottom: 0; } .outer-grid .grid .grid-20 .intext-left-image + .content-wrapper, .outer-grid .grid .grid-20 .intext-right-image + .content-wrapper, .outer-grid .grid .grid-20 .left-image + .content-wrapper, .outer-grid .grid .grid-20 .right-image + .content-wrapper, .outer-grid .grid .grid-25 .intext-left-image + .content-wrapper, .outer-grid .grid .grid-25 .intext-right-image + .content-wrapper, .outer-grid .grid .grid-25 .left-image + .content-wrapper, .outer-grid .grid .grid-25 .right-image + .content-wrapper, .outer-grid .grid .grid-33 .intext-left-image + .content-wrapper, .outer-grid .grid .grid-33 .intext-right-image + .content-wrapper, .outer-grid .grid .grid-33 .left-image + .content-wrapper, .outer-grid .grid .grid-33 .right-image + .content-wrapper, .outer-grid .grid .grid-50 .intext-left-image + .content-wrapper, .outer-grid .grid .grid-50 .intext-right-image + .content-wrapper, .outer-grid .grid .grid-50 .left-image + .content-wrapper, .outer-grid .grid .grid-50 .right-image + .content-wrapper { margin-bottom: 30px; } .outer-grid .grid .grid-20 .intext-left-image ~ .button-wrapper, .outer-grid .grid .grid-20 .intext-right-image ~ .button-wrapper, .outer-grid .grid .grid-20 .left-image ~ .button-wrapper, .outer-grid .grid .grid-20 .right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .intext-left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .intext-right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .intext-left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .intext-right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .intext-left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .intext-right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .right-image ~ .button-wrapper { position: static; } @media only screen and (max-width: 767px) { .outer-grid .grid .grid-20, .outer-grid .grid .grid-25, .outer-grid .grid .grid-33, .outer-grid .grid .grid-50 { margin-bottom: 20px; } } .outer-grid .grid .grid-20 .left-image .image-wrapper, .outer-grid .grid .grid-20 .right-image .image-wrapper, .outer-grid .grid .grid-25 .left-image .image-wrapper, .outer-grid .grid .grid-25 .right-image .image-wrapper, .outer-grid .grid .grid-33 .left-image .image-wrapper, .outer-grid .grid .grid-33 .right-image .image-wrapper, .outer-grid .grid .grid-50 .left-image .image-wrapper, .outer-grid .grid .grid-50 .right-image .image-wrapper { margin: 0; } .outer-grid .grid .grid-20 .left-image + .content-wrapper, .outer-grid .grid .grid-20 .left-image ~ .button-wrapper, .outer-grid .grid .grid-20 .right-image + .content-wrapper, .outer-grid .grid .grid-20 .right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .left-image + .content-wrapper, .outer-grid .grid .grid-25 .left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .right-image + .content-wrapper, .outer-grid .grid .grid-25 .right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .left-image + .content-wrapper, .outer-grid .grid .grid-33 .left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .right-image + .content-wrapper, .outer-grid .grid .grid-33 .right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .left-image + .content-wrapper, .outer-grid .grid .grid-50 .left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .right-image + .content-wrapper, .outer-grid .grid .grid-50 .right-image ~ .button-wrapper { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; max-width: 70%; width: 100%; padding: 0 20px; } @media only screen and (max-width: 767px) { .outer-grid .grid .grid-20 .left-image + .content-wrapper, .outer-grid .grid .grid-20 .left-image ~ .button-wrapper, .outer-grid .grid .grid-20 .right-image + .content-wrapper, .outer-grid .grid .grid-20 .right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .left-image + .content-wrapper, .outer-grid .grid .grid-25 .left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .right-image + .content-wrapper, .outer-grid .grid .grid-25 .right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .left-image + .content-wrapper, .outer-grid .grid .grid-33 .left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .right-image + .content-wrapper, .outer-grid .grid .grid-33 .right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .left-image + .content-wrapper, .outer-grid .grid .grid-50 .left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .right-image + .content-wrapper, .outer-grid .grid .grid-50 .right-image ~ .button-wrapper { width: 100%; max-width: 100%; padding: 0 15px; } } .outer-grid .grid .grid-20 .left-image ~ .button-wrapper, .outer-grid .grid .grid-20 .right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .right-image ~ .button-wrapper { margin-bottom: 20px; } @media only screen and (max-width: 767px) { .outer-grid .grid .grid-20 .left-image ~ .button-wrapper, .outer-grid .grid .grid-20 .right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .right-image ~ .button-wrapper { margin-bottom: 15px; } } .outer-grid .grid .grid-20 .left-image + .content-wrapper, .outer-grid .grid .grid-20 .left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .left-image + .content-wrapper, .outer-grid .grid .grid-25 .left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .left-image + .content-wrapper, .outer-grid .grid .grid-33 .left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .left-image + .content-wrapper, .outer-grid .grid .grid-50 .left-image ~ .button-wrapper { float: right; padding-top: 0; } @media only screen and (max-width: 767px) { .outer-grid .grid .grid-20 .left-image + .content-wrapper, .outer-grid .grid .grid-20 .left-image ~ .button-wrapper, .outer-grid .grid .grid-25 .left-image + .content-wrapper, .outer-grid .grid .grid-25 .left-image ~ .button-wrapper, .outer-grid .grid .grid-33 .left-image + .content-wrapper, .outer-grid .grid .grid-33 .left-image ~ .button-wrapper, .outer-grid .grid .grid-50 .left-image + .content-wrapper, .outer-grid .grid .grid-50 .left-image ~ .button-wrapper { padding-left: 0; } } .outer-grid .grid .grid-20 .right-image + .content-wrapper, .outer-grid .grid .grid-20 .right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .right-image + .content-wrapper, .outer-grid .grid .grid-25 .right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .right-image + .content-wrapper, .outer-grid .grid .grid-33 .right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .right-image + .content-wrapper, .outer-grid .grid .grid-50 .right-image ~ .button-wrapper { float: left; padding-top: 0; padding-right: 20px; } @media only screen and (max-width: 767px) { .outer-grid .grid .grid-20 .right-image + .content-wrapper, .outer-grid .grid .grid-20 .right-image ~ .button-wrapper, .outer-grid .grid .grid-25 .right-image + .content-wrapper, .outer-grid .grid .grid-25 .right-image ~ .button-wrapper, .outer-grid .grid .grid-33 .right-image + .content-wrapper, .outer-grid .grid .grid-33 .right-image ~ .button-wrapper, .outer-grid .grid .grid-50 .right-image + .content-wrapper, .outer-grid .grid .grid-50 .right-image ~ .button-wrapper { padding-right: 0; } } .outer-grid .grid .grid-20 .aboveleft-image, .outer-grid .grid .grid-20 .abovecenter-image, .outer-grid .grid .grid-25 .aboveleft-image, .outer-grid .grid .grid-25 .abovecenter-image, .outer-grid .grid .grid-33 .aboveleft-image, .outer-grid .grid .grid-33 .abovecenter-image, .outer-grid .grid .grid-50 .aboveleft-image, .outer-grid .grid .grid-50 .abovecenter-image { display: block; } .outer-grid .grid .grid-20 .aboveleft-image .image-wrapper, .outer-grid .grid .grid-20 .abovecenter-image .image-wrapper, .outer-grid .grid .grid-25 .aboveleft-image .image-wrapper, .outer-grid .grid .grid-25 .abovecenter-image .image-wrapper, .outer-grid .grid .grid-33 .aboveleft-image .image-wrapper, .outer-grid .grid .grid-33 .abovecenter-image .image-wrapper, .outer-grid .grid .grid-50 .aboveleft-image .image-wrapper, .outer-grid .grid .grid-50 .abovecenter-image .image-wrapper { min-width: 100%; } .outer-grid .grid .grid-20 .aboveleft-image .image-wrapper img, .outer-grid .grid .grid-20 .abovecenter-image .image-wrapper img, .outer-grid .grid .grid-25 .aboveleft-image .image-wrapper img, .outer-grid .grid .grid-25 .abovecenter-image .image-wrapper img, .outer-grid .grid .grid-33 .aboveleft-image .image-wrapper img, .outer-grid .grid .grid-33 .abovecenter-image .image-wrapper img, .outer-grid .grid .grid-50 .aboveleft-image .image-wrapper img, .outer-grid .grid .grid-50 .abovecenter-image .image-wrapper img { min-width: 100%; } .outer-grid .grid .grid-20 .aboveleft-image + .content-wrapper, .outer-grid .grid .grid-20 .abovecenter-image + .content-wrapper, .outer-grid .grid .grid-25 .aboveleft-image + .content-wrapper, .outer-grid .grid .grid-25 .abovecenter-image + .content-wrapper, .outer-grid .grid .grid-33 .aboveleft-image + .content-wrapper, .outer-grid .grid .grid-33 .abovecenter-image + .content-wrapper, .outer-grid .grid .grid-50 .aboveleft-image + .content-wrapper, .outer-grid .grid .grid-50 .abovecenter-image + .content-wrapper { padding-top: 0; } @media screen and (max-width: 600px) { .right-image, .left-image { display: none; } } .image-wrapper { position: relative; } @media only screen and (max-width: 767px) { .image-wrapper { margin-right: 0; } } .grid-75 .csc .left-image + .content-wrapper, .grid-75 .csc .left-image ~ .button-wrapper, .grid-75 .csc .right-image + .content-wrapper, .grid-75 .csc .right-image ~ .button-wrapper { -moz-box-sizing: border-box; box-sizing: border-box; float: left; max-width: 66%; } @media screen and (max-width: 600px) { .grid-75 .csc .left-image + .content-wrapper, .grid-75 .csc .left-image ~ .button-wrapper, .grid-75 .csc .right-image + .content-wrapper, .grid-75 .csc .right-image ~ .button-wrapper { width: 100%; max-width: 100%; } } .grid-75 .csc .left-image ~ .button-wrapper, .grid-75 .csc .right-image ~ .button-wrapper { clear: both; } .userroles .grid-20, .teaser-slider-primarycolor .grid-33 { margin-bottom: 20px; position: relative; } .userroles .grid-20:last-child, .teaser-slider-primarycolor .grid-33:last-child { margin-bottom: 0; } .userroles .grid-20 a, .teaser-slider-primarycolor .grid-33 a { display: block; text-decoration: none; } .userroles .grid-20 a:hover, .teaser-slider-primarycolor .grid-33 a:hover { opacity: 0.9; } .userroles .grid-20 .image-wrapper, .userroles .grid-20 img, .teaser-slider-primarycolor .grid-33 .image-wrapper, .teaser-slider-primarycolor .grid-33 img { margin-bottom: 0; width: 100%; } .userroles .grid-20 .csc .aboveleft-image, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image { margin-bottom: -3px; } .userroles .grid-20 .csc .aboveleft-image + .content-wrapper, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper { background: rgba(132, 180, 0, 0.9); color: #fff; width: 100%; position: absolute; padding-bottom: 0; margin-bottom: 0; bottom: 0; height: 53px; } .userroles .grid-20 .csc .aboveleft-image + .content-wrapper:before, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper:before { bottom: 10px; font-size: 1.5em; float: right; position: absolute; right: 10px; } .userroles .grid-20 .csc .aboveleft-image + .content-wrapper p, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper p { font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.6em; position: absolute; bottom: 8px; left: 13px; margin: 0; display: block; max-width: 80%; } .userroles .grid-20 .csc .button-wrapper, .teaser-slider-primarycolor .grid-33 .csc .button-wrapper { display: none; } .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper { background: rgba(10, 40, 100, 0.9); padding: 5px 13px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper > * { color: #fff; } .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h1, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h2, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h3, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h4, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h5, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h6, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper p, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper div.looks_like_a_headline { position: relative; display: block; left: auto; bottom: auto; font-size: 1.6em; margin-bottom: 0; } @media only screen and (max-width: 767px) { .metanavigation-layer div.userroles { margin-bottom: 0; } } .metanavigation-layer div.userroles h2, .metanavigation-layer div.userroles h3, .metanavigation-layer div.userroles div.looks_like_a_headline { color: #fff; padding-left: 15px; } @media only screen and (max-width: 767px) { .metanavigation-layer div.userroles h2, .metanavigation-layer div.userroles h3, .metanavigation-layer div.userroles div.looks_like_a_headline { padding-left: 0; } .metanavigation-layer div.userroles > div { max-width: 75%; width: 100%; margin-bottom: 0; } .metanavigation-layer div.userroles .csc .aboveleft-image + .content-wrapper { position: static; } .metanavigation-layer div.userroles .image-wrapper img { display: none; } } .content .outer-grid div.grid-100 > div.userroles, .content .outer-grid div.grid-100 > div.teaser-slider-33, .content .outer-grid div.grid-75 > div.teaser-slider-33, .content .outer-grid div.grid-100 > div.teaser-slider-25, .content .outer-grid div.grid-75 > div.teaser-slider-25 { display: block; } .content .outer-grid div.grid-100 > div.userroles > div, .content .outer-grid div.grid-100 > div.teaser-slider-33 > div, .content .outer-grid div.grid-75 > div.teaser-slider-33 > div, .content .outer-grid div.grid-100 > div.teaser-slider-25 > div, .content .outer-grid div.grid-75 > div.teaser-slider-25 > div { float: none; } /* > Bild neben Text Element */ .outer-grid .grid[style*="background-image"] { width: 100%; padding: 30px 24px 45px 30px; background-size: cover; background-repeat: no-repeat; } @media only screen and (max-width: 767px) { .outer-grid .grid[style*="background-image"] { padding: 0; } } .outer-grid .grid[style*="background-image"] > h1, .outer-grid .grid[style*="background-image"] > h2, .outer-grid .grid[style*="background-image"] > h3, .outer-grid .grid[style*="background-image"] > h4, .outer-grid .grid[style*="background-image"] > h5, .outer-grid .grid[style*="background-image"] > h6, .outer-grid .grid[style*="background-image"] div.looks_like_a_headline { padding: 0; } .outer-grid .grid[style*="background-image"] .button-wrapper { margin-bottom: 15px; } @media only screen and (max-width: 1023px) { .outer-grid .grid[style*="background-image"] .grid-66 { padding-right: 5px; } } .outer-grid .grid[style*="background-image"] .grid-empty { background: none; } @media only screen and (max-width: 767px) { .outer-grid .grid[style*="background-image"] .grid-empty { display: none; } } .outer-grid .grid[style*="background-image"] .grid-66, .outer-grid .grid[style*="background-image"] .grid-33 { background: #fff; padding: 30px 30px 15px 30px; } @media only screen and (max-width: 767px) { .outer-grid .grid[style*="background-image"] .grid-66, .outer-grid .grid[style*="background-image"] .grid-33 { padding: 0 15px; } } .outer-grid .grid[style*="background-image"] .grid-66.grid-empty, .outer-grid .grid[style*="background-image"] .grid-33.grid-empty { background: none; } @media only screen and (max-width: 767px) { .outer-grid .grid[style*="background-image"] .grid-66.grid-empty, .outer-grid .grid[style*="background-image"] .grid-33.grid-empty { display: none; } } @media only screen and (max-width: 767px) { .outer-grid .grid[style*="background-image"] .grid-66, .outer-grid .grid[style*="background-image"] .grid-33 { width: 100%; } } @media only screen and (max-width: 767px) { .outer-grid .grid[style*="background-image"] { background: none !important; /* Important notwendig um den durch das CMS gesetzten Inline-Style zu ueberschreiben */ } } .outer-grid .grid .enlarge-image img { width: 270px; } @media screen and (max-width: 600px) { .outer-grid .grid .enlarge-image img { display: none; } } .outer-grid .csc .content-wrapper { margin-bottom: 30px; } .outer-grid .csc .content-wrapper:last-child { padding-bottom: 0; margin-bottom: 0; } .outer-grid .csc .content-wrapper *:last-child { margin-bottom: 0; } .grid.grid-background > div[class*="grid-"] .content-wrapper { padding: 30px 30px 20px 30px; } .grid.grid-background > div[class*="grid-"] .button-wrapper { padding: 0 30px 20px 30px; } .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) div[class*="grid-"] .csc div[class*="above"] ~ .button-wrapper { margin-bottom: 0; } .grid.grid-background > div[class*="grid-"] .csc .accordion { margin: 0 30px 20px 30px; padding-top: 30px; } /* einspaltig */ .content { position: relative; width: 100%; overflow: hidden; min-height: 600px; } @media only screen and (max-width: 767px) { .content { min-height: 300px; } } h1, h2, h3, h4, h5, h6, div.looks_like_a_headline, .visual-text p, .grid-20 .content-wrapper p, .mainnavigation a, .sidenavigation a, .dl-menu a { word-wrap: break-word; overflow-wrap: break-word; } /* > content = (Haupt)inhaltsbereich der Seite, fancyboxinhalte */ .content h1, .content h2, .content h3, .content h4, .content h5, .content h6, .content div.looks_like_a_headline { margin-left: 0; } .content .content-wrapper h1, .content .content-wrapper h2, .content .content-wrapper h3, .content .content-wrapper h4, .content .content-wrapper h5, .content .content-wrapper h6, .content .content-wrapper div.looks_like_a_headline { margin-left: 0; } .content h1 { margin-bottom: 13px; } .content h2, .content div.looks_like_a_headline { margin-bottom: 22px; } .content h3 { margin-bottom: 15px; } .content .grid-75 ul, .content .grid-100 ul, .visual-wrapper .grid ul { margin: 0; padding-left: 0; font-size: 1em; } .content .grid-75 ul li, .content .grid-100 ul li, .visual-wrapper .grid ul li { background: url(/fileadmin/twt_customer/base/system/templates/images/bullet.png) 3px 7px no-repeat; font-size: 1.5em; margin: 0 0 0.5em 0; line-height: 1.33333; padding-left: 1.5em; } iframe { width: 100%; max-width: 100%; margin-bottom: 2em; -webkit-overflow-scrolling: touch; -webkit-transform: translate3d(0, 0, 0); } a.editlink { background: url(/fileadmin/twt_customer/base/system/templates/images/ico_edit.png) left center no-repeat; background-size: 14px; padding: 5px 0 4px 20px; margin-bottom: 20px; font-size: 1.5em; color: #0a2864; display: inline-block; } a.editlink:hover { text-decoration: none; } .small-hint { font-size: 1.1em; } .table-wrapper + .small-hint { padding: 0 5px; margin-top: -4em; margin-bottom: 4em; } .formular .table-wrapper + .small-hint { margin-bottom: 25px; } /* Tabellen */ table { font-size: 1.5em; border-collapse: separate; border-spacing: 5px 0; } table caption { font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.466666666em; color: #0a2864; margin-bottom: 0.75em; } table table, table p, table h5, table h6, table label, table .has-error .help-block { font-size: 1em; } table h1, table h2, table div.looks_like_a_headline { font-size: 1.933333333em; } table h3 { font-size: 1.466666666em; } table h4 { font-size: 1.2em; } .content .csc table ul li, .content .csc table ol li { font-size: 1em; } th, thead td { text-align: left; font-weight: normal; background: #6c7ea2; color: #fff; } th, td { vertical-align: top; padding: 10px; } tbody td { border-bottom: 1px solid #e6e9ef; } .formular tbody td { background: #fff; } tbody tr:last-child td { border-bottom: none; } tfoot td { background: #9da9c1; color: #fff; } .table-border td, .table-border:last-child td { border-bottom: 3px solid #9da9c1; } .table-alternate-rows { border-spacing: 2px; } .table-alternate-rows td { border-bottom: 0; } .table-alternate-rows tbody .odd td { background: #e6e9ef; } .scroll-hint span { display: none; font-size: 1.5em; font-weight: bold; font-style: normal; width: 65px; height: 20px; text-indent: -9999px; } .table-scroll-right .scroll-hint .scroll-right { display: inline-block; float: right; width: 50%; background: url(/fileadmin/twt_customer/base/system/templates/images/ico_scrollright.png) right center no-repeat; background-size: auto 17px; } .table-scroll-left .scroll-hint .scroll-left { display: inline-block; float: left; width: 50%; background: url(/fileadmin/twt_customer/base/system/templates/images/ico_scrollleft.png) left center no-repeat; background-size: auto 17px; } .table-wrapper { position: relative; overflow: hidden; margin-bottom: 5em; clear: both; } div[class*="form-grid"] > .table-wrapper { background: #e6e9ef; padding: 20px; } fieldset div[class*="form-grid"] > .table-wrapper, div.form-summary > .table-wrapper { padding: 0; } .table-innerwrapper { margin-top: 10px; width: 100%; overflow-x: auto; } .table-scroll-right:after, .table-scroll-left:before { content: ''; display: block; width: 50px; height: 100%; position: absolute; z-index: 10; top: 27px; } div[class*="form-grid"]:not(.form-summary) > .table-scroll-right:after, div[class*="form-grid"]:not(.form-summary) > .table-scroll-left:before { top: 38px; } .table-scroll-left:before { left: 0; background-color: rgba(255, 255, 255, 0); background-image: -webkit-gradient(linear, left right, left bottom, from(rgba(255, 255, 255, 0)), to(#fff)); background-image: -webkit-linear-gradient(right, rgba(255, 255, 255, 0), #fff); background-image: -moz-linear-gradient(right, rgba(255, 255, 255, 0), #fff); background-image: -ms-linear-gradient(right, rgba(255, 255, 255, 0), #fff); background-image: linear-gradient(right, rgba(255, 255, 255, 0), #fff); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(255, 255, 255, 0)', endColorStr='#fff'); } div[class*="form-grid"] > .table-scroll-left:before { background-color: rgba(230, 233, 239, 0); background-image: -webkit-gradient(linear, left right, left bottom, from(rgba(230, 233, 239, 0)), to(#e6e9ef)); background-image: -webkit-linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef); background-image: -moz-linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef); background-image: -ms-linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef); background-image: linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(230, 233, 239, 0)', endColorStr='#e6e9ef'); } div[class*="form-grid"]:not(.form-summary) > .table-scroll-left:before { left: 20px; } .table-scroll-right:after { right: 0; background-color: rgba(255, 255, 255, 0); background-image: -webkit-gradient(linear, left left, left bottom, from(rgba(255, 255, 255, 0)), to(#fff)); background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), #fff); background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0), #fff); background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0), #fff); background-image: linear-gradient(left, rgba(255, 255, 255, 0), #fff); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(255, 255, 255, 0)', endColorStr='#fff'); } div[class*="form-grid"] > .table-scroll-right:after { background-color: rgba(230, 233, 239, 0); background-image: -webkit-gradient(linear, left left, left bottom, from(rgba(230, 233, 239, 0)), to(#e6e9ef)); background-image: -webkit-linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef); background-image: -moz-linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef); background-image: -ms-linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef); background-image: linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(230, 233, 239, 0)', endColorStr='#e6e9ef'); } div[class*="form-grid"]:not(.form-summary) > .table-scroll-right:after { right: 20px; } /* > footer = Abbinder */ footer { background: #0a2864; clear: both; overflow: hidden; } footer ul, footer ul:after { list-style: none; clear: none; margin: 0; padding: 0; } footer li { float: left; margin-right: 10px; } /* >> Inhaltsbereiche */ /* > wrapper = Container um alle Inhalte der Seite */ .wrapper, .metanavigation > ul, .metanavigation-tabs, .metanavigation-layer { width: 100%; max-width: 1170px; margin: 0 auto; padding: 0; display: block; } @media screen and (max-width: 1170px) { .wrapper, .metanavigation > ul, .metanavigation-tabs, .metanavigation-layer { padding: 0 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } } @media only screen and (max-width: 767px) { .wrapper, .metanavigation > ul, .metanavigation-tabs, .metanavigation-layer { padding: 0 15px; } } /* > sidenavigation navigation vertikal (links) */ .sidenavigation { display: none; padding-right: 10px; } @media only screen and (min-width: 1024px) { .sidenavigation { display: block; } .sidenavigation ul { font-size: 1em; margin: 0; overflow: hidden; padding: 0; width: 100%; } .sidenavigation ul li { font-family: "TheSansBold", Arial, Verdana, sans-serif; } .sidenavigation ul li a, .sidenavigation ul li span { color: #84b400; font-size: 1.7em; } .sidenavigation ul li ul { font-size: 1em; margin: 12px 0 30px 0; padding: 0; list-style: none; width: 100%; } .sidenavigation ul li ul li { border-bottom: 1px dotted #9da9c1; font-size: 1em; margin: 0; padding: 7px 0; text-transform: uppercase; } .sidenavigation ul li ul li a, .sidenavigation ul li ul li strong { color: #0a2864; font-size: 1.3em; text-decoration: none; font-weight: normal; } .sidenavigation ul li ul li a.hover, .sidenavigation ul li ul li a:hover, .sidenavigation ul li ul li a.active, .sidenavigation ul li ul li strong.hover, .sidenavigation ul li ul li strong:hover, .sidenavigation ul li ul li strong.active { color: #84b400; } .sidenavigation ul li ul li.first, .sidenavigation ul li ul li.last { border: none; } .sidenavigation ul li ul li.current strong { color: #84b400; } } /* > footernavigation(en) */ .logo-footer, .logo-footer-dk { width: 124px; margin: 35px 0 35px 0; float: left; } .logo-footer img, .logo-footer-dk img { width: 100%; } .logo-footer-dk { width: 208px; } .footernavigation { margin: 25px 0 15px 0; padding: 0; float: right; clear: none; } .footernavigation li { margin: 0 0 0 20px; } .footernavigation a { font-size: 0.867em; color: #fff; text-decoration: none; } .footernavigation strong { font-size: 0.867em; color: #84b400; } .socialnavigation { margin-bottom: 30px; float: right; clear: right; } .socialnavigation li { margin: 10px 0 0 15px; } .socialnavigation img { width: 32px; height: 32px; } @media only screen and (max-width: 767px) { footer .wrapper, footer .metanavigation > ul, footer .metanavigation-tabs, footer .metanavigation-layer { padding-bottom: 15px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; } .logo-footer { -webkit-box-flex: 1 0; -moz-box-flex: 1 0; -webkit-flex: 1 0; -ms-flex: 1 0; flex: 1 0; width: 65px; max-width: 65px; margin: 15px 20px 0 0; -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; -ms-flex-order: 1; -webkit-order: 1; order: 1; } .footernavigation { -webkit-box-flex: 1 100%; -moz-box-flex: 1 100%; -webkit-flex: 1 100%; -ms-flex: 1 100%; flex: 1 100%; -webkit-box-ordinal-group: 3; -moz-box-ordinal-group: 3; -ms-flex-order: 3; -webkit-order: 3; order: 3; float: none; clear: both; margin-top: 0; } .footernavigation li { margin: 0 20px 0 0; } .socialnavigation { -webkit-box-flex: 1 0; -moz-box-flex: 1 0; -webkit-flex: 1 0; -ms-flex: 1 0; flex: 1 0; -webkit-box-ordinal-group: 2; -moz-box-ordinal-group: 2; -ms-flex-order: 2; -webkit-order: 2; order: 2; margin: 20px 0 5px 0; max-width: 255px; } .socialnavigation li { margin: 0 0 5px 10px; } .socialnavigation img { width: 24px; height: 24px; } } /* > trail Brotkrumenspur, trail, klickpfad */ .content .grid-100 .trail, .content .grid-75 .trail { font-size: 1em; list-style: none; margin: 30px 0 18px; padding: 0 0 0 15px; } .content .grid-100 .trail li, .content .grid-75 .trail li { background: none; float: left; font-size: 1em; line-height: 1.7em; padding: 0; } .content .grid-100 .trail li:after, .content .grid-75 .trail li:after { color: #0a2864; font-size: 1.4em; position: relative; top: 2px; } .content .grid-100 .trail li a, .content .grid-100 .trail li span, .content .grid-75 .trail li a, .content .grid-75 .trail li span { display: inline-block; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.1em; margin-right: 3px; text-decoration: none; text-transform: uppercase; } .content .grid-100 .trail li span, .content .grid-75 .trail li span { color: #0a2864; } .content .grid-100 .trail li a, .content .grid-75 .trail li a { color: #0a2864; } .content .grid-100 .trail li a:after, .content .grid-75 .trail li a:after { margin-left: 3px; } .content .grid-100 .trail li a:hover, .content .grid-75 .trail li a:hover { color: #84b400; } .content .grid-100 .trail li.first a, .content .grid-75 .trail li.first a { float: left; } .content .grid-100 .trail li.first a:before, .content .grid-75 .trail li.first a:before { font-size: 1.2em; margin-top: 3px; margin-right: -3px; } .content .grid-100 .trail li.first a:after, .content .grid-75 .trail li.first a:after { margin-left: 0; } /* > Sitemap */ .sitemap { width: 25%; margin: 15px 0 30px 0; float: left; } .sitemap:nth-child(4n+6) { clear: left; } .sitemap dl { font-family: "TheSansBold", Arial, Verdana, sans-serif; margin: 15px 15px 0 0; padding: 0; } .sitemap dt { font-size: 1.4666666em; font-weight: normal; } .sitemap dt a { color: #84b400; } .sitemap dd { margin: 0; list-style: none; } .sitemap a { margin-top: 10px; padding: 5px 0 5px 0; display: block; color: #0a2864; text-decoration: none; } .sitemap a:hover { color: #84b400; } @media screen and (max-width: 767px) { .sitemap { width: 100%; float: none; } .sitemap dl { margin: 15px 0 0; } } /* > accordion base */ .accordion { font-size: 1em; list-style-type: none; margin: 0; padding: 0; } .accordion dt { background: #e6e9ef; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1em; font-weight: normal; margin-bottom: 4px; } .accordion dt a { color: #0a2864; display: block; font-size: 1.8em; text-decoration: none; line-height: 1.3em; padding: 7px 15px 7px 20px; position: relative; } .accordion dt a:before { float: right; } .accordion dt.active { margin-bottom: 0; } .accordion dt.active a { color: #84b400; margin-bottom: 0; } .accordion dt.active a:before { color: #0a2864; top: 10px; } .accordion dd { background: #e6e9ef; padding: 0 50px 0 20px; margin: -4px 0 2px; height: 0px; overflow: hidden; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .accordion dd.active { display: block; max-height: 10000px; height: auto; padding: 10px 50px 20px 20px; } @media only screen and (max-width: 767px) { .accordion dd.active { padding: 10px 20px 20px 20px; margin-bottom: 2px; } } .accordion dd.active div.csc div.content-wrapper { margin-left: 0; margin-bottom: 0; } .accordion dd.active div.csc .button-wrapper { margin-top: 20px; } .accordion dd p { font-family: Arial, Verdana, sans-serif; margin: 0 0 25px 0; } .accordion dd *:last-child { margin-bottom: 0; } .accordion dd:last-child { position: relative; top: -4px; } /* > glossar */ .content .grid-75 .filter-picker, .content .grid-100 .filter-picker { margin: 20px 0 30px; padding: 0; } .content .grid-75 .filter-picker li, .content .grid-100 .filter-picker li { background: none; display: block; float: left; margin: 0; padding: 0; width: 16%; text-align: center; border-right: 1px dotted #0a2864; } @media only screen and (max-width: 767px) { .content .grid-75 .filter-picker li, .content .grid-100 .filter-picker li { width: 32%; margin-bottom: 20px; } .content .grid-75 .filter-picker li:nth-child(3n+0), .content .grid-100 .filter-picker li:nth-child(3n+0) { border-right: none; } } .content .grid-75 .filter-picker li.active a, .content .grid-100 .filter-picker li.active a { color: #84b400; } .content .grid-75 .filter-picker li:last-child, .content .grid-100 .filter-picker li:last-child { border-right: 0; } .content .grid-75 .filter-picker li a, .content .grid-100 .filter-picker li a { text-decoration: none; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-weight: bold; font-size: 1.3em; } @media only screen and (max-width: 767px) { .content .grid-75 .filter-picker li a, .content .grid-100 .filter-picker li a { font-size: 1em; } } .content .grid-75 .filter-picker li a.disabled, .content .grid-100 .filter-picker li a.disabled { cursor: default; color: #e6e9ef; } .search-container { width: 49%; display: inline-block; float: right; } @media only screen and (max-width: 767px) { .search-container { width: 100%; float: none; } } /* > downloads */ .content .select .loading ~ .styledSelect:before { content: ''; top: 3px; width: 30px; height: 30px; display: block; background: url(/fileadmin/twt_customer/base/system/templates/images/loader.gif) center center no-repeat; background-size: 20px 20px; } .twt-download { margin-bottom: 60px; } .twt-download .loader { display: none; height: 50px; background: url(/typo3conf/ext/twt_download/Resources/Public/Images/ista_loading.gif) center center no-repeat white; } .content .grid-75 .downloads, .content .grid-100 .downloads { font-size: 1em; list-style-image: none; padding: 0; } .content .grid-75 .downloads li, .content .grid-100 .downloads li { background: #e6e9ef; font-size: 1em; padding: 15px 10px; position: relative; } .content .grid-75 .downloads li img, .content .grid-100 .downloads li img { float: left; border: 1px solid #9da9c1; } .content .grid-75 .downloads li img[height="0"], .content .grid-100 .downloads li img[height="0"] { display: none; } .content .grid-75 .downloads li div, .content .grid-100 .downloads li div { margin: 20px 0 0 10px; float: left; width: 72%; } .content .grid-75 .downloads li div a, .content .grid-100 .downloads li div a { color: #0a2864; display: block; font-size: 1.5em; font-weight: bold; line-height: 1.33333; text-decoration: none; } .content .grid-75 .downloads li div a:hover, .content .grid-100 .downloads li div a:hover { text-decoration: underline; } .content .grid-75 .downloads li div span, .content .grid-100 .downloads li div span { color: #6c7ea2; display: block; font-size: 0.8em; font-weight: normal; margin-top: 5px; } @media only screen and (max-width: 767px) { .content .grid-75 .downloads li div, .content .grid-100 .downloads li div { margin: 0 0 0 10px; } } .content .grid-75 .downloads li:nth-child(odd), .content .grid-100 .downloads li:nth-child(odd) { background: #fff; } /* List checked */ .content .grid-75 ul.checked, .content .grid-100 ul.checked, .visual-wrapper .csc ul.checked { list-style-image: none; } .content .grid-75 ul.checked li, .content .grid-100 ul.checked li, .visual-wrapper .csc ul.checked li { background: none; position: relative; padding-left: 25px; } .content .grid-75 ul.checked li:before, .content .grid-100 ul.checked li:before, .visual-wrapper .csc ul.checked li:before { color: #84b400; position: absolute; left: 0; font-size: 20px; } @media only screen and (max-width: 767px) { .content .grid-75 ul, .content .grid-100 ul, .visual-wrapper .csc ul { padding: 0; } } /* > fancybox */ .fancybox span { float: right; margin-top: 15px; } .fancybox span.first { color: #84b400; font-size: 2em; position: absolute; bottom: 10px; right: 0px; } /* Fancybox content */ .fancybox-inner .csc { max-width: 750px; margin: 0 auto; } .fancybox-inner .csc ul li { background: url(/fileadmin/twt_customer/base/system/templates/images/bullet.png) 3px 7px no-repeat; padding-left: 1.5em; } .fancybox-inner .csc ul li ul { margin-top: 0.5em; } .fancybox-inner .csc .checked { list-style-image: none; } .fancybox-inner .csc .checked li { background: none; position: relative; padding-left: 25px; } .fancybox-inner .csc .checked li:before { color: #84b400; position: absolute; left: 0; font-size: 20px; } .fancybox-inner .csc ol li { font-size: 1.5em; line-height: 1.33333; } .fancybox-inner .csc ol li ol { margin-top: 0.5em; } .fancybox-inner .csc li { margin: 0 0 0.5em; } .fancybox-inner .csc li li { font-size: 1em; } /* Download Teaser */ .download-teaser .grid-33:nth-child(3n+1) { margin-right: 0; } .download-teaser .grid-33 img { border: 1px solid #9da9c1; height: auto; width: auto; max-height: 100%; max-width: 100%; } .download-teaser .grid-33 img[height="0"] { display: none; } .download-teaser .grid-33 > a { display: inline-block; height: 198px; max-height: 198px; width: 100%; } @media only screen and (max-width: 767px) { .download-teaser .grid-33 > a { height: auto; } } @media screen and (max-width: 600px) { .download-teaser .grid-33 { width: 100%; margin-bottom: 0; padding-bottom: 0; } .download-teaser .grid-33 img { display: none; } } .download-teaser .grid-33.last { margin: 0; } .download-teaser div div a { font-size: 1.3em; display: block; padding-left: 10px; position: relative; } .download-teaser div div a:before { color: #6c7ea2; font-size: 1.4em; position: absolute; top: -2px; left: -6px; } .download-teaser p { font-size: 1.4em; padding-left: 10px; } .download-teaser span { color: #6c7ea2; font-size: 1em; display: block; padding-left: 0; } .download-teaser div a { color: #6c7ea2; margin: 12px 0 5px; text-decoration: none; } .download-teaser div a:hover, .download-teaser div a:focus { text-decoration: underline; } .grid > div.right-image { float: right; } .video-wrapper { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; margin-bottom: 2em; } /* pflegbare Listen unabhaengig vom grid */ .visual-wrapper .grid .content-wrapper ul, .visual-wrapper .grid .content-wrapper ol, .content .content-wrapper ul, .content .content-wrapper ol { margin-bottom: 25px; font-size: 1em; } .visual-wrapper .grid .content-wrapper ol ol, .visual-wrapper .grid .content-wrapper ul ul, .visual-wrapper .grid .content-wrapper ol ul, .visual-wrapper .grid .content-wrapper ul ol, .content .content-wrapper ol ol, .content .content-wrapper ul ul, .content .content-wrapper ol ul, .content .content-wrapper ul ol { margin-top: 0.5em; } .visual-wrapper .grid .content-wrapper li, .content .content-wrapper li { font-size: 1.5em; line-height: 1.33333; margin: 0 0 0.5em; padding-left: 1.5em; } .visual-wrapper .grid .content-wrapper ol li, .content .content-wrapper ol li { padding-left: 0; } .visual-wrapper .grid .content-wrapper li li, .content .content-wrapper li li { font-size: 1em; } .content .outer-grid .location-data { clear: both; } .content .outer-grid .location-data li { background: none; padding-left: 0; margin-bottom: 10px; font-size: 1.3em; } @media only screen and (min-width: 768px) { .form-locationfinder .form-button { margin-top: 25px; } } .formular.form-locationfinder h1 { padding: 0 20px; } .formular.form-locationfinder .form-input label { font-family: "TheSansBold", Arial, Verdana, sans-serif; margin-bottom: 10px; } .location-data a, .locationfinder-results a { color: #84b400; text-decoration: none; } .location-data a:hover, .locationfinder-results a:hover { color: #0a2864; } .mail:before, .phone:before, .web:before, .address:before, .fax:before { width: 25px; display: inline-block; position: relative; top: 2px; color: #9da9c1; } .mail:before { top: 4px; font-size: 1.5em; margin-top: -3px; } .phone:before { font-size: 1.3em; } .address:before { font-size: 1.1em; } .locationfinder-results { margin-bottom: 100px; } .locationfinder-results p { font-size: 1.3em; margin-bottom: 5px; } .locationfinder-results p + h1, .locationfinder-results p + h2, .locationfinder-results p + h3, .locationfinder-results p + h4, .locationfinder-results p + h5, .locationfinder-results p + h6, .locationfinder-results p + div.looks_like_a_headline { margin-top: 40px; } .formular.form-search fieldset { max-width: 570px; margin-bottom: 20px; } .formular.form-search .form-input { margin-bottom: 0; } @media only screen and (max-width: 767px) { .formular.form-search .form-input.form-grid-75 { width: 65%; } .formular.form-search .form-button.form-grid-25 { width: 35%; padding-left: 10px; } } .content ul.ui-autocomplete, ul.ui-autocomplete { position: absolute; left: 11px; right: 11px; padding-bottom: 10px; display: block; background: #fff; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); } @media only screen and (max-width: 767px) { .content ul.ui-autocomplete, ul.ui-autocomplete { left: 0; right: 0; } } .content ul.ui-autocomplete li, ul.ui-autocomplete li { display: block; background: none; margin: 0; padding: 0; } .content ul.ui-autocomplete a, ul.ui-autocomplete a { display: block; padding: 6px 10px 7px 10px; color: #3e3e3e; text-decoration: none; } .content ul.ui-autocomplete a:hover, .content ul.ui-autocomplete a:focus, ul.ui-autocomplete a:hover, ul.ui-autocomplete a:focus { text-decoration: none; } .content ul.ui-autocomplete .ui-state-focus, .content ul.ui-autocomplete li:hover, .content ul.ui-autocomplete li:focus, ul.ui-autocomplete .ui-state-focus, ul.ui-autocomplete li:hover, ul.ui-autocomplete li:focus { background: #e6e9ef; border: none; } .searchresults-info { margin-bottom: 20px; display: block; font-size: 1.3em; } .searchresults { list-style: none; padding: 0; } @media only screen and (min-width: 768px) { .searchresults { width: 65%; max-width: 570px; float: left; } } .searchresults li { margin-bottom: 60px; } .searchresults h2, .searchresults div.looks_like_a_headline { font-size: 1.8em; margin-bottom: 10px; } .searchresults p { margin-bottom: 15px; } .content .searchresults .trail { margin: 0; padding: 0; } .content .searchresults .trail li:last-child a:after { content: ''; } .searchresults-loader { clear: both; margin-bottom: 60px; display: none; height: 50px; background: url(/typo3conf/ext/twt_download/Resources/Public/Images/ista_loading.gif) center center no-repeat white; } @media only screen and (min-width: 768px) { .searchresults-loader { width: 65%; max-width: 570px; float: left; } } p .results-highlight { font-weight: bold; } h2 .results-highlight { font-family: "TheSansExtraBold", Arial, Verdana, sans-serif; } @media only screen and (min-width: 768px) { .searchresults-filter { float: right; width: 30%; } } .searchresults-filter dl { font-size: 1em; margin-bottom: 40px; } @media only screen and (max-width: 767px) { .searchresults-filter dl { padding-left: 0; } } .searchresults-filter dt { font-size: 1.8em; font-weight: normal; font-family: "TheSansBold", Arial, Verdana, sans-serif; color: #0a2864; margin: 0 0 15px 0; } .searchresults-filter dd { font-size: 1.3em; margin: 0 0 15px 0; } .searchresults-filter dd a { text-decoration: none; } .content .outer-grid ul.history { width: 100%; margin-bottom: 4em; background: url(/fileadmin/twt_customer/base/system/templates/images/bg_history.png) center repeat-y; } @media only screen and (max-width: 767px) { .content .outer-grid ul.history { background: none; } } .content .outer-grid ul.history li { position: relative; padding: 0; background: #e6e9ef; } @media only screen and (min-width: 768px) { .content .outer-grid ul.history li { width: 46%; margin-bottom: 0; } } @media only screen and (max-width: 767px) { .content .outer-grid ul.history li { display: inline-block; width: 100%; margin-bottom: 20px; } } .content .outer-grid ul.history li:first-child:after { content: ' '; width: 10px; height: 28px; background: #fff; display: block; position: absolute; top: 0; right: -10%; } @media only screen and (max-width: 767px) { .content .outer-grid ul.history li:first-child:after { display: none; } } @media only screen and (min-width: 768px) { .content .outer-grid ul.history li:nth-child(2n+1) { float: left; clear: both; margin-bottom: 25px; } } .content .outer-grid ul.history li:nth-child(2n+1) strong:after { top: 13px; right: -27px; } @media only screen and (max-width: 767px) { .content .outer-grid ul.history li:nth-child(2n+1) strong:after { content: ''; } } .content .outer-grid ul.history li:nth-child(2n+1) strong:before { left: 106.25%; } @media screen and (max-width: 1280px) and (min-width: 1080px) { .content .outer-grid ul.history li:nth-child(2n+1) strong:before { left: 106%; } } @media screen and (max-width: 1079px) and (min-width: 1024px) { .content .outer-grid ul.history li:nth-child(2n+1) strong:before { left: 105.85%; } } @media screen and (max-width: 1023px) and (min-width: 1000px) { .content .outer-grid ul.history li:nth-child(2n+1) strong:before { left: 106.5%; } } @media screen and (max-width: 999px) and (min-width: 768px) { .content .outer-grid ul.history li:nth-child(2n+1) strong:before { left: 105.85%; } } @media only screen and (min-width: 768px) { .content .outer-grid ul.history li:nth-child(2n+2) { float: right; margin-top: 25px; } } .content .outer-grid ul.history li:nth-child(2n+2) strong:after { top: 17px; left: -28px; } @media only screen and (max-width: 767px) { .content .outer-grid ul.history li:nth-child(2n+2) strong:after { content: ''; } } .content .outer-grid ul.history li:nth-child(2n+2) strong:before { right: 106.15%; } @media screen and (max-width: 1280px) and (min-width: 1080px) { .content .outer-grid ul.history li:nth-child(2n+2) strong:before { right: 105.95%; } } @media screen and (max-width: 1079px) and (min-width: 1024px) { .content .outer-grid ul.history li:nth-child(2n+2) strong:before { right: 105.95%; } } @media screen and (max-width: 1023px) and (min-width: 1000px) { .content .outer-grid ul.history li:nth-child(2n+2) strong:before { right: 106.5%; } } @media screen and (max-width: 999px) and (min-width: 768px) { .content .outer-grid ul.history li:nth-child(2n+2) strong:before { right: 105.95%; } } @media only screen and (min-width: 768px) { .content .outer-grid ul.history li:nth-child(2) { margin-top: 60px; } } .content .outer-grid ul.history li:last-child { margin-bottom: 0; } .content .outer-grid ul.history p { margin-top: 20px; padding: 0 20px; font-size: 0.8666666em; line-height: 1.76923076em; } .content .outer-grid ul.history strong { display: block; width: 100%; padding: 15px 0; text-align: center; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-weight: normal; background: #0a2864; font-size: 1.93333333333em; color: #fff; } @media only screen and (max-width: 767px) { .content .outer-grid ul.history strong { font-size: 1.6em; padding: 10px 0; } } .content .outer-grid ul.history strong:after { position: absolute; font-size: 1.5em; color: #0a2864; } .content .outer-grid ul.history strong:before { content: ' '; top: 28px; position: absolute; display: block; width: 20px; height: 20px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background: #84b400; } @media only screen and (max-width: 767px) { .content .outer-grid ul.history strong:before { display: none; } } .interactive-house { position: relative; width: 700px; max-width: 100%; height: 825px; margin: 0 auto; } @media only screen and (max-width: 767px) { .interactive-house { width: 450px; height: 442px; } } @media screen and (max-width: 479px) { .interactive-house { width: 290px; height: 382px; } } .interactive-house .hotspot { position: absolute; display: block; } @media only screen and (max-width: 767px) { .interactive-house .hotspot:not(.hotspot-info) { display: none; } } .interactive-house .hotspot img { position: absolute; top: 0; left: 0; opacity: 0; } .interactive-house .hotspot .hotspot-animation-frame-1 { opacity: 1; } .interactive-house .hotspot-info { display: block; width: 37px; height: 37px; background: url(/fileadmin/twt_customer/base/system/templates/images/hotspot-info.png) no-repeat; background-size: cover; text-indent: -9999px; } .interactive-house .hotspot-info:after { content: ' '; display: block; top: 20px; height: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line.png) repeat-x; position: absolute; } .interactive-house span[class*=hotspot-wrapper]:hover .hotspot-animation-frame-1 { opacity: 0; } .interactive-house span[class*=hotspot-wrapper]:hover .hotspot-animation-frame-2 { opacity: 1; } .interactive-house span[class*=hotspot-wrapper]:hover .hotspot-info { background: url(/fileadmin/twt_customer/base/system/templates/images/hotspot-info-hover.png) no-repeat; background-size: cover; } .interactive-house-radio { background: url(/fileadmin/twt_customer/base/system/templates/images/ista_house.png) no-repeat; background-size: contain; } @media only screen and (max-width: 767px) { .interactive-house-radio { background: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone.png) no-repeat; background-size: contain; } .interactive-house-radio.interactive-house-fr { background-image: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone-fr.png); background-size: contain; } .interactive-house-radio.interactive-house-dk { background-image: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone-dk.png); } .interactive-house-radio.interactive-house-it { background-image: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone-it.png); } } .interactive-house-radio .hotspot-wrapper-01 .hotspot-product, .interactive-house-radio .hotspot-wrapper-06 .hotspot-product, .interactive-house-radio .hotspot-wrapper-07 .hotspot-product { width: 47px; height: 35px; left: 216px; } .interactive-house-radio .hotspot-wrapper-01 .hotspot-product { top: 150px; } .interactive-house-radio .hotspot-wrapper-01 .hotspot-info { top: 135px; } .interactive-house-radio .hotspot-wrapper-01 .hotspot-info:after { width: 180px; left: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-01 .hotspot-info { top: 80px; } .interactive-house-radio .hotspot-wrapper-01 .hotspot-info:after { width: 114px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-01 .hotspot-info { top: 44px; } .interactive-house-radio .hotspot-wrapper-01 .hotspot-info:after { width: 60px; } } .interactive-house-radio .hotspot-wrapper-02 .hotspot-product { width: 54px; height: 55px; right: 195px; bottom: 254px; } .interactive-house-radio .hotspot-wrapper-02 .hotspot-info { right: 0; bottom: 264px; } .interactive-house-radio .hotspot-wrapper-02 .hotspot-info:after { width: 160px; right: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-02 .hotspot-info { bottom: 121px; } .interactive-house-radio .hotspot-wrapper-02 .hotspot-info:after { width: 103px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-02 .hotspot-info { bottom: 156px; } .interactive-house-radio .hotspot-wrapper-02 .hotspot-info:after { width: 57px; } } .interactive-house-radio .hotspot-wrapper-03 .hotspot-product { width: 54px; height: 66px; right: 350px; bottom: 245px; } .interactive-house-radio .hotspot-wrapper-03 .hotspot-info { left: 0; bottom: 35px; } .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:after { width: 285px; left: 100%; } .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:before { content: ' '; display: block; height: 195px; right: -284px; bottom: 17px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-03 .hotspot-info { bottom: 22px; } .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:before { height: 68px; bottom: 17px; right: -172px; } .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:after { width: 169px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-03 .hotspot-info { bottom: 80px; } .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:before { height: 65px; bottom: 17px; right: -100px; } .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:after { width: 99px; } } .interactive-house-radio .hotspot-wrapper-04 .hotspot-product { width: 50px; height: 68px; bottom: 470px; right: 345px; } .interactive-house-radio .hotspot-wrapper-04 .hotspot-info { right: 0; bottom: 479px; } .interactive-house-radio .hotspot-wrapper-04 .hotspot-info:after { width: 330px; right: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-04 .hotspot-info { bottom: 228px; } .interactive-house-radio .hotspot-wrapper-04 .hotspot-info:after { width: 197px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-04 .hotspot-info { bottom: 235px; } .interactive-house-radio .hotspot-wrapper-04 .hotspot-info:after { width: 114px; } } .interactive-house-radio .hotspot-wrapper-05 .hotspot-product { width: 26px; height: 41px; bottom: 355px; right: 370px; } .interactive-house-radio .hotspot-wrapper-05 .hotspot-info { right: 0; bottom: 357px; } .interactive-house-radio .hotspot-wrapper-05 .hotspot-info:after { width: 338px; right: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-05 .hotspot-info { bottom: 162px; } .interactive-house-radio .hotspot-wrapper-05 .hotspot-info:after { width: 200px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-05 .hotspot-info { bottom: 182px; } .interactive-house-radio .hotspot-wrapper-05 .hotspot-info:after { width: 118px; } } .interactive-house-radio .hotspot-wrapper-06 .hotspot-product { top: 275px; } .interactive-house-radio .hotspot-wrapper-07 .hotspot-product { top: 395px; } .interactive-house-radio .hotspot-wrapper-08 .hotspot-product { width: 54px; height: 59px; bottom: 235px; left: 135px; } .interactive-house-radio .hotspot-wrapper-08 .hotspot-info { left: 0; bottom: 243px; } .interactive-house-radio .hotspot-wrapper-08 .hotspot-info:after { width: 102px; left: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-08 .hotspot-info { bottom: 99px; } .interactive-house-radio .hotspot-wrapper-08 .hotspot-info:after { width: 69px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-08 .hotspot-info { bottom: 155px; } .interactive-house-radio .hotspot-wrapper-08 .hotspot-info:after { width: 32px; } } .interactive-house-radio .hotspot-wrapper-09 .hotspot-product { width: 72px; height: 67px; bottom: 192px; right: 167px; } .interactive-house-radio .hotspot-wrapper-09 .hotspot-info { right: 0; bottom: 197px; } .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:after { width: 135px; right: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-09 .hotspot-info { bottom: 81px; } .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:after { width: 88px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-09 .hotspot-info { bottom: 94px; } .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:before { content: ' '; display: block; bottom: 16px; left: -54px; height: 36px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:after { width: 53px; } } .interactive-house-radio .hotspot-wrapper-10 .hotspot-product, .interactive-house-radio .hotspot-wrapper-11 .hotspot-product, .interactive-house-radio .hotspot-wrapper-12 .hotspot-product { width: 96px; height: 55px; right: 150px; } .interactive-house-radio .hotspot-wrapper-10 .hotspot-product { top: 200px; } .interactive-house-radio .hotspot-wrapper-10 .hotspot-info { right: 0; top: 196px; } .interactive-house-radio .hotspot-wrapper-10 .hotspot-info:after { width: 116px; right: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-10 .hotspot-info { top: 113px; } .interactive-house-radio .hotspot-wrapper-10 .hotspot-info:after { width: 78px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-10 .hotspot-info { top: 68px; } .interactive-house-radio .hotspot-wrapper-10 .hotspot-info:after { width: 37px; } } .interactive-house-radio .hotspot-wrapper-11 .hotspot-product { top: 288px; } .interactive-house-radio .hotspot-wrapper-12 .hotspot-product { top: 404px; } .interactive-house-radio .hotspot-wrapper-13 .hotspot-product, .interactive-house-radio .hotspot-wrapper-14 .hotspot-product, .interactive-house-radio .hotspot-wrapper-15 .hotspot-product { width: 40px; height: 56px; left: 140px; } .interactive-house-radio .hotspot-wrapper-13 .hotspot-product { bottom: 460px; } .interactive-house-radio .hotspot-wrapper-13 .hotspot-info { left: 0; bottom: 462px; } .interactive-house-radio .hotspot-wrapper-13 .hotspot-info:after { width: 110px; left: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-13 .hotspot-info { top: 184px; } .interactive-house-radio .hotspot-wrapper-13 .hotspot-info:after { width: 74px; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-13 .hotspot-info { top: 115px; } .interactive-house-radio .hotspot-wrapper-13 .hotspot-info:after { width: 34px; } } .interactive-house-radio .hotspot-wrapper-14 .hotspot-product { bottom: 343px; } .interactive-house-radio .hotspot-wrapper-15 .hotspot-product { top: 195px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-product, .interactive-house-radio .hotspot-wrapper-17 .hotspot-product, .interactive-house-radio .hotspot-wrapper-18 .hotspot-product, .interactive-house-radio .hotspot-wrapper-19 .hotspot-product, .interactive-house-radio .hotspot-wrapper-20 .hotspot-product, .interactive-house-radio .hotspot-wrapper-21 .hotspot-product { width: 22px; height: 32px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-product, .interactive-house-radio .hotspot-wrapper-17 .hotspot-product, .interactive-house-radio .hotspot-wrapper-18 .hotspot-product { left: 250px; } .interactive-house-radio .hotspot-wrapper-19 .hotspot-product, .interactive-house-radio .hotspot-wrapper-20 .hotspot-product, .interactive-house-radio .hotspot-wrapper-21 .hotspot-product { right: 263px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-product, .interactive-house-radio .hotspot-wrapper-19 .hotspot-product { top: 220px; } .interactive-house-radio .hotspot-wrapper-17 .hotspot-product, .interactive-house-radio .hotspot-wrapper-20 .hotspot-product { top: 330px; } .interactive-house-radio .hotspot-wrapper-18 .hotspot-product, .interactive-house-radio .hotspot-wrapper-21 .hotspot-product { top: 430px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-info { top: 235px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:after { width: 225px; left: 100%; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:before { content: ' '; display: block; bottom: 16px; right: -226px; height: 5px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-16 .hotspot-info { top: 130px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:after { width: 136px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:before { display: none; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-16 .hotspot-info { top: 79px; } .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:after { width: 79px; } } .interactive-house-radio .hotspot-wrapper-22 .hotspot-product { width: 43px; height: 49px; left: 194px; top: 170px; } .interactive-house-radio .hotspot-wrapper-22 .hotspot-info { top: 183px; } .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:after { width: 180px; left: 100%; } @media only screen and (max-width: 767px) { .interactive-house-radio .hotspot-wrapper-22 .hotspot-info { top: 133px; } .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:after { width: 108px; } .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:before { content: ' '; display: block; height: 17px; right: -110px; bottom: 17px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } } @media screen and (max-width: 479px) { .interactive-house-radio .hotspot-wrapper-22 .hotspot-info { top: 79px; } .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:after { width: 59px; } .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:before { right: -59px; height: 10px; } } .interactive-house-mbus { background: url(/fileadmin/twt_customer/base/system/templates/images/ista_house-mbus.png) no-repeat; background-size: contain; } @media only screen and (max-width: 767px) { .interactive-house-mbus { background: url(/fileadmin/twt_customer/base/system/templates/images/house-02-phone.png) no-repeat; background-size: contain; } } .interactive-house-mbus .hotspot-wrapper-01 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-02 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-03 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-04 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-05 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-06 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-07 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-08 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-09 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-10 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-14 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-15 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-16 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-17 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-18 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-19 .hotspot-product { width: 40px; height: 40px; } .interactive-house-mbus .hotspot-wrapper-01 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-02 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-03 .hotspot-product { left: 156px; } .interactive-house-mbus .hotspot-wrapper-01 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-14 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-04 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-17 .hotspot-product { top: 192px; } .interactive-house-mbus .hotspot-wrapper-02 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-15 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-06 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-18 .hotspot-product { top: 296px; } .interactive-house-mbus .hotspot-wrapper-03 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-16 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-05 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-19 .hotspot-product { top: 423px; } .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info { top: 459px; } .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:after { width: 140px; left: 100%; } .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:before { content: ' '; display: block; width: 5px; height: 20px; bottom: 17px; right: -142px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info { top: 239px; } .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:after { width: 68px; } .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:before { display: none; } } @media screen and (max-width: 479px) { .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info { top: 103px; } .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:after { width: 34px; } } .interactive-house-mbus .hotspot-wrapper-04 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-05 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-06 .hotspot-product { right: 155px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-08 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-09 .hotspot-product { left: 255px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-product { top: 192px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info { top: 227px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:after { width: 244px; left: 100%; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:before { content: ' '; display: block; height: 20px; bottom: 17px; right: -244px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info { top: 129px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:after { width: 128px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:before { height: 10px; bottom: 16px; right: -129px; } } @media screen and (max-width: 479px) { .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info { top: 38px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:before { height: 17px; top: 25px; right: -75px; } .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:after { width: 73px; } } .interactive-house-mbus .hotspot-wrapper-08 .hotspot-product { top: 296px; } .interactive-house-mbus .hotspot-wrapper-09 .hotspot-product { top: 423px; } .interactive-house-mbus .hotspot-wrapper-10 .hotspot-product { top: 536px; left: 156px; } .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info { top: 700px; left: 157px; } .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info:before { content: ' '; display: block; bottom: 100%; height: 130px; left: 17px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info { top: 400px; left: 98px; } .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info:before { height: 65px; left: 15px; } } @media screen and (max-width: 479px) { .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info { top: 275px; left: 57px; } .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info:before { height: 59px; } } .interactive-house-mbus .hotspot-wrapper-11 .hotspot-product { width: 57px; height: 88px; top: 546px; right: 112px; } .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info { top: 578px; right: 0; } .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info:after { width: 89px; right: 100%; } @media only screen and (max-width: 767px) { .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info { top: 326px; } .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info:after { width: 76px; } } @media screen and (max-width: 479px) { .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info { top: 207px; } .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info:after { width: 37px; } } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-product { width: 57px; height: 52px; top: 521px; right: 180px; } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info { top: 700px; right: 152px; } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:after { width: 20px; right: 15px; top: -151px; } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:before { content: ' '; display: block; bottom: 100%; height: 151px; left: 17px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info { top: 400px; right: 127px; } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:before { height: 78px; right: 15px; } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:after { width: 5px; top: -78px; right: 16px; } } @media screen and (max-width: 479px) { .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info { top: 275px; right: 75px; } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:before { right: 15px; height: 66px; } .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:after { width: 4px; top: -66px; } } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-product { width: 57px; height: 26px; top: 574px; right: 180px; } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info { top: 700px; right: 238px; } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:after { left: 23px; top: -111px; width: 23px; } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:before { content: ' '; display: block; bottom: 100%; height: 111px; left: 17px; width: 5px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info { top: 400px; right: 173px; } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:before { height: 54px; right: 15px; } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:after { width: 22px; top: -60px; left: 18px; } } @media screen and (max-width: 479px) { .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info { top: 275px; right: 140px; } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:before { right: 15px; height: 49px; } .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:after { width: 50px; top: -56px; } } .interactive-house-mbus .hotspot-wrapper-14 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-15 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-16 .hotspot-product { left: 196px; } .interactive-house-mbus .hotspot-wrapper-17 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-18 .hotspot-product, .interactive-house-mbus .hotspot-wrapper-19 .hotspot-product { right: 119px; } .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info { top: 332px; } .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:after { width: 180px; left: 100%; } .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:before { content: ' '; display: block; width: 5px; height: 20px; bottom: 17px; right: -182px; background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y; position: absolute; } @media only screen and (max-width: 767px) { .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info { top: 190px; } .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:after { width: 100px; } .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:before { height: 10px; bottom: 16px; right: -102px; } } @media screen and (max-width: 479px) { .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info { top: 165px; } .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:before { right: -54px; } .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:after { width: 54px; } } .interactive-house-mbus.mbus-variant { background-image: url(/fileadmin/twt_customer/base/system/templates/images/ista_house-mbus_variant.png); } .cookie-overlay { width: 100%; max-height: 0; position: fixed; -webkit-transform: translateZ(0); bottom: 0; z-index: 1000; background: rgba(10, 40, 100, 0.95); color: #fff; -webkit-transition: max-height 0.5s; -moz-transition: max-height 0.5s; -ms-transition: max-height 0.5s; transition: max-height 0.5s; } .cookie-overlay .buttonlink, .cookie-overlay .formular .form-input-tsr input, .formular .form-input-tsr .cookie-overlay input, .cookie-overlay .formular .form-input-tb input, .formular .form-input-tb .cookie-overlay input, .cookie-overlay .formular .form-button button, .formular .form-button .cookie-overlay button { margin-right: 20px; background: #fff; color: #0a2864; } .cookie-overlay .buttonlink:hover, .cookie-overlay .formular .form-input-tsr input:hover, .formular .form-input-tsr .cookie-overlay input:hover, .cookie-overlay .formular .form-input-tb input:hover, .formular .form-input-tb .cookie-overlay input:hover, .cookie-overlay .formular .form-button button:hover, .formular .form-button .cookie-overlay button:hover { background: #84b400; color: #fff; } .cookie-overlay .grid { position: static; margin-bottom: 0; } .cookie-overlay .grid > div { position: relative; overflow: auto; padding-top: 20px; } .cookie-overlay h1, .cookie-overlay h2, .cookie-overlay h3, .cookie-overlay h4, .cookie-overlay h5, .cookie-overlay h6, .cookie-overlay div.looks_like_a_headline { color: #fff; margin-bottom: 10px; } .cookie-overlay p { padding-right: 50px; } .cookie-overlay a { color: #fff; } .cookie-overlay a:hover { color: #84b400; } .cookie-overlay .metanavigation-close { text-decoration: none; top: 0; } .cookie-overlay-open { -webkit-transition: max-height 10s; -moz-transition: max-height 10s; -ms-transition: max-height 10s; transition: max-height 10s; max-height: 500px; } .cookie-overlay-open.cookie-overlay-scrolling { top: 0; min-height: 100%; max-height: 100%; overflow: scroll; } .TheSansRegular { font-family: "TheSansRegular", Arial, Verdana, sans-serif; } .TheSansBold { font-family: "TheSansBold", Arial, Verdana, sans-serif; } .TheSansExtraBold { font-family: "TheSansExtraBold", Arial, Verdana, sans-serif; } .TheSansItalic { font-family: "TheSansItalic", Arial, Verdana, sans-serif; } form .grid { overflow: visible; } .grid-50 input { width: 98%; } input, textarea, select { font-size: 1.4em; } input[type="text"], input[type="password"], input[type="email"], input[type="date"], input[type="number"] { box-sizing: border-box; height: 35px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 1px solid #ced4e0; padding: 0 10px; margin: 0 0 20px; width: 100%; display: block; clear: both; } input[type="checkbox"], input[type="radio"] { display: inline-block; } /* Label */ label, .form-radiobutton b, .form-checkbox b { font-size: 1.3em; display: block; margin-bottom: 5px; } .form-radio-button b, .form-checkbox b { margin-bottom: 10px; } .form-radio-button input[disabled="disabled"] + label, .form-checkbox input[disabled="disabled"] + label { color: #999; } .form-radiolist > b { margin-bottom: 15px; } input ~ label { display: inline-block; } /* Textarea */ textarea { box-sizing: border-box; width: 100%; height: 200px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 1px solid #ced4e0; padding: 10px 10px; margin: 5px 0 20px; } .postfix input { float: left; width: calc(100% - 40px); border-top-right-radius: 0; border-bottom-right-radius: 0; } .postfix button { height: 35px; width: 37px; float: right; position: relative; border-top-right-radius: 3px; border-bottom-right-radius: 3px; padding: 10px 20px; } .postfix button:before { position: absolute; right: 12px; } .postfix button:active, .postfix button.active { background-color: #84b400; } legend, .form-headline { color: #0a2864; font-size: 2em; font-weight: bold; margin: 0 10px 10px 10px; } /* Selects */ @media only screen { select { font-size: 1.5em; width: 100%; margin-bottom: 20px; } .content .grid-75 .select .help-block, .content .grid-100 .select .help-block { font-size: 1em; } .styledSelect, .options { display: none; } } @media only screen and (min-width: 768px) { .select.select-50 { float: left; width: 48%; } } @media only screen and (min-width: 1280px) { .s-hidden { visibility: hidden; padding-right: 10px; } select { margin-bottom: 0; } .content .grid-75 .select, .content .grid-100 .select { color: #000; cursor: pointer; display: inline-block; line-height: 35px; position: relative; } .content .grid-75 .select.select-50, .content .grid-100 .select.select-50 { width: 49%; margin-bottom: 20px; } .content .grid-75 .select .help-block, .content .grid-100 .select .help-block { width: 100%; top: 25px; position: absolute; } .content .grid-75 .select .help-block:before, .content .grid-100 .select .help-block:before { top: -20px; right: 10px; } .content .grid-75 .select .styledSelect, .content .grid-100 .select .styledSelect { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background: #0a2864; border: none; bottom: 0; color: #fff; font-size: 1.4em; left: 0; padding: 0 10px; position: absolute; right: 0; top: 0; z-index: 2; } .content .grid-75 .select .styledSelect:before, .content .grid-100 .select .styledSelect:before { font-size: 1.4em; float: right; position: relative; top: 9px; } .content .grid-75 .select .styledSelect:after, .content .grid-100 .select .styledSelect:after { border-right: 1px solid #6c7ea2; float: right; content: ""; height: 35px; margin-right: 5px; } .content .grid-75 .select .styledSelect:active, .content .grid-75 .select .styledSelect.active, .content .grid-100 .select .styledSelect:active, .content .grid-100 .select .styledSelect.active { background-color: #84b400; } .content .grid-75 .select .styledSelect:active:after, .content .grid-75 .select .styledSelect.active:after, .content .grid-100 .select .styledSelect:active:after, .content .grid-100 .select .styledSelect.active:after { border-right: 1px solid #e6e9ef; } .content .grid-75 .select .options, .content .grid-100 .select .options { border: 1px solid #9da9c1; background-color: #fff; display: none; left: 0; list-style: none; margin: 0 0; padding: 1px 0 0; position: absolute; right: 0; top: 33px; z-index: 1; } .content .grid-75 .select .options li, .content .grid-100 .select .options li { background: none; line-height: 2.4; margin: 0; padding: 0 9px; } .content .grid-75 .select .options li:hover, .content .grid-100 .select .options li:hover { background-color: #6c7ea2; color: #fff; } .styledSelect, .options { display: block; } } .formular fieldset { position: relative; background: #e6e9ef; padding: 20px 20px 5px 20px; margin-bottom: 5em; } .formular fieldset a { color: #0a2864; } .formular fieldset a:hover, .formular fieldset a:focus { text-decoration: underline; } .formular fieldset fieldset { padding: 0; margin-bottom: 0; } .formular .price-heat { background-image: url('../..//fileadmin/twt_customer/base/system/templates/images/price_heat_bg.png'); background-repeat: no-repeat; background-position: right 3em; } .formular .price-heat-small { background-image: url('../..//fileadmin/twt_customer/base/system/templates/images/price_heat_small_bg.png'); background-repeat: no-repeat; background-position: right 3em; } .formular .price-water { background-image: url('../..//fileadmin/twt_customer/base/system/templates/images/price_water_bg.png'); background-repeat: no-repeat; background-position: right 3em; } .formular .price-water-small { background-image: url('../..//fileadmin/twt_customer/base/system/templates/images/price_water_small_bg.png'); background-repeat: no-repeat; background-position: right 3em; } .formular .price-gas { background-image: url('../..//fileadmin/twt_customer/base/system/templates/images/pulsonic.png'); background-repeat: no-repeat; background-position: right 3em; } .formular legend { float: left; clear: both; width: 100%; margin: 0 0 1em 0; padding: 0; } .formular img { margin-bottom: 20px; } .formular .form-hint, .formular ul.form-list li, .formular ol.form-list li, .formular .csc-form-element-textblock { font-size: 1.3em; } .formular ol.form-list li { margin-bottom: 10px; } .formular ul.form-list li { margin-left: 15px; margin-bottom: 10px; } .formular .form-list { margin-bottom: 25px; } .formular .form-button-right { float: right; } .formular .form-input, .formular .form-textarea, .formular .form-checkbox, .formular .form-submit, .formular .form-select, .formular .form-multiple-select, .formular .form-radiobutton, .formular .form-file, .formular .form-duplicate-button, .formular .csc-form-element-submit { position: relative; margin-bottom: 2.5em; } .formular .form-select select, .formular .form-multiple-select select { clear: both; } .formular .form-input label, .formular .form-textarea label, .formular .form-captcha label, .formular .form-captcha label, .formular .form-select > label, .formular .form-multiple-select > label, .formular .form-file label { display: inline-block; font-weight: normal; float: left; } .formular .form-radiobutton > div, .formular .form-checkbox > div { display: table; position: relative; max-width: 60%; } @media only screen and (min-width: 1280px) { .formular .form-radiobutton > div, .formular .form-checkbox > div { max-width: 90%; } } .formular .form-radiobutton > div > b, .formular .form-checkbox > div > b { float: left; padding-right: 30px; } .formular .form-radiobutton > div .form-help-link, .formular .form-checkbox > div .form-help-link { position: absolute; right: 0; left: auto; } .formular .form-radiobutton b, .formular .form-checkbox b { display: block; font-weight: normal; } .formular .form-checkbox > label, .formular .form-group.form-checkbox > label, .formular .form-radiolist.form-radiobutton > label { float: left; display: block; max-width: 85%; margin-bottom: 10px; } .formular .form-checkbox > input, .formular .form-radiolist > input { float: left; clear: left; margin-top: 2px; margin-right: 7px; } .formular .form-input input, .formular .form-captcha input, .formular .form-textarea textarea { width: 100%; margin-bottom: 0; } .formular .form-select, .formular .form-multiple-select { font-size: 1.3em; } .formular .form-select > fieldset, .formular .form-multiple-select > fieldset { font-size: 0.76923076923077em; } .formular .form-select .select, .formular .form-multiple-select .select { width: 100%; min-height: 35px; } .formular .form-select > label, .formular .form-select > .help-block, .formular .form-select > .select .styledSelect, .formular .form-select .select .options li, .formular .form-multiple-select > label, .formular .form-multiple-select > .help-block, .formular .form-multiple-select > .select .styledSelect, .formular .form-multiple-select .select .options li { font-size: 1em; } .formular .form-select select, .formular .form-multiple-select select { display: block; font-family: Arial, Verdana, sans-serif; line-height: 1; width: 100%; font-size: 1em; } .formular .form-select.has-success:before, .formular .form-multiple-select.has-success:before, .formular .form-checkbox.has-success:before, .formular .form-radiobutton.has-success:before { content: ''; } .formular #form-file-upload { width: 60%; } .formular .indent { margin: 0 0 15px 40%; } .formular div.form-hidden, .formular input.form-hidden, .formular input[type="hidden"] { float: none; display: none; } .formular .form-input label span, .formular .form-textarea label span, .formular .form-checkbox span, .formular .form-radiobutton span, .formular .form-select span, .formular .form-multiple-select span, .formular .form-file span, .formular .form-hint span, .formular span.form-required { color: red; } .formular .form-input label small, .formular .form-textarea label small { font-size: 1em; } .formular .form-group > label { margin: 0 15px 0 0; } .formular .form-error-box { color: red; padding: 5px 20px 5px 5px; margin: 0 0 15px 30px; font-size: 1.3em; } .formular .form-error-box li { margin-bottom: 0.5em; } .content .formular .form-error-box ul li { background: none; padding-left: 0; font-size: 1.3em; } .formular .form-error label, .formular .form-error b { color: red; } .formular .form-error > input, .formular .form-error > textarea, .formular .has-error > input, .formular .has-error > textarea { border: 1px solid red; } .formular .form-error .help-block, .formular .has-error .help-block { color: red; clear: both; } .formular .form-error .help-block:before, .formular .has-error .help-block:before { z-index: 10; } .formular .has-success > input, .formular .has-success > textarea { border: 1px solid #84b400; } .formular .has-success:before { position: absolute; bottom: 10px; right: 15px; font-size: 1.5em; color: #84b400; z-index: 10; } .formular .help-block { position: relative; display: block; margin: 0.5em 0 0 0; font-size: 1.3em; } .formular .help-block:before { position: absolute; top: -30px; right: 15px; } .formular table td, .formular table th { position: relative; } .formular table td.has-success:before, .formular table th.has-success:before { display: none; } .formular table td input, .formular table th input { font-size: 1em; } .form-input .help-block:before, .form-input.has-success:before { background: #fff; width: 15px; text-align: right; } .form-input.has-success:before { width: 25px; } .form-target-hidden-01, .form-target-hidden-02, .form-target-hidden-03, .form-target-hidden-04, .form-target-hidden-05 { display: none; margin-top: 25px; clear: both; } .form-checkbox.form-group > .form-target-hidden-01, .form-checkbox.form-group > .form-target-hidden-02, .form-checkbox.form-group > .form-target-hidden-03, .form-checkbox.form-group > .form-target-hidden-04, .form-checkbox.form-group > .form-target-hidden-05 { padding-top: 15px; } .form-target-hidden-01 legend, .form-target-hidden-02 legend, .form-target-hidden-03 legend, .form-target-hidden-04 legend, .form-target-hidden-05 legend { font-size: 1.5em; } .form-target-hidden-01 > div:last-child:not(.form-added-content-01) > div, .form-target-hidden-02 > div:last-child:not(.form-added-content-01) > div, .form-target-hidden-03 > div:last-child:not(.form-added-content-01) > div, .form-target-hidden-04 > div:last-child:not(.form-added-content-01) > div, .form-target-hidden-05 > div:last-child:not(.form-added-content-01) > div { margin-bottom: 0; } .form-target-01:checked ~ .form-target-hidden-01, .form-target-02:checked ~ .form-target-hidden-02, .form-target-03:checked ~ .form-target-hidden-03, .form-target-04:checked ~ .form-target-hidden-04, .form-target-05:checked ~ .form-target-hidden-05, select.form-target-01 ~ .form-target-hidden-01, select.form-target-02 ~ .form-target-hidden-02, select.form-target-03 ~ .form-target-hidden-03, select.form-target-04 ~ .form-target-hidden-04, select.form-target-05 ~ .form-target-hidden-05, .form-target-sub-01:checked ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-01, .form-target-sub-02:checked ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-02, select.form-target-sub-01 ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-01, select.form-target-sub-02 ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-02, .form-add-button-01:checked ~ .form-added-content-01 { display: block; } .form-target-hidden-sub-01, .form-target-hidden-sub-02, .form-added-content-01, .form-added-content-02, fieldset[class*="form-target-hidden-"].form-target-hidden-sub-01, input[class*="form-target-"]:checked ~ fieldset[class*="form-target-hidden-"].form-target-hidden-sub-01, fieldset[class*="form-target-hidden-"].form-target-hidden-sub-02, input[class*="form-target-"]:checked ~ fieldset[class*="form-target-hidden-"].form-target-hidden-sub-02 { display: none; } /*.formular input.form-add-button-01 { display: none; & + label { width: 100%; color: $primaryColor; font-weight: bold; cursor: pointer; span { color: $primaryColor; } &:hover, &:hover span { text-decoration: underline; } .form-remove-text { display: none; } &:before { content: '+ '; } } // aktiver Zustand &:checked + label { margin-bottom: 25px; .form-remove-text { display: inline-block; } .form-add-text { display: none; } &:before { content: '- '; } } }*/ .form-add-button, .form-remove-button { color: #0a2864; font-size: 1.3em; font-weight: bold; text-decoration: none; cursor: pointer; clear: both; display: table; margin: 0 0 10px 0; padding: 5px 0 2px 27px; background: url(/fileadmin/twt_customer/base/system/templates/images/ico_plus.gif) top left no-repeat; background-size: auto 25px; } .form-add-button:hover, .form-remove-button:hover { text-decoration: underline; } .form-add-button:last-child, .form-remove-button:last-child { margin-bottom: 0; } .form-remove-button { background-image: url(/fileadmin/twt_customer/base/system/templates/images/ico_minus.gif); } .form-help-above { position: absolute; right: 25px; } .form-help-above .form-help-text { top: -15px; left: auto; right: 160%; } .form-help-above .form-help-text:after { top: 0; left: auto; right: -31px; text-shadow: 2px 1px 1px rgba(62, 62, 62, 0.05); } .form-help-link { position: relative; display: inline-block; top: -5px; left: 5px; margin-bottom: -5px; float: left; height: 25px; width: 25px; background: url(/fileadmin/twt_customer/base/system/templates/images/ico_faq.png) no-repeat; background-size: cover; text-indent: -9999px; } .form-help-text { display: none; position: absolute; top: 0; left: 102%; background: #fff; width: 100%; min-width: 250px; max-width: 250px; min-height: 40px; padding: 15px 25px; -webkit-box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25); -moz-box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25); box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25); z-index: 15; } .form-grid-100.form-select > .form-help-text, .form-grid-100.form-multiple-select > .form-help-text { left: 52%; } .form-help-text p { font-size: 1.3em; } .form-select > .form-help-text p, .form-multiple-select > .form-help-text p { font-size: 1em; } .form-help-text p:last-child { margin-bottom: 0; } .form-help-text:after { color: #fff; position: absolute; left: -33px; top: 10px; font-size: 5em; line-height: 1; text-shadow: -2px 1px 1px rgba(62, 62, 62, 0.05); z-index: -1; } .form-select > .form-help-text:after, .form-multiple-select > .form-help-text:after { font-size: 3.84615384em; } .form-help-text.form-help-visible { display: block; } table .form-help-text p { font-size: 1em; } table .form-help-text:after { font-size: 3.84615384em; } .content .form-help-text ul { margin-bottom: 25px; } .content .form-help-text ul li { font-size: 1.3em; } /* IE9 Fix */ .form-select .form-help-text:after, .form-multiple-select .form-help-text:after { font-size: 3.25rem\0; } .form-select > .select .styledSelect:before, .form-multiple-select > .select .styledSelect:before { font-size: 0.65rem\0; } .form-help-left { left: auto; right: 102%; } .form-help-left:after { left: auto; right: -31px; text-shadow: 2px 1px 1px rgba(62, 62, 62, 0.05); } @media only screen and (max-width: 767px) { .formular .form-radiobutton > div, .formular .form-checkbox > div { width: 100%; max-width: none; } .form-help-text { position: relative; left: auto; top: auto; right: auto; width: 100%; clear: both; } } .form-grid img { margin-top: 10px; } @media only screen and (min-width: 768px) { .form-grid { margin-left: -10px; margin-right: -10px; } } .form-grid > div { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; } @media only screen and (min-width: 768px) { .form-grid > div { padding: 0 10px; } } @media only screen and (min-width: 768px) { .form-grid .form-hint { padding: 0 10px; } } .form-grid-25 { width: 25%; } .form-grid-33 { width: 33.3333333333%; } .form-grid-33 .form-grid-100.form-select > .select, .form-grid-33.form-select > .select { width: 100%; max-width: none; display: block; } .form-grid-50 { width: 50%; } .form-grid-75 { width: 75%; } .form-grid-100 { width: 100%; } .form-grid-100.form-select > select, .form-grid-100.form-select > .select, .form-grid-100.form-multiple-select > select, .form-grid-100.form-multiple-select > .select { max-width: 50%; display: block; clear: both; } @media only screen and (max-width: 767px) { .form-grid-25, .form-grid-33, .form-grid-50, .form-grid-75 { width: 100%; padding: 0; } } .form-grid > .form-summary, .form-summary { width: auto; float: none; margin: 0 10px 5em 10px; padding: 20px 20px 0 20px; background: #e6e9ef; } .form-grid > .form-summary h1, .form-summary h1 { font-size: 2em; margin-bottom: 10px; } .form-grid > .form-summary h2, .form-summary h2 { float: left; } .form-grid > .form-summary .editlink, .form-summary .editlink { float: right; } .form-grid > .form-summary dl, .form-grid > .form-summary ul, .form-summary dl, .form-summary ul { display: inline-block; width: 100%; clear: both; padding: 0; } .form-grid > .form-summary dl, .form-grid > .form-summary dt, .form-grid > .form-summary dd, .form-summary dl, .form-summary dt, .form-summary dd { margin: 0; } .form-grid > .form-summary dt, .form-summary dt { color: #0a2864; margin-bottom: 5px; } .form-grid > .form-summary dd, .form-summary dd { margin-bottom: 25px; } .form-grid > .form-summary ul, .form-summary ul { margin-bottom: 25px; } .form-grid > .form-summary p, .form-summary p { display: inline-block; } .form-grid > .form-summary a:not(.editlink), .form-summary a:not(.editlink) { color: #0a2864; text-decoration: none; } .form-grid > .form-summary a:not(.editlink):hover, .form-grid > .form-summary a:not(.editlink):focus, .form-summary a:not(.editlink):hover, .form-summary a:not(.editlink):focus { color: #84b400; } .formular .form-grid > .form-summary p, .formular .form-grid > .form-summary li, .formular .form-summary p, .formular .form-summary li { font-size: 1.3em; } .formular .form-grid > .form-summary ol li, .formular .form-summary ol li { margin-bottom: 10px; } .formular .form-grid > .form-summary ul li, .formular .form-summary ul li { margin-left: 15px; margin-bottom: 10px; } .formular .form-grid > .form-summary ol, .formular .form-grid > .form-summary ul, .formular .form-summary ol, .formular .form-summary ul { margin-bottom: 25px; } .form-twa { margin-bottom: 5em; } .form-step { padding: 0; margin: 0 0 2em 0; font-size: 1.3em; list-style-position: inside; } .form-step strong { font-weight: normal; } .form-step li { position: relative; float: left; background: #e6e9ef; padding: 5px 8px 5px 23px; } .form-step li:after { position: absolute; right: -26px; font-size: 3.2em; top: -9px; z-index: 10; color: #e6e9ef; text-shadow: 2px 0px 0px #fff; } .form-step li:first-child { padding-left: 10px; } .form-step .form-step-done { background: #9da9c1; color: #fff; } .form-step .form-step-done:after { color: #9da9c1; } .form-step .form-step-done a { color: #fff; text-decoration: none; } .form-step .form-step-done a:hover, .form-step .form-step-done a:focus { text-decoration: underline; } .form-step .form-step-current { background: #6c7ea2; color: #fff; } .form-step .form-step-current:after { color: #6c7ea2; } .form-legend-small { font-size: 1.5em; } .form-twa-online-form, .form-twa-wwb-2 { display: none; } .form-watermeter h2 { font-size: 1.5em; } span.form-required { color: red; } /* Text + Bild Elemente */ .formular .form-grid .csc .image-wrapper { margin-bottom: 20px; } .formular .form-grid .csc .image-wrapper > img { margin-bottom: 10px; } .formular .accordion { margin-bottom: 2.5em; } /* Stile fuer die Formulare aus der Extension */ .csc-form-element { margin-bottom: 2.5em; } .csc-form-element input { margin-bottom: 0; } .csc-form-element label strong { display: block; color: red; font-weight: normal; margin: 5px 0; } .csc-form-element label em { text-indent: -9999px; position: relative; display: inline-block; } .csc-form-element label em:before { content: ' *'; position: absolute; left: 5px; top: 0; display: block; text-indent: 0; color: red; } .csc-form-element-radio + .csc-form-element-radio, .csc-form-element-checkbox + .csc-form-element-checkbox { margin-top: -2.5em; } .csc-form-element-submit { text-align: right; } .csc-form-element-submit input { background: #0a2864; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.4em; padding: 10px 20px; text-decoration: none; color: white; line-height: 1.2; border: none; margin: 0 0 15px; display: inline-block; } .csc-form-element-submit input:hover { background: #84b400; } /* JS Form field controls */ .form-field-controls { margin: -3em 0 5em 0; } .form-field-controls .buttonlink, .form-field-controls .formular .form-input-tsr input, .formular .form-input-tsr .form-field-controls input, .form-field-controls .formular .form-input-tb input, .formular .form-input-tb .form-field-controls input, .form-field-controls .formular .form-button button, .formular .form-button .form-field-controls button { margin-right: 5px; padding: 10px 20px; color: #0a2864; background: #e6e9ef; } .form-field-controls .buttonlink span, .form-field-controls .formular .form-input-tsr input span, .formular .form-input-tsr .form-field-controls input span, .form-field-controls .formular .form-input-tb input span, .formular .form-input-tb .form-field-controls input span, .form-field-controls .formular .form-button button span, .formular .form-button .form-field-controls button span { display: inline-block; margin-right: 3px; font-weight: 700; } .form-field-controls .buttonlink:before, .form-field-controls .formular .form-input-tsr input:before, .formular .form-input-tsr .form-field-controls input:before, .form-field-controls .formular .form-input-tb input:before, .formular .form-input-tb .form-field-controls input:before, .form-field-controls .formular .form-button button:before, .formular .form-button .form-field-controls button:before { display: none; } .form-field-controls .buttonlink:hover, .form-field-controls .formular .form-input-tsr input:hover, .formular .form-input-tsr .form-field-controls input:hover, .form-field-controls .formular .form-input-tb input:hover, .formular .form-input-tb .form-field-controls input:hover, .form-field-controls .formular .form-button button:hover, .formular .form-button .form-field-controls button:hover { color: #84b400; } /* >> Module */ /* > metanavigation */ .metanavigation { width: 100%; padding: 1px 0 0 0; background: #0a2864; } .metanavigation ul { list-style: none; font-size: 1em; } .metanavigation > ul { max-width: 1200px; } .metanavigation a, .metanavigation strong { font-family: "TheSansBold", Arial, Verdana, sans-serif; font-weight: normal; text-decoration: none; } /* Tabnavigation */ .metanavigation-tabs { -webkit-transition: padding 0.6s ease; -moz-transition: padding 0.6s ease; -ms-transition: padding 0.6s ease; transition: padding 0.6s ease; position: relative; overflow: hidden; } .metanavigation-tabs > li { float: left; margin-right: 10px; } @media screen and (min-width: 1171px) { .metanavigation-tabs > li:first-child { margin-left: 15px; } } @media screen and (min-width: 1171px) { .metanavigation-tabs > li:nth-last-child(3), .metanavigation-tabs > li.metanavigation-right:nth-last-child(3) { margin-right: 15px; } } .metanavigation-tabs > li.active > a, .metanavigation-tabs > li.active strong, .metanavigation-tabs > li:hover > a, .metanavigation-tabs > li:hover strong, .metanavigation-tabs > li:focus > a, .metanavigation-tabs > li:focus strong { background: #fff; -webkit-box-shadow: inset 0 0 0 rgba(255, 255, 255, 0); -moz-box-shadow: inset 0 0 0 rgba(255, 255, 255, 0); box-shadow: inset 0 0 0 rgba(255, 255, 255, 0); } .metanavigation-tabs > li.metanavigation-right { float: right; margin-right: 0; margin-left: 10px; } .metanavigation-tabs > li > a, .metanavigation-tabs > li > strong { display: block; padding: 7px 15px 7px 20px; font-size: 1.4em; color: #0a2864; background: rgba(255, 255, 255, 0.775); -webkit-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.025); -moz-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.025); box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.025); } .metanavigation-tabs > li.metanavigation-dropdown > a { padding: 7px 7px 7px 14px; } @media screen and (max-width: 767px) { .metanavigation-tabs > li > a, .metanavigation-tabs > li > strong { padding: 7px; } .metanavigation-tabs > li.metanavigation-dropdown > a { padding: 7px; } } @media screen and (max-width: 1024px) { .metanavigation-tabs > li:first-child { display: none; } } @media only screen and (max-width: 767px) { .metanavigation-tabs > li:not(.metanavigation-right) { display: none; } .metanavigation-tabs > .metanavigation-toggle:not(.metanavigation-right) { display: block; margin-right: 0; } .metanavigation-tabs > .metanavigation-toggle:not(.metanavigation-right) > a { opacity: 0; width: 1px; max-height: 16px; overflow: hidden; padding-left: 0; padding-right: 0; } .metanavigation-tabs > .metanavigation-toggle:not(.metanavigation-right) > a:after { content: ''; margin-left: 0; } } /* metanavigation toggle buttons */ .metanavigation-toggle a:after, .metanavigation-dropdown a:after { margin-left: 5px; } @media screen and (max-width: 767px) { .metanavigation-toggle a:after, .metanavigation-dropdown a:after { margin-left: 3px; } } .metanavigation-dropdown { position: relative; } /* button worldwide bekommt ein extra icon */ li.metanavigation-worldwide > a { position: relative; padding-left: 35px; } li.metanavigation-worldwide > a:before { position: absolute; left: 15px; top: 8px; } @media screen and (max-width: 767px) { li.metanavigation-worldwide > a { padding-left: 27px; } li.metanavigation-worldwide > a:before { left: 7px; } } /* metanavigation layer */ .metanavigation-layer { max-width: 1200px; position: absolute; left: 0; top: 0; opacity: 0; z-index: -1; overflow: hidden; background: #0a2864; color: #fff; backface-visibility: hidden; -webkit-transition: opacity 0.5s; -moz-transition: opacity 0.5s; -ms-transition: opacity 0.5s; transition: opacity 0.5s; } .metanavigation-layer .grid { margin: 2em 0; max-width: 1200px; } .metanavigation-layer .grid.userroles { padding: 0; } @media screen and (max-width: 1170px) { .metanavigation-layer .grid { padding-left: 0; padding-right: 0; } } .metanavigation-layer > .grid > div, .metanavigation-layer > .grid > * { padding-left: 0; padding-right: 0; } .active .metanavigation-layer { opacity: 10; z-index: 1; max-height: 750px; } .metanavigation-layer .grid > h1, .metanavigation-layer .grid > h2, .metanavigation-layer .grid > h3, .metanavigation-layer .grid > h4, .metanavigation-layer .grid > h5, .metanavigation-layer .grid > h6, .metanavigation-layer .grid > div.looks_like_a_headline { color: #fff; padding-right: 35px; } .metanavigation-layer h3 { margin-bottom: 0.5em; font-size: 2.6em; } .metanavigation-layer ul { color: #fff; } .metanavigation-layer li { font-family: "TheSansBold", Arial, Verdana, sans-serif; } .metanavigation-layer a { color: #fff; } .metanavigation-layer a:hover { color: #84b400; } /* Close Button fuer die Layer */ a.metanavigation-close { position: absolute; top: 10px; right: 10px; padding: 10px; z-index: 10; } a.metanavigation-close:before { font-size: 2em; color: rgba(255, 255, 255, 0.775); } a.metanavigation-close span { display: block; text-indent: -99999px; } /* Laenderauswahl */ ul.country-switch { width: 20%; float: left; margin-bottom: 2.25em; padding: 0; } ul.country-switch > li { font-size: 1.7em; } ul.country-switch > li > a { display: inline-block; margin-bottom: 0.5em; } ul.country-switch > li li { font-size: 0.823529em; float: left; border-right: 1px solid #fff; margin-right: 5px; padding-right: 5px; } ul.country-switch > li li:last-child { border-right: none; margin-right: 0; padding-right: 0; } ul.country-switch ul { display: none; float: none; clear: both; width: 100%; margin-bottom: 1em; } ul.country-switch .active-country, ul.country-switch .show-languages a { color: #84b400; } ul.country-switch .active-country:hover, ul.country-switch .show-languages a:hover { color: #fff; } ul.country-switch .show-languages { display: block; } @media screen and (max-width: 767px) { ul.country-switch { width: 50%; } ul.country-switch:nth-child(2n+1) { clear: left; } } .metanavigation-layer .grid .grid-50 .metanavigation-login { width: 65%; } .metanavigation-layer .grid .grid-50 .metanavigation-login h3, .metanavigation-layer .grid .grid-50 .metanavigation-login a, .metanavigation-layer .grid .grid-50 .metanavigation-login button, .metanavigation-layer .grid .grid-50 .metanavigation-login legend { color: #fff; } .metanavigation-layer .grid .grid-50 .metanavigation-login a { float: right; font-size: 1.3em; text-decoration: underline; } .metanavigation-layer .grid .grid-50 .metanavigation-login a:hover, .metanavigation-layer .grid .grid-50 .metanavigation-login a:focus { color: #fff; text-decoration: none; } .metanavigation-layer .grid .grid-50 .metanavigation-login legend { font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.7em; font-weight: normal; margin: 0 0 10px 0; max-width: 100%; } .metanavigation-layer .grid .grid-50 .metanavigation-login input { -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; margin-bottom: 10px; border: 1px solid #3e3e3e; padding: 10px; font-size: 1.3em; border-radius: 0; height: auto; } .metanavigation-layer .grid .grid-50 .metanavigation-login input:last-of-type { margin-bottom: 15px; } .metanavigation-layer .grid .grid-50 .metanavigation-login button { float: left; border: none; padding: 5px 15px; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.3em; background: #9da9c1; } .metanavigation-layer .grid .grid-50 a, .metanavigation-layer .grid .grid-50 button { color: #fff; } .metanavigation-layer .grid .grid-50 h4 { color: #fff; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.7em; font-weight: normal; margin: 0 0 10px 0; } .metanavigation-layer .grid .grid-50 a { float: none; font-size: 1.3em; text-decoration: underline; } .metanavigation-layer .grid .grid-50 a:hover, .metanavigation-layer .grid .grid-50 a:focus { color: #fff; text-decoration: none; } .metanavigation-layer .grid .grid-50 .buttonlink, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input, .metanavigation-layer .grid .grid-50 .formular .form-input-tb input, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input, .metanavigation-layer .grid .grid-50 .formular .form-button button, .formular .form-button .metanavigation-layer .grid .grid-50 button { float: left; border: none; padding: 5px 15px; margin-right: 40px; text-decoration: none; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-size: 1.3em; background: #9da9c1; } .metanavigation-layer .grid .grid-50 .buttonlink:hover, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:hover, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:hover, .metanavigation-layer .grid .grid-50 .formular .form-input-tb input:hover, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:hover, .metanavigation-layer .grid .grid-50 .formular .form-button button:hover, .formular .form-button .metanavigation-layer .grid .grid-50 button:hover, .metanavigation-layer .grid .grid-50 .buttonlink:focus, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:focus, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:focus, .metanavigation-layer .grid .grid-50 .formular .form-input-tb input:focus, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:focus, .metanavigation-layer .grid .grid-50 .formular .form-button button:focus, .formular .form-button .metanavigation-layer .grid .grid-50 button:focus { text-decoration: none; } .metanavigation-layer .grid .grid-50 p .buttonlink, .metanavigation-layer .grid .grid-50 p .formular .form-input-tsr input, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 p input, .metanavigation-layer .grid .grid-50 p .formular .form-input-tb input, .formular .form-input-tb .metanavigation-layer .grid .grid-50 p input, .metanavigation-layer .grid .grid-50 p .formular .form-button button, .formular .form-button .metanavigation-layer .grid .grid-50 p button { font-size: 1em; } /* > logo */ strong.logo { width: 100%; min-height: 95px; display: block; font-size: 1em; margin: 0 auto 3px auto; padding-top: 30px; text-decoration: none; background: #fff url('../..//fileadmin/twt_customer/base/system/templates/images/bg_header.gif') center no-repeat; } strong.logo img { width: 124px; height: auto; } @media screen and (max-width: 1023px) { strong.logo { background: none; } } @media screen and (max-width: 767px) { strong.logo { padding-top: 10px; } } /* > mediastage */ .visual-wrapper { width: 100%; max-width: 100%; position: relative; background: #fff; margin-bottom: 45px; clear: both; float: none; display: table; } @media screen and (min-width: 1280px) { .visual-wrapper { height: 720px; overflow: hidden; } } @media only screen and (max-width: 767px) { .visual-wrapper { display: block; } } .visual-wrapper:after { clear: both; } .visual-wrapper .content-wrapper { float: right; position: relative; max-width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 20px 20px 0 30px; } @media only screen and (max-width: 767px) { .visual-wrapper .content-wrapper { padding-top: 15px; } } .visual-wrapper .button-wrapper { position: absolute; top: 200px; left: 30px; z-index: 21; background: #fff; width: 80%; } .visual-wrapper .left-image, .visual-wrapper .right-image, .visual-wrapper .intext-left-image, .visual-wrapper .intext-right-image, .visual-wrapper .aboveleft-image, .visual-wrapper .abovecenter-image, .visual-wrapper .aboveright-image { float: left; display: block; max-width: 36%; } .visual-wrapper .left-image + .content-wrapper, .visual-wrapper .right-image + .content-wrapper, .visual-wrapper .intext-left-image + .content-wrapper, .visual-wrapper .intext-right-image + .content-wrapper, .visual-wrapper .aboveleft-image + .content-wrapper, .visual-wrapper .abovecenter-image + .content-wrapper, .visual-wrapper .aboveright-image + .content-wrapper { width: 64%; max-width: 64%; padding-left: 0; } .visual-wrapper .left-image .image-wrapper, .visual-wrapper .right-image .image-wrapper, .visual-wrapper .intext-left-image .image-wrapper, .visual-wrapper .intext-right-image .image-wrapper, .visual-wrapper .aboveleft-image .image-wrapper, .visual-wrapper .abovecenter-image .image-wrapper, .visual-wrapper .aboveright-image .image-wrapper { float: none; margin-right: 20px; margin-left: 0; } @media only screen and (max-width: 767px) { .visual-wrapper .left-image .image-wrapper, .visual-wrapper .right-image .image-wrapper, .visual-wrapper .intext-left-image .image-wrapper, .visual-wrapper .intext-right-image .image-wrapper, .visual-wrapper .aboveleft-image .image-wrapper, .visual-wrapper .abovecenter-image .image-wrapper, .visual-wrapper .aboveright-image .image-wrapper { margin-right: 10px; } } .visual-wrapper .left-image img, .visual-wrapper .right-image img, .visual-wrapper .intext-left-image img, .visual-wrapper .intext-right-image img, .visual-wrapper .aboveleft-image img, .visual-wrapper .abovecenter-image img, .visual-wrapper .aboveright-image img { max-height: 100%; width: auto; height: auto; } .visual-wrapper .left-image ~ .button-wrapper, .visual-wrapper .right-image ~ .button-wrapper, .visual-wrapper .intext-left-image ~ .button-wrapper, .visual-wrapper .intext-right-image ~ .button-wrapper, .visual-wrapper .aboveleft-image ~ .button-wrapper, .visual-wrapper .abovecenter-image ~ .button-wrapper, .visual-wrapper .aboveright-image ~ .button-wrapper { left: 36%; width: 64%; } @media only screen and (max-width: 1023px) { .visual-wrapper .left-image ~ .button-wrapper, .visual-wrapper .right-image ~ .button-wrapper, .visual-wrapper .intext-left-image ~ .button-wrapper, .visual-wrapper .intext-right-image ~ .button-wrapper, .visual-wrapper .aboveleft-image ~ .button-wrapper, .visual-wrapper .abovecenter-image ~ .button-wrapper, .visual-wrapper .aboveright-image ~ .button-wrapper { width: auto; } } @media only screen and (max-width: 767px) { .visual-wrapper .left-image ~ .button-wrapper, .visual-wrapper .right-image ~ .button-wrapper, .visual-wrapper .intext-left-image ~ .button-wrapper, .visual-wrapper .intext-right-image ~ .button-wrapper, .visual-wrapper .aboveleft-image ~ .button-wrapper, .visual-wrapper .abovecenter-image ~ .button-wrapper, .visual-wrapper .aboveright-image ~ .button-wrapper { left: 15px; } } .visual { width: 100%; } @media screen and (max-width: 1279px) { .visual { background: none !important; } } @media screen and (min-width: 1280px) { .visual { height: 720px; background-repeat: no-repeat; background-size: cover; background-position: center; } } .visual img { width: 100%; height: auto; -webkit-transition: all 1s linear; -moz-transition: all 1s linear; -ms-transition: all 1s linear; transition: all 1s linear; } @media screen and (min-width: 1280px) { .visual img { display: none; } } .visual h2, .visual div.looks_like_a_headline { font-size: 5em; line-height: 1.02; font-family: "TheSansExtraBold", Arial, Verdana, sans-serif; margin-bottom: 0.25em; } @media only screen and (max-width: 1023px) { .visual h2, .visual div.looks_like_a_headline { font-size: 3.6em; line-height: 1.38888888888889; } } @media only screen and (max-width: 767px) { .visual h2, .visual div.looks_like_a_headline { font-size: 2.1em; line-height: 1.095238; } } .visual p { font-size: 2.4em; font-family: "TheSansBold", Arial, Verdana, sans-serif; color: #0a2864; margin-bottom: 0.5em; } @media only screen and (max-width: 1023px) { .visual p { font-size: 2em; } } @media only screen and (max-width: 767px) { .visual p { font-size: 1.2em; line-height: 1.16666666; } } .visual .button:before { margin-left: 2px; } .visual-text { position: absolute; top: 15%; left: 50.25%; width: 49.75%; max-width: 568px; } @media only screen and (max-width: 1023px) { .visual-text { width: 45%; } } .visual-controls { position: absolute; bottom: 310px; width: 100%; z-index: 20; } @media only screen and (max-width: 1023px) { .visual-controls { -moz-box-sizing: border-box; box-sizing: border-box; padding: 22px 15px 28px 15px; position: relative; bottom: auto; top: -3px; background: #e6e9ef; } } @media only screen and (max-width: 767px) { .visual-controls { padding: 22px 15px 19px 15px; } } .visual-switch { z-index: 25; position: relative; width: 40%; margin: -30px auto 0 auto; text-align: center; } @media only screen and (max-width: 1023px) { .visual-switch { margin-top: -35px; } } @media only screen and (max-width: 767px) { .visual-switch { margin-top: -10px; width: 75%; } } .visual-switch ul { margin: 0; } .visual-switch li { display: inline; text-align: center; font-size: 1.2em; } .visual-switch strong:before { color: #6c7ea2; } .visual-switch a { text-decoration: none; } .visual-switch a:before { color: #6c7ea2; } .visual-buttons { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; max-width: 1170px; width: 100%; height: 50px; margin: 0 auto; position: relative; top: 50%; list-style: none; z-index: 20; opacity: 0; -webkit-transition: opacity 0.5s linear; -moz-transition: opacity 0.5s linear; -ms-transition: opacity 0.5s linear; transition: opacity 0.5s linear; } .visual-wrapper:hover .visual-buttons { opacity: 1; } .mobile .visual-buttons { opacity: 1; } @media only screen and (max-width: 767px) { .visual-buttons { height: 20px; margin: 0 auto; } } .visual-buttons li { position: absolute; } .visual-buttons li:first-child { left: 0; } @media screen and (min-width: 1024px) and (max-width: 1190px) { .visual-buttons li:first-child { padding-left: 20px; left: 1.25%; } } @media screen and (min-width: 768px) and (max-width: 1023px) { .visual-buttons li:first-child { padding-left: 5px; left: 1.25%; } } .visual-buttons li:last-child { right: 0; } @media screen and (min-width: 1024px) and (max-width: 1190px) { .visual-buttons li:last-child { padding-right: 20px; right: 1.25%; } } @media screen and (min-width: 768px) and (max-width: 1023px) { .visual-buttons li:last-child { padding-right: 5px; right: 1.25%; } } .visual-buttons a { text-decoration: none; color: #fff; font-size: 3em; } @media only screen and (max-width: 767px) { .visual-buttons a { font-size: 2em; } } .visual-buttons a:after { background: rgba(10, 40, 100, 0.25); padding: 5px 0; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .visual-buttons span { display: inline-block; text-indent: -9999px; } .visual-buttons .switch-back:after { padding-right: 3px; } .visual-buttons .switch-forth:after { padding-left: 3px; } .visual-hide, .visual-toggle-out { position: absolute; top: 0; } .visual-show { position: relative; z-index: 20; opacity: 1; } .visual-hide { opacity: 0; z-index: -1; } .visual-toggle-in { position: relative; -webkit-animation: visualOpacity 1s 1 linear; -moz-animation: visualOpacity 1s 1 linear; animation: visualOpacity 1s 1 linear; } .visual-toggle-out { -webkit-animation: visualOpacity 1s 1 linear reverse; -moz-animation: visualOpacity 1s 1 linear reverse; animation: visualOpacity 1s 1 linear reverse; } @-webkit-keyframes visualOpacity { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes visualOpacity { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes visualOpacity { 0% { opacity: 0; } 100% { opacity: 1; } } .no-csstransitions .visual-wrapper { position: relative; width: 100%; display: inline-block; } .no-csstransitions .visual { display: block; clear: both; position: relative; top: 0; left: 0; } .no-csstransitions .visual-hide { opacity: 0; } .visual-wrapper .grid { position: relative; } @media only screen and (max-width: 767px) { .visual-wrapper .grid { top: -3px; } } .content .visual-wrapper .grid-33 { background: #fff; margin: 0 1.25%; width: 30.833333333333%; } .content .visual-wrapper .grid-50 { background: #fff; margin: 0 1.25%; width: 47.5%; } .content .visual-wrapper .grid-50, .content .visual-wrapper .grid-33 { padding: 0; } @media only screen and (max-width: 767px) { .content .visual-wrapper .grid-50, .content .visual-wrapper .grid-33 { width: 100%; margin: 0 0 2.5% 0; } } .content .visual-wrapper .last { margin-right: 0; } @media only screen and (max-width: 767px) { .content .visual-wrapper .content-wrapper { padding-top: 15px; } } @media only screen and (min-width: 1024px) { .visual-wrapper .grid { overflow: hidden; z-index: 20; margin: 0 auto; bottom: 25px; padding: 0 20px; } .content .visual-wrapper .grid-33, .content .visual-wrapper .grid-50 { height: 265px; background: #fff; } .content .visual-wrapper .content-wrapper:after { content: ""; display: block; height: 160px; width: 100%; position: absolute; left: 0; top: 170px; background: url(/fileadmin/twt_customer/base/system/templates/images/fade-out.png) repeat-x 0 0; } .visual-wrapper .image-wrapper { z-index: 21; overflow: hidden; } .visual-wrapper .image-wrapper img { max-height: 265px; } } @media screen and (min-width: 1240px) { .visual-wrapper .grid { position: absolute; left: 50%; margin-left: -620px; } } @media only screen and (max-width: 1023px) { .content .visual-wrapper .csc { padding-bottom: 55px; } .content .visual-wrapper .button-wrapper { top: auto; left: 15px; bottom: 20px; } } @media screen and (min-width: 1081px) and (max-width: 1279px) { .visual-wrapper .grid { margin-top: -15%; } } @media screen and (min-width: 1024px) and (max-width: 1080px) { .visual-wrapper .grid { margin: -5% auto 0 auto; } } /* > direktsuche Suchschlitz, Suchriegel im Headbereich */ .directsearch { position: relative; float: right; width: 300px; min-height: 30px; background: #fff; } .directsearch fieldset { position: absolute; top: 30px; right: -20px; width: 100%; z-index: -10; opacity: 0; visibility: hidden; -webkit-transition: opacity 0.5s linear; -moz-transition: opacity 0.5s linear; -ms-transition: opacity 0.5s linear; transition: opacity 0.5s linear; } .directsearch fieldset > div { position: relative; padding: 10px; margin-top: 4px; background: #fff; -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); } .directsearch fieldset:focus, .directsearch fieldset:hover { z-index: 1; opacity: 1; visibility: visible; } .directsearch input { float: left; font-size: 1.3em; max-width: 88%; height: auto; margin-bottom: 0; padding: 5px 5px 4px 5px; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; border-color: #9da9c1; } .directsearch button { float: right; border: none; margin-bottom: 0; padding: 5px; background: #0a2864; max-width: 13%; height: auto; } .directsearch button:after { color: #fff; } .directsearch button span { float: left; text-indent: -9999px; display: inline-block; } .directsearch .toggle-search { width: 100%; min-height: 30px; display: block; position: relative; float: right; font-size: 2em; margin-bottom: 0; cursor: pointer; } .directsearch .toggle-search span { text-indent: -9999px; display: inline-block; } .directsearch .toggle-search:after { color: #0a2864; float: right; margin-top: 9px; } .directsearch .toggle-search:hover:after, .directsearch .toggle-search.search-visible:after { color: #84b400; } .directsearch .toggle-search:hover ~ fieldset, .directsearch .toggle-search.search-visible ~ fieldset { z-index: 1; opacity: 1; visibility: visible; -webkit-transition: opacity 0.5s linear; -moz-transition: opacity 0.5s linear; -ms-transition: opacity 0.5s linear; transition: opacity 0.5s linear; } .directsearch .ui-autocomplete { max-width: 250px; top: 36px; font-size: 1.3em; z-index: 110; } /* > mainnavigation (horizontale) Hauptnavigation */ .mainnavigation { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); position: relative; z-index: 150; margin: 0; background: #fff; } .mainnavigation * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mainnavigation ul, .mainnavigation li { margin: 0; padding: 0; list-style: none; font-size: 1em; } .mainnavigation li { display: inline-block; } .mainnavigation a { width: 100%; height: 100%; display: block; text-decoration: none; color: #0a2864; } .mainnavigation ul { background: #fff; } .mainnavigation ul.mainmenu { background: transparent; } .mainnavigation ul.mainmenu > li { float: left; margin-right: 30px; position: relative; } .mainnavigation ul.mainmenu > li > a { padding: 10px 0; font-family: "TheSansBold", Arial, Verdana, sans-serif; text-transform: uppercase; font-size: 1.6em; } .mainnavigation ul.mainmenu > li.hover > a, .mainnavigation ul.mainmenu > li:hover > a, .mainnavigation ul.mainmenu > li.active > a { color: #84b400; } .mainnavigation ul.mainmenu > li.hover > .submenu, .mainnavigation ul.mainmenu > li:active > .submenu { visibility: visible; } .mainnavigation .submenu { min-width: 230px; position: absolute; top: 39px; visibility: hidden; -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); } .mainnavigation .submenu + .submenu { margin: 100% 0 0 0; } .mainnavigation .submenu > li > a:after { position: absolute; right: 5px; } .mainnavigation .submenu > li > a:only-child:after { content: ''; } .mainnavigation .submenu li { float: none; clear: both; display: block; } .mainnavigation .submenu li a { position: relative; padding: 10px 20px; font-size: 1.3em; } .mainnavigation .submenu li.hover, .mainnavigation .submenu li:hover { background: #84b400; } .mainnavigation .submenu li.hover > a, .mainnavigation .submenu li:hover > a { color: #fff; } .mainnavigation .submenu .submenu { width: 490px; position: absolute; z-index: -1; left: 100%; top: 0; background: #f9f9f9; border-left: 1px solid #d0e2ff; } .mainnavigation .submenu .submenu ul { width: 50%; float: left; background: #f9f9f9; } .mainnavigation .submenu .submenu .mainnavigation-teaser { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: absolute; right: 0; bottom: 0; width: 50%; padding-top: 10px; padding-left: 25px; } .mainnavigation .submenu .submenu .mainnavigation-teaser h4 { font-size: 1.7em; line-height: 1; margin-bottom: 5px; } .mainnavigation .submenu .submenu .mainnavigation-teaser p, .mainnavigation .submenu .submenu .mainnavigation-teaser a { font-size: 1.3em; line-height: 1.4615384615; float: none; clear: both; display: block; margin-bottom: 10px; } .mainnavigation .submenu .submenu .mainnavigation-teaser a { padding: 0; color: #6c7ea2; } .mainnavigation .submenu .submenu .mainnavigation-teaser a + a:before { content: ''; } .mainnavigation .submenu .submenu .mainnavigation-teaser a:hover { text-decoration: underline; } .mainnavigation .submenu .submenu .mainnavigation-teaser a:after { display: none; } .mainnavigation .submenu .submenu .mainnavigation-teaser img { display: block; float: right; clear: both; height: auto; max-height: 180px; } @media screen and (max-width: 1023px) { .mainnavigation { display: none; } } .touch .mainnavigation { display: none; } @media screen and (min-width: 1024px) { .mainnavigation-fixed { -webkit-transform: translateZ(0); width: 100%; position: fixed; top: 0; left: 0; } } .category-box { margin-bottom: 20px; } .category-box > div { padding-bottom: 10px; } .category-box > div > div { background: no-repeat center center; min-height: 215px; margin: 25px 0 30px 0; padding: 20px; box-shadow: 1px 1px 1px #e6e9ef; } .category-box > div > div h3 a { color: #84b400; } .category-box > div > div h3 a:hover { color: #0a2864; text-decoration: none; } .category-box > div > div p { font-family: "TheSansItalic", Arial, Verdana, sans-serif; font-size: 1.8em; font-style: italic; } .category-box > div > div a { color: #6c7ea2; text-decoration: none; } .category-box > div > div a:hover { text-decoration: underline; } .buttonlink.full-width, .formular .form-input-tsr input.full-width, .formular .form-input-tb input.full-width, .formular .form-button button.full-width { padding-left: 30px; display: block; } #inhalt .news-feed-teaser + a.buttonlink { margin: 0 20px 20px 30px; display: inline-block; min-width: 35%; } .newsroom #inhalt .news-feed-teaser + a.buttonlink { margin: 0; display: block; } .content .news-feed-teaser { padding: 20px 20px 0 30px; background-image: none !important; background: #fff; } .content .news-feed-teaser h3 { font-size: 2em; line-height: 1.2; margin-bottom: 10px; } .content .news-feed-teaser h3 a { color: #0A2864; } .content .news-feed-teaser p { text-decoration: none; color: #6c7ea2; margin-bottom: 1em; } .content .news-feed-teaser a { text-decoration: none; color: #6c7ea2; } .content .news-feed-teaser a:hover, .content .news-feed-teaser a:focus, .content .news-feed-teaser a:active { text-decoration: underline; color: #84b400; } @media only screen and (min-width: 1024px) { .content .visual-wrapper .grid .grid-33, .content .visual-wrapper .grid .grid-50 { min-height: 280px; height: auto; } } html.newsroom.no-touch .has-mediastage .content { margin-bottom: 0; position: static; top: 0; } html.newsroom .visual-text { width: 28%; left: 15%; } html.newsroom .visual-text h2 { background: rgba(255, 255, 255, 0.5); display: inline; font-family: "TheSansItalic", Arial, Verdana, sans-serif; font-size: 3.2em; line-height: 1.5; box-shadow: 10px 0 0 rgba(255, 255, 255, 0.5), -10px 0 0 rgba(255, 255, 255, 0.5); } html.newsroom .visual-gradient { background-color: transparent; background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#fff)); background-image: -webkit-linear-gradient(top, transparent, #fff); background-image: -moz-linear-gradient(top, transparent, #fff); background-image: -ms-linear-gradient(top, transparent, #fff); background-image: linear-gradient(top, transparent, #fff); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='transparent', endColorStr='#fff'); height: 150px; position: absolute; right: 0; bottom: 0; left: 0; } html.newsroom body.has-mediastage .grid.outer-grid { margin-top: -450px; position: relative; z-index: 50; } html.newsroom .newsroom-background { background: #fff; } html.newsroom .grid-75.newsroom-background .csc h4 { margin-top: 40px; } html.newsroom .first-headline { margin-top: 35px; } html.newsroom h2 a { margin-left: 6px; font-family: Arial, Verdana, sans-serif; font-size: 0.56em; color: #84b400; } html.newsroom h2 a:before { padding-right: 6px; content: '|'; color: #84b400; } html.newsroom h2 a:hover { color: #0a2864; } html.newsroom .read-more { color: #84b400; } html.newsroom .read-more:hover { text-decoration: underline; } html.newsroom blockquote { font-family: "TheSansItalic", Arial, Verdana, sans-serif; font-size: 2.2em; } html.newsroom blockquote:before { top: -15px; left: 0; font-size: 4.75em; } html.newsroom .util-pagination { margin-top: 26px; } html.newsroom .util-navigation { margin-top: 6px; } html.newsroom .util-navigation .util-prev, html.newsroom .util-navigation .util-next { font-size: 18px; } html.newsroom .buttonlink.full-width, html.newsroom .formular .form-input-tsr input.full-width, .formular .form-input-tsr html.newsroom input.full-width, html.newsroom .formular .form-input-tb input.full-width, .formular .form-input-tb html.newsroom input.full-width, html.newsroom .formular .form-button button.full-width, .formular .form-button html.newsroom button.full-width { padding-left: 30px; display: block; } html.newsroom .buttonlink.center, html.newsroom .formular .form-input-tsr input.center, .formular .form-input-tsr html.newsroom input.center, html.newsroom .formular .form-input-tb input.center, .formular .form-input-tb html.newsroom input.center, html.newsroom .formular .form-button button.center, .formular .form-button html.newsroom button.center { display: block; text-align: center; } html.newsroom .mail:before, html.newsroom .phone:before, html.newsroom .web:before, html.newsroom .address:before, html.newsroom .fax:before { width: 35px; } html.newsroom .article-meta { margin-bottom: 30px; color: #0a2864; border-bottom: 1px solid #e6e9ef; } html.newsroom .article-meta > div { padding-bottom: 10px; } html.newsroom .article-meta p { margin: 0; } html.newsroom .article-meta .grid-66 { text-align: right; } html.newsroom .article-meta .grid-66 ul { margin: 0; padding: 0; list-style: none; } html.newsroom .article-meta .grid-66 ul li { background: none; margin: 0; padding: 0; display: inline-block; } html.newsroom .article-meta .grid-66 ul li a { color: #84b400; text-decoration: none; } html.newsroom .article-meta .grid-66 ul li a:hover { color: #0a2864; } html.newsroom .article-meta .grid-66 ul li:after { padding: 0 3px 0 5px; content: '|'; color: #84b400; } html.newsroom .article-meta .grid-66 ul li:last-child:after { display: none; } html.newsroom .article-info { margin: 20px 0 45px 0; padding: 0; list-style: none; } html.newsroom .article-info li { background: none; padding: 0; font-family: "TheSansItalic", Arial, Verdana, sans-serif; color: #6c7ea2; } html.newsroom .social-buttons { margin: 20px 0 40px 0; } html.newsroom .social-buttons a { margin: 0 10px 10px 0; padding-left: 50px; overflow: hidden; } html.newsroom .social-buttons a:after { background: no-repeat center; -webkit-background-size: 55%; -moz-background-size: 55%; background-size: 55%; width: 38px; height: 38px; display: block; position: absolute; top: 0; bottom: 0; left: 0; content: ''; color: #fff; border-right: 1px solid rgba(255, 255, 255, 0.25); } html.newsroom .social-buttons a:hover { opacity: 0.75; } html.newsroom .social-buttons a.facebook { background-color: #3b5998; } html.newsroom .social-buttons a.facebook:after { background-image: url(/fileadmin/twt_customer/base/system/templates/images/ico_facebook.svg); } html.newsroom .social-buttons a.twitter { background-color: #55acee; } html.newsroom .social-buttons a.twitter:after { background-image: url(/fileadmin/twt_customer/base/system/templates/images/ico_twitter.svg); } html.newsroom .social-buttons a.xing { background-color: #026466; } html.newsroom .social-buttons a.xing:after { background-image: url(/fileadmin/twt_customer/base/system/templates/images/ico_xing.svg); } html.newsroom .social-buttons a.email { background-color: #8c8c8c; } html.newsroom .social-buttons a.email:after { background-image: url(/fileadmin/twt_customer/base/system/templates/images/ico_email.svg); } html.newsroom .highlighted-box > div > div { background: #e6e9ef; min-height: 190px; padding: 20px; } html.newsroom .highlighted-box > div > div .mail:before, html.newsroom .highlighted-box > div > div .phone:before, html.newsroom .highlighted-box > div > div .web:before, html.newsroom .highlighted-box > div > div .address:before, html.newsroom .highlighted-box > div > div .fax:before { color: #0a2864; } html.newsroom .highlighted-box > div > div .buttonlink, html.newsroom .highlighted-box > div > div .formular .form-input-tsr input, .formular .form-input-tsr html.newsroom .highlighted-box > div > div input, html.newsroom .highlighted-box > div > div .formular .form-input-tb input, .formular .form-input-tb html.newsroom .highlighted-box > div > div input, html.newsroom .highlighted-box > div > div .formular .form-button button, .formular .form-button html.newsroom .highlighted-box > div > div button { margin: 15px 0 0 0; } html.newsroom .highlighted-box > div > div p { margin-bottom: 10px; } html.newsroom .sidebar-box { background: #e6e9ef; margin-bottom: 20px; padding: 20px; } html.newsroom .sidebar-box.white { background: rgba(255, 255, 255, 0.9); } html.newsroom .sidebar-box.white:first-child { margin-top: 40px; } html.newsroom .sidebar-box .buttonlink, html.newsroom .sidebar-box .formular .form-input-tsr input, .formular .form-input-tsr html.newsroom .sidebar-box input, html.newsroom .sidebar-box .formular .form-input-tb input, .formular .form-input-tb html.newsroom .sidebar-box input, html.newsroom .sidebar-box .formular .form-button button, .formular .form-button html.newsroom .sidebar-box button { margin: 10px 0 0 0; } html.newsroom .sidebar-box p { margin-bottom: 10px; } html.newsroom .sidebar-box select { margin-top: 10px; } html.newsroom .sidebar-visual { background: no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; margin-bottom: 20px; padding: 200px 25px 20px 25px; display: block; text-decoration: none; } html.newsroom .sidebar-visual h5 { background: #0a2864; display: inline; font-family: "TheSansItalic", Arial, Verdana, sans-serif; font-size: 2em; color: #fff; line-height: 1.4; box-shadow: 5px 0 0 #0a2864, -5px 0 0 #0a2864; } html.newsroom .teaser-visual { background: #fff no-repeat center center; min-height: 270px; display: block; overflow: hidden; position: relative; color: #3e3e3e; text-decoration: none; } html.newsroom .teaser-visual .description { padding: 20px; } html.newsroom .teaser-visual .description .headline-wrapper { margin: 0 5px 25px 5px; min-height: 5.5em; } html.newsroom .teaser-visual .description .headline-wrapper h3 { background: #0a2864; display: inline; font-family: "TheSansItalic", Arial, Verdana, sans-serif; font-size: 2em; color: #fff; line-height: 1.4; box-shadow: 5px 0 0 #0a2864, -5px 0 0 #0a2864; } html.newsroom .teaser-visual .description p { margin-bottom: 10px; } html.newsroom .teaser-visual.fly-in { -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; } html.newsroom .teaser-visual.fly-in .description { background: rgba(255, 255, 255, 0.8); position: absolute; top: 175px; right: 0; bottom: 0; left: 0; -webkit-transition: top 0.25s; -moz-transition: top 0.25s; -ms-transition: top 0.25s; transition: top 0.25s; } html.newsroom .teaser-visual.fly-in:hover .description { top: 0; } html.newsroom .news-feed { margin: 0 0 20px 0; padding: 0; list-style: none; } html.newsroom .news-feed li { background: #e6e9ef; margin-bottom: 10px; padding: 20px; } html.newsroom .news-feed li h3 { font-family: "TheSansItalic", Arial, Verdana, sans-serif; font-size: 1.4em; color: #0a2864; } html.newsroom .news-feed li p { margin-bottom: 10px; font-size: 1em; } html.newsroom .news-feed li p a { margin-left: 5px; color: #84b400; text-decoration: none; } html.newsroom .news-feed li p a:hover { text-decoration: underline; } @media only screen and (max-width: 1023px) { html.newsroom .visual-text { width: 70%; } html.newsroom .visual-text h2 { font-size: 2em; } html.newsroom .grid.outer-grid { margin-top: 0; } html.newsroom .article-meta .grid-33 { margin: 0; padding-bottom: 5px; } html.newsroom .article-meta .grid-66 { padding-top: 5px; text-align: left; } } html.microsite-smarthome header { background-color: #ebebeb; } @media only screen and (max-width: 1023px) { html.microsite-smarthome header { background-color: #fff; border-color: #ebebeb; } } html.microsite-smarthome .visual-text { width: 50%; max-width: none; top: 25%; left: 25%; text-align: center; } @media only screen and (max-width: 767px) { html.microsite-smarthome .visual-text { top: 12%; } } html.microsite-smarthome .visual-text h2, html.microsite-smarthome .visual-text div.looks_like_a_headline { margin-bottom: 0.5em; font-size: 6em; } @media only screen and (max-width: 1023px) { html.microsite-smarthome .visual-text h2, html.microsite-smarthome .visual-text div.looks_like_a_headline { font-size: 3.6em; line-height: 1.38888888888889; } } @media only screen and (max-width: 767px) { html.microsite-smarthome .visual-text h2, html.microsite-smarthome .visual-text div.looks_like_a_headline { font-size: 2.1em; line-height: 1.095238; } } html.microsite-smarthome .visual-text p { margin-bottom: 1em; font-size: 3.4em; } @media only screen and (max-width: 1023px) { html.microsite-smarthome .visual-text p { font-size: 2em; } } @media only screen and (max-width: 767px) { html.microsite-smarthome .visual-text p { font-size: 1.2em; line-height: 1.16666666; } } html.microsite-smarthome .visual-text .buttonlink, html.microsite-smarthome .visual-text .formular .form-input-tsr input, .formular .form-input-tsr html.microsite-smarthome .visual-text input, html.microsite-smarthome .visual-text .formular .form-input-tb input, .formular .form-input-tb html.microsite-smarthome .visual-text input, html.microsite-smarthome .visual-text .formular .form-button button, .formular .form-button html.microsite-smarthome .visual-text button { background: transparent; padding: 10px 20px; color: #0a2864; text-transform: uppercase; border: 1px solid #0a2864; } html.microsite-smarthome .visual-text .buttonlink:before, html.microsite-smarthome .visual-text .formular .form-input-tsr input:before, .formular .form-input-tsr html.microsite-smarthome .visual-text input:before, html.microsite-smarthome .visual-text .formular .form-input-tb input:before, .formular .form-input-tb html.microsite-smarthome .visual-text input:before, html.microsite-smarthome .visual-text .formular .form-button button:before, .formular .form-button html.microsite-smarthome .visual-text button:before { display: none; } html.microsite-smarthome .visual-text .buttonlink:hover, html.microsite-smarthome .visual-text .formular .form-input-tsr input:hover, .formular .form-input-tsr html.microsite-smarthome .visual-text input:hover, html.microsite-smarthome .visual-text .formular .form-input-tb input:hover, .formular .form-input-tb html.microsite-smarthome .visual-text input:hover, html.microsite-smarthome .visual-text .formular .form-button button:hover, .formular .form-button html.microsite-smarthome .visual-text button:hover { background: #0a2864; color: #fff; } @media screen and (min-width: 1280px) { html.microsite-smarthome .visual-wrapper, html.microsite-smarthome .visual { height: 560px; } } @media only screen and (min-width: 1024px) { html.microsite-smarthome .has-mediastage .content { top: 0; margin-bottom: 0; } } header, main, footer { -webkit-transition: margin-left 0.3s ease; -moz-transition: margin-left 0.3s ease; -ms-transition: margin-left 0.3s ease; transition: margin-left 0.3s ease; } @media only screen and (max-width: 1023px) { .dl-menu-opened header, .dl-menu-opened main, .dl-menu-opened footer { max-width: 100%; margin-left: -320px; } } .touch .dl-menu-opened header, .touch .dl-menu-opened main, .touch .dl-menu-opened footer { max-width: 100%; margin-left: -320px; } .dl-menuheader { background: #0a2864; } .dl-menuheader .directsearch { width: 75%; display: none; background: none; float: right; margin: 10px 10px 0 0; } .dl-menuheader .directsearch fieldset { visibility: visible; z-index: 1; opacity: 1; position: static; -webkit-box-shadow: inset 0 0 0 #0a2864; -moz-box-shadow: inset 0 0 0 #0a2864; box-shadow: inset 0 0 0 #0a2864; } .dl-menuheader .directsearch div { padding: 0; background: none; } .dl-menuheader .directsearch input { -moz-box-sizing: border-box; box-sizing: border-box; max-width: none; width: 100%; padding: 5px; } .dl-menuheader .directsearch button { position: absolute; right: 3px; top: 4px; /* desktop 18*/ padding: 0; background: #fff; line-height: normal; } .dl-menuheader .directsearch button:after { color: #0a2864; font-size: 1.5em; line-height: 0.9; } .dl-menuheader .directsearch .toggle-search { display: none; } .dl-menu-opened .dl-menuheader .directsearch { display: block; } .dl-menuheader .directsearch .ui-autocomplete { width: 100%; max-width: none; left: 0; right: 0; top: 27px; } .dl-trigger { display: none; margin: 40px 10px 0 0; font-size: 3.2em; color: #0a2864; float: right; cursor: pointer; } @media only screen and (max-width: 1023px) { .dl-trigger { display: block; } .navigationlayer-opened .dl-trigger { display: none; } } .touch .dl-trigger { display: block; } .touch .navigationlayer-opened .dl-trigger { display: none; } .dl-active { margin: 10px 0 10px 20px; float: left; color: #fff; } .dl-active:before { font-size: 0.8em; } .dl-trigger-open, .dl-trigger-close { display: inline-block; text-indent: -9999px; } .dl-menuwrapper { display: none; word-wrap: break-word; } .dl-menuwrapper a { text-decoration: none; } @media only screen and (max-width: 1023px) { .dl-menuwrapper { width: 0; height: 100%; position: absolute; top: 0; right: 0; z-index: 150; display: block; background: #fff; -webkit-transition: width 0.3s ease; -moz-transition: width 0.3s ease; -ms-transition: width 0.3s ease; transition: width 0.3s ease; -webkit-perspective: 1000px; -moz-perspective: 1000px; -ms-perspective: 1000px; perspective: 1000px; -webkit-perspective-origin: 50% 200%; -moz-perspective-origin: 50% 200%; -ms-perspective-origin: 50% 200%; perspective-origin: 50% 200%; } .dl-menuwrapper::-webkit-scrollbar { display: none; } .dl-menuwrapper ul { padding: 0; margin: 0; list-style: none; font-size: 1em; } } .touch .dl-menuwrapper { width: 0; height: 100%; position: absolute; top: 0; right: 0; z-index: 150; display: block; background: #fff; -webkit-transition: width 0.3s ease; -moz-transition: width 0.3s ease; -ms-transition: width 0.3s ease; transition: width 0.3s ease; -webkit-perspective: 1000px; -moz-perspective: 1000px; -ms-perspective: 1000px; perspective: 1000px; -webkit-perspective-origin: 50% 200%; -moz-perspective-origin: 50% 200%; -ms-perspective-origin: 50% 200%; perspective-origin: 50% 200%; } .touch .dl-menuwrapper::-webkit-scrollbar { display: none; } .touch .dl-menuwrapper ul { padding: 0; margin: 0; list-style: none; font-size: 1em; } .dl-menu-opened .dl-menuwrapper { width: 320px; overflow: scroll; z-index: 161; position: fixed; } @media only screen and (max-width: 767px) { .dl-menu-opened .dl-menuwrapper { width: 100%; max-width: 768px; } } .dl-menu-opened .dl-menuwrapper:after { content: ''; width: 5px; height: 100%; display: block; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.6); box-shadow: 0 0 5px rgba(0, 0, 0, 0.6); z-index: 1001; position: absolute; top: 0; left: -5px; } @media only screen and (max-width: 767px) { .dl-menuwrapper { max-width: 0; -webkit-transition: max-width 0.3s ease; -moz-transition: max-width 0.3s ease; -ms-transition: max-width 0.3s ease; transition: max-width 0.3s ease; } } .dl-menu { width: 100%; position: absolute; z-index: 100; opacity: 0; top: 58px; pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -moz-transform: translateX(320px); -ms-transform: translateX(320px); -webkit-transform: translateX(320px); transform: translateX(320px); } .dl-menu.dl-menuopen { opacity: 1; pointer-events: auto; -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); overflow: initial; } .dl-menu li { position: relative; } .dl-menu a, .dl-menu span { margin: 0; font-size: 1.59999em; font-family: "TheSansBold", Arial, Verdana, sans-serif; font-weight: 400; left: 0; padding: 9px 0 10px 20px; display: block; box-sizing: border-box; width: auto; color: #0a2864; background: #e6e9f0; border-top: 1px solid #fff; } .dl-menu .dl-sub { left: auto; right: 0; top: 0; background: url(/fileadmin/twt_customer/base/system/templates/images/bg_border-submenu.png) left top repeat-y; position: absolute; height: 39px; padding: 0 0 0 5px; color: #9da9c1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .dl-menu .dl-sub:before { font-size: 2.4em; } .dl-menu li:not(.dl-back) a:active, .dl-menu a.dl-sub:active { background: #84b400; color: #fff; } .dl-submenu { display: none; } .dl-subviewopen > a { display: none; } .dl-subview { opacity: 1; } .dl-menu > .dl-subview { position: absolute; width: 100%; top: 0; left: 0; margin: 0; } .dl-subview .dl-subviewopen .dl-submenu a.dl-sub, .dl-subview .dl-subview, .dl-subview .dl-subview .dl-submenu, .dl-subview .dl-subviewopen, .dl-subview .dl-subviewopen > .dl-submenu, .dl-subview .dl-subviewopen > .dl-submenu > li { display: block; } .dl-subview .dl-subviewopen .dl-submenu .dl-submenu, .dl-subview .dl-subviewopen a.dl-sub, .dl-subview li, .dl-subview li.dl-subview > a { display: none; } .dl-subview > a, .dl-subview > span { background: #fff; border: 0; padding: 30px 0 20px 20px; } .dl-indentionlevel { padding: 15px 0 12px 20px; } .dl-indentionlevel a, .dl-indentionlevel span { display: inline; width: auto; padding: 0; border: 0; background: #fff; font-size: 1.2em; text-transform: uppercase; } .dl-indentionlevel a:first-child:before { color: #0a2864; } .dl-indentionlevel a:first-child span { text-indent: -9999px; display: inline-block; } .dl-indentionlevel a:not(:last-child):after { content: ' > '; } .dl-indentionlevel a:last-child { display: block; font-size: 1.9em; color: #84b400; } .dl-back a { background: #9da9c1; color: #fff; } .dl-animate-out { -webkit-animation: MenuOut2 0.3s ease-in-out; -moz-animation: MenuOut2 0.3s ease-in-out; animation: MenuOut2 0.3s ease-in-out; } .dl-animate-in { -webkit-animation: MenuIn2 0.3s ease-in-out; -moz-animation: MenuIn2 0.3s ease-in-out; animation: MenuIn2 0.3s ease-in-out; } @-webkit-keyframes MenuOut2 { 100% { -moz-transform: translateX(320px); -ms-transform: translateX(320px); -webkit-transform: translateX(320px); transform: translateX(320px); opacity: 0; } } @-moz-keyframes MenuOut2 { 100% { -moz-transform: translateX(320px); -ms-transform: translateX(320px); -webkit-transform: translateX(320px); transform: translateX(320px); opacity: 0; } } @keyframes MenuOut2 { 100% { -moz-transform: translateX(320px); -ms-transform: translateX(320px); -webkit-transform: translateX(320px); transform: translateX(320px); opacity: 0; } } @-webkit-keyframes MenuIn2 { 100% { -moz-transform: translateX(100%); -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 1; } } @-moz-keyframes MenuIn2 { 100% { -moz-transform: translateX(100%); -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 1; } } @keyframes MenuIn2 { 100% { -moz-transform: translateX(100%); -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 1; } } /*! Video.js Default Styles (http://videojs.com) Version 4.8.1 Create your own skin at http://designer.videojs.com */ /* SKIN ================================================================================ The main class name for all skin-specific styles. To make your own skin, replace all occurances of 'vjs-default-skin' with a new name. Then add your new skin name to your video tag instead of the default skin. e.g.