/** * CU Whitlabel v1.0 * Components for CU Whitelabel * * * Released on:Nov 3, 2021 */ /* ################################################## SITE HEADER + LOGO ################################################## */ .site-header { position:fixed; z-index:20; top:0; width:100%; } .site-header::before { position:absolute; z-index:-1; content:''; height:10px; width:100%; } .scroll-box .site-header::before { bottom:-10px; opacity:0.2; z-index:1; } .branding { position:relative; z-index:1; width:100%; } .branding .item-box { display:-webkit-box; display:-ms-flexbox; display:flex; padding:0.5rem 0; } .logo { position:relative; display:inline-block; margin:auto 0 auto 0; } .logo span { display:inline-block; background-image:url('../images/logo.svg'); background-position:bottom left; background-repeat:no-repeat; background-size:cover; height:35px; width:70px; -webkit-transition:all 0.3s ease; transition:all 0.3s ease; vertical-align:top; } /* After Scroll -- we add a class scroll-box and change the Header*/ .scroll-box .logo span { height:35px; width:70px; background-size:cover; } .scroll-box .branding .item-box { padding:0.5rem 0; } @media (min-width:960px) { .branding .item-box { padding:2rem 0; } .logo { position:relative; display:inline-block; padding:1rem 0 1rem 0; } .logo span { height:50px; width:304px; background-size:contain;} } /* ################################################## SITE HEADER:Navigation AKA Metabox ################################################## */ .meta-box { margin:auto 0 auto auto; } /* ################################################## SITE HEADER:BACKGROUNDIMAGE SMALL ################################################## */ .hero-content.small-hero { position:relative; height:250px; min-height:auto; padding:0;} /* ################################################## LIVE PAGE:STATIC LINKS Form/Video/Hallplan ################################################## */ .static-links { position:fixed; z-index:10; right:0; top:200px; width:55px; -webkit-transition:all 0.3s ease; transition:all 0.3s ease; } .static-link-label { display:none; } .button.static-link { display:-webkit-box; display:-ms-flexbox; display:flex; margin-bottom:3px; border-radius:0; width:55px; height:55px; padding:5px 7px; } .static-links .icon-box.play-movie, .static-links .icon-box.feedback { height:27px; margin:auto; } .static-links .icon-box.locator { margin:auto; } .scroll-box .static-links { top:40px; -webkit-transform:scale(0.6) translateX(19px); transform:scale(0.6) translateX(19px); } @media (max-width:690px) { .static-links { top:90px; position:absolute; -webkit-transform:scale(0.6) translateX(19px); transform:scale(0.6) translateX(19px); } } /* ################################################## STARTPAGE:COUNTDOWN ################################################## */ .counter-box { -webkit-transform:scale(0.8); transform:scale(0.8); margin-right:-5rem; } .running { -ms-flex-wrap:wrap; flex-wrap:wrap; max-width:260px; } @supports (flex-wrap:wrap) { .running { -webkit-flex-wrap:wrap; } } .counter timer, .counter .labels { display:-webkit-box; display:-ms-flexbox; display:flex; width:100%; } .intro-time, .counter timer span, .counter .labels span { display:inline-block; font-size:3rem; margin:0 0 0 1rem; letter-spacing:-1px; min-width:5rem; } .counter timer span { font-weight:700; } .intro-time { font-size:1.6rem; } .counter .labels span { font-size:1.2rem; } @media (min-width:890px) { .counter-box { -webkit-transform:scale(1); transform:scale(1); margin-right:0;} } /* ################################################## STARTPAGE:CONTENT ON PAGE ################################################## */ body.countdown .hero-content { display:-webkit-box; display:-ms-flexbox; display:flex; min-height:calc(100vh - 61px); padding:15rem 0; } body.countdown .hero-content .item-box { margin:auto; } body.countdown .hero-content .text-box { position:relative; } body.countdown .hashtag { list-style-type:none; font-size:2.5rem; } body.countdown .hashtag li { position:relative; } body.countdown .hashtag li:before { content:'#'; font-weight:700; position:absolute; left:-2.5rem; display:inline-block; } body.countdown .text-box { position:relative; padding:0 0 5rem 0 } body.countdown .teaser-box { position:relative; max-width:860px; } body.countdown .teaser-item { position:relative; padding:2rem; margin-bottom:2rem; } body.countdown .button-box .button { margin-top:1rem; width:100%; max-width:285px; } body.countdown .modul-header { max-width:560px; margin:0 auto; padding:5rem 2rem 1rem 2rem; position:relative; } body.countdown .modul-image-slider .item-box { position:relative; width:calc(100% - 4rem); } body.countdown .modul-image-slider .swiper-button-prev, body.countdown .modul-image-slider .swiper-button-next { bottom:42px; top:inherit; height:100px; } body.countdown .modul-image-slider .swiper-button-prev { left:-30px; right:auto; } body.countdown .modul-image-slider .swiper-button-next { right:-30px; left:auto; } @media (min-width:760px) { body.countdown .button-box { margin:auto 0 0 0; } body.countdown .teaser-box, body.countdown .teaser-item { display:-webkit-box; display:-ms-flexbox; display:flex; } body.countdown .teaser-box { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } body.countdown .teaser-item { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; width:calc(50% - 1rem); } } /* ################################################## FAQ SINGLE PAGE ################################################## */ body .modul.faq { padding: 17rem 0 12rem 0; height:100%; } .modul.faq .faq-box { margin-bottom:3rem; } .modul.faq .accordion-title { display:-webkit-box; display:-ms-flexbox; display:flex; margin:0; margin-top:0.2rem; } .modul.faq .accordion-title > .icon-box.arrow { position:absolute; -webkit-transform:scale(2) rotate(45deg); transform:scale(2) rotate(45deg); right:25px; top:50%; z-index:3; } .modul.faq .accordion-title.active > .icon-box.arrow { -webkit-transform:scale(2) rotate(135deg); transform:scale(2) rotate(135deg); } .modul.faq .accordion-title { padding:3rem 8rem 3rem 3rem; position:relative; width:100%; cursor:pointer; -ms-user-select:none; -moz-user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; -khtml-user-select:none;user-select:none; } .modul.faq .accordion-content { display:none; } .modul.faq .accordion-title.active + .accordion-content { display:block; padding: 3rem; } /* ################################################## ################################################## LIVE PAGE ################################################## ################################################## */ /* ################################################## LIVE PAGE - Header Fullsize on Startpage ################################################## */ body .hero-content, body .hero-content { min-height:100vh; width:100%; position:relative; padding-bottom:43rem;} body .hero-content.small-hero { height:250px; min-height:auto; padding:0;} body .item-box.live-header { position:relative; z-index:4; } body .live-header .content-box { max-width:960px; margin:0 auto 0 auto; padding:17rem 0 12rem 0; text-align:center; } body .live-header .content-box .image-box { margin-bottom:2rem; } body .live-header .content-box .button { display:inline-block; font-size:2.4rem; } /* ################################################## LIVE PAGE - Navigation ################################################## */ body .meta-box, body .meta-box .matchmaking-navi { display:-webkit-box; display:-ms-flexbox; display:flex; position:relative;} body .meta-box .matchmaking-navi, .meta-box .topic-navi { margin:auto 0 auto 1rem } .meta-box .user-box { position:relative; } .meta-box .user-profile { margin-left:1rem; width:56px; height:56px; background-size:100% auto; background-position:center; border-radius:50%; border-style:solid; border-width:2px; } .meta-box .user-profile-navi, .meta-box .filter-box { display:none; -webkit-transition:all 0.3s ease; transition:all 0.3s ease; position:absolute; top:85px; right:0; min-width:160px; z-index:2; border:1px solid; } .scroll-box .meta-box .user-profile-navi, .scroll-box .meta-box .filter-box { top:63px; }/* After window-scroll*/ .meta-box .filter-box { width:200%; max-width:calc(100vw - 6rem); max-height:calc(100vh - 150px); overflow:auto;} .meta-box .filter-box .form-row { padding:2rem 0 0 2rem; display:-webkit-box; display:-ms-flexbox; display:flex; position:relative; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .meta-box .filter-box .form-row { -webkit-flex-wrap:wrap; } } .meta-box .filter-box .field-item { width:50%; padding-right:2rem; } .meta-box .filter-box .button-box { padding:0 2rem 2rem 2rem; text-align:right; } .meta-box .filter-box .button { display:inline-block; padding:12px 46px 12px 26px; } .meta-box .user-profile.active + .user-profile-navi, .meta-box .topic-filter.active + .filter-box { display:block; } .meta-box .topic-filter.button .icon-box { display:none; } .meta-box .user-profile-navi a { display:block; padding:0.5rem 1rem 0.5rem 1rem; text-decoration:none; } .meta-box .notification.button { padding:0; margin:0 1rem; width:50px; border-radius:0; } .meta-box .button.agenda { padding:12px 36px 12px 12px; } .meta-box .matchmaking-counter { position:relative; z-index:3; } @media (max-width:960px) { .meta-box .user-profile-navi, .meta-box .filter-box { top:63px; } } @media (max-width:860px) { body .meta-box .matchmaking-navi, .meta-box .topic-navi { margin:auto 0 auto 0; } .meta-box .topic-filter.button .icon-box { display:block; } .meta-box .topic-filter.button .topic-label { display:none; } .meta-box .topic-filter.button { padding:2rem; } .meta-box .user-profile { width:51px; height:51px; } .meta-box .filter-box .standard-radio label, .meta-box .filter-box .standard-checkbox label { padding:1.2rem 0 1.2remrem 4.5rem; } .meta-box .filter-box #topic-search-form { display:inline-block; width:100%; max-height:calc(100vh - 215px); overflow:auto; margin-bottom:5rem; position:static; } .meta-box .filter-box .button-box { padding:0 0; text-align:right; position:absolute; bottom:1rem; right:1rem; } .meta-box .filter-box .form-row { display:block; padding:1rem; } .meta-box .filter-box .form-row .field-item { width:100%; } } @media (max-width:600px) { .meta-box { font-size:1.4rem; } .meta-box .user-profile { width:45px; height:45px; } .meta-box .button.agenda { padding:6px 26px 6px 6px; margin:auto 0 auto 5px; } .meta-box .button.matchmaking-link { padding:6px 16px 6px 16px; margin:auto 0 auto 5px; } .meta-box .filter-box { max-width:calc(100vw - 4rem); } .meta-box .topic-filter.button { padding:18px; } .meta-box .topic-filter.button .icon-box { -webkit-transform:scale(0.9) translate(2px); transform:scale(0.9) translate(2px); } .meta-box .notification.button { margin-left:0; } .meta-box .icon-box.chat { -webkit-transform:scale(0.8) translate(4px, -8px); transform:scale(0.8) translate(4px, -8px); } .meta-box .icon-box.bell { -webkit-transform:scale(0.8) translate(1px, -7px); transform:scale(0.8) translate(1px, -7px); } .meta-box .agenda .icon-box { width:23px; height:32px; top:0px; } } @media (max-width:520px) { .meta-box .button.agenda { display:none; } } @media (max-width:380px) { .meta-box { font-size:1.2rem; } .meta-box .user-profile { width:40px; height:40px; margin-left:0.5rem; } .meta-box .notification.button { width:35px; margin-left:0.5rem; margin-right:1.8rem;} .meta-box .topic-filter.button { padding:15px; padding:15.5px; } .meta-box .topic-filter.button .icon-box { -webkit-transform:scale(0.85) translate(5px); transform:scale(0.85) translate(5px); } } @media (max-width:330px) { .meta-box .button.matchmaking-link { padding:6px 9px 6px 8px; } } @media (max-height:720px) { .meta-box .filter-box { height:100vh; } .meta-box .filter-box #topic-search-form { display:inline-block; width:100%; max-height:calc(100vh - 215px); overflow:auto; margin-bottom:5rem; position:static; } .meta-box .filter-box .button-box { padding:0 0; text-align:right; position:absolute; bottom:1rem; right:1rem; } } /* ################################################## ################################################## LIVE HOME PAGE :MODULS ################################################## ################################################## */ /* ################################################## LIVE PAGE - HOME:First View Section ################################################## */ .modul.first-view-box { display:block; margin-top:-43rem; position:relative; } .first-view-box .first-view { display:-webkit-box; display:-ms-flexbox; display:flex; padding:5rem 3rem; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;} @supports (flex-wrap:wrap) { .first-view-box .first-view { -webkit-flex-wrap:wrap; } } .first-view-box .first-view-item { width:20%; min-width:200px; } .first-view-box .item-wrapper { padding:2rem 1rem 6rem 1rem; position:relative; height:100%; text-align:center;} .first-view-box .image-box { max-width:150px; margin:0 auto; } .first-view-box .item-wrapper h5 { margin:0; padding:3rem 0; } .first-view-box .button-box { position:absolute; bottom:0; left:0; width:100%; text-align:center; } .first-view-box .button { display:inline-block; } /* ################################################## LIVE PAGE - :STREAMS Next on Stage ################################################## */ .modul.first-view-box + .modul.next-on-stage, .modul.first-view-box + .chat-window + .modul.next-on-stage { margin-top:0; } .modul.next-on-stage { display:block; margin-top:-43rem; position:relative;} .next-on-stage .modul-title { text-transform:uppercase; } .next-on-stage .events-box, .next-on-stage .events-box .event-item, .next-on-stage .events-box .events-info, .next-on-stage .product-list { display:-webkit-box; display:-ms-flexbox; display:flex;} .next-on-stage .events-box { -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-align:stretch; -ms-flex-align:stretch; align-items:stretch; } @supports (flex-wrap:wrap) { .next-on-stage .events-box { -webkit-flex-wrap:wrap; } } .next-on-stage .events-box .flex-item { width:calc(33.33333% - 1.5rem); margin-bottom:2rem; position:relative; } .next-on-stage .events-box .flex-item:nth-of-type(n+4) { width:calc(50% - 1rem); margin-bottom:2rem; position:relative; } .next-on-stage .events-box .event-item { height:100%; -webkit-box-orient:vertical; -ms-flex-direction:column; flex-direction:column; } .next-on-stage .events-box .flex-item:nth-of-type(n+4) .event-item { -webkit-box-orient:horizontal; -ms-flex-direction:row; flex-direction:row; padding-bottom:7rem; -ms-flex-wrap:wrap; flex-wrap:wrap;} .next-on-stage .events-box .flex-item:nth-of-type(n+4) .image-box { order:2; max-width:150px; } .next-on-stage .events-box .flex-item:nth-of-type(n+4) .events-info { width:calc(100% - 150px); } .next-on-stage .events-box .flex-item:nth-of-type(n+4) .open-info-box .icon-box { margin-left:150px; } .next-on-stage .events-box .image-box { order:8; padding:0; width:100%;} .next-on-stage .events-box .events-info { order:1; padding:2rem 2rem 0 2rem; width:100%; -webkit-box-orient:vertical; -ms-flex-direction:column; flex-direction:column; height:100%; } .next-on-stage .events-box .text-box { order:2; padding:2rem 0; width:100%; } .next-on-stage .events-box .product-overview-box { order:3; padding:2rem 0; width:100%; } .next-on-stage .events-box .button-box { order:4; padding:2rem; width:100%; margin:auto 0 0 0; text-align:center; } .next-on-stage .events-box .button-box .button { display:inline-block; width:auto; } .next-on-stage .button.live-stream-opener .icon-box { width:35px; height:26px; position:absolute; right:1rem; top:10px; } .next-on-stage .live-stream-opener { padding-right:53px; } .next-on-stage .events-box .flex-item:nth-of-type(n+4) .button-box { position:absolute; bottom:0; } .next-on-stage .events-box .image-box img { display:block; width:100%; margin:auto 0 0 0;} .next-on-stage .events-box .stream-title-box { margin-top:2rem; } .next-on-stage .events-box .events-info-box { display:none; } .next-on-stage .events-box .events-info.active .events-info-box { position:absolute; top:0; left:0; width:100%; height:100%; padding:7rem 2rem 2rem 2rem; display:block; z-index:2; } .next-on-stage .events-box .flex-item .button-box.open-info-box { width:100%; text-align:center; position:relative; bottom:inherit;} .next-on-stage .events-box p { margin:0; } .next-on-stage .events-box p + p { margin:2rem 0 0 0; } .next-on-stage .events-info-box h3 { font-size:2.4rem; } .next-on-stage .events-info-box .close-info-box { position:absolute; top:1rem; right:1rem; } .next-on-stage .events-box .product-overview-box:empty { display:none; } .next-on-stage .product-list { list-style-type:none; padding:0; margin:0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .next-on-stage .product-list { -webkit-flex-wrap:wrap; } } .next-on-stage .product-list li { position:relative; margin:0.2rem 1.5rem; font-weight:bold; } .next-on-stage .product-list li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } @media (max-width:860px) { .next-on-stage .events-box .flex-item, .next-on-stage .events-box .flex-item:nth-of-type(n+4) { width:100%; } .next-on-stage .events-box .event-item { -webkit-box-orient:horizontal; -ms-flex-direction:row; flex-direction:row; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .next-on-stage .events-box .event-item { -webkit-flex-wrap:wrap; } } .next-on-stage .events-box .image-box, .next-on-stage .events-box .flex-item:nth-of-type(n+4) .image-box { order:2; padding:0; width:25%; max-width:inherit;} .next-on-stage .events-box .events-info, .next-on-stage .events-box .flex-item:nth-of-type(n+4) .events-info { order:1; padding:2rem 2rem 0 2rem; width:75%; height:auto; } .next-on-stage .events-box .flex-item .button-box.open-info-box { text-align:right; } .next-on-stage .events-box .flex-item .button-box.open-info-box .icon-box { margin-right:25%; } } @media (max-width:380px) { .next-on-stage .events-box .image-box, .next-on-stage .events-box .flex-item:nth-of-type(n+4) .image-box { order:8; padding:0; width:100%; max-width:inherit; margin:auto 0 0 0;} .next-on-stage .events-box .events-info, .next-on-stage .events-box .flex-item:nth-of-type(n+4) .events-info { width:100%; } .next-on-stage .events-box .flex-item .event-item, .next-on-stage .events-box .flex-item:nth-of-type(n+4) .event-item { padding-bottom:0; margin-bottom:2rem; } .next-on-stage .events-box .button-box { position:relative!important; bottom:inherit!important; } .next-on-stage .events-box .flex-item .button-box.open-info-box { text-align:center; } .next-on-stage .events-box .flex-item .button-box.open-info-box .icon-box { margin:0; } } /* ################################################## LIVE HOME:MY AGENDA ################################################## */ .modul.personal-events { padding:5rem 0; } .personal-events .accordion-title, .personal-events .personal-event-title, .personal-events .personal-event-info, .personal-events .personal-event-title .item-wrapper, .personal-events ul.product-list { display:-webkit-box; display:-ms-flexbox; display:flex; } .personal-events .button-box { text-align:center;} .personal-events-box + .button-box { margin-top:4rem; } .personal-events .button-box + .button-box { margin-top:2rem; } .personal-events .button-box .button { display:inline-block; } .personal-events .button.create-pdf { padding:12px 46px 12px 26px;} .personal-events .button.create-pdf .icon-box { position:absolute; right:9px; top:calc(50% - 13px); } .personal-events .button.open-all { font-size:2.4rem; padding-bottom:35px; } .personal-events .button.open-all .icon-box { transform:rotate(135deg) scale(2); left:50%; position:absolute; bottom:30px; } .personal-events .accordion-title > .icon-box.arrow { position:absolute; -webkit-transform:scale(2) rotate(45deg); transform:scale(2) rotate(45deg); right:25px; top:50%; z-index:3; } .personal-events .accordion-title.active > .icon-box.arrow { -webkit-transform:scale(2) rotate(135deg); transform:scale(2) rotate(135deg); } .personal-events .accordion-title { padding:3rem 8rem 3rem 3rem; position:relative; width:100%; cursor:pointer; -ms-user-select:none; -moz-user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; -khtml-user-select:none;user-select:none; } .personal-events .delete-aganda-item { width:35px; height:35px; position:absolute; right:0; top:0; } .personal-events .delete-aganda-item input { opacity:0; position:absolute; z-index:2; height:100%; width:100%; cursor:pointer; } .personal-events .delete-aganda-item .icon-box { position:absolute; z-index:1; opacity:0.3; transform:scale(0.7); } .personal-events .delete-aganda-item:hover .icon-box{ opacity:1; } .personal-events .personal-event-title h3 { margin:auto 0; font-size:2.4rem; } .personal-events .accordion-content { display:none; } .personal-events .active + .accordion-content { display:block;} .personal-events .personal-event { margin-bottom:2px; } .personal-events .personal-event-info { padding:1rem 3rem 3rem 3rem; } .personal-events .personal-event-stageinfo, .personal-events .personal-event-info .image-box, .personal-events .personal-event-info .speaker-box { min-width:200px; max-width:200px; margin-right:2rem; } .personal-events .speaker-box .speaker-name, .personal-events .speaker-box .speaker-position, .personal-events .speaker-box .company-name { display:block; } .personal-events .speaker-box .speaker-name:empty, .personal-events .speaker-box .speaker-position:empty, .personal-events .speaker-box .company-name:empty { display:none; } .personal-events .personal-event-info .text-box p { margin:0 0 1rem 0; } .personal-events ul.product-list { list-style-type:none; padding:0; margin:0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .exhibitor-editor ul.product-list { -webkit-flex-wrap:wrap; } } .personal-events ul.product-list li { position:relative; margin:0.2rem 1.5rem; margin:0 1.5rem 1rem 1.5rem; font-weight:bold; } .personal-events ul.product-list li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } @media (max-width:760px) { .personal-events .accordion-title { display:block; } .personal-events .personal-event-stageinfo { max-width:inherit; min-width:inherit; width:100%; } .personal-events .accordion-title, .personal-events .personal-event-info { padding:1rem 5rem 1rem 1rem; } .personal-events .personal-event-info .image-box { min-width:100px; max-width:100px; } .personal-events .personal-event-info .speaker-box { width:100%; } .personal-event-info .text-box { width:calc(100% - 120px); } } @media (max-width:360px) { .personal-events .personal-event-info { display:block; } .personal-events .personal-event-info .text-box { width:100%; } .personal-events .personal-event-info .image-box { max-width:100%; min-width:120px; } } /* ################################################## LIVE HOME:Programm ################################################## */ .modul.program-tabs { padding:5rem 0; } .program-tabs .tab-content.hidden { display:none; } .program-tabs .tab-box.link-box, .program-pagination, .program-tabs .tab-box.link-box .button, .program-tabs .stream-container { display:-webkit-box; display:-ms-flexbox; display:flex; } .program-tabs .stream-container { -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .program-tabs .stream-container { -webkit-flex-wrap:wrap; } } .program-tabs .tab-box.link-box { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .program-tabs .tab-box.link-box .tab-item { width:calc(33.33333% - 4px); position:relative; } .program-tabs .tab-box.link-box .button { padding:1rem; width:100%; font-size:2.4rem; font-weight:bold; height:100%; opacity:0.65; text-transform:uppercase; border-radius:0; } .program-tabs .tab-box.link-box .button:hover, .program-tabs .tab-box.link-box .tab-item.active .button { opacity:1; } .program-tabs .tab-box.link-box .button span { margin:auto; } .program-tabs .tab-box.link-box .button .icon-box { display:none; } .program-tabs .tab-box.link-box .tab-item:after { content:''; height:4px; width:100%; position:absolute; bottom:0; left:0; } .program-tabs .tab-content { position:relative; } .program-tabs .tab-content:before { content:''; position:absolute; left:-50vw; width:200vw; height:100%; z-index:-1; } .program-pagination { padding:2rem 0; } .program-pagination + .button-box { text-align:center; padding:3rem 0; } .program-pagination + .button-box .button { display:inline-block; } .program-tabs .button.create-pdf { padding-right:46px; } .program-tabs .button.create-pdf .icon-box { position:absolute; top:9px; right:12px; } .program-pagination .button.program-day { margin:1rem 1rem 1rem 0; } .program-tabs .program-time { width:100%; position:sticky; top:150px; z-index:3; padding:0.5rem 0 0 0; } .program-tabs .program-time hr { margin:0.5rem 0 0 0; } .program-tabs .program-date-time, .program-tabs .res-show { display:none; } .program-tabs .program-date-time:first-of-type { display:block; } .program-tabs .program-date-time h3 { margin:0; } .program-tabs .program-date-time { width:100%; padding-top:2rem; position:sticky; top:55px; z-index:1; } .program-tabs .halls { display:none; width:100%; position:sticky; top:115px; z-index:2;padding:0.5rem 0; margin-left:-2rem; } .program-tabs .halls:before { position:absolute; z-index:-1; content:''; width:calc(100% + 2rem); height:100%; top:0; } .program-tabs .program-date-time:first-of-type + .halls { display:-webkit-box; display:-ms-flexbox; display:flex; } .program-tabs .hall-item { width:calc(33.33333% - 2rem); margin:0 0 2rem 2rem; } .program-tabs .hall-item h3 { margin:0; font-weight:normal; font-size:3rem; } .program-tabs .event-item { width:calc(33.33333%); margin:0; } .program-tabs .event-item.hall-1, .program-tabs .event-item.hall-4, .program-tabs .event-item.hall-7 { margin:2rem 0 2rem 0; width:calc(33.33333% - 2rem); } .program-tabs .event-item.hall-2, .program-tabs .event-item.hall-5, .program-tabs .event-item.hall-8 { margin:2rem 2rem 2rem auto; width:calc(33.33333% - 2rem);} .program-tabs .event-item.hall-3, .program-tabs .event-item.hall-6, .program-tabs .event-item.hall-9 { margin:2rem 0 2rem auto; } .program-tabs .program-time + .event-item.hall-2 { margin:2rem 2rem 2rem auto; width:calc(33.33333% - 2rem); } .program-tabs .event-item.hall-1 + .event-item.hall-2, .program-tabs .event-item.hall-4 + .event-item.hall-5, .program-tabs .event-item.hall-7 + .event-item.hall-8 { margin:2rem; width:calc(33.33333% - 2rem); } .program-tabs .event-item.hall-1 + .event-item.hall-3, .program-tabs .event-item.hall-4 + .event-item.hall-6, .program-tabs .event-item.hall-7 + .event-item.hall-9 { margin:2rem 0 2rem auto; } .program-tabs .event-item.hall-2 + .event-item.hall-3, .program-tabs .event-item.hall-5 + .event-item.hall-6, .program-tabs .event-item.hall-8 + .event-item.hall-9 { margin:2rem 0 2rem 0; } .program-tabs .checkbox-label { font-weight:bold; } .program-tabs .event-item .title-box, .program-tabs .event-item .cooming-soon { font-weight:bold; display:block; margin:3rem 0; } .program-tabs .event-item .companyname { display:block; margin:0 0 1rem 0; } .program-tabs .programm-event-box.field-item { display:block; } .program-tabs .event-item .button-box { width:100%; margin:auto 0 0 0; } .program-tabs .event-item .button-box .button { display:inline-block; width:auto; } .program-tabs .event-item .button.live-stream-opener .icon-box { width:35px; height:26px; position:absolute; right:1rem; top:10px; } .program-tabs .live-stream-opener { padding-right:53px; } @media (max-width:1024px) { .program-tabs .hall-item h3 { font-size:2.4rem; } } @media (max-width:980px) { .program-tabs .program-date-time h3 { font-size:2.4rem; } .program-tabs .program-date-time { top:55px; } .program-tabs .program-time { top:135px; } .program-tabs .halls { top:100px; } } @media (max-width:820px) { .program-tabs .tab-box.link-box .button { font-size:1.6rem; } .program-tabs .program-date-time { top:50px; } .program-tabs .res-show { display:block; } .program-tabs .res-show, .program-tabs .program-date-time h3 { font-size:2rem; } .program-tabs .program-time { top:92px; } .program-tabs .halls { display:none!important; } .program-tabs .event-item { width:100%!important; margin:2rem 0 2rem 0!important; } } @media (max-width:380px) { .program-tabs .tab-box.link-box .button { font-size:1.2rem; } .program-tabs .program-date-time { top:40px; } .program-tabs .program-time { top:80px; } } /* ################################################## LIVE HOME:Exhibitor Filter ################################################## */ .modul.filter-masonry-box { padding:5rem 0; } .filter-masonry-box .company-filter-box, .filter-masonry-box .logo-gallery, .filter-masonry-box .exhibitor-category { display:-webkit-box; display:-ms-flexbox; display:flex;} .filter-masonry-box .company-filter-box { width:100%; margin:0 0 3rem 0; } .filter-masonry-box .ui-group { width:calc(45% - 1rem); margin:0 1rem 0 0; position:relative; } .filter-masonry-box .ui-group .icon-box { position:absolute; right:0; top:0; z-index:0; } .filter-masonry-box select.filter-select { padding:1.5rem 5.5rem 1.5rem 1.5rem; -webkit-appearance:none; -moz-appearance:none; appearance:none; border-width:1px; border-style:solid; position:relative; z-index:3; width:100%; } .filter-masonry-box .button.reset-button { margin:auto 0 auto auto; padding:0 30px 0 0; } .filter-masonry-box .button.reset-button .icon-box { position:absolute; top:-2px; right:0; } .filter-masonry-box .button.reset-button .button-label { height:21px; display:inline-block; line-height:21px; padding-right:5px; } .filter-masonry-box .logo-gallery { width:100%; margin-left:-1rem; -webkit-box-align:stretch; -ms-flex-align:stretch; align-items:stretch; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .filter-masonry-box .logo-gallery { -webkit-flex-wrap:wrap; } } .filter-masonry-box .filtering-item { width:calc(16.66666% - 1rem); margin:0 0 1rem 1rem; position:relative; padding:0.5rem; } .filter-masonry-box .logo-gallery a { position:absolute; top:0; left:0; width:100%; height:100%; z-index:2; } .filter-masonry-box .filtering-item a:hover { opacity:0.3; } .filter-masonry-box .exhibitor-category { height:100%; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; } @supports (flex-wrap:wrap) { .filter-masonry-box .logo-gallery .exhibitor-category { -webkit-flex-wrap:wrap; } } .filter-masonry-box .logo-gallery img { margin:auto; } .filter-masonry-box .logo-gallery figcaption { display:inline-block; padding:2rem 1rem; margin:auto 0 0 0; width:100%; text-align:center; } .company-filter-pagination { margin:2rem 0; } .company-filter-pagination button { padding:3px 10px; margin:0 4px 4px 0; border:solid 1px; position:unset; text-decoration:none; min-width:30px; min-height:30px; } .company-filter-pagination .tab-previous-page .icon { -webkit-transform:rotate(-135deg) translate(2px, 5px); transform:rotate(-135deg) translate(2px, 5px); } .company-filter-pagination.tab-next-page .icon { -webkit-transform:rotate(45deg) translate(-5px, -2px); transform:rotate(45deg) translate(-5px, -2px); } @media (max-width:860px) { .filter-masonry-box .filtering-item { width:calc(25% - 1rem); } .filter-masonry-box select.filter-select { padding:0.5rem 4rem 0.5rem 0.5rem;} .filter-masonry-box .icon-box.select { width:30px; } .filter-masonry-box .icon-box.select .icon {width:11px; height:11px; right:12px; top:calc(50% - 5px); } } @media (max-width:460px) { .filter-masonry-box .filtering-item { width:calc(33.333333% - 1rem); } .filter-masonry-box .company-filter-box { display:block; } .filter-masonry-box .ui-group { width:100%; margin:0 0 1rem 0; } } @media (max-width:380px) { .filter-masonry-box .filtering-item { width:calc(50% - 1rem); } } /* ################################################## LIVE HOME:Single Image / Teaser ################################################## */ .modul.modul-bg-image-text { position:relative; } .modul.modul-bg-image-text .item-box { position:relative; z-index:1; padding-top:25rem; display:-webkit-box; display:-ms-flexbox; display:flex; } .modul.modul-bg-image-text .item-box .text-box { padding:3rem; margin:auto auto 0 auto; text-align:center; } .modul.modul-bg-image-text .item-box .text-box p, .modul.modul-bg-image-text .item-box .text-box h3 { text-align:left; } .modul.modul-bg-image-text .item-box .text-box .button { display:inline-block; } /* ################################################## LIVE HOME:Sponsor Box with Thumbnails ################################################## */ .modul.gallery-box { padding:5rem 0; } .company-masonry .sorting-box-wrapper { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .company-masonry .sorting-box-wrapper { -webkit-flex-wrap:wrap; } } .company-masonry a { position:absolute; top:0; left:0; width:100%; height:100%; z-index:2; } .company-masonry-item { margin:1rem; overflow:hidden; } .company-masonry .image-box img { width:100%; } .company-masonry .thumb-small-xx { width:150px; height:150px; } .company-masonry .thumb-small-x { width:210px; height:200px} .company-masonry .thumb-small { width:280px; height:280px; } .company-masonry .thumb { width:350px; height:350px; } @media (max-width:760px) { .company-masonry .thumb-small-xx { width:80px; height:80px; } .company-masonry .thumb-small-x { width:90px; height:90px} .company-masonry .thumb-small { width:110px; height:110px; } .company-masonry .thumb { width:120px; height:120px; } } @media (max-width:460px) { .company-masonry .thumb-small-xx, .company-masonry .thumb-small-x, .company-masonry .thumb-small, .company-masonry .thumb { width:90px; height:90px } } /* ################################################## LIVE HOME:Media Partner Slider ################################################## */ .modul.modul-image-slider { padding:5rem 0; } .modul.modul-image-slider .slider-center-box { position:relative; padding:0 3rem;} .swiper-button-next span, .swiper-button-prev span { -webkit-transform:scale(0.6) translate(2px, 6px); transform:scale(0.6) translate(2px, 6px); } /* ################################################## LIVE HOME:News box ################################################## */ .news-masonry-box .newsroom-tabs { display:-webkit-box; display:-ms-flexbox; display:flex;} .newsroom-tabs .button { padding:0; margin:0 5rem 3rem 0; position:relative; min-width:inherit; } .newsroom-tabs .button.nav-tab.active { font-weight:bold; } .newsroom-tabs .button.nav-tab.active::after { content:''; width:70%; position:absolute; bottom:0; left:15%; display:block; height:2px; } /* ################################################## LIVE:SEARCH RESULT PAGE ################################################## */ body.bd-matchmaking .modul.news-masonry-box { display:none; } .modul.news-masonry-box { padding:5rem 0; } .news-masonry-box .masonry, .masonry ul.product-list, .news-masonry-box .masonry-item { display:-webkit-box; display:-ms-flexbox; display:flex; } .news-masonry-box .masonry-item { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; align-self:flex-start; } .news-masonry-box .masonry { -ms-flex-wrap:wrap; flex-wrap:wrap; margin:0 0 0 -2rem; } @supports (flex-wrap:wrap) { .news-masonry-box .masonry { -webkit-flex-wrap:wrap; } } .news-masonry-box .masonry-item { overflow:hidden; margin:0 0 2rem 2rem; width:calc(25% - 2rem); -webkit-transition:all 0.2s ease; transition:all 0.2s ease; position:relative; } .news-masonry-box .masonry-item .button { border:0; padding:1.4rem 2rem 1rem 2rem; color:currentColor; position:absolute; top:0; left:0; width:100%; height:100%; z-index:2; } .news-masonry-box .masonry-item:hover { transform:scale(1.1); -webkit-box-shadow:0px 0px 10px 1px rgba(0,0,0,0.75); -moz-box-shadow:0px 0px 10px 1px rgba(0,0,0,0.75); box-shadow:0px 0px 10px 1px rgba(0,0,0,0.75); z-index:3;} .news-masonry-box .masonry .text-box { padding:7rem 2rem 3rem 2rem; line-height:1.2; } .news-masonry-box .masonry .product-overview-box { padding:1.5rem 2rem; order:3; } .news-masonry-box .masonry .narrow-item .image-box { order:4; } .news-masonry-box .masonry .image-box img { display:block; } .news-masonry-box .masonry .icon-box.whitepaper { position:absolute; right:1.5rem; top:0.8rem; } .news-masonry-box .masonry .icon-box.podcast { position:absolute; right:1.5rem; top:1.5rem; } .news-masonry-box .masonry .icon-box.read { position:absolute; right:2.5rem; top:1.5rem; -webkit-transform:scale(1.2); transform:scale(1.2); } .news-masonry-box .masonry .icon-box.play-movie { position:absolute; right:1.5rem; top:1rem; width:30px; height:23px; background-color:transparent; } .news-masonry-box ul.product-list { display:block; list-style-type:none; padding:0; margin:0 0 2rem 0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .news-masonry-box ul.product-list { -webkit-flex-wrap:wrap; } } .news-masonry-box ul.product-list li { position:relative; margin:0.2rem 1.5rem; } .news-masonry-box ul.product-list li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } .news-masonry-box .button-box { text-align:center;margin:3rem 0; } .news-masonry-box .button-box .button { display:inline-block; } @media (max-width:960px) { .news-masonry-box .masonry { margin-left:-1rem; } .news-masonry-box .masonry-item { width:calc(33.33333% - 1rem); margin:0 0 1rem 1rem;} } @media (max-width:760px) { .news-masonry-box .masonry-item { width:calc(50% - 1rem); margin:0 0 1rem 1rem;} } @media (max-width:460px) { .news-masonry-box .masonry-item:hover {transform:scale(1); -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none;} .news-masonry-box .masonry { margin-left:0; } .news-masonry-box .masonry-item { width:100%; margin:0 0 1rem 0; } } /* ################################################## LIVE:MATCHMAKING ################################################## */ .modul.filter-nav { padding-top:5rem; position:sticky; top:-30px; z-index:3; padding-bottom:0.5rem;} .modul.user-matchmaking { padding:5rem 0; } .modul.matchmaking-results-intro { padding:2rem 0 3rem; } /* Matchmaking Filters and Navi */ .filter-nav .matchfilter-navi, .filter-nav .matchmaking-filter-box, .filter-nav .free-text-search, .results-pagination, .user-matchmaking .match-results, .user-matchmaking .matchmaking-results, .user-matchmaking .user-information, .matchmaking-results .user-status { display:-webkit-box; display:-ms-flexbox; display:flex;} .matchfilter-navi .button { padding:0; margin:0 5rem 3rem 0; position:relative; min-width:inherit; } .matchfilter-navi .button.reset-button { margin:0 0 3rem auto; padding:0 30px 0 0; } .matchfilter-navi .button.my-bookmarks-link { padding:0 30px 0 0; } .matchfilter-navi .button.my-bookmarks-link .icon-box { position:absolute; top:-3px; right:0; } .matchfilter-navi .button.my-bookmarks-link .bookmark-counter { position:absolute; height:100%; width:23px; right:0; color:#fff; z-index:3; text-align:center; font-size:1.5rem; } .matchfilter-navi .button.reset-button .icon-box { position:absolute; top:-2px; right:0; } .matchfilter-navi .button.nav-tab.active { font-weight:bold; } .matchfilter-navi .button.nav-tab.active::after { content:''; width:70%; position:absolute; bottom:0; left:15%; display:block; height:2px; } .matchfilter-navi .button.my-bookmarks-link.active::after { width:53%; } .filter-nav .matchmaking-filter-box { width:100%; margin-left:-1rem; } .filter-nav .ui-group { width:calc(25% - 1rem); margin:0 0 1rem 1rem; position:relative; } .filter-nav .ui-group .icon-box { position:absolute; right:0; top:0; z-index:0; } .filter-nav select.filter-select { padding:1.5rem 5.5rem 1.5rem 1.5rem; -webkit-appearance:none; -moz-appearance:none; appearance:none; border-width:1px; border-style:solid; position:relative; z-index:3; width:100%; } .filter-nav .free-text-search input[type="text"] { padding:12px 12px 12px 19px; } .filter-nav .free-text-search .button { padding-right:46px; margin-left:0.5rem; } .results-pagination button { padding:3px 10px; margin:0 4px 4px 0; border:solid 1px; position:unset; text-decoration:none; min-width:30px; min-height:30px; } .tab-previous-page .icon { -webkit-transform:rotate(-135deg) translate(2px, 5px); transform:rotate(-135deg) translate(2px, 5px); } .tab-next-page .icon { -webkit-transform:rotate(45deg) translate(-5px, -2px); transform:rotate(45deg) translate(-5px, -2px); } .user-matchmaking .match-results { padding:3rem 0; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .user-matchmaking .match-results { -webkit-flex-wrap:wrap; } } .user-matchmaking .matchmaking-results { position:relative; width:calc(50% - 1rem); margin-bottom:2rem; padding:1.5rem 1.5rem 3rem 1.5rem; -webkit-box-align:flex-start; -ms-flex-align:start; align-items:flex-start;} .user-matchmaking .user-information { width:calc(100% - 220px); height:100%; } .user-matchmaking .user-information-item { height:100%; width:100%; padding-bottom:3rem; margin-right:1.5rem;} .user-matchmaking .user-nameset { margin-bottom:2rem; display: block; } .user-matchmaking .user-status-freetext strong { margin-bottom:2rem; display: block; } .user-matchmaking .user-status-freetext:empty, .user-matchmaking .user-status-freetext div:empty, .user-matchmaking .user-status-freetext div strong:empty { display:none; } .user-matchmaking .user-nameset strong { display:block; margin-top:0.5rem; font-size:1.9rem; } .user-image { max-width:190px; min-width:100px; width:25%; margin-right:1.5rem; } .user-status { position:absolute; bottom:0; left: 1.5rem; font-size:1.6rem; -ms-flex-wrap:wrap; flex-wrap:wrap; max-width:100%; } .user-action { max-width:238px; min-width:150px; width:30%; } .user-action .button { margin-bottom:0.5rem; width:100%; text-align:center; padding:12px 26px; } .user-action button.bookmark { padding:10px 26px; } .user-action .button.bookmark .icon-box { position:absolute; left:5px; top:5px; } .score-box { position:relative; text-align: right;} .score-box span:first-of-type { font-size:1.9rem; text-transform:uppercase; font-weight:700; padding:0.7rem 4rem 0.5rem 0; white-space:nowrap;} .online-state, .speaker, .exhibitor { background-size:auto; background-size:15px auto; background-size:15px auto; padding-left:2.5rem; margin:0 1.5rem 1rem 0; display:block; } .online-state::before { content:''; position:absolute; left:0; top:2px; width:20px; height:16px; display:inline-block; } @media (max-width:1020px) { .modul.filter-nav { padding-top:3rem; } .modul.filter-nav { top:-13px; } .filter-nav select.filter-select { padding:0.5rem 4rem 0.5rem 0.5rem;} .filter-nav .selector .icon-box, .filter-nav .icon-box.select { width:30px; } .filter-nav .selector .icon, .filter-nav .icon-box.select .icon { width:11px; height:11px; right:12px; top:calc(50% - 5px); } .filter-nav .free-text-search .button { font-size:1.4rem; padding:0.5rem 3rem 0.5rem 2rem; } .filter-nav .free-text-search .button .icon-box.search { right:8px; -webkit-transform:scale(0.7); transform:scale(0.7); } .filter-nav .free-text-search input[type="text"] { font-size:1.4rem; padding:0.5rem; min-height:3rem; } .user-matchmaking .user-image { width:80px; min-width:inherit;} } @media (max-width:920px) { .score-box { -webkit-transform:scale(0.95) translate(3px, -5px); transform:scale(0.95) translate(3px, -5px); } .score-box span:first-of-type { font-size:1.6rem; } .user-action button.bookmark { padding:10px 10px 10px 30px; } .user-action .button { padding:10px 10px; } } @media (max-width:920px) { .user-matchmaking .matchmaking-results { width:100%; } .modul.filter-nav { font-size:1.4rem; } } @media (max-width:760px) { .modul.filter-nav { position:inherit;} .matchfilter-navi .button, .matchfilter-navi .button.reset-button { margin:0 2rem 2rem 0; } .matchfilter-navi .button.reset-button .button-label { max-width:50px; overflow:hidden; display:inline-block; height:19px; } } @media (max-width:560px) { .user-matchmaking .matchmaking-results { position:relative; display:block; } .user-action { max-width: inherit; width: auto; position: static; } .user-action-item { position: absolute; right: 1rem; top: 5rem; } .user-matchmaking .user-information { width:100%; height: auto; } .user-matchmaking .user-image { width: calc(100% - 150px); height: auto; min-height:200px; margin-bottom:1rem; } .user-matchmaking .user-information-item { margin:0;} .user-action .button { max-width:130px; margin:0 1rem 1rem 0;} .user-matchmaking .score-box { position:absolute; top:1.5rem; right:11px; } .matchfilter-navi .button.nav-tab { margin:0 0.8rem 1rem 0; font-size:1.4rem; } .matchfilter-navi .button.reset-button, .matchmaking-filter-box.filters, .filter-nav .free-text-search .button-label { display:none; } .free-text-search { margin-top:1rem; } .filter-nav .free-text-search .button { padding:0; width:35px; height:32px; } } /* @media (max-width:480px) { .user-matchmaking .matchmaking-results, .user-action-item { display:block; } .user-matchmaking .user-image { width: 100%; min-width: inherit; } .user-matchmaking .matchmaking-results { padding-top: 4rem; } .user-matchmaking .user-information { width: 100%; height: auto; } .user-matchmaking .user-status { position: relative; bottom: inherit; left: inherit; } .user-action .button { max-width:140px; margin:0 1rem 1rem 0;} }*/ @media (max-width:380px) { .filter-nav .matchfilter-navi { display:block; } .filter-nav .matchfilter-navi .button.nav-tab { display:inline-block; } } /* User Detail */ .modul.user-detail { padding:5rem 0; } .modul.user-detail .user-detail-box, .modul.user-detail ul.product-list { display:-webkit-box; display:-ms-flexbox; display:flex; } .modul.user-detail .small-box h3, .modul.user-detail .small-box p { text-align:center; max-width:760px; margin:0 auto; } .modul.user-detail .button-box { text-align:center; padding:3rem 0; } .modul.user-detail .button-box .button { display:inline-block; margin:0 0.5rem; } .modul.user-detail .user-detail-box { width:100%; margin:3rem 0; padding:1.5rem; position:relative; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .modul.user-detail .user-image { max-width:100%; min-width:150px; width:25%; margin-right:1.5rem; } .modul.user-detail .user-information { width:100%; height:inherit; } .modul.user-detail .user-information-item { height:100%; width:100%; position:relative; margin-right:1.5rem;} .modul.user-detail .user-nameset { margin-bottom:2rem; } .modul.user-detail .user-nameset strong { display:block; margin-top:0.5rem; font-size:2.2rem; } .modul.user-detail .text-box { display:block; margin-bottom:2rem; } .modul.user-detail .text-box h5 { display:block; font-size:2.2rem; margin:0; } .modul.user-detail .hashtag-box { display:block; margin-bottom:2rem; } .modul.user-detail ul.product-list { list-style-type:none; padding:0; margin:0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .modul.user-detail ul.product-list { -webkit-flex-wrap:wrap; } } .modul.user-detail ul.product-list li { position:relative; margin:0.2rem 1.5rem; } .modul.user-detail ul.product-list li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } .modul.user-detail button.bookmark { padding:10px 30px; } .modul.user-detail .button.appointment { padding:12px 56px 12px 26px; } .modul.user-detail .button.appointment .icon-box { position:absolute; right:10px; top:calc(50% - 15px);} .modul.user-detail .button.bookmark .icon-box { position:absolute; left:0; top:5px; } .modul.user-detail .score-box { position:absolute; right:1rem; top:1rem; } .modul.user-detail .user-status-freetext { display:block; margin-bottom:2rem; font-weight:bold; } .modul.user-detail .user-status { position: relative; left: inherit; bottom: inherit; display:-webkit-box; display:-ms-flexbox; display:flex; } @media (max-width:920px) { .modul.user-detail .user-detail-box { padding-top: 3rem; } } @media (max-width:620px) { .modul.user-detail .user-nameset-info { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .modul.user-detail .user-nameset-info { -webkit-flex-wrap:wrap; } } } @media (max-width:560px) { .modul.user-detail .user-detail-box { display:block; } } /* ################################################## COMPANY PAGE ################################################## */ body .company-page .hero-content .item-box, body .company-page .hero-content, .company-page .intro-box { display:-webkit-box; display:-ms-flexbox; display:flex; } body .company-page .hero-content { height:550px; min-height:100%; width:100%; position:relative; padding-bottom:0; -webkit-box-align:stretch; -ms-flex-align:stretch; align-items:stretch; } body .company-page .hero-content .item-box { position:relative; height:100%; z-index:1; } .company-page .intro-box .image-box { width:auto; } .company-page .intro-box { max-width:920px; margin:auto auto 0 auto; width:100%; padding:2rem; } .company-page .member-badge { position:absolute; right:0; top:150px; padding:0 4rem 0 0; } .company-page .intro-box img { max-width:165px; } .company-page .intro-box .text-box { margin:auto auto auto 3rem; } @media (max-width:860px) { body .company-page .hero-content { height:480px; } .company-page .member-badge { top:80px; } } @media (max-width:560px) { body .company-page .hero-content .item-box { width:100%; } .company-page .intro-box .image-box { max-width:35%; } .company-page .intro-box img { max-width:100px; } body .company-page .hero-content { height:auto; display:block; } .company-page .hero-content .bg-image { position:relative;} .company-page .hero-content .bg-image img { display:block; } .company-page .member-badge { top:16px; right:19px; } .company-page .intro-box { padding-top:5rem; } } @media (max-width:460px) { .company-page .member-badge { top:16px; left:2rem; right:inherit; } .company-page .intro-box { display:block; } .company-page .intro-box img { max-width:100%; } .company-page .intro-box .image-box, .company-page .intro-box .text-box { width:100%; margin:1rem 0 0 0; } } /* COMPANY PAGE:FAIR MAP MODUL */ .company-page .fair-map-box { padding:3rem 0; } .company-page .open-map { margin:0 auto; padding:0; display:-webkit-box; display:-ms-flexbox; display:flex; } .company-page .open-map strong { padding:0 1rem; line-height:2.6rem; text-align:left; min-width:120px; } .company-page .open-map + .image-box, .company-page .open-map .close, .company-page .open-map.active .open { display:none; } .company-page .open-map.active + .image-box { display:block; margin-top:3rem; } .company-page .open-map.active .close { display:inline-block; } .company-page .open-map .icon-box.close { width:20px; height:20px; position:absolute; right:-21px; top:2px; } .company-page .open-map .icon-box.close .icon { width:10px; left:calc(50% - 5px); } /* COMPANY PAGE:Product List / Hastag List */ .company-page ul.product-list { list-style-type:none; padding:0; margin:0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .company-page ul.product-list { -webkit-flex-wrap:wrap; } } .company-page ul.product-list li { position:relative; margin:0.2rem 1.5rem; } .company-page ul.product-list li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } /* COMPANY PAGE:About Company */ .company-page .about-company-box { margin:5rem 0; } /* COMPANY PAGE:Articel */ .company-page .article-content-box { padding:5rem 0; } .company-page .article-content-intro { display:-webkit-box; display:-ms-flexbox; display:flex; } .company-page .article-content-intro .image-box { width:calc(50% - 2rem); margin:0 auto 3rem 0 ; } .company-page .article-content-intro .text-box { width:calc(50% - 2rem); margin:0 0 3rem auto; } .company-page .article-content-box .exhibitor-content, .company-page .article-content-box .button .close, .company-page .article-content-box .button.active .open, .company-page .article-content-box .button .icon-box { display:none; } .company-page .active .exhibitor-content, .company-page .article-content-box .button.active .close { display:block; } @media (max-width:860px) { .company-page .article-content-intro { display:block; } .company-page .article-content-intro .image-box , .company-page .article-content-intro .text-box { width:100%; margin:0 0 2rem 0; min-height:210px; } } /* COMPANY PAGE:Livestreams */ .company-page .live-stream-box { padding:5rem 0; } .company-page .ls-teaser-box { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; margin-left:-2rem; width:100%; } @supports (flex-wrap:wrap) { .company-page .ls-teaser-box { -webkit-flex-wrap:wrap; } } .company-page .ls-teaser-box .stream-item { padding:2rem; width:calc(33.33333% - 2rem); margin:0 0 2rem 2rem; position:relative; background-color:#47a3d7; color:#fff; } .company-page .stream-item .button-box { text-align:center; width:100%; margin:2rem 0;} .company-page .stream-item .button-box .button { display:inline-block; } .company-page .stream-item .time-box { font-weight:bold; margin-bottom:2rem; } .company-page .stream-item .button-box.record-available { text-align:left; font-weight:bold; } @media (max-width:860px) { .company-page .ls-teaser-box { margin:0; } .company-page .ls-teaser-box .stream-item { width:100%; margin:0 0 1rem 0;} } /* COMPANY PAGE STAFF */ .company-page .staff-box { padding:5rem 0; } .company-page .staff-item-box, .company-page .staff-item, .company-page .staff-item .flex-item { display:-webkit-box; display:-ms-flexbox; display:flex; } .company-page .staff-item { width:calc(50% - 2rem); margin:0 1rem 2rem 0; min-height:310px;} .company-page .staff-item-box .staff-item:nth-child(2n+2){ margin:0 0 2rem 1rem; } .company-page .staff-item .flex-item { width:50%; position:relative; } .company-page .staff-item .image-box { width:100%; } .company-page .staff-item .flex-item .text-box { margin:auto 0; padding:2rem; } .company-page .staff-item img { display:block; } @media (max-width:860px) { .company-page .staff-item-box { display:block; } .company-page .staff-item-box .staff-item, .company-page .staff-item-box .staff-item:nth-child(2n+2) { width:100%; margin:0 0 2rem 0; min-height:210px; } } /* COMPANY PAGE:NEWS Content */ .company-page .exhibitor-masonry-box { padding:5rem 0; } .exhibitor-masonry-box .masonry, .exhibitor-masonry-box .masonry ul.product-list, .exhibitor-masonry-box .masonry-item { display:-webkit-box; display:-ms-flexbox; display:flex;} .exhibitor-masonry-box .masonry-item {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; align-self:flex-start; } .exhibitor-masonry-box .masonry { -ms-flex-wrap:wrap; flex-wrap:wrap; margin:0 0 0 -2rem; } @supports (flex-wrap:wrap) { .exhibitor-masonry-box .masonry { -webkit-flex-wrap:wrap; } } .exhibitor-masonry-box .masonry-item { overflow:hidden; margin:0 0 2rem 2rem; width:calc(25% - 2rem); -webkit-transition:all 0.2s ease; transition:all 0.2s ease; position:relative; } .exhibitor-masonry-box .masonry-item .button { border:0; padding:1.4rem 2rem 1rem 2rem; color:currentColor; position:absolute; top:0; left:0; width:100%; height:100%; z-index:2; } .exhibitor-masonry-box .masonry-item:hover { transform:scale(1.1); -webkit-box-shadow:0px 0px 10px 1px rgba(0,0,0,0.75); -moz-box-shadow:0px 0px 10px 1px rgba(0,0,0,0.75); box-shadow:0px 0px 10px 1px rgba(0,0,0,0.75); z-index:3;} .exhibitor-masonry-box .masonry-item .button-label { position:absolute; top:1.5rem; left:2rem; width:calc(100% - 6rem); text-align:left; } .exhibitor-masonry-box .masonry .text-box { padding:7rem 2rem 3rem 2rem; line-height:1.2; min-height:280px; } .exhibitor-masonry-box .masonry .product-overview-box { padding:1.5rem 2rem; order:3; } .exhibitor-masonry-box .masonry .narrow-item .image-box { order:4; } .exhibitor-masonry-box .masonry .image-box img { display:block; } .exhibitor-masonry-box .masonry .icon-box.whitepaper { position:absolute; right:1.5rem; top:0.8rem; } .exhibitor-masonry-box .masonry .icon-box.podcast { position:absolute; right:1.5rem; top:1.5rem; } .exhibitor-masonry-box .masonry .icon-box.read { position:absolute; right:2.5rem; top:1.5rem; -webkit-transform:scale(1.2); transform:scale(1.2); } .exhibitor-masonry-box .masonry .icon-box.play-movie { position:absolute; right:1.5rem; top:1rem; width:30px; height:23px; background-color:transparent; } .exhibitor-masonry-box ul.product-list { display:block; list-style-type:none; padding:0; margin:0 0 2rem 0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .exhibitor-masonry-box ul.product-list { -webkit-flex-wrap:wrap; } } .exhibitor-masonry-box ul.product-list li { position:relative; margin:0.2rem 1.5rem; } .exhibitor-masonry-box ul.product-list li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } .exhibitor-masonry-box .button-box { text-align:center;margin:3rem 0; } .exhibitor-masonry-box .button-box .button { display:inline-block; } @media (max-width:960px) { .exhibitor-masonry-box .masonry { margin-left:-1rem; } .exhibitor-masonry-box .masonry-item { width:calc(33.33333% - 1rem); margin:0 0 1rem 1rem;} } @media (max-width:760px) { .exhibitor-masonry-box .masonry-item { width:calc(50% - 1rem); margin:0 0 1rem 1rem;} } @media (max-width:460px) { .exhibitor-masonry-box .masonry-item:hover {transform:scale(1); -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none;} .exhibitor-masonry-box .masonry { margin-left:0; } .exhibitor-masonry-box .masonry-item { width:100%; margin:0 0 1rem 0; } } /* COMPANY PAGE:SUB Editors */ .sub-editors { padding:5rem 0; } .sub-editors .logo-gallery { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .sub-editors .sorting-box { -webkit-flex-wrap:wrap; } } .sub-editors .logo-gallery .logo-item { max-width:200px } /* COMPANY PAGE:Footer */ .footer-content-box { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; width:100%; padding-bottom:3rem; } .footer-content-box .text-box { width:360px; padding:0 3rem 6rem 0; position:relative; } .footer-content-box .flex-item { width:calc(100% - 360px); } .company-page .site-footer { padding:2rem 0 0 0; } .company-page .footer-meta-box { margin-bottom:0;} .company-page .site-footer .footer-nav { position:absolute; bottom:0; left:0;} .company-page .site-footer .footer-nav a { margin-left:0; margin-right:4rem;} body.bd-company #colophon.site-footer { display:none; } @media (max-width:860px) { .footer-content-box { display:block; } .footer-content-box .text-box { width:100%; } .footer-content-box .flex-item { width:100%; margin:2rem 0 2rem 0; } } /* ################################################## USER LOGIN PAGE ################################################## */ .login-home .form-box, .login-home .modul-intro-text .text-box { max-width:560px; margin:0 auto; padding:2rem; } .status-state .field-item { display:block; min-height:30px; } .modul-start-login .form-row { display:-webkit-box; display:-ms-flexbox; display:flex; } .status-state .field-item:first-of-type { margin-right:2rem; } .login-input .field-item:first-of-type { flex:1; margin-right:1rem; } .login-input .call-to-action { margin:auto 0 0 0;} .login-input .info-text { width:100%; margin:2rem 0 0 0; } @media (max-width:480px) { .login-home .field-item { width:100%; margin-bottom:1rem; } .login-input .field-item:first-of-type { margin-right:0; } .login-input .call-to-action { margin:0 0 0 auto; } .modul-start-login .form-row { -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .modul-start-login .form-row { -webkit-flex-wrap:wrap; } } } /* ################################################## Exhibitor LOGIN PAGE ################################################## */ .exhibitor-login .form-box { margin-top:5rem; } .exhibitor-login .button-box .button { margin:0 1rem 1rem 0;} .exhibitor-login .button-box .logout-link { opacity:0.5; } .exhibitor-login .button-box .logout-link:hover { opacity:1; } /* ################################################## GENERAL DEFINTITON: • OPEN CLOSE SELECTORS FOR QUESTIONS AND TOPICS, • BUTTONS • UPLOADS FILE TYPES ################################################## */ .block-label.selector, .block-label.selector.active + .hashtag-box { display:-webkit-box; display:-ms-flexbox; display:flex; } .block-label.selector { font-weight:700; cursor:pointer; display:flex; padding:0.5rem 5rem 0.5rem 1rem; position:relative; min-height:5rem; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; border-style:solid; border-width:1px 1px 0 1px; } .block-label.selector span { margin:auto 0; } .block-label.selector + .hashtag-box { display:none; } .block-label.selector.active + .hashtag-box { position:relative; z-index:100; width:100%; padding:1rem; border-style:solid; border-width:0 1px 1px 1px; } @media (min-width:790px) { .block-label.selector.active + .hashtag-box { position:absolute; } } /* tooltips */ .tooltip { display:none; position:absolute; top :22px; right:-2rem; z-index:22; padding:2rem; width:560px; } .open-tooltip:hover + .tooltip { display:block; } /* delete buttons */ .button.delete { border-radius:0; border:0; padding:0; } /* Uploads for Images */ .upload-container { position:relative; } .upload-container .image-preview { min-height:150px; max-width:160px; display:-webkit-box; display:-ms-flexbox; display:flex;} .upload-container .no-preview-image { width:150px; height:150px; border-radius:50%; overflow:hidden;} .upload-container .image-preview .image-box { width:auto; margin:auto 0; } .image-preview img { max-width:150px; min-width:150px; width:auto; height:auto; display:block; margin:auto 0; } .label-fileupload { position:absolute; width:100%; height:100%; max-width:390px; top:0; left:0; z-index:2; cursor:pointer; } .label-fileupload strong { font-weight:400; position:relative; padding-left:160px; padding-right:45px; padding-top:66px; display:block; } .ext-data-title { position:static; top:inherit; left:inherit; display:inline-block; padding-left:160px; } .label-fileupload .icon-box.upload { right:0; margin-top:-8px;} .label-fileupload .icon-box.checkmark { top:0; left:112px; transform:scale(0.8) } .data-title { position:absolute; } .ext-data-title::after { content:''; position:absolute; top:0; left:0; width:150px; height:100%; z-index:2; } .no-preview::after, .data-title:empty, .ext-data-title:empty, .ext-data-title:empty + .icon-box.checkmark { display:none; } .upload-container [type="file"] { border:0; clip:rect(0, 0, 0, 0); height:1px; overflow:hidden; padding:0; position:absolute !important; white-space:nowrap; width:1px; } /* Delete Link */ .delete.delete-item { display:inline-block; padding:12px 45px 12px 0; text-decoration:none; position:relative; z-index:11;} .delete.delete-item span.label { text-decoration:underline;} /* MIn. Size CK Editor */ .field-item .ck.ck-editor { width:100%; } .field-item .ck.ck-content { min-height:250px; } /* ################################################## USER EDITOR:STEP NAVIGATION ################################################## */ .step-navigation .step-box, .step-navigation .item-box, .step-content, .backend-editor .form-row, .backend-editor .button-box { display:-webkit-box; display:-ms-flexbox; display:flex; } .step-content { width:100%; } .backend-editor { margin:3rem 0 6rem; } .step-navigation .step-box { margin:3rem auto; min-height:100px; } .step-item { margin:0 3rem; position:relative; padding-bottom:0.5rem; } .step-item span { display:inline-block; position:relative; padding-bottom:5px; } .step-item a { position:relative; } .step-item.active span::after { content:''; position:absolute; bottom:0; width:80%; height:3px; left:10%; } .step-item a::before { content:'01'; position:absolute; bottom:-8rem; width:55px; height:55px; text-align:center; line-height:56px; letter-spacing:-1px; font-weight:bold; font-size:2.4rem; border-radius:50%; left:calc(50% - 27px); z-index:2; } .step-item::after { content:''; position:absolute; left:50%; height:3px; width:150%; bottom:26px; z-index:0; } .step-item:nth-of-type(2) a::before { content:'02'; } .step-item:nth-of-type(3) a::before { content:'03'; } .step-item:nth-of-type(4) a::before { content:'04'; } .step-item:nth-of-type(5) a::before { content:'05'; } .step-item:nth-of-type(6) a::before { content:'06'; } .step-item:nth-of-type(7) a::before { content:'07'; } .step-item:last-of-type::after { display:none; } .backend-editor .single-row-item .field-item { width:100%; } .backend-editor .button-box { max-width:660px; margin:5rem auto 0 auto; } .backend-editor .button-box .field-item:nth-of-type(2) { margin:0 0 0 auto;} .backend-editor .button-box .field-item:only-of-type { margin:0 0 0 auto; } .backend-editor .field-item.question-item { z-index:inherit; } @media (max-width:860px) { .step-item { margin:0px 1rem; } .step-item a::before { width:40px; height:40px; line-height:42px; font-size:1.6rem; left:calc(50% - 23px); bottom:-6rem; } .step-item::after { width:122%; bottom:38px; z-index:0; } } @media (max-width:680px) { .step-navigation .step-box { display:block; margin:3rem 0; min-height:inherit;} .step-navigation .step-box .step-item { display:inline-block; } .step-item::after { display:none; } .step-item { margin:0 1rem 1rem 0; } .step-item a { display:-webkit-box; display:-ms-flexbox; display:flex; text-decoration:none; padding:0 0 0 3rem; } .step-item a:before { bottom:5px; width:25px; height:25px; line-height:27px; letter-spacing:0; font-size:1.2rem; left:0; top:-4px; } } /* ################################################## USSER EDITOR:STEP 1 - PERSONAL DATA ################################################## */ .backend-editor.step-1 .form-box { max-width:860px; margin:0 auto; } .backend-editor.step-1 .salutation-box .field-item:first-of-type { margin-right:2rem; } /* ################################################## USSER EDITOR:STEP 2 - YOUR PROFESSIONAL DATA ################################################## */ .backend-editor.step-2 .company-box .field-item { min-width:calc(50% - 1rem); } .backend-editor.step-2 .question-box, .backend-editor.step-2 .topic-box { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -ms-flex-wrap:wrap; flex-wrap:wrap; } .backend-editor.step-2 .form-row.hashtag-box { width:100%; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .backend-editor.step-2 .question-box, .backend-editor.step-2 .topic-box, .backend-editor.step-2 .form-row.hashtag-box { -webkit-flex-wrap:wrap; } } .backend-editor.step-2 .question-box .question-item { width:calc(50% - 1rem); margin-bottom:2rem; } .backend-editor.step-2 .question-box .field-item-wrapper, .backend-editor.step-2 .form-row.hashtag-box .field-item { width:100%; } .backend-editor.step-2 .form-row.topic-box .field-item { width:calc(33.33333% - 1rem); } .backend-editor.step-2 .description { display:block; font-weight:400; font-size:1.2rem; line-height:1.3; } .backend-editor.step-2 h3 { margin:0; } .backend-editor.step-2 .free-text { margin-top:1rem; } .backend-editor.step-2 .topic-box label { padding-top:0.5rem; } @media (max-width:980px) { .backend-editor.step-2 .form-row.topic-box .field-item { width:calc(50% - 1rem); } } @media (max-width:790px) { .backend-editor.step-2 .company-box .field-item, .backend-editor.step-2 .question-box .question-item { width:100%; margin-bottom:2rem; } } @media (max-width:660px) { .backend-editor.step-2 .form-row.topic-box .field-item { width:100%; margin-bottom:0; } } /* ################################################## USSER EDITOR:STEP 3 - YOUR PROFESSIONAL DATA ################################################## */ .backend-editor.step-3 .form-box { max-width:660px; margin:0 auto; } .backend-editor.step-3 .tooltip { right:inherit; max-width:350px; right:-17px; top:24%; } .backend-editor.step-3 .approval-box label { font-size:2.4rem; font-weight:700; padding-top:5px; } .backend-editor.step-3 .short-description-box .block-label { font-weight:bold; margin-bottom:1rem; display:block; } .backend-editor.step-3 .short-description-box .description { font-weight:400; font-size:1.2rem; display:block; } .backend-editor.step-3 .short-description-box .field-item { display:block; } .backend-editor.step-3 .approval-box {position:relative; z-index:4;} .backend-editor.step-3 .approval-box .position-box, .backend-editor.step-3 .approval-box .short-description-box { position:relative; z-index:2; } /* ################################################## USSER EDITOR:STEP 4 - MATCHMAKING ################################################## */ .backend-editor.step-4 .intro-box, .backend-editor.step-4 .matchmaking-activate { max-width:660px; margin:0 auto; } .backend-editor.step-4 .matchmaking-activate label.checkbox-label { padding:0 0 1.2rem 4.5rem; } .backend-editor.step-4 .no-matchmaking, .backend-editor.step-4 .active + .matchmaking-box { width:100%; display:block; padding-top:3rem; } .backend-editor.step-4 .field-item-wrapper { width:100%; display:block; } .backend-editor.step-4 .active .no-matchmaking, .backend-editor.step-4 .matchmaking-box { display:none; } .backend-editor.step-4 .profil-box { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .backend-editor.step-4 .profil-box .field-item { width:calc(50% - 1rem); } .backend-editor.step-4 .profil-image-box .block-label { font-weight:bold; margin-bottom:1rem; display:block; } .backend-editor.step-4 .description { font-weight:400; font-size:1.2rem; display:block; } .backend-editor.step-4 .info-text { margin-bottom:1rem; } .backend-editor.step-4 .questions-box { display:block; } .backend-editor.step-4 .questions-box .field-item-wrapper { margin-bottom:1rem; } .backend-editor.step-4 .questions-box .hashtag-box { width:100%; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .backend-editor.step-4 .questions-box .hashtag-box { -webkit-flex-wrap:wrap; } } .backend-editor.step-4 .questions-box .field-item { width:100%; } .backend-editor.step-4 .text-editor-box { padding-top:3rem; } .backend-editor.step-4 .text-editor-box { min-height:300px; } .backend-editor.step-4 textarea { height:250px; } @media (max-width:790px) { .backend-editor.step-4 .profil-box { display:block; } .backend-editor.step-4 .profil-box .field-item { width:100%; } .backend-editor.step-4 .profil-image-box { margin-bottom:4rem; } } @media (max-width:660px) { .backend-editor.step-4 .form-row.topic-box .field-item { width:100%; margin-bottom:0; } } /* ################################################## USSER EDITOR:STEP 5 - Preview ################################################## */ .backend-editor.step-5 h3 { margin:0; } .backend-editor.step-5 h5 { margin:3rem 0 0 0;} .backend-editor.step-5 .checkmark-box { position:relative; margin-top:-1rem; display:inline-block; padding:1rem 5rem 0rem 0; } .backend-editor.step-5 .preview-box { padding-top:1.5rem; } .backend-editor.step-5 .user-profile-data, .backend-editor.step-5 .user-text-data, .backend-editor.step-5 .company-profile-data, .backend-editor.step-5 .company-text-data, .backend-editor.step-5 ul.hashtag { display:-webkit-box; display:-ms-flexbox; display:flex;} .backend-editor.step-5 .user-image-data, .backend-editor.step-5 .company-user-image-data { margin-right:1rem; } .backend-editor.step-5 .user-image-preview { max-width:150px; } .backend-editor.step-5 .user-text-data p, .backend-editor.step-5 .company-text-data p { margin:auto 0; } .backend-editor.step-5 .user-text-data .preview-text-label { display:block; } .backend-editor.step-5 .company-text-data > div { margin:auto 0; } .backend-editor.step-5 ul.hashtag { list-style-type:none; padding:0; margin:0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .backend-editor.step-5 ul.hashtag { -webkit-flex-wrap:wrap; } } .backend-editor.step-5 ul.hashtag li { position:relative; margin:0.2rem 1.5rem; } .backend-editor.step-5 ul.hashtag li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } /* ################################################## Exhibitor Company Space EDITOR: ################################################## */ .exhibitor-editor .form-box { position:static; } .exhibitor-editor #sticky-box, .exhibitor-editor-tabs .tab-box, .exhibitor-editor .form-row, .exhibitor-editor ul.product-list { display:-webkit-box; display:-ms-flexbox; display:flex; } .exhibitor-editor #sticky-box { position:fixed; top:2.5rem; padding-left:35rem; z-index:30; -webkit-transition:all 0.3s ease; transition:all 0.3s ease;} .scroll-box .exhibitor-editor #sticky-box { top:0.2rem; } .exhibitor-editor #sticky-box .button { margin:0.5rem 1rem 0.5rem 0; } @media (max-width:960px) { .exhibitor-editor #sticky-box { top:0.2rem; padding-left:9rem;left:inherit; right:1rem; } .exhibitor-editor #sticky-box .button { padding:3px 20px 3px 10px; } .exhibitor-editor #sticky-box .button.previous { padding:3px 10px 3px 20px; } .exhibitor-editor #sticky-box .button .icon-box { top:calc(50% - 0px); right:1px; transform:scale(0.7); } .exhibitor-editor #sticky-box .button.previous .icon-box { right:inherit; left:1px; transform:scale(0.7) rotate(180deg)} } @media (max-width:560px) { .exhibitor-editor #sticky-box, .scroll-box .exhibitor-editor #sticky-box { top:7rem; padding-left:0; left:2rem; right:inherit; position:absolute; z-index:1; display:block; } .exhibitor-editor #sticky-box button { display:block; min-width:200px;} } .exhibitor-editor-tabs { padding-top:3rem; } .exhibitor-editor-tabs .tab-item { margin-right:5px; position:relative; } .exhibitor-editor-tabs .tab-item a { display:block; width:100%; height:100%; padding:1rem 5rem; text-decoration:none; } .exhibitor-editor-tabs .tab-item::after { content:''; width:100%; position:absolute; bottom:0; left:0; display:block; z-index:11; height:5px; } .exhibitor-editor-tabs .tab-item.active::after { display:none; } .exhibitor-editor-tabs .tab-item.active a { pointer-events:none; } @media (max-width:560px) { .exhibitor-editor-tabs .tab-item a { padding:1rem; } } .company-data-intro { padding:5rem 0; } .exhibitor-editor .accordion-box { margin-bottom:2rem; } .exhibitor-editor .selector { position:relative; border:1px solid currentColor; padding:0.5rem 5rem 0.5rem 3rem; cursor:pointer; margin:0; width:100%; } .exhibitor-editor .selector .description { display:block; font-size:1.2rem; font-weight:400;margin:0; } .exhibitor-editor .accordion-content { display:none; width:100%; } .exhibitor-editor .selector.active + .accordion-content { display:block; position:relative; padding:3rem; margin-top:-1px; border-style:solid; border-width:0 1px 1px 1px; border-style:currentColor; } .exhibitor-editor .block-label, .exhibitor-editor .block-label { font-weight:bold; margin-bottom:1rem; display:block; width:100%; } .exhibitor-editor .block-label .description, .exhibitor-editor .block-label .description { font-weight:400; font-size:1.2rem; display:block; } .exhibitor-editor .td-delete { max-width:45px; } .exhibitor-editor .master-title { font-weight:bold; } @media (max-width:660px) { .accordion-content .admin-user-table { width:100%; } .accordion-content .admin-user-table tr { position:relative;} .accordion-content .admin-user-table td { display:block; padding-right:5rem; margin-top:-1px; } .accordion-content .admin-user-table td .delete { position:absolute; top:1px; right:1px; width:40px; padding:0; min-width:40px; height:calc(100% - 2px); border-left:1px solid; } .accordion-content .admin-user-table td:last-of-type { padding:0; border:0; } } @media (max-width:380px) { .exhibitor-editor .selector { padding:0.5rem 5rem 0.5rem 1rem; } .exhibitor-editor .selector.active + .accordion-content { padding:1rem; } } /* Company Information */ .exhibitor-editor .image-upload-box .field-item { width:calc(50% - 1rem); margin:0 0 2rem 0; } .exhibitor-editor .image-upload-box .company-headerimage-item { margin-left:auto; } .exhibitor-editor .company-data-box { -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;} @supports (flex-wrap:wrap) { .exhibitor-editor .company-data-box { -webkit-flex-wrap:wrap; } } .exhibitor-editor .company-data-box .field-item { width:calc(33.33333% - 1rem); margin:0 0 2rem} .exhibitor-editor .company-categories-item { display:block; } .exhibitor-editor .company-googlemaps-item .open-tooltip { right:-14px; } .exhibitor-editor .company-activities-item { width:100%; } .exhibitor-editor ul.product-list { list-style-type:none; padding:0; margin:0; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .exhibitor-editor ul.product-list { -webkit-flex-wrap:wrap; } } .exhibitor-editor ul.product-list li { position:relative; margin:0.2rem 1.5rem; } .exhibitor-editor ul.product-list li:before { content:'#'; font-weight:700; position:absolute; left:-1.5rem; display:inline-block; } @media (max-width:860px) { .exhibitor-editor .image-upload-box { display:block; } .exhibitor-editor .image-upload-box .field-item { width:100%; } .exhibitor-editor .company-data-box .field-item { width:100%; } } /* Exhibitor Company Space Admin */ .exhibitor-editor .add-companyadmin-box .field-item { margin:0 2rem 2rem 0; } .exhibitor-editor .button-box { display:-webkit-box; display:-ms-flexbox; display:flex; } .exhibitor-editor .add-companyadmin-box .button.add-item { padding:0; border:0; border-radius:0; width:45px; height:100%; } @media (max-width:860px) { .exhibitor-editor .add-companyadmin-box { display:block; } .exhibitor-editor .add-companyadmin-box .field-item { margin:0 0 2rem 0; width:100%; } .exhibitor-editor .image-upload-box .field-item { width:100%; } .exhibitor-editor .company-data-box .field-item { width:100%; } .exhibitor-editor .add-companyadmin-box .button.add-item { height:45px; } } /* Digital Contact Admin */ .exhibitor-editor .add-digitalcontact-box .field-item { margin:0 2rem 2rem 0; } .exhibitor-editor .add-digitalcontact-box .button.add-item { padding:0; border:0; border-radius:0; width:45px; height:100%; } @media (max-width:860px) { .exhibitor-editor .add-digitalcontact-box { display:block; } .exhibitor-editor .add-digitalcontact-box .field-item { margin:0 0 2rem 0; width:100%; } .exhibitor-editor .add-digitalcontact-box .button.add-item { height:45px; } } .exhibitor-editor .button-box { margin-bottom:5rem; } .exhibitor-editor .button-box .field-item:nth-of-type(2) { margin:0 0 0 auto; } @media (max-width:560px) { .exhibitor-editor .button-box { display:block; } .exhibitor-editor .button-box .field-item, .exhibitor-editor .button-box .field-item:nth-of-type(2) { margin:0 0 1rem 0; } .exhibitor-editor .button-box { min-width:120px; } } /* Video Uploads */ .exhibitor-editor .uploaded-video-box, .exhibitor-editor .video-description-item, .exhibitor-editor .topics-select-box .selector.active + .hashtag-box { display:-webkit-box; display:-ms-flexbox; display:flex; } .exhibitor-editor .label-fileupload.movie-upload { position:relative; width:auto; height:auto; min-width:inherit; max-width:inherit; display:inline-block;} .exhibitor-editor .label-fileupload.movie-upload .button { padding:1rem 5rem 1rem 1rem; } .exhibitor-editor .label-fileupload.movie-upload .icon-box.upload { top:5px; margin:0; } .exhibitor-editor .label-fileupload.movie-upload .ext-data-title { padding-left:1rem; } .exhibitor-editor .label-fileupload.movie-upload .ext-data-title::after { display:none; } .exhibitor-editor .uploaded-video-box { -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .exhibitor-editor .uploaded-video-box { -webkit-flex-wrap:wrap; } } .exhibitor-editor .uploaded-video-box span { padding:1.1rem 0 1.1rem 1rem; } .exhibitor-editor .uploaded-video-box .video-file-name { padding:1.1rem 0 1.1rem 0; } .exhibitor-editor .uploaded-video-box .delete { padding:0 0 0 1rem; margin-top:-6px; } .exhibitor-editor .youtube-video-items .block-label { margin-bottom:0; min-width:250px; } .exhibitor-editor .youtube-id { width:100%; } .exhibitor-editor .spacer-items { margin-bottom:2rem; } .exhibitor-editor .video-headline-item { width:100%; margin-top:3rem;} .exhibitor-editor .video-headline-item .field-item { width:100%; } .exhibitor-editor .video-description-item { width:100%; margin-top:3rem; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .exhibitor-editor .video-description-item .field-item { width:calc(50% - 2rem); display:block; } .exhibitor-editor .topics-select-box .field-item { width:calc(50% - 2rem); display:block; } .exhibitor-editor .topics-select-box .selector { padding-left:1rem; z-index:4;} .exhibitor-editor .topics-select-box .selector.active { border-bottom-color:transparent;} .exhibitor-editor .topics-select-box .selector + .hashtag-box { display:none; width:calc(200% + 4rem); margin-top:-11px; z-index:3; border-top-width:1px; } .exhibitor-editor .topics-select-box .selector.active + .hashtag-box { -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;} @supports (flex-wrap:wrap) { .exhibitor-editor .topics-select-box .hashtag-box { -webkit-flex-wrap:wrap; } } .exhibitor-editor .topics-select-box .selector + .hashtag-box .field-item { width:calc(33.33333% - 2rem); } @media (max-width:980px) { .exhibitor-editor .topics-select-box .selector + .hashtag-box .field-item { width:calc(50% - 2rem); } } @media (max-width:860px) { .exhibitor-editor .video-intregration-content .form-row { display:block;} .exhibitor-editor .video-intregration-content .field-item { margin-bottom:3rem; } .exhibitor-editor .video-intregration-content .form-row .hashtag-box { display:none; position:relative;} .exhibitor-editor .video-intregration-content .selector.active + .hashtag-box { display:-webkit-box; display:-ms-flexbox; display:flex; width:100%; } .exhibitor-editor .video-intregration-content .field-item { width:100%; } } @media (max-width:620px) { .exhibitor-editor .topics-select-box .selector + .hashtag-box .field-item { width:100%; } } /* Podcast Uploads */ .exhibitor-editor .podcast-headline-item { width:100%; margin-top:3rem;} .exhibitor-editor .podcast-headline-item .field-item { width:100%; } .exhibitor-editor .podcast-description-item { width:100%; margin-top:3rem; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .exhibitor-editor .podcast-description-item .field-item { width:calc(50% - 2rem); display:block; } @media (max-width:860px) { .exhibitor-editor .podcast-intregration-content .form-row { display:block;} .exhibitor-editor .podcast-intregration-content .field-item { margin-bottom:3rem; } .exhibitor-editor .podcast-intregration-content .form-row .hashtag-box { display:none; position:relative;} .exhibitor-editor .podcast-intregration-content .selector.active + .hashtag-box { display:-webkit-box; display:-ms-flexbox; display:flex; width:100%; } .exhibitor-editor .podcast-intregration-content .field-item { width:100%; } } /* Pdf Uploads */ .exhibitor-editor .label-fileupload.pdf-upload { position:relative; width:auto; height:auto; min-width:inherit; max-width:inherit; display:inline-block;} .exhibitor-editor .label-fileupload.pdf-upload .button { padding:1rem 5rem 1rem 0; } .exhibitor-editor .label-fileupload.pdf-upload .icon-box.upload { top:5px; margin:0; } .exhibitor-editor .label-fileupload.pdf-upload .ext-data-title { padding-left:1rem; } .exhibitor-editor .label-fileupload.pdf-upload .ext-data-title::after { display:none; } .exhibitor-editor .uploaded-pdf-box span { padding:1.1rem 0 1.1rem 1rem; } .exhibitor-editor .uploaded-pdf-box .pdf-file-name { padding:1.1rem 0 1.1rem 0; } .exhibitor-editor .uploaded-pdf-box .delete { padding:0 0 0 1rem; margin-top:-6px; z-index:1;} .exhibitor-editor .whitepaper-upload-box .upload-container .description { display:block; font-size:1.2rem; } .exhibitor-editor .whitepaper-headline-item { width:100%; margin-top:3rem;} .exhibitor-editor .whitepaper-headline-item .field-item, .exhibitor-editor .whitepaper-title-box .field-item { width:100%; } .exhibitor-editor .whitepaper-box { width:100%; margin-top:3rem; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .exhibitor-editor .whitepaper-box .whitepaper-item { position:relative; width:calc(50% - 2rem); display:block; } .exhibitor-editor .uploaded-pdf-box { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; min-height:60px;} .exhibitor-editor .whitepaper-box .whitepaper-item:nth-of-type(1)::after { content:''; position:absolute; right:-20px; top:-5px; width:1px; height:calc(100% + 3px); } .exhibitor-editor .whitepaper-box .whitepaper-item::before { content:''; position:absolute; top:-11px; left:0; height:1px; width:100%;} .exhibitor-editor .whitepaper-box:nth-of-type(1) .whitepaper-item::before { display:none;} @supports (flex-wrap:wrap) { .exhibitor-editor .uploaded-video-box { -webkit-flex-wrap:wrap; } } .exhibitor-editor .uploaded-pdf-box span { padding:1.1rem 1rem 1.1rem 0; } .exhibitor-editor .uploaded-pdf-box .video-file-name { padding:1.1rem 0 1.1rem 0; } .exhibitor-editor .whitepaper-box .topics-select-box .field-item { width:100%; display:block; } .exhibitor-editor .whitepaper-integration-content .topics-select-box .selector + .hashtag-box { width:100%; } .exhibitor-editor .whitepaper-integration-content .topics-select-box .selector + .hashtag-box .field-item { width:calc(50% - 1rem); } @media (max-width:1080px) { .exhibitor-editor .whitepaper-integration-content .topics-select-box .selector + .hashtag-box .field-item { width:100%; } } @media (max-width:760px) { .exhibitor-editor .whitepaper-integration-content .form-row { display:block; margin-top:0;} .exhibitor-editor .whitepaper-integration-content .form-row .hashtag-box { display:none; position:relative;} .exhibitor-editor .whitepaper-integration-content .selector.active + .hashtag-box { display:-webkit-box; display:-ms-flexbox; display:flex; width:100%; } .exhibitor-editor .whitepaper-integration-content .whitepaper-item { width:100%; margin-top:4rem; } .exhibitor-editor .whitepaper-box:nth-of-type(1) .whitepaper-item:nth-of-type(1) { margin-top:0; } .exhibitor-editor .whitepaper-box .whitepaper-item:nth-of-type(1)::after, .exhibitor-editor .whitepaper-box:nth-of-type(1) .whitepaper-item:nth-of-type(1)::before { display:none;} .exhibitor-editor .whitepaper-box .whitepaper-item::before { top:-17px; } .exhibitor-editor .whitepaper-box:nth-of-type(1) .whitepaper-item::before { display:block ;} } /* Exhibitor Article */ .exhibitor-editor .arcticle-integration-content .arcticle-headline-item { width:100%; } .exhibitor-editor .arcticle-content-box { width:100%; margin-top:3rem; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .exhibitor-editor .arcticle-content-box .field-item { position:relative; width:calc(50% - 2rem); display:block; } @media (max-width:760px) { .exhibitor-editor .arcticle-content-box .form-row { display:block; margin-top:0;} .exhibitor-editor .arcticle-content-box .form-row .hashtag-box { display:none; position:relative;} .exhibitor-editor .arcticle-content-box .selector.active + .hashtag-box { display:-webkit-box; display:-ms-flexbox; display:flex; width:100%; } .exhibitor-editor .arcticle-content-box .field-item { width:100%; margin-top:4rem; } .exhibitor-editor .arcticle-integration-content .topics-select-box .field-item, .exhibitor-editor .topics-select-box .selector + .hashtag-box { width:100%; } } @media (max-width:620px) { .exhibitor-editor .arcticle-integration-content .topics-select-box .selector + .hashtag-box .field-item { width:100%; } } /* Virtual think Tank */ .exhibitor-editor .event-place-box .event-place-description { margin:auto 3rem; } .exhibitor-editor .event-place-box .event-place-description p { margin:0; } @media (max-width:760px) { .exhibitor-editor .virtual-thinktank-content .form-row { display:block; margin-top:0;} } /* Leads & Analytics */ .leads-and-analytics-box { padding:5rem 0; } .leads-intro-box .leads-headline-item, .leads-intro-box, .leads-intro-box .leads-download-buttons { display:-webkit-box; display:-ms-flexbox; display:flex; } .leads-intro-box .leads-headline-item { width:100%; } .leads-intro-box .leads-headline-item { margin:0 2rem 2rem 0; } .leads-intro-box .leads-headline-item h4 { margin:auto 0; } .leads-intro-box .leads-download-buttons { width:100%; margin:0 0 2rem 0; } .leads-intro-box .leads-download-buttons .button { margin:auto 1rem auto 0; padding-right:5rem; } .leads-intro-box .leads-download-buttons .button .icon-box.download { right:1rem; } .analytics-table table td:last-of-type { width:52px; } /* ################################################## FOOTER - LIVE:Metafooter ################################################## */ .footer-meta-box { position:relative; margin-top:-2rem; margin-bottom:2rem; } .site-footer .footer-meta-box .item-box { display:block; position:relative; z-index:3; padding:4rem 0 1rem 0; } .footer-meta-box .footer-text-box { max-width:760px; } .footer-logo { max-width:320px; width:100%; width:100%; display:block; margin-bottom:2rem;} .social-links { list-style-type:none; margin:0 0 3rem 0; padding:0; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .social-links { -webkit-flex-wrap:wrap; } } .social-links li { margin:0 1rem 1rem 0; padding:0; } .social-links li .icon-box { display:-webkit-box; display:-ms-flexbox; display:flex; width:50px; height:50px; border-radius:50%; background-color:#47a3d7; color:#fff; border-style:solid; border-width:2px; } .social-links li .icon-box svg { width:28px; height:auto; margin:auto; } .social-links li .icon-box svg path { fill:currentColor; } .social-links .icon-label { display:none; } /* ################################################## FOOTER - SITEFOOTER ################################################## */ .site-footer { padding:2rem 0; position:relative; z-index:20; } .site-footer .totop { position:absolute; top:-25px; left:calc(50% - 25px); width:50px; height:25px; border-top-left-radius:100px; border-top-right-radius:100px; overflow:hidden;} .site-footer .totop .icon-box.arrow { width:100%; height:200%; border-radius:50%; border-width:2px; border-style:solid; } .site-footer .totop .icon-box.arrow .icon { top:calc(50% - 12px); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); } .site-footer .copyright { display:block; } .site-footer .footer-nav { margin:1rem 0; width:100%; } .site-footer .footer-nav a { margin-right:4rem; text-decoration:none; display:block; } @media (min-width:580px) { .site-footer .footer-nav { margin:1rem 0; display:-webkit-box; display:-ms-flexbox; display:flex; width:100%; } } @media (min-width:890px) { .site-footer .item-box { display:-webkit-box; display:-ms-flexbox; display:flex; } .site-footer .copyright { margin:auto auto auto 0; } .site-footer .footer-nav { margin:auto 0 auto auto; width:auto; } .site-footer .footer-nav a { margin-left:4rem; margin-right:inherit;} } /* ################################################## OVERLAYS / POPUP WINDOWS ################################################## */ .overlay { position:fixed; top:0; left:0; height:100vh; width:100%; z-index:110; display:none; overflow:auto; } .overlay .tx-exhibitor { width:100%; height:100%; } .overlay .item-box { position:relative; padding:7rem 0; } .overlay-container { width:100%; } .overlay.active { display:flex; } .overlay.active .swiper-lazy-preloader { margin:auto; } #saves.overlay { z-index:19; } #saves .swiper-lazy-preloader { top:200px; } .overlay .overlay-title { position:relative; display:inline-block; padding-right:5rem; margin-bottom:1rem; } .overlay .icon-box.play-movie { position:absolute; right:0; top:calc(50% - 11px); width:30px; height:23px; } .overlay .icon-box.podcast { position:absolute; right:0; top:calc(50% - 8px); } .overlay .icon-box.whitepaper { position:absolute; right:0; top:calc(50% - 14px); } .overlay-content-box, .podcast-content-box { display:-webkit-box; display:-ms-flexbox; display:flex; margin:2rem 0; } .whitepaper-content-box .button-box .button { display:inline-block;padding-right:5rem; } .whitepaper-content-box .icon-box.download { top:calc(50% - 20px); } .overlay-content-box .image-item, .podcast-content-box .image-item { max-width:360px; } .overlay-content-box .text-box, .podcast-content-box .text-box { width:100%; } .overlay .icon-box.enlarge, .overlay .position-button { display:none; } .overlay .position-button { border:2px solid; border-radius:50%; border-color:currentColor; width:50px; height:50px; position:absolute; } .overlay .position-button .icon-box.arrow { width:100%; height:100%; border-radius:50%; background-color:transparent; } .overlay .position-top { left:calc(50% - 25px); top:0; -webkit-transform:scale(0.5)translate(0, -18px) ; transform:scale(0.5)translate(0, -18px) ; } .overlay .position-top .icon-box { -webkit-transform:rotate(-45deg) translate(-2px, 2px); transform:rotate(-45deg) translate(-2px, 2px); } .overlay .position-bottom { left:calc(50% - 25px); bottom:0; -webkit-transform:scale(0.5) translate(0, 18px); transform:scale(0.5) translate(0, 18px); } .overlay .position-bottom .icon-box { -webkit-transform:rotate(135deg) translate(-2px, 2px); transform:rotate(135deg) translate(-2px, 2px); } .overlay .position-left { left:0; top:calc(50% - 25px); -webkit-transform:scale(0.5) translate(-18px, 0); transform:scale(0.5) translate(-18px, 0); } .overlay .position-left .icon-box { -webkit-transform:rotate(-135deg) translate(-2px, 2px); transform:rotate(-135deg) translate(-2px, 2px); } .overlay .position-right { right:0; top:calc(50% - 25px); -webkit-transform:scale(0.5) translate(18px, 0); transform:scale(0.5) translate(18px, 0); } .overlay .position-right .icon-box { -webkit-transform:rotate(45deg) translate(-2px, 2px); transform:rotate(45deg) translate(-2px, 2px); } .overlay .close-overlay { position:absolute; top:1rem; right:1rem; } .overlay .shrink-enlarge { position:absolute; top:1rem; left:1rem; } .shrink-overlay .overlay .position-button, .shrink-overlay .overlay .icon-box.enlarge { display:block; } .shrink-overlay .overlay .icon-box.shrink { display:none; } .shrink-overlay .overlay button.shrink-enlarge { -webkit-transform:scale(0.5) translate(-38px, -38px);transform:scale(0.5) translate(-38px, -38px); } .shrink-overlay .overlay button.close-overlay { -webkit-transform:scale(0.5) translate(38px, -36px); transform:scale(0.5) translate(38px, -36px); } .shrink-overlay .static-links { top:260px; } .shrink-overlay .fixed .site-header { position:absolute;} @media (max-width:860px) { .overlay .item-box { padding:5.5rem 0; } .overlay button.shrink-enlarge { -webkit-transform:scale(0.7) translate(-28px, -14px); transform:scale(0.7) translate(-28px, -14px); } .overlay button.close-overlay { -webkit-transform:scale(0.7) translate(28px, -14px); transform:scale(0.7) translate(28px, -14px); } } #livestream-overlay, #stream-archive, #stream-popup { padding:0; } #livestream-overlay .overlay-container > .iframe-box, #stream-archive .overlay-container >.iframe-box, #stream-popup .overlay-container >.iframe-box { padding-top:46.7%; min-height:calc(100vh - 100px); } .shrink-overlay #livestream-overlay .overlay-container > .iframe-box, .shrink-overlay #stream-archive .overlay-container > .iframe-box, .shrink-overlay #stream-popup .overlay-container > .iframe-box { padding-top:54.7%; min-height:inherit;} .shrink-overlay #livestream-overlay, .shrink-overlay #stream-archive, .shrink-overlay #stream-popup { overflow:hidden; max-width:420px; width:100%; height:260px; padding:3rem; top:0; left:0; } .shrink-overlay #livestream-overlay .item-box, .shrink-overlay #stream-archive .item-box, .shrink-overlay #stream-popup .item-box { height:100%; width:100%; max-width:100%; position:static; padding:0; overflow:hidden; } .shrink-left #livestream-overlay, .shrink-left #stream-archive, .shrink-left #stream-popup { left:0; } .shrink-top #livestream-overlay, .shrink-top #stream-archive, .shrink-top #stream-popup { top:0; } .shrink-bottom #livestream-overlay, .shrink-bottom #stream-archive, .shrink-bottom #stream-popup { top:inherit; bottom:0; } .shrink-right #livestream-overlay, .shrink-right #stream-archive, .shrink-right #stream-popup { left:inherit; right:0; } /* Streams in iframe for overlay*/ body.lightbox { padding:0; margin:0; } .live-stream-box { width:100%; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .live-stream-video .iframe-box { height:auto!important; } .live-stream-box .live-stream-video { position:relative; width:calc(70% - 1rem); min-height:595px; } .live-stream-box .chat-box { width:30%; min-height:680px; position:relative; } .live-stream-box .chat-box iframe { position:absolute; top:0; left:0; width:100%; height:100%; min-height:680px; } @media (max-width:860px) { .live-stream-box { display:block; } .live-stream-box .chat-box, .live-stream-box .live-stream-video { width:100%; min-height:100%;} } /* Scrollable overlay without movie */ #feedback-overlay .iframe-box { height:calc(100vh - 100px); overflow:auto; padding:0;} /* Feedbackform in iframe overlay */ .modul.feedback-form h3 { margin:0; } .feedback-form .form-row { display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .feedback-form .form-row.radio-boxes { -webkit-box-pack:flex-start; -ms-flex-pack:start; justify-content:flex-start; } .feedback-form .standard-radio { margin-right:2rem; } .feedback-form .form-row .field-item { width:calc(50% - 1rem); } .modul.feedback-form .form-row.radio-boxes .field-item { width:auto; } .feedback-form .form-row .field-item.feedback-item, .feedback-form .form-row .field-item.terms-item { width:100%; } .feedback-form .button { margin:0 0 0 auto; } @media (max-width:560px) { .feedback-form .form-row.radio-boxes { display:-webkit-box; display:-ms-flexbox; display:flex; } .feedback-form .form-row { display:block; margin:0; } .modul.feedback-form .form-row .field-item { width:100%; margin-bottom:1rem;} } /* Chat Overlay */ #matchmaking-overlay { width:420px; right:0; left:inherit; } /* ################################################## 404 PAGE NOT FOUND ################################################## */ .modul-page-not-found .form-box { margin-top:5rem; max-width:560px; margin:5rem auto; padding:2rem; } .modul-page-not-found a { display:block; border-radius:30px; padding:12px 26px 12px 26px; border-style:solid; border-width:2px; text-decoration:none; } .modul.modul-page-not-found ul, .modul.modul-page-not-found li { padding:0; margin:0 0 1rem 0; list-style-type:none; } /* ################################################## Animations ################################################## */ .buzzing { -webkit-animation-name:buzzout; animation-name:buzzout; -webkit-animation-duration:0.75s; animation-duration:0.75s; -webkit-animation-timing-function:linear; animation-timing-function:linear; -webkit-animation-iteration-count:1; animation-iteration-count:1; } .buzzing .matchmaking-icon svg path {fill:#FF9E00; } @keyframes buzzout { 10% { -webkit-transform:translateX(3px) rotate(2deg); transform:translateX(3px) rotate(2deg); } 20% { -webkit-transform:translateX(-3px) rotate(-2deg); transform:translateX(-3px) rotate(-2deg); } 30% { -webkit-transform:translateX(3px) rotate(2deg); transform:translateX(3px) rotate(2deg); } 40% { -webkit-transform:translateX(-3px) rotate(-2deg); transform:translateX(-3px) rotate(-2deg); } 50% { -webkit-transform:translateX(2px) rotate(1deg); transform:translateX(2px) rotate(1deg); } 60% { -webkit-transform:translateX(-2px) rotate(-1deg); transform:translateX(-2px) rotate(-1deg) } 70% { -webkit-transform:translateX(2px) rotate(1deg); transform:translateX(2px) rotate(1deg); } 80% { -webkit-transform:translateX(-2px) rotate(-1deg); transform:translateX(-2px) rotate(-1deg); } 90% { -webkit-transform:translateX(1px) rotate(0); transform:translateX(1px) rotate(0); } 100%{ -webkit-transform:translateX(-1px) rotate(0); transform:translateX(-1px) rotate(0); } } /* ################################################## CHAT ACTIVE OVERWRITE ################################################## */ #page-top, #masthead, #filter-nav-section { width:100%; -webkit-transition:all 0.3s ease 0; transition:all 0.3s ease 0; } @media (min-width:960px) { /* CHAT ACTIVE HEADERSTYLES */ .chat-active .static-links { right:360px; -webkit-transition:all 0.3s ease 0.1s; transition:all 0.3s ease 0.1s;} .chat-active #page-top, .chat-active #masthead { width:calc(100% - 360px); -webkit-transition:all 0.3s ease 0.1s; transition:all 0.3s ease 0.1s; } .chat-active .branding .item-box { padding:0.5rem 0; } .chat-active .logo span, .chat-active .scroll-box .logo span { height:35px; width:70px; background-size:cover; } /* CHAT ACTIVE NAVIGATION */ .chat-active .meta-box .topic-filter.button .icon-box { display:block; } .chat-active .meta-box .topic-filter.button .topic-label { display:none; } .chat-active .meta-box .topic-filter.button { padding:2rem; } .chat-active .meta-box .user-profile { width:51px; height:51px; } .chat-active .meta-box .filter-box .standard-radio label, .chat-active .meta-box .filter-box .standard-checkbox label { padding:1.2rem 0 1.2rem 4.5rem; } .chat-active .meta-box .filter-box #topic-search-form { display:inline-block; width:100%; max-height:calc(100vh - 215px); overflow:auto; margin-bottom:5rem; position:static; } .chat-active .meta-box .filter-box .button-box { padding:0 0; text-align:right; position:absolute; bottom:1rem; right:1rem; } .chat-active .matchfilter-navi .button, .chat-active .matchfilter-navi .button.reset-button { margin:0 2rem 2rem 0; } .chat-active .meta-box .filter-box .form-row { display:block; padding:1rem; } .chat-active .meta-box .filter-box .form-row .field-item { width:100%; } .chat-active .modul.filter-nav { font-size:1.4rem; padding-top:3rem; top:-13px; } /* CHAT ACTIVE MATCHMAKING*/ .chat-active .filter-nav select.filter-select { padding:0.5rem 4rem 0.5rem 0.5rem;} .chat-active .filter-nav .selector .icon-box, .filter-nav .icon-box.select { width:30px; } .chat-active .filter-nav .selector .icon, .filter-nav .icon-box.select .icon { width:11px; height:11px; right:12px; top:calc(50% - 5px); } .chat-active .filter-nav .free-text-search .button { font-size:1.4rem; padding:0.5rem 3rem 0.5rem 2rem; } .chat-active .filter-nav .free-text-search .button .icon-box.search { right:8px; -webkit-transform:scale(0.7); transform:scale(0.7); } .chat-active .filter-nav .free-text-search input[type="text"] { font-size:1.4rem; padding:0.5rem; min-height:3rem; } } @media (min-width:960px) and (max-width:1280px) { /*matchmaking */ .chat-active .user-matchmaking .matchmaking-results { width:100%; } .chat-active .user-matchmaking .user-image { width:80px; min-width:inherit;} /* Startpage Streams*/ .chat-active .next-on-stage .events-box .flex-item, .chat-active .next-on-stage .events-box .flex-item:nth-of-type(n+4) { width:100%; } .chat-active .next-on-stage .events-box .event-item { -webkit-box-orient:horizontal; -ms-flex-direction:row; flex-direction:row; -ms-flex-wrap:wrap; flex-wrap:wrap; } @supports (flex-wrap:wrap) { .chat-active .next-on-stage .events-box .event-item { -webkit-flex-wrap:wrap; } } .chat-active .next-on-stage .events-box .image-box, .chat-active .next-on-stage .events-box .flex-item:nth-of-type(n+4) .image-box { order:2; padding:0; width:25%; max-width:inherit;} .chat-active .next-on-stage .events-box .events-info, .chat-active .next-on-stage .events-box .flex-item:nth-of-type(n+4) .events-info { order:1; padding:2rem 2rem 0 2rem; width:75%; height:auto; } .chat-active .next-on-stage .events-box .flex-item .button-box.open-info-box { text-align:right; } .chat-active .next-on-stage .events-box .flex-item .button-box.open-info-box .icon-box { margin-right:25%; } /* Startpage Exhibitor Filter */ .chat-active .filter-masonry-box .filtering-item { width:calc(25% - 1rem); } .chat-active .filter-masonry-box select.filter-select { padding:0.5rem 4rem 0.5rem 0.5rem;} .chat-active .filter-masonry-box .icon-box.select { width:30px; } .chat-active .filter-masonry-box .icon-box.select .icon { width:11px; height:11px; right:12px; top:calc(50% - 5px); } /* Newssroom */ .chat-active .news-masonry-box .masonry-item { width:calc(50% - 2rem); } } @media (min-width:1280px) and (max-width:1480px) { /* Newssroom */ .chat-active .news-masonry-box .masonry-item { width:calc(33.33333% - 2rem); } } /* Chat Overlay */ #matchmaking-overlay { width:420px; right:0; left:inherit; } #matchmaking-overlay { display:block; -wekit-transform:translateX(460px); transform:translateX(460px); -webkit-transition:all 0.3s ease; transition:all 0.3s ease;} #matchmaking-overlay.active {-webkit-transform:translateX(0); transform:translateX(0); z-index:320; } /*chat*/ .overlay.chat-notifications {-webkit-box-shadow:-1px 0px 7px 3px rgba(255,255,255,0.5); box-shadow:-1px 0px 7px 3px rgba(255,255,255,0.5); height:100vh; min-width:320px; max-width:360px; left:inherit; right:0; overflow:hidden;} .overlay.chat-notifications .close-overlay { width:50px; height:50px; position:fixed; top:10px; right:18px; margin:0; -webkit-transform:scale(0.7) translate(28px, -14px); transform:scale(0.7) translate(28px, -14px); } .overlay.chat-notifications .item-box { width:calc(100% - 2rem); margin:4rem 1rem 0 1rem; height:calc(100% - 4rem); padding:1rem 0 0 0; } .notification-chat-item { position:relative; margin-bottom:1rem; position:fixed; top:0; width:100%; z-index:11; } .notification-chat-item .search-notification { border:0; padding:1rem; height:auto; border-bottom:1px solid; } #notification-list { height:100vh; padding-top:6rem; overflow:auto; position:relative;} .overlay.chat-notifications .iframe-box { height:calc(100% - 70px); } #notification-list .flex-box, #notification-detial .flex-box, .notification-info.flex-box { display:-webkit-box; display:-ms-flexbox; display:flex; } #notification-back .icon-box { position:absolute; left:16px; top:24px; -webkit-transform:rotate(-135deg); transform:rotate(-135deg); } #notification-back { margin:auto 1rem 0 auto; } .overlay.chat-notifications .overlay-container { width:100%; height:100%; } .overlay.chat-notifications .iframe-box { position:relative; overflow:auto; padding-top:0; height:100%; } .notification-item { border-width:0 0 1px 0; border-style:solid; padding:0.5rem 0; margin-top:0.5rem; cursor:pointer;} .notifications .user-status { position:relative; bottom:inherit; font-size:1.4rem; margin-bottom:1rem; } .notifications .user-status span { display:inline-block; } .notification-info { min-height:60px; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; } .notification-info .user-image { max-width:60px; min-width:60px; margin-right:0.5rem; position:relative;} .notification-info .user-image .bg-image { width:56px; height:56px; border:2px solid #fff; overflow:hidden; border-radius:50%; } .notification-info .info-box { font-size:1.6rem; height:100%; position:relative; padding-bottom:0.5rem; width:100%;} .notification-info .info-box .user-name { display:block; padding:1rem 0; } .notification-info .time-box { padding:0; display:block; } .notification-info .button-box .button, .notification-info .button-box button { padding:0.5rem; min-width:90px; font-size:1.6rem; font-weight:bold; } #notification-back { position:relative; padding:1.2rem 1rem 1rem 2rem; margin:auto 1rem auto 0; padding-left:26px; } #notification-detial .notification-item { border:0; } #notification-detial .notification-item .user-name { margin:auto; } #rocket-chat-iframe { height:calc(100vh - 100px); width:100%;} .notification-info .button-count { position:absolute; width:30px; height:30px; right:0; top:5px; text-align:center; } .notification-info .button-count:before { content:''; width:30px; height:30px; display:block; border-radius:50%; position:absolute; z-index:-1; top:-5px;}