.cc-head>*:first-child{margin-top:0}.cc-head>*:last-child{margin-bottom:15px}.contao-cookiebar{--ccb-backdrop: rgba(0, 0, 0, .75);--ccb-anim-duration: .5s;--ccb-checked-clr: #399d32;--ccb-checked-bg: #dcf3db;--ccb-unchecked-clr: #9c9b99;--ccb-unchecked-bg: #fff;--ccb-disabled-clr: #c8c7c5;--ccb-disabled-bg: #f4f4f4;--ccb-focus-clr: #00a4f4;position:fixed;inset:0;z-index:9999;display:flex;align-items:var(--ccb-align, center);justify-content:var(--ccb-justify, center);letter-spacing:0;padding:15px;max-height:100dvh;box-sizing:border-box;pointer-events:none;overflow:hidden;color:var(--ccb-clr, #444)}.contao-cookiebar *{box-sizing:border-box}.contao-cookiebar p{color:var(--ccb-text, #868686);line-height:1.4}.contao-cookiebar label{position:relative;display:block;padding:8px 13px 8px 0;line-height:1.2rem}.contao-cookiebar label.group{font-weight:600}.contao-cookiebar input{position:absolute;width:1px;height:1px;outline:0 none;opacity:0}.contao-cookiebar input+label{padding:8px 13px 8px 45px;cursor:pointer}.contao-cookiebar input+label:before,.contao-cookiebar input+label:after{content:"";position:absolute;border-radius:10px}.contao-cookiebar input+label:before{top:7px;left:0;width:35px;height:18px;margin:0;box-sizing:content-box;background:var(--ccb-unchecked-bg);border:1px solid var(--ccb-unchecked-clr);transition:border-color .2s}.contao-cookiebar input+label:after{display:block;top:11px;left:4px;width:12px;height:12px;background:var(--ccb-unchecked-clr);transition:background .2s,margin-left .2s,padding .2s}.contao-cookiebar input+label:active:after{padding-left:5px}.contao-cookiebar input.cc-group-half+label:after{background:linear-gradient(to right, var(--ccb-unchecked-clr) 0%, var(--ccb-unchecked-clr) 50%, var(--ccb-checked-clr) 50%, var(--ccb-checked-clr) 100%)}.contao-cookiebar input:checked+label:after{background:var(--ccb-checked-clr);margin-left:17px}.contao-cookiebar input:checked+label:active:after{margin-left:12px}.contao-cookiebar input:checked+label:before{background:var(--ccb-checked-bg);border-color:var(--ccb-checked-clr)}.contao-cookiebar input:disabled+label{pointer-events:none}.contao-cookiebar input:disabled+label:after{background:var(--ccb-disabled-clr)}.contao-cookiebar input:disabled+label:before{background:var(--ccb-disabled-bg);border-color:var(--ccb-disabled-clr)}.contao-cookiebar input:focus-visible:not(.cc-hide-focus)+label:before{outline:3px dashed var(--ccb-focus-clr);outline-offset:2px}.contao-cookiebar .cc-btn{display:inline-block;cursor:pointer;width:100%;padding:8px 14px;margin-bottom:8px;font-size:15px;outline:0 none;border:1px solid var(--ccb-btn-bdr, #cfcfcf);border-radius:4px;color:var(--ccb-btn-clr, #444);background:var(--ccb-btn-bg, #f5f5f5)}.contao-cookiebar .cc-btn:hover,.contao-cookiebar .cc-btn:focus{background:var(--ccb-btn-bg-hvr, #ececec)}.contao-cookiebar .cc-btn:last-child{margin-bottom:0}.contao-cookiebar .grayscale{--ccb-btn-bg: #f1efef;--ccb-btn-bg-hvr: #ececec}.contao-cookiebar .grayscale .success{--ccb-btn-bg: #fbfbfb;--ccb-btn-bg-hvr: #f7f7f7}.contao-cookiebar .highlight .success{--ccb-btn-bg: #4e9e3e;--ccb-btn-bg-hvr: #4c933f;--ccb-btn-bdr: #3e7830;--ccb-btn-clr: #fff}.cc-focus:not(.cc-hide-focus):focus-visible{outline:3px dashed var(--ccb-focus-clr);outline-offset:-3px}.cc-invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;float:left}.cc-inner{display:inline-block;overflow-y:auto;max-height:100%;max-width:100%;padding:23px;border-radius:3px;opacity:0;pointer-events:none;visibility:hidden;font-size:1rem;text-align:left;background:var(--ccb-bg, #fff);box-shadow:var(--ccb-box-shadow, rgba(99, 99, 99, 0.2)) 0 2px 8px 0;animation:var(--ccb-anim, cookiebar-middle-in) var(--ccb-anim-duration) ease-in-out forwards}.cc-group{position:relative;border:1px solid var(--ccb-bdr, #d0d0d0);border-radius:5px;margin-bottom:10px}.cc-cookie-info{font-size:.875rem;background:var(--ccb-info-bg, #fff);border:1px solid var(--ccb-info-bdr, #efefef);padding:10px;border-radius:5px}.cc-cookie-info>div>span{font-weight:600}.cc-cookie-info>div+div{margin-top:5px;word-wrap:break-word}.cc-cookie-info+button.cc-detail-btn-details{margin-top:15px}.cc-cookies{background:var(--ccb-cookies-bg, #fbfbfb);border-radius:0 0 5px 5px}.cc-cookies>p{font-size:.875rem}.cc-cookies>p,.cc-cookies>.cc-cookie{margin:0;padding:15px;border-top:1px solid var(--ccb-cookies-bdr, #fbfbfb)}.cc-cookie label.cookie+*{margin-top:10px}.cc-cookie p{margin:0 0 15px;font-size:.875rem}.cc-cookie-desc p{margin-bottom:0}.cc-footer,.cc-info{text-align:center}.cc-info{margin-top:15px}.cc-info>p{font-size:.875rem}.cc-info>a{display:inline-block;font-size:.813rem;color:var(--ccb-detail-clr, #a2a2a2);text-decoration:none}.cc-info>a:hover{color:var(--ccb-detail-clr-hvr, #717171)}.cc-info>a+a:before{display:inline-block;content:"·";margin-right:5px}.cc-active .cc-inner{opacity:1;pointer-events:auto;visibility:visible}.cc-active.cc-blocked{pointer-events:auto;animation:cookiebar-overlay-in var(--ccb-anim-duration) ease-in-out forwards}.cc-saved.cc-inner{opacity:0;pointer-events:none;visibility:hidden}.cc-saved.cc-blocked{pointer-events:none;animation:cookiebar-overlay-out var(--ccb-anim-duration) ease-in-out forwards}.cc-left{--ccb-justify: flex-start}.cc-right{--ccb-justify: flex-end}.cc-top{--ccb-align: flex-start}.cc-top.cc-active{--ccb-anim: cookiebar-top-in}.cc-top.cc-saved{--ccb-anim: cookiebar-top-out}.cc-middle.cc-active{--ccb-anim: cookiebar-middle-in}.cc-middle.cc-saved{--ccb-anim: cookiebar-middle-out}.cc-bottom{--ccb-align: flex-end}.cc-bottom.cc-active{--ccb-anim: cookiebar-bottom-in}.cc-bottom.cc-saved{--ccb-anim: cookiebar-bottom-out}@media(min-width: 768px){.contao-cookiebar .cc-btn{width:auto;margin-bottom:0}.cc-inner{max-width:var(--ccb-max-width, 750px)}}@media(forced-colors){.contao-cookiebar input+label:after{border:1px solid currentColor}.cc-inner{border:1px solid currentColor}input.cc-group-half+label:after{margin-left:9px}}@media(prefers-reduced-motion){.contao-cookiebar{--ccb-anim-duration: 2s}}@media print{.contao-cookiebar{opacity:0}}@keyframes cookiebar-overlay-in{0%{background:rgba(0,0,0,0)}to{background:var(--ccb-backdrop)}}@keyframes cookiebar-overlay-out{0%{background:var(--ccb-backdrop)}to{background:rgba(0,0,0,0);visibility:hidden}}@keyframes cookiebar-top-in{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes cookiebar-top-out{0%{opacity:1;visibility:visible;transform:translateY(0)}to{opacity:0;visibility:hidden;transform:translateY(-100%)}}@keyframes cookiebar-middle-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes cookiebar-middle-out{0%{opacity:1;visibility:visible;transform:scale(1)}to{opacity:0;visibility:hidden;transform:scale(0)}}@keyframes cookiebar-bottom-in{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes cookiebar-bottom-out{0%{opacity:1;visibility:visible;transform:translateY(0)}to{opacity:0;visibility:hidden;transform:translateY(100%)}}.cc-group{display:flex;flex-wrap:wrap;justify-content:space-between;align-content:center}.cc-group>label{flex-grow:1;margin:5px 0 5px 10px}.cc-cookies{display:none;width:100%}.cc-detail-btn{padding:8px 10px;line-height:1.2rem}.cc-detail-btn-details{text-decoration:underline;padding:0;margin:0 0 10px}.cc-detail-btn,.cc-detail-btn-details{display:inline-block;color:var(--ccb-detail-clr, #a2a2a2);border:0 none;outline:0 none;background:rgba(0,0,0,0);font-size:13px;letter-spacing:0;text-transform:initial;cursor:pointer}.cc-detail-btn span:nth-child(2),.cc-detail-btn-details span:nth-child(2){display:none}.cc-detail-btn.cc-active span:nth-child(1),.cc-detail-btn-details.cc-active span:nth-child(1){display:none}.cc-detail-btn.cc-active span:nth-child(2),.cc-detail-btn-details.cc-active span:nth-child(2){display:inline}.cc-detail-btn:hover,.cc-detail-btn-details:hover{background:rgba(0,0,0,0);color:var(--ccb-detail-clr-hvr, #717171)}
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
* {
    margin: 0;
    padding: 0;
    border: 0;
}

.invisible, .desktop {
    display: none;
}

/* Load Fonts */
@font-face {
    font-family: 'Raleway';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/Raleway-Regular.ttf');
}

@font-face {
    font-family: 'RalewayBold';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/Raleway-Bold.ttf');
}

@font-face {
    font-family: 'RalewayLight';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/Raleway-Light.ttf');
}

@font-face {
    font-family: 'SourceSansPro';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/SourceSansPro-Regular.ttf');
}

@font-face {
    font-family: 'SourceSansProBold';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/SourceSansPro-Bold.ttf');
}

@font-face {
    font-family: 'SourceSansLight';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/SourceSansPro-Light.ttf');
}

@font-face {
    font-family: 'FontAwesomeRegular';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/fa-regular-400.woff');
}

@font-face {
    font-family: 'FontAwesomeSolid';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/fa-solid-900.woff');
}

@font-face {
    font-family: 'FontAwesomeBrand';
    font-display: swap;
    src: url('../../files/joy-pi-theme/fonts/fa-brands-400.otf');
}

body {
    font-family: 'Raleway', Arial;
    font-size: 18px;
    overflow-x: hidden;
}

#container {
    overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'RalewayBold', Arial;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

main a {
    font-family: 'RalewayBold', Arial;
    text-decoration: none;
    color: #275C6B;
}

main p {
    margin-bottom: 0.5rem;
    line-height: 1.7;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

ul {
    list-style-type: none;
}

.no-margin .headline {
    margin-bottom: 0 !important;
}

.margin {
    margin-bottom: 3rem !important;
}

main {
    margin-top: 75px;
}

main ul, main ol {
    margin: 0.5rem 0;
}

main ol li {
    list-style: decimal inside;
}

main ul li {
    position: relative;
    margin-bottom: 0.5rem;
    padding-left: 1rem;
}

main ul li:before,
.ce_download a:before {
    content: '\f0da';
    position: absolute;
    left: 0;
    font-family: 'FontAwesomeSolid';
}

.mod_article {
    margin-bottom: 5rem;
}

.mod_article > .inside {
    box-sizing: border-box;
}

.content-text {
    margin-bottom: 3rem;
}

.content-text.last {
    margin-bottom: 0;
}


.content-text .rte {
    padding: 1.7rem;
}

/* Header */
.header {
    position: relative;
    margin-bottom: 0;
}

.header .content-image .image_header{
    position: relative;
    width: 100vw;
    height: 28vh;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    background-position: 90% 50%;
    background-repeat: no-repeat;
    background-size: cover;
}

.header .content-text {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    color: #FFFFFF;
    font-size: 1.2rem;
    text-align: center;
    filter: drop-shadow(0 0 5px #000000);
    transform: translateY(-50%);
}

/* Sub-Pages Header */
.home .headline.image_header {
    display: none;
}

.headline.image_header {
    height: 25vh;
    background-image: url(../../files/files/background.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center 35%;
    margin-bottom: 3rem;
}

.headline.image_header .inside {
    position: relative;
    display: flex;
    height: 100%;
    align-items: flex-end;
    color: #FFFFFF;
    padding: 1.7rem;
    box-sizing: border-box;
    text-shadow: 1px 1px 8px #000000;
}

/* Headline Spacer */
.spacer {
    color: #FFFFFF;
    background-color: #3e4854;
    margin: 0;
}

.spacer > .inside {
    padding: 3rem 1.7rem;
    text-align: center;
}

.spacer h1,
.spacer h2,
.spacer h3,
.spacer h4,
.spacer h5,
.spacer h6 {
    margin-bottom: 0;
}

.spacer .content-text,
.spacer .content-text .rte {
    margin-bottom: 0;
    padding-bottom: 0;
}


/* Youtube */
.content-youtube {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 1.7rem;
    box-sizing: border-box;
}

.content-youtube figure {
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 56.25%;
    box-sizing: border-box;
}

.content-youtube  iframe {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    height: 100% !important;
}

/* Icon-Gallery */
.icons {
    margin-bottom: 5rem;
}

.icons > .inside {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.icons .content-text {
    width: 47.5%;
    text-align: center;
    text-transform: uppercase;
}

.icons .rte {
    margin-bottom: 0;
}

.icons h2 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    text-align: center;
    color: #FFFFFF;
    border: 4px solid #FFFFFF;
    border-radius: 100%;
    margin: 0 auto 1rem auto;
    padding: 0;
    box-sizing: border-box;
    font-family: 'FontAwesomeSolid';
    font-size: 2.5rem;
}

.icons .brand h2 {
    font-family: 'FontAwesomeBrand';
}

.icons p {
    font-family: 'RalewayBold', Arial;
    font-size: 0.9rem;
}

.icons .text_container {
    padding: 0;
}

/* Hyperlink & Headline */
.content-headline {
    padding: 0 1.7rem;
}

/* Gallery */
.content-gallery {
    padding: 0 1.7rem;
}

.content-gallery ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.content-gallery li {
    width: 45%;
    padding: 0;
}

.content-gallery li:before {
    content: '';
}

/* Extra Padding for Images in Textblock */
.content-text.imgpadding figure {
    padding: 0 1.7rem;
}



/* Other Classes */
.center {
    text-align: center;
}

.no-margin {
    margin-bottom: 0 !important;
}

/*
 * ##### Helpdesk Quick Fix #####
 */
.ce_helpdesk_overview,
.ce_helpdesk_newthread {
    padding: 0 1.7rem
}



/*
 * Download Section 
 */

/* Device selection menu */
.deviceselection {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;;
    height: 75px;
    margin-bottom: 1.7rem;
    box-shadow: 0 0 3px rgba(0, 0, 0, 10%);
}

.deviceselection .inside {
    height: 100%;
}

.deviceselection ul {
    display: flex;
    height: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin: 0;
}

.deviceselection ul li {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 0;
    margin-right: 1.7rem;
    margin-bottom: 0;
    cursor: pointer;
}

.deviceselection ul li.last {
    margin-right: 0;
}

.deviceselection ul li:before {
    display: none;
}

.deviceselection ul li:after {
    display: block;
    position: absolute;
    content: '';
    height: 3px;
    bottom: 0;
    left: 50%;
    right: 50%;
    background-color: #074356;
    border-radius: 5px 5px 0 0;
    transition: left 0.35s, right 0.35s;
}

.deviceselection ul li.active:after,
.deviceselection ul li:hover:after {
    left: 0;
    right: 0;
}

/* Device Sections */
.device {
    max-height: 0;
    overflow: hidden;
    margin-bottom: 0;
    transform: translateX(-2%);
    opacity: 0;
    transition: transform 0.35s, opacity 0.5s;
}

.device.active {
    transform: translateX(0);
    opacity: 1;
    max-height: 2000px;
}

.margin-bottom {
    margin-bottom: 1.7rem;
}
#header {
  position: fixed;
  width: 100%;
  height: 75px;
  top: 0;
  left: 0;
  background-color: #3e4854;
  z-index: 99;
}

#header .inside {
  position: relative;
  height: 100%;
  padding: 0 1.7rem;
  box-sizing: border-box;
}

#header #logo {
  position: relative;
  left: 0;
  top: 50%;
  width: 80px;
  height: 50px;
  transform: translateY(-50%);
  background: transparent url(../../files/joy-pi-theme/images/joy-it-logo.png) no-repeat center center;
  background-size: contain;
}

#hamburger {
  position: absolute;
  display: inline-block;
  top: 0;
  right: 0;
  width: 84px;
  height: 100%;
  cursor: pointer;
  z-index: 10;
}

