:root
{
    --content-width: 1180px;
    --blue-main: #303698;
    --blue: #0468d7;
    --lightgray: #a8aabc;
    --pink: #ff6681;
    --darkgreen: #008A63;
    --green: #26C196;
    --lightgreen: #90EE90;
    --white-background: white;
    --white-text: white;
    --text-gray: #555;
    --text-darkgray: #434655;
    --yellow: yellow;
    --orange: #FC6A03;
    --gray-hint: #888;
    --issue-red: darkred;
    --white-background-darker: whitesmoke;
    --image-overlay-darker: rgba(48, 54, 152, .9);
    --image-overlay-lighter: rgba(48, 54, 152, .75);
}

html, body, .contact-form-slider-sensor
{
    border:0;
    box-sizing:border-box;
    width:100%;
    min-width:100%;
    max-width:100% !important;
    height:100%;
    min-height:100%;
    margin:0;
    padding:0;
    overflow-x: hidden;
    font-family: 'Overpass';
}

.typed-cursor
{
    margin-left:5px;
    color:var(--pink);
}

.contact-form-slider-sensor
{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

h1
{
    color: var(--text-darkgray);
    font-weight:800;
    font-size:2.25em;
    font-family: 'Overpass';
    margin-top:50px;
    margin-bottom:20px;
}

h2, h3
{
    color: var(--text-darkgray);
    font-weight: 800;
    font-size:2em;
    font-family: 'Overpass';
    margin-top: 70px;
    margin-bottom: 20px;
}

h3
{
    font-size:1.8em;
}

p
{
    font-size: 1.3em;
    word-wrap: break-word;
}

span
{
    word-wrap: break-word;
}

.pink-text
{
    color: var(--pink);
    font-weight: 700;
}

.spacer-10, .spacer-20, .spacer-30, .spacer-50
{
    width: 100%;
    float: left;
    margin-top:20px;
}

.spacer-10
{
    margin-top: 10px;
}

.spacer-30
{
    margin-top: 30px;
}

.spacer-50
{
    margin-top: 50px;
}

a
{
    text-decoration: none;
}
a:link, a:visited
{
    text-decoration: none;
    color:inherit;
}
a:hover
{
    text-decoration: none;
    color:inherit;
}

.inline-link
{
    color: var(--pink) !important;
    cursor: pointer;
    font-weight: 700;
}

.inline-link:hover
{
    text-decoration: underline;
    color: var(--pink);
}

.material-icons
{
    font-size: inherit;
}

.invisible
{
    display: none !important;
}

.invisible-not-important
{
    display: none;
}

.hidden
{
    display: none;
}

.center, .center-desktop-only
{
    display:flex;
    align-items:center;
    justify-content:center;
}

.justify-end
{
    justify-content: flex-end;
}

.justify-start
{
    justify-content: flex-start;
}

.pointer
{
    cursor: pointer;
}

.transition
{
    transition: all .4s ease-in-out;
}

.shadow
{
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

.hide-scrollbar {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.hide-scrollbar ::-webkit-scrollbar-thumb {
    display: none;
    visibility : hidden;
}

.hide-scrollbar ::-webkit-scrollbar {
    display: none;
    visibility : hidden;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
}

.landing
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    font-family: 'Quicksand';
}

.landingBackground
{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:calc(100% + 420px);
    background: var(--blue-main);
    background: -moz-linear-gradient(180deg, var(--blue-main),  var(--blue));
    background: -webkit-linear-gradient(180deg, var(--blue-main),  var(--blue));
    background: linear-gradient(180deg, var(--blue-main),  var(--blue));
    z-index:502;
}

.landingExtension
{
    position: relative;
    width:100%;
    height:300px;
    float:left;
    z-index:550;
    transform:rotate(180deg);
    pointer-events: none;
}

.landingExtensionImage
{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

.landingCenter
{
    position: relative;
    width:100%;
    height:auto;
    min-height:calc(100% - 300px);
    margin-top:200px;
    z-index: 550;
    pointer-events: none;
}

.landingCenterContent
{
    position: relative;
    width:var(--content-width);
    height:auto;
    box-sizing:border-box;
}

.particles-js-canvas-el
{
    position: relative;
    z-index: 400 !important;
}

.landingHeroTextCarrier
{
    position: relative;
    width:100%;
    height:auto;
}

.landingHeroTextTyped
{
    position: relative;
    width:100%;
    height:auto;
    min-height:200px;
    float:left;
    font-size:3.5em;
    font-weight:700;
    text-align:center;
    color: var(--white-background);
}

.landingHeroTextWhite
{
    color: var(--white-background);
}

.landingHeroTextColored
{
    color: var(--pink);
}

.landingHeroTextExplanation
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    margin-top:50px;
    font-size:1.75em;
    text-align:center;
    color: var(--white-background);
}

.contentBodyCarrier
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    z-index: 550;
    background-color:var(--white-background);
    flex-wrap: wrap;
}

.contentBody
{
    position: relative;
    width:var(--content-width);
    height:auto;
    float: left;
    box-sizing:border-box;
    padding-bottom:20px;
    background-color: var(--white-background);
    overflow: hidden;
}


.footer
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    flex-wrap:wrap;
    background-color: var(--blue-main);
}

.footer-inner
{
    position: relative;
    width: var(--content-width);
    box-sizing:border-box;
    padding-bottom:60px;
    font-family: 'Quicksand';
}

.footer-logo-carrier
{
    width:100%;
    float:left;
    margin-top:50px;
    margin-bottom:50px;
}

.footer-logo
{
    width:320px;
    height:72px;
}

.footer-info-groups
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    flex-wrap:wrap;
    align-items: flex-start;
    box-sizing:border-box;
    padding-left:14px;
    padding-right:14px;
    color: var(--white-text);
}

.footer-info-group
{
    position: relative;
    width:25%;
    float:left;
    box-sizing:border-box;
    color: whitesmoke;
}

.footer-info-group-headline, .footer-info-group-link
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    justify-content:flex-start;
    font-size:1.2em;
    font-weight:500;
    letter-spacing: 2px;
}

.footer-info-group-headline
{
    margin-bottom:5px;
    font-weight:700;
    color: var(--white-text);
}

.footer-info-group-link
{
    font-weight:500;
    letter-spacing: normal;
    box-sizing:border-box;
    padding-top:7.5px;
    opacity:0.75;
}

.footer-info-group-link:hover
{
    opacity: 1;
}

.footer-bottom
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    box-sizing: border-box;
    border-top:solid 2px rgba(255,255,255,.15);
    padding-top:10px;
    padding-bottom:10px;
}

.footer-inner-bottom
{
    flex-wrap: wrap;
    box-sizing:border-box;
    padding:14px;
    color: var(--white-text);
}

.footer-bottom-col
{
    position: relative;
    width:33.33%;
    height:auto;
    float:left;
}

.footer-copyright
{
    font-weight:700;
}

.footer-legal-link
{
    padding-left:10px;
    padding-right:10px;
    font-size:1.1em;
    font-weight:700;
    opacity: .8;
}

.footer-legal-link:hover
{
    opacity: 1;
}


.footer-systems-status
{
    position: relative;
    width: auto;
    height: auto;
    box-sizing:border-box;
    border-radius:100px;
    padding:5px;
    padding-left:15px;
    padding-right:15px;
    font-size: 1.1em;
    font-weight:700;
    border: solid 2px transparent;
}

.footer-systems-status-healthy
{
    color: var(--lightgreen) !important;
    border-color: var(--lightgreen);
}

.footer-systems-status-healthy .footer-systems-status-unhealthy-icon
{
    display: none !important;
}

.footer-systems-status-healthy:hover
{
    color: var(--lightgreen);
}

.footer-systems-status-unhealthy .footer-systems-status-healthy-icon
{
    display: none !important;
}


.footer-systems-status-unhealthy
{
    color:  var(--yellow) !important;
    border-color:  var(--yellow) !important;
}

.footer-systems-status-unhealthy:hover
{
    color: var(--yellow) !important;
    border-color:  var(--yellow) !important;
}

.contact-overlay
{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color: var(--blue-main);
    z-index: 999999;
    overflow: auto;
    align-items: flex-start !important;
}

.contact-overlay-inner
{
    position: absolute;
    top:0;
    left:0;
    width:100%;
}

