/* vhm-law - 10.06.2020 */ @font-face { font-family: 'DIN'; src: url('/fonts/DINLightAlternate.eot'); src: local('☺'), url('/fonts/DIN-LightAlternate.woff') format('woff'), url('/fonts/DIN-LightAlternate.ttf') format('truetype'), url('/fonts/DIN-LightAlternate.svg') format('svg'); font-weight: normal; font-style: normal; } @font-face{ font-family:"UniversUltraLight"; src:url("/fonts/6dde419d-6961-424c-96aa-c161fcddd222.eot?#iefix"); src:url("/fonts/6dde419d-6961-424c-96aa-c161fcddd222.eot?#iefix") format("eot"),url("/fonts/7067246b-e6e7-4dda-845c-6627eb3fba3c.woff2") format("woff2"),url("/fonts/733d2a79-e3d5-4524-bf22-30bb514abac3.woff") format("woff"),url("/fonts/9fcd59fe-9eab-4dc0-b9d5-d2373d7d2462.ttf") format("truetype"); } @font-face{ font-family:"UniversExtended"; src:url("/fonts/4d8ba874-28ee-4f87-b3c3-ab2fa759819e.eot?#iefix"); src:url("/fonts/4d8ba874-28ee-4f87-b3c3-ab2fa759819e.eot?#iefix") format("eot"),url("/fonts/25b6f532-a8b9-48d8-86a7-ff2d401a16d0.woff2") format("woff2"),url("/fonts/2b67a756-a89d-41e9-bd5e-c343d2c090ca.woff") format("woff"),url("/fonts/3ab4a48e-4da9-4d86-bee8-53d44b344799.ttf") format("truetype"); } @font-face { font-family: 'VHM Sans'; src: url('/fonts/VHMSans-Regular.eot'); src: url('/fonts/VHMSans-Regular.eot?#iefix') format('embedded-opentype'), url('/fonts/VHMSans-Regular.woff2') format('woff2'), url('/fonts/VHMSans-Regular.woff') format('woff'), url('/fonts/VHMSans-Regular.ttf') format('truetype'), url('/fonts/VHMSans-Regular.svg#VHMSans') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'VHM Sans'; src: url('/fonts/VHMSans-Bold.eot'); src: url('/fonts/VHMSans-Bold.eot?#iefix') format('embedded-opentype'), url('/fonts/VHMSans-Bold.woff2') format('woff2'), url('/fonts/VHMSans-Bold.woff') format('woff'), url('/fonts/VHMSans-Bold.ttf') format('truetype'), url('/fonts/VHMSans-Bold.svg#VHMSans-Bold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'VHM Sans'; src: url('/fonts/VHMSans-Light.eot'); src: url('/fonts/VHMSans-Light.eot?#iefix') format('embedded-opentype'), url('/fonts/VHMSans-Light.woff2') format('woff2'), url('/fonts/VHMSans-Light.woff') format('woff'), url('/fonts/VHMSans-Light.ttf') format('truetype'), url('/fonts/VHMSans-Light.svg#VHMSans-Light') format('svg'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'VHM Sans'; src: url('/fonts/VHMSans-Medium.eot'); src: url('/fonts/VHMSans-Medium.eot?#iefix') format('embedded-opentype'), url('/fonts/VHMSans-Medium.woff2') format('woff2'), url('/fonts/VHMSans-Medium.woff') format('woff'), url('/fonts/VHMSans-Medium.ttf') format('truetype'), url('/fonts/VHMSans-Medium.svg#VHMSans-Medium') format('svg'); font-weight: 500; font-style: normal; font-display: swap; } :root { --vhm-gold: #b1a497; --vhm-black: #0f0f0f; --vhm-black-80: #14141480; --vhm-white: #FBFBF9; --vhm-white-bg: #f6f6f3; --vhm-white-bg2: #ffffff; --vhm-white-pill: #fdfdfc; --vhm-grey-bg: #e6e2dc; --vhm-grey-bg-light: #f0eeeb; --vhm-grey-bg-30:rgba(216,210,201,0.3); --vhm-grey-text: #b1a497; --vhm-footer-header: #E6E2DC; --vhm-grey-light: #fbfbf9; --vhm-orange-highlight: #ff6700; --vhm-font: "VHM Sans", sans-serif; } * { margin:0px; padding:0px; box-sizing:border-box; } input:focus {outline: none;box-shadow: none !important;border: 1px solid white !important;} select:focus, .button:focus {outline: none; box-shadow: none !important} select.button { padding: 6px 4px; background: rgba(0,0,0,0) url("/UserFiles/structure/svg/triangle-bottom-arrow.svg") no-repeat scroll calc(100% - 15px) center/8px auto; -webkit-appearance: none; -moz-appearance: none; appearance: none; } html {height:100%;} body {font: normal 15px/18px var(--vhm-font);overflow-y:scroll; height:100%; letter-spacing: 0.3px;color: var(--vhm-black); margin: 0; overflow-x:hidden; background-color:var(--vhm-white-bg)} body.bg_0 {background-color: var(--vhm-white-bg);} body.bg_1 {background-color: var(--vhm-grey-bg)} body.bg_2 {background-color: var(--vhm-grey-light) } body.bg_3 {background-color: var(--vhm-black)} h1, .h1like {font: 700 68px/82px var(--vhm-font);letter-spacing: 0px; color: var(--vhm-black); display: inline-block; position: relative; max-width: inherit;} body.isStart h1, body.isStart .h1like {font: 700 88px/105px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-black);} h2, .h2like {font: 600 38px/43px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-black);} .h2intro {font: 600 23px/30px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-black);} .bigger {font: normal 23px/30px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-black);} h3, .h3like {font: 500 26px/38px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-black); margin-bottom: 5px} h4, .h4like {font: 500 23px/30px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-black);} h5, .h5like {font: 500 16px/22px var(--vhm-font); letter-spacing: 1px;color: var(--vhm-black);text-transform: uppercase;} .headlinegray32 {font: 500 35px/43px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-grey-text);} .headlinegray20, .headlinegray20 a {font: 500 30px/30px var(--vhm-font); letter-spacing: 0.04px;color: var(--vhm-grey-text) !important;} .underline {text-decoration: underline} h1.hc_0, h2.hc_0, h3.hc_0, h4.hc_0, h5.hc_0, .h1like.hc_0, .h2like.hc_0, .h3like.hc_0, .h4like.hc_0, .h5like.hc_0, .hc_0 {color: var(--vhm-black)} h1.hc_1, h2.hc_1, h3.hc_1, h4.hc_1, h5.hc_1, .h1like.hc_1, .h2like.hc_1, .h3like.hc_1, .h4like.hc_1, .h5like.hc_1, .hc_1 {color: var(--vhm-grey-text)} h1.hc_2, h2.hc_2, h3.hc_2, h4.hc_2, h5.hc_2, .h1like.hc_2, .h2like.hc_2, .h3like.hc_2, .h4like.hc_2, .h5like.hc_2, .hc_2 {color: var(--vhm-white)} h1 .light {color: var(--vhm-grey-text); display: block} body.isStart .subline_start, body.isStart h1.start {width: 800px; max-width: 100%} .headlineSection {margin-bottom: 100px} .headlineSection::before {content: ""; position: absolute; left: 50%; top: 50%; height: 160%; min-height: 230px; width: 45px; border-radius: 25px; transform: translate(-50%, -50%) rotate(-25deg); z-index: -1} .bg_0 .headlineSection::before {background-color: var(--vhm-grey-bg);} .bg_1 .headlineSection::before {background-color: var(--vhm-white);} .bg_2 .headlineSection::before {background-color: var(--vhm-white);} .bg_3 .headlineSection::before {background-color: var(--vhm-white);} .h0 {font-style: normal;font-weight: bold;font-size: 52px;line-height: 64px;letter-spacing: 0;color: var(--vhm-black);} h2.subline {margin-top: 45px} div.subline {font: 500 30px/36px var(--vhm-font); margin-top: 45px} .ovh {overflow: hidden} #wrap {position:absolute; top:0px; z-index:1; margin:0px auto; text-align:left; width:100%; min-height: 100vh} /* diverse Divs ---------------------- */ #tools_left {position:absolute; display:none; z-index:1; top:240px; left:-2px; width:40px; height:127px;border-top-right-radius:20px; border-bottom-right-radius:20px; background-image:url(/UserFiles/structure/tools/tools_left_green.png);} .rss {margin-top:15px; margin-left:9px; width:18px; height:18px; display:block;} .xing {margin-top:5px; margin-left:9px; width:18px; height:18px; display:block;} /*.news {margin-top:5px; margin-left:9px; width:18px; height:18px; display:block;} */ .netzwerk {margin-top:5px; margin-left:9px; width:18px; height:18px; display:block;} #content,.content {width:100%;margin:0px auto; box-sizing:border-box; min-height:100px} /*#content.s_team {width:1305px}*/ body.home #content {min-height:1px} #content {margin-top: 100px;} .abstand {clear: both;} .abstand::after {content: " "; display: block; clear: both} .pt_0{padding-top:0px !important; display: block; width: 100%; height: 0px} .pt_1{padding-top:20px !important; display: block; width: 100%; height: 0px} .pt_2{padding-top:50px !important; display: block; width: 100%; height: 0px} .pt_3{padding-top:70px !important; display: block; width: 100%; height: 0px} .pt_35{padding-top:100px !important; display: block; width: 100%; height: 0px} .pt_4{padding-top:120px !important; display: block; width: 100%; height: 0px} .pt_5{padding-top:240px !important; display: block; width: 100%; height: 0px} .pt_6{padding-top:360px !important; display: block; width: 100%; height: 0px} .abstand.pt_0 {display: none} .pb_0{padding-bottom:0px !important; display: block; width: 100%; height: 0px} .pb_1{padding-bottom:20px !important; display: block; width: 100%; height: 0px} .pb_2{padding-bottom:50px !important; display: block; width: 100%; height: 0px} .pb_3{padding-bottom:70px !important; display: block; width: 100%; height: 0px} .pb_35{padding-bottom:100px !important; display: block; width: 100%; height: 0px} .pb_4{padding-bottom:120px !important; display: block; width: 100%; height: 0px} .pb_5{padding-bottom:240px !important; display: block; width: 100%; height: 0px} .pb_6{padding-bottom:360px !important; display: block; width: 100%; height: 0px} .abstand.pb_0{display: none} .flex {display: flex} .flexLeftCentered, .flexCentered {display: flex; justify-content: center} .flexGrow1 {flex-grow: 1} .flexspacebetween {justify-content: space-between} .pt10 {padding-top: 10px} .pt20 {padding-top: 20px} .pt30 {padding-top: 30px} .pt40 {padding-top: 40px} .pt50 {padding-top: 50px} .pt60 {padding-top: 60px} .pt70 {padding-top: 70px} .pt80 {padding-top: 80px} .pt90 {padding-top: 90px} .pt100 {padding-top: 100px} .pt110 {padding-top: 110px} .pt120 {padding-top: 120px} .pr40 {padding-right: 40px} .pb10 {padding-bottom: 10px} .pb20 {padding-bottom: 20px} .pb30 {padding-bottom: 30px} .pb40 {padding-bottom: 40px} .pb50 {padding-bottom: 50px} .pb60 {padding-bottom: 60px} .pb70 {padding-bottom: 70px} .pb80 {padding-bottom: 80px} .pb90 {padding-bottom: 90px} .pb100 {padding-bottom: 100px} .pb110 {padding-bottom: 110px} .pb120 {padding-bottom: 120px} .w180 {width: 180px; max-width: 100%} .w200 {width: 200px; max-width: 100%} .indicator {width:25px; height: 10px; background: var(--vhm-gold) 0% 0% no-repeat padding-box; margin-right: 25px; margin-top: 12px; border-radius: 10px} .mh600 {max-height: 600px;} .ofh {overflow: hidden} .uppercase {text-transform: uppercase} .bold {font-weight: 700} .light {color: var(--vhm-grey-text)} .divider {height: 2px; width: 100%; background-color: var(--vhm-gold); margin: 20px 0} .flexcolumncenter {display: flex; flex-direction: column; align-items: center} #balkenoben {width:100%; position:fixed; z-index:999; box-sizing:border-box; padding: 30px 0 10px 0; -moz-transition: height 0.5s ease; -webkit-transition: height 0.5s ease; -o-transition: height 0.5s ease; transition: transform 0.6s ease-in-out; background-color: var(--vhm-white-bg);} body.sticky #balkenoben {transform: translateY(-100px)} body.bg_0 #balkenoben {background-color: var(--vhm-white-bg2);} body.bg_1 #balkenoben {background-color: var(--vhm-grey-bg)} body.bg_2 #balkenoben {background-color: var(--vhm-grey-light) } body.bg_3 #balkenoben {background-color: var(--vhm-black)} #topNav {width:1280px; max-width:100%; margin:0px auto; position:relative; font-size:0.7em; color:#000; box-sizing:border-box; padding-left:20px; padding-right:40px} #topNav a {color:#000} #topNav ul.topNav li {float:left; margin-right:10px; list-style-type:none; text-align:right} #topNav ul.langChange li {float:left; margin-right:5px; list-style-type:none; text-align:right} .topNav {float:right} #logolink {display:block; position:relative; float:right; right:2px } #logo {display:block; position:relative; background-image:url("/UserFiles/structure/VHM-Wortmarke-lang.png"); background-repeat:no-repeat; text-indent:-10000px; width:227px; height:20px; z-index:2; background-position-y:center; background-size: contain; left: 1px; -moz-transition: height 0.5s ease; -webkit-transition: height 0.5s ease; -o-transition: height 0.5s ease; transition: height 0.5s ease;} body.sticky #logo {height: 45px} #logoXL {display:block;position:relative; background-image:url(/UserFiles/structure/logo_vhm-law-842x400_ohne.png); background-size:800px 380px; background-repeat:no-repeat; text-indent:-10000px; width:800px; height:380px; z-index:2; margin-top:20px; margin-left:50px} #logoMobile {display: none} #claimSmall {width:65px; height:auto; min-height:110px; float:left; margin-right:40px; margin-left:-10px; } #spruch {position:absolute; z-index:10001; color:#fff; top:40px; right:60px; text-align:right; font-size:20px; line-height:30px; font-weight:normal} #spruch .small {font-size:12px;} .xsmall {font-size:9px;} .content p.xsmall, .content span.xsmall {line-height:15px} #nav {position:relative; width:1320px; max-width:100%; margin:0px auto; box-sizing:border-box; padding: 0 16px; height: 60px; display: flex; justify-content: space-between; align-items: center} #contentInnen, .contentInnen {width: 1300px; max-width: 100%; margin: 0px auto; position: relative; z-index: 10} #contentInnen.start, .contentInnen.start {min-height:0px; margin-top:20px; margin-left:177px} #contentInnen a:hover, .contentInnen a:hover {text-decoration:none;} #contentInnen hr, .contentInnen hr {border: solid 1px var(--vhm-grey-text); height: 0px; opacity: 0.25; margin: 36px 0 16px 0} #contentInnen p {} .contentInnen .haupttext p, .contentInnen p {margin-bottom: 15px} #content.mainContent #contentInnen {width: 50%; margin: 0; padding-left: 90px} .pillBig {width: 160px; height: 32px; background: var(--vhm-grey-bg); border-radius: 16px} .bulletpoint {margin-bottom: 20px} .bulletpoint a {font-weight: 500; text-decoration: underline} ul.bulletpoints li::before, .bulletpoint::before {content:''; display: inline-block;background-color: var(--vhm-black); width: 15px; height: 5px; border-radius: 16px; margin-right: 15px; position: relative; top: -3px; flex-shrink: 0} ul.bulletpoints ul {padding-left: 20px} ul li {list-style: none;} .contentInnen ul.grid li {line-height: inherit !important} .contentInnen ul.grid li.bigger {line-height: 30px !important} .bulletpoint.nobullet {margin-bottom: 10px} .bulletpoint.nobullet::before {display: none;} .content.aw_services .contentInnen,.content[class*="aw_expertise"] .contentInnen {display: flex; flex-direction: column; align-items: center} .expertise {width: 100%;margin-top: 40px; padding: 0 40px} .expertise .expertisefields {width: 100%; display: grid; grid-template-columns: repeat(4,1fr); justify-content: space-between} .expertise .expertisefields .field {height: auto; min-width: 277px} .expertise .expertisefields .field .fieldHead{font: bold 38px/46px var(--vhm-font); display: flex; align-items: center; justify-content: center; width: 100%; height: 200px; text-align: left; word-spacing: 100vw} .expertise .expertisefields .field .fieldHead span{z-index: 99; max-width:50%} .expertise .expertisefields .field .fieldHead .pillBig.white.absolute{z-index: 10; position: absolute; background-color:var(--vhm-white-pill); transition: background-color 0.25s} .expertise .expertisefields .field:hover .fieldHead .pillBig.white.absolute{background-color:var(--vhm-orange-highlight)} .expertise .expertisefields .field:nth-of-type(1) .pillBig.white.absolute{/* transform: matrix(0.94,0.34,-0.34,0.94,0,0); */ transform: rotate(115deg)} .expertise .expertisefields .field:nth-of-type(2) .pillBig.white.absolute{/* transform: matrix(0.12,0.99,-0.99,0.12,0,0); */ transform: rotate(65deg)} .expertise .expertisefields .field:nth-of-type(3) .pillBig.white.absolute{/* transform: matrix(0.85,-0.53,0.53,0.85,0,0); */ transform: rotate(85deg)} .expertise .expertisefields .field:nth-of-type(4) .pillBig.white.absolute{/* transform: matrix(0.99,-0.10,0.10,0.99,0,0); */ transform: rotate(128deg)} .expertise .expertisefields .field:nth-of-type(5) .pillBig.white.absolute{/* transform: matrix(0.74,-0.67,0.67,0.74,0,0); */ transform: rotate(53deg)} .expertise .expertisefields .field .fieldBody {line-height: 24px; text-align: center} .expertise .expertisefields .field .pillBig {-webkit-box-shadow: 1px 0px 15px -4px rgba(0,0,0,0.12); box-shadow: 1px 0px 15px -4px rgba(0,0,0,0.12);} .content.m_home .expertise .fieldBody {display: none} .expertise .expertisefields.about_us_pills .field:nth-of-type(1) .pillBig.white.absolute{transform: rotate(50deg)} .expertise .expertisefields.about_us_pills .field:nth-of-type(2) .pillBig.white.absolute{transform: rotate(85deg)} .expertise .expertisefields.about_us_pills .field:nth-of-type(3) .pillBig.white.absolute{transform: rotate(128deg)} .expertise .expertisefields.about_us_pills .field:nth-of-type(4) .pillBig.white.absolute{transform: rotate(40deg)} .services {display: flex;flex-wrap: wrap; justify-content: center; width: 100%;margin-top: 50px} .services .button {width: auto; padding-left: 40px; padding-right: 40px; margin: 0px 5px 10px 0px; text-transform: capitalize} .servicesResult {width: 100%; margin-top: 70px} .servicesResult h4 {display: none} .teamSplit {display: flex;} .teamSplit .partnerLeft {width: 50%;padding-left: 125px;padding-right: 25px} .teamSplit .partnerLeft .partnerdivsmall {width: 120px;height: 92.5px;margin-right: 18px; margin-bottom:18px} .teamSplit .partnerLeft .partnerdivbig {width: 258px;height: 203px;margin-right: 18px; margin-bottom:18px} .teamSplit .partnerLeft .partnerdivsmall .img__description_layer {padding-top:10px; padding-left:10px;font-size: 20px;line-height: 25px; } .teamSplit .partnerLeft .partnerdivbig .img__description_layer {padding-top:10px; padding-left:10px;font-size: 20px;line-height: 25px; } .teamSplit .partnerRight {width: 50%;padding-right: 170px;padding-left: 25px;display: flex;flex-direction: column;justify-content: center;} .flex .firstElem {flex-grow: 0; flex-shrink: 0; flex-basis: 410px; padding-right: 40px } .expertiseSplit {width: 100%; margin-top: 40px;display: flex;justify-content: space-evenly;} .expertiseSplit .expertiseHead {color: var(--vhm-white);text-transform: uppercase;font-size: 22px;letter-spacing: 1.54px;line-height: 30px;font-weight: bold;margin-bottom: 20px;} .bg_0 .expertiseSplit .expertiseHead {color: var(--vhm-grey-bg)} .expertiseSplit ul li {list-style: none;font-size: 17px;letter-spacing: 0.17px;line-height: 49px;font-weight: 500;} .pressReleases {display: flex; margin-top: 120px;} .pressReleases .left {width: 500px; max-width: 100%} .pressReleases .right {width: calc(100% - 500px); max-width: 100%} .pressReleases .newscontent {display: flex; } .pressReleases .newscontent .text {width: calc(100% - 50px); max-width: 100%} .pressReleases .newscontent .text a {color: var(--vhm-black)} .pressReleases .moreButtons {padding-top: 30px;display: flex} .pressReleases .newscontent img {max-width: 150px} .pressReleases .w180 img {width: 100%; box-shadow: 5px 5px 0px var(--vhm-grey-bg);border: 1.5px solid var(--vhm-grey-bg);} a.learnmore {font: 500 20px/20px var(--vhm-font); color: var(--vhm-black) !important; text-decoration: underline} .pressReleases .datum {font: 500 20px/22px var(--vhm-font); color: var(--vhm-gold) !important; margin-bottom: 30px;} .teamfinder {width: 700px; max-width: 100%; margin: 0px auto; text-align: center} .teamfinder .form.flex .input {width: calc(100% - 240px); padding-right: 0px} .teamfinder .form.flex .input input {width: 100%; border:0px; border-bottom: 2px solid var(--vhm-white); height: 65px} .teamfinder .form.flex .input input.lineBottomGrey {border-bottom: 2px solid var(--vhm-grey-bg);} .teamfinder button.button {background-color: transparent} .content.aw_awards_favoriten .contentInnen {display: flex; flex-direction: column; align-items: center} .awardsFav {width: 100%; margin-top: 120px; margin-bottom: 120px;} .awardsFav .awardsFavInner {display: flex;justify-content: center;max-width: 1200px; margin: 0px auto;} .awardsFav .award {width: 170px; height: 170px; margin-left: 20px; margin-right: 20px} .partner.layout_5 .textContent {max-width: 600px} .partner .textContent .descriptionOuter {margin-bottom: 70px} .partner .textContent .description {max-height: 300px;overflow: hidden;position: relative;} .partner .textContent .description .textfade {position: absolute; width: 100%;bottom: 0;left: 0;background-image: linear-gradient(to bottom, transparent, var(--vhm-white));height: 120px;} body.mac.sf .partner .textContent .description .textfade {background-image: none !important} .partner .textContent .readMore {color: var(--vhm-grey-text); text-decoration: underline} .partner .textContent .buttons {display: flex;margin-top: 70px} .partner .textContent .buttons .button{width: auto; padding: 0 40px; margin-right: 40px} .partner .textContent .split {display: flex; max-width: 1200px; width: 100%; margin: 0px auto} .partner .textContent .split .left, .partner .textContent .split .right {width: 50%} .partner .textContent .split li {list-style: none;margin-bottom: 20px;} .mitarbeiterOuter {display: grid;justify-content: start;grid-template-columns: repeat(auto-fill,190px);row-gap: 50px; margin-top: 50px} .mitarbeiterOuter .mitarbeiter {height: 205px;} .mitarbeiterOuter .mitarbeiter a {height: 100%} .mitarbeiterOuter .mitarbeiterInner {height: 100%;margin: 0px auto;display: flex;flex-direction: column;align-items: center;justify-content: space-between;} .mitarbeiterOuter .mitarbeiter .mitarbeiterImg {width: 155px;height: 155px;border-radius: 121px;display: block;position: relative;} .mitarbeiterOuter .mitarbeiter .mitarbeiterBottom {display: flex; flex-direction: column; align-items: center; font-size: 17px; letter-spacing: 0.17px; line-height: 20px;} .mitarbeiterOuter .mitarbeiter .mitarbeiterBottom .name {text-align: center} .mitarbeiterOuter .mitarbeiter .mitarbeiterBottom .position {color: var(--vhm-gold)} .content .mitarbeiterImg img {object-fit: cover;border-radius: 100%;height: 100%;width: 100%;} .mitarbeiterOuter .slick-prev, .mitarbeiterOuter .slick-next {height: 90px; width: 54px;z-index: 99} .mitarbeiterOuter .slick-next::before {content: "";background-image: url("UserFiles/structure/svg/line-angle-right-white.svg");height: 30px;width: 17px;display: block;background-repeat: no-repeat; position: absolute; top: 0px; right:-10px} .mitarbeiterOuter .slick-prev::before {content: "";background-image: url("UserFiles/structure/svg/line-angle-left-white.svg");height: 30px;width: 17px;display: block; background-repeat: no-repeat; position: absolute; top: 0px} #sorry-no-match {display: none} .partnerGrid {display: flex; flex-wrap: wrap;} .partnerGrid .leftBig {display: grid; grid-template-areas: "big small1" "big small2"; grid-template-columns: 60% 40%; } .partnerGrid .leftBig .partnerLink:nth-of-type(1) {grid-area: big} .partnerGrid .leftBig .partnerLink:nth-of-type(2) {grid-area: small1} .partnerGrid .leftBig .partnerLink:nth-of-type(3) {grid-area: small2} .partnerGrid .rightBig {display: grid; grid-template-areas: "small1 big" "small2 big"; grid-template-columns: 40% 60%; } .partnerGrid .rightBig .partnerLink:nth-of-type(1) {grid-area: small1} .partnerGrid .rightBig .partnerLink:nth-of-type(2) {grid-area: small2} .partnerGrid .rightBig .partnerLink:nth-of-type(3) {grid-area: big} .partnerGrid .rightBig2 {display: grid; grid-template-areas: "small1 big" "small2 big"; grid-template-columns: 40% 60%; } .partnerGrid .rightBig2 .partnerLink:nth-of-type(1) {grid-area: big} .partnerGrid .rightBig2 .partnerLink:nth-of-type(2) {grid-area: small1} .partnerGrid .rightBig2 .partnerLink:nth-of-type(3) {grid-area: small2} .partnerGrid .singleRow {display: grid; grid-template-columns: repeat(3,33.3%); width: 100% } .partnerGrid .singleRow .spacer.textspacer {height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; background-color: var(--vhm-grey-bg); font-size: 24px; line-height: 30px; font-weight: 700; color: var(--vhm-white); position: relative; text-align: center} .partnerGrid .singleRow .spacer.textspacer:nth-of-type(2) {background-color: var(--vhm-grey-text)} .partnerGrid .partnerLink {position: relative} .partnerGrid .partnerLink .overlay {position: absolute; left: 30px; bottom: 30px; color: var(--vhm-white); font-size: 16px; line-height: 24px; font-weight: 700; z-index: 10; opacity: 0; transition: 0.7s opacity} .partnerGrid .partnerLink .overlay::before {content:"";position: absolute; height: 73px; width: 14px; left: 30px; bottom: -20px; border-radius: 10px; background-color: var(--vhm-grey-text); transform: rotate(43deg); z-index: -1} .partnerGrid .partnerLink:hover .overlay {opacity: 1} .partnerGrid .leftBig .partnerLink, .partnerGrid .rightBig .partnerLink {height: 100%} .partnerGrid .rightSmall .partnerLink, .partnerGrid .leftSmall .partnerLink {height: 50%} .partnerLink img {height: 100%; width: 100%; object-fit: cover;} .partnerLink img.mobile {display: none} .highlightsOuter {overflow: hidden; display: none} .highlightsOuter .highlightsHead {text-transform: uppercase; font-weight: bold; color: var(--vhm-grey-text); cursor: pointer; margin-bottom: 10px} .highlightsOuter .highlightsBody {max-height: 0px; transition: 0.3s ease} .highlightsOuter .highlightsBody ul li {position: relative; padding-left: 20px; margin-bottom: 5px} .highlightsOuter .highlightsBody ul li::before {content: ""; position: absolute; height: 5px; width: 23px; border-radius: 5px; background-color: var(--vhm-grey-light); left: -7px; top: 8px; transform: rotate(-65deg)} .slickGalleryOuter {display: block; width: 100%} body.bg_0 .content {background-color: var(--vhm-white-bg2); color:var(--vhm-black)} body.bg_1 .content {background-color: var(--vhm-grey-bg); color:var(--vhm-black)} body.bg_2 .content {background-color: var(--vhm-grey-light); color:var(--vhm-black) } body.bg_3 .content {background-color: var(--vhm-black); color:var(--vhm-white)} /* layout_0 = "Zentrierer Block (1320 Pixel Breite)"; layout_1 = "Ganze Breite"; layout_2 = "Nav links / Content rechts (1320 Pixel Breite)"; */ .content.layout_0 .contentInnen {width: 1320px !important; max-width: 100% !important; padding: 0px 16px} .content.layout_0 .contentInnen .imgGrid {display: grid; grid-template-columns: 1fr 1fr; gap: 30px;} .content.layout_0 .contentInnen .imgGrid img {height: 100%; object-fit: cover} .content.layout_1 .contentInnen{ width: 100vw !important; max-width: 100% !important;} .content.layout_1 .contentInnen .hauptbild {width: 100vw; height: auto;} .content.layout_1 .contentInnen .hauptbild .fullscreenvideo {width: 100%; height: 100%; object-fit: cover} .content.layout_1 .contentInnen .hauptbild .zitatbox {background-color: var(--vhm-grey-bg); padding: 45px 75px; position: absolute; bottom: -100px; right: max(10px,calc((100vw - 1320px) / 2));; font: 600 35px/46px var(--vhm-font); max-width: 450px; text-align: center;} .content.layout_2 .contentInnen {display: flex;} .content.layout_2 .contentInnen .content {column-count: 2} .content.layout_2 .contentInnen .pageNav {display: flex; flex-direction: column; width: 330px; padding-top: 45px; flex-shrink: 0} .content.layout_2 .contentInnen .pageNav a {font: 700 27px/32px var(--vhm-font); transition: color 0.4s} .content.layout_2 .contentInnen .pageNav a:hover, .content.layout_2 .contentInnen .pageNav a.aktiv {color: var(--vhm-grey-text)} .content.layout_2 .contentInnen .textContent {display: flex; flex-direction: column; width: 100%} .content.layout_2 .contentInnen .textContent h1 {align-self: flex-start} .content.layout_2 .contentInnen .textContent .content_einleitung {max-width: 470px; align-self: flex-end; position: relative; top: -80px;} .content.layout_3 .contentInnen {display: flex; justify-content: space-between; padding-left: 120px} .content.layout_3 .contentInnen .headlineBlock{width: 200px; flex-shrink: 0; padding: 16px; margin-right: 100px} .content.layout_3 .contentInnen .headlineBlock h1 {word-spacing: 100vw; display:inline } .content.layout_3 .contentInnen .headlineBlock h1::before {content: ""; position: absolute; left: 40%; top: 48%; height: 114%; min-height: 215px; width: 45px; border-radius: 25px; transform: translate(-50%, -50%) rotate(-25deg); background-color: var(--vhm-grey-bg); z-index: -1;} .content.layout_3 .contentInnen .textContent {width: 700px; max-width: 100%} .content.layout_3 .contentInnen .textContent .haupttext ul {columns: 2} .content.layout_4 .contentInnen {width: 1320px !important; max-width: 100% !important; padding: 0px 16px} .content.layout_4 .contentInnen .einleitung {width: 880px; margin: 0px auto; font: 600 30px/36px var(--vhm-font); margin-bottom: 20px} .content.layout_4 .contentInnen .einleitung .light {color: var(--vhm-grey-text); display: block} .content.layout_4 .contentInnen .haupttext {width: 880px; max-width: 100%; margin: 0px auto; padding: 20px 0} .content.layout_4 .contentInnen .textContent table{border-spacing: 0; border-collapse: collapse} .content.layout_4 .contentInnen .textContent table tr td {width: 50%; vertical-align: top; padding: 20px 10px; border-top: 1px solid var(--vhm-grey-text); border-bottom: 1px solid var(--vhm-grey-text); border-collapse: collapse} .content.layout_4 .contentInnen .textContent table tr td:nth-child(2) {} .content.layout_4 .contentInnen .textContent table tr td ul li {font: 500 16px/26px var(--vhm-font); padding-left: 20px; position: relative} .content.layout_4 .contentInnen .textContent table tr td ul li::before {content: ""; position: absolute; height: 5px; width: 23px; border-radius: 5px; background-color: var(--vhm-grey-bg); left: -7px; top: 8px; transform: rotate(65deg)} .m_dispute-resolution.content.layout_4 .contentInnen .haupttext p:first-of-type {border-top: 1px solid var(--vhm-grey-text); padding-top: 20px} .m_dispute-resolution.content.layout_4 .contentInnen .haupttext p:last-of-type {border-bottom: 1px solid var(--vhm-grey-text); padding-bottom: 20px} .content.layout_4 .contentInnen .textContent .haupttext hr {opacity: 1; border:none; border-top: 1px solid var(--vhm-grey-text); } .content.layout_5 .textContent { background-color: var(--vhm-grey-bg); padding: 60px; display: flex; justify-content: center;} .bg_1 .content.layout_5 .textContent { background-color: var(--vhm-grey-bg-light); padding: 60px; display: flex; justify-content: center;} .content.layout_5 .textContent .haupttext { font: 200 52px/61px var(--vhm-font); text-align: center; max-width: 850px} .content.layout_6 .contentInnen {padding: 0 100px} .content.layout_6 .contentInnen .headlineBlock{width: 100%; display: flex; justify-content: space-between; padding: 16px; margin: 100px 0; margin-right: 100px} .content.layout_6 .contentInnen h1 {width: 600px; font-size: 5.5rem; line-height: 6.5625rem; max-width: inherit;} .content.layout_6 .contentInnen h2 {width: 400px; display: flex; align-items: flex-end} .content.layout_6 .contentInnen h1::before {content: ""; position: absolute; left: 36%; top: 55%; height: 160%; min-height: 215px; width: 47px; border-radius: 23px; transform: translate(-50%, -50%) rotate(25deg); z-index: -1; background-color: var(--vhm-white)} .content.layout_6 .contentInnen .textContent {width: 650px; max-width: 100%} .content.layout_7 .contentInnen .colsOuter {display: flex; justify-content: space-between} .content.layout_7 .contentInnen .colsOuter .col {display: flex; flex-direction: column; align-items: center; width: 600px} .content.layout_7 .contentInnen .colsOuter .col:nth-child(2) {margin-top: 70px} .content.layout_7 .contentInnen .colsOuter .col img {max-width: 100%} .content.layout_7 .contentInnen .colsOuter .col img.imgHigh {max-width: 100%; height: 600px; object-fit: cover} .content.layout_7 .contentInnen .colsOuter .col .block {max-width: 500px; margin-bottom: 30px} .content.layout_7 .contentInnen .colsOuter .col .block.pl80 {padding-left: 80px} .content.layout_7 .contentInnen .colsOuter .col h3 {line-height: 36px; font-weight: 600; margin-bottom: 30px} .content.layout_7 .contentInnen .colsOuter .col h3 .light {display: block; color: var(--vhm-grey-text)} .content.layout_7 .contentInnen .colsOuter .col .quote {font: 400 44px/54px var(--vhm-font); width: 100%} .content.layout_7 .contentInnen .colsOuter .col .light {color: var(--vhm-grey-text)} .content.layout_8 .contentInnen {padding: 0 100px} .content.layout_8 .contentInnen .headlineBlock{width: 100%; display: flex; justify-content: space-between; padding: 16px; margin: 100px 0; margin-right: 100px} .content.layout_8 .contentInnen h1 {max-width: 600px; font-size: 5.5rem; line-height: 6.5625rem;} .content.layout_8 .contentInnen h1::before {content: ""; position: absolute; left: 46%; top: 55%; height: 160%; min-height: 215px; width: 47px; border-radius: 23px; transform: translate(-50%, -50%) rotate(25deg); z-index: -1; background-color: var(--vhm-white)} .bg_0 .content.layout_8 .contentInnen h1::before {background-color: var(--vhm-grey-bg)} .content.layout_8 .contentInnen .textContent {width: 100%;} .content.layout_8 .contentInnen .textContent .content, .content.layout_8 .contentInnen .textContent .haupttext {width: 100%; columns: 2; column-gap: 30px} .content.layout_8 .contentInnen .textContent .haupttext ul{break-after: column; margin-bottom: 15px} .content.layout_8 .contentInnen .textContent .haupttext ul:nth-of-type(n+2){break-after: avoid-column} .content.layout_8 .contentInnen .textContent .haupttext ul li {display: block; position: relative; padding-left: 20px} .content.layout_8 .contentInnen .textContent .haupttext ul li::before {content: ""; position: absolute; height: 4px; width: 16px; border-radius: 5px; background-color: var(--vhm-grey-bg); left: -7px; top: 8px; transform: rotate(-65deg)} .content.layout_9 .contentInnen {padding: 0 100px} .content.layout_9 .contentInnen .headlineBlock{width: 100%; display: flex; justify-content: space-between; padding: 16px; margin: 100px 0; margin-right: 100px} .content.layout_9 .contentInnen h1 {width: auto; font-size: 5.5rem; line-height: 6.5625rem; max-width: inherit;} .content.layout_9 .contentInnen h2 {width: 400px} .content.layout_9 .contentInnen h1::before {content: ""; position: absolute; left: 46%; top: 55%; height: 160%; min-height: 215px; width: 47px; border-radius: 23px; transform: translate(-50%, -50%) rotate(25deg); z-index: -1; background-color: var(--vhm-white)} .bg_0 .content.layout_9 .contentInnen h1::before {background-color: var(--vhm-grey-bg)} .content.layout_9 .contentInnen .textContent {width: 100%; padding-left: 25%} .content.layout_9 .contentInnen .textContent .content {width: 100%; columns: 2} .content.layout_9 .contentInnen .textContent .haupttext {font-size: 18px; line-height: 24px} .content.layout_9 .contentInnen .textContent .haupttext table {width: 100%} .content.layout_10 .contentInnen {padding: 0} .content.layout_10 .contentInnen .headlineBlock{width: 100%; display: flex; justify-content: space-between; padding: 16px; margin: 100px 0; margin-right: 100px} .content.layout_10 .contentInnen h1 {width: auto; font-size: 5.5rem; line-height: 6.5625rem; max-width: inherit;} .content.layout_10 .contentInnen h2 {width: 400px} .content.layout_10 .contentInnen h1::before {content: ""; position: absolute; left: 46%; top: 55%; height: 160%; min-height: 215px; width: 47px; border-radius: 23px; transform: translate(-50%, -50%) rotate(25deg); z-index: -1; background-color: var(--vhm-white)} .bg_0 .content.layout_10 .contentInnen h1::before {background-color: var(--vhm-grey-bg)} .content.layout_10 .contentInnen .textContent {width: 100%; padding-left: 25%; } .content.layout_10 .contentInnen .textContent .haupttext table {width: 100%} .content.layout_10 .contentInnen .textContent .haupttext table tr td {width: 50%; vertical-align: top} .content.layout_10 .contentInnen .textContent .haupttext table tr td:nth-of-type(1) {padding-right: 50px;} .content.layout_11 .contentInnen .colsOuter, .content.layout_12 .contentInnen .colsOuter {display: flex; justify-content: space-between} .content.layout_11 .contentInnen .colsOuter .col, .content.layout_12 .contentInnen .colsOuter .col {display: flex; flex-direction: column; align-items: center; width: 600px} .content.layout_11 .contentInnen .colsOuter .col:nth-child(2), .content.layout_12 .contentInnen .colsOuter .col:nth-child(2) {margin-top: 70px} .content.layout_11 .contentInnen .colsOuter .col img, .content.layout_12 .contentInnen .colsOuter .col img {max-width: 100%; margin: 50px 0} .content.layout_11 .contentInnen .colsOuter .col img.imgHigh, .content.layout_12 .contentInnen .colsOuter .col img.imgHigh {max-width: 100%; height: 600px; object-fit: cover} .content.layout_11 .contentInnen .colsOuter .col .block, .content.layout_12 .contentInnen .colsOuter .col .block {max-width: 500px; margin-bottom: 30px} .content.layout_11 .contentInnen .colsOuter .col .block.pl80, .content.layout_12 .contentInnen .colsOuter .col .block.pl80 {padding-left: 80px} .content.layout_11 .contentInnen .colsOuter .col h3, .content.layout_12 .contentInnen .colsOuter .col h3 {line-height: 36px; font-weight: 600; margin-bottom: 30px} .content.layout_11 .contentInnen .colsOuter .col h3 .light,.content.layout_12 .contentInnen .colsOuter .col h3 .light {display: block; color: var(--vhm-grey-text)} .content.layout_11 .contentInnen .colsOuter .col .quote, .content.layout_12 .contentInnen .colsOuter .col .quote {font: 400 40px/50px var(--vhm-font); width: 100%} .content.layout_11 .contentInnen .colsOuter .col .quote .smalcursive, .content.layout_12 .contentInnen .colsOuter .col .smalcursive, .smalcursive {font: 400 20px/40px var(--vhm-font); width: 100%;font-style: italic} .content.layout_11 .contentInnen .colsOuter .col .light, .content.layout_12 .contentInnen .colsOuter .col .light {color: var(--vhm-grey-text)} .content.layout_13 .contentInnen .videoplayer {width: 100%} .contentInnen h2 {padding-bottom: 20px} .mainContent {margin-top: 100px;position: relative;} .column2 {column-count: 2; column-gap: 32px;} .column2 a {display: block; font: 600 21px/25px var(--vhm-font); break-inside: avoid-column} .column2 a:hover {text-decoration: underline} .hauptbild.img_pos_ {} .hauptbild.img_pos_1 {justify-content: left} .hauptbild.img_pos_1 {justify-content: center} .hauptbild.img_pos_3 {justify-content: right} .personOuter {width: 870px; max-width: 100%;} .personOuter h2 { font-size: 18px; line-height: 24px; font-weight: 600; color: var(--vhm-gold);} .personOuter .topSection {display: flex;} .personOuter .topSection .half { width: 50%; padding: 0 15px;} .personOuter .topSection .name { font-size: 58px; line-height: 70px; margin-bottom: 40px} .personOuter .topSection .name span { display: block} .personOuter .topSection .typ { font-size: 18px; line-height: 24px; font-weight: 600; margin-bottom: 25px} .personOuter .topSection .adressePerson { font-size: 18px; line-height: 24px; font-weight: 400; margin-bottom: 25px; color: var(--vhm-gold)} .personOuter .topSection .adressePerson .line { font-size: 18px; line-height: 24px; font-weight: 400; color: var(--vhm-gold)} .personOuter .topSection .adressePerson .line:first-of-type { max-width: 300px} .personOuter .topSection .adressePerson a { font-size: 18px; line-height: 24px; font-weight: 400; color: var(--vhm-gold); display: block} .personOuter .topSection .adressePerson a:hover { text-decoration: underline !important} .personOuter .bottomSection {position: relative; padding: 0 15px} .personOuter .buttonSection { font-size: 18px; line-height: 24px; font-weight: 600; color: var(--vhm-gold); display: flex; position: absolute; right: 15px} .personOuter .buttonSection a { display: flex; align-items: center; color: var(--vhm-gold); white-space: nowrap} .personOuter .buttonSection a img { height: 40px} .personOuter .buttonSection a img:first-child { margin-left: -5px} .personOuter .text {} .personOuter .text.kompetenzen > ul { display: flex; flex-direction: column; gap: 25px } .personOuter .text.kompetenzen > ul > li { display: flex; } .personOuter .text.kompetenzen > ul > li > a, .personOuter .text.kompetenzen > ul > li > span{ width: 30%} .personOuter .text.kompetenzen > ul > li a { font-size: 16px; line-height: 24px} .personOuter .text.kompetenzen > ul > li ul li{ line-height: 26px; font-weight: 600; position: relative} .personOuter .text.kompetenzen > ul > li ul li::before{top: 10px; left: -24px; width: 23px; height: 5px; border-radius: 3px; transform: rotate(67deg); content: ""; display: block; position: absolute; background-color: var(--vhm-grey-bg);} .personOuter .text.education > ul > li, .personOuter .text.mitgliedschaften > ul > li, .personOuter .text.publikationen > ul > li, .personOuter .text.vortragstaetigkeiten > ul > li {position: relative; padding-left: 24px; margin-bottom: 7px; display: inline-block} .personOuter .text.education > ul > li::before, .personOuter .text.mitgliedschaften > ul > li::before, .personOuter .text.publikationen > ul > li::before, .personOuter .text.vortragstaetigkeiten > ul > li::before {top: 10px; left: 0px; width: 17px; height: 3px; border-radius: 3px; content: ""; display: block; position: absolute; background-color: var(--vhm-grey-bg);} .personOuter .text.about, .personOuter .text.education > ul, .personOuter .text.publikationen > ul {columns: 2; -webkit-columns: 2; -moz-columns: 2;} .personOuter .text.education > ul > li > ul > li {position: relative; padding-left: 15px; margin-top: 2px} .personOuter .text.education > ul > li > ul > li::before {top: 10px; left: 0px; width: 10px; height: 3px; border-radius: 3px; content: ""; display: block; position: absolute; background-color: var(--vhm-grey-bg);} .personOuter .awardsSmall {width: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 60px; background-color: var(--vhm-white-bg)} .personOuter .awardsSmall a {padding: 5px 20px; display: flex; flex-direction: column; justify-content: center; } .personOuter .awardsSmall img {width: auto !important; max-height: 100px; margin-right: 0px !important; mix-blend-mode: multiply} .intraLinks li {margin-bottom: 5px; position: relative; line-height: 26px; font-weight: 600;} .intraLinks li::before {top: 10px; left: -24px; width: 23px; height: 5px; border-radius: 3px; transform: rotate(67deg); content: ""; display: block; position: absolute; background-color: var(--vhm-grey-bg);} .intraMenu {margin:15px 0} .mainCatMenu {display: flex; border-bottom: 1px solid black} .mainCatMenu .mainCat {display: flex; padding: 0px 20px; cursor: pointer} .mainCatMenu .mainCat:hover, .mainCatMenu .mainCat.active {background-color: rgba(0,0,0,0.2)} .pleaseChoose {position: relative; top: 20px; font-weight: bold;} .catMenu {display: none; border-bottom: 1px solid black} .catMenu .cat {display: flex; padding: 0px 20px; cursor: pointer} .catMenu .cat:hover, .catMenu .cat.active {background-color: rgba(0,0,0,0.2)} .subCatMenu {display: none; border-bottom: 1px solid black} .subCatMenu .subCat {display: flex; padding: 0px 20px; cursor: pointer} .subCatMenu .subCat:hover, .subCatMenu .subCat.active {background-color: rgba(0,0,0,0.2)} .intraContent {position: relative} .intraContent .bullet {border-bottom: 1px solid rgba(0,0,0,0.5); padding:10px 0px;} .intraContent .bullet .top {display: flex; justify-content: space-between;} .intraContent .bullet .top .date {color:rgba(0,0,0,0.5)} .intraContent .bullet .link a, .intraContent .bullet .downloadlink a {text-decoration: underline !important; cursor: pointer} .intraContent ul li {display: block; list-style: initial} .intraContent table {border-collapse: collapse;} .intraContent table tr td {border: 1px solid black; border-collapse: collapse; padding: 5px 5px;} .intraContent table tr td p {margin-bottom: 0px !important} .detailAnsicht {margin-top: 15px} .detailAnsicht .datum {font-weight: normal; color: rgba(0,0,0,0.5)} .detailAnsicht .link {text-decoration: underline; margin-top: 5px} #subnav {position:relative; margin-top:45px; margin-left:10px; width:165px; overflow:hidden; float:left;} #subnav div.subnav {height:auto; font-size:11px; line-height:1.1em; margin-bottom:7px } #subnav div.subnav a.subnavlink { color:#000; text-decoration:none;} #subnav div.subnav a.subnavlink:hover { color:#9f9f9f;} #subnav div.subnav a.aktiv {color:#9f9f9f;} #subnav div.subnavheadline {font-family: 'RubrikMedium', sans-serif;font-size:13px; margin-bottom:5px; font-weight:normal} #subnav div.subnavheadline a.aktiv {font-family: 'RubrikMedium', sans-serif;color:#000; font-weight:normal} #subnav span.h20 {height:20px; width:1px; display:block} #subnav div.subnav a.aktiv {color:#9f9f9f; margin-bottom:5px; display:block;} #subnav div.subnav1 {margin-left:10px; height:auto; font-size:11px; line-height:1.1em; margin-bottom:7px; color:#000} #subnav div.subnav1 a {color:#000; font-size:11px;} #subnav div.subnav1 a.aktiv {color:#9f9f9f;} #subnav div.subnav div.subnav1 {display:none} #subnav div.aktiv div.subnav1 {display:block} #inhalt {margin-top:0px;} #innerinhalt {height:auto; margin-top:0px;} #innerinhalt p {} #innerinhalt div {} #innerinhalt ul, #inhalt ol {margin-left:15px; margin-bottom:15px} #innerinhalt a {text-decoration:underline; color:#000} #innerinhalt a:hover {text-decoration:none; color:#9f9f9f} /*#innerinhalt a:hover {text-decoration:underline;}*/ #innerinhalt ul li {margin-left:0px;} #innerinhalt ul ul {margin-top:10px; margin-bottom:10px} #innerinhalt ul li ul {margin-left:30px;} #start {margin-top: 100px; min-height: 550px; background-color: var(--vhm-grey-bg); position: relative} #startseiteOuter {width: 1300px; max-width: 100%; margin:0px auto; padding-top: 50px; z-index:99; position: relative;display: flex;flex-direction: column;align-items: baseline;} #startseiteOuter h1.start {} #startseiteOuter .subline_start {font: 500 28px/34px var(--vhm-font); margin-top: 22px;} .startseiteInner {width: 1300px; padding: 0px 70px; max-width: 100%; margin: 0px auto} @media (max-width:1024px) {.startseiteInner {margin-bottom: 30px; padding: 0px}} .startseiteInner .button {display: inline-flex} .button {height: 45px; display: inline-flex; justify-content: center; align-items: center; border-radius: 55px; cursor: pointer; padding: 0 40px; font: normal 16px/22px var(--vhm-font);} button {font: normal 16px/22px var(--vhm-font); border: 0px} a.button {text-decoration: none !important} .button.buttonLightFull, .button.buttonLightLine:hover {background-color: var(--vhm-white); border: 2px solid var(--vhm-white);} .button.buttonLightLine, .button.buttonLightFull:hover {border: 2px solid var(--vhm-white); background-color:transparent;} .button.buttonDarkFull, .button.buttonDarkLine:hover {background-color: var(--vhm-grey-bg); border: 2px solid var(--vhm-grey-bg); } .button.buttonDarkLine, .button.buttonDarkFull:hover {border: 2px solid var(--vhm-grey-bg);background-color:transparent;} button.buttonLightLine[type=submit], button.buttonbuttonLightFull[type=submit], button.buttonDarkLine[type=submit] {text-transform: none} .pillSmallGold {width: 15px; height: 5px; border-radius: 16px; background-color: var(--vhm-gold)} .pillBigWhite {width: 390px; height: 80px; border-radius: 50px; background-color: var(--vhm-white);} .pillsOuter {position: absolute; height: 100%; width: 100%; top: 0; left: 0; overflow: hidden} .floatPill {position: absolute} @keyframes rotating1 { from {transform: rotate(-40deg);} to {transform: rotate(-50deg);} } @keyframes rotating2 { from {transform: rotate(-30deg);} to {transform: rotate(-17deg);} } @keyframes rotating3 { from {transform: rotate(100deg);} to {transform: rotate(118deg);} } @keyframes rotating4 { from {transform: rotate(40deg);} to {transform: rotate(53deg);} } @keyframes rotating5 { from {transform: rotate(-80deg);} to {transform: rotate(-90deg);} } /* .floatPill:nth-of-type(1) {top: 130px; left:-140px; animation: rotating1 7.5s linear infinite alternate} .floatPill:nth-of-type(2) {top: -40px; right: 30%; animation: rotating2 6.7s linear infinite alternate; display: none} .floatPill:nth-of-type(3) {bottom: 160px; right: 110px; animation: rotating4 7.1s linear infinite alternate} .floatPill:nth-of-type(4) {bottom: 100px; left: 45%; animation: rotating5 7.3s linear infinite alternate} */ .floatPill:nth-of-type(2) {display: none} .pillsOuter1 .floatPill:nth-of-type(1) { top: 130px; left: -140px; transform: rotate(30deg); } .pillsOuter1 .floatPill:nth-of-type(3) { bottom: 225px; right: -148px; transform: rotate(-35deg); } .pillsOuter1 .floatPill:nth-of-type(4) { bottom: -20px; left: 45%; transform: rotate(30deg); } .pillsOuter2 .floatPill:nth-of-type(1) { top: 130px; left: -140px; transform: rotate(30deg); display: none; } .pillsOuter2 .floatPill:nth-of-type(3) { bottom: 225px; right: -148px; transform: rotate(-17deg); } .pillsOuter2 .floatPill:nth-of-type(4) { bottom: 170px; left: 60%; transform: rotate(55deg); } .pillsOuter3 .floatPill:nth-of-type(1) { top: 130px; left: -140px; transform: rotate(30deg); } .pillsOuter3 .floatPill:nth-of-type(3) { bottom: 312px; right: -148px; transform: rotate(-10deg); } .pillsOuter3 .floatPill:nth-of-type(4) { bottom: 23px; left: 60%; transform: rotate(33deg); } .pillsOuter4 .floatPill:nth-of-type(1) { top: 200px; left: -220px; transform: rotate(-60deg); } .pillsOuter4 .floatPill:nth-of-type(3) { bottom: 220px; right: -110px; transform: rotate(-50deg); } .pillsOuter4 .floatPill:nth-of-type(4) { bottom: 20px; left: 60%; transform: rotate(33deg); } .pillsOuter5 .floatPill:nth-of-type(1) { top: 10px; left: -265px; transform: rotate(15deg); } .pillsOuter5 .floatPill:nth-of-type(3) { bottom: 220px; right: -110px; transform: rotate(25deg); } .pillsOuter5 .floatPill:nth-of-type(4) { bottom: -60px; left: 60%; transform: rotate(-50deg); } .pillsOuter6 .floatPill:nth-of-type(1) { top: 215px; left: -180px; transform: rotate(-25deg); } .pillsOuter6 .floatPill:nth-of-type(3) { bottom: 310px; right: -150px; transform: rotate(-10deg); } .pillsOuter6 .floatPill:nth-of-type(4) { bottom: -40px; left: 60%; transform: rotate(35deg); } .pillsOuter7 .floatPill:nth-of-type(1) { top: 215px; left: -180px; transform: rotate(30deg); } .pillsOuter7 .floatPill:nth-of-type(3) { bottom: 220px; right: -240px; transform: rotate(25deg); } .pillsOuter7 .floatPill:nth-of-type(4) { bottom: -40px; left: 60%; transform: rotate(150deg); } #start .startImage {position: absolute; right:0%; display: flex; align-items: flex-end; height: 450px} #start #video1 {object-fit: contain;width: 100%; height: 100%} #start .startImage img {height: 100%;} @media (max-width:1800px) {#start .startImage img {height: auto; width: 100%}} @media (max-width:1800px) {#start .startImage {width: calc(100% - 600px); height: auto} } .content img {max-width:100%} .content.layout_1 img {width: 100%; height: 100%; object-fit: cover} .content.layout_2 img {width: 100%} /*.hauptbild img {width: 100%} */ .xs, .normal {color:#444; line-height: 19px;} .clearer {clear:both} .content_einleitung .flex .button {margin-right: 40px; margin-top: 40px} .content_einleitung .flex .button {width:auto; min-width: 240px; padding: 0 40px} #adresse {width:100%; max-width:100%; height:auto; box-sizing:border-box; text-align:left; position:relative; margin:0px auto; padding-top:10px;} body.bg_0 #wrap, body.bg_0 #adresse {background-color: var(--vhm-white-bg2); color:var(--vhm-black)} body.bg_1 #wrap, body.bg_1 #adresse {background-color: var(--vhm-grey-bg); color:var(--vhm-black)} body.bg_2 #wrap, body.bg_2 #adresse {background-color: var(--vhm-grey-light); color:var(--vhm-black) } body.bg_3 #wrap, body.bg_3 #adresse {background-color: var(--vhm-black); color:var(--vhm-white)} #adresseInnen {width: 1300px; max-width: 100%; margin: 0px auto; padding:20px 16px; border-top: 1px solid var(--vhm-grey-text)} #adresseInnen .adresseUnten {display: flex; justify-content: space-between; padding: 5px; font: normal 10px/12px var(--vhm-font);} #adresseInnen .adresseUnten .left {display: flex;flex-direction: row;height: auto;justify-content: space-between;} #adresseInnen .adresseUnten .left .footerNav ul {height: 100%; display: flex; align-items: flex-end} #adresseInnen .adresseUnten .left .footerNav ul li {list-style-type: none; margin-right: 20px} #adresseInnen .adresseUnten .left .footerNav ul li a:hover{text-decoration: underline} #adresseInnen .adresseUnten .left .footerNav ul li a.aktiv {font-weight: bold} #adresseInnen .adresseUnten .location {display: flex; min-width: 200px; max-width: 100%} #adresseInnen .adresseUnten .officeName {font-weight: 500;} #adresseInnen .adresseUnten .right {display: flex; flex-direction: row; justify-content: space-between} #adresseInnen .adresseUnten .right .rightOben {font-weight: 700; margin-bottom: 10px; margin-right: 100px} #adresseInnen .lastLine {display: flex; justify-content: space-between; margin-top: 80px; } #adresseInnen .lastLine .credit {font: normal 12px/25px var(--vhm-font);} #adresseInnen .linkedin {padding-left: 37px;background-image: url("/UserFiles/structure/svg/linkedin_white.svg");height: 25px;background-size: contain;background-repeat: no-repeat;background-position-y: center;display: flex;align-items: center;} #adresseInnen .linkedin a {color:var(--vhm-white); text-decoration: none} #printbutton {background-image:url(/UserFiles/structure/print.png); background-repeat:no-repeat; width:36px; height:30px; margin-top:7px; cursor:pointer;} .errorPage {margin: 150px 0} .errorPage .contentInnen {padding: 70px;padding-bottom: 240px} .errorPage .contentInnen .errorText {font-weight: bold; font-size: 26px; line-height: 32px; max-width: 500px} .errorPage h1 {max-width: 500px; margin-bottom: 50px} .errorPage .pillXLarge {width: 40%; aspect-ratio: 6 ; background: var(--vhm-white); border-radius: 100px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) rotate(45deg); z-index: -1} .errorPage .pillXLarge:nth-of-type(2) {transform: translate(-50%,-50%) rotate(135deg); } #search {width:930px; text-align:right; float:left; position:absolute; top:10px;} #searchresult {padding-bottom:40px;} #searchresult ul li {margin-bottom:10px;} #searchsite {margin-top:-12px;} #searchbutton {background-image:url(/UserFiles/structure/searchlupe.png); background-repeat:no-repeat; height:20px; width:20px; background-color:#FFF; border:0px; margin-top:10px} #suchbegriff{margin-left:1px;background-color:#d9d9d9; width:130px; height:15px; border:0px;} #langChange {width:50px; text-align:right; float:right; margin-top:8px; font-size:10px; position:absolute; top:-2px; right:0px; padding-right:20px} #created {position:absolute; top:225px; opacity:0.5; left:0px; z-index:1; background-color:#000; width:900px; border:1px solid #999; border-radius:5px; display:none; padding:30px;} #created a {text-decoration:underline;} #createdcloser {position:absolute; top:-15px; left:980px; background-image:url(/UserFiles/structure/close.png); width:30px; height:30px; text-indent:-10000px; cursor:pointer; display:none} .partleft {width:900px; float:left; box-sizing:border-box; padding-right:20px} .partright {width:315px; float:left; box-sizing:border-box; padding-left:20px; padding-top:180px} /* Navigation ----------------------------- */ /* empty.png in menu, damit der hover - effekt nicht rüttelt */ .menu{display: flex; align-items: baseline; text-align:left; position:relative; font: 400 16px/30px var(--vhm-font); letter-spacing: 0px;color: var(--vhm-black); text-transform: uppercase} .menu a {color:var(--vhm-black); text-decoration:none; letter-spacing:0em} .menu ul {display: flex;} .menu ul li {list-style-type:none; width:auto; text-align:center; display:block; height:25px; position:relative; z-index:99; margin-right:25px} .menu ul li.last {border-right:0px} a.subaktiv, a.subinaktiv:hover {color:var(--vhm-gold) !important} .menu ul li a { height:auto; border:1px solid transparent; display:block; background-color:transparent; color:var(--vhm-black); position: relative; z-index: 20; font-weight: 400} .menu ul li a.aktiv {} .menu ul li a.aktiv:hover {} .menu ul li a.inaktiv:hover {} .menu ul li a:hover, .menu ul li a.inaktiv:hover {} .menu ul li:hover {} /*Hauptbutton*/ .menu ul li:hover a, .menu ul li a:hover {} /* Hover Link */ .menu ul li:hover div.subnavOuter{visibility:visible; color:var(--vhm-black); position:absolute; z-index:11000} .menu ul li:hover div.subnavOuter ul.subnav {position:relative; z-index:10000; float:left; padding-left:20px; padding-top:20px} .menu ul li:hover div.subnavOuter ul.subnav1 {position:relative; z-index:10000; float:left; padding-left:20px; padding-top:20px} .menu ul li:hover div.subnavOuter ul.subnav, .menu ul li:hover div.subnavOuter ul.subnav1 {visibility:visible} .menu ul li:hover div.subnavOuter ul.subnav li, .menu ul li:hover div.subnavOuter ul.subnav1 li {padding-left:0px;} .menu ul li ul.subnav li, .menu ul li ul.subnav1 li {margin-bottom:10px; font-size:1em;} .menu ul li ul.subnav li a, .menu ul li ul.subnav1 li a { } .menu ul li ul.subnav li a, .menu ul li ul.subnav1 li a { } .menu ul li ul.subnav li a:hover, .menu ul li ul.subnav1 li a:hover { color:var(--vhm-black);} .menu ul li ul.subnav, .menu ul li ul.subnav1 {} .menu ul li[data-modul="karriere"] {} .menu ul li[data-modul="karriere"] a {color: var(--vhm-orange-highlight);} /* Pillen auf hover */ /*.menu ul li::before {content: ""; width: 67px; height: 15px; background-color: var(--vhm-grey-text); border-radius: 8px; position: absolute; z-index: 10; left: 50%; top: 50%; opacity: 0; transition: opacity 0.5s}*/ .menu ul li::before {content: ""; width: 47px; height: 10px; background-color: var(--vhm-grey-text); border-radius: 8px; position: absolute; z-index: 10; left: 50%; top: 60%; opacity: 0; transition: opacity 0.5s} .bg_1 .menu ul li::before {background-color: var(--vhm-white);} .menu ul li:hover::before {background-color: var(--vhm-orange-highlight);} .menu ul li:nth-child(1)::before {transform: translate(-50%, -50%) rotate(65deg);} .menu ul li:nth-child(2)::before {transform: translate(-50%, -50%) rotate(115deg);} .menu ul li:nth-child(3)::before {transform: translate(-50%, -50%) rotate(65deg);} .menu ul li:nth-child(4)::before {transform: translate(-50%, -50%) rotate(115deg);} .menu ul li:hover::before, .menu ul li.aktiv::before {opacity: 1} .menu ul li[data-modul="karriere"]::before {background-color: var(--vhm-grey-text); transform: translate(-50%, -50%) rotate(115deg);} /*Submenu */ .menu ul li div.subnavOuter { margin-left:-4px; top:25px; background-color:#fff; -webkit-box-shadow: 7px 9px 6px -10px rgba(0,0,0,0.75); -moz-box-shadow: 7px 9px 6px -10px rgba(0,0,0,0.75); box-shadow: 7px 9px 6px -10px rgba(0,0,0,0.75); padding-bottom:20px; padding-top:20px } .menu ul li div.subnavOuter {visibility:hidden; position:absolute; left:150px; top:24px; background-color:#FFF} .menu ul li div.subnavOuter {visibility:hidden; position:absolute;} .menu ul li div.subnavOuter {visibility:hidden; position:absolute; background-color:#fff; z-index:101} .menu ul li ul.aktiv li { } .menu ul li ul.aktiv li a.subaktiv {color:#524b3b;} .menu ul li ul li {background-color:#fff; clear:both; border-bottom:1px solid #fff; min-width:220px; max-width:200px; overflow:hidden; text-align:left; padding-left:4px; } .menu ul li ul li.noborder {background-color:#fff} .menu ul li:hover ul li a, .menu ul li a:hover ul li a {display:block; position:relative; z-index:100;} /* Links im Submen+ */ .menu ul li:hover ul li a:hover, .menu ul li a:hover ul li a:hover {} .menu ul li:hover ul li a.aktiv:hover{color:#B5162E;} .menu ul li:hover ul li:hover ul, .menu ul li a:hover ul li a:hover ul {visibility:visible;} .menu ul li:hover ul.right {float:right} .menu ul li:hover ul.right li {float:left;} .menu ul li:hover div.subnavOuter ul.subnav1.right {float:right} .menu ul li:hover div.subnavOuter ul.subnav1.right li {float:left} .menu .langChange {display: flex; color: var(--vhm-black); align-items: baseline; margin-left: 90px} .menu .langChange a {padding: 0 5px; position: relative; margin-top: 5px; color: var(--vhm-black);} .menu .langChange a:hover, .menu .langChange a.aktiv {color: var(--vhm-gold)} .navLayer {position: fixed;z-index: 999;background: var(--vhm-grey-bg-light);width: 100%;top: 100px; display: none} body.sticky .navLayer {top: 50px} .navLayerInner {width: 100%; display: flex} .navLayerInner .navLayerLeft {width: 45%;background-color: var(--vhm-grey-bg-light);} .navLayerInner .subNavOuter {width: 55%} .navLayerInner .subNavOuter .subNav {display: flex; flex-direction: column;align-items: flex-end; padding: 45px 0} .navLayerInner .subNavOuter .subNav.columns {display: flex; flex-direction: row;justify-content: flex-end; align-items: baseline; padding: 45px 0} .navLayerInner .subNavOuter .subNav a {padding: 0} .navLayerInner .subNavOuter .subNav a:first-of-type {padding-top: 0} .navLayerInner .subNavOuter .subNav a:last-of-type {padding-bottom: 0} #navLayer_expertise .navLayerLeft {display:none} #navLayer_expertise .subNavOuter {width:100%; background-color: var(--vhm-grey-bg-light)} .subnavblock {display: flex;flex-direction: column;margin-right: 150px; align-items: flex-end} .subnavblock:last-of-type {margin-right: 0px;} .subnavblock .subnavHeadline, .subnavHeadline {font: normal 13px/22px var(--vhm-font); letter-spacing: 2px; color: var(--vhm-gold); margin-bottom: 15px; text-transform: uppercase} #teaserrechts {float:left; width:215px; margin-left:10px; margin-top:10px; padding-left:15px; padding-top:25px; position:absolute; top:260px; left:795px} .stripesAnimate {width: 112px;} .stripesAnimate img {width: 100%; } #choose {float:left; width:158px; margin-top:5px; font-size:14px} #choosebuttons > a {display:block; width:20px; height:20px; background-color:#aacaec; color:#FFFFFF; float:left; font-style:normal; margin-left:2px; padding:2px; border:1px solid #aacaec;} #choosebuttons > a.langaktiv {background-color:transparent; border:1px solid #ddd; color:#000000} #choosebuttons > a:hover {background-color:transparent; border:1px solid #ddd; color:#000000} .officesOuter {display: flex;align-items: center;height: 100%;justify-content: space-evenly;} .officesOuter .office {width: 350px;height: 220px;display: flex;align-items: center;justify-content: center;background-position: center; background-size: cover} .publications {margin-left: 45px;margin-top: 30px; margin-bottom: 70px} .publications .publication {height: 80px;display: flex;align-items: start;max-width: 660px;justify-content: space-between;} .publications .publication .pubImg {max-width: 60px;} .publications .publication .pubText {width: 574px; margin-bottom: 0; display: flex; align-items: baseline} .publications .navHeadline {font: normal 13px/22px var(--vhm-font);} .publications.navPublication {font: normal 17px/24px var(--vhm-font);} .press {display: flex;flex-direction: column;} .press .pressTop {margin-bottom: 30px;display: flex} .press .pressTop .spacerLine {margin:0 30px;} .press .pressTop .subjects {display: flex; line-height: 30px; color: var(--vhm-grey-text)} .press .pressTop .subjects a.subjectSmall {margin-right: 30px; text-decoration: underline; color: var(--vhm-grey-text)} .press .pressBody {display: flex;} .press .pressBody .pressLeft {margin-right: 90px;display: flex;flex-direction: column;} .press .pressBody .pressLeft .pressImg {width: 500px;height: 270px;overflow: hidden;margin-bottom: 60px;} .press .pressBody .pressLeft .expert {display: flex;height: 75px;margin-top: 25px;} .press .pressBody .pressLeft .expert a {color: var(--vhm-grey-text)} .press .pressBody .pressLeft .expert {display: flex;height: 75px;margin-top: 25px;color: var(--vhm-grey-text)} .press .pressBody .pressLeft .expert img {border-radius: 104px;width: 75px;object-fit: cover;margin-right: 30px;} .press .pressBody .pressRight .links {display: flex;} #teaserganz{margin-left:-10px; margin-top:-20px;} #teaserganz div {margin-bottom:0px} .teaserbild img {width:340px; margin-right:20px; float:left} .teaserbild_rechts img {width:205px; margin-right:20px; margin-bottom:5px} .teaserheadline_rechts {font-weight:bold; font-size:17px; margin-bottom:5px} .teasertext {float:right; width:215px; height:auto; margin-left:10px; padding-bottom:10px; margin-bottom:20px} .teasertext a {width:100%; text-align:right; font-style:italic} .teasertext a {text-decoration:underline} .teasertext a:hover {text-decoration:none;} .sonderthema {font-size:20px; margin-bottom:10px} .banner {background-color:#a9caed; color:#FFF; margin-top:10px; text-align:right; padding-right:15px; padding-top:5px; min-height:25px } .banner .bannerbild {width:205px; margin-bottom:0px; margin-left:5px} #banneranimiert {background-color:#a9caed; color:#FFF; margin-top:10px; text-align:right; padding-right:15px; padding-top:5px; min-height:25px } .banneranimiertpartner {width:205px; margin-bottom:0px; margin-left:5px; text-align:center} .teaserheadline {color:#80696f; font-weight:normal; margin:0px; padding:0px} .teaserheadlineLinie {color:#80696f; font-weight:bold; margin:0px; padding:0px; border-bottom:1px solid #808080; padding-bottom:10px; width:auto; } .teaser_0 {clear:both; width:215px;} .slickGallery img.slick-slide {height:500px; object-fit: contain; object-position: top} .slickThumbGallery {margin-top: 50px} .slickThumbGallery img.slick-slide {height:100px; object-fit: cover; object-position: top; margin: 0 20px; cursor: pointer} .abstandoben20 {height:20px; width:100%} .bold {font-weight:bold;} .teaserstartseite {border-top:1px solid #ddd; padding:0px; padding-top:10px; height:140px; overflow:hidden; margin-top:-10px; width:48%; float:left; margin-right:1%} .teaserstartseiteheadline {font-size:16px; font-weight:bold;} .teaserstartseitebild {width:170px; float:left } .teaserstartseitebild img {max-width:150px; } .teaserstartseitetext p {margin:0px; padding:0px; line-height:18px} .teaserstartseitetext a {font-style:italic; font-size:16px; color:#808080; line-height:22px} .teaserstartseitetext a:hover {text-decoration:none} .teaserstartseitetext span.link {font-style:italic; font-size:16px; color:#808080; font-weight:normal} /* klassen ------------------- */ p.partner {margin-top:10px; margin-bottom:20px; margin-left:0px; padding:0px} p.abstandpartner {margin-top:20px} td.tdpartner {vertical-align:bottom; padding-left:20px;} div.partnerdiv ul {margin-top:0px} p.partner > p {margin:0px; padding:0px} .partnertdkontakt {vertical-align:bottom} .partnertdbild {padding-left:20px; padding-top:20px} .partnertdkontakt {width:300px} .partnerbild {float:right; position:relative; top:-5px; max-height:200px} .partnertable {margin-bottom:-60px; top:-80px; position:relative;} .partnertable p {margin:0px; padding:0px} ul.nobullet {list-style-type:none;} ul.nobullet li {font-size:12px} #innerinhalt .downloadsBullet ul.nobullet {margin-left:0px} .downloadsBullet{margin-left:0px} #partnerUebersicht{} .partnerdivbig {width:595px; height:485px; overflow:hidden; margin-right:35px; margin-bottom:35px} .partnerdivsmall {width:280px; height:225px; overflow:hidden; margin-right:35px; margin-bottom:35px} .partnerdivsmall img, .partnerdivbig img {width:100%; height:auto} .img__description_layer { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(145, 145, 145, 0.6); color: #000; visibility: hidden; opacity: 0; /* transition effect. not necessary */ transition: opacity .2s, visibility .2s; } .img__description { transition: .2s; transform: translateY(1em); } .partnerdivsmall .img__description_layer { padding-left:20px; padding-top:80px; font-family: 'UniversUltraLight', sans-serif; font-size:40px; line-height:50px; } .partnerdivbig .img__description_layer { padding-left:30px; padding-top:180px; padding-right:50px; font-family: 'UniversUltraLight', sans-serif; font-size:70px; line-height:70px; } .partnerdivsmall:hover .img__description, .partnerdivbig:hover .img__description { transform: translateY(0); } .partnerdivsmall img, .partnerdivbig img { -webkit-filter: grayscale(0); filter: none; } .partnerdivsmall:hover .img__description_layer, .partnerdivbig:hover .img__description_layer { visibility: visible; opacity: 1; } /* grayscale on hover */ .partnerdivsmall:hover img, .partnerdivbig:hover img { filter: gray; /* IE6-9 */ -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */ filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */ opacity:0.6; } .partnerdiv .left, .partnerdiv .right {width:50%; box-sizing:border-box;} .partnerdiv .left {padding-right:30px; width:calc(50% - 50px)} .partnerdiv h1 {margin-bottom:20px} .partnerbilddiv {margin-bottom:20px; margin-top:7px} .tac {text-align: center} .mb5px {margin-bottom:5px} .mb10px {margin-bottom:10px} .mt10px {margin-top:10px} .mt20 {margin-top:20px} .mt30 {margin-top:30px} .mt40 {margin-top:40px} .mt50 {margin-top:50px} .mt60 {margin-top:60px} .mt70 {margin-top:70px} .mt80 {margin-top:80px} .mt90 {margin-top:90px} .mb10 {margin-bottom:10px} .mb20 {margin-bottom:20px} .mb30 {margin-bottom:30px} .mb40 {margin-bottom:40px} .mb50 {margin-bottom:50px} .mb60 {margin-bottom:60px} .mb70 {margin-bottom:70px} .mb80 {margin-bottom:80px} .mb90 {margin-bottom:90px} .mr40 {margin-right: 40px} .bt {border-top:1px solid #333; padding-top:5px} .bb {border-bottom:1px solid #333; padding-bottom:10px; padding-top:10px} .nbb {border-bottom:0px solid #333; padding-bottom:10px; padding-top:10px} .nozoom {border:0px} a.higslide img {border:0px} .symDown {background-image:url(/UserFiles/structure/symbol_downloads.png); width:20px; height:26px; margin-bottom:10px; margin-top:10px} .symLink {background-image:url(/UserFiles/structure/symbol_linkliste.png); width:22px; height:20px; margin-bottom:10px; margin-top:10px} .bildbeschreibung {display:block; position:relative; top:0px; left:0px; background:rgba(204,204,204,0.8); overflow:hidden; z-index:99999; display:block; font-size:12px} .bildbeschreibungInner {width:96%; height:96%; padding:10px; display:block; color:#000} .w100 {width: 100%} .downloads .linkhead, .linkliste .linkhead {font-size:12px; font-weight:bold; padding-bottom:10px; border-bottom:1px solid #333; margin-bottom:10px} #innerinhalt .linkliste ul.nobullet, #innerinhalt .downloads ul.nobullet {list-style-type: none; margin-left:0px; border-bottom:1px solid #333; padding-bottom:10px; margin-bottom:10px} #innerinhalt .linkliste ul.nobullet li, #innerinhalt .downloads ul.nobullet li {margin-left:0px} #innerinhalt .partnerdiv ul, #inhalt .partnerdiv ol {margin-bottom: 0px;} #backgroundCubes.team, #backgroundCubes.s_team {display:none} /* Formularfelder ---------------- */ .covid19link {font-weight:bold; font-size:1.3em;} input, select, textarea {background-color:transparent; border:1px solid #000; margin-bottom:3px; height:25px; color:#000; padding-left:10px; padding-right:10px} .anabmelden {float:left; margin-right:10px; border:0px } #zustimmung {width:30px; height:30px} #newslettersubmit {width:162px; text-align:center} #password {width:123px; margin-top:5px; color:#87888a; font:100% Helvetica, Arial, sans-serif; padding-left:3px} #comments {height:70px; overflow:auto; color:#87888a; font:100% Helvetica, Arial, sans-serif; padding-left:3px; padding-top:3px; width:262px} #Senden {padding-left:20px; padding-top:3px; padding-bottom:3px; cursor:pointer; width:267px; float:left; color:#87888a; position:relative; z-index:100000} #anrede {width:150px;} img {border:0px;} .highslide > img{border:10px solid #F00;} .image {border:0px} .rot {color:#80696f} .emailcodierung{color:#000} .emailcodierung > a{color:#000} a {outline:none; text-decoration:none; color:var(--vhm-black);} #anfrageform {display:none;} .anfrageformulartable {border:0px; padding:0px; margin:0px; width:100%;} .anfrageformulartable .noborder {border:0px;} .anfrageformulartable button {width:150px; height:30px; text-align:center} #inhalt a {color:#000; text-decoration:none} #inhalt a:hover {color:#9f9f9f} #navMobile {display:none} #logoMobile {display:none} #langChangeMobile {display:none} .newsdiv { clear:both; margin-bottom:50px} .news_bild {height:120px; margin-top: 15px} .news_bild .imgBorder {height: 100%} .news_bild img {max-width:100%; padding: 0px} .news_text {float: left;display: inline-block;position: relative;} #recent-awards .news_bild .imgBorder {border: 0px !important; height: 100%; } #recent-awards .news_bild .imgBorder img {height: 100%; width: auto !important} body.practical-pointers.desktop .news_bild {float:right !important} body.practical-pointers.desktop .news_text {width:600px !important} .news_bild_startseite {width:90px; white-space:nowrap; float:left} .newsdiv .content_startseite {display: inline-block; width:700px; white-space:normal; float:right} .news_bild_startseite img {max-width:75px} .contentInnen ul.grid.newsGrid li.item {margin-bottom: 100px} .contentInnen ul li .newscontent.itemdiv, .contentInnen ul li .opinionsdiv {line-height: 22px !important; border: 1px solid var(--vhm-black)} .newscontent.itemdiv .text {padding: 16px} .newscontent.itemdiv .image { width: 100%; max-height: 300px; padding: 0px 10px; margin-bottom: 10px;} .newscontent.itemdiv .image img {height:auto; width: 100%; max-height: 250px; object-fit: contain} .newscontent.itemdiv .datum {font-size: 22px; line-height: 26px; } .newscontent.itemdiv h4 {margin-bottom: 20px} .awards_opinions{ display: -webkit-flex; display: -ms-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .awards_opinions h2 {font-size:20px} .awards{ width:100%; box-sizing:border-box; display: grid; grid-template-columns: repeat(3,1fr) } .awards .awardcontent { width: 100%; justify-content: space-between; height: min-content} .awards .awardsright{width: 100%;} .awards .awardsdiv {box-sizing:border-box; padding-bottom:40px; width: 100%; padding-bottom: 70px; border: 1px solid var(--vhm-black); padding: 15px;} .awards .datum {font: 400 22px/26px var(--vhm-font); color:var(--vhm-black);} .awards .awardcontent ul li {margin-top: 10px; display: block} .awards .awardcontent ul li a strong {color: var(--vhm-black); text-decoration: underline; font-weight: normal} .opinions {width:100%;box-sizing:border-box; text-align: left; padding-top: 50px} /* .opinions ul {display: grid;justify-content: space-around;grid-template-columns: repeat(auto-fill,350px);row-gap: 160px;}*/ .opinions .opinionsdiv {display:block; clear:both; width:100%; padding-bottom:20px;} .opinions .opinionsdiv h2 {padding-top:20px} .opinions .opinionscontent strong {color: var(--vhm-grey-text)} .opinions ul.grid li.bigger {} .newsdiv div.content {width:800px; max-width:100%; display:inline-block; float:left; margin-right:50px; box-sizing:border-box; border-bottom:1px solid #333; padding-bottom:50px} .divarchiv {margin-bottom:50px} .auszeichnungen_headline {font-weight:bold; margin-bottom:20px; font-size:1.2em} .subheadline {font-weight:bold; margin-bottom:10px} #opinions .grid .item:nth-child(n+7) {display: none} #opinions .grid .item .pillBig.white.absolute{transform: rotate(168deg); height: 20px; width: 60px; position: relative; margin: 0px auto} #opinions .grid .item:nth-child(2n) .pillBig.white.absolute{transform: rotate(30deg)} .pillBigOuter{display: flex; align-items: center; text-align: center; position: relative; height: 70px} .grid { display: grid; row-gap: 10px; column-gap: 20px; grid-template-columns: repeat(auto-fill, minmax(350px,1fr)); grid-auto-rows: 20px; justify-content: space-between; } .newsGrid.grid {column-gap: 30px;} .gridItemsOuter {display: grid; row-gap: 10px; column-gap: 20px; grid-template-columns: repeat(auto-fill, minmax(300px,1fr)); grid-auto-rows: 1px; justify-content: space-between;} /* .publicationsOuter {display: grid;justify-content: space-around;grid-template-columns: repeat(3,1fr);width: 100%;margin: 0px auto;column-gap: 40px;row-gap: 60px;max-width: 100%;} */ .publicationsOuter .publication {display: block;flex-direction: row;max-width: 550px;justify-content: space-between; border: 1px solid var(--vhm-black); overflow: hidden} .publicationsOuter .publication .pubTextBlock {padding: 16px} .publicationsOuter .publication .publicationLeft {display: flex;justify-content: flex-start;width: 15%} .publicationsOuter .publication .publicationLeft .pubImg {max-width: 100%;} .publicationsOuter .publication .publicationLeft .pubImg img {width: 100%; aspect-ratio: 1;object-fit: cover; object-position: center; border-radius: 100px;} .publicationsOuter .publication .publicationBody {} .publicationsOuter .publication .publicationBody .date {font: 400 22px/26px var(--vhm-font)} .publicationsOuter .publication .publicationBody .button {padding: 0} .publicationsOuter .publication .publicationBody .pubHeadline {font: 600 22px/26px var(--vhm-font)} .publicationsOuter .publication .publicationBody .pubHeadline .light {color: var(--vhm-grey-text)} .publicationsOuter .publication .publicationBody .pubTopRight .h5like {margin-top: 40px; margin-right: 10px} .publicationsOuter .publication .publicationBody .pubTopRight .h5like:nth-of-type(1) {margin-top: 0px;} .publicationsOuter .publication .publicationBody .pubText {margin-top: 30px;} .publicationsOuter .publication .publicationBody .pubTopRight .autoren, .publicationsOuter .publication .publicationBody .pubTopRight .subjects {display: flex} a.autor, a.subject {text-decoration: underline; display: flex} a.autor::after, a.subject::after {position: relative; display: block; content: ", "; margin-right: 5px} a.autor:last-child::after, a.subject:last-child::after {position: relative; display: none; content: ""} input.hiddenCheckbox[type=checkbox] {display: none} input.hiddenCheckbox[type=checkbox] + label { vertical-align:middle; width: 20px; height: 20px; display: inline-block; margin-right: 12px; margin-top: -7px; cursor: pointer; background-color: var(--vhm-white); } input.hiddenCheckbox[type=checkbox]:checked + label { background-color: var(--vhm-gold); } .newsletter {margin: 0px auto; display: flex} .newsletter .left{ width: 400px; margin-right: 180px; flex-shrink: 0} .newsletter .right {} .newsletter .form .input {width: calc(100% - 240px); padding-right: 20px} .newsletter .form .input input {width: 100%; border:0px; border-bottom: 2px solid var(--vhm-white); height: 65px} .newsletter button.button {border: 0px} /* Suche Teammember */ .searchTeamMember {flex-wrap: wrap; margin-bottom: 35px} .searchTeamMember .button {margin: 15px} .searchTeamMember select {width: 250px; max-width: 100%} .searchTeamMemberForm {width: 700px; max-width: 100%; margin: 0px auto; text-align: center} .searchTeamMemberForm .form.flex {justify-content: center} .searchTeamMemberForm .form.flex .input {width: calc(100% - 240px); padding-right: 20px} .searchTeamMemberForm .form.flex .input input {width: 100%; border:0px; border-bottom: 2px solid var(--vhm-grey-bg); height: 65px} .searchTeamMemberForm .form.flex .input input.lineBottomGrey {border-bottom: 2px solid var(--vhm-grey-bg);} .searchTeamMemberForm button.button {background-color: transparent} span.kompetenzEdit, span.titleEdit {margin: 0 10px;position: relative; display: inline-flex;} span.kompetenzEdit .name, span.titleEdit .name {border-bottom: 1px solid var(--vhm-black);} span.kompetenzEdit .delete, span.titleEdit .delete {position: relative;height: 24px;width: 15px;background: url("/UserFiles/structure/svg/close.svg");background-size: contain;background-position-y: top;background-repeat: no-repeat;margin-left: 10px;cursor: pointer} .button.searchTeamMemberSelect, .button.searchTeamMemberSelect:hover {background-color: var(--vhm-grey-bg); border: none; padding: 0 20px} .button.searchByTitleSelect, .button.searchByTitleSelect:hover {background-color: transparent; padding: 0 20px} .content_startseite {font-weight:bold; font-size:13px} #content ul li ul { margin: 0; margin-left:20px; } #content ul li ul { list-style-type: none; } #content ul li ul > li { display: table-row; } #content ul li ul > li:before { content: "-"; display:table-cell; padding-right:0.3em; text-align:right; } #navMobileMenu {display:none} .partnerbilddiv img {max-width:100%} .partnertextEmpty .right {margin-bottom:30px} .corona-info {padding-top:20px; padding-bottom:20px; text-align:justify; font-weight:bold} /* Formularfelder ---------------- */ .formular {width:1000px; max-width:100%; margin-top:50px} .zeile {margin-bottom:10px} .zeile .links {width:400px; float:left;} .zeile .rechts {width: calc(100% - 400px); max-width:100%; float:left} .zeile .rechts img {max-width:100%} input, select, textarea, checkbox{} button#absenden {color:#FFF !important; font-size:20px; padding-top:5px } input#datenok, input#newsletter {width:50px; float:left; height:30px} .formular {padding-bottom:50px} .formular img{} .formular .inputfile { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; } .formular .inputfile + label { background-color: white; display: inline-block; border:1px solid #999; padding:10px; width:100%; border-radius:2px; } .formular .inputfile:focus + label, .formular .inputfile + label:hover { background-color: #bd8896; color:#FFF; } .formular .inputfile + label { cursor: pointer; /* "hand" cursor */ } .formular .inputfile:focus + label { outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px; } .formular .inputfile + label * { pointer-events: none; } .formular #fertig {color:#FFF; font-size:30px; padding-top:5px} .small {font-size:16px; float:left; width:calc(100% - 100px)} button{cursor:pointer} button:hover{} input#but_upload {padding-top:10px !important; background-color:rgba(52, 52, 52, 1); color:#FFF; font-size:20px; cursor:pointer} .selecter {font-family:Verdana, Geneva, sans-serif} .erklaerung {font-size:16px; font-style:italic} textarea{padding-top:10px; height:200px} input.drittel {width:200px} input.zweidrittel {width:calc(100% - 205px) !important} input.web {width:calc(100%) !important; float:left;} input:focus, textarea:focus, select:focus { box-shadow: 0 0 5px rgba(189, 136, 150, 1); border: 1px solid rgba(189, 136, 150, 1); } ::-webkit-input-placeholder { /* Edge */ font: normal 16px/22px var(--vhm-font); color: var(--vhm-gold); } :-ms-input-placeholder { /* Internet Explorer 10-11 */ font: normal 16px/22px var(--vhm-font); color: var(--vhm-gold); } ::placeholder { font: normal 16px/22px var(--vhm-font); color: var(--vhm-gold); } @media (max-width:1300px) { .content.layout_2 .contentInnen {padding: 0 16px} } @media (max-width:1024px) { * { margin:0px; padding:0px; box-sizing:border-box; } body {font-size:17px; letter-spacing: 0.17px; line-height: 29px} h1, .h1like {font-style: normal;font-weight: 500;font-size: 30px;line-height: 38px;letter-spacing: 0px;color: var(--vhm-black);} h2, .h2like, #startseiteOuter .subline_start {font-style: normal;font-weight: 500;font-size: 26px;line-height: 35px;letter-spacing: 0px;color: var(--vhm-black);} h3, .h3like {font-style: normal;font-weight: 500;font-size: 22px;line-height: 29px;letter-spacing: 0px;color: var(--vhm-black);} h4, .h4like {font-style: normal;font-weight: 500;font-size: 20px;line-height: 28px;letter-spacing: 0px;color: var(--vhm-black);} h5, .h5like {font-style: normal;font-weight: bold;font-size: 18px;line-height: 25px;letter-spacing: 1.54px;color: var(--vhm-black);text-transform: uppercase;} .h0 {font-style: normal;font-weight: bold;font-size: 34px;line-height: 40px;letter-spacing: 0;color: var(--vhm-black);} #startseiteOuter .subline_start {color: white} .corona-info {padding-left:15px; padding-right:15px} .pt_0{padding-top:0px !important;} .pt_1{padding-top:10px !important;} .pt_2{padding-top:20px !important;} .pt_3{padding-top:30px !important;} .pt_4{padding-top:50px !important;} .pt_5{padding-top:90px !important;} .pt_6{padding-top:120px !important;} .abstand.pt_0 {display: none} .pb_0{padding-bottom:0px !important;} .pb_1{padding-bottom:10px !important;} .pb_2{padding-bottom:20px !important;} .pb_3{padding-bottom:30px !important;} .pb_4{padding-bottom:50px !important;} .pb_5{padding-bottom:90px !important;} .pb_6{padding-bottom:120px !important;} /* Formularfelder ---------------- */ .zeile {margin-bottom:10px; font-size:1em; color:#444} .zeile .links {width:100%; float:none; clear:both;} .zeile .rechts {width:100%; float:none; clear:both} .zeile .rechts img {max-width:100%} .zeile .small, .erklaerung {font-size:1em !important} .formError {margin-left: -100px !important;} .button {height: 50px} .topNav {float: left;} .awards, .opinions, .partleft, .partright, .awardsdiv, .awards .awardsdiv {max-width:100%; padding:0px; width:100%; clear:both; display:block} .awards .awardsdiv {padding: 16px} #innerinhalt table tr td {width:100%; display:block; clear:both} #langChangeMobile {display:block; width:50px; text-align:right; float:right; margin-top:8px; font-size:10px; position:absolute; top:-20px; left:80%; z-index:999} #content {width:100%; z-index:100;text-align:left; position:relative; margin:0px auto; margin-top:5px; height:auto; padding-right:20px; min-height:1px } #balkenoben {display: flex; justify-content: space-between; align-items: center; padding: 10px 20px} #logolink {display: none} #logoMobile {display:block; width:130px;} #logo {width: 100%; height: 100%} #logoXL {display:none;position:relative; background-image:url(/UserFiles/structure/logo_vhm-law-842x400_ohne.png); background-size:800px 380px; background-repeat:no-repeat; text-indent:-10000px; width:800px; height:380px; z-index:2; margin-top:20px; margin-left:50px} #logoMobileSpan {display:block;position:relative; top:0px; left:0px; background-image:url(/UserFiles/structure/svg/logo_vhm.svg); background-repeat:no-repeat; text-indent:-10000px; width:169px; height:91px; z-index:2;} #topNav {padding-left: 0px;padding-right: 0px;} #tools_left {display:none} #subnav {display:none} #contentInnen, .contentInnen {min-height:inherit; width:100%; margin-top:10px;} #contentInnen, .contentInnen:first-of-type {margin-top:20px;} #contentInnen.start {min-height:0px; margin-top:0px; margin-left:0px} #inhalt {background-color:#FFFFFF; float:left; margin-top:0px; width:100%} #nav {display:none} #navMobileMenu {display:block;height: 100vh;position: fixed;width: 100%;z-index: 1000;background: var(--vhm-grey-bg);overflow-y:scroll; right: -100%; transition: 0.4s ease-in-out} #navMobileMenu.visible { right: 0%} #navMobile {display:block; width:40px; height:auto;} .mobileMenuTop {height: 100px; padding: 20px 30px; display: flex; align-items: center; justify-content: space-between; opacity: 0;transition: 0.5s ease-in-out; transition-delay: 0.2s } #navMobileMenu.visible .mobileMenuTop {opacity: 1} .mobileMenuTop .langChange {text-transform: uppercase} .mobileMenuTop .langChange a:first-of-type {margin-right: 10px} .mobileMenuTop .langChange a.aktiv {font-weight: bold} #navMobileOpener, #navMobileCloser {display:block;position:relative;cursor:pointer; padding-bottom:5px} #navMobileOpener .balken {width:27px; height:6px; border-radius: 100px; background-color:var(--vhm-black); margin-top:3px} #navMobileOpener .balken:nth-of-type(2) {transform: translateX(-3px); width: 15px} #navMobileCloser .balken {width:27px; height:4px; border-radius: 100px; background-color:var(--vhm-black); margin-top:3px; transform: rotate(45deg)} #navMobileCloser .balken:nth-of-type(2) {transform: rotate(-45deg) translate3d(5px, -5px, 0px);} .menuMobile{text-align:left; width:100%; font-size:15px; position:relative; margin-top:5px; float:left; padding: 0 30px; padding-top:10px; color:var(--vhm-black); z-index:10000; opacity: 0;transition: 0.5s ease-in-out; transition-delay: 0.2s} #navMobileMenu.visible .menuMobile {opacity: 1} .menuMobile > ul > li { color:var(--vhm-black); list-style:none; padding-top:20px; margin-right:10px; width: 100%; flex-wrap:wrap; text-transform: uppercase} .menuMobile > ul > li:first-child {padding-top:0px} .menuMobile > ul > li:last-child {border-bottom:0px} .menuMobile > ul > li > a, .menuMobile > ul > li > span {width: 100%; color: var(--vhm-black); font-size:2em;} .menuMobile > ul > li > ul {display: flex;flex-wrap: wrap; max-height: 0; overflow: hidden; transition: 0.4s ease-in-out; line-height: 0px} .menuMobile > ul > li > ul.submenu.open {max-height: 400px; margin-top: 10px; line-height: 29px} .menuMobile > ul > li > ul > li {width: 100%; margin-top: 2px; display: none} .menuMobile > ul > li > ul.submenu.block > li {display: block} .menuMobile > ul > li > ul > li > a, .menuMobile .subnavblock .subnavHeadline {width: 100%; font-size: 1.7em; color:var(--vhm-black); font-weight: normal; text-transform: none; margin-bottom: 0; letter-spacing:inherit; cursor: pointer} .menuMobile > ul > li ul > li.subnavblock {align-items: flex-start; margin-right: 0} .menuMobile > ul > li > ul > li.subnavblock > ul.subnavList {display: none;padding-left: 20px; margin-top: 10px; width: 100%} .menuMobile > ul > li > ul > li.subnavblock > ul.subnavList > li {width: 100%;} .menuMobile > ul > li > ul > li.subnavblock > ul.subnavList > li > a {width: 100%; font-size: 1.5em} #subnavMobile {display:none; position:relative; margin-top:0px; margin-left:0px; padding-left:5%; width:95%; overflow:hidden; float:left; text-align:left; margin-top:0px; padding-top:10px; background-color:#eee; padding-bottom:10px; margin-bottom:10px } #subnavMobile div.subnav {height:auto; line-height:1.1em; width:100%; margin-top:2px; } #subnavMobile div.subnav1 {margin-left:10px; height:auto; line-height:1.1em; margin-bottom:7px; color:#000; margin-top:2px} #subnavMobile div.subnavheadline {font-family: 'RubrikMedium', sans-serif;margin-bottom:5px; font-weight:normal; width:100%; margin-top:5px; clear:both} #subnavMobile div.subnav a.subnavlink { color:#000; text-decoration:none;} #subnavMobileOuter {display:none; width:100%; height:40px; background-color:#eee; text-align:right; clear:both;} .subnavMobileOpener {padding-top:4px; position:relative; float:right; cursor:pointer; padding-bottom:10px; padding-right:5px} .subnavMobileOpener .balken {width:30px; height:5px; background-color:#000; margin-top:5px; margin-right:0px} #subnavMobileOuterOpener {display:block; clear:both; height:40px; background-color:#eee;} #subnavMobileOuterOpener #subnavMobileOpener .balken {width:30px; height:5px; background-color:#000; margin-top:5px; margin-right:0px} #subnav div.subnav div.subnav1 {display:none} #subnav div.aktiv div.subnav1 {display:block} #startseiteOuter {padding-top: 50px; order:2; padding:0px 20px} #start {display: flex;flex-direction: column;} #start .startImage {position: relative;top: 0;right:0; order: 1; width: 100%} #start #video1 {object-fit: fill;width: 100%; height: 100%} .starttopabstand {order:0} .startbottomabstand {order:3} body.isStart .subline_start, body.isStart h1.start {max-width: 100%} .content.expertise {margin-top: 100px} .expertise {margin-top: 40px} .expertise .expertisefields {flex-direction: column;} .expertise .expertisefields .field {max-width: 100%;} .services {margin-top: 40px} .services a.button {border:none; color:var(--vhm-grey-text) !important; text-decoration: underline !important; margin: 0; padding-left: 10px; padding-right: 10px} .services .button:hover {border:none; background: none} .pressReleases {flex-wrap:wrap; margin-top: 60px} .pressReleases .left {margin-bottom: 40px} .pressReleases .right {width: 100%} .teamfinder .form.flex {flex-direction: column; align-items: center} .teamfinder .form.flex .input {width: 100%; padding-right: 0; margin-bottom: 25px} .content.layout_1 {padding: 0px} .content.layout_1 .contentInnen {flex-direction: column} .content.layout_1 .contentInnen .textContent {padding:0 20px} .content.layout_1 .contentInnen .hauptbild {margin-left: 0px; margin-top: 50px} .content.layout_2 .contentInnen {} .content.layout_2 .contentInnen .pageNav {display: none} .content.layout_2 .contentInnen .hauptbild {margin-left: 0px; margin-top: 50px} .content.layout_3 .contentInnen {flex-direction: column-reverse;} .content.layout_3 .contentInnen .textContent {width: 100%} .content.layout_3 .contentInnen .headlineBlock {margin-bottom: 30px} .content.layout_3 .contentInnen .headlineBlock h1::before {min-height: 155px; width: 35px} .content.layout_3 .contentInnen .hauptbild {width: 100%} .content.layout_4 .contentInnen {flex-wrap: wrap} .content.layout_4 .contentInnen .textContent {width:100%} .content.layout_5 .contentInnen {flex-wrap: wrap; margin-right: auto} .content.layout_5 .contentInnen .hauptbild {margin: 0px auto;} .content.layout_7 .contentInnen {flex-wrap: wrap} .content.layout_7 .contentInnen .hauptbild {margin: 0px auto; margin-top: 40px} .content.layout_8 .contentInnen {padding:0px;} .content.layout_9 .contentInnen {padding: 0 16px} .content.layout_9 .contentInnen .textContent {padding-left: 0} .content.layout_10 .contentInnen {padding: 0 16px} .content.layout_10 .contentInnen .textContent {padding-left: 0} .hauptbild.img_pos_3 {justify-content: center} .personOuter {width: 100%} .newsletter {flex-direction: column} .newsletter .form .input {width: 100% !important} .newsletter .left {max-width: 100%} .teamSplit {flex-wrap: wrap} .teamSplit .partnerLeft {width: 100%; padding: 0} .teamSplit .partnerRight {width: 100%; padding: 0} #partnerUebersicht {display: flex; flex-direction: column; align-items: center} .expertiseSplit {flex-wrap:wrap} .expertiseSplit .expertiseColumn {width: 100%; display: flex; flex-direction: column; align-items: center; margin-bottom: 60px} .expertiseSplit .expertiseColumn ul {width: 100%;} .expertiseSplit .expertiseColumn li {width: 100%; text-align: center; display: block} .slickGallery img.slick-slide {height: 400px} .slickThumbGallery img.slick-slide {height: 90px;} .awardsFav {margin-top: 60px; margin-bottom: 40px} .awardsFav .awardsFavInner {flex-wrap: wrap} .awardsFav .awardsFavInner .award{margin-bottom: 20px} .awards .awardcontent {flex-wrap: wrap} .awards .awardsright {width: 100%; padding-left: 0; margin-top: 40px} .awards ul li {display: block} .press .pressBody {flex-wrap: wrap;} .press .pressBody .pressLeft {width: 100%; margin-bottom: 40px} .press .pressBody .pressLeft .pressImg {max-width: 100%; margin-bottom: 40px} .press .pressBody .pressRight {max-width: 100%;} .press .pressBody .pressRight .links {flex-wrap: wrap} .press .pressBody .pressRight .links a {margin-top: 20px} #adresse {width:100%; height:auto; padding-left:0px; text-align:left; position:relative; margin:0px auto; padding:2%} #adresseInnen {} #adresseInnen .adresseUnten {flex-direction: column} #adresseInnen .adresseUnten .left {width: 100%; display: none} #adresseInnen .adresseUnten .right {width: 100%;} #adresseInnen .adresseUnten .right .footerNav {flex-wrap: wrap} #adresseInnen .adresseUnten .right .footerNav .modul {width: 50%; margin-bottom: 70px} #adresseInnen .linkedin {margin-left: 0px} #adresseInnen .logoWhite {margin-bottom: 70px} p.partner {margin-top:0px; margin-bottom:0px; margin-left:0px; font-size:0.8em} p.abstandpartner {margin-top:0px} td.tdpartner {vertical-align:bottom; padding-left:0px; padding-bottom:10px; padding-top:10px} div.partnerdiv ul {margin-top:0px} p.partner > p {margin:0px; padding:0px;} .partnertdkontakt {vertical-align:bottom} .partnertdbild {padding-left:0px} .partnertdkontakt {width:100%} .partnerbild {clear:both; position:relative; top:0px;} .partnertable {margin-bottom:0px; top:0px; position:relative; font-size:0.8em} .partnertable td { display:block; clear:both; padding-bottom:10px} #contentInnen #inhalt #innerinhalt .content_einleitung, #contentInnen #inhalt #innerinhalt .content_einleitung p {font-size:1.1em; margin-bottom:20px} .content{font-size:1rem; line-height: 1.3rem} .content_startseite {font-weight:normal; font-size:0.9em; max-width:100%; width:100%} .newsdiv div.content {float:left; margin-left:5px; max-width:100%;} .datum {margin-bottom:5px} #contentInnen #inhalt #innerinhalt .content_einleitung, #contentInnen #inhalt #innerinhalt .content_einleitung p {margin-bottom: 20px;} p::empty {display:none} .partnerbilddiv {width:100%;} .partnerbilddiv img {width:100%} } @media (max-width:800px) { .pt_35 {padding-top: 25px !important;} .pt70 {padding-top: 30px} .pt80 {padding-top: 40px} .pt110 {padding-top: 50px} #start {margin-top: 160px; min-height: fit-content} h1, .h1like, body.isStart h1, body.isStart .h1like {font-size: 40px; line-height: 48px} body.isStart h1, body.isStart .h1like {padding: 0 20px} .expertise {padding: 0 10px} .expertise .expertisefields {grid-template-columns: repeat(2,1fr); justify-content: space-between; gap: 50px;} .expertise .expertisefields .field {min-width: inherit; position: relative;} .expertise .expertisefields .field .fieldHead {font: bold 32px/36px var(--vhm-font); justify-content: flex-start;} .expertise .expertisefields .field .fieldHead .pillBig.white.absolute {left: -30px} .publicationsOuter .publication {max-width: 100%} .publicationsOuter {grid-template-columns: repeat(auto-fill,300px)} .headlineSection {margin-bottom: 70px} .headlineSection::before {min-height: 155px; width: 35px;} .content.layout_0 .contentInnen .textContent {padding: 0 16px} .content.layout_0 .contentInnen .imgGrid {grid-auto-rows: 1fr} .content.layout_0 .contentInnen .imgGrid img {height: auto;} .content.layout_1 .contentInnen {padding: 0} .content.layout_1 .contentInnen .hauptbild {height: auto} .content.layout_1 .contentInnen .hauptbild img {} .content.layout_1 .contentInnen .hauptbild .zitatbox {position: relative; bottom: inherit; right: inherit; max-width: 100%; margin: 0px; margin-top: -3px} .content.layout_2 .contentInnen .textContent {padding: 0 16px} .content.layout_2 .contentInnen .content {columns: 1} .content.layout_2 .contentInnen .textContent .content_einleitung {top: 0} .content.layout_3 .contentInnen {padding-left: 0; padding: 0 16px} .content.layout_3 .contentInnen .textContent .haupttext ul {columns: 1} .content.layout_4 .contentInnen .textContent table tr td {width: 100%; display: block} .content.layout_4 .contentInnen .textContent table tr:last-of-type td:last-of-type {display: none} .content.layout_5 .textContent {padding: 32px 16px} .content.layout_5 .textContent .haupttext {font: 200 32px/38px var(--vhm-font);} .content.layout_6 .contentInnen {padding:0 16px} .content.layout_6 .contentInnen .headlineBlock {margin: 0; flex-direction: column; margin: 25px 0; padding: 0} .content.layout_6 .contentInnen h1 {font-size: 40px; line-height: 48px; width: auto} .content.layout_6 .contentInnen h1::before {min-height: 155px; width: 35px; top: 100%;} .content.layout_6 .contentInnen h2 {width: auto} .content.layout_7 .contentInnen .colsOuter {flex-direction: column} .content.layout_7 .contentInnen .colsOuter .col {width: 100%;} .content.layout_7 .contentInnen .colsOuter .col .block.pl80 {padding-left: 0} .content.layout_7 .contentInnen .colsOuter .col .block, .content.layout_7 .contentInnen .colsOuter .col .block.pl80 {width: 100%; padding: 0 16px} .content.layout_7 .contentInnen .colsOuter .col .quote {padding: 0 20px; font-size: 32px; line-height: 38px} .content.layout_7 .contentInnen .colsOuter .col img.imgHigh {height: 300px} .content.layout_8 .contentInnen, .content.layout_8 #contentInnen {padding: 0 16px} .content.layout_8 .contentInnen h1 {font-size: 40px; line-height: 48px; width: auto} .content.layout_8 .contentInnen h1::before {min-height: 155px; width: 35px; left: 50%} .content.layout_8 .contentInnen .textContent .content {columns: 1} .content.layout_9 .contentInnen, .content.layout_9 #contentInnen {padding: 0 16px} .content.layout_9 .contentInnen h1 {font-size: 40px; line-height: 48px} .content.layout_9 .contentInnen h1::before {min-height: 155px; width: 35px;} .content.layout_9 .contentInnen .textContent {padding-left: 0} .content.layout_9 .contentInnen .textContent table tr td {width: 100%; display: block; margin-bottom: 25px} .content.layout_9 .contentInnen .textContent .haupttext {font-size: 1rem; line-height: 1.3rem} .content.layout_10 .contentInnen {padding: 0 10px} .content.layout_10 .contentInnen .textContent {padding-left: 0} .content.layout_10 .contentInnen .textContent .haupttext table tr td {width: 100%; display: block; margin-bottom: 25px} .content.layout_10 .contentInnen .textContent .haupttext table tr td:nth-of-type(1) {padding-right: 0} .content.layout_11 .contentInnen .colsOuter, .content.layout_12 .contentInnen .colsOuter {flex-direction: column} .content.layout_11 .contentInnen .colsOuter .col, .content.layout_12 .contentInnen .colsOuter .col {width: 100%; } .content.layout_11 .contentInnen .colsOuter .col .block, .content.layout_12 .contentInnen .colsOuter .col .block, .content.layout_11 .contentInnen .colsOuter .col .block.pl80, .content.layout_12 .contentInnen .colsOuter .col .block.pl80 {padding: 0 16px} .content.layout_11 .contentInnen .colsOuter .col:nth-child(2), .content.layout_12 .contentInnen .colsOuter .col:nth-child(2) {margin-top: 30px} .content.layout_11 .contentInnen .colsOuter .col .quote, .content.layout_12 .contentInnen .colsOuter .col .quote {padding: 0 16px; font: 200 32px/38px var(--vhm-font); text-align: center} .personOuter {padding: 0 16px} .personOuter .topSection .name {font-size: 40px; line-height: 48px} .personOuter .text.about, .personOuter .text.education ul, .personOuter .text.publikationen ul {columns: 1; -webkit-columns: 1; -moz-columns:1} .personOuter .text.education ul li, .personOuter .text.mitgliedschaften ul li, .personOuter .text.publikationen ul li {display: block; margin-bottom: 10px} .personOuter .topSection {flex-direction: column} .personOuter .topSection .half {width: 100%; padding: 0} .personOuter .bottomSection {padding: 0} .personOuter .buttonSection {top: -40px; right: 0px} .gridItemsOuter {display: flex; flex-direction: column; gap: 20px;} .newscontent.itemdiv .image { width: 100%; height: 300px; display: flex; justify-content: center} .newscontent.itemdiv .image img {height: 100%; width: auto;} .partnerGrid .leftBig, .partnerGrid .rightBig, .partnerGrid .rightBig2, .partnerGrid .singleRow {display: flex; flex-direction: column; width: 100%} .partnerGrid img.desktop {display: none} .partnerGrid img.mobile {display: block} #contentInnen {min-height:inherit; width:100%; padding:0%;} .partnerdivbig {max-width:100%; width:310px; height:auto; margin-right:10px; margin-bottom:10px;} .partnerdivsmall {max-width:100%; width:150px; height:auto; margin-right:10px; margin-bottom:9px;} .partnerdivbig .img__description_layer {padding-top:20px; font-size:40px; line-height:40px;} .partnerdivsmall .img__description_layer {padding-top:20px; font-size:20px; line-height:20px;} .partnerdiv .left, .partnerdiv .right {width:100%; clear:both; display:block} .partnerdiv .left {padding-right: 0px;} #textAbmelden {font-size:0.8em} #adresseInnen { padding: 10px 0px;} #adresseInnen .adresseUnten .right {font-size: 9px} #adresseInnen .adresseUnten .location {min-width: 100px} #adresseInnen .adresseUnten .right .rightOben {margin-right: 0px} } @media (max-width:600px) { #backgroundCubes {display:none} .slickGallery img.slick-slide {height: 200px} .slickThumbGallery img.slick-slide {height: 40px;} .searchTeamMemberForm form div.form.flex {flex-wrap:wrap; flex-direction: column; align-items: center} .searchTeamMemberForm .form.flex .input {width: 100%; margin-bottom: 40px} .content_einleitung .flex {flex-wrap: wrap} #adresseInnen .adresseUnten .right {flex-wrap: wrap} #adresseInnen .adresseUnten .right .rightOben {width: 100%;} } @media (max-width:500px) { .newscontent.itemdiv .image { width: 100%; height: auto; max-height: inherit; padding: 0px 10px; display:block;} .newscontent.itemdiv .image img {height: auto; width: 100%;} .column2 {column-count: 1;} #adresseInnen .adresseUnten .right {gap: 10px} #adresseInnen .adresseUnten .location {width: 100%} } @media (max-width:400px) { .menuMobile > ul > li > a, .menuMobile > ul > li > span {font-size: 1.8em} .menuMobile > ul > li > ul > li > a, .menuMobile .subnavblock .subnavHeadline {font-size: 1.5em} .personOuter .text.kompetenzen > ul > li {flex-direction: column} .personOuter .text.kompetenzen > ul > li > ul > li {margin-left: 30px} }