@font-face {
font-family: 'Fakt';
src: url(https://hypion.eu/content/media/webfonts/Fakt-Blond.eot);
src: url(https://hypion.eu/content/media/webfonts/Fakt-Blond.eot?#iefix) format('embedded-opentype'),
url(https://hypion.eu/content/media/webfonts/Fakt-Blond.woff2) format('woff2'),
url(https://hypion.eu/content/media/webfonts/Fakt-Blond.woff) format('woff'),
url(https://hypion.eu/content/media/webfonts/Fakt-Blond.ttf) format('truetype'),
url(https://hypion.eu/content/media/webfonts/Fakt-Blond.svg#Fakt-Blond) format('svg');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Fakt';
src: url(https://hypion.eu/content/media/webfonts/Fakt-SemiBold.eot);
src: url(https://hypion.eu/content/media/webfonts/Fakt-SemiBold.eot?#iefix) format('embedded-opentype'),
url(https://hypion.eu/content/media/webfonts/Fakt-SemiBold.woff2) format('woff2'),
url(https://hypion.eu/content/media/webfonts/Fakt-SemiBold.woff) format('woff'),
url(https://hypion.eu/content/media/webfonts/Fakt-SemiBold.ttf) format('truetype'),
url(https://hypion.eu/content/media/webfonts/Fakt-SemiBold.svg#Fakt-Blond) format('svg');
font-weight: normal;
font-style: normal;
font-display: swap;
}
::selection {
background: #7cff12;
color: #ffffff;
} p, .entry-content p,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5{
position: relative;
z-index: 100;
}
#page{ max-width: 100vw;
overflow-x: hidden;
}
#content{
padding-top: 25vh;
padding-bottom: 15vh;
} @media screen and (min-width: 545px) and (max-width: 1330px){
.ast-container, .ast-container-fluid {
padding-left: 70px;
padding-right: 70px;
}
}
.ast-primary-header-bar{
background-color: transparent;
}
.wp-block-button.alignleft{
float: none;
}
.has-medium-font-size{
font-size: 1.45em;
line-height: 1.6em;
letter-spacing: 0.02em;
}
#ast-scroll-top{
border-radius: 50%;
background-color: #7cff12;
color: #102144;
}
.wp-block-cover .wp-block-cover__background{ opacity: 0;
} .ast-header-break-point .main-header-bar-navigation {
line-height: 2;
}
.ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu {
display: block !important;
margin-bottom: 1.5em;
}
.ast-builder-menu-mobile .main-navigation .menu-item.menu-item-has-children > .ast-menu-toggle {
display: none;
}
.ast-header-break-point .main-navigation .sub-menu .menu-item .menu-link {
font-size: 80%;
line-height: 1.5;
color: #80ff88;
}
.ast-header-break-point .main-navigation ul .sub-menu .menu-item:not(.menu-item-has-children) .menu-link .icon-arrow:first-of-type {
display: none;
}
#menu-toggle-close .ahfb-svg-iconset svg {
width: 30px;
height: 30px;
}
.ast-mobile-popup-drawer .ast-mobile-popup-header .menu-toggle-close {
padding-right: calc(10% - 5px);
margin-top: 1em;
} .lang-item .menu-link{
color: white;
padding-left: 0;
}
.current-lang .menu-link{
font-weight: 600;
}
#ast-hf-mobile-menu{
justify-content: flex-end;
}
#ast-mobile-site-navigation .lang-item{
width: auto;
margin-bottom: 1em;
}
#ast-mobile-site-navigation .lang-item:nth-child(2){
margin-right: calc(10vw - 0.5em);
border-left: 1px solid white;
}
#ast-mobile-site-navigation .lang-item .menu-link{
padding: 0 0.5em;
}
.ast-builder-menu-mobile .main-navigation .main-header-menu .current-lang > .menu-link {
color: white;
}
@media screen and (min-width: 1800px){
.site-header-primary-section-right.site-header-section{
position: absolute;
right: 7.5em;
}
} .entry-content h2{
font-size: 2rem;
font-weight: 400;
}
.category-actions .entry-content h2 {
font-size: 1em;
font-weight: bold;
line-height: 2em;
margin-bottom: 0; }
.category-actions .entry-content h2:not(:first-of-type),
.entry-content h2:not(:first-of-type){
margin-top: 2em;
}
.category-actions .entry-content > .wp-block-image:first-of-type img{
width: 100%;
}
.entry-content h3{
font-size: 1em;
font-weight: 600;
margin-bottom: 0;
line-height: 2em;
}
.hyp-readmore h3:not(:nth-child(2)){
margin-top: 1em;
} .wp-block-button .wp-block-button__link{ }
.wp-block-button .wp-block-button__link:visited{
color: #8890a3;
}
body.page-template-page-dark .wp-block-button .wp-block-button__link{
border-color: white;
color: white;
}
body.page-template-page-dark .wp-block-button .wp-block-button__link:hover{
background-color: rgba(255,255,255,0.1);
}
.wp-block-buttons>.wp-block-button.wp-block-button{
margin-right: 0.5em;
} #ast-desktop-header .site-branding{
top: 1em;
margin-left: -55px;
position: fixed;
}
#ast-desktop-header .site-logo-img img{
width: 200px;
}
#ast-desktop-header .site-logo-img {
position: relative;
}
#ast-desktop-header.scrolled .site-logo-img img{
transition: all 0.2s;
}
#ast-desktop-header.scrolled .site-logo-img img{
width: 0;
}
.site-logo-img a::after {
content: '';
display: block;
position: absolute;
width: 34px;
height: 40px;
right: -20px;
top: -20px;
background-image: url(https://hypion.eu/content/media/2021/10/200604_HYP_icon_01.svg);
background-repeat: no-repeat;
transition: all 0.2s;
pointer-events: all;
}
#ast-desktop-header.scrolled .site-logo-img a::after {
transform: scale(1.3) translateY(10px);
} #ast-mobile-header .site-logo-img{
position: relative;
top: 10px;
}
#ast-mobile-header .site-logo-img a::after {
width: 24px;
height: 30px;
right: -10px;
top: -15px;
} body.page-template-page-dark #ast-desktop-header .site-logo-img{
background-image: url(https://hypion.eu/content/media/2021/10/200604_HYP_wordmark_01_white.svg);
background-repeat: no-repeat;
}
body.page-template-page-dark #ast-desktop-header .site-logo-img img{
opacity: 0;
}
body.page-template-page-dark .site-logo-img::after {
background-color: #102144;
} .wp-block-separator{
border-bottom-width: 0;
border-top-width: 1px !important;
background-color: transparent;
border-color: #102144;
}
.wp-block-separator.is-style-wide {
border-bottom-width: 0;
border-top-width: 1px !important;
background-color: transparent;
border-color: #102144;
margin: 10% 0;
} .wp-block-image .aligncenter > figcaption, .wp-block-image .alignleft > figcaption, .wp-block-image .alignright > figcaption {
display: flex;
}
.wp-block-image figcaption {
position: relative;
display: flex;
align-items: stretch;
justify-content: flex-start;
max-width: 1200px;
margin: auto;
margin-top: 1.6em;
font-size: 0.9em;
line-height: 1.6;
color: darkgray;
}
.wp-block-image figcaption::before {
content: '';
display: inline-block;
border-left: 1.5px solid #7cff12;
transform: skewX(-10deg);
margin: 0.2em 1em 0.5em 0;
} .entry-content ul{
list-style: none;
margin-left: 1em;
}
.hyp-readmore ul li::before,
.entry-content ul:not(.menu) li::before{
content: "/";
color: #7cff12;
font-size: 1em;
font-weight: 600;
display: inline-block;
width: 1em;
margin-left: -1em;
}
.blocks-gallery-item::before{
content: '' !important;
display: none !important;
} .footer-widget-area[data-section="sidebar-widgets-footer-widget-1"].footer-widget-area-inner {
text-align: left !important;
} .site-footer-below-section-2,
.ast-footer-copyright{
font-size: 0.8rem !important;
text-align: left !important;
}
@media screen and (max-width: 544px){
.footer-widget-area .widget_text p{
text-align: left !important;
}
.site-footer-below-section-1{
order: 2;
}
.site-footer-below-section-2{
margin-bottom: 0;
}
.site-footer-below-section-2 p a{
color: #8890a3 !important;
text-decoration: underline;
}
}
#menu-de_footer_menu_legal,
#menu-en_footer_menu_legal{
display: flex;
justify-content: flex-end;
}
@media screen and (max-width: 544px){
#menu-de_footer_menu_legal,
#menu-en_footer_menu_legal{
justify-content: flex-start;
}
}
#menu-de_footer_menu_legal li:not(:last-child),
#menu-en_footer_menu_legal li:not(:last-child){
margin-right: 0.5em;
}
#menu-de_footer_menu_legal li:not(:first-of-type),
#menu-en_footer_menu_legal li:not(:first-of-type){
padding-left: 0.5em;
border-left: 1px solid #8890a3;
}
#menu-de_footer_menu_legal a,
#menu-en_footer_menu_legal a{
color: #8890a3;
}
#hyp-footer-neumuenster{
margin-bottom: -15vh; }
.hyp-footer-neumuenster-legal{
font-size: 0.8rem !important;
color: #8890a3 !important;
}
.hyp-footer-neumuenster-legal a{
color: #8890a3 !important;
text-decoration: none !important;
} body.home::after,
.page-id-474::after, body.single-post::after,
body.page-template-page-dark::after,
.page-id-1354::after, .page-id-1796::after, .page-id-2655::after, .page-id-3336::after, .page-id-939::after, .page-id-1978::after {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
width: 50vmin;
height: 160vmin;
background: url(https://hypion.eu/content/media/2021/10/200604_HYP_stripes_01.svg);
background-position: top left;
background-repeat: no-repeat;
background-size: cover;
z-index: 10;
animation-name: 'stripeani';
animation-duration: 3s;
animation-delay: 3.5s;
transform: translate(8vw, -1px);
animation-fill-mode: forwards;
}
body.page-template-page-dark::after{
background-image: url(https://hypion.eu/content/media/2021/11/210304_HYP_Website_Career_Elemente_rechts_02.svg);
animation-name: 'stripeani-out';
z-index: -1;
}
@keyframes stripeani {
0% { transform: translate(8vw, -1px); }
100% { transform: translate(1px, -10vh); }
}
@keyframes stripeani-out {
0% { transform: translate(8vw, -1px); }
100% { transform: translate(50%, 10vh); }
} body.page-template-page-dark{
background-color: #102144;
color: white;
}
body.page-template-page-dark .entry-content h1,
body.page-template-page-dark h2,
body.page-template-page-dark .entry-content h2,
body.page-template-page-dark h3,
body.page-template-page-dark .entry-content h3,
body.page-template-page-dark h4,
body.page-template-page-dark .entry-content h4,
body.page-template-page-dark h5,
body.page-template-page-dark .entry-content h5,
body.page-template-page-dark h6,
body.page-template-page-dark .entry-content h6 {
color: white;
}
body.page-template-page-dark a{
color: #7cff12;
} .wp-block[data-align="left"]{
height: auto;
}
.wp-block[data-align="left"] > .wp-block-button{
float: none;
}  .hyp-job-offer{
position: relative;
pointer-events: none;
}
.hyp-job-offer a,
.hyp-job-offer button{
pointer-events: all;
}
.hyp-job-offer-wrapper{
padding-bottom: 1.5em;
border-bottom: 1px solid;
margin-bottom: 10%;
}
.hyp-job-offer::after{
content: '';
display: inline-block;
width: 3.5rem;
height: 3.5rem;
position: absolute;
right: 0;
bottom: 2em;
background: url(https://hypion.eu/content/media/2021/11/hyp_arrow_right_white.png);
background-position: center;
background-repeat: no-repeat;
background-size: contain;
transition: all 0.3s;
cursor: pointer;
transform: rotate(90deg);
pointer-events: all;
}
.hyp-job-offer.expanded::after{
transform: rotate(-90deg);
}
.hyp-job-offer-wrapper .wp-block-buttons{
margin-top: 3em;
}
.hyp-job-offer-wrapper .wp-block-group{
padding: 0 !important;
max-height: 0;
overflow: hidden;
opacity: 0;
transition: all 0.3s;
}
.hyp-job-offer.expanded .hyp-job-offer-wrapper .wp-block-group{
max-height: 20000px;
opacity: 1;
padding-bottom: 7em !important;
}
body.single-post article.category-jobs .hyp-job-offer-wrapper .wp-block-group{
max-height: none;
opacity: 1;
padding-bottom: 7em !important;
}
.hyp-job-offer-wrapper h2{
margin-bottom: 2em;
font-size: 3rem;
font-weight: 600;
cursor: pointer;
pointer-events: all;
}
.hyp-job-offer-wrapper h2::after{
content: '(m/w/d)';
display: block;
position: relative;
font-weight: 300;
}
@media screen and (max-width: 921px){
.hyp-job-offer-wrapper h2{
font-size: 2.2em;
}
}
@media screen and (max-width: 599px){
.hyp-job-offer-wrapper{
margin-bottom: 20%;
padding-bottom: 0.5em;
}
.hyp-job-offer-wrapper h2{
font-size: 2.2em;
margin-bottom: 1em;
}
.hyp-job-offer-wrapper .wp-block-column:nth-of-type(1){
order: 2;
}
}
@media screen and (max-width: 400px){
.hyp-job-offer-wrapper h2{
font-size: 2em;
}
}
.hyp-job-offer-wrapper h3{
font-size: 1.5rem;
}
.hyp-job-offer-wrapper p + h3{
margin-top: 1rem;
} #contact + div hr,
#contact > h2 + div hr{
margin-left: 0;
} .hyp-team-card{
align-items: center;
margin-bottom: 5rem;
} .page-id-939 .hyp-tease-readmore h2{
hyphens: auto;
font-size: 2.2em;
} .wp-block-eedee-block-gutenslider{
margin-bottom: calc(4em + var(--gutenslider-arrow-size));
}
.eedee-gutenslider-nav.eedee-gutenslider-prev,
.eedee-gutenslider-nav.eedee-gutenslider-next{
position: absolute;
right: 0;
left: calc(90vw - var(--gutenslider-arrow-size)) !important;
top: auto !important;
display: inline;
bottom: calc(-2em - var(--gutenslider-arrow-size));
transform: none !important;
}
.eedee-gutenslider-nav.eedee-gutenslider-prev{
margin-left: calc(-2 * var(--gutenslider-arrow-size)) !important; }
.eedee-gutenslider-nav.eedee-gutenslider-prev svg,
.eedee-gutenslider-nav.eedee-gutenslider-next svg{
display: none !important;
}
.eedee-gutenslider-nav.eedee-gutenslider-prev::after,
.eedee-gutenslider-nav.eedee-gutenslider-next::after {
content: '';
display: inline-block;
width: var(--gutenslider-arrow-size);
height: var(--gutenslider-arrow-size);
background-image: url(https://hypion.eu/content/media/2021/11/hyp_arrow_right_darkblue.png);
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
}
.eedee-gutenslider-nav.eedee-gutenslider-prev::after{
background-image: url(https://hypion.eu/content/media/2021/11/hyp_arrow_left_darkblue.png);
}
.full-width-video-wrapper {
position: relative;
width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
cursor: pointer;
overflow: hidden;
}
.full-width-video-wrapper img,
.full-width-video-wrapper video {
width: 100%;
height: auto;
display: block;
}
.full-width-video-wrapper .play-button {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(0, 0, 0, 0.4);
border-radius: 50%;
padding: 20px;
transition: background 0.3s ease;
z-index: 2;
}
.full-width-video-wrapper .play-button::before {
content: '▶';
color: #00ff12;
font-size: 40px;
}
.full-width-video-wrapper video {
display: none;
}
.full-width-video-wrapper.playing img,
.full-width-video-wrapper.playing .play-button {
display: none;
}
.full-width-video-wrapper.playing video {
display: block;
}