#hamburger-box {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 10px;
  top: 50%;
  left: 28px;
  margin-bottom: 2px;
  transform: translateY(-50%);
  z-index: 3;
  transition: top 0.35s;
}

#hamburger-inner {
  transition-timing-function: cubic-bezier(.55,.055,.675,.19);
  transition-duration: 75ms;
}

#hamburger-inner, #hamburger-inner:before, #hamburger-inner:after {
  position: absolute;
  width: 30px;
  height: 3px;
  transition-property: transform;
  background-color: rgba(255,255,255,1);
}

#hamburger-inner:before, #hamburger-inner:after {
  display: block;
  content: "";
}
#hamburger-inner:before {
  top: -10px;
  transition: top 75ms ease .12s,opacity 75ms ease;
}
#hamburger-inner:after {
  bottom: -10px;
  transition: bottom 75ms ease .12s,transform 75ms cubic-bezier(.55,.055,.675,.19);
}

/* Hamburger Active */
#nav_opened:checked + #wrapper #hamburger #hamburger-inner {
  transition-delay: .12s;
  transition-timing-function: cubic-bezier(.215,.61,.355,1);
  transform: rotate(45deg);
}

#nav_opened:checked + #wrapper #hamburger #hamburger-inner:before {
  top: 0;
  transition: top 75ms ease,opacity 75ms ease .12s;
  opacity: 0;
}