.contact-overlay-content
{
    position: relative;
    width: 1180px;
    height: auto;
    float:left;
    box-sizing:border-box;
    border-top-left-radius: 5px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 5px;
    background-color: var(--white-background);
    color:var(--text-darkgray);
    margin-top:100px;
    margin-bottom:100px;
}

.contact-overlay-top
{
    position: relative;
    width:100%;
    height:100px;
    box-sizing:border-box;
    border-bottom: solid 1px var(--lightgray);
}

.contact-overlay-logo
{
    position: relative;
    width:100px;
    height:100%;
    float:left;
}

.contact-overlay-logo-image
{
    position: relative;
    width:80px;
    height:80px;
    overflow:hidden;
}

.contact-overlay-headline
{
    position: relative;
    width: calc(100% - 200px);
    height:100%;
    float:left;
    font-size:2em;
    font-family: 'Quicksand';
    font-weight: 700;
}

.contact-overlay-close-button
{
    position: relative;
    width:100px;
    height:100px;
    float:left;
    font-size:2.5em;
    color:var(--pink);
    opacity:.7;
    cursor: pointer;
}

.contact-overlay-close-button:hover
{
    opacity: 1;
}

.contact-overlay-center
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
}

.contact-overlay-progress
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    box-sizing:border-box;
    border-top:solid 1px var(--lightgray);
}

.contact-overlay-progressbar
{
    position: relative;
    width:auto;
    height:auto;
    float:left;
    box-sizing:border-box;
    padding-top:15px;
    padding-bottom:15px;
}

.contact-overlay-stage-progress, .contact-overlay-stage-progress-delim, .contact-overlay-stage-progress-delim-greyed
{
    position: relative;
    width:auto;
    height:auto;
    box-sizing:border-box;
    border:solid 2px var(--lightgray);
    border-radius: 100px;
    padding:7.5px;
    font-family: 'Quicksand';
    font-weight:700;
    color:var(--lightgray);
}

.contact-overlay-stage-progress-done
{
    color:var(--green);
    background: var(--white-background);
    border: solid 2px var(--green);
}

.contact-overlay-stage-progress-spacer, .contact-overlay-stage-progress-delim-spacer, .contact-overlay-stage-progress-delim-spacer-greyed
{
    position: relative;
    width:15px;
    height:0;
    box-sizing:border-box;
    border-top:solid 1px var(--lightgray);
    border-bottom: solid 1px var(--lightgray);
    float:left;
}

.contact-overlay-stage-progress-spacer-done
{
    border-top:solid 1px var(--green);
    border-bottom:solid 1px var(--green);
}

.contact-overlay-stage-progress-active
{
    font-size: 1.2em;
}

.contact-overlay-stage-progress-delim, .contact-overlay-stage-progress-delim-greyed
{
    background-color: var(--green);
    color: var(--green);
    border-color: var(--green);
    width: 15px;
    height: 15px;
}

.contact-overlay-stage-progress-delim-greyed
{
    background-color: var(--lightgray);
    color: var(--lightgray);
    border-color: var(--lightgray);
}

.contact-overlay-stage-progress-delim-spacer, .contact-overlay-stage-progress-delim-spacer-greyed
{
    width: 30px;
    border-color: var(--green) !important;
}

.contact-overlay-stage-progress-delim-spacer-greyed
{
    border-color: var(--lightgray) !important;
}

.contact-overlay-stage
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
}

.contact-overlay-stage-bottom
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    box-sizing:border-box;
    padding-top:20px;
    padding-bottom:20px;
}

.contact-overlay-stage-button
{
    position: relative;
    width:auto;
    height:40px;
    box-sizing:border-box;
    padding-left:20px;
    padding-right:20px;
    margin-left:20px;
    margin-right:20px;
    border-radius: 40px;
    font-family:'Quicksand';
    font-size:1.4em;
    font-weight: 700;
}

.contact-overlay-continue-btn
{
    background-color: var(--green);
    color: var(--white-text);
    border:solid 2px var(--green);
}

.contact-overlay-continue-btn:hover
{
    color:var(--green);
    background-color: var(--white-background);
}

.contact-overlay-back-btn
{
    background-color: var(--pink);
    color:var(--white-text);
    border: solid 2px var(--pink);
}

.contact-overlay-back-btn:hover
{
    color:var(--pink);
    background-color:var(--white-background);
}

.contact-overlay-stage-dialogue
{
    width: calc(100% - 40px);
    margin-left: 20px;
    margin-right: 20px;
    margin-top:50px;
    margin-bottom:50px;
    flex-wrap:wrap;
}

.contact-overlay-stage-dialogue-spaced
{
    width:calc(100% - 400px);
    margin-left:200px;
    margin-right:200px;
}

.contact-overlay-typebutton
{
    position: relative;
    width:300px;
    height:auto;
    float:left;
    margin-left:calc((50% - 300px) / 2);
    margin-right:calc((50% - 300px) / 2);
    border-radius:20px;
    border:solid 3px transparent;
    box-sizing:border-box;
}

.contact-overlay-typebutton:hover
{
    background: white;
    border:solid 3px var(--green)
}

.contact-overlay-typebutton-image-carrier
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
}

.contact-overlay-typebutton-image
{
    position: relative;
    width:250px;
    height:250px;
    box-sizing:border-box;
    padding-top:25px;
    padding-bottom:25px;
    overflow: hidden;
}

.contact-overlay-typebutton-name
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    box-sizing:border-box;
    padding:10px;
    padding-bottom:30px;
    font-size:1.2em;
    font-weight:700;
    font-family: 'Quicksand';
    text-align:center;
}

.contact-overlay-stage-project-type
{
    position: relative;
    width: 275px;
    height: 350px;
    box-sizing:border-box;
    border-radius:10px;
    border: solid 3px var(--white-background);
    padding: 10px;
    margin: 20px;
}

.contact-overlay-stage-project-type:hover
{
    background: white;
    border:solid 3px var(--green);
}

.contact-overlay-stage-project-type-icon, .contact-overlay-stage-project-type-name, .contact-overlay-stage-project-type-description
{
    position: relative;
    width: 100%;
    height: auto;
    float:left;
}

.contact-overlay-stage-project-type-icon
{
    font-size:4.5em;
    color: var(--blue-main);
    height:100px;
}

.contact-overlay-stage-project-type-name
{
    font-size: 1.4em;
    color: var(--text-darkgray);
    font-family: 'Quicksand';
    font-weight:700;
    height:25px;
    margin-top: 5px;
}

.contact-overlay-stage-project-type-description
{
    color: var(--text-darkgray);
    font-family: 'Quicksand';
    font-size:1em;
    font-weight:600;
    height: 220px;
    align-items: flex-start;
    margin-top:25px;
    text-align: center;
}

.contact-form-table
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    box-sizing: border-box;
}

.contact-form-row
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
}

.contact-form-col-50, .contact-form-col-100
{
    position: relative;
    width: calc(50% - 40px);
    height:auto;
    float:left; 
    box-sizing:border-box;
    margin: 20px;
    overflow-x: hidden;
    overflow-y: auto;
}

.contact-form-col-100
{
    width: calc(100% - 40px);
}

.contact-form-input-name
{
    position: relative;
    width: 100%;
    height: auto;
    float:left;
    font-family: 'Quicksand';
    font-weight: 700;
    font-size:1em;
    color: var(--gray-hint);
    margin-bottom: 10px;
}

.contact-form-input, .contact-form-input-textarea
{
    position: relative;
    width: calc(100% - 30px);
    height: 30px;
    float: left;
    box-sizing:border-box;
    border: 0;
    border-bottom: solid 1px var(--lightgray);
    outline: 0;
    background-color: transparent;
    font-family: 'Quicksand';
    font-weight: 500;
    font-size:1.2em;
    color: var(--text-darkgray);
}

.contact-form-input-textarea
{
    width: 100%;
}

.contact-form-input-status-icon
{
    width: 30px;
    height: 30px;
    float: left;
    box-sizing:border-box;
    border-bottom: solid 1px var(--lightgray);
    font-size: 1.5em;
}

.contact-form-input-status-icon-empty
{
    color: var(--gray-hint);
}

.contact-form-input-status-icon-issue
{
    color: var(--issue-red);
}

