h1:before { content:''; margin: 0 auto; display: block; width: 60px; height: 30px; background: url(../img/mbk-logo.svg) no-repeat; margin-bottom: 1.5rem; } .bgimage h1:before { background: url(../img/mbk-logo-inverse.svg) no-repeat; } /*flex*/ .flex { display: flex; display: -ms-flexbox; display: -webkit-flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } /*Hintergründe*/ .s.bg { background-color: #eaeaea; } .addborder .border { padding: 3.7rem; border: 1px solid lightgrey; } .s.bgimage { background-position: center center; background-attachment: fixed; background-size: cover; } @media all and (max-width: 1024px){ .s.bgimage { background-attachment: scroll; } } /*farben*/ .bgimage,.bgimage h1 { color: white; } /*Icons*/ .fa.big { font-size: 4.4rem; color:#3C3C3B; } p>i { margin-right: 1.5%; } /* Normalize */ html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}article,aside,details,footer,header,main,menu,nav,section,summary,blockquote,figure{display:block}audio,canvas,progress,video{display:inline-block}audio,canvas,iframe,img,svg,video{vertical-align:middle}video:focus{border:none;}audio:not([controls]){display:none;height:0}template,[hidden]{display:none}svg:not(:root){overflow:hidden;}a{background-color:transparent}a:active,a:hover{outline:0}img{border-style:none}a,button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}button,select{text-transform:none}button,input,select,textarea,blockquote,figure{margin:0;font:inherit}button,input,select{overflow:visible}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;resize:vertical}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}table{border-collapse:collapse;border-spacing:0}::-moz-selection{background:#b3d4fc;text-shadow:none}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}.clear{clear:both} /* Fancybox */ .fancybox-image,.fancybox-inner,.fancybox-nav,.fancybox-nav span,.fancybox-outer,.fancybox-skin,.fancybox-tmp,.fancybox-wrap,.fancybox-wrap iframe,.fancybox-wrap object{padding:0;margin:0;border:0;outline:0;vertical-align:top}.fancybox-wrap{position:absolute;top:0;left:0;z-index:8020}.fancybox-inner,.fancybox-outer,.fancybox-skin{position:relative}.fancybox-skin{background:#f9f9f9;color:#444;text-shadow:none;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.fancybox-opened{z-index:8030}.fancybox-opened .fancybox-skin{-webkit-box-shadow:0 10px 25px rgba(0,0,0,.5);-moz-box-shadow:0 10px 25px rgba(0,0,0,.5);box-shadow:0 10px 25px rgba(0,0,0,.5)}.fancybox-inner{overflow:hidden}.fancybox-type-iframe .fancybox-inner{-webkit-overflow-scrolling:touch}.fancybox-error{color:#444;margin:0;padding:15px;white-space:nowrap}.fancybox-iframe,.fancybox-image{display:block;width:100%;height:100%}.fancybox-image{max-width:100%;max-height:100%}#fancybox-loading,.fancybox-close,.fancybox-next span,.fancybox-prev span{background-image:url(../fancybox/fancybox_sprite.png)}#fancybox-loading{position:fixed;top:50%;left:50%;margin-top:-22px;margin-left:-22px;background-position:0 -108px;opacity:.8;cursor:pointer;z-index:8060}.fancybox-close,.fancybox-nav,.fancybox-nav span{cursor:pointer;z-index:8040;position:absolute}#fancybox-loading div{width:44px;height:44px;background:url(../fancybox/fancybox_loading.gif) center center no-repeat}.fancybox-close{top:-18px;right:-18px;width:36px;height:36px}.fancybox-nav{top:0;width:40%;height:100%;text-decoration:none;background:url(../fancybox/blank.gif);-webkit-tap-highlight-color:transparent}.fancybox-prev{left:0}.fancybox-next{right:0}.fancybox-nav span{top:50%;width:36px;height:34px;margin-top:-18px;visibility:hidden}.fancybox-prev span{left:10px;background-position:0 -36px}.fancybox-next span{right:10px;background-position:0 -72px}.fancybox-nav:hover span{visibility:visible}.fancybox-tmp{position:absolute;top:-99999px;left:-99999px;visibility:hidden;max-width:99999px;max-height:99999px;overflow:visible!important}.fancybox-lock,.fancybox-lock body{overflow:hidden!important;}.fancybox-lock{width:auto}.fancybox-lock-test{overflow-y:hidden!important}.fancybox-overlay{position:absolute;top:0;left:0;overflow:hidden;display:none;z-index:8010;background:url(../fancybox/fancybox_overlay.png)}.fancybox-overlay-fixed{position:fixed;bottom:0;right:0}.fancybox-lock .fancybox-overlay{overflow:auto;overflow-y:scroll}.fancybox-title{visibility:hidden;position:relative;text-shadow:none;z-index:8050}.fancybox-opened .fancybox-title{visibility:visible}.fancybox-title-float-wrap{position:absolute;bottom:0;right:50%;margin-bottom:-35px;z-index:8050;text-align:center}.fancybox-title-float-wrap .child{display:inline-block;margin-right:-100%;padding:2px 20px;background:0 0;background:rgba(0,0,0,.8);-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;text-shadow:0 1px 2px #222;color:#FFF;font-weight:700;line-height:24px;white-space:nowrap}.fancybox-title-outside-wrap{position:relative;margin-top:10px;color:#fff}.fancybox-title-inside-wrap{padding-top:10px}.fancybox-title-over-wrap{position:absolute;bottom:0;left:0;color:#fff;padding:10px;background:#000;background:rgba(0,0,0,.8)}@media only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-device-pixel-ratio:1.5){#fancybox-loading,.fancybox-close,.fancybox-next span,.fancybox-prev span{background-image:url(../fancybox/fancybox_sprite@2x.png);background-size:44px 152px}#fancybox-loading div{background-image:url(../fancybox/fancybox_loading@2x.gif);background-size:24px 24px}} /* Buttons */ input[type="submit"], .btn { display: inline-block; line-height: 2rem; border: 1px solid white; color: white; padding: 1.2rem 1.5rem; text-align: center; outline: 0; text-decoration: none; vertical-align: middle; white-space: nowrap; } .btn { transition: background .5s, color .5s; } input[type="submit"]:hover, .btn:hover,.btn:focus { background-color: #3983d5; border-color: #3983d5; color: #fff; } .btn:active,.btn.active { background-color: #3983d5; border-color: #3983d5; color: #fff; } /* Schrittmodul schritte */ .step { position: relative; padding-left: 2.7em; } .step .nr { position: absolute; left: 0; top: -9px; font-size: 4.7rem; } .step .text { font-weight: 600; } .step .btnlabel { position: relative; padding-left: 1em; margin-top: 7px; cursor: pointer; } .step .btnlabel:hover { opacity: 0.8; } .step .btnlabel:before { content:'\f055'; font-family: 'FontAwesome'; font-size: 1.3rem; top: 5px; position: absolute; left: 0; } .step .btntext { display: none; margin-top: 7px; } @media all and (max-width: 768px){ .step .btnlabel { margin-top: 0; } } @media all and (max-width: 480px){ .step .btnlabel { margin-top: 7px; } } /*Info modul info*/ .info .border { border: 1px solid lightgrey; padding: 2.5rem; } .info p { position: relative; padding-left: 4rem; } .info p:before { content: '\f05a'; color:#3983d5; font-family: 'FontAwesome'; font-size: 3rem; position: absolute; left: 0; top: -4px; } /* Blockquote */ blockquote { font-family: Georgia, "Times New Roman", serif; font-style: italic; padding: 2rem 0 2rem 2rem; color: #777; border-left: #f4f4f4 5px solid; border-radius: 5px; font-size: 1.1em; line-height: 1.7; } * + blockquote { margin-top: 2rem; } /* contact - Kontaktzeilen mit icons */ .contact a { text-decoration: none; color: inherit; } .contact a:hover { color: #3983d5; } .contact .phone, .contact .fax, .contact .mail { position: relative; padding-left: 3rem; } .contact .phone:before,.mail:before, .contact .fax:before { font-family: 'FontAwesome'; margin-right: 10px; position: absolute; left: 0; } .contact .phone:before { content: '\f095'; } .contact .fax:before { content: '\f1ac'; } .contact .mail:before { content: '\f003'; } /* Zitat */ /* Bild Text Kombination - Seitentausch */ .seitentausch .r { flex-direction: row-reverse; } .no-flexbox .seitentausch .b { float: right; } .seitentausch figure { text-align: right; } /* Bild Text Kombination - Video */ /* Karte map google maps */ .single-projekte .map { background-image: url('../img/vorschau-karte-1.jpg'); background-size: cover; } #projectmap { background-image: url('../img/vorschau-karte-1.jpg'); background-size: cover; } .map {width: 100%; height: 350px; background-color: #f6f6f6; position: relative; } .map img {max-width: inherit !important; } .gmap-info { text-align: center; padding-left: 30px; padding-right: 30px; } .gmap-info .btn { background-color: #3983d5; border-color: #3983d5; } .gmap-info .smaller { font-size: 14px; color: #333; } @media only screen and (max-width: 740px) { .gmap-info { padding-top: 50px; } } @media only screen and (min-width: 740px) { .gmap-info { position: absolute; width: 100%; top: 50%; transform: translateY(-50%); } } #projectmap .marker { pointer-events: none; visibility: hidden; } /* Responsive Video */ .video-responsive { height: 0; overflow: hidden; padding-bottom: 56.25%; margin: 0; position: relative; background: #f6f6f6; } .video-responsive-4-3 { padding-bottom: 75%; /* 4:3 */ } .video-responsive iframe, .video-responsive object, .video-responsive embed { height: 100%; left: 0; position: absolute; top: 0; width: 100%; border: 0;} .video-responsive video { height: auto; max-width: 100%; width: 100%; } /*kontaktseite */ .contactmap { height: 250px; } /*Projektübersicht*/ .project-ov a { text-decoration: none; } .project-ov .project { cursor: pointer; } .project-ov .imagecontainer { position: relative; } .project-ov .image { width: 100%; height: 300px; background-size: cover; background-position: cover; } .project-ov .b { padding: 1rem; } .project-ov .name { background: #2d2d2d ; padding: 1em; color: white; } .project-ov .logo { position: absolute; left: 0; right: 0; top: 50%; text-align: center; transform: translateY(-70%); opacity: 0; } .project-ov .logo img { max-width: 50%; } .project-ov .project:hover .logo { opacity: 0.3; transform: translateY(-40%); transition: all 0.4s; } .project-ov .project .overlay { opacity: 0; transition: all 0.4s; } .project-ov .project:hover .overlay { opacity: 0.7;transition: all 0.4s; } .project-ov.teaser .b { padding: 0.25rem; } .googlemaps .map { height: 500px; } .googlemaps + .s .b-12 { padding: 1rem; } @media all and (max-width: 1024px){ .project-ov .image { height: 200px; } } /* Projekte Unterseite Single Projekte */ .single-projekte h1 { color: #4f4f4f; } .single-projekte h1:before { display: none; } .single-projekte .gallery .b { padding: 0.25rem; } .single-projekte .gallery .extrapad { padding: 1.75rem; width: 100%; display: flex; display: -ms-flexbox; display: -webkit-flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .single-projekte strong { color: #4f4f4f; } .single-projekte .gallery .fancybox:hover { cursor: zoom-in; } .single-projekte .imgcontainer { overflow: hidden; } .single-projekte .imgcontainer .image { width: 100%; height: 400px; } .single-projekte .imgcontainer.first .image { width: 100%; height: 600px; } .single-projekte .gallery .fancybox:hover .imgcontainer { background-color: rgba(0,0,0,1); } .single-projekte .gallery .fancybox .image { transform: scale(1); transition: transform 0.4s; background-size: cover; } .single-projekte .gallery .fancybox:hover .image { opacity: 0.7; background-color: black; transform: scale(1.05); transition: transform 0.4s; } .single-projekte .projectnav { padding-top: 0; text-align: center; } .single-projekte .projectnav .btn { background: #3983d5; } .single-projekte .projectnav .btn:hover { background: #3C3C3B; border-color:#3C3C3B ; } .single-projekte .projectnav .prev, .single-projekte .projectnav .next { text-decoration: none; padding-top:12px; } .single-projekte .projectnav .prev:hover, .single-projekte .projectnav .next:hover { color: #3C3C3B; } .single-projekte .projectnav .prev { float: left; } .single-projekte .projectnav .next { float: right; } .single-projekte .projectnav .prev:before { content:'\f104'; font-family: 'FontAwesome'; margin-right: 5px; } .single-projekte .projectnav .next:after { content:'\f105'; font-family: 'FontAwesome'; margin-left: 5px; } /*kontaktformular kontakt*/ .contactform { padding: 0 25%; } .contactform input, .contactform textarea { width: 100%; } .contactform .wpcf7-form-control-wrap { width: 100%; } .contactform input[type="checkbox"] { width: auto; } /* über Uns */ h3.arrow:before { content: '\f101'; font-family: 'FontAwesome'; margin-right: 5px; } .aboutinfos { line-height: 1.5; } .team { text-align: center; } .team .image { display:inline-block; width: 210px; height: 210px; border-radius: 100%; background-position: center center; } .team .info .name { text-transform: uppercase; margin: 1.25rem 0; } .team .image { background-size: 100%; } @media all and (max-width: 768px){ .aboutinfos .b-4 { margin-top: 1rem; } .single-projekte .projectnav a { float: none;} .single-projekte .projectnav .prev, .single-projekte .projectnav .next { display: block; float: none; padding: 1rem; } } @media all and (max-width: 380px){ .team .m-6 .image { width: 100px; height: 100px; } } /* Footer */ #footer .line { background: #3c3c3b; color: white; margin-top: 1px; } #footer .line a { color: white; font-size: 1.6rem; transition: opacity 0.4s; } #footer .line a:hover { opacity: 0.6; transition: opacity 0.4s; } #footer .footernav { background: #3c3c3b; color: white; padding: 2.5rem 0; } #footer #sitemap ul { list-style: none; margin-left: 0; font-size: 1.6rem;} #footer #sitemap ul li a { color: #b0b0af; text-decoration: none; } #footer p { color: #b0b0af; font-size: 1.6rem; } #footer a { text-decoration: none; color: #b0b0af; transition: color opacity 0.4s; } #footer a:hover { opacity: 0.8; transition: color opacity 0.4 } #footer a:hover { color: #3983D5; transition: color 0.4s; } #footer form, #footer .wpcf7-form-control-wrap { width: 100%; } #footer input[type="text"] { background:#636362; width: 100%; color:#cbcbcb; padding: 0.8rem 1rem; } #footer input[type="submit"] { background: none; } #footer input[type="submit"]:hover { background: #2380c3; } #footer .b-3 { width: 27.5%; } #footer .b-3:first-child { width: 17%; } .accept, .contactform .accept .wpcf7-form-control-wrap, label.acceptlabel { width: auto; display: inline; } .accept a { font-weight: 700; } input[disabled=""] { opacity: 0.5; } .rueckruf .wpcf7-list-item-label { margin-left: 5px; } @media all and (max-width: 768px){ #footer .line #fn li { float: right; } .footernav { display: none; } } /* Footermenü */ #fn { float: right; } #fn a { color: #909090; text-decoration: none; } #fn a:hover { color: #fff; } #fn ul { list-style: none; margin: 0; padding: 0; } #fn li { float: left; margin: 0 0 0 1.5rem; padding: 0; } /* Tables */ .table-responsive { margin: 2rem 0; overflow-y: none; overflow-x: auto; } table { width: 100%; } th,td { border-bottom: .1rem solid #efefef; padding: 1.5rem 1rem; text-align: left; } th { border-color: #c9c9c9; } table tbody tr:hover { background-color: #f4f4f4; } tr:last-child td { border-bottom: 0; font-size: 14px; } table tr:last-child:hover { background-color: none; } /* Forms allgemein */ input,textarea,select { border: none; } input[type="text"],input[type="email"],input[type="password"],textarea { -webkit-appearance: none; padding: 1rem; background: #e8e8e8; } input[type="submit"] { background: #2380c3; width: auto; } label { display: inline-block; width: 25%; vertical-align: top; } .wpcf7-form-control label { width: auto; vertical-align: middle; } .wpcf7-form-control-wrap { display: inline; width: 75%; } .eingabe { padding: 1rem 0; } .pflicht { color: #ccc; } input.wpcf7-not-valid { outline:red 1px solid; } /* Contact Form 7 */ .wpcf7 { margin-left: auto; margin-right: auto; } .sent .hidewhensent, .wpcf7-display-none, .screen-reader-response { display: none; } .wpcf7-list-item + .wpcf7-list-item { margin-left: 2rem; } .wpcf7-response-output { padding-left: 25%; margin-top: 20px; } #footer .wpcf7-response-output { padding-left: 0; margin-top: 0; font-size: 1.6rem; } .wpcf7-not-valid-tip { font-size: 12px; } .wpcf7-validation-errors { color: red; } .wpcf7-mail-sent-ok { color: #2380c3; font-weight: 600; } .wpcf7-form.sent .eingabe { opacity: 0.5; } .sent .wpcf7-submit { display: none; } img.ajax-loader { margin-left: 20px; } .wpcf7-form.sent .ajax-loader { display: none; } /* WP Edit */ .wpedit { display: none; } .wpedit a { color: #555; text-decoration: none; } .desktop .wpedit { display: block; position: fixed; z-index: 11000; bottom: 0px; left: 0px; padding: 4px; color: #555; background: #ccc; font-size: 12px; } /* Alle Smartphones */ @media screen and (max-width: 768px) { /* Allgemein */ h1,h2,h3,h4,h5,h6 { -moz-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; -ms-hyphenate-limit-chars: auto 5; -ms-hyphenate-limit-lines: 2; -moz-hyphenate-limit-chars: auto 5; -moz-hyphenate-limit-lines: 2; -webkit-hyphenate-limit-chars: auto 5; -webkit-hyphenate-limit-lines: 2; hyphenate-limit-chars: auto 5; hyphenate-limit-lines: 2; } #header h1 { font-size: 30px; } .wpedit { display: none !important; } #mobilenav { float: right; font-size: 3rem; margin-right: 1rem; margin-top: 3.15rem; cursor: pointer; } #mn { margin-top: 0; } .container { max-width: none; } /* Silbentrennung */ .quote { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } /* Footer */ #footer .b-4 { padding: 2rem 0 2rem 2rem; } #footer .b-4:nth-child(even) { padding-left: 0; } #footer .descr, #footer .mail { display: none; } #footer .textright { text-align: left; } .loc p { font-size: 12px; } .loc .adr { padding-left: 0; margin-top: 10px; } .loc .adr:before { content: none; } .loc .tel { padding-left: 20px; } #fn { float: none; } #fn li { margin: 0 3rem 0 0; } /* Bild+Text Modul */ figure,figcaption { width: 100%; } figure img { width: 100%; height: auto; } /* Zitat */ .quote { padding-right: 0; } .quoleft { position: relative; display: inline; margin-left: 0; } .autor { position: relative; margin: 2rem 0 0 0; right: auto; text-align: right; } /* Galerie */ .galerie .b-4 { padding: 0; } /* Forms */ label { display: block; width: 100%; } /* Mobile Navi */ #mn { float: none; position: absolute; z-index: 110; left: 0; top: 95px; width: 100%; background:#326BA8; padding: 0; opacity: 0.95; text-align: center; } #mn ul li { float: none; } #mn ul li + li { margin-left: 0; } #mn ul li a { padding: 2rem; } #mn ul ul { display: none; } /* Contact Form 7 */ .wpcf7 { margin: 0; width: 100%; } .contactform { padding: 0; } /* Language Switch */ .mls { display: block; list-style: none; padding: 0; margin: 0; } .mls li { padding: 0; margin: 0 2rem 0 0; float: left; } .mls a { color: #909090; text-decoration: none; } .mls a.active { color: #fff; } } /* Größere Smartphones */ @media screen and (max-width: 425px) { #mn { top: 95px; } } /* Größere Smartphones */ @media screen and (max-width: 380px) { #mobilenav { margin-top: 4.5rem; } } /* Print */ @media print { body { font-size: 14px; } .preanimated { opacity: 1 !important; } .noprint,.socialicons,#header,#footer,.wpedit,.playbtn,.svideoslider,.snews { display: none; } .b-4 { width: 33%; } .b-6 { width: 50%; } .b-8 { width: 66%; } } /*datenschutztoggle*/ form p.accept, #footer form p.accept { font-size: 12px; display: inline-block; margin-top: 0; position: relative; padding-left: 20px; } form .acceptlabel a, #footer form .acceptlabel a { font-size: 12px; } .accept input { position: absolute; left: 0; top: 2px; } .no-js .privacytoggle--btn, .js .privacytoggle--btn.hide { display: none; } .privacytoggle--btn { font-weight: bold; cursor: pointer; } .privacytoggle--btn:before { content: '\f055'; font-family: 'FontAwesome'; margin-right: 5px; } .privacytoggle--btn:hover { opacity: 0.8; transition: opacity .4s; } .js .privacytoggle--text { display: none; } .js .open.privacytoggle--text { display: inline-block; } /* lato-300 - latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 300; src: url('../fonts/lato-v16-latin-300.eot'); /* IE9 Compat Modes */ src: local('Lato Light'), local('Lato-Light'), url('../fonts/lato-v16-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/lato-v16-latin-300.woff2') format('woff2'), /* Super Modern Browsers */ url('../fonts/lato-v16-latin-300.woff') format('woff'), /* Modern Browsers */ url('../fonts/lato-v16-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */ url('../fonts/lato-v16-latin-300.svg#Lato') format('svg'); /* Legacy iOS */ } /* lato-regular - latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: url('../fonts/lato-v16-latin-regular.eot'); /* IE9 Compat Modes */ src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/lato-v16-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/lato-v16-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('../fonts/lato-v16-latin-regular.woff') format('woff'), /* Modern Browsers */ url('../fonts/lato-v16-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('../fonts/lato-v16-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */ } /* lato-700 - latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; src: url('../fonts/lato-v16-latin-700.eot'); /* IE9 Compat Modes */ src: local('Lato Bold'), local('Lato-Bold'), url('../fonts/lato-v16-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/lato-v16-latin-700.woff2') format('woff2'), /* Super Modern Browsers */ url('../fonts/lato-v16-latin-700.woff') format('woff'), /* Modern Browsers */ url('../fonts/lato-v16-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('../fonts/lato-v16-latin-700.svg#Lato') format('svg'); /* Legacy iOS */ }