#nav_opened:checked + #wrapper #hamburger #hamburger-inner:after {
  bottom: 0;
  transition: bottom 75ms ease,transform 75ms cubic-bezier(.215,.61,.355,1) .12s;
  transform: rotate(-90deg);
}

#left {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 100%;
  font-family: 'SourceSansLight', Arial;
  font-size: 2rem;
  background-color: #3e4854;
  transition: left 0.35s;
}

#nav_opened:checked + #wrapper #left {
  left: 0;
}

#left .mod_navigation ul {
  padding-top: 5rem;
}

#left .mod_navigation li {
  padding: 1rem 1.7rem;
  border-bottom: 1px solid #FFFFFF;
  list-style-type: none;
}

#left .mod_navigation li.first {
  border-top: 1px solid #FFFFFF;
}

#left ul.level_2 {
  display: none;
}

/* Font Settings */
.mod_navigation span, .mod_navigation strong, .mod_customnav span, .mod_customnav strong {
  color: #FFFFFF;
}

#left .mod_navigation .active {
  font-weight: 400;
  font-family: 'SourceSansProBold', Arial;
}

.mod_navigation a,
.mod_customnav a {
  color: #FFFFFF;
  text-decoration: none;
}

#footer a {
  font-family: 'Raleway', Arial;
  color: #FFFFFF;
  text-decoration: none;
}