.contact-form-input-status-icon-good
{
    color: var(--green);
}

.contact-form-input-status-icon-active
{
    border-color: var(--text-gray) !important
}

.contact-form-input-textarea
{
    min-height: 50px;
    max-height: 300px;
    padding: 15px;
    padding-left: 0px;
    box-sizing: border-box;
    resize: none;
    overflow: hidden;
    transition: border .4s ease-in-out;
    line-height: 150%;
}

.contact-form-input:active, .contact-form-input:focus, .contact-form-input-textarea:active, .contact-form-input-textarea:focus
{
    border: 0;
    border-bottom: solid 1px var(--text-darkgray);
    outline: 0;
}


.contact-overlay-close-ui, .contact-overlay-send-ui
{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display: none;
    border-top-left-radius: 5px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 5px;
    background-color: var(--white-background);
    z-index:99999;
}

.contact-overlay-close-ui-inner, .contact-overlay-send-ui-inner
{
    position: absolute;
    top: 0;
    left:0;
    width:100%;
    height:100%;
    align-items: flex-start !important;
}

.contact-overlay-send-ui-inner
{
    align-items: center !important;
}

.contact-overlay-send-ui-window
{
    position: relative;
    min-width: 300px;
    width: 100%;
    max-width: 600px;
    height: auto;
}

.contact-overlay-send-ui-spinner, .contact-overlay-send-ui-text, .contact-overlay-send-ui-button-carrier 
{
    position: relative;
    width: 100%;
    height: auto;
    float: left;
}

.contact-overlay-send-ui-spinner-image
{
    width: 150px;
    height: 150px;
}

.contact-overlay-send-ui-error-icon, .contact-overlay-send-ui-success-icon
{
    display: none;
    color: var(--issue-red);
    font-size:5em;
}

.contact-overlay-send-ui-success-icon
{
    color: var(--green);
}

.contact-overlay-send-ui-text
{
    box-sizing:border-box;
    padding: 50px;
    font-size: 1.5em;
    font-family: 'Quicksand';
    font-weight: 700;
    text-align:center;
    display: none;
}

.contact-overlay-send-ui-error
{
    color: var(--issue-red);
}

.contact-form-input-hint
{
    position: relative;
    width: 100%;
    height: auto;
    float:left;
    display: none;
    box-sizing:border-box;
    padding: 15px;
    padding-left: 0;
    color: var(--issue-red);
    font-family: 'Quicksand';
    font-weight: 500;
}

.contact-form-required
{
    position: relative;
    font-size:1.1em;
    padding-left: 3px;
    color: var(--pink)
}

.contact-form-submit-button-carrier
{
    position: relative;
    width: 100%;
    height: auto;
    float:left; 
}

.contact-form-submit-button, .contact-overlay-send-ui-button
{
    position: relative;
    width: auto;
    height: 45px;
    box-sizing:border-box;
    padding-left: 50px;
    padding-right: 50px;
    border-radius: 25px;
    float:left;
    font-family: 'Quicksand';
    font-weight: 700;
    background-color: var(--blue-main);
    border: solid 2px var(--blue-main);
    color: white;
    font-size:1.2em;
}

.contact-overlay-send-ui-button
{
    display: none;
}

.contact-form-submit-button:hover, .contact-overlay-send-ui-button:hover
{
    background-color: transparent;
    color: var(--blue-main);
}

.contact-overlay-close-window
{
    width: calc(100% - 20px);
    max-width: 300px;
    height: auto;
    background-color: white;
    border-radius: 20px;
    margin-top:300px;
    margin-left: 10px;
    margin-right: 10px;
}

.contact-overlay-close-confirm-headline
{
    width: 100%;
    height: auto;
    margin-top: 20px;
    margin-bottom: 10px;
    font-family: 'Quicksand';
    font-weight: 700;
    font-size: 1.15em;
}

.contact-overlay-close-confirm-button-carrier
{
    width: 50%;
    height: auto;
    float:left;
    margin-top: 10px;
    margin-bottom: 20px;
}

.contact-overlay-close-confirm-button
{
    width: 100px;
    height: 30px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 1.1em;
    background-color: var(--blue-main);
    border: solid 2px var(--blue-main);
    color: white;
}

.contact-overlay-close-confirm-button:hover
{
    background-color: white;
    border-color: var(--blue-main);
    color: var(--blue-main);
}

.contact-form-missing-contact-hint
{
    position: relative;
    width:100%;
    height:auto;
    margin-bottom:20px;
    color: var(--pink);
    font-size:1.2em;
    font-family: 'Quicksand';
    font-weight: 700;
}

.contact-form-slider
{
    position: relative;
    width: 100%;
	height:1px !important;
    float:left;
	margin-top:25px;
	background:var(--lightgray);
	overflow:visible;
}

.contact-form-slider-handle
{
	position:absolute;
	top:-5px;
	left:calc(7.14% - 5px);
	width:10px;
	height:10px;
	box-sizing:border-box;
	border-radius:100px;
	background:var(--blue-main);
	cursor:pointer;
    pointer-events: none;
	z-index:9998;
}

.contact-form-slider-items
{
	height:100px !important;
}

.contact-form-slider-item
{
    position: relative;
    float:left;
	width:14.28% !important;
	height:100% !important;
	cursor:pointer;
	color:var(--text-gray);
	font-family:'Quicksand';
	font-size:1em;
    font-weight: 600;
	transition:all .4s ease-in-out;
}

.contact-form-slider-item:hover
{
	font-size:1.1em;
	color:#095791;
}

.contact-form-slider-item-active
{
	font-size:1.1em;
	font-weight:bold;
	color:#095791;	
}

.treadmill
{  
    position: relative;
    float: left;
    width: 100%;
	height:210px;
	background:var(--white-background-darker);
}

.treadmillheadline
{
    position: relative;
    width: 100%;
    height: 60px;
    float: left;
    align-items: flex-end;
    margin-bottom: 10px;
    font-size: 1.5em;
    font-family: 'Quicksand';
    font-weight: 700;
    color: var(--text-darkgray)
}

.treadmillinner
{
	position:absolute;
	top:60px;
	left:0;
	height:150px;
    overflow: hidden;
}

.treadmillitem
{
    position: relative;
	width:300px;
	height:150px;
    float:left;
    box-sizing: border-box;
    padding:20px;
}

.treadmillitem-inner
{
    position: relative;
    width: 125px;
    height: 125px;
    overflow: hidden;
}

.treadmillitem-image
{
    filter: grayscale(100%) opacity(.5);
    transition: all .4s ease-in-out;
}

.treadmillitem-image:hover
{
    filter:none
}


.fullscreen-picture-carrier
{
    position: relative;
    width: 100%;
    height: 700px;
    float: left;
    overflow: hidden;
}

.fullscreen-picture
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.fullscreen-picture-overlay
{
    position: relative;
    width: 100%;
    height: 100%;
    float: left;
    background: var(--image-overlay-darker);
}

.fullscreen-picture-content
{
    position: relative;
    width: 90%;
    height: auto;
    float: left;
    color: var(--white-text);
    flex-wrap: wrap;
}

.fullscreen-picture-headline, .fullscreen-picture-text
{
    position: relative;
    width: 100%;
    height: auto;
    float: left;
    font-family: 'Barlow';
    font-size:3em;
    text-align: center;
}

.fullscreen-picture-text
{
    margin-top: 40px;
    font-size:2em;
    text-align: center;
}

.cta
{
    position: relative;
    width:100%;
    height:auto;
    box-sizing:border-box;
    padding-top:50px;
    padding-bottom:50px;
    background-color:var(--pink);
    flex-wrap: wrap;
}

.cta-headline
{
    position: relative;
    width:100%;
    height:auto;
    float:left;
    color:var(--white-text);
    font-size:2em;
    margin-bottom:30px;
}

.cta-button
{
    position: relative;
    width:auto;
    height:45px;
    float:left;
    box-sizing:border-box;
    border-radius: 30px;
    padding-left:40px;
    padding-right:40px;
    border:solid 2px white;
    color:var(--white-text);
    font-family:'Quicksand';
    font-weight:700;
    font-size:1.3em;
}

.cta-button:hover
{
    color:var(--pink);
    background-color:var(--white-background);
}

