/* ============================================================================= * add here your own styles (update-safe) * info: save this file before you update the theme to a higher version * ========================================================================== */ @font-face {font-family: 'Raleway'; font-style: normal; font-weight: 400; src: url('/files/cto_layout/font/raleway/raleway-v28-latin-regular.eot'); src: local(''), url('/files/cto_layout/font/raleway/raleway-v28-latin-regular.eot?#iefix') format('embedded-opentype'), url('/files/cto_layout/font/raleway/raleway-v28-latin-regular.woff2') format('woff2'), url('/files/cto_layout/font/raleway/raleway-v28-latin-regular.woff') format('woff'), url('/files/cto_layout/font/raleway/raleway-v28-latin-regular.ttf') format('truetype'), url('/files/cto_layout/font/raleway/raleway-v28-latin-regular.svg#Raleway') format('svg'); } @font-face {font-family: 'Raleway'; font-style: normal; font-weight: 800; src: url('/files/cto_layout/font/raleway/raleway-v28-latin-800.eot'); src: local(''), url('/files/cto_layout/font/raleway/raleway-v28-latin-800.eot?#iefix') format('embedded-opentype'), url('/files/cto_layout/font/raleway/raleway-v28-latin-800.woff2') format('woff2'), url('/files/cto_layout/font/raleway/raleway-v28-latin-800.woff') format('woff'), url('/files/cto_layout/font/raleway/raleway-v28-latin-800.ttf') format('truetype'), url('/files/cto_layout/font/raleway/raleway-v28-latin-800.svg#Raleway') format('svg'); } /* --------------- GLOBAL STYLES --------------- */ h1 {font-size: 34px !important; margin-top: 25px;} h2 {font-size: 26px !important;} h1, h2, h3 {font-family: 'Raleway', sans-serif !important; font-weight: 400; -webkit-font-feature-settings: 'lnum';} /* Sets Template into Full-Width Mode */ #header {max-width: 100%;} #wrapper {max-width: 100%;} #header_after .inside {max-width: 100%;} #footer {max-width: 100%;} #bottom {max-width: 100%;} #main, .m-bottom {margin-bottom: 40px;} /* FIX NAV-BAR */ .sticky {position: fixed !important; top: 0; width: 100%} .sticky #logo {top: 6px;} .sticky nav#mainmenu ul li a{padding: 0 5px;} .sticky nav#mainmenu .level_1 span{font-size: 0;} .sticky nav#mainmenu .level_2 span{font-size: 10px;} .sticky + #header_after, .sticky + #wrapper {padding-top: 136px;} p a {color: #df252b;} .empty, div.formbody, div.formbody input {font-size: 14px;} .teaserspacer {font-size: 14px;} .teaserspacer a{color: #df252b; text-decoration: underline;} td.ce_text p a{font-size: 14px;} ul.red-list li a{color: #df252b;} .no-border img {border: 0px;} body {overflow-y: auto !important;} /* scroll? */ .just {text-align: justify;} img {image-rendering: -webkit-optimize-contrast;} .centerline h3, h3.centerline {margin: 25px 0 35px 0; overflow: hidden; text-align: center;} .centerline h3:before, .centerline h3:after, h3.centerline:before, h3.centerline:after {background-color: #ddd; content: ""; display: inline-block; height: 1px; position: relative; vertical-align: middle; width: 50%;} .centerline h3:before, h3.centerline:before {right: 0.5em; margin-left: -50%;} .centerline h3:after, h3.centerline:after {left: 0.5em; margin-right: -50%;} .rightline h3, h3.rightline {margin: 25px 0 35px 0; overflow: hidden; text-align: left;} .rightline h3:after, h3.rightline:after {background-color: #ddd; content: ""; display: inline-block; height: 1px; position: relative; vertical-align: middle; width: 100%;} .rightline h3:after, h3.rightline:after {left: 0.5em; margin-right: -50%;} .rightline ul li:first-child {margin-left: 0%;} /* FOOTER */ .adress ul {padding: 0;} .adress li {list-style-type: none; display: table;} .adress li:before {font-family: "icons"; display: inline-block; position: relative; margin-right: 10px;} .adress a {color: #df252b;} #footer img.hersteller-freigaben {width: 110px; height: auto; display: inline-block;} #footer img.best-brands-gewinner {width: 145px; height: auto; display: inline-block; margin-left: 10px;} /* ICON-FONT */ /* http://fontello.com/ - Default code (hex) eingeben */ .ce_list.icon-location-5 li:before{content:'\e93d'} .icon-location-5:before{content:'\e93d'; height: 55px;} .ce_list.icon-phone-2 li:before{content:'\e9e8'} .icon-phone-2:before{content:'\e9e8'} .ce_list.icon-print-2 li:before{content:'\e902'} .icon-print-2:before{content:'\e902'} .icon-mail:before{content:'\2709'}. .ce_list.icon-mail li:before{content:'\2709'} .icon-youtube-1:before{content:'\55'} .ce_list.icon-youtube-1 li:before{content:'\55'} .ce_list.icon-facebook-3 li:before{content:'\66'} .icon-facebook-3:before{content:'\66'} .ce_list.icon-twitter-3 li:before{content:'\54'} .icon-twitter-3:before{content:'\54'} .ce_list.icon-google li:before{content:'\47'} .icon-google:before{content:'\47'} .ce_list.icon-itunes li:before{content:'\69'} .icon-itunes:before{content:'\69'} .ce_list.icon-industrial-building li:before{content:'\e9a0'} .icon-industrial-building:before{content:'\e9a0'} .ce_list.icon-phone-3 li:before{content:'\eccc'} .icon-phone-3:before{content:'\eccc'} .ce_list.icon-star-5 li:before{content:'\e92e'} .icon-star-5:before{content:'\e92e'} .ce_list.icon-key li:before{content:'\1F511'} .icon-key:before{content:'\1F511'} .ce_list.icon-news li:before{content:'\eb1f'} .icon-news:before{content:'\eb1f'} .ce_list.icon-down li:before{content:'\2193'} .icon-down:before{content:'\2193'} .ce_list.icon-star li:before{content:'\2605'} .icon-star:before{content:'\2605'} .ce_list.icon-contacts li:before{content:'\eb2c'} .icon-contacts:before{content:'\eb2c'} .ce_list.icon-search-5 li:before{content:'\e92a'} .icon-search-5:before{content:'\e92a'} .icon-plus:before{content:'\2b'} .ce_list.icon-plus li:before{content:'\2b'} .icon-minus:before{content:'\2d'} .ce_list.icon-minus li:before{content:'\2d'} .ce_list.icon-folder-1 li:before{content:'\e824'} .icon-folder-1:before{content:'\e824'} .ce_list.icon-right-dir li:before{content:'\25b8'} .icon-right-dir:before{content:'\25b8'} .ce_list.icon-right-open-big li:before{content:'\ea08'} .icon-right-open-big:before{content:'\ea08'} .ce_list.icon-play:before{content:'\ECFF'} .icon-play:before{content:'\ECFF'} .ce_list.icon-karriere:before{content:'\E9FB'} .icon-karriere:before{content:'\E9FB'} /* SOCIAL ICONS */ .socials a.icon {width: 32px; height: 32px; background-color: #7b7b7b !important; border-radius: 50%; background-position: -1px -1px; background-size: 26px; background-position: 3px;} .socials a.icon.big {width: 64px; height: 64px; background-size: 64px; background-position: 0px;} .socials .fb {background: url(../../../files/inhalte/sonstiges/social-icons/i-facebook.png) no-repeat; } .socials .fb:hover {background-color: #3b5998 !important;} .socials .yt {background: url(../../../files/inhalte/sonstiges/social-icons/i-youtube.png) no-repeat;} .socials .yt:hover {background-color: #e52d27 !important;} .socials .tw {background: url(../../../files/inhalte/sonstiges/social-icons/i-twitter-x.png) no-repeat; } .socials .tw:hover {background-color: #0172D1 !important;} .socials .xi {background: url(../../../files/inhalte/sonstiges/social-icons/i-xing.png) no-repeat;} .socials .xi:hover {background-color: #026466 !important;} .socials .in {background: url(../../../files/inhalte/sonstiges/social-icons/i-insta.png) no-repeat;} .socials .in:hover {background-color: #c40094 !important;} .socials .linkedin {background: url(../../../files/inhalte/sonstiges/social-icons/i-linkedin.png) no-repeat;} .socials .linkedin:hover {background-color: #006699 !important;} a.fernwartung::before{content: " "; width: 20px; height: 16px; background-image: url(../../../files/inhalte/sonstiges/img/fernwartung/icon-wrench.png); background-size:16px; background-repeat: no-repeat; margin: 0px 0px -2px 6px; display: inline-block;} #fernwartung {text-align: center;} a.badge {display: inline-block; width: 200px;height: auto; margin: 5px 15px;} a.badge img {width: 200px; height: 95px; padding-right:0px;} /* REVOLUTION-SLIDER GENERAL (Home) */ .slider-right-padding {text-align: right !important; padding-right: 20px !important;} .slider-left-padding {text-align: left !important; padding-left: 20px !important;} h1.headline1, p.headline1 {font-family: 'Raleway', sans-serif; text-transform: uppercase; font-weight: 800; font-size: 48px; margin: 10px 0 20px 0; color: #3a3a3a; -webkit-font-feature-settings: 'lnum';} h1.headline1 em, p.headline1 em {color: #df252b; font-style: normal;} h2.headline2, p.headline2, p.headline3 {font-family: 'Raleway', sans-serif; font-weight: 400; font-size: 30px; line-height: 1.2; margin-bottom: 20px !important; color: #434343; -webkit-font-feature-settings: 'lnum';} p.slide {font-size: 16px; color: #3a3a3a;} a.slide-button {font-size: 16px; background-color: #df252b; line-height: 55px;} a.slide-button:hover {background-color: #be1c22; text-decoration: none;} .slide-2-headline {text-align: right;} /* rechtsbündig für Home-Slider */ .slide-img-bottom {top: initial !important; bottom: 0px !important;} .image_container {margin-bottom: 20;} /* Imagecontainer for Slider */ .bb-logo {position: absolute; left: unset !important; top: unset !important;right: 10px; bottom:10px; z-index: 999} a#locommunity-prev img {width: 390px; height: 390px; border-radius: 16px;} .slider-right-padding.tp-caption.sfr.fadeout.start {z-index: 555;} /* REVOLUTION-SLIDER Karriere / Mediathek */ h1.headline1 {font-size: 48px !important; margin: 20px 0 -10px 0 !important;} h2.headline2 {font-size: 30px !important; text-transform: none;} p.headline3 {font-size: 21px !important;} /* PRELOADER */ body.preloader-site {overflow: hidden;} .preloader-wrapper {height: 100%; width: 100%; background: #FFF; position: fixed; top: 0; left: 0; z-index: 9999999;} .preloader-wrapper .preloader {position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 120px;} /* --------------- HOMEPAGE --------------- */ #buttoncontainer {height: 136px; width: 320px;} /* two monitors */ .innerbtncontainer {float: left; width: 150px; height: 120px;} .btncircle { width: 150px; height: 90px; position: relative; text-align: center; font-weight: bold;} .btncircle:hover .cursor {opacity: 1.0;} .cursor {width: 150px; height: 90px; top: 0px; left: 0px; position: absolute; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; opacity: 0;} h1.home, h2.home {font-family: 'Raleway', sans-serif; text-transform: none; font-weight: 400;} h1.home {font-size: 25px !important;} h2.home {font-size: 24px;} h2.home-small {text-transform: none; font-weight: bold; font-family: Verdana, sans-serif !important; font-size: 14px !important; background: none;} /* Teaser*/ .servicebox_4 {text-align: center;} .servicebox_4 a {background: none; padding: 0;} .servicebox_4 h3 {font-size: 17px; margin-bottom: 15px;} div#tabs ul.infoboxen li {font-size: 13px;} div#tabs ul.infoboxen li a{padding: 3px 9px;} .margin-tb {margin: 20px 0 30px 0;} /* Wordcloud */ #wordcloud {background-color: #fff; border-radius: 6px; -webkit-box-sizing: border-box; box-sizing: border-box; color: #9FA7B2; margin-top: 20px; padding: 5px 5px; text-align: center; width: 100%;} #wordcloud ul {list-style: none; text-align: center; margin: 0; padding: 0;} #wordcloud ul li {border-radius: 20px; display: inline-block; margin: 0 0 8px 0; padding: 5px 12px;} .xs {font-size: 10px; line-height: 1.5;} .m {font-size: 12px; padding: 6px 8px;} .l {font-size: 13px; padding: 6px 12px 7px;} .xl {font-size: 15px; padding: 7px 14px 8px;} .xs, .s, .m, .l, .xl {background: #f3f3f3; color: #888;} .xs:hover, .s:hover, .m:hover, .l:hover, .xl:hover {background: #df252b; color: #fff;} /* --------------- UNTERNEHMEN --------------- */ /* --> Zentrale */ .embed-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; margin-bottom: 20px;} /* Responsive Video-Container */ .embed-container iframe, .embed-container object, .embed-container embed, .embed-container video {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .map-responsive{overflow:hidden; padding-bottom:56.25%; position:relative; height:0;} .map-responsive iframe{left:0; top:0; height:100%; width:100%; position:absolute;} /* --> Ausbildung */ .azubis td:first-child {width: 150px; vertical-align: top;} /* Azubis Einzelvorstellung */ .azubis td:first-child img{width: 100% !important; padding-top: 6px;} .azubis h5{font-size: 14px !important; font-weight: bold;} .azubi-lounge h1, .azubi-lounge h2, .azubi-lounge h3 {font-size: 30px !important; color: #fff; display: block; margin: 0px;} .azubi-lounge h1 span, .azubi-lounge h2 span, .azubi-lounge h3 span {font-size: 30px !important; color: #fff; background-color: #df252b; display: inline-block; padding: 6px 18px 6px 50px;} .azubi-lounge .box {background: #efefef; margin: 20px 0 30px 0px; padding: 30px;} .azubi-lounge .box h4 {font-weight: bold;} .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {left: 48%; bottom: 10px;} /* BX-Slider Pagination */ .tab_karriere td {border-top: 0px; vertical-align: top;} .tab_karriere td:first-child {width: 240px; padding-right: 10px;} .tab_karriere td:first-child img{width: 100% !important; padding-top: 6px;} .tab_karriere td p {margin: 0 0 10px 0;} /* --------------- PRODUKTE --------------- */ table.vorteile h4{font-size: 14px; font-weight: bold;} table.vorteile td:first-child {padding: 10px 15px 4px 0px;} table.vorteile td:nth-child(2) {padding: 10px 0px 4px 0px;} .tvcontainer {width: 1200px; height: 600px; position: relative; background-image: url('../../../files/inhalte/produkte/programmumfang/willk-monitor/tv-background.jpg'); background-size: contain; margin: 0px auto 30px auto;} .monitorimg {position: absolute; animation: round 16s infinite; opacity: 0; width: 100%; height: auto;} @keyframes round { 25% {opacity: 1;} 40% {opacity: 0;} } .tvcontainer img:nth-child(1) {animation-delay: 12s;} .tvcontainer img:nth-child(2) {animation-delay: 8s;} .tvcontainer img:nth-child(3) {animation-delay: 4s;} .tvcontainer img:nth-child(4) {animation-delay: 0s;} /* --------------- AKTUELLES --------------- */ .beitrag {border-bottom: 1px solid #ddd; margin-bottom: 30px; padding-bottom: 20px;} .fachbeitraege .header tr td {border-top: none; vertical-align: top; padding: 6em 5em 2em 5em;} .fachbeitraege h1, .fachbeitraege h3 {margin: 15px 0 5px 0;} .fachbeitraege h3 {font-family: 'Verdana', sans-serif !important; font-weight: bold; font-size: 16px !important; margin-bottom: 0px;} #buchbestellform {margin: 50px 0;} /* --------------- SUPPORT --------------- */ .small-fab img {width: 260px !important; height: auto; margin-top: 15px;} .small-fab .image_container.float_right {width: inherit;} .center {text-align: center;} /* PSA Zertifizierung */ p.psa-headline {font-family: 'Raleway'; font-size: 22px; color: #df252b;} /* Distrigo (erweiterter Support) */ #distrigo p {text-align: justify;} #distrigo table {margin: 35px 0 15px 0; background-color: #ededed;} #distrigo table tr td {border-bottom: 15px solid #fff;} #distrigo table tr td:first-child {min-width: 100px; text-align: center;} #einrichtung-app-db fieldset {border: none; margin-bottom: 0px;} .wrapper-grey-bg {background: #eee; padding: 20px 30px; margin-bottom: 20px;} .wrapper-grey-bg .widget {border-top: 1px solid #d3d3d3;} .wrapper-grey-bg .widget.einrichtung-db {border-top: none;} .db-wrapper, .app-wrapper, .linux-wrapper, .db-app-wrapper {padding: 0em 1em 2em 2em;} .v-einrichtung-db {color: red;} .form-headline-bigger {font-size: 20px !important;} span.float-r {float: right;} span.float-r:after {float: none;} /* Loco-News per E-Mail anfordern */ #loco-news_form .full {width: 100%;} /* --------------- MEDIATHEK --------------- */ #videothek h1, #videothek p, #videothek h4.title span {text-align: center;} #videothek p {margin-bottom: 30px;} /* UMFRAGE */ #tyre24 .radio_container legend {display: none;} input#ctrl_1073 {width: 40%;} #umfrage-tonal {background: #ededed; padding: 20px;} #umfrage-tonal div.umfrage-select {width: 70%; display: inline-block; text-align: center;} #umfrage-tonal select, #umfrage-tonal label {width: 40%; margin: 10px 5%;} #umfrage-tonal .submit_container {width: 25%; display: inline-block; text-align: center;} fieldset#ctrl_1264 {border: none; margin-bottom: 0px;} .text-center, .text-center p {text-align: center;} /* ANFORDERUNGSFORMULAR */ .widget-textarea label, .widget-text label, .widget-text input, .widget-textarea textarea, .widget-select select .widget-textarea label, .widget-select label, .widget-password label, .widget-fineuploader label, .footer_form input.text {width: 60%} .custom_infoicon {width: 18px; height: 18px; border-radius: 50%; border: 1px solid #888888; text-align: center; font-size: 12px; background: #efefef; margin-top: 10px; cursor: help;} .custom_infoicon:hover {border: 1px solid #a0161a; color: #fff; background: #df252b; cursor: help;} h3.form-headline {font-size: 13px; font-weight: normal !important; margin: 5px 0;} /* Link im horizontalen Navigationsmenue (Submenue) ausblenden */ #submenu li a[href="support/programmanforderungen.html"], #submenu li a[href="programmanforderungen.html"], #submenu li a[href="support/programmanforderungen.html"], #submenu li a[href="support/erweiterter-distrigo-support.html"], #submenu li a[href="support/ddc-schnittstellen-einrichtung.html"], #submenu li a[href="support/xfi-schnittstellen-einrichtung.html"], #submenu li a[href="schulung/seminare/uebersicht.html"], #submenu li a[href="schulungsseite-entwurf/webinare/uebersicht-webinare.html"], #submenu li a[href="schulung/webinare/uebersicht.html"], #submenu li a[href="aktuelles/kassensichv-ab-01-01-2020.html"], #submenu li a[href="aktuelles/firmen-news/details.html"], #submenu li a[href="aktuelles/programm-news/details.html"], #submenu li a[href="aktuelles/loco-news/abmeldung.html"], #submenu li a[href="datenbank-support.html"], #submenu li a[href="vorteile-der-programmiersprache-cobol.html"], #submenu li a[href="testseite.html"], #submenu li a[href="umfrage.html"], #submenu li a[href="aktuelles/intern-faq-umsatzsteuersenkung.html"], #submenu li a[href="aktuelles/locommunity-alt.html"], #submenu li a[href="produkte/fuer-at-rksv-neu.html"] {display: none !important;} nav#mainmenu li.submenu:hover ul a:after {display: none !important;} nav#mainmenu ul ul li a span {width: max-content;} .hide-form .footerform, .hide-stars span.mandatory {display: none;} #ctrl_221 label {width: 90%;} /* Dropdown-arrow dauerhauft bei Loco-News wegblenden */ #submenu ul li.submenu a[href="loco-news.html"]::after {display: none !important;} .ce_revolutionslider h3 {text-transform: none !important;} /*.widget-radio label {width: 39.75%; display: inline-block;}*/ .no-mandatory span.mandatory {display: none;} ::-webkit-input-placeholder {color: #c8c8c8;} :-moz-placeholder {color: #c8c8c8; opacity: 1;} ::-moz-placeholder {color: #c8c8c8; opacity: 1;} :-ms-input-placeholder {color: #c8c8c8;} ::-ms-input-placeholder {color: #c8c8c8;} .widget-checkbox input:checked + label {background-color: unset !important; color: inherit !important;} div.tab-frame input:checked + label { background-color: #df252b; color: white; cursor: default; } @media only screen and (max-width: 1280px) { .fachbeitraege .header tr td {padding: 1em;} } @media only screen and (max-width: 880px) and (min-width: 640px) { #anforderungsformular td.col_0.col_first{ width: 100px; overflow-wrap: break-word; word-wrap: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; -moz-hyphens: auto; hyphens: auto; } #anforderungsformular td {padding: 0.25em;} } @media only screen and (max-width: 640px) { form#anforderungsformular tr td {text-align: center;} .custom_infoicon {margin-top: 0px; margin-bottom: 10px; margin-left: auto; margin-right: auto;} .upload-field {display: none;} td.td_icon {border-bottom: 1px solid #eee;} .hasTooltip:hover span {right: 0; width: 85%;} .fachbeitraege .header tr td {display: inline-block; padding: 3em; width: 50%;} } /* WEBNEWS (Störmeldefunktion) */ h1.trouble {font-family: 'Raleway', 'Verdana', sans-serif; font-size: 30px; color: #df252b; margin-bottom: 20px;} div.trouble {border-bottom: 1px solid #ededed; margin-top: 15px;} .trouble .image_container {float: left; margin-right: 20px;} .trouble img {width: 64px !important; height: 64px; margin-top: 15px;} .trouble table {border: none; font-size: 14px; margin-bottom: 20px;} .trouble table td:first-child {width: 100px; height: auto; vertical-align: middle;} .w-hinweis2 {width: 100%; margin: 50px 0 15px 0; text-align: center; padding: 18px 5px 0 5px; border: #cecece 1px solid; display: inline-block;} @media only screen and (max-width: 880px) { .trouble img {margin: 0 auto !important;} } /* TOOLTIP */ .hasTooltip {margin: 0px auto;} .hasTooltip span {display: none; color: #000; text-decoration: none; padding: 3px;} .hasTooltip:hover span {display: block; position: absolute; right: 5px; background-color: #ededed; border: 1px solid #CCC; margin: 2px 10px; padding: 10px; width: 362px; height: auto;} .hasTooltip span img {margin-top: 8px;} /* --------------- SONSTIGE --------------- */ .ce_gallery .row3 {margin-left: 2%; width: 23% !important;} .mb-40 {margin-bottom: 40px;} .card-style {background-color: #efefef; padding: 20px;} .hide-nav nav#submenu {display: none !important;} .ce_form .captcha-container {background: #F8F8F8;} .ce_form .captcha {float: right; margin-right: 0;} /*.widget-captcha {display: block !important;}*/ .ce_form .captcha_text {float: none;} .ce_form .captcha-container label.mandatory {font-weight: bold;} .ce_form .captcha-container p.error {margin-bottom: 0px;} /*Zoom In*/ img.zoom {-webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out;} img.zoom:hover {-webkit-transform: scale(1.05); transform: scale(1.05);} .flex-layout {display: flex; flex-direction: row; gap: 30px; padding: 30px !important;} h4.title {position: absolute; left: 0%; bottom: 0; font-family: Verdana, sans-serif !important; padding: 10px; text-align: left; background-color: rgba(0,0,0,0.5); transition: all 0.2s ease-out 0s; margin-bottom: 0px;} .update-text {width: 62%; margin-right: 4%; float: left;} .loco-werbung2 {width: 410px; height: auto; float: left;} .no-margin-btm {margin-bottom: 0px !important;} label.mind-16:after {content: '(Mindestalter: 16 Jahre)'; display: block; font-size: 12px;} .cb-container {border: 1px solid #ccc; margin-top: 7px; margin-bottom: 7px;} .cb-container .widget {border:none; padding-top: 0px; padding-bottom: 0px;} .cb-container .widget fieldset {border: none; margin-bottom: 0px;} .widget.cb-datenschutz {border-top:none;} .mt-0 {margin-top: 0px!important;} .mt-40 {margin-top: 40px!important;} .fadeInDown {-webkit-animation-name: fadeInDown; animation-name: fadeInDown; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;} @-webkit-keyframes fadeInDown {0% {opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0);} 100% {opacity: 1; -webkit-transform: none; transform: none;}} @keyframes fadeInDown {0% {opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0);} 100% {opacity: 1; -webkit-transform: none; transform: none;}} .scale-bw {opacity: 0; animation: myAnim 300ms ease-in 2s 1 normal forwards; position: absolute; z-index: 2; top: 30%; left: 40%; transform: translate(-50%, -50%);} .w50 {width: 50%; border-top: 0px;} .w50:first-child {padding: 0px 40px 0px 0px;} @keyframes myAnim { 0% {opacity: 0; transform: scale(2);} 100% {opacity: 1; transform: scale(1);} } .max-w {max-width: 680px; margin: 40px auto 20px auto;} .zert-animation {opacity: 0; animation: zert 300ms ease-in 1s 1 normal forwards; position: absolute; z-index: 2; top: 0%; right: 0%; transform: translate(-50%, -50%);} @keyframes zert { 0% {opacity: 0; transform: scale(2);} 100% {opacity: 1; transform: scale(1);} } .pulse { animation: pulse 1s infinite ease-in-out alternate; } @keyframes pulse { from { transform: scale(0.95); } to { transform: scale(1.05); } } /* Buttons */ #myBtn {background: none; color: #df252b!important; cursor: pointer; font-family: verdana; font-size: 14px;} /* Button für AGB */ a.callus {display: none; transition: all 0.2s ease-out 0s; padding: 10px 12px; background: #df252b; color: #ffffff; text-align: center; margin: 0 15px 30px 15px;} .web-details .teaserspacer a, a.mobilbutton, a.redbutton, button.submit {font-weight: normal; font-size: 14px; transition: all 0.2s ease-out 0s; margin-top: 15px; padding: 9px 12px; background: #df252b; color: #ffffff; text-align: center; display: inline-block;} a.mobilbutton, .hide-headline h4 {display: none;} a.mobilbutton:hover, a.redbutton:hover, a.callus:hover {color: #ffffff; background-color: #be1c22; text-decoration: none;} .productinfo {margin-top: 20px;} .productinfo label {cursor: pointer;} .productinfo a {color: #333; background-color: #e8e8e8; padding: 10px 20px ; text-decoration: none;} .productinfo a:hover {color: #ffffff!important; background-color: #be1c22; text-decoration: none !important;} .web-details .teaserspacer a, .button {color: #ffffff !important; text-decoration: none; cursor: pointer !important;} a.grey {background-color: #9d9d9d !important;} a.grey:hover {background-color: #df252b !important;} a.grey.mfp-close {position: relative; width: inherit; height: auto; line-height: inherit; opacity: 1; padding: 8px 16px;} a.grey.mfp-close:active {top: inherit;} .mod_search .widget-text {width: auto !important;} .mod_search .widget-submit {top: inherit !important; left: inherit !important;} .mod_search .widget {height: auto !important; padding: 0; border-top: none;} .web-details .teaserspacer a:hover, .button:hover {color: #ffffff; background-color: #be1c22 !important; text-decoration: none !important;} .button:disabled, input[type="submit"]:disabled, input.submit:disabled {background: #A0A0A0 !important; cursor: default !important;} .blue {background-color: #014489!important;} .blue:hover {background-color: #003770!important;} .button img.b-icon {width: 38px; height: auto;} .button:has(> img.b-icon) {padding: 0px;} /* File-Upload, u.a. für OCB auf Karriereseite */ .qq-upload-button {display: inline-block; width: auto; padding: 7px 15px;} .button, input[type="submit"], button.submit, button.submit, .qq-upload-button {color: #fff; background: #df252b; cursor: pointer;} .button, input[type="submit"]:hover, button.submit:hover, button.submit:hover {background: #b32428;} input[type="file"] {border: 2px dashed rgba(0, 0, 0, 0.3); border-radius: 5px; padding: 20px;} #anforderungsformular .upl input {width: 52% !important;} input#ctrl_934 {width: 44%;} /* */ .widget-checkbox.anforderung {width: 100%;} div.unsichtbar {display: none;} /* Hinweis-Box mit Textur */ .w-hinweis {width: 100%; margin: 25px 0 50px 0; text-align: center; padding: 15px 5px 5px 5px; border: #df252b 2px solid; display: inline-block;} .w-hinweis p {max-width: 940px; margin: 20px auto;} .w-hinweis_full {width: 100%; margin: 25px 0; text-align: center; padding: 5px; background: url(../img/promo.png) repeat; margin: 30px 0;} .w-hinweis_full img {padding: 0 5px 0 10px;} p.hinweistext, ul.hinweistext li a {color: #df252b;} /* Tabellen-Styles */ table.half td {width: 50%;} a.h3-button {color: #fff !important; padding: 15px 20px; background-color: #DF252B;} a.h3-button:hover {color: #000 !important; text-decoration: none;} .td-null td{border: 0 !important;} .td-null a{display: block;} .td-null h3, table td strong {font-size: 14px;} .grid-archiv {font-size: 14px; font-weight: bold; padding: 0;} .grid-archiv li{display: inline-block; margin: 0 10px;} table.preisinfo {border: 1px solid #96a699; width: 100%;} table.preisinfo tr.table-head {color: #ffffff; background-color: #df252b;} table.preisinfo tr.table-head td {color: #ffffff; font-weight: bold;} table.preisinfo tr td {text-align: left; padding-right: 1em;} table.half-float-left {width: 45%; font-size: 14px; float: left;} table.half-float-right {width: 45%; font-size: 14px; float: right;} table.half-float-left td, table.half-float-right td {padding: 1em 0;} table.half-float-left tr td:nth-child(2), table.half-float-right tr td:nth-child(2) {text-align: right;} div.vline {border-left: 4px solid #ededed; height: 240px; float: left; margin-top: 30px; margin-left: 5%;} table.filledbg tr {background-color: #dcdcdc;} table.fullwidth {width: 100%} table.fullwidth td, .strong {font-weight: bold;} table.datenbank {width: 100%; border: 1px solid #ddd; margin: 40px 0px;} table.datenbank tr th {background-color: #df252b; color: #ffffff; font-weight: bold;} table.datenbank tr td, table.datenbank tr th {border: 1px solid #ddd; padding: 5px; text-align: left;} table.datenbank tr {background-color: #fff;} table.datenbank tr:nth-child(2n) {background-color: #f8f8f8;} .one_third-c {width: 38%; float: left; position: relative;} .one_third-c .expanding-grid ul.links li:first-child {padding: 0px;} .two_third-c {width: 58%; margin-right: 4%; float: left; position: relative;} .berichte table tr:hover {background: #F8F8F8;} .berichte table img {width: 40px; height: 40px;} .berichte table a {display: flex;} p.flex {display: inline-flex;} p.flex a.button {margin: 0px 5px;} span.big {text-transform: uppercase;} h4.down {text-transform: normal;} h4.uppercase {letter-spacing: 2px; text-transform: uppercase;} .boldsmall {font-weight: bold; font-size: 12px; margin: 10px 0;} .small {font-size: 12px;} .date-text {font-size: 12px; color: #999; margin: 10px 0px;} img.azubi {width: 100px; height: 126px; margin: 10px; float: right;} a.redlink {color: #DF252B; text-decoration: underline; font-weight: bold;} .footer_form input[type="text"], input[type="textarea"], input[type="tel"], input[type="email"]{font-family: verdana !important;} #footer button.submit, .footer_form input.submit {margin-top: 0px; float:none !important;} .footer_form table {width: 100%; border-bottom: 0;} .teambox {height: 400px;} table td.col_0 { vertical-align: top; /*padding-top: 10px;*/ width: 32%;} select.anrede {width: 120px;} /* VK-Schild */ #schild {border: 1px solid #ccc;} .vks1 {padding-right: 15px;} .vks1, .vks2 {width: 50%; float: left; margin-bottom: 25px;} /* Checklist with arrows */ ul.checklist, ul.red, ul.square {padding-left: 0; margin-bottom: 15px;} ul.checklist a {color: #df252b !important;} ul.checklist li {background: url(../../../files/inhalte/content-images/tick-small.png) no-repeat 4px 2px; list-style-type: none; text-decoration: none; padding: 2px 8px 0px 30px; font-size: 14px;} ul.red li {background: url(../../../files/inhalte/content-images/tick-small-red.png) no-repeat 4px 2px;} /* Red Arrows */ ul.plus li {background: url(../../../files/inhalte/content-images/plus.png) no-repeat 4px 2px;} /* Red Plus */ ul.square li {background: url(../../../files/inhalte/content-images/square-red.png) no-repeat 4px 4px; list-style-type: none; text-decoration: none; padding: 2px 8px 0px 30px; font-size: 14px;} ul.square-green {padding-left:0} ul.square-green li {background: url(../../../files/inhalte/content-images/square-green.png) no-repeat 4px 4px; list-style-type: none; text-decoration: none; padding: 2px 8px 0px 30px; font-size: 14px;} ul.square-green li:before {margin-left:0;} ul.longline li {background: url(../../../files/inhalte/content-images/longline.png) no-repeat 4px 4px;} /* Akquise - Freundschafgtsspiel (Ford) */ ul.square-blue li {background: url(../../../files/inhalte/content-images/square-blue.png) no-repeat 4px 4px;} /* Blue Square */ #azubivorstellung_tab ul.red li {background: url(../../../files/inhalte/content-images/tick-small-red.png) no-repeat 4px 0px; padding-left: 34px; display: flex;} /* Vorgehen-Grafik */ #vorgehen, #vorgehen td {border: 0;} #vorgehen td {padding: 15px 15px 0 0;} #vorgehen h2 {margin-top: 15px;} #vorgehen h3 {font-size: 14px; font-weight: bold; padding-bottom: 0px;} table#vorgehen div.line {width: 28px; height: 60px; border-right: 1px solid #ededed;} .bottomtext {border-top: 2px solid #ededed; padding: 10px 0; margin-top: 50px;} /* Responsive Design Right-Sidebar Navigation */ #submenu ul ul {display: block;} #submenu ul ul a:before {font-family: "icons"; content: '\25b8'; margin-right: 5px;} #submenu li a[href="details-onlineupdates.html"], #submenu li a[href="details-firmennews.html"], #submenu li a[href="details-programm-news.html"], #submenu li a[href="aktuelles/online-updates.html"], #submenu li a[href="http://loco-soft.ch/support/programm-anforderungen.html"], #submenu li a[href="karriereseite.html"], #submenu li a[href="loco-news-abmeldung.html"], #submenu li a[href="foerderprogramme.html"], #submenu li a[href="mediathek/mein-loco.html"], #submenu li a[href="stellenangebot.html"], #submenu li a[href="bewerbungsprozess.html"] {display: none !important;} #wrap a[href="#tab1"]{display:none;} .legend {border-spacing: 2px; border-collapse: separate;} .legend span:before {content: ""; display: inline-block; width: 5px; height: 5px; margin-bottom: 4px; margin-right: 5px;} .legend span.one:before {background: #009036;} .legend span.two:before {background: #ffe800;} .legend span.three:before {background: #e2001a;} .legend td {width: 20%; text-align: center; margin: 3px; padding: 2px; border: none !important;} .semical td:first-child {background: #cce599;} .semical td:nth-child(2) {background: #99cc33;} .semical td:nth-child(3) {background: #ffb7a7;} .semical td:nth-child(4) {background: #e3d8c2;} .semical td:nth-child(5) {background: #99d0f0;} /* Edge Browser Hack for webfont */ _:-ms-lang(x), _:-webkit-full-screen, h1.headline1, p.headline1 {font-family: Verdana, sans-serif;} _:-ms-lang(x), _:-webkit-full-screen, h2.headline2, p.headline2 {font-family: Verdana, sans-serif;} /* Bestellformular Kasse, Scanner & Co. */ #kasse-scanner-co td.img {padding: 0px 20px 0px 0px;} table.noborder td {border-top: 0;} #bestellform tr.row_2.even, #bestellform tr.row_3.odd, #bestellform tr.row_4.even, #bestellform tr.row_5.odd {display: none;} #kasse-scanner-co h3{font-size: 18px;} /* Formatierung der automatsch erstellten Eingabefelder für Mengenangaben */ #ctrl_328, #ctrl_330, #ctrl_331, #ctrl_331, #ctrl_332, #ctrl_333, #ctrl_334, #ctrl_335, #ctrl_336, #ctrl_338 , #ctrl_499, #ctrl_500, #ctrl_501, #ctrl_503, #ctrl_579, #ctrl_580, #ctrl_581, #ctrl_843, #ctrl_843, #ctrl_845, #ctrl_846, #ctrl_959, #ctrl_960, #ctrl_961, #ctrl_962, #ctrl_965, #ctrl_979, #ctrl_980, #ctrl_981, #ctrl_982, #ctrl_985, #ctrl_1001, #ctrl_1002, #ctrl_1003, #ctrl_1004, #ctrl_1007, #ctrl_1139, #ctrl_1140, #ctrl_1141, #ctrl_1517 {border: 1px solid #ccc !important; width: 75px!important; padding: 2px 4px; margin-left: 5px;} label.sub-input1:before , label.sub-input2:before , label.sub-input3:before, label.si-ks-schw:before, label.si-ks-weiss:before, label.sub-input-zub:before, label.sub-input_llc:before, label.sub-input-ec:before, label.sub-input-ze:before {content:''; margin-left: 10px;} input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {opacity: 1;} :-ms-input-placeholder {color: #bbb;} .sub-rb {margin-bottom: 0;} .nummernfeld {width: 100%;} /*.widget-text.si-ks-schw, .widget-text.si-ks-weiss {display: inherit;}*/ .checkbox_container span {display: block; margin-bottom: 15px;} /* Bestellformular Signaturerstellungseinheit */ form.long-text h4 {font-weight: bold;} form.long-text tr.row_1 td, form.long-text tr.row_3 td {border-top: none;} /* PPSO-Bestellung (nur .DE) */ .ppso-cell {margin-bottom: 0px !important; margin-top: 20px !important;} .ppso-logos {text-align: center;} .ppso-logos img{padding-top: 40px;} /* Loco-News Formular */ label.mandatory_info:after {content: '(Empfangsadresse f\00fcr Loco-News)'; display: block; font-size: 11px;} label.mandatory_info_abm:after {content: '(zur Abmeldung der Loco-News)'; display: block; font-size: 11px;} #abmeldung {text-align: right; font-size: 11px;} #abmeldung a {color: #df252b;} fieldset.error {border: 1px solid red !important;} fieldset.error:before {content: 'Bitte haken Sie die Checkbox an!'; display: block; font-size: 14px; color: red; margin-bottom: 5px;} /* DIH Formular */ label.mandatory_zugangsdaten:after {content: '(Empfangsadresse f\00fcr die Zugangsdaten)'; display: block; font-size: 11px;} label.mandatory_alle-betriebe:after {content: '(Nummer f\00fcr ALLE Betriebe)'; display: block; font-size: 11px;} .widget-formatierung fieldset {margin-bottom: 0px;} table#impressum td{width: 33%;} .sprachwechsler {display: none;} /* ANFORDERUNGSFORMULAR ANFANG */ .custom_infoicon {width: 18px; height: 18px; border-radius: 50%; border: 1px solid #888888; text-align: center; font-size: 12px; background: #efefef; margin-top: 10px; cursor: help;} .custom_infoicon:hover {border: 1px solid #a0161a; color: #fff; background: #df252b; cursor: help;} h3.form-headline {font-size: 14px; font-weight: bold; margin: 5px 0;} ::-webkit-input-placeholder {color: #c8c8c8;} :-moz-placeholder {color: #c8c8c8; opacity: 1;} ::-moz-placeholder {color: #c8c8c8; opacity: 1;} :-ms-input-placeholder {color: #c8c8c8;} ::-ms-input-placeholder {color: #c8c8c8;} .hasTooltip span {display: none; color: #000; text-decoration: none; padding: 3px;} /* Tooltip: */ .hasTooltip:hover span {display: block; position: absolute; right: 5px; background-color: #ededed; border: 1px solid #CCC; margin: 2px 10px; padding: 10px; width: 362px; height: auto;} .hasTooltip span img {margin-top: 8px;} div.tab-frame input.hide {display:none;} div.tab-frame label.element {display:block; float:left; padding:12px 16px; cursor:pointer; font-size: 14px; background-color: #e8e8e8;} label#lbl_599_0 {background-color:inherit; color:inherit;} /* Datenschutzeinwilligung Kontakt */ /*div.tab-frame input:checked + label, div.tab-frame input:checked + label:after{background-color:#df252b; color:white; cursor:default}*/ div.tab-frame input:checked + label {background-color:#df252b; color:white; cursor:default} div.tab-frame div.tab{ display:none; padding: 25px 0;clear:left; border-top: 5px solid #df252b; margin-right: 10px;} div.tab-frame input:nth-of-type(1):checked ~ .tab:nth-of-type(1), div.tab-frame input:nth-of-type(2):checked ~ .tab:nth-of-type(2), div.tab-frame input:nth-of-type(3):checked ~ .tab:nth-of-type(3), div.tab-frame input:nth-of-type(4):checked ~ .tab:nth-of-type(4), div.tab-frame input:nth-of-type(5):checked ~ .tab:nth-of-type(5), div.tab-frame input:nth-of-type(6):checked ~ .tab:nth-of-type(6), div.tab-frame input:nth-of-type(7):checked ~ .tab:nth-of-type(7), div.tab-frame input:nth-of-type(8):checked ~ .tab:nth-of-type(8), div.tab-frame input:nth-of-type(9):checked ~ .tab:nth-of-type(9), div.tab-frame input:nth-of-type(10):checked ~ .tab:nth-of-type(10), div.tab-frame input:nth-of-type(11):checked ~ .tab:nth-of-type(11) {display:block;} .tabto .bx-viewport {height: auto !important;} /* Stellenangebote-Seite */ .psa-img img {width: 300px !important; height: auto;} /* Kontakt */ .adress {margin-top: 25px;} /* --- TSE START --- */ table.tse tr td {border-top: none;} table.tse tr td.one {width: 60%; padding-right: 4%;} table.tse tr td.two {width: 36%;} /* TSE Videolayout */ .app-container2 {background: #f8f8f8; padding: 4%; margin-top: 15px;} .app-container2 .c-one {width: 48%; float: left; margin-right: 4%;} .app-container2 .c-two {width: 48%; float: left;} .app-container2 .one-fourth {width: 22%; display: inline-block; margin-right: 3%; vertical-align: top;} /* Siteware */ .app-container3 {background: #f8f8f8; padding: 4%; margin-top: 15px; text-align: center;} .app-container3 .c-one {width: 47%; float: left; margin: 1%;} .app-container3 .c-two {width: 47%; float: left;} .app-container3 .one-half {width: 47%; display: inline-block; margin: 1%; vertical-align: top;} .mw-880 {max-width:880px; margin: 0 auto;} .center, .center h1, .center p {text-align: center} .center p.bigger {font-size: 1.05rem} /* Make Yt-Video responsive */ .video-container {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;} .video-container iframe, .video-container object, .video-container embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} /* --- TSE ENDE --- */ .calltoaction p {text-align-last: left !important;} .w70 p {width: 70%;} .calltoaction p a {text-align-last: center;} .calltoaction.a-pos a {top: 13px; right: 15px;} .calltoaction a.inline {background: none; display: inline; color: #df252b; position: unset; padding: 0px;} .calltoaction.hp p {display: inline-block; float: left;} .calltoaction .hotline-buttons {display: inline-block; float: right;} .calltoaction .hotline-buttons a {position: relative; display: inline-block; margin: 6px; padding: 10px 12px; font-size: 14px;} .calltoaction.hardlocks p {width: auto; float: left; } .calltoaction.hardlocks a {display: inline-block; position: relative; float: right; font-size: 14px; margin-left: 25px; margin-bottom: 5px;} .image_container .caption {position: relative; padding: 6px 0;} /* UMFRAGE Renault-Schnittstellen */ #R1-R2 label {display: inline-block; width: 43%; text-align: left; padding: 12px 0;} #R1-R2 .radio_container {display: inline-block; width: 56%;} #R1-R2 .radio_container span {display: inline-block; width: 32%;} #R1-R2 .radio_container span label {display: inline-block; width: 85%;} #R1-R2 fieldset {border: none; margin-bottom: 0; padding: 0px;} #R1-R2 .radio_container legend {display: none;} #R1-R2 .radio_container input {width: 15px;} #R1-R2 input[type="text"], #R1-R2 textarea, #R1-R2 input[type="email"] {width: 60%; margin-left: 3%;} #R1-R2 p {margin-top: 10px;} #R1-R2 hr {margin: 5px 0; border-top: 1px solid #eee;} #R1-R2 .cb-datenschutz label {width: auto;} input#ctrl_956[type="text"], #ddc input[type="text"] {width: 60%;} /* Ford XFI-Umfrage und DDC*/ #ddc .checkbox_container {margin-bottom: 0px;} /* Magnific Popup CSS */ .mfp-container .content-video {width: 100%; margin-top: 20px; vertical-align: top; display: inline-block; text-align: justify;} .mfp-bg {top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 10px; box-sizing: border-box; } .mfp-container .content {width: 420px; vertical-align: top; display: inline-block; text-align: justify;} .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; box-shadow: none; touch-action: manipulation; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow:before, .mfp-arrow:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } .container { display: flex; max-width: 1140px; margin: 0 auto; padding: 100px 0; flex-wrap: wrap; .image { width: 32%; margin-left: 2%; margin-bottom: 20px; font-size: 0; img { width: 100%; } &:nth-child(3n+1) { margin-left: 0; } } } .mfp-content { position: relative; width: 100%; max-width: 840px; background-color: #fff; margin: 100px auto; padding: 30px; } .mfp-content img {padding-right: 30px;} .mfp-content .fullwidth {padding: 0 3%;} .mfp-content .fullwidth img {padding-right: 0px;} .mfp-content .fullwidth p.strong {margin-bottom: 10px;} .fullwidth .ce_gallery .row2 {margin-left: 0%;} .fullwidth .ce_gallery .row2:first-child {margin-right: 4%;} .post-modal { .image { width: 100%; margin: 0; img { width: 100%; } } .content { padding: 20px; font-size: 17px; h5 { font-size: 22px; font-weight: 600; } p { margin-bottom: 20px; font-weight: 300; &:last-child { margin-bottom: 0; } .popup-header { position: relative; padding-bottom: 20px; margin-bottom: 20px; border-bottom: solid 1px #D8D8D8; } } } .mfp-close { position: absolute; display: block; width: 50px; height: 50px; top: -50px; right: 0; background-color: #cc1429; padding: 0; border: 0; font-size: 0; cursor: pointer; transition: 0.15s; opacity: 1; &::before { content: ''; position: absolute; width: 17px; height: 3px; top: 50%; left: 50%; margin-top: -1.5px; margin-left: -8.5px; background-color: #fff; -ms-transform: rotate(45deg); -webkit-transforn: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } &::after { content: ''; position: absolute; width: 17px; height: 3px; top: 50%; left: 50%; margin-top: -1.5px; margin-left: -8.5px; background-color: #fff; -ms-transform: rotate(-45deg); -webkit-transforn: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } &:hover { background-color: #991429; } } } .mfp-fade.mfp-bg { opacity: 0; -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; -o-transition: all 0.15s ease-out; transition: all 0.15s ease-out; } .mfp-fade.mfp-bg.mfp-ready { opacity: 0.8; } .mfp-fade.mfp-bg.mfp-removing { opacity: 0; } .mfp-fade.mfp-wrap .mfp-content { opacity: 0; -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; -o-transition: all 0.15s ease-out; transition: all 0.15s ease-out; } .mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1;} .mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0; } .sec-left {display: block; width: 49%; float: left;} .sec-right {display: block; width: 49%; float: left;} @media only screen and (min-width: 1281px) { #buttoncontainer {margin-left: 15px;} .innerbtncontainer {margin-left: 5px;} .image_container.float_left {width: auto;} } @media only screen and (max-width: 1280px) and (min-width: 990px) { .innerbtncontainer {width: 135px; margin-left: 0;} nav#mainmenu ul li a {font-size: 12px; padding: 15px 1px;} .calltoaction p {width: 55% !important;} } @media only screen and (max-width: 1280px) { .leftarea {float: none; width: 100%;} .rightarea {float: none; width: 300px; margin-top: 20px;} .rightarea img{width: 300px;} .galerie-slide .slide {width: 920px !important;} .teambox {height: auto; width: 100%; margin-left: 0%;} .image_container.float_right, .image_container.float_left {width: 300px; margin-right: 20px;} h5#bubble {height: 180px; padding: 30px 25px 0 25px;} div.tab-frame label.element {padding: 8px 10px;} table#updatearea td.utext {width: 100% !important;} table#updatearea .utext h1{font-size: 20px;} .tvcontainer {width: 800px; height: 400px;} .app-container2 .one-fourth {width: 48%; margin-right: 1%;} } @media only screen and (max-width: 1280px) and (min-width: 990px) { .innerbtncontainer {width: 135px; margin-left: 0;} p.headline3 {font-size: 19px !important;} } @media only screen and (max-width: 989px) { #mm-1 span.active:before {content: '';} #matterhorn {position: absolute; left: 110px !important; top: 75px !important; width: 600px !important; height: auto;} #matterhorn img{width: 100% !important; height: auto !important;} #submenu {display: block;} #submenu ul ul a:before {display: none;} .galerie-slide .slide {width: 24% !important;} .expanding-grid .links > li {width: 100% !important;} .expanding-grid .links > li:nth-of-type(2n+1) {clear: left;} .expanding-grid .hentry .entry-image {float: none !important; width: 100% !important; margin-left: 0 !important; margin-bottom: 15px; padding: 0 !important;} .update-text {width: 100%; display: block; float: none;} .vk-area, .update-text {width: 100%; display: block; float: none;} .mod_calendar table {font-size: 10px;} .sticky #logo {top: 20px;} .sticky + #header_after, .sticky + #wrapper {padding-top: 120px;} #R1-R2 label {display: block; width: 100%; text-align: left; padding: 10px 0;} #R1-R2 .radio_container {display: block; width: 100%;} .mm-panel .mm-navbar, .mm-btn {line-height: 41px; height: 82px;} .mm-panels>.mm-panel>.mm-navbar+.mm-listview {margin-top: 20px;} .mm-listview>li::before, a.submenu::before, a.icon-contacts::before, a.mm-selected span.active::before {display: none !important;} .mm-listview>li>a, .mm-listview>li>span {padding: 20px 10px 20px 20px;} a.mm-title {padding: 20px;} .calltoaction .hotline-buttons {float: none; display: inherit;} .calltoaction .hotline-buttons a {margin: 6px 0px;} table.half-float-left, table.half-float-right {width: 100%; float: none;} table.half-float-left tr td:nth-child(2), table.half-float-right tr td:nth-child(2) {text-align: center;} .calltoaction.hardlocks p {float: none; text-align: center;} .calltoaction p {text-align-last: center !important;} div.vline {display: none;} h1.headline1, p.headline1 {font-size: 14px !important; margin-bottom: 3px !important;} h2.headline2, .slider-right-padding p.headline2, .slider-left-padding p.headline2, p.headline2 {font-size: 11px; margin-bottom: 3px !important;} .slider-right-padding p, .slider-right-padding a, .slider-left-padding p, .slider-left-padding p span, .slider-left-padding a {font-size: 9px !important; line-height: 1.4 !important;} .slide-button {padding: 4px 5px !important;} .sec-left, .sec-right {width: 100%; clear: both;} .w70 p {width: 100%;} .w50 {width: 100%; display: block;} .w50:first-child {padding: 0px;} } @media only screen and (max-width: 989px) and (min-width: 768px) { .innerbtncontainer {width: 113px; margin-left: 0;} h2.headline2 {display: none;}} @media only screen and (max-width: 768px) { .slide-2-headline {left: 0px !important;} /* Pos. des rechtsbündigen Textes ändern */ .app-container2 .c-one, .app-container2 .c-two {float: none; width: 100%; padding: 6%;} .app-container2 .c-two {padding-top: 6%;} #submenu li{border-bottom: 1px solid #ddd; text-align: center;} #submenu li a{padding: 12px;} ul.adress {display: inline-block;} h5#bubble {width: 100%; height: 120px;} #buttoncontainer {margin: 0 auto; width: 290px;} .innerbtncontainer, .btncircle, .cursor {width: 145px} h1.headline1 {display: block; margin: 0 0 0 0 !important; font-size: 70px !important; height: 100px;} .leftside {left: 15px !important; top: 15px !important;} .footer_form input[type="text"], input[type="textarea"], input[type="tel"], input[type="email"]{width: 100%;} #ctrl_48.textarea {max-width: 100%; min-width: 100%; display: block;} table#impressum td{width: 100%; display: block;} table.adress h5{font-size: 0; margin-bottom: 0px;} .adress li{text-align: left;} .sticky + #header_after, .sticky + #wrapper {padding-top: 81px;} #R1-R2 .radio_container span, #R1-R2 {display: block; width: 100%;} table td {display: block; border-top: 0;} table.half td {width: 100%;} ul.longline li {background: none; border-bottom: none !important; padding: 0 !important;} table.preisinfo {font-size: 12px;} table.preisinfo td {display: table-cell !important; border-top: 0; text-align: left !important;} table.preisinfo td:nth-child(2) {min-width: 70px;} table.preisinfo span {display: block;} table.preisinfo tr.table-head td {font-weight: normal;} table.preisinfo tr td {padding-right: 0.5em;} table.datenbank tr td, table.datenbank tr th {display: table-cell;} table#updatearea td {width: 100% !important;} div.ce_text td {width: 100% !important; height: auto !important;} #kasse-scanner-co tr td {text-align: left;} tr td {text-align: center;} div.tab-frame div.tab {border-top: 0; margin-right: 0px;} #umfrage-tonal div.umfrage-select, input#ctrl_1073 {width: 100%; display: block;} #umfrage-tonal select, #umfrage-tonal label {width: 100%; margin: 10px 0;} #umfrage-tonal .submit_container {width: 100%; display: block;} .table-update, .table-update table { width: 100%!important; } .table-update h2 {text-align: center;} .my_revolutionslider_5387 a span {width:100%;height:100%;display:block} table#updatearea td.bild, table#updatearea td.wtext {display: none !important;} #distrigo table tr td:first-child {display: none;} #distrigo table ul {padding-left: 0px;} #distrigo table ul li {list-style-type: none;} .tvcontainer {width: 500px; height: 250px;} .one_third-c, .two_third-c {width: 100%; margin: 0 0 15px 0;} .flex-layout {flex-direction: column; gap: 20px; padding: 20px;} .zert-animation {top: -10%} } @media only screen and (max-width: 880px) and (min-width: 640px) { #anforderungsformular td.col_0.col_first{width: 100px; overflow-wrap: break-word; word-wrap: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; -moz-hyphens: auto; hyphens: auto;} #anforderungsformular td {padding: 0.25em;}} @media only screen and (max-width: 640px) { div#tabs ul.infoboxen li {width: 100%;} div#tabs ul.infoboxen li a {display: block; width: 100%;} #matterhorn {left: 60px !important; width: 340px !important;} #kasse-scanner-co td.img {width: 340px; margin: 0 auto;} form#anforderungsformular tr td {text-align: center;} .custom_infoicon {margin-top: 0px; margin-bottom: 10px; margin-left: auto; margin-right: auto;} td.td_icon {border-bottom: 1px solid #eee;} .hasTooltip:hover span {right: 0; width: 85%;} .azubis td:first-child {width: 200px;} a.mobilbutton, .azubis td img{display: block;} .calltoaction {border-left: 0;} .button, .servicebox_4 a, .servicebox_5 a, .servicebox_6 a, input[type="submit"], input.submit {display: block;} .vks1 {padding-right: 0px;} .vks1, .vks2 {width: 100%; display: block;} .button {display: block; text-align: center; margin: 6px 0; margin-right: 0px !important;} .submit_container input {width: 100% !important;} .legend td, select.anrede, table td.col_0 {width: 100%;} .productinfo a {display: block; padding: 8px 0px; text-align: center;} fieldset.radiobuttonwidth {width: 100%; position: relative; left: 0; top: 0;} #slider-karriere p.subpageheadline1 {font-size: 20px !important;} #slider-karriere img, #slider-karriere p.subpageheadline2, .upload-field, .mobileheadline span, .mobileheadline em {display: none;} .custom_infoicon {margin-top: 0px; margin-bottom: 10px; margin-left: auto; margin-right: auto;} td.td_icon {border-bottom: 1px solid #eee;} .hasTooltip:hover span {right: 0; width: 85%;} form.ulf-form table td.col_0, table td.descr {width: 100%;} .download-grid {width: 100%; float: none;} .mobileheadline {top: 0 !important; left: 0 !important; width: 100%; height: 100%; text-align: center; padding-top: 16px !important;} .image_container.float_right, .image_container.float_left {width: 100%; margin-right: 0;} #updatearea .bild, #updatearea .wtext {display: none !important;} div.tab-frame label.element {width: 100%;} .widget-text, .widget-textarea, .widget-select, .widget-password, .widget-fineuploader {display: block !important;} .widget-text label, .widget-text input, .widget-textarea textarea, .widget-select select .widget-textarea label, .widget-select label, .widget-password label, .widget-fineuploader label, .footer_form input.text, .widget-select select {width: 100% !important; text-align: center !important; display: block;} .ce_gallery .row1, .ce_gallery .row2, .ce_gallery .row3, .ce_gallery .row4, .ce_gallery .row5, .ce_gallery .row6 {width: 100% !important; margin-left: 0% !important;} #bestellform .widget {border: none;} .app-container2 .one-fourth {width: 100%; margin-right: 0%; display: block;} } @media only screen and (max-width: 500px) { ul.links li a h3 {display: none;} .expanding-grid .links > li a{background-position:50% 50%;} } @media screen and (min-width: 768px) { .table-update, .table-update table { width: 100%!important; } .table-update td:nth-child(1) { display: none; } .table-update td:nth-child(2) { width: 20%!important; } .table-update td:nth-child(3) { display: none; } .table-update td:nth-child(4) { width: 80%!important;} } .mod_cms_accept_tags .submit.first { background-color: #7f8c8d!important; } .mod_cms_accept_tags .submit.all { background-color: #27ae60!important; color: #fff!important; }