#footer strong {
  font-weight: normal;
  font-family: 'RalewayBold', Arial;
}

#footer .mod_customnav {
  background-color: #3e4854;
}

#footer .mod_customnav ul {
  display: flex;
  padding: 1.7rem;
  justify-content: space-between;
}

#footer .mod_customnav li {
  list-style-type: none;
}

/* Copyright Info */

#footer .copyright {
  color: #FFFFFF;
  background-color: #2a3038;
}

#footer .copyright .inside {
  display: flex;
  justify-content: center;
  padding: 0.5rem 1.7rem;
  font-size: 0.7rem;
}

/*
 * Remove unmatching language menu
 */
 html:lang(de) #footer .en,
 html:lang(en) #footer .de {
     display: none;
 }

@media only all and (min-width: 1150px) {

  #footer .mod_customnav ul {
    justify-content: center;
  }

  #footer .mod_customnav li {
    margin-right: 1.7rem;
  }

  #footer .mod_customnav li.last {
    margin-right: 0;
  }

}

@media only all and (min-width: 1150px) {
    /* Wrapper */
    .no-margin {
        margin-bottom: 0 !important;
    }

    .mod_article > .inside {
        max-width: 1600px;
        margin: 0 auto;
        padding: 0 5rem;
        box-sizing: border-box;
    }

    .fullwidth .mod_article > .inside {
        max-width: none;
        margin: auto;
        padding: 0;
    }

    .mod_article.spacer > .inside {
        padding: 3rem 1.7rem;
    }

    .flex > .inside {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .flex.flex-start .inside {
        align-items: flex-start;
    }

    .flex.flex-start .text_container {
        padding-top: 0;
    }

    /* Unhide Desktop Elements */
    .desktop {
        display: block;
    }

    /* Header */
    .header .content-image .image_header {
        height: 85vh;
        background-position: 40% 50%;
    }

    /* CE_Text Default */
    .content-text .inside {
        max-width: 3840px;
        margin: 0 auto;
        box-sizing: border-box;
    }

    .fullwidth .content-text > .inside {
        padding: 0 5rem;
    }

    body.fullwidth:not(.home) .content-text > .inside {
        justify-content: space-between;
    }

    .content-text.fullwidth > .inside {
        max-width: none;
        padding: 0;
    }

    .content-text.fullwidth img {
        width: 100%;
    }

    .content-text .rte {
        padding: 1.7rem 5rem;
        padding: 1.7rem 0;
        box-sizing: border-box;
    }

    /* Sub-Pages Header */
    .headline.image_header .inside {
        max-width: 1600px;
        margin: 0 auto;
        font-size: 2rem;
        padding: 1.7rem 5rem;
        box-sizing: border-box;
    }

    .fullwidth .headline.image_header .inside {
        max-width: none;
        margin: auto;
    }

    /* Icon-Gallery */
    .mod_article.icons > .inside {
        display: grid;
        grid-template-columns: 18% 18% 18% 18% 18%;
        grid-column-gap: 2.5%;
        grid-row-gap: 2.5rem;
        max-width: 3840px;
        margin: 0 auto;
        padding: 3rem 5rem;
        box-sizing: border-box;
    }

    .icons .content-text > .inside {
        padding: 0;
    }

    .icons .content-text {
        width: 100%;
        margin: 0 auto;
    }

    .icons .rte {
        margin-bottom: 0;
        padding: 0;
    }

    .icons h2 {
        padding: 0;
    }

    .icons p {
        font-size: 1rem;
    }

    /* Media */
    .content-youtube {
        padding: 0 5rem;
    }

    /* Settings */
    .row-reverse > .inside {
        flex-direction: row-reverse;
    }

    .row-reverse figure {
        display: flex;
        justify-content: flex-end;
    }

    .text-maxwidth .rte {
        max-width: 53rem;
        margin-left: 0;
    }

    .firstinfo .rte,
    .firstinfo figure {
        width: 47.5%;
    }

    .firstinfo .rte {
        padding-left: 0;
    }

    .firstinfo.fullwidth .rte {
        margin-right: 5rem;
    }

    .firstinfo.fullwidth.row-reverse .rte {
        margin-left: 5rem;
        margin-right: 0;
    }

    .firstinfo figure {
        margin-bottom: 0;
        font-size: 0;
    }

    /* Gallery */
    .content-gallery {
        max-width: 3840px;
        margin: 0 auto;
        box-sizing: border-box;
        padding: 0 5rem;
    }

    .content-gallery ul {
        display: grid;
        grid-template-columns: 10% 10% 10% 10% 10% 10%;
        grid-column-gap: 8%;
        grid-row-gap: 2.5rem;
        align-items: center;
    }

    .content-gallery li {
        position: relative;
        width: 100%;
        margin: 0 auto;
    }

    .content-gallery a:before,
    .content-gallery a:after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        opacity: 0;
        transform: translateX(-50%) translateY(-50%);
        transition: opacity 0.35s;
    }

    .content-gallery a:before {
        width: 50%;
        height: 50%;
        border-radius: 10px;
        background-color: rgba(0, 0, 0, 0.7);
    }

    .content-gallery a:hover:before {
        opacity: 1;
    }

    .content-gallery a:after {
        content: '\f002';
        color: #FFFFFF;
        font-family: 'FontAwesomeSolid';
        font-size: 2rem;
    }

    .content-gallery a:hover:after {
        opacity: 1;
    }

    /* Remove Image-Padding from Text-Container */
    .content-text.imgpadding .image_container {
        padding: 0;
    }

}