.infocards
{
    position: relative;
    width:100%;
    height:auto;
    margin-top: 30px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.infocard
{
    width:350px;
    height:auto;
    box-sizing: border-box;
    border: solid 1px #eee;
    color: var(--text-darkgray);
    margin-bottom: 50px;
    padding-bottom: 20px;
}

.infocard:nth-child(3n-1)
{
    margin-left: 65px;
    margin-right: 65px;
}

.infocard-image
{
    width:250px;
    height:250px;
}

.infocard-image-carrier
{
    width:100%;
    height:300px;
    overflow: hidden;
}

.infocard-name, .infocard-description
{
    position: relative;
    width:100%;
    height:auto;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
}

.infocard-name
{
    font-family: 'Quicksand';
    font-weight:700;
    font-size:1.5em;
    margin-bottom: 20px;
}

.infocard-description
{
    font-size:1.3em;
}

.infocard-button-carrier
{
    position: relative;
    width: 100%;
    height: auto;
    float: left;
    margin-top: 20px;
    margin-bottom: 20px;
}

.infocard-button
{
    position: relative;
    width: 250px;
    height: 40px;
    border-radius: 20px;
    border: solid 2px var(--pink);
    box-sizing: border-box;
    background-color: var(--pink);
    color: var(--white-text) !important;
    font-weight: 700;
    font-size: 1.2em;
}

.infocard-button:hover
{
    color: var(--pink) !important;
    background-color: var(--white-background);
}

.hexgrid
{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    float: left;
    height: auto;
    overflow: hidden;
    font-family: sans-serif;
    list-style-type: none;
    margin-left: 0 !important;
    padding-left: 0 !important;
    margin-right: 0 !important;
    padding-right: 0 !important;
}

.hex
{
    position: relative;
    visibility:hidden;
    outline:1px solid transparent; /* fix for jagged edges in FF on hover transition */
    transition: all 0.5s;
    backface-visibility: hidden;
    will-change: transform;
    transition: all 0.5s;
}
.hex::after
{
    content:'';
    display:block;
    padding-bottom: 86.602%;  /* =  100 / tan(60) * 1.5 */
}

.hex-inner
{
    position: absolute;
    width:96%;
    padding-bottom: 110.851%; /* =  width / sin(60) */
    margin: 2%;
    overflow: hidden;
    visibility: hidden;
    outline:1px solid transparent; /* fix for jagged edges in FF on hover transition */
    -webkit-transform: rotate3d(0,0,1,-60deg) skewY(30deg);
        -ms-transform: rotate3d(0,0,1,-60deg) skewY(30deg);
            transform: rotate3d(0,0,1,-60deg) skewY(30deg);
      transition: all 0.5s;
}

.hex-content
{
    position: absolute;
    visibility: visible;
}

.hex-content {
    display:block;
    width: 100%;
    height: 100%;
    text-align: center;
    color: #fff;
    background-color: var(--blue-main);
    overflow: hidden;
    -webkit-transform: skewY(-30deg) rotate3d(0,0,1,60deg);
        -ms-transform: skewY(-30deg) rotate3d(0,0,1,60deg);
            transform: skewY(-30deg) rotate3d(0,0,1,60deg);
}

.hex:nth-child(2n) .hex-content
{
    background-color: var(--blue)
}

.hex-row
{
    position: relative;
    width:100%;
    height:auto;
    align-items: flex-end;
    float:left;
}

.hex-icon-carrier
{
    position: relative;
    width:60px;
    height:60px;
    margin-top:30px;
    overflow: hidden;
}

.hex-icon
{
    position: relative;
    width:100%;
    height:100%;
    max-width:100%;
    max-height:100%;
}

.hex-name, .hex-text
{
    height:auto;
    margin-top:10px;
    float:left;
    font-weight:700;
    font-family:'Quicksand';
    font-size:1.5em;
    color:var(--white-text);
    text-align: center;
    word-wrap: break-word;
}

.hex-text
{
    font-size:1em;
    box-sizing: border-box;
    padding: 5px;
    padding-top: 0;
}

.carousel-outer
{
    position: relative;
    width:calc(100% - 100px);
    height:500px;
    perspective: 1000px;
    box-sizing:border-box;
    overflow: hidden;
    float: left;
}

.carousel
{
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 1s;
}

.carousel-cell
{
    position: absolute;
    width: 100%;
    height: 100%;
    transition: transform 1s, opacity 1s;
    box-sizing:border-box;
    overflow: hidden;
    background-color: white;
}

.carousel-carrier
{
    width: 100%;
    height: auto;
    box-sizing: border-box;
    overflow: hidden;
}

.carousel-control-bar
{
    position: relative;
    width: 100%;
    height: auto;
    float: left;
    box-sizing: border-box;
    display: flex;
}

.carousel-control-btn
{
    position: relative;
    width: 50px;
    height: auto;
    float: left;
    opacity: .5;
    min-height: 50px;
    font-size: 2em;
    color: var(--blue-main);
    display: flex;
}

.carousel-control-btn:hover
{
    opacity: 1;
    font-size:2.5em;
}

.carousel-page-left
{
    position: relative;
    width: 500px;
    height: 100%;
    float: left;
}

.carousel-control-bullets
{
    position: relative;
    width: calc(100% - 100px);
    height: auto;
    min-height: 50px;
    flex-wrap: wrap;
    float: left;
}

.carousel-control-bullet
{
    position: relative;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
    border-radius: 20px;
    border: solid 2px var(--blue-main);
    margin: 5px;    
}

.carousel-control-bullet:hover
{
    background-color: var(--blue-main);
}

.carousel-control-bullet-active
{
    background-color: var(--blue-main);
}

.carousel-page-image
{
    position: relative;
    width: 400px;
    height: 400px;
}

.carousel-page-right
{
    position: relative;
    width: calc(100% - 500px);
    height: 100%;
    float: left;
}
.carousel-page-headline, .carousel-page-text
{
    position: relative;
    width: 100%;
    height: auto;
    float: left;
    box-sizing: border-box;
    padding: 20px;
    color: var(--text-darkgray);
}

.carousel-page-headline
{
    font-size: 1.75em;
    text-align: center;
    margin-top: 20px;
}

.carousel-page-text
{
    font-size:1.35em;
}

.team-members
{
    width: 100%;
    height: auto;
    float: left;
    flex-wrap: wrap;
}

.team-member
{
    position: relative;
    min-width: 300px;
    width: 300px;
    height: 460px;
    color: var(--text-darkgray);
    box-sizing: border-box;
    overflow: hidden;
}

.team-member:nth-child(3n-1)
{
    margin-left: 140px;
    margin-right: 140px;
}

.team-member-image
{
    position: relative;
    width: 300px;
    height: 300px;
    overflow: hidden;
}

.team-member-image-frame, .team-member-about
{
    position: relative;
    width: 100%;
    float: left;
}

.team-member-name, .team-member-job
{
    position: relative;
    width: 100%;
    height: auto;
    float: left;
    box-sizing: border-box;
    pointer-events: none;
    text-align: center;
}

.team-member-name
{
    font-weight: bold;
    font-size: 1.5em;
    padding: 20px;
    padding-bottom: 0px;
    text-align: center;
}

.team-member-job
{
    font-style: italic;
    font-weight: 500;
    padding: 5px;
    padding-left: 20px;
    font-family: 'Quicksand';
    font-size:1.1em;
}

.team-member-description
{
    font-size:1.2em;
    font-weight: 500;
    padding: 20px;
}


@media (min-width:1201px)
{
    .hexgrid
    {
        padding-bottom: 6%
    }
    .hex
    {
        width: 20%;
    }
    .hex:nth-child(9n+6)
    {
        margin-left:10%;
    }
}

@media (max-width: 1200px) and (min-width:1001px)
{ 
    .hexgrid{
        padding-bottom: 7.5%;
        font-size: 13px;
    }
    .hex {
        width: 25%;
    }
    .hex:nth-child(7n+5){
        margin-left:12.5%;
    }

    .hex-name
    {
        margin-top:10px;
    }

    .hex-text
    {
        font-size: 1.2em;
    }
}

@media (max-width: 1000px) and (min-width:901px)
{ 
    .hexgrid{
        padding-bottom: 7.5%;
        font-size: 13px;
    }
    .hex {
        width: 25%;
    }
    .hex:nth-child(7n+5){
        margin-left:12.5%;
    }

    .hex-name
    {
        margin-top:10px;
        margin-bottom: 0;
    }

    .hex-text
    {
        font-size: 1em;
    }
}

@media (max-width: 900px) and (min-width:716px)
{ 
    .hexgrid{
        padding-bottom: 9%;
        font-size: 14px;
    }
    .hex {
        width: 33.333%;
    }
    .hex:nth-child(5n+4){
        margin-left:16.666%;
    }

    .hex-name
    {
        margin-top:10px;
        margin-bottom: 0;
    }

    .hex-text
    {
        font-size: 1em;
    }

}

@media (max-width: 715px) and (min-width:601px)
{ 
    .hexgrid{
        padding-bottom: 9%;
        font-size: 14px;
    }
    .hex {
        width: 33.333%;
    }
    .hex:nth-child(5n+4){
        margin-left:16.666%;
    }

    .hex-name
    {
        margin-top:10px;
        font-size:1.2em;
    }

    .hex-icon-carrier
    {
        width: 40px;
        height: 40px;
    }

    .hex-text
    {
        font-size: .9em;
    }

}
  
@media (max-width: 600px) and (min-width:0px)
{
    .hexgrid
    {
        padding-bottom: 13.2%;
        font-size: 12px;
    }
    .hex
    {
        width: 50%;
    }
    .hex:nth-child(3n+3)
    {
        margin-left:25%;
    }
}

@media (max-width: 600px)
{
    .hex-icon-carrier
    {
        width: 60px;
        height: 60px;
        margin-top:30px;
    }

    .hex-name
    {
        font-size:1.5em;
        margin-top: 15px;
        margin-bottom: 5px;
    }

    .hex-text
    {
        font-size:1.05em;
        margin-top:5px;
    }
}

@media (max-width: 450px)
{
    .hex-icon-carrier
    {
        width: 50px;
        height: 50px;
        margin-top:30px;
    }

    .hex-name
    {
        margin-top: 8px;
        font-size:1.3em;
    }

    .hex-text
    {
        font-size:1em;
        margin-top:5px;
    }
}
  
@media (max-width: 400px) {
    .hex-icon-carrier
    {
        width: 40px;
        height: 40px;
        margin-top:20px;
    }

    .hex-name
    {
        font-size:1.2em;
        margin-top: 8px;
    }

    .hex-text
    {
        font-size:.9em;
        margin-top:0px;
    }
}

@media (max-width: 350px) {
    .hex-icon-carrier
    {
        width: 30px;
        height: 30px;
        margin-top:20px;
    }

    .hex-name
    {
        font-size:1.1em;
        margin-top: 5px;
    }

    .hex-text
    {
        font-size:.75em;
        margin-top:0px;
    }
}


@media only screen and (max-width: 1179px)
{

    h1
    {
        font-weight:800;
        font-size:1.65em;
    }
    
    h2, h3
    {
        font-weight: 800;
        font-size:1.4em;
    }

    h3
    {
        font-size:1.2em;
    }

    p
    {
        font-size:1.1em;
    }

    .landing
    {
        height:auto;
    }

    .landingCenter
    {
        margin-top:150px;
        align-items: flex-start;
    }

    .landingCenterContent
    {
        width:100%;
    }

    .landingHeroTextTyped
    {
        position: relative;
        width:90%;
        margin-left:5%;
        margin-right:5%;
        font-size:2em;
    }

    .landingExtension
    {
        height:150px;
    }

    .landingBackground
    {
        height:calc(100% + 150px);
    }

    .landingHeroTextExplanation
    {
        width:90%;
        margin-left:5%;
        margin-right:5%;
    }
}

@media only screen and (max-width: 1179px)
{

    .fullscreen-picture-carrier
    {
        height: 500px;
    }

    .center-desktop-only
    {
        display: unset;
        align-items: unset;
        justify-content: unset;
    }

    .contentBody
    {
        width: 90%;
        margin-left:5%;
        margin-right:5%;
    }

    .navbarDesktop
    {
        display: none !important;
    }

    .navbarMobile
    {
        position: fixed;
        top:0;
        left:0;
        width:100%;
        height:70px;
        box-sizing:border-box;
        font-family: 'Quicksand';
        background-color: transparent;
        z-index: 9998;
    }

    .navbarMobileLogoCarrier, .navbarMobileMenuButtonCarrier, .navbarMobileCenter
    {
        position: relative;
        width:70px;
        height:100%;
        float:left;
    }

    .navbarMobileLogo
    {
        position: relative;
        width:50px;
        height:50px;
        float:left;
    }

    .navbarMobileCenter
    {
        width:calc(100% - 140px);
    }

    .navbarMobileMenuButton
    {
        width:30px;
        height:30px;
        font-size:1.5em;
        color: var(--white-background);
    }

    .navbarMobileText
    {
        position: relative;
        width:100%;
        height:100%;
        color:var(--white-background);
    }

    .navbarMobileHeadline
    {
        width:100%;
        height:50%;
        float:left;
        align-items:flex-end;
        font-weight:700;
        font-size:1.1em;
    }

    .navbarMobileSlogan
    {
        width:100%;
        height:50%;
        float:left;
        align-items:flex-start;
        font-weight:500;
        font-size:.9em;
        letter-spacing: 1.9px;
    }

    .navMobileMenu
    {
        position: absolute;
        top:0;
        left:-100%;
        width:100%;
        height:100%;
        z-index: 9997;
        font-family: 'Quicksand';
        background-color: rgb(48,54,152);
    }

    .navMobileMenuInner
    {
        position: absolute;
        top:70px;
        left:0;
        width:100%;
        height:calc(100% - 70px);
    }

    .navMobileMenuItems
    {
        position: absolute;
        top:0;
        left:0;
        width:100%;
        height:calc(100% - 180px);
        margin-bottom:20px;
        box-sizing:border-box;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .navMobileMenuCategory
    {
        position: relative;
        width:100%;
        height:40px;
        margin-top:20px;
        float:left;
        overflow: hidden;
    }

    .navMobileMenuCategoryIcon, .navMobileMenuCategoryName, .navMobileMenuCategoryExpand
    {
        position: relative;
        width:70px;
        height:100%;
        float:left;
        overflow: hidden;
        color:var(--white-background);
    }

    .navMobileMenuCategoryIcon
    {
        font-size: 1.5em;
    }

    .navMobileMenuCategoryName
    {
        width:auto;
        max-width:calc(100% - 90px) !important;
        height:100%;
        font-size:1.1em;
        font-weight:700;
    }

    .navMobileMenuCategoryExpand
    {
        width:40px;
        font-size: 1.5em;
    }

    .navMobileMenuSubcategories
    {
        position: relative;
        width:100%;
        height:0px;
        float:left;
        overflow:hidden;
    }

    .navMobileMenuSubcategory
    {
        position: relative;
        width:calc(100% - 50px);
        height:40px;
        float:left;
        margin-left:70px;
        justify-content: flex-start;
        font-weight:700;
        color:var(--white-background) !important;
    }

    .navMobileMenuBottom
    {
        position: absolute;
        top:calc(100% - 140px);
        left:0;
        width:100%;
        height:140px;
        box-sizing:border-box;
        padding-top:10px;
        padding-bottom:10px;
    }

    .navMobileMenuButtonCarrier, .navMobileMenuButtonLanguage
    {
        position: relative;
        width:100%;
        height:60px;
        float:left;
    }

    .navMobileMenuButtonLanguage
    {
        height:60px;
        font-weight: 700;
        color:var(--white-background)
    }

    .navMobileMenuButton
    {
        position: relative;
        width:250px;
        height:40px;
        border-radius:20px;
        font-weight: 700;
        color:rgb(48,54,152);
        background-color:var(--white-background);
    }

    .footer-inner
    {
        width:90%;
        margin-left:5%;
        margin-right:5%;
    }

    .footer-info-group
    {
        width:50%;
        margin-bottom:40px;
    }

    .footer-inner-bottom
    {
        flex-direction: column-reverse;
        margin-bottom:25px;
    }

    .footer-bottom-col
    {
        margin-top:50px;
        width:100%;
        justify-content: center !important;
    }

    .footer-logo
    {
        width:300px;
        height:70x;
    }

    .contact-overlay
    {
        position: absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background-color: var(--blue-main);
        z-index: 999999;
        overflow: auto;
        align-items: flex-start !important;
    }
    
    .contact-overlay-content
    {
        position: relative;
        width: 100%;
        height: auto;
        min-height:100%;
        float:left;
        box-sizing:border-box;
        border-radius: 0;
        background-color: var(--white-background);
        color:var(--text-darkgray);
        margin: 0 !important;
    }
    
    .contact-overlay-top
    {
        position: relative;
        width:100%;
        height:80px;
        float:left;
        box-sizing:border-box;
        border-bottom: solid 1px var(--lightgray);
        padding-top: 10px;
        padding-bottom: 10px;
    }
    
    .contact-overlay-logo
    {
        position: relative;
        width:60px;
        height:100%;
        float:left;
    }
    
    .contact-overlay-logo-image
    {
        position: relative;
        width:45px;
        height:45px;
        overflow:hidden;
    }
    
    .contact-overlay-headline
    {
        position: relative;
        width: calc(100% - 120px);
        height:100%;
        min-height: 60px;
        float:left;
        font-size:1.25em;
        font-family: 'Quicksand';
        font-weight: 700;
        text-align: center;
    }
    
    .contact-overlay-close-button
    {
        position: relative;
        width:60px;
        height:100%;
        float:left;
        font-size:1.5em;
        color:var(--pink);
        opacity:.7;
        cursor: pointer;
    }
    
    .contact-overlay-close-button:hover
    {
        opacity: 1;
    }
    
    .contact-overlay-center
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
    }
    
    .contact-overlay-progress
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
        box-sizing:border-box;
        border-top:solid 1px var(--lightgray);
        margin-top:30px;
    }
    
    .contact-overlay-progressbar
    {
        position: relative;
        width:auto;
        height:auto;
        float:left;
        box-sizing:border-box;
        padding-top:15px;
        padding-bottom:15px;
        flex-wrap: wrap;
    }


    .contact-form-slider-sensor
    {
        width:calc(100% - 80px);
        min-width: calc(100% - 80px) !important;
        margin-right: 80px;
    }

    .contact-overlay-stage-progress, .contact-overlay-stage-progress-delim, .contact-overlay-stage-progress-delim-greyed
    {
        position: relative;
        width:100%;
        max-width: 290px;
        height:auto;
        box-sizing:border-box;
        border:solid 2px var(--lightgray);
        border-radius: 100px;
        padding:7.5px;
        font-family: 'Quicksand';
        font-weight:700;
        color:var(--lightgray);
        font-size:.9em;
        float: left;
    }
    
    .contact-overlay-stage-progress-done
    {
        color:var(--green);
        background: var(--white-background);
        border: solid 2px var(--green);
    }
    
    .contact-overlay-stage-progress-spacer, .contact-overlay-stage-progress-delim-spacer, .contact-overlay-stage-progress-delim-spacer-greyed
    {
        position: relative;
        width:0;
        height:10px;
        box-sizing:border-box;
        border-left:solid 1px var(--lightgray);
        border-right: solid 1px var(--lightgray);
        float:left;
        margin-left: calc(50% - 1px);
        margin-right: calc(50% - 1px);
    }
    
    .contact-overlay-stage-progress-spacer-done
    {
        border-top:solid 1px var(--green);
        border-bottom:solid 1px var(--green);
    }
    
    .contact-overlay-stage-progress-active
    {
        font-size: 1em;
    }
    
    .contact-overlay-stage-progress-delim, .contact-overlay-stage-progress-delim-greyed
    {
        background-color: var(--green);
        color: var(--green);
        border-color: var(--green);
        width: 16px;
        height: 16px;
        box-sizing: border-box;
        position: relative;
        margin-left: calc(50% - 8px);
        margin-right: calc(50% - 8px);
    }
    
    .contact-overlay-stage-progress-delim-greyed
    {
        background-color: var(--lightgray);
        color: var(--lightgray);
        border-color: var(--lightgray);
    }
    
    .contact-overlay-stage-progress-delim-spacer, .contact-overlay-stage-progress-delim-spacer-greyed
    {
        width: 0;
        float: left;
        border-color: var(--green) !important;
    }
    
    .contact-overlay-stage-progress-delim-spacer-greyed
    {
        border-color: var(--lightgray) !important;
    }

    .contact-overlay-stage-dialogue-spaced {
        width: 100%;
        margin: 0;
      }
    
    .contact-overlay-stage
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
    }
    
    .contact-overlay-stage-bottom
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
        box-sizing:border-box;
        padding-top:20px;
        padding-bottom:20px;
    }
    
    .contact-overlay-stage-button
    {
        position: relative;
        width:auto;
        height:40px;
        box-sizing:border-box;
        padding-left:20px;
        padding-right:20px;
        margin-left:20px;
        margin-right:20px;
        border-radius: 40px;
        font-family:'Quicksand';
        font-size:1.4em;
        font-weight: 700;
    }
    
    .contact-overlay-continue-btn
    {
        background-color: var(--green);
        color: var(--white-text);
        border:solid 2px var(--green);
    }
    
    .contact-overlay-continue-btn:hover
    {
        color:var(--green);
        background-color: var(--white-background);
    }
    
    .contact-overlay-back-btn
    {
        background-color: var(--pink);
        color:var(--white-text);
        border: solid 2px var(--pink);
    }
    
    .contact-overlay-back-btn:hover
    {
        color:var(--pink);
        background-color:var(--white-background);
    }
    
    .contact-overlay-stage-dialogue
    {
        width: 100%;
        flex-wrap:wrap;
        margin: 0 !important;
    }
    
    .contact-overlay-stage-dialogue-spaced
    {
        width:100%;
    }
    
    .contact-overlay-typebutton
    {
        position: relative;
        width:calc(100% - 40px);
        max-width: 400px;
        height:auto;
        float:left;
        border-radius:20px;
        border:solid 3px transparent;
        box-sizing:border-box;
        margin-top:30px;
        margin-left: 20px;
        margin-right: 20px;
    }
    
    .contact-overlay-typebutton:hover
    {
        background: white;
        border:solid 3px var(--green)
    }
    
    .contact-overlay-typebutton-image-carrier
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
    }
    
    .contact-overlay-typebutton-image
    {
        position: relative;
        width:250px;
        height:250px;
        box-sizing:border-box;
        padding-top:25px;
        padding-bottom:25px;
        overflow: hidden;
    }
    
    .contact-overlay-typebutton-name
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
        box-sizing:border-box;
        padding:10px;
        padding-bottom:30px;
        font-size:1.2em;
        font-weight:700;
        font-family: 'Quicksand';
        text-align:center;
    }
    
    .contact-overlay-stage-project-type
    {
        position: relative;
        width: 275px;
        height: 350px;
        box-sizing:border-box;
        border-radius:10px;
        border: solid 3px var(--white-background);
        padding: 10px;
        margin: 20px;
    }
    
    .contact-overlay-stage-project-type:hover
    {
        background: white;
        border:solid 3px var(--green);
    }
    
    .contact-overlay-stage-project-type-icon, .contact-overlay-stage-project-type-name, .contact-overlay-stage-project-type-description
    {
        position: relative;
        width: 100%;
        height: auto;
        float:left;
    }
    
    .contact-overlay-stage-project-type-icon
    {
        font-size:4.5em;
        color: var(--blue-main);
        height:100px;
    }
    
    .contact-overlay-stage-project-type-name
    {
        font-size: 1.4em;
        color: var(--text-darkgray);
        font-family: 'Quicksand';
        font-weight:700;
        height:25px;
        margin-top: 5px;
    }
    
    .contact-overlay-stage-project-type-description
    {
        color: var(--text-darkgray);
        font-family: 'Quicksand';
        font-size:1em;
        font-weight:600;
        height: 220px;
        align-items: flex-start;
        margin-top:25px;
        text-align: center;
    }
    
    .contact-form-table
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
        box-sizing: border-box;
    }
    
    .contact-form-row
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
    }
    
    .contact-form-col-50, .contact-form-col-100
    {
        position: relative;
        width: calc(100% - 40px);
        height:auto;
        float:left; 
        box-sizing:border-box;
        margin: 20px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    
    .contact-form-col-100
    {
        width: calc(100% - 40px);
    }
    
    .contact-form-input-name
    {
        position: relative;
        width: 100%;
        height: auto;
        float:left;
        font-family: 'Quicksand';
        font-weight: 700;
        font-size:1em;
        color: var(--gray-hint);
        margin-bottom: 10px;
    }
    
    .contact-form-input, .contact-form-input-textarea
    {
        position: relative;
        width: calc(100% - 30px);
        height: 30px;
        float: left;
        box-sizing:border-box;
        border: 0;
        border-bottom: solid 1px var(--lightgray);
        outline: 0;
        background-color: transparent;
        font-family: 'Quicksand';
        font-weight: 500;
        font-size:1.2em;
        color: var(--text-darkgray);
    }
    
    .contact-form-input-textarea
    {
        width: 100%;
    }
    
    .contact-form-input-status-icon
    {
        width: 30px;
        height: 30px;
        float: left;
        box-sizing:border-box;
        border-bottom: solid 1px var(--lightgray);
        font-size: 1.5em;
    }
    
    .contact-form-input-status-icon-empty
    {
        color: var(--gray-hint);
    }
    
    .contact-form-input-status-icon-issue
    {
        color: var(--issue-red);
    }
    
    .contact-form-input-status-icon-good
    {
        color: var(--green);
    }
    
    .contact-form-input-status-icon-active
    {
        border-color: var(--text-gray) !important
    }
    
    .contact-form-input-textarea
    {
        min-height: 50px;
        max-height: 600px;
        padding: 15px;
        padding-left: 0px;
        box-sizing: border-box;
        resize: none;
        overflow: hidden;
        transition: border .4s ease-in-out;
        line-height: 150%;
    }
    
    .contact-form-input:active, .contact-form-input:focus, .contact-form-input-textarea:active, .contact-form-input-textarea:focus
    {
        border: 0;
        border-bottom: solid 1px var(--text-darkgray);
        outline: 0;
    }
    
    
    .contact-overlay-close-ui
    {
        position: absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        display: none;
        border-top-left-radius: 5px;
        border-top-right-radius: 30px;
        border-bottom-left-radius: 30px;
        border-bottom-right-radius: 5px;
        background-color: var(--white-background);
        z-index:99999;
        overflow: hidden;
    }
    
    .contact-overlay-close-ui-inner
    {
        position: absolute;
        top: 0;
        left:0;
        width:100%;
        height:100%;
    }
    
    
    .contact-form-input-hint
    {
        position: relative;
        width: 100%;
        height: auto;
        float:left;
        display: none;
        box-sizing:border-box;
        padding: 15px;
        padding-left: 0;
        color: var(--issue-red);
        font-family: 'Quicksand';
        font-weight: 500;
    }
    
    .contact-form-required
    {
        position: relative;
        font-size:1.1em;
        padding-left: 3px;
        color: var(--pink)
    }
    
    .contact-form-submit-button-carrier
    {
        position: relative;
        width: 100%;
        height: auto;
        float:left; 
    }
    
    .contact-form-submit-button
    {
        position: relative;
        width: auto;
        height: 45px;
        box-sizing:border-box;
        padding-left: 50px;
        padding-right: 50px;
        border-radius: 25px;
        float:left;
        font-family: 'Quicksand';
        font-weight: 700;
        background-color: var(--blue-main);
        border: solid 2px var(--blue-main);
        color: white;
        font-size:1.2em;
    }
    
    .contact-form-submit-button:hover
    {
        background-color: transparent;
        color: var(--blue-main);
    }
    
    .contact-overlay-close-window
    {
        width: 300px;
        height: auto;
        background-color: white;
        border-radius: 20px;
    }
    
    .contact-overlay-close-confirm-headline
    {
        width: 100%;
        height: auto;
        margin-top: 20px;
        margin-bottom: 10px;
        font-family: 'Quicksand';
        font-weight: 700;
        font-size: 1.15em;
    }
    
    .contact-overlay-close-confirm-button-carrier
    {
        width: 50%;
        height: auto;
        float:left;
        margin-top: 10px;
        margin-bottom: 20px;
    }
    
    .contact-overlay-close-confirm-button
    {
        width: 100px;
        height: 30px;
        border-radius: 20px;
        font-weight: 700;
        font-size: 1.1em;
        background-color: var(--blue-main);
        border: solid 2px var(--blue-main);
        color: white;
    }
    
    .contact-overlay-close-confirm-button:hover
    {
        background-color: white;
        border-color: var(--blue-main);
        color: var(--blue-main);
    }
    
    .contact-form-missing-contact-hint
    {
        position: relative;
        width:100%;
        height:auto;
        margin-bottom:20px;
        color: var(--pink);
        font-size:1.2em;
        font-family: 'Quicksand';
        font-weight: 700;
    }

    .contact-form-slider
    {
        position: relative;
        width: 2px;
        height:250px !important;
        float:left;
        margin-top: 0;
        margin-left: 21px;
        margin-right: 31px;
        background:var(--lightgray);
        overflow:visible;
    }
    
    .contact-form-slider-handle
    {
        position:absolute;
        top:-5px;
        left:-5px;
        width:10px;
        height:10px;
        box-sizing:border-box;
        border-radius:100px;
        background:var(--blue-main);
        cursor:pointer;
        z-index:9998;
        pointer-events: none;
    }
    
    .contact-form-slider-items
    {
        width: calc(100% - 134px);
        height:250px !important;
        margin-right: 80px;
        float: left;
        overflow: hidden;
    }
    
    .contact-form-slider-item
    {
        position: relative;
        float:left;
        width:100% !important;
        height:14.28% !important;
        cursor:pointer;
        color:var(--text-gray);
        font-family:'Quicksand';
        font-size:1em;
        font-weight: 600;
        transition:all .4s ease-in-out;
        justify-content: flex-start;
    }
    
    .contact-form-slider-item:hover
    {
        font-size:1.1em;
        color:#095791;
    }

    .contact-form-slider-item-active
    {
        font-size:1.1em;
        font-weight:bold;
        color:#095791;	
    }

    .fullscreen-picture-headline
    {
        font-size:2em;
        flex-wrap: wrap;
    }


    .fullscreen-picture-text
    {
        font-size: 1.3em;
    }

    .cta-headline
    {
        box-sizing:border-box;
        padding-left:20px;
        padding-right:20px;
        text-align: center;
    }

    .infocard
    {
        width:300px;
        padding:15px;
    }

    .infocard-image
    {
        width:250px;
        height:250px;
    }
    
    .infocard-image-carrier
    {
        width:100%;
        height:250px;
        overflow: hidden;
    }

    .carousel-outer
    {
        width: 100%;
        height: 930px;
    }

    .carousel-page-left
    {
        position: relative;
        width: 100%;
        height: auto;
        float: left;
    }
    
    .carousel-control-bullets   
    {
        position: relative;
        width: calc(100% - 100px);
        height: auto;
        min-height: 50px;
        flex-wrap: wrap;
        float: left;
    }
    
    .carousel-control-bullet
    {
        position: relative;
        width: 20px;
        height: 20px;
        box-sizing: border-box;
        border-radius: 20px;
        border: solid 2px var(--blue-main);
        margin: 5px;    
    }
    
    .carousel-control-bullet:hover
    {
        background-color: var(--blue-main);
    }
    
    .carousel-control-bullet-active
    {
        background-color: var(--blue-main);
    }
    
    .carousel-page-image
    {
        position: relative;
        width: 95%;
        height: 250px;
        margin-left: 2.5%;
        margin-right: 2.5%;
    }
    
    .carousel-page-right
    {
        position: relative;
        width: 100%;
        height: auto;
        float: left;
    }
    .carousel-page-headline, .carousel-page-text
    {
        position: relative;
        width: 100%;
        height: auto;
        float: left;
        box-sizing: border-box;
        padding: 20px;
        color: var(--text-darkgray);
    }
    
    .carousel-page-headline
    {
        font-size: 1.75em;
        text-align: center;
        margin-top: 20px;
        float: left
    }
    
    .carousel-page-text
    {
        font-size:1.35em;
        float: left;
        padding: 0;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .infocard
    {
        margin-left: 30px;
        margin-right: 30px;
    }

    .infocard:nth-child(2n)
    {
        margin-left: 30px;
        margin-right: 30px;
    }

    .team-member:nth-child(2n)
    {
        margin-left: 30px;
        margin-right: 30px;
    }

    .team-member
    {
        margin-left: 30px;
        margin-right: 30px;
    }



}

@media only screen and (max-width: 1179px)
{
    .carousel-outer
    {
        height: 500px;
    }
}


@media only screen and (max-width: 1100px)
{
    .carousel-outer
    {
        height: 580px;
    }
}


@media only screen and (max-width: 1000px)
{
    .carousel-outer
    {
        height: 600px;
    }
}

@media only screen and (max-width: 900px)
{
    .carousel-outer
    {
        height: 600px;
    }
}

@media only screen and (max-width: 800px)
{
    .carousel-outer
    {
        height: 600px;
    }
}   

@media only screen and (max-width: 750px)
{
    .carousel-outer
    {
        height: 630px;
    }
}

@media only screen and (max-width: 700px)
{
    .carousel-outer
    {
        height: 660px;
    }
}

@media only screen and (max-width: 650px)
{
    .carousel-outer
    {
        height: 680px;
    }

    .footer-info-group
    {
        width: 100%;
    }
}

@media only screen and (max-width: 600px)
{
    .carousel-outer
    {
        height: 700px;
    }
}

@media only screen and (max-width: 550px)
{
    .carousel-outer
    {
        height: 650px;
    }

    .carousel-page-headline
    {
        font-size:1.6em;
    }

    .carousel-page-text
    {
        font-size:1.2em;
    }
}

@media only screen and (max-width: 500px)
{
    .carousel-outer
    {
        height: 700px;
    }

    .carousel-page-headline
    {
        font-size:1.6em;
    }

    .carousel-page-text
    {
        font-size:1.2em;
    }
}

@media only screen and (max-width: 450px)
{

    .carousel-outer
    {
        height: 750px;
    }

    .carousel-page-headline
    {
        font-size:1.6em;
    }

    .carousel-page-text
    {
        font-size:1.2em;
    }
}

@media only screen and (max-width: 400px)
{

    .carousel-outer
    {
        height: 800px;
    }

    .carousel-page-headline
    {
        font-size:1.6em;
    }

    .carousel-page-text
    {
        font-size:1.2em;
    }
}

@media only screen and (max-width: 370px)
{
    .footer-systems-status
    {
        font-size:.9em;
    }

    .carousel-outer
    {
        height: 800px;
    }

    .carousel-page-headline
    {
        font-size:1.5em;
    }

    .carousel-page-text
    {
        font-size:1.1em;
    }
}

@media only screen and (max-width: 340px)
{
    .navbarMobileHeadline
    {
        font-size:.92em;
    }

    .navbarMobileSlogan
    {
        font-size:.7em;
    }

    .carousel-outer
    {
        height: 780px;
    }

    .carousel-page-headline
    {
        font-size:1.5em;
    }

    .carousel-page-text
    {
        font-size:1.1em;
    }

}

@media only screen and (min-width: 1179px)
{
    .navbarMobile, .navMobileMenu
    {
        display: none !important;
    }

    .navbarDesktop
    {
        position: fixed;
        top:0;
        left:0;
        width:100%;
        height:85px;
        z-index: 9998;
        font-family:'Quicksand';
        color:var(--white-background);
    }

    .navbarDesktopCICarrier
    {
        position: relative;
        width: 400px;
        height:100%;
        float:left;
    }

    .navbarDesktopLogoCarrier
    {
        position: relative;
        width:85px;
        height:100%;
        float:left;
    }

    .navbarDesktopLogo
    {
        position: relative;
        width:70px;
        height:70px;
    }

    .navbarDesktopText
    {
        position: relative;
        width:calc(100% - 85px);
        height:100%;
        float:left;
    }

    .navbarDesktopHeadline
    {
        width:100%;
        height:50%;
        float:left;
        justify-content: flex-start;
        align-items:flex-end;
        font-weight:700;
        font-size:1.5em;
    }

    .navbarDesktopSlogan
    {
        width:100%;
        height:50%;
        float:left;
        align-items:flex-start;
        justify-content: flex-start;
        font-weight:500;
        font-size:1.2em;
        letter-spacing: 2.8px;
    }

    .navbarDesktopItems
    {
        position: relative;
        width:auto;
        max-width:calc(100% - 600px);
        height:100%;
        float:right;
    }

    .navbarDesktopCategoryCarrier
    {
        position: relative;
        float:left;
        width:auto;
        margin-left:5px;
        margin-right:5px;
        height:100%;
    }

    .navbarDesktopCategory
    {
        position: relative;
        height:30px;
        width:auto;
        box-sizing:border-box;
        padding-left:5px;
        padding-right:10px;
        border-radius:15px;
        cursor: pointer;
        transition: all .1s ease-in-out;
    }

    .navbarDesktopCategoryIcon
    {
        position: relative;
        width:35px;
        height:100%;
        padding-right:5px;
        float:left;
        font-size:1.5em;
        pointer-events: none;
    }

    .navbarDesktopCategoryName
    {
        position: relative;
        width:auto;
        height:100%;
        float:left;
        font-weight:700;
        pointer-events: none;
    }

    .navbarDesktopRight
    {
        position: relative;
        width:200px;
        height:100%;
        float:right;
    }

    .navbarDesktopButton, .navbarDesktopButtonSmall
    {
        position: relative;
        width:150px;
        height:35px;
        box-sizing:border-box;
        border:solid 2px var(--white-background);
        border-radius:20px;
        font-weight: 700;
        color:var(--blue-main);
        background-color:var(--white-background);
        transition: all .4s ease-in-out;
        cursor: pointer;
    }

    .navbarDesktopButtonSmall
    {
        width:35px;
        display: none;
    }

    .navbarDesktopButton:hover, .navbarDesktopButtonSmall:hover
    {
        background-color:transparent;
        color:var(--white-background);
    }

    .navDesktopSubcategories
    {
        position:fixed;
        top:45px;
        height:auto;
        display:none;
        z-index: 9999;
    }

    .navDesktopMenuLanguageIcon
    {
        position: relative;
        width: 25px;
        height: 25px;
        border-radius: 15px;
        overflow: hidden;
    }

    .navDesktopMenuSubcategory
    {
        position: relative;
        width:100%;
        height:40px;
        float:left;
        justify-content:flex-start;
        font-weight: 700;
        box-sizing:border-box;
        padding:5px;
        padding-left:5px;
        cursor: pointer;
    }

    .navDesktopMenuSubcategoryIcon
    {
        position: relative;
        width:40px;
        height:100%;
        float:left;
        font-size:1.25em;
        color:var(--text-darkgray);
    }

    .navDesktopMenuSubcategoryText
    {
        color: var(--text-darkgray) !important;
    }

    .navDesktopMenuSubcategory:hover .navDesktopMenuSubcategoryText
    {
        text-decoration: underline;
    }
    
    .navDesktopMenuSubcategorySpacer
    {
        position: relative;
        width:100%;
        height:50px;
        float:left;
        cursor: pointer;
    }

    .navDesktopMenuSubcategoryInner
    {
        position: relative;
        width:100%;
        height:auto;
        float:left;
        box-sizing:border-box;
        border-radius: 10px;
        background-color:white;
        padding:10px;
        padding-left:0;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
    }
}

@media only screen and (max-width: 1640px) 
{
    .navbarDesktopCategoryIcon
    {
        display: none;
    }

    .navbarDesktopCategory
    {
        padding:0;
        padding-left:4px;
        padding-right:4px;
    }

    .navbarDesktopRight
    {
        width:140px;
    }

    .navbarDesktopButton
    {
        width:120px;
        font-size:.9em;
    }

    .navbarDesktopItems
    {
        max-width:calc(100% - 540px) !important;
    }
}

@media only screen and (max-width: 1300px) 
{
    .navbarDesktopRight
    {
        width:50px;
    }

    .navbarDesktopButton
    {
        display: none;
    }

    .navbarDesktopButtonSmall
    {
        display:flex;
    }

    .navbarDesktopItems
    {
        max-width:calc(100% - 450px) !important;
    }

    .navbarDesktopCategory
    {
        font-size:.95em;
    }

    .navDesktopMenuSubcategoryText
    {
        font-size:.95em;
    }
}


/*
    UTILS
*/


/*
    SLIDER
*/




