/* global settings */ * { font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif; font-weight: inherit; font-size: inherit; color: inherit; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smooth: always; } html, body { font-weight: normal; font-size: 17px; font-weight: normal; color: black; height: 100%; min-height: 100%; margin: 0; padding: 0; line-height: 1.65; background-color: white; } select::-ms-expand { display: none; } *[ng-cloak] { display: none; } /* remove focus and active states (chrome, firefox) */ *:active, *:focus, a:active, a:focus, button:active, button:focus { outline: none; text-decoration: none; } /* basic global styles */ a { color: #0d0d0d; text-decoration: underline; } a:hover, a:visited, a:active, a:focus { color: #0d0d0d; text-decoration: underline; cursor: pointer; } figure a { text-decoration: none; color: inherit; } figure a:hover { text-decoration: none; color: inherit; } figure img { max-width: 100%; } em { font-weight: normal; font-style: italic; } strong { font-weight: bold; font-style: normal; } h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; font-weight: normal; line-height: 1.4; } h1 { font-size: 54px; color: #004486; margin-bottom: 1em; font-weight: normal; } h2 { font-size: 30px; color: #000000; margin-bottom: 0.7em; font-weight: normal; } h3 { font-size: 26px; color: #004486; margin-bottom: 0.7em; font-weight: normal; text-transform: uppercase; } h4 { font-size: 20px; color: #000000; margin-bottom: 0.7em; font-weight: bold; } .link-button { background-color: #004486; font-size: 17px; font-weight: bold; color: white; padding: 10px 20px 8px 20px; border-radius: 4px; text-decoration: none; } .link-button:hover, .link-button:active, .link-button:visited, .link-button:focus { text-decoration: none; color: white; } .link-button-bright { background-color: #0078be; } button.button-primary { background-color: #003f7c; } button.button-primary:hover { background-color: #003f7c; cursor: pointer; } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* generic layout */ .content { max-width: 100vw; min-height: 100vh; position: relative; background-color: white; overflow-x: hidden; } .page-container { } .page-inner { min-height: 100vh; } .page { max-width: 1920px; margin: 0 auto 0 auto; font-size: 17px; padding-top: 7.8em; } .mainpage {} .subpage {} article {} article > h1, article > h2 { margin-left: auto; margin-right: auto; padding: 0 275px 0 275px; } article > .grid-row, article > .grid-row-wide { margin: 0 -50px 0 -50px; padding: 0 275px 0 275px; } article .grid-row > .grid-col-1, article .grid-row > .grid-col-2, article .grid-row > .grid-col-3, article .grid-row > .grid-col-4, article .grid-row > .grid-col-5, article .grid-row > .grid-col-6, article .grid-row > .grid-col-7, article .grid-row > .grid-col-8, article .grid-row > .grid-col-9, article .grid-row > .grid-col-10, article .grid-row > .grid-col-11, article .grid-row > .grid-col-12 { padding-left: 50px; padding-right: 50px; float: left; min-height: 1px; } b { font-weight: bold; } section { } .paragraph { margin-bottom: 3em; } .paragraph-content {} .paragraph p {} .paragraph-content ul { list-style: none; padding: 0; margin-bottom: 1em; margin-top: 1em; } .paragraph-content ul li { background: url(../img/bulletpoint.svg) no-repeat 3px 9px; padding-left: 20px; } ︎ /* page/section/paragraph images */ .img-variant-desktop {} .img-variant-phone { display: none!important; } .page-img-list img { border-radius: 14px; } .section-img-list { max-width: 100%; } .section-img-list img { max-width: 100%; } .paragraph-img-list { margin-top: 2em; margin-bottom: 4em; } .img-list {} .img-title { display: block; } .img-subtitle { display: block; } .img-description {} .img-list-single {} /* download files */ .file-list img { display: none; } .file-list { margin-top: 1em; } .file-list > a { text-decoration: none; font-weight: bold; color: #004486; display: block; margin-bottom: 0.5em; } .file-list > a:hover { text-decoration: none; } .file-list .file-title:before { content: "\f15c"; font-family: "Font Awesome 5 Pro"; color: #f19000; padding-right: 0.6em; font-size: 22px; display: inline-block; } .download-file .file-title:before { content: "\f019"; } /* image viewer */ .image-viewer { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.7); display: none; z-index: 100; } .image-viewer-box { width: 100vw; height: 100vh; text-align: center; } .image-viewer-img { max-width: 100vw; max-height: 100vh; display: inline-block; display: inline-block; position: relative; top: 50%; transform: translateY(-50%); } .image-viewer-box img { max-width: 100vw; max-height: 90vh; } .image-viewer-close { width: 32px; height: 32px; position: absolute; right: -32px; top: -32px; background: url(../img/close_white.svg) no-repeat 0 0; } .image-viewer-close:hover { background-image: url(../img/close_orange.svg); } /* loading indicator */ .loading { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: none; z-index: 60000; background-color: rgba(0,0,0, 0.2); } .loading span { font-size: 100px; color: #999; position: absolute; top: calc(50% - 70px); left: calc(50% - 70px); } .page-loading { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: none; z-index: 60000; background-color: rgba(0,0,0, 0.2); } .page-loading span { font-size: 100px; color: #999; position: absolute; top: calc(50% - 70px); left: calc(50% - 70px); } /* sup list */ .sup-list .paragraph-content { display: flex; flex-direction: row; } .sup-list .paragraph-content > sup { display: block; padding-right: 10px; } .sup-list .paragraph-content > p { display: block; flex: 1 1 0; font-size: 14px; } .small-paragraph-margin .paragraph { margin-bottom: 1em; } .small-paragraph-margin .paragraph:last-child { margin-bottom: 3em; } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* header */ header { width: 100%; } .logo-nav-area { width: 100%; margin: 0 auto 0 auto; position: fixed; z-index: 1000; transition: all 0.25s ease-out; background-color: white; } .logo-nav-area-inner { padding: 1.6em 275px 0 275px; font-size: 22px; transition: all 0.25s ease-out; } .logo-nav-area-inner:after { content: ""; display: block; clear: both; } /* minimized header */ .header-scroll .logo-nav-area { box-shadow: 0 1px 10px rgba(0,0,0,0.4); } .header-scroll .logo-nav-area-inner { padding-top: 0.8em; } /* cookie banner */ .cookie-banner { background-color: #004486; color: white; font-size: 17px; display: none; position: fixed; margin: 0 auto 0 auto; bottom: 0; height: 250px; width: 100%; z-index: 1000; border-top: 1px solid white; box-shadow: 0px -5px 15px 0px rgba(0, 0, 0, 0.35); } .cookie-banner-inner { max-width: 1290px; margin: 0 auto 0 auto; padding: 35px 0% 75px 0; } .cookie-buttons { margin-top: 20px; } .cookie-banner a { border: 1px solid white; background-color: #f19000; color: white; width: auto; padding: 0 20px 0 20px; text-align: center; font-weight: 700; margin-right: 20px; text-decoration: none; transition: all 0.35s ease-out; display: inline-block; margin-bottom: 10px; border-radius: 6px; height: 46px; line-height: 44px; } .cookie-banner a:hover { text-decoration: none; opacity: 1; } .cookie-banner button { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid white; background-color: #f19000; color: white; width: auto; height: 2em; display: inline-block; padding: 0 20px 0 20px; font-weight: 700; margin-right: 20px; cursor: pointer; transition: all 0.35s ease-out; margin-bottom: 10px; border-radius: 4px; height: 46px; line-height: 44px; text-align: center; } .cookie-banner button:hover { opacity: 1; } /* logo */ /*.logo-area { float: left; line-height: 2.6; }*/ /*.logo img { width: calc(968px / 2); }*/ .logo-area { float: left; line-height: 2.6; display: flex; flex-direction: row; width: calc(968px / 2); } .logo img, .logo-left img { width: 100%; } /* scroll arrow */ @keyframes scroll_arrow_anim { from { top: -6px; opacity: 20%; } 40% { opacity: 100%; } 80% { opacity: 100%; } to { top: 6px; opacity: 20%; } } .scroll-arrow-container { position: fixed; left: 0; bottom: 50px; width: 100%; z-index: 1001; display: none; } .scroll-arrow { position: relative; margin: 0 auto 0 auto; width: 140px; height: 50px; background: url(../img/scroll-arrow-background.svg) no-repeat; cursor: pointer; } .scroll-arrow-inner { position: absolute; left: 0; top: 0; width: 140px; height: 50px; background: url(../img/scroll-arrow-down.svg) no-repeat; animation-name: scroll_arrow_anim; animation-duration: 1s; animation-delay: 0; animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: none; animation-play-state: running; } /* info buttons */ .info-buttons { position: fixed; right: 0; top: 250px; z-index: 100; } .info-buttons ul { list-style: none; } .info-buttons li > a { background-color: #004486; color: white; text-decoration: none; display: block; width: 74px; height: 74px; margin-bottom: 1px; z-index: 100; position: relative; } .info-buttons li > a:hover { background-color: #f19000; } .info-buttons li > a.info-button-active { background-color: #f19000; } .info-buttons li { position: relative; } .info-button { position: absolute; z-index: 50; right: -19em; top: 0; background-color: white; border: 2px solid #f19000; border-radius: 6px; width: 19em; padding: 1.5em 1.8em 1.5em 1.8em; visibility: hidden; transition: all 0.1s ease-out; } .info-button.info-button-active { right: 76px; visibility: visible; } .info-button-upper p, .info-button-lower p { font-weight: bold; line-height: 1.2; margin-bottom: 0.5em; } .info-button-upper p:first-child { color: #004486; font-size: 22px; font-weight: normal; } .info-button-lower { border-top: 2px solid #f19000; margin-top: 1em; padding-top: 1em; } .info-button-upper a, .info-button-lower a { color: #004486; text-decoration: none; padding-bottom: 0.7em; font-weight: bold; } .info-button .email:before { content: "\f0e0"; font-family: "Font Awesome 5 Pro"; color: #004486; padding-right: 0.6em; font-size: 17px; display: inline-block; } .info-button .tel:before { content: "\f095"; font-family: "Font Awesome 5 Pro"; color: #004486; padding-right: 0.8em; font-size: 17px; display: inline-block; } .info-button .link:before { content: "\f105"; font-family: "Font Awesome 5 Pro"; color: #004486; padding-right: 0.8em; font-size: 20px; font-weight: 900; display: inline-block; } .info-button1 .info-button { padding-bottom: 2em; } .info-button2 .info-button { padding-bottom: 2em; } .info-button0 > a { background-image: url(../img/icon_headset_01.svg); background-size: 100% 100%; border-top-left-radius: 10px; } .info-button1 > a { background-image: url(../img/icon_termin.svg); background-size: 100% 100%; } .info-button2 > a { background-image: url(../img/icon_information_01.svg); background-size: 100% 100%; } .info-button3 > a { background-image: url(../img/icon_login_02.svg); background-size: 100% 100%; border-bottom-left-radius: 10px; } /*icon_termin.svg*/ .info-button1 .info-button-lower { border-top: none; } .info-button1 a { color: white; } /* appointment button */ .appointment-button-container { position: fixed; right: 20px; bottom: 20px; z-index: 101; } .appointment-button { border: 2px solid #bebebe; width: 62px; height: 62px; border-radius: 31px; cursor: pointer; background-color: white; z-index: 103; position: relative;} .appointment-dialog { display: block; position: absolute; bottom: -6px; right: -400px; z-index: 101; transition: right 0.1s ease-out; } .appointment-dialog.appointment-dialog-open { right: 68px; } .appointment-dialog-corner { background-image: url(../img/corner.svg); width: 62px; height: 62px; position: absolute; right: -62px; bottom: 0; z-index: 101; } .appointment-dialog-content { border: 2px solid #f19000; border-radius: 8px; width: 360px; height: 250px; padding: 22px 30px 22px 30px; border-bottom-right-radius: 0; background-color: white; } .appointment-dialog-upper p { line-height: 1.2; font-size: 13px; } .appointment-dialog-upper p:first-child { font-size: 16px; font-weight: bold; margin-bottom: 20px; } .appointment-dialog-lower { margin-top: 25px; } .appointment-dialog-lower .link-button { font-size: 16px; } .appointment-dialog-close { position: absolute; right: 10px; top: 20px; width: 25px; height: 25px; cursor: pointer; } .appointment-dialog-close-bar1, .appointment-dialog-close-bar2 { width: 25px; height: 2px; background-color: #f19000; position: absolute; transform-origin: center; left: 0; top: 0; } .appointment-dialog-close-bar1 { transform: rotate(-45deg); } .appointment-dialog-close-bar2 { transform: rotate(45deg); } /* mobile menu info buttons */ .mobile-info-buttons { max-width: 298px; margin: 2em auto 0 auto; } .mobile-info-buttons ul { list-style: none; display: flex; flex-direction: row; } .mobile-info-buttons ul:after { content: ""; display: block; clear: both; } .mobile-info-buttons li { flex: auto; margin: 0 7px 0 7px; text-align: center; } .mobile-info-buttons li > a { background-color: #004486; color: white; text-decoration: none; display: inline-block; width: 64px; height: 64px; margin-bottom: 1px; z-index: 100; position: relative; border-radius: 8px; } .mobile-info-buttons li > a:hover { background-color: #f19000; } .mobile-info-buttons li > a.info-button-active { background-color: #f19000; } .mobile-info-button0 > a { background-image: url(../img/icon_headset_01.svg); background-size: 100% 100%; } .mobile-info-button1 > a { background-image: url(../img/icon_termin.svg); background-size: 100% 100%; } .mobile-info-button2 > a { background-image: url(../img/icon_information_01.svg); background-size: 100% 100%; } .mobile-info-button3 > a { background-image: url(../img/icon_login_02.svg); background-size: 100% 100%; } .mobile-info-buttons .info-button { z-index: 150; right: unset; left: 100vw; top: 190px; } .mobile-info-buttons .info-button.info-button-active { right: unset; left: calc(50vw - 9em); visibility: visible; } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* navigation */ .nav-close-button { display: none; position: absolute; right: 25px; top: 25px; width: 32px; height: 32px; background: no-repeat url(../img/close.svg); border: none; } .nav-close-button:hover { background-image: url(../img/close_white.svg); } /* hamburger button */ .nav-button { display: none; position: absolute; top: 25px; right: 25px; width: 30px; height: 22px; z-index: 51; z-index: 1002; transition: all 0.2s ease-out; } .nav-button-bar { background-color: #004486; width: 30px; height: 2px; position: absolute; left: 0; transform-origin: 0 0; transition: all 0.2s ease-out; } .nav-button-bar1 { top: 0; transition: all 0.2s ease-out; } .nav-button-bar2 { top: 10px; opacity: 1; transition: all 0.2s ease-out; } .nav-button-bar3 { top: 20px; transition: all 0.2s ease-out; } .nav-button.nav-open .nav-button-bar1 { transform: rotate(45deg); } .nav-button.nav-open .nav-button-bar2 { opacity: 0; } .nav-button.nav-open .nav-button-bar3 { transform: rotate(-45deg) translate(-2px,0px); } .nav-button.nav-open .nav-button-bar { background-color: #004486; } .nav-button:hover { top: 21px; height: 30px; } .nav-button:hover .nav-button-bar1 { top: 0; } .nav-button:hover .nav-button-bar2 { top: 14px; } .nav-button:hover .nav-button-bar3 { top: 28px; } .nav-button.nav-open:hover { top: 25px; height: 22px; } .nav-button.nav-open:hover .nav-button-bar1 { top: 0; } .nav-button.nav-open:hover .nav-button-bar2 { top: 10px; opacity: 0; } .nav-button.nav-open:hover .nav-button-bar3 { top: 20px; } /* mini navigation */ .mini-nav-area { background-color: #004486; font-size: 14px; color: white; padding: 0 275px 0 275px; line-height: 2.5; } .mini-nav-area:after { content: ""; display: block; clear: both; } .mini-nav { float: right; } .mini-nav a { color: white; text-decoration: none; border-right: 1px solid white; padding-left: 1.25em; padding-right: 1.25em; } .mini-nav li:last-child a { border-right: none; padding-right: 0; } .mini-nav a:hover { text-decoration: none; } .mini-nav li { float: left; } .mini-nav .nav-login { background-repeat: no-repeat; background-image: url(../img/icon_login_02.svg); background-position: 3px 2px; background-size: auto 80%; margin-left: 0em; } .mini-nav .nav-login a { padding-left: 2em; } /* language selector */ .language-selector { float: left; } .language-selector a { color: white; text-decoration: none; text-transform: uppercase; border-right: 1px solid white; padding-left: 0.8em; padding-right: 0.8em; } .language-selector a:first-child { border-left: 1px solid white; } .language-selector a:hover { text-decoration: none; } .language-selector .lang-active { font-weight: bold; } /* main navigation */ .nav-close-button { display: none; } .main-nav-container { } .nav-open .main-nav-container { } .nav-img-description { display: none; } .main-nav { float: right; line-height: 2.6; } .main-nav a { font-size: 22px; color: #004486; text-decoration: none; } .main-nav .nav-level0 > ul > li { float: left; position: relative; border-bottom: 3px solid transparent; margin-left: 2em; } .main-nav .nav-level0 > ul:after { content: ""; display: block; clear: both; } .main-nav .nav-level0 > ul > li.nav-active-path, .main-nav .nav-level0 > ul > li:hover { border-bottom: 3px solid #004486; } .main-nav .nav-level1 ul { display: none; position: absolute; background-color: white; margin-top: 3px; box-shadow: 0 4px 6px -4px rgba(0,0,0,0.4), 4px 2px 6px -4px rgba(0,0,0,0.4), -4px 2px 6px -4px rgba(0,0,0,0.4); } .main-nav .nav-level1 ul > li { font-size: 20px; line-height: 1.5; padding: 0.7em 1em 0.7em 1em; border-top: 1px solid #99b4cf; width: 16em; } .main-nav .nav-level1 ul > li:first-child { border-top: none; } .main-nav .nav-level1 a { font-size: 20px; } .main-nav .nav-level0 > ul > li:hover ul { display: block; border: 1px solid #99b4cf; border-radius: 12px; border-top-left-radius: 0; background-color: #eceff4; } .main-nav .nav-level0 > ul > li:hover ul > li:last-child { border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; } .main-nav .nav-level0 > ul > li:hover ul > li:first-child { border-top-right-radius: 12px; } /*.main-nav .nav-level0 > ul > li:hover ul > li.nav-active,*/ .main-nav .nav-level0 > ul > li:hover ul > li:hover { background-color: white; } .main-nav .nav-level0 > ul > li:hover ul > li:hover a { background-color: white; text-decoration: none; color: #f19000; } /* tablet navigation */ .main-nav-tablet { display: none; } @media (hover: none) { .main-nav-tablet { display: block; } .main-nav-desktop { display: none; } .main-nav .nav-level0 > ul > li ul.nav-open { display: block; } } /* mobile navigation */ .mobile-nav-container { display: none; position: absolute; left: 0; top: 77px; width: 100vw; height: calc(100vh - 77px); background-color: white; overflow-x: hidden; overflow-y: auto; } .mobile-nav-container-inner { width: 100vw; } .main-nav-mobile a { font-size: 20px; color: #004486; text-decoration: none; text-align: center; display: block; } .main-nav-mobile a:hover { text-decoration: none; color: #f19000; } .main-nav-mobile .nav-level0 > ul { margin: 0 20px 0 20px; } .main-nav-mobile .nav-level0 > ul > li { border-top: 1px solid #004486; padding: 0.7em 5px 0.7em 5px; max-width: 414px; margin: 0 auto 0 auto; text-align: center; } .main-nav-mobile .nav-level0 > ul > li:last-child { border-bottom: 1px solid #004486; } .main-nav-mobile .nav-level0 > ul > li > a:before { content: "\f054"; font-size: 20px; font-family: "Font Awesome 5 Pro"; font-weight: 200; display: block; float: right; } .main-nav-mobile .nav-level0 > ul > li.nav-leaf > a:before { content:""; } .main-nav-mobile .nav-level1 > ul { display: none; } .main-nav-mobile .nav-level1 > ul.nav-open { display: block; } .main-nav-mobile .nav-level0 > ul.nav-parent-parent-open > li { display: none; } .main-nav-mobile .nav-level0 > ul > li.nav-parent-open { display: block; border-top: none; } .main-nav-mobile .nav-level0 > ul > li.nav-parent-open > a { font-size: 14px; padding-bottom: 12px; } .main-nav-mobile .nav-level0 > ul > li.nav-parent-open > a:before { content: "\f053"; font-size: 20px; font-family: "Font Awesome 5 Pro"; font-weight: 200; display: block; float: left; margin-top: -4px; } .main-nav-mobile .nav-level1 > ul > li { border-top: 1px solid #004486; padding: 0.7em 5px 0.7em 5px; max-width: 414px; margin: 0 auto 0 auto; text-align: center; } .main-nav-mobile .nav-level1 > ul > li:last-child { border-bottom: 1px solid #004486; } .mobile-language-selector { text-align: center; margin-top: 1em; } .mobile-language-selector a { color: #004486; text-decoration: none; text-transform: uppercase; border-right: 1px solid #004486; padding-left: 0.8em; padding-right: 0.8em; display: inline-block; } .mobile-language-selector a:hover { text-decoration: none; } .mobile-language-selector a:first-child { border-left: 1px solid #004486; } .mobile-language-selector .lang-active { font-weight: bold; } .footer-nav-mobile { margin-top: 1.5em; } .footer-nav-mobile a { font-size: 16px; color: #004486; text-decoration: none; text-align: center; display: block; line-height: 2; } .footer-nav-mobile a:hover { text-decoration: none; color: #f19000; } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* footer */ footer { font-size: 17px; } .footer-fmhfactoring, .footer-claim, .footer-nav, .footer-bottom { margin: 0 auto 0 auto; padding: 0 275px 0 275px; } .footer-fmhfactoring { background-color: #efefef; color: white; display: flex; color: black; padding-top: 4em; padding-bottom: 4em; } .footer-fmhfactoring > div:nth-child(1) { width: 30%; padding-right: 1em; } .footer-fmhfactoring > div:nth-child(1) a { display: inline-block; max-width: 100%; overflow: hidden; } .footer-fmhfactoring > div:nth-child(2) { width: 40%; font-size: 15px; line-height: 1.2; } .footer-fmhfactoring > div:nth-child(2) img { display: block; margin-bottom: 1em; max-width: 100%; } .footer-fmhfactoring > div:nth-child(3) { width: 30%; text-align: right; padding-left: 1em; } .footer-fmhfactoring > div:nth-child(3) img { display: inline-block; max-width: 100%; } .footer-claim { background-color: #f19000; color: white; font-size: 34px; font-weight: 600; line-height: 0; padding-top: 1.2em; padding-bottom: 1.2em; text-align: center; } .footer-claim span { display: inline-block; line-height: 1.3; } .footer-nav { background-color: #004486; color: white; font-size: 18px; line-height: 1.4; padding-top: 4em; padding-bottom: 3em; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; } .footer-nav a { font-size: 18px; color: white; text-decoration: none; } .footer-nav a:hover { text-decoration: none; color: white; } .footer-nav .nav-level0 > ul > li > a { font-size: 14px; } .footer-nav .nav-level0 > ul > li > a { display: block; border-bottom: 1px solid white; max-width: 10em; padding-bottom: 1em; margin-bottom: 1em; } .footer-nav .nav-level0 > ul { display: flex; } .footer-nav .nav-level0 > ul > li { margin-left: 4em; width: 25%; } .footer-nav .nav-level0 > ul > li:first-child { margin-left: 0; } .footer-nav .nav-level0 > ul:after { content: ""; display: block; clear: both; } .footer-nav .nav-level1 > ul > li { margin-top: 0.5em; } .nav-agb:before { content: "\f15c"; font-family: "Font Awesome 5 Pro"; font-weight: 300; color: white; padding-right: 0.5em; font-size: 18px; display: inline-block; } .footer-nav .nav-login { background-repeat: no-repeat; background-image: url(../img/icon_login_02.svg); background-size: auto 110%; background-position: -6px -1px; padding-left: 1em; } .footer-bottom { padding: 1.4em 0 1.4em 0; background-color: white; line-height: 1.4; font-size: 16px; } .footer-bottom span { display: block; text-align: center; color: #004486; } .footer-icons { max-width: 13em; } .footer-icons-header { font-size: 14px; border-bottom: 1px solid white; padding-bottom: 1em; margin-bottom: 1em; } .footer-icons-list { display: flex; flex-direction: row; } .footer-icons-list a { display: block; flex: none; margin-right: 13px; } .footer-icons-logo { font-size: 14px; padding-bottom: 1em; margin-bottom: 1em; margin-top: 4em; } .footer-icons-logo-list { max-width: 10em; } .footer-icons-logo-list img { width: 100%; } /*footer:before { content:""; background-image: url(../img/line_white_top_flipped.svg); background-repeat: no-repeat; background-position-y: -1px; background-size: 100%; height: calc(100vw * 69 / 1920); display: block; background-color: #f19000; }*/ footer .footer-fmhfactoring-decoration { content:""; background-image: url(../img/line_white_top.svg); background-repeat: no-repeat; background-position-y: -1px; background-size: 100%; height: calc(100vw * 69 / 1920); display: block; background-color: #efefef; } footer .footer-claim-decoration { content:""; background-image: url(../img/line_white_top_flipped.svg); background-repeat: no-repeat; background-position-y: -1px; background-size: 100%; height: calc(100vw * 69 / 1920); display: block; background-color: #f19000; } footer .footer-claim-decoration.fhmfactoring { background-image: url(../img/line_gray_top_flipped.svg);} footer .footer-decoration { background-image: url(../img/line_blue_bottom.svg); background-repeat: no-repeat; background-position-y: 1px; background-size: 100%; height: calc(100vw * 69 / 1920); background-color: #f19000; } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* forms */ sup { color: #f19000; } .group-label { display: block; width: auto; text-align: left; padding-right: 0; padding-bottom: 4px; padding-top: 10px; color: #004486; font-size: 17px; font-weight: normal; } /* input field */ .input-field .group-label + .field-inner { width: 100%; } .input-field input, .input-field textarea { border: 2px solid #eaeaea; background-color: #eaeaea; padding: 8px 10px 8px 10px; border-radius: 4px; font-size: 19px; } .input-field.ng-invalid input.ng-untouched, .input-field input.ng-invalid.ng-untouched, .input-field.ng-invalid textarea.ng-untouched, .input-field textarea.ng-invalid.ng-untouched { border-color: #eaeaea; } .input-field input:focus, .input-field textarea:focus { outline: none; box-shadow: inset 0 0 1px 2px #eaeaea; } .input-field.ng-invalid input, .input-field input.ng-invalid, .input-field.ng-invalid textarea, .input-field textarea.ng-invalid { border-color: #f19000; } /* custom checkbox button */ .checkbox-field { margin-bottom: 10px; } .checkbox-field.inline { display: inline-block; margin-right: 25px; } .checkbox-field input[type="checkbox"]:not(:checked) + label, .checkbox-field input[type="checkbox"]:checked + label { position: relative; padding-left: 35px; cursor: pointer; display: inline-block!important; line-height: 31px; } .checkbox-field input[type="checkbox"]:not(:checked) + label:before, .checkbox-field input[type="checkbox"]:checked + label:before { content: ''; position: absolute; left:0; top: 2px; width: 26px; height: 26px; border: 3px solid #eaeaea; border-radius: 4px; } .checkbox-field input[type="checkbox"]:not(:checked) + label:after, .checkbox-field input[type="checkbox"]:checked + label:after { content: ''; background-color: #004486; width: 14px; height: 14px; position: absolute; top: 8px; left: 6px; transition: all .15s; border-radius: 3px; } /* custom radio button */ .radio-field { margin-bottom: 10px; } .radio-field .group-label { padding-bottom: 8px; } .radio-field .radio-option { margin-right: 25px; } .radio-field input[type="radio"]:not(:checked) + label, .radio-field input[type="radio"]:checked + label { position: relative; padding-left: 35px; cursor: pointer; display: inline-block!important; line-height: 31px; } .radio-field input[type="radio"]:not(:checked) + label:before, .radio-field input[type="radio"]:checked + label:before { content: ''; position: absolute; left:0; top: 2px; width: 26px; height: 26px; border: 3px solid #eaeaea; border-radius: 4px; } .radio-field input[type="radio"]:not(:checked) + label:after, .radio-field input[type="radio"]:checked + label:after { content: ''; background-color: #004486; width: 14px; height: 14px; position: absolute; top: 8px; left: 6px; transition: all .15s; border-radius: 3px; } .radio_no_inline .radio-option { display: block; margin-top: 20px; } .radio_no_inline .radio-option label { color: black; font-weight: 700; } /* button */ button.button-primary { background-color: #004486; color: white; padding: 8px 25px 8px 25px; font-size: 18px; font-weight: bold; line-height: normal; border-radius: 4px; } button.button-primary:disabled, button.button-primary:hover:disabled { background-color: #eaeaea; color: #999; } button.button-primary:hover { background-color: #004486; } button.button-primary:active { position: relative; top: 1px; } /* select field */ .select-field .group-label + .field-inner { width: 100%; } .select-field input { border: 2px solid #eaeaea; background-color: #eaeaea; padding: 8px 10px 8px 10px; border-radius: 4px; font-size: 19px; border-top-right-radius: 0; border-bottom-right-radius: 0; } .select-field .select-field-caret { border: 2px solid #eaeaea; padding: 7px 8px 4px 8px; background-color: #eaeaea; min-width: 32px; text-align: center; flex-grow: 0; flex-shrink: 0; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .select-field .select-field-caret { border-left: none; } .select-field input:focus { outline: none; box-shadow: inset 0 0 1px 2px #eaeaea; } .select-field.ng-invalid input, .select-field input.ng-invalid { border-color: #f19000; } .select-field.ng-invalid.ng-untouched input, .select-field.ng-invalid input.ng-untouched, .select-field input.ng-invalid.ng-untouched { border-color: #eaeaea; } .select-field .select-option:hover, .select-field .select-option.selected:hover, .select-option-list-clone .select-option:hover, .select-option-list-clone .select-option.selected:hover { background-color: #004486; color: white; } .select-field .select-option.selected, .select-option-list-clone .select-option.selected { background-color: #004486; color: white; } /* required marker */ .input-field[required] .group-label:after, .radio-field[required] .group-label:after, .checkbox-field[required] .group-label:after, .date-field[required] .group-label:after, .select-field[required] .group-label:after, .rating-field[required] .group-label:after, .field-group[required] .group-label:after, .list-field[required] .group-label:after, .signature-field[required] .group-label:after, .number-plate-field[required] .group-label:after { content: "*"; display: inline-block; color: #f19000; position: relative; top: -2px; margin: 0 0 0 2px; } /* calendar */ .calendar-hide { display: none; } .calendar-months { display: flex; flex-direction: row; margin-bottom: 50px; } .calendar-month { flex: 1 1 0; max-width: 350px; margin-right: 25px; } .calendar-month-header { font-weight: bold; font-size: 19px; text-align: center; color: #294a7d; display: flex; flex-direction: row; } .calendar-month-prev, .calendar-month-next { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; cursor: pointer; width: 20px; height: 25px; background-repeat: no-repeat; background-color: transparent; } .calendar-month-prev { background-image: url(../img/calendar_arrow_left.svg); } .calendar-month-next { background-image: url(../img/calendar_arrow_right.svg); } .calendar-month-prev:hover { background-image: url(../img/calendar_arrow_left_rollover.svg); } .calendar-month-next:hover { background-image: url(../img/calendar_arrow_right_rollover.svg); } .calendar-month-prev:disabled { background-image: url(../img/calendar_arrow_left_gray.svg); } .calendar-month-next:disabled { background-image: url(../img/calendar_arrow_right_gray.svg); } .calendar-month-prev:disabled:hover { background-image: url(../img/calendar_arrow_left_gray.svg); } .calendar-month-next:disabled:hover { background-image: url(../img/calendar_arrow_right_gray.svg); } .calendar-month-name { flex: 1 1 0; } .calendar-current-month .calendar-month-next { display: none; } /* show on mobile devices, if only current month is visible */ .calendar-dow-list { display: flex; flex-direction: row; } .calendar-dow { flex: 1 1 0; max-width: 48px; margin: 10px 2px 5px 2px; font-weight: 600; font-size: 14px; text-align: center; color: #969696; } .calendar-container { display: flex; flex-direction: column; } .calendar-line { display: flex; flex-direction: row; border-top: 1px solid #969696; padding-top: 8px; padding-bottom: 8px; } .calendar-day-empty { flex: 1 1 0; max-width: 48px; height: 52px; margin: 1px 2px 1px 2px; } .calendar-day { flex: 1 1 0; max-width: 48px; height: 52px; margin: 1px 2px 1px 2px; border-radius: 4px; padding-top: 4px; font-weight: 600; font-size: 16px; text-align: center; cursor: pointer; } .calendar-day.free { background-color: #f08501; color: black; } .calendar-day.occupied { background-color: #e6e6e6; color: #969696; cursor: default; } .calendar-day.reserved { background-color: #c3dc81; color: white; } .calendar-day.active { background-color: #294a7d; color: white; } .calendar-time-description { display: none; } .calendar-time-header { color: #294a7d; font-weight: bold; font-size: 19px; padding: 0 0 0 65px; text-align: center; } .calendar-time-body { display: flex; flex-direction: row; flex: 1 1 0; } .calendar-hour-list { display: flex; flex-direction: column; padding-right: 10px; } .calendar-hour { height: 59px; margin: 1px 2px 1px 2px; font-weight: 600; font-size: 14px; text-align: right; color: #969696; position: relative; top: -12px; } .calendar-time-inner { display: flex; flex-direction: column; flex: 1 1 0; } .calendar-time-line { display: flex; flex-direction: row; flex: 1 1 0; border-top: 1px solid #969696; padding: 8px 20px 8px 20px; } .calendar-time-entry { flex: 1 1 0; height: 42px; margin: 1px 2px 1px 2px; border-radius: 4px; padding-top: 9px; font-weight: 600; font-size: 14px; text-align: center; cursor: pointer; } .calendar-time-entry.free { background-color: #f08501; color: black; } .calendar-time-entry.occupied { background-color: #e6e6e6; color: #969696; cursor: default; } .calendar-time-entry.reserved { background-color: #c3dc81; color: white; cursor: pointer; } .calendar-time-entry.active { background-color: #294a7d; color: white; cursor: pointer; } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* pages */ .breadcrumb { color: #11508e; font-size: 14px; margin: 0 auto 2.5em auto; padding: 0 275px 0 275px; } .breadcrumb span.fas { color: #f19000; } a.breadcrumb-item { padding-left: 0.4em; text-decoration: none; color: #11508e; } a.breadcrumb-item:hover { text-decoration: none; } .breadcrumb-item:after { content: "\f105"; font-family: "Font Awesome 5 Pro"; color: #f19000; padding-left: 0.4em; } .breadcrumb-item:last-child:after { content: ""; } .section-main-headline h3 { font-size: 52px; color: #004486; margin-bottom: 0.8em; font-weight: normal; margin-top: 1.5em; } .section-icon-left { margin-left: 140px; position: relative; } .section-icon-left .section-img-list { position: absolute; left: -120px; top: -10px; } .orange-box { border: 2px solid #f19000; border-radius: 12px; padding: 1.5em 1.5em 1.01em 1.5em; margin-left: -1.5em; margin-top: 0.5em; } .small-text { font-size: 12px; color: #a0a0a0 } small { font-size: 12px; } /* factoring */ .feature-checklist { border-top: 1px solid #f19000; padding-top: 1em; padding-bottom: 1em; margin-bottom: 0; font-size: 15px; } .feature-checklist:last-child, .feature-checklist-last { border-bottom: 1px solid #f19000; } .feature-checklist p { display: block; margin-right: 0; max-width: calc(100% - 1em); } .feature-checklist p:before { content: "\f00c"; font-family: "Font Awesome 5 Pro"; color: #004486; padding-left: 0.4em; float: right; } .factoring-nav { margin: 6em auto 5em auto; padding: 0 275px 0 275px; } .factoring-nav h2 { font-size: 52px; color: #004486; margin-bottom: 0.5em; font-weight: normal; } .factoring-nav { color: #004486; font-size: 20px; font-weight: bold; } .factoring-nav ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 0 -20px 0 -20px; } .factoring-nav li { width: calc(25% - 40px); margin: 20px; } .factoring-nav li a { display: block; border-radius: 12px; color: #004486; text-decoration: none; text-align: center; padding: 1.5em 2em 1.5em 2em; width: 100%; height: 100%; left: 0; top: 0; position: relative; transition: all 0.2s ease-out; line-height: 1.4; box-shadow: 1px 4px 10px 0px rgba(0,0,0,0.4); } .factoring-nav li a span { display: block; } .factoring-nav li a:hover { text-decoration: none; width: calc(100% - -6px); height: calc(100% - -6px); left: -3px; top: -3px; } .factoring-sub .section-col0 { margin-left: 140px; position: relative; z-index: 0; } .factoring-sub .section-colspan-2-cols-6 { width: calc(164% - 50px); } .factoring-sub .section-col0 .section-img-list { position: absolute; left: -120px; top: -30px; } .factoring-sub .grid-col-6:first-child { width: 60%; } .factoring-sub .grid-col-6:last-child { width: 40%; } .factoring-sub-nav { color: #004486; font-size: 17px; font-weight: bold; margin-bottom: 5em; width: calc(100% + 1.5em); } .factoring-sub-nav ul { list-style: none; border: 2px solid #f19000; border-radius: 12px; position: relative; left: -1.5em; z-index: 0; } .factoring-sub-nav li a { color: #004486; text-decoration: none; display: block; border-bottom: 2px solid #f19000; margin: 1em 1.5em 0.6em 1.5em; padding-bottom: 0.6em; display: flex; flex-direction: row; align-items: center; } .factoring-sub-nav li:last-child a { border-bottom: none; } .factoring-sub-nav li span { flex: auto; display: block; line-height: 1.4; vertical-align: middle; padding-left: 1em; } .factoring-sub-nav li img { flex: none; height: 50px; display: block; vertical-align: middle; } .factoring-sub-nav li a:hover { text-decoration: none; } .factoring-back-button { margin-left: 140px; margin-bottom: 4em; } .imglist-links { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; margin: 0 -20px 0 -20px; } .imglist-links > div { width: calc(25% - 40px); margin: 20px; } .imglist-links a { display: block; border: 2px solid #bcbcbc; border-radius: 12px; color: #004486; text-decoration: none; text-align: center; padding: 1em 1.5em 1em 1.5em; left: 0; top: 0; position: relative; transition: all 0.2s ease-out; line-height: 1.4; width: 100%; height: 100%; } .imglist-links a:hover { text-decoration: none; width: calc(100% - -6px); height: calc(100% - -6px); left: -3px; top: -3px; } .imglist-links img { display: inline-block; max-width: 100%; max-height: 100%; } a.contact-software-link { display: block; font-weight: bold; color: #004486; margin-top: 0.5em; margin-bottom: 0.5em; text-decoration: none; } .contact-software-link:before { content: "\f019"; font-family: "Font Awesome 5 Pro"; color: #f19000; padding-right: 0.6em; font-size: 22px; display: inline-block; } /* cashing */ .cashing-table { position: relative; top: -47px; } .cashing-table table { width: 100%; font-size: 15px; line-height: 1.1; } .cashing-table th span { color: white; background-color: #004387; font-weight: bold; width: 100%; display: flex; justify-content:center; align-content:center; flex-direction:column; line-height: 1.1; padding: 12px 20px 12px 20px; height: 100%; border-top-left-radius: 10px; } .cashing-table th, .cashing-table td { width: 150px; } .cashing-table th:first-child, .cashing-table td:first-child { width: auto; } .cashing-table th { text-align: center; vertical-align: middle; } .cashing-table th:last-child span { border-top-left-radius: unset; border-top-right-radius: 10px; } .cashing-table th:first-child span { background-color: transparent; width: auto; } .cashing-table td { text-align: center; padding: 0.2em 0 0.7em 0;} .cashing-table .main-row td { border-top: 1px solid #f19000; padding: 0.7em 0 0.7em 0; } .cashing-table td:first-child { text-align: left; padding-right: 0.5em;} .cashing-table tr:last-child td { border-bottom: 1px solid #f19000; } .cashing .row2 .grid-col-6:first-child { width: 66%; } .cashing .row2 .grid-col-6:last-child { width: 34%; } .cashing .file-list { margin-top: 1em; } /* patients */ .patients .row0 .grid-col-6:first-child { width: 66%; } .patients .row0 .grid-col-6:last-child { width: 34%; } .patients-contact-info { border-top: 2px solid #f19000; margin-top: 1em; padding-top: 1em; } .patients-contact-info a { text-decoration: none; font-weight: bold; color: #004486; display: block; margin-bottom: 0.4em; } .patients-contact-info a:hover { text-decoration: none; } .patients-contact-info a:first-child:before { content: "\f0e0"; font-family: "Font Awesome 5 Pro"; color: #004486; padding-right: 0.6em; font-size: 18px; display: inline-block; } .patients-contact-info a:last-child:before { content: "\f095"; font-family: "Font Awesome 5 Pro"; color: #004486; padding-right: 0.6em; font-size: 18px; display: inline-block; } .patients-inkas a { display: block; background: no-repeat url(../img/Logo_inkas.svg); background-position: right 1em bottom 0.3em; text-decoration: none; font-weight: bold; color: #004486; padding-top: 2.25em; } .patients-inkas a:hover { text-decoration: none; } .patients .form-container { margin-bottom: 4em; } .patients .form-container .grid-row { margin: 0 -50px 0 -50px; padding: 0 275px 0 275px; } .patients .form-container .grid-row > .grid-col-6, .patients .form-container .grid-row > .grid-col-12 { padding-left: 50px; padding-right: 50px; float: left; min-height: 1px; } .patients .form-container a, .patients .form-container a:hover { color: #f19000; } /* contact */ .contact .form-container { margin-bottom: 4em; } .contact .form-container .grid-row { margin: 0 -50px 0 -50px; padding: 0 275px 0 275px; } .contact .form-container .grid-row > .grid-col-6, .contact .form-container .grid-row > .grid-col-12 { padding-left: 50px; padding-right: 50px; float: left; min-height: 1px; } .contact .form-container a, .contact .form-container a:hover { color: #f19000; } .contact-postal-address { margin-top: 1.5em; } /* get info */ .getinfo .form-container { margin-bottom: 4em; } .getinfo .form-container .grid-row { margin: 0 -50px 0 -50px; padding: 0 275px 0 275px; } .getinfo .form-container .grid-row > .grid-col-6, .getinfo .form-container .grid-row > .grid-col-12 { padding-left: 50px; padding-right: 50px; float: left; min-height: 1px; } .getinfo .form-container a, .getinfo .form-container a:hover { color: #f19000; } /* recommend */ .recommend .form-container { margin-bottom: 4em; margin-top: 20px; } .recommend .form-container .grid-row { margin: 0 -50px 0 -50px; padding: 0 275px 0 275px; } .recommend .form-container .grid-row > .grid-col-6, .getinfo .form-container .grid-row > .grid-col-12 { padding-left: 50px; padding-right: 50px; float: left; min-height: 1px; } .recommend .form-container a, .getinfo .form-container a:hover { color: #f19000; } /* login */ .login-box { border: 2px solid #f19000; border-radius: 12px; padding: 1.5em 1.5em 1.0em 1.5em; margin-left: 0; margin-top: 0.5em; } .login-box a { color: #004486; text-decoration: none; padding-bottom: 0.7em; font-weight: bold; } .login-box a:before { content: "\f105"; font-family: "Font Awesome 5 Pro"; color: #004486; padding-left: 0.4em; padding-right: 0.8em; font-size: 24px; font-weight: 900; display: inline-block; } .login-line2 { border-top: 2px solid #f19000; margin-top: 1em; padding-top: 1em; } /* sales */ .swiss_map { position: relative; width: 100%; cursor: pointer; min-height: 405px; margin-bottom: 100px; } .map_background { position: absolute; top: 0; left: 0; width: 100%; z-index: 0; cursor: pointer; } .map_foreground { position: absolute; top: 0; left: 0; width: 100%; z-index: 3; cursor: pointer; } .map_canton { position: absolute; top: 0; left: 0; width: 100%; z-index: 2; display: none; } .map_canton_label { position: absolute; top: 0; left: 0; z-index: 4; display: none; width: 200px; margin: 20px 0 0 -100px; text-align: center; font-size: 14px; } .map_search_field { max-width: 300px; } .search-result-list { position: relative; width: 300px; height: 200px; border: 1px solid #f19000; border-radius: 4px; display: none; overflow: scroll; padding: 4px; } .search-result { color: black; position: relative; } .search-result:hover, .search-result-selected { background-color: #f19000; color: white; cursor: pointer; } article .sales-address-list.grid-row { margin: 0 -24px 0 -24px; } article .sales-address-list .grid-col-6 { padding-left: 23px; padding-right: 23px; } .sales_address { border: 3px solid #f19000; border-radius: 10px; padding: 40px; display: flex; flex-direction: row; margin-bottom: 46px; } .sales_address_left { } .sales_address_left img { max-height: 242px; } .sales_address_right { flex: 1; padding: 17px 0 0 50px; line-height: 1.8; } .sales_address_name { display: block; font-size: 20px; font-weight: 600; margin: 0; padding: 0; } .sales_address_department { display: block; } .sales_address_region { display: block; } .sales_address_email { display: block; color: #f19000; text-decoration: none; } .sales_address_email:hover { color: #f19000; text-decoration: none; cursor: pointer; } .sales_address_phone { display: block; margin-top: 20px; } /* dialog box */ .dialog-box-background { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.5); z-index: 1000; } .dialog-box-container { position: relative; display: flex; flex-direction: row; align-items: center; z-index: 1001; height: 100%; width: 100%; } .dialog-box { width: 964px; max-width: 100vw; margin-left: auto; margin-right: auto; background-color: #feffff; border-radius: 14px; } .dialog-header { display: flex; flex-direction: row; height: 75px; border-bottom: 2px solid #e7e7e7; align-items: center; position: relative; padding-left: 30px; padding-right: 30px; } .dialog-footer { display: flex; flex-direction: row; height: 90px; border-top: 2px solid #e7e7e7; align-items: center; position: relative; padding-left: 60px; padding-right: 60px; justify-content: space-between; } .dialog-title { flex: 1 1 calc(100% - 19px); text-align: center; text-transform: uppercase; font-size: 18px; font-weight: 400; color: #004486; } .dialog-x-button { width: 18px; height: 18px; cursor: pointer; position: relative; } .dialog-x-button:active { top: 1px; } .dialog-x-button > div { width: 18px; height: 2px; background-color: #004486; transform-origin: 50% 50%; position: absolute; left: 0; top: 50%; } .dialog-x-bar1 { transform: rotate(45deg); } .dialog-x-bar2 { transform: rotate(-45deg); } .dialog-box-content { padding: 60px 60px 200px 60px; position: relative; max-height: calc(100vh - 165px); overflow-y: auto; } .dialog-box-content-image { position: absolute; bottom: 0; left: 0; right: 0; width: 100%; } .sweepstake-query .query-text { text-align: center; font-size: 32px; font-weight: 600; color: #004486; margin-bottom: 35px; } .sweepstake-query .query-button-container { display: flex; flex-direction: column; align-items: center; } .sweepstake-query .query-button { cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 2px solid #b6b6b6; background-color: #e7e7e7; color: #616161; font-size: 21px; font-weight: 600; width: 350px; height: 45px; display: block; border-radius: 8px; cursor: pointer; transition: all 0.35s ease-out; margin-top: 6px; margin-bottom: 6px; position: relative;} .sweepstake-query .query-button:active { top: 1px; } .sweepstake-query .query-button.selected-correct { background-color: #004486; border-color: #004486; color: white; } .sweepstake-query .query-button.selected-invalid { background-color: #004486; border-color: #004486; color: white; } .sweepstake-invalid { padding-left: 60px; padding-right: 60px; padding-bottom: 60px; } .sweepstake-invalid .title-icon { text-align: center; margin-bottom: 40px; } .sweepstake-invalid .title-icon span { font-size: 100px; color: #ff0e06; } .sweepstake-invalid .title-text { text-align: center; font-size: 60px; font-weight: 600; color: #004486; margin-bottom: 35px; } .sweepstake-invalid .info-text { text-align: center; font-size: 32px; font-weight: 600; color: #004486; margin-bottom: 35px; } .sweepstake-contact { padding-left: 60px; padding-right: 60px; padding-bottom: 60px; } .sweepstake-contact .contact-form-container { display: flex; flex-direction: column; } .sweepstake-contact .input-field .group-label ~ .field-inner { width: 100%; } .sweepstake-contact .contact-form-row { display: flex; flex-direction: row; column-gap: 60px; } .sweepstake-contact .title-icon { text-align: center; margin-bottom: 10px; } .sweepstake-contact .title-icon span.fas { font-size: 60px; color: #14a31e; vertical-align: middle; } .sweepstake-contact .title-text { font-size: 32px; font-weight: 600; color: #004486; vertical-align: middle; padding-left: 15px; } .sweepstake-contact .info-text { text-align: center; margin-bottom: 40px; } /* start page */ .start.page { max-width: none; margin: 0; } .start .page-img-list { max-width: 1920px; margin: 0 auto 0 auto; position: relative; } .start .page-img-list img { border-radius: 14px; } .start .page-img-list figcaption { position: absolute; top: 130px; right: 90px; width: 50%; } .start .page-img-list .img-title { font-size: 58px; font-weight: 600; color: #004486; line-height: 1.3; margin-bottom: 10px; } .start .page-img-list .img-description { font-size: 22px; color: #004486; } .start .page-img-list .img-description a { display: inline-block; background-color: #004486; color: white; text-decoration: none; border-radius: 6px; padding: 8px 70px 8px 20px; font-weight: 700; position: relative; font-size: 17px; margin-right: 20px; } .start .page-img-list .img-description a:before { content: "\f105"; font-family: "Font Awesome 5 Pro"; color: white; font-size: 40px; font-weight: 300; position: absolute; right: 15px; top: 1px; line-height: 1; } .start .paragraph-img-list img { border-radius: 12px; } .start .testimonial-img-list img { border-radius: 12px; } .start .row-inner { margin: 0 auto 0 auto; display: block; display: flex; flex-direction: row; max-width: min(100vw, 1920px); column-gap: 60px; padding: 0 275px 0 275px; } .start .col { flex: 1 1 100%; max-width: 100%; } .start h3 { color: #004486; font-size: 38px; font-weight: 600; text-transform: none; text-align: center; margin-bottom: 50px; margin-top: 70px; } .start h5 { font-size: 30px; font-weight: 600; color: #004486; line-height: 1.3; margin-bottom: 25px; } .start .paragraph { display: flex; flex-direction: row; column-gap: 60px; } .start .paragraph-content { padding-top: 40px; flex: 1 1 auto; } .start .paragraph-img-list { flex: none; } .start .paragraph-content a.blue-link { color: #004486; font-weight: 600; } .start .start_infobox section { font-size: 24px; background-color: #f19000; color:white; border-radius: 12px; margin-top: 40px; } .start .start_infobox p { padding: 0px 20px 40px 20px; line-height: 1; text-align: center; } .start .start_infobox a { color:white; text-decoration: underline; } .start .start_menu { margin-top: -45px; margin-bottom: 160px; } .start .start_menu .paragraph-container { display: flex; flex-direction: row; flex-wrap: nowrap; column-gap: 20px; position: relative; transition: left 0.15s ease-in-out; left: 0px; } .start .start_menu .paragraph { display: block; position: relative; flex: none; margin-bottom: 0; max-width: 100vw; } .start .start_menu .paragraph-img-list { z-index: 0; margin: 0 0 0 0; } .start .start_menu .paragraph-content { position: absolute; bottom: 50px; left: 30px; z-index: 1; width: 100%; } .start .start_menu h6 { font-size: 17px; font-weight: 600; text-transform: uppercase; margin-bottom: 5px; color: #004486; } .start .start_menu h5 { font-size: 32px; width: 70%; } .start .start_menu .paragraph-content p { width: 250px; min-height: 160px; } .start .start_menu .paragraph-content a { display: block; background-color: #004486; color: white; text-decoration: none; border-radius: 6px; padding: 8px 40px 8px 20px; font-weight: 700; position: relative; margin-bottom: 12px; } .start .start_menu .paragraph-content a:before { content: "\f105"; font-family: "Font Awesome 5 Pro"; color: white; font-size: 40px; font-weight: 300; position: absolute; right: 15px; top: 1px; line-height: 1; } .start .start_menu .paragraph-scroll-container { position: relative; } .start .start_menu .paragraph-scroll-left { flex: none; width: 55px; height: 95px; border-radius: 14px; background-color: white; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35); background-image: url(../img/arrow_left_blue.svg); background-repeat: no-repeat; background-position: center center; cursor: pointer; margin-bottom: 50px; position: absolute; left: -40px; top: calc(50% - 48px); z-index: 2; display: none; } .start .start_menu .paragraph-scroll-left:active { transform: translateY(2px); box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.35); } .start .start_menu .paragraph-scroll-right { flex: none; width: 55px; height: 95px; border-radius: 14px; background-color: white; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35); background-image: url(../img/arrow_right_blue.svg); background-repeat: no-repeat; background-position: center center; cursor: pointer; margin-bottom: 50px; position: absolute; right: 15px; top: calc(50% - 48px); z-index: 2; display: none; } .start .start_menu .paragraph-scroll-right:active { transform: translateY(2px); box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.35); } .start .start_news { margin-bottom: 160px; } .start .start_news .start_news_items { display: flex; flex-direction: row; column-gap: 55px; align-items: stretch; } .start .start_news .start_news_item { background-color: white; border-radius: 14px; flex: 1 1 0; padding: 50px 40px 30px 40px; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35); display: flex; flex-direction: column; } .start .start_news .start_news_item h5 { flex: 1 1 0; } .start .start_news .start_news_item hr { display: block; height: 2px; background-color: #bbbbbb; margin-top: 15px; margin-bottom: 20px; } .start .start_news .start_news_item a { display: inline-block; background-color: #004486; color: white; text-decoration: none; border-radius: 6px; padding: 8px 70px 8px 20px; font-weight: 700; position: relative; } .start .start_news .start_news_item a:before { content: "\f105"; font-family: "Font Awesome 5 Pro"; color: white; font-size: 40px; font-weight: 300; position: absolute; right: 15px; top: 1px; line-height: 1; } .start .start_testimonials .row-decoration-bottom { margin-top: 160px; } .start .start_testimonials { background-color: #d8e1eb; font-size: 18px; } .start .start_testimonials .row-decoration-top { background-image: url(../img/line_white_top.svg); background-repeat: no-repeat; background-size: 100%; height: calc(100vw * 69 / 1920); background-position-y: -1px; } .start .start_testimonials .row-decoration-bottom { background-image: url(../img/line_white_bottom_flipped.svg); background-repeat: no-repeat; background-size: 100%; height: calc(100vw * 69 / 1920); background-position-y: 1px; } .start .start_testimonials .start_testimonial_items { display: flex; flex-direction: column; background-color: white; border-radius: 14px; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35); margin-left: 50px; margin-right: 50px; overflow: hidden; position: relative; } .start .start_testimonials .start_testimonial_inner { display: flex; flex-direction: row; flex-wrap: nowrap; position: relative; left: 0; transition: left 0.15s ease-in-out; } .start .start_testimonials .start_testimonial_item { padding: 50px 75px 18px 75px; width: 100%; column-gap: 70px; display: flex; flex-direction: row; margin-left: 0px; margin-right: 0px; flex: none; text-decoration: none; } .start .start_testimonials .start_testimonial_item .testimonial-img-list { flex: none; } .start .start_testimonials .start_testimonial_item h5 { margin-bottom: 25px; } .start .start_testimonials .start_testimonial_item .testimonial_author { font-size: 20px; font-weight: 600; margin-top: 30px; } .start .start_testimonials .start_testimonial_item .testimonial_location { font-size: 14px; font-weight: normal; } .start .start_testimonials .testimonial_navigation_buttons { display: flex; flex-direction: row; align-self: center; column-gap: 14px; margin-bottom: 18px; } .start .start_testimonials .testimonial_navigation_button { width: 14px; height: 14px; border-radius: 7px; background-color: #d8e1eb; cursor: pointer; } .start .start_testimonials .testimonial_navigation_button.active { background-color: #004486; } .start .start_info .row-decoration-bottom { margin-top: 100px; } .start .start_info { background-color: #e2e2e2; } .start .start_info .row-decoration-top { background-image: url(../img/line_white_top.svg); background-repeat: no-repeat; background-size: 100%; height: calc(100vw * 69 / 1920); background-position-y: -1px; } .start .start_info .row-decoration-bottom { background-image: url(../img/line_white_bottom_flipped.svg); background-repeat: no-repeat; background-size: 100%; height: calc(100vw * 69 / 1920); background-position-y: 1px; } .start .start_info .paragraph-container { display: flex; flex-direction: row; column-gap: 20px; } .start .start_info .paragraph { background-color: white; border-radius: 14px; flex: 1 1 0; padding: 50px 35px 30px 35px; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35); } .start .start_info h5 { margin-bottom: 15px; } .start .start_info .paragraph-content { padding-top: 0; } .start .start_info .paragraph-img-list { margin-top: 3px; margin-bottom: 0; } .start .start_info .paragraph-content a { display: inline-block; background-color: #004486; color: white; text-decoration: none; border-radius: 6px; padding: 8px 50px 8px 20px; font-weight: 700; position: relative; margin-top: 25px; } .start .start_info .paragraph-content a:before { content: "\f105"; font-family: "Font Awesome 5 Pro"; color: white; font-size: 40px; font-weight: 300; position: absolute; right: 15px; top: 1px; line-height: 1; } .start .start_partner { margin-bottom: 100px; } .start .start_partner .paragraph { display: block; } .start .start_partner .paragraph-img-list { align-items: center; flex-wrap: nowrap; } .start .start_partner .paragraph-img-list-inner { display: flex; flex-direction: row; flex-wrap: nowrap; column-gap: 16px; max-width: 100%; overflow-x: auto; height: calc(135px + 30px); flex: 1 1 auto; } .start .start_partner .paragraph-img-list figure a { width: 275px; height: 135px; } .start .start_partner .paragraph-img-list figure a:hover { width: calc(275px - 4px); height: calc(135px - 4px); left: 2px; top: 2px; } .start .start_partner .paragraph-img-list figcaption { display: none; } .start .start_partner .paragraph-img-scroll-left { flex: none; width: 55px; height: 95px; border-radius: 14px; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35); background-image: url(../img/arrow_left_blue.svg); background-repeat: no-repeat; background-position: center center; cursor: pointer; margin-bottom: 50px; } .start .start_partner .paragraph-img-scroll-left:active { position: relative; top: 2px; box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.35); } .start .start_partner .paragraph-img-scroll-right { flex: none; width: 55px; height: 95px; border-radius: 14px; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35); background-image: url(../img/arrow_right_blue.svg); background-repeat: no-repeat; background-position: center center; cursor: pointer; margin-bottom: 50px; } .start .start_partner .paragraph-img-scroll-right:active { position: relative; top: 2px; box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.35); } .start .start_partner .paragraph-content { text-align: center; padding-top: 10px; } .start .start_social .row-decoration-bottom { padding-top: 50px; } .start .start_social { background-color: #d8e1eb; } .start .start_social .row-decoration-top { background-image: url(../img/line_white_top.svg); background-repeat: no-repeat; background-size: 100%; height: calc(100vw * 69 / 1920); background-position-y: -1px; } .start .start_social .paragraph-content { display: flex; flex-direction: row; flex-wrap: wrap; background-color: transparent; justify-items: center; align-items: center; justify-content: space-evenly; row-gap: 60px; padding: 30px 40px 30px 40px; width: 100%; } .start ~ footer .footer-claim-decoration { background-image: url(../img/line_lightblue_top_flipped.svg); } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* responsive */ @media only screen and (max-width: 1920px) { article > h1, article > h2 { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } article > .grid-row, article > .grid-row-wide { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .logo-nav-area-inner { padding: 1.6em calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .mini-nav-area { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .footer-fmhfactoring, .footer-claim, .footer-nav, .footer-bottom { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .footer-fmhfactoring { padding-top: 4em; padding-bottom: 4em; } .footer-claim { padding-top: 1.2em; padding-bottom: 1.2em; } .footer-nav { padding-top: 4em; padding-bottom: 3em; } .footer-bottom { padding: 1.4em 0 1.4em 0; } .breadcrumb { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .factoring-nav { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .patients .form-container .grid-row { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .contact .form-container .grid-row { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .getinfo .form-container .grid-row { padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .start .row-inner { --lrpadding: calc((100vw - 1470px) * 275 / (1920 - 1470)); padding: 0 var(--lrpadding) 0 var(--lrpadding); } } @media only screen and (max-width: 1785px) { .start .page-img-list figcaption { top: 100px; right: 70px; width: 60%; } .start .page-img-list .img-title { font-size: 56px; } .start .page-img-list .img-description { font-size: 20px; } } @media only screen and (max-width: 1600px) { .start .page-img-list figcaption { top: 80px; right: 70px; width: 58%; } .start .page-img-list .img-title { font-size: 50px; } .start .page-img-list .img-description { font-size: 18px; } } @media only screen and (max-width: 1490px) { article > h1, article > h2 { padding-left: 20px; padding-right: 20px; } article > .grid-row, article > .grid-row-wide { padding-left: 20px; padding-right: 20px } .logo-nav-area-inner { padding-left: 20px; padding-right: 20px; } .mini-nav-area { padding-left: 20px; padding-right: 20px; } .footer-fmhfactoring, .footer-claim, .footer-nav, .footer-bottom { padding-left: 20px; padding-right: 20px; } .breadcrumb { padding-left: 20px; padding-right: 20px; } .factoring-nav { padding-left: 20px; padding-right: 20px; } .patients .form-container .grid-row { padding-left: 20px; padding-right: 20px; } .contact .form-container .grid-row { padding-left: 20px; padding-right: 20px; } .getinfo .form-container .grid-row { padding-left: 20px; padding-right: 20px; } .start .start_menu .paragraph-scroll-left { left: -12px; } .start .start_menu .paragraph-scroll-right { right: -12px; } .start .start_menu .paragraph-content { left: 50px; bottom: 60px; } .start .page-img-list .img-description a { margin-right: 5px; } } @media only screen and (max-width: 1366px) { .info-buttons { top: 200px; } .info-buttons li > a { width: 64px; height: 64px; } .info-button.info-button-active { right: 66px; } .imglist-links > div { width: calc(33% - 40px); } .start .page-img-list figcaption { top: 60px; } } @media only screen and (max-width: 1300px) { .cookie-banner-inner { margin: 0 20px 0 20px; } .start .img-variant-desktop { display: none!important; } .start .img-variant-phone { display: block!important; } figure.start-fmh-logo:after { bottom: 11.0em; } .start .page-img-list figcaption { position: static; top: auto; right: auto; width: auto; margin-left: 15px; margin-right: 15px; } .start .page-img-list img { border-radius: 0; width: 100%; } .start .page-img-list .img-title { font-size: 50px; text-align: center; margin-top: 20px; } .start .page-img-list .img-description { font-size: 18px; margin-bottom: 20px; } .start .start_infobox section { font-size: 22px; } } @media only screen and (max-width: 1200px) { .footer-claim { font-size: 31px; } .info-buttons { position: absolute; } .info-buttons li > a { width: 54px; height: 54px; } .info-button.info-button-active { right: 56px; } h1 { font-size: 53px; } h2 { font-size: 25px; } h3 { font-size: 21px; } .section-main-headline h3 { font-size: 53px; } .logo-area { width: 275px; } .main-nav a { font-size: 22px; } .main-nav .nav-level0 > ul > li { margin-left: 1.9em; } .sales_address_right { line-height: 1.7; } .sales_address_name { font-size: 18px; font-weight: 600; } .sales_address_department, .sales_address_region, .sales_address_email, .sales_address_phone { font-size: 16px; } .sales_address_phone { margin-top: 15px; } .start .page-img-list .img-title { font-size: 38px; } .start .start_infobox section { font-size: 20px; } } @media only screen and (max-width: 1100px) { .cookie-banner { height: 250px; } .footer-claim { font-size: 29px; } .logo-area { width: 270px; } h1 { font-size: 51px; } h2 { font-size: 23px; } h3 { font-size: 19px; } .section-main-headline h3 { font-size: 51px; } .main-nav a { font-size: 21px; } .main-nav .nav-level0 > ul > li { margin-left: 1.8em; } .factoring-nav li { width: calc(50% - 40px); } article .sales-address-list .grid-col-6 { width: 100%; float: none; } .start .start_infobox section { font-size: 18px; } .start .start_news .start_news_items { display: flex; flex-direction: column; row-gap: 55px; align-items: stretch; } .start .paragraph { flex-direction: column; row-gap: 0; } .start .paragraph .paragraph-img-list { margin-top: 1em; margin-bottom: 1em; } } @media only screen and (max-width: 1000px) { html, body { font-size: 16px; } .page { font-size: 16px; } .logo-area { width: 250px; } .info-buttons { top: 165px; } .main-nav a { font-size: 20px; } .main-nav .nav-level0 > ul > li { margin-left: 1.2em; } .footer-claim { font-size: 26px; } .factoring-nav h2 { font-size: 38px; margin-bottom: 0.5em; } .factoring-nav { font-size: 20px; } .factoring-nav li a { padding: 1.0em 1.8em 1.0em 1.8em; } .imglist-links { margin: 0 -10px 0 -10px; } .imglist-links > div { width: calc(50% - 20px); margin: 10px; } .start .start_social .paragraph-content { padding: 20px 25px 20px 25px; } .start .start_social .paragraph-content > div { flex: 1 1 auto; text-align: center; } .start .start_social .paragraph-content > div img { max-width: 100%; } } @media only screen and (max-width: 900px) { article .grid-col-6 { width: 100%; } .section-colspan-2-cols-6 { width: 100%; } .swiss_map { min-height: calc(100vw * 550 / 900); margin-top: 20px; } .start .start_testimonials .start_testimonial_item { row-gap: 30px; flex-direction: column; } .start .start_info .paragraph-container { flex-direction: column; row-gap: 0px; } .start .start_partner .paragraph-img-list-inner { height: calc(125px + 30px); } .start .start_partner .paragraph-img-list figure a { width: 255px; height: 125px; } .start .start_partner .paragraph-img-list figure a:hover { width: calc(255px - 4px); height: calc(125px - 4px); } } @media only screen and (max-width: 880px) { h1 { font-size: 48px; } h2 { font-size: 21px; } h3 { font-size: 18px; } .img-variant-desktop { display: none!important; } .img-variant-phone { display: block!important; } .mobile-nav-container.nav-open { display: block; } .info-buttons { top: 90px; } .info-buttons li > a { width: 54px; height: 54px; } .info-button.info-button-active { right: 56px; } .main-nav { display: none; } .mini-nav-area { display: none; } .footer-claim { font-size: 22px; } .footer-nav { display: none; } .footer-decoration { display: none; } .footer-bottom { font-size: 16px; } .nav-button { display: block; } .logo-nav-area-inner { padding-left: 20px; padding-right: 20px; padding-top: 10px; } .logo-area { width: 250px; } .page { padding-top: 70px; } .header-scroll .logo-nav-area-inner { padding-top: 10px; } .factoring-sub-nav { width: 100%; } .factoring-sub-nav ul { left: -2em; } .factoring-sub .grid-col-6:first-child { width: 100%; } .factoring-sub .grid-col-6:last-child { width: calc(100% - 100px); margin-left: 100px; } .patients .row0 .grid-col-6:first-child { width: 100%; } .patients .row0 .grid-col-6:last-child { width: 100%; } .cashing .row2 .grid-col-6:first-child { width: 100%; } .cashing .row2 .grid-col-6:last-child { width: 100%; } .orange-box { margin-left: 0; } .factoring-sub-nav { margin: -1em 0 5em 10px; padding: 0 calc((100vw - 1470px) * 275 / (1920 - 1470)) 0 calc((100vw - 1470px) * 275 / (1920 - 1470)); } .factoring-sub-nav { color: #004486; font-size: 18px; font-weight: bold; } .factoring-sub-nav ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 -10px 0 -10px; border: none; } .factoring-sub-nav li { width: calc(50% - 20px); margin: 10px; } .factoring-sub-nav li a { display: block; border: 3px solid #f19000; border-radius: 12px; color: #004486; text-decoration: none; text-align: center; padding: 0.75em 0.5em 0.75em 0.5em; width: 100%; height: 100%; left: 0; top: 0; position: relative; transition: all 0.2s ease-out; } .factoring-sub-nav li a span { display: block; line-height: 1.4; padding: 2px; vertical-align: middle; } .factoring-sub-nav li img { display: inline-block; } .factoring-sub-nav li a:hover { text-decoration: none; width: calc(100% + 4px); height: calc(100% + 4px); left: -2px; top: -2px; } .factoring-sub-nav li:last-child a { border-bottom: 3px solid #f19000; } .factoring-sub .section-col0 { margin-left: 100px; } .factoring-sub .section-col0 .section-img-list { left: -80px; top: -20px; } .factoring-sub .section-col0 .section-img-list img { width: 60px; } .factoring-sub .section-colspan-2-cols-6 { width: calc(100% - 100px); } .imglist-links img { display: inline-block; width: 100%; } .start .page-img-list .img-description a { display: block; margin-bottom: 10px; width: 250px; } .start .start_testimonials .start_testimonial_items { margin-left: 0; margin-right: 0; } .start .start_testimonials .start_testimonial_item { padding: 35px 40px 0px 40px; } .start .start_testimonials .start_testimonial_item h5 { font-size: 26px; margin-bottom: 20px; } .start .start_testimonials .start_testimonial_item .testimonial_author { font-size: 18px; margin-top: 20px; } } @media only screen and (max-width: 800px) { .footer-claim { font-size: 20px; } .footer-fmhfactoring { padding-top: 3em; padding-bottom: 3em; } .footer-fmhfactoring > div:nth-child(1) a { font-size: 14px; padding: 10px 10px 8px 10px; } .sales_address { padding: 20px; } .sales_address_right { padding-left: 30px; } .start .start_partner .paragraph-img-list-inner { height: calc(105px + 30px); } .start .start_partner .paragraph-img-list figure a { width: 235px; height: 105px; } .start .start_partner .paragraph-img-list figure a:hover { width: calc(235px - 4px); height: calc(105px - 4px); } } @media only screen and (max-width: 700px) { .start-nav-container { padding-bottom: calc(100vw * 360 / 700); } .logo-nav-area { box-shadow: 0 1px 10px rgba(0,0,0,0.4); } .info-buttons { display: none; } .footer-claim { font-size: 19px; } figure.start-fmh-logo:after { bottom: 0.5em; } .factoring-nav h2 { font-size: 28px; margin-bottom: 0.5em; } .factoring-nav { font-size: 18px; } .factoring-nav ul { margin: 0 -10px 0 -10px; } .factoring-nav li { width: calc(50% - 20px); margin: 10px; } .factoring-nav li a { padding: 0.75em 0.5em 0.75em 0.5em; } .factoring-nav img { width: 50px; } .factoring-sub-nav { font-size: 18px; } .factoring-sub-nav ul { margin: 0 -10px 0 -10px; } .factoring-sub-nav li { width: calc(50% - 20px); margin: 10px; } .factoring-sub-nav li a { padding: 0.75em 0.5em 0.75em 0.5em; } .factoring-sub-nav img { width: 50px; } .footer-fmhfactoring { padding-top: 2.5em; padding-bottom: 2.5em; } .footer-fmhfactoring > div:nth-child(1) a { font-size: 12px; padding: 10px 10px 8px 10px; } .footer-fmhfactoring > div:nth-child(2) { font-size: 12px; } .swiss_map { display: none; } .sales_address_left img { max-height: 202px; } .sales_address_right { line-height: 1.6; padding-top: 10px; } .sales_address_name { font-size: 16px; } .sales_address_department, .sales_address_region, .sales_address_email, .sales_address_phone { font-size: 14px; } .sales_address_phone { margin-top: 10px; } .sweepstake-contact .contact-form-row { display: block; } } @media only screen and (max-width: 620px) { .start .start_menu .paragraph-content { left: 30px; bottom: 30px; } .start .start_menu .paragraph-content a:first-child { margin-top: 120px; } .start .start_menu { margin-bottom: 80px; } .start .start_partner .paragraph-img-list-inner { height: calc(85px + 30px); } .start .start_partner .paragraph-img-list figure a { width: 165px; height: 85px; padding: 10px 18px 10px 18px; } .start .start_partner .paragraph-img-list figure a:hover { width: calc(165px - 4px); height: calc(85px - 4px); } } @media only screen and (max-width: 600px) { .cookie-banner { height: 300px; } .breadcrumb { display: none; } article > h1 { margin-top: 20px; } h1 { font-size: 48px; line-height: 1; } h2 { font-size: 20px; } h3 { font-size: 16px; } .section-main-headline h3 { font-size: 48px; } .factoring-sub .section-col0 .section-img-list { left: -80px; top: -20px; } .factoring-sub .section-col0 { margin-left: 100px; position: relative; z-index: 0; } .factoring-sub .section-col0 .section-img-list img { width: 60px; } .section-icon-left .section-img-list { left: -80px; top: -10px; } .section-icon-left { margin-left: 100px; } .section-icon-left .section-img-list img { width: 60px; } .footer-fmhfactoring { display: flex; flex-direction: column; } .footer-fmhfactoring > div:nth-child(1) { width: 100%; padding-right: 0; text-align: center; padding-bottom: 2.5em; } .footer-fmhfactoring > div:nth-child(1) a { font-size: 16px; padding: 10px 20px 8px 20px; } .footer-fmhfactoring > div:nth-child(2) { width: 100%; font-size: 14px; padding-bottom: 2.5em; } .footer-fmhfactoring > div:nth-child(3) { width: 100%; text-align: center; padding-left: 0; } .sales_address_left img { max-height: 182px; } .sweepstake-query .query-text { line-height: 1.2; } .sweepstake-invalid .info-text { line-height: 1.2; } .sweepstake-contact .title-text { line-height: 1.2; } .sweepstake-contact .title-icon span.fas { font-size: 40px; } .start .start_menu .grid-col-12 { padding-left: 5px; padding-right: 5px; } .start .start_menu .paragraph-content a:first-child { margin-top: 80px; } .start .start_menu .paragraph-scroll-left { left: -3px; width: 45px; height: 65px; top: calc(50% - 33px); border-radius: 10px; } .start .start_menu .paragraph-scroll-right { right: -3px; width: 45px; height: 65px; top: calc(50% - 33px); border-radius: 10px; } .start .start_menu h5 { font-size: 28px; width: 50%; } /* single calendar month */ .calendar-current-month .calendar-month-next { display: block; } .calendar-next-month { display: none; } } @media only screen and (max-width: 530px) { .start .start_menu .paragraph-content a { font-size: 17px; } .start .start_menu .paragraph-content a:first-child { margin-top: 60px; } .start .start_menu .paragraph-scroll-left { width: 35px; height: 55px; top: calc(50% - 28px); border-radius: 8px; background-size: 50%; } .start .start_menu .paragraph-scroll-right { width: 35px; height: 55px; top: calc(50% - 28px); border-radius: 8px; background-size: 50%; } .start .start_menu .paragraph-content { left: 35px; bottom: 30px; } .start .start_menu .paragraph-content a:first-child { margin-top: 20px; } .start .start_menu h5 { font-size: 24px; } .start .start_partner .paragraph-img-list-inner { height: calc(65px + 30px); } .start .start_partner .paragraph-img-list figure a { width: 125px; height: 65px; padding: 8px 10px 0px 10px; } .start .start_partner .paragraph-img-list figure a:hover { width: calc(125px - 4px); height: calc(65px - 4px); } .start .start_partner .paragraph-img-scroll-left, .start .start_partner .paragraph-img-scroll-right { width: 35px; height: 65px; border-radius: 8px; margin-bottom: 40px; background-size: 50%; } .start .start_social .paragraph-content { row-gap: 30px; } } @media only screen and (max-width: 500px) { h1 { font-size: 42px; } h2 { font-size: 20px; } h3 { font-size: 17px; } .section-main-headline h3 { font-size: 42px; } .factoring-sub .section-col0 .section-img-list { position: absolute; left: -65px; top: -10px; } .factoring-sub .section-col0 { margin-left: 65px; position: relative; z-index: 0; } .factoring-sub .grid-col-6:last-child { width: calc(100% - 65px); margin-left: 65px; } .section-icon-left .section-img-list { left: -70px; top: -10px; } .section-icon-left { margin-left: 65px; } .section-icon-left .section-img-list img { width: 55px; } .sales_address_right { line-height: 1.4; padding-top: 5px; } .sales_address_phone { margin-top: 5px; } .imglist-links { margin: 0 -10px 0 -10px; } .imglist-links > div { width: calc(100% - 20px); margin: 10px; } .appointment-dialog { bottom: 68px; right: -400px; } .appointment-dialog.appointment-dialog-open { right: 8px; } .appointment-dialog-corner { background-image: url(../img/corner_rotated.svg); right: 0px; bottom: -62px; } .appointment-dialog-content { width: 320px; height: 250px; padding: 22px 20px 22px 20px; } } @media only screen and (max-width: 450px) { h1 { font-size: 38px; } .section-main-headline h3 { font-size: 38px; } .start-nav-container { padding-bottom: calc(100vw * 300 / 700); } .dialog-footer { padding-left: 30px; padding-right: 30px; } .dialog-box-content { padding-left: 30px; padding-right: 30px; } .sweepstake-invalid { padding-left: 30px; padding-right: 30px; } .sweepstake-contact { padding-left: 30px; padding-right: 30px; } .start .start_menu .paragraph-scroll-left { width: 95px; height: 55px; border-radius: 10px; background-size: 50% 50%; background-position: center center; cursor: pointer; margin-bottom: 50px; position: absolute; left: 10px; top: unset; bottom: -130px; z-index: 2; display: none; } .start .start_menu .paragraph-scroll-right { width: 95px; height: 55px; border-radius: 10px; background-size: 50% 50%; background-position: center center; cursor: pointer; margin-bottom: 50px; position: absolute; right: 10px; top: unset; bottom: -130px; z-index: 2; display: none; } .start .start_menu .paragraph-img-list { z-index: 0; margin: 0 0 0 -5px; } .start .start_menu .paragraph-img-list img { border-radius: 0; } .start .start_menu h6 { font-size: 16px; margin-bottom: 5px; } .start .start_menu h5 { font-size: 26px; width: 200px; } .start .start_menu .paragraph-content { left: 10px; bottom: 10px; } .start .start_menu .paragraph-content p { width: 200px; min-height: 20px; } .start .start_menu .paragraph-content a { font-size: 15px; padding: 7px 25px 7px 15px; } .start .start_menu .paragraph-content a:first-child { margin-top: 20px; } .start .start_menu .paragraph-content a:before { font-size: 34px; right: 7px; top: 1px; } .cookie-banner { height: 440px; } } @media only screen and (max-width: 413px) { html, body { font-size: 15px; } .page { font-size: 15px; } .sales_address { display: block; } .sales_address_right { padding-left: 0; } } @media only screen and (max-width: 400px) { } @media only screen and (max-width: 375px) { .cookie-banner { height: 440px; } .start-nav-container { padding-bottom: calc(100vw * 420 / 700); } .dialog-box-content { padding-top: 30px; padding-bottom: 100px; } .sweepstake-invalid { padding-bottom: 60px; } .sweepstake-invalid .title-icon { margin-bottom: 20px; } .sweepstake-invalid .title-icon span { font-size: 80px; } .sweepstake-invalid .title-text { font-size: 50px; margin-bottom: 25px; } .sweepstake-invalid .info-text { font-size: 28px; margin-bottom: 25px; } .start .start_menu h6 { font-size: 14px; margin-bottom: 5px; } .start .start_menu h5 { font-size: 22px; width: 200px; } .start .start_menu .paragraph-content { left: 10px; bottom: 5px; } .start .start_menu .paragraph-content p { width: 190px; min-height: 20px; } .start .start_menu .paragraph-content a { font-size: 13px; padding: 7px 15px 7px 15px; } .start .start_menu .paragraph-content a:first-child { margin-top: 10px; } .start .start_menu .paragraph-content a:before { font-size: 30px; right: 7px; top: 1px; } } @media only screen and (max-width: 320px) { html, body { font-size: 14px; } .page { font-size: 14px; } .start-nav-container { padding-bottom: calc(100vw * 200 / 700); } .dialog-box-content-image { display: none; } }