.highlight .top .image_container,
.highlight .center .item,
.highlight .bottom .item {
  position: relative;
  width: 200%;
  left: -50%;
}

.highlight .center {
  margin-bottom: 5rem;
}


@media only all and (min-width: 1150px) {

  /* Highlight */
  svg {
    overflow: hidden
  }

  .decoration {
    position: absolute;
    z-index: -1;
    height: 80%;
    width: auto;
    left: 32rem;
  }

  .decoration svg {
    fill: #f8f8f7;
  }

  .highlight > .inside {
    position: relative;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .highlight .ce_text,
  .highlight .ce_image {
    margin-bottom: 1rem;
  }

  .highlight .ce_text > .inside {
    display: flex;
  }

  .highlight .image_container {
    position: relative;
    margin-bottom: 0;
  }

  .highlight .top .image_container,
  .highlight .center .item,
  .highlight .bottom .item {
    left: auto;
  }


  .highlight .image_container,
  .highlight .text_container {
    width: 50%;
  }

  .highlight .text_container {
    display: flex;
    align-items: center;
  }

  /* Top Settings */
  .highlight .top {
    margin-bottom: 5rem;
  }

  .highlight .top .image_container {
    flex: 0 0 50%;
    height: 40rem;
    max-width: 50%;
    right: -14rem;
  }

  .highlight .top .item {
    position: absolute;
    height: 40rem;
    right: 20rem;
  }

  .highlight .top .text_container {
    flex: 0 0 50%;
  }

  /* Center Settings */
  .highlight .center {
    position: relative;
    display: flex;
    margin-bottom: 5rem;
  }

  .highlight .center .image_container {
    position: relative;
    width: auto;
    height: 30rem;
    right: -22rem;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .highlight .center .item {
    position: absolute;
    width: 98.217rem;
    height: 30rem;
    right: calc(-54.5rem + 10px);
  }

  /* Bottom Settings */
  .highlight .bottom {
    margin-bottom: 5rem;
  }

  .highlight .bottom > .inside {
    display: flex;
  }

  .highlight .bottom .image_container {
    position: relative;
    height: 30rem;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .highlight .bottom .item {
    position: absolute;
    width: 108rem;
    height: 30rem;
    left: 18rem;
  }

  .highlight .bottom .text_container {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .highlight .bottom .text_container .inside {
    margin-left: 20%
  }

}

@media only all and (min-width: 1600px) {

  /* Top Settings */
  .highlight .top .image_container {
    right: -16rem;
  }

  /* Center Settings */
  .highlight .center .image_container {
    height: 38rem;
    right: -36rem;
  }

  .highlight .center .item {
    height: 38rem;
  }

  /* Bottom Settings */
  .highlight .bottom .image_container {
    height: 25rem;
  }

  .highlight .bottom .item {
    height: 25rem;
    left: 29rem;
  }

}

@media only all and (min-width: 2000px) {

  /* Top Settings */
  .highlight .top .image_container {
    right: 2rem;
  }

  .highlight .top .text_container > .inside {
    margin-right: 40%;
  }

  /* Center Settings */
  .highlight .center .image_container {
    height: 45rem;
    right: -27rem;
  }

  .highlight .center .item {
    height: 45rem;
  }

  /* Bottom Settings */
  .highlight .bottom .image_container {
    height: 30rem;
  }

  .highlight .bottom .item {
    height: 30rem;
    left: 18rem;
  }

  .highlight .bottom .text_container > .inside {
    margin-left: 40%;
  }
}

@media only all and (min-width: 1150px) {

  #header .inside {
    width: 100%;
    margin: 0 auto;
    padding: 0 5rem;
  }

}

@media only all and (min-width: 1150px) {

  #hamburger {
    display: none;
  }

  #left {
      position: fixed;
      height: 75px;
      top: 0;
      right: 0;
      width: auto;
      left: auto;
      background-color: transparent;
      z-index: 99;
  }

  #left .inside {
      display: flex;
      width: 100%;
      max-width: 3840px;
      margin: 0 auto;
      padding: 0 5rem;
      align-items: center;
      height: 100%;
  }

  #left .mod_navigation {
    position: relative;
    width: auto;
    left: auto;
    right: 0;
    padding: inherit;
    padding-right: 0;
    background-color: transparent;
    font-size: 1.3rem;
  }

  #left .mod_navigation ul {
    display: flex;
    height: 100%;
    align-items: center;
    padding: 0;
  }

  #left .mod_navigation li, #left .mod_navigation li.first {
    padding: 0 1rem;
    border: none;
  }

  #left .mod_navigation .level_2 {
    display: none;
  }

}

/* Language Module */
.mod_changelanguage ul {
    position: relative;
    display: flex;
    flex-direction: row;
    padding: 1.7rem 1.7rem 1rem 1.7rem;
    font-size: 0;
}

.mod_changelanguage li {
    margin: auto 1.7rem auto 0;
    padding-left: 0;
}

.mod_changelanguage li a,
.mod_changelanguage li strong {
    font-size: 0;
}

/*
 * All Language Flags */
.mod_changelanguage .level_1 > * strong:after,
.mod_changelanguage .level_1 > * a:after {
    display: block;
    width: 40px;
    height: 20px;
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
}

/*
 * Active Language Flag
 */
.mod_changelanguage .level_1 .active:after {
    width: 50px;
    height: 25px;
}

.mod_changelanguage .lang-de strong:after,
.mod_changelanguage .lang-de a:after {
    background-image: url("/files/joy-pi-theme/images/de-flag.jpg");
}

.mod_changelanguage .lang-en strong:after,
.mod_changelanguage .lang-en a:after {
    background-image: url("/files/joy-pi-theme/images/en-flag.jpg");
}


@media only all and (min-width: 1150px) {
    .mod_changelanguage {
        height: 100%;
    }

    .mod_changelanguage ul {
        display: flex;
        height: 100%;
        align-items: center;
        padding: 0 1.7rem 0rem 1.7rem;
    }
}

/* PrismJS 1.29.0
https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+clike+javascript+bash+python+shell-session */
code[class*=language-],pre[class*=language-]{color:#ccc;background:0 0;font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#999}.token.punctuation{color:#ccc}.token.attr-name,.token.deleted,.token.namespace,.token.tag{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.function,.token.number{color:#f08d49}.token.class-name,.token.constant,.token.property,.token.symbol{color:#f8c555}.token.atrule,.token.builtin,.token.important,.token.keyword,.token.selector{color:#cc99cd}.token.attr-value,.token.char,.token.regex,.token.string,.token.variable{color:#7ec699}.token.entity,.token.operator,.token.url{color:#67cdcc}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}