.glider-contain {
width: 100%;
margin: 0 auto;
position: relative;
}
.glider {
margin: 0 auto;
position: relative;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
transform: translateZ(0);
}
.glider-track {
transform: translateZ(0);
width: 100%;
margin: 0;
padding: 0;
display: flex;
z-index: 1;
}
.glider.draggable {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
cursor: grab;
}
.glider.draggable .glider-slide img {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
pointer-events: none;
}
.glider.drag {
cursor: grabbing;
}
.glider-slide {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
justify-content: center;
align-content: center;
width: 100%;
}
.glider-slide img {
max-width: 100%;
}
.glider::-webkit-scrollbar {
opacity: 0;
height: 0;
}
.glider-prev,.glider-next {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
position: absolute;
outline: none;
background: none;
padding: 0;
z-index: 2;
font-size: 40px;
text-decoration: none;
left: -23px;
border: 0;
top: 30%;
cursor: pointer;
color: #666;
opacity: 1;
line-height: 1;
transition: opacity .5s cubic-bezier(.17,.67,.83,.67),
color .5s cubic-bezier(.17,.67,.83,.67);
}
.glider-prev:hover,
.glider-next:hover,
.glider-prev:focus,
.glider-next:focus {
color: #a89cc8;
}
.glider-next {
right: -23px;
left: auto;
}
.glider-next.disabled,
.glider-prev.disabled {
opacity: .25;
color: #666;
cursor: default;
}
.glider-slide {
min-width: 150px;
}
.glider-hide {
opacity: 0;
}
.glider-dots {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 auto;
padding: 0;
}
.glider-dot {
border: 0;
padding: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
outline: none;
display: block;
cursor: pointer;
color: #ccc;
border-radius: 999px;
background: #ccc;
width: 12px;
height: 12px;
margin: 7px;
}
.glider-dot:hover,
.glider-dot:focus,
.glider-dot.active {
background: #a89cc8;
}
@media(max-width: 36em){
.glider::-webkit-scrollbar {
opacity: 1;
-webkit-appearance: none;
width: 7px;
height: 3px;
}
.glider::-webkit-scrollbar-thumb {
opacity: 1;
border-radius: 99px;
background-color: rgba(156, 156, 156, 0.25);
box-shadow: 0 0 1px rgba(255,255,255,.25);
}
} :root {
--uber-blue: #093350;
--dark-blue: #1a5177;
--light-blue: #0bb4e1;
--dark-grey: #949494;
--black: #000000;
--black-alpha: 0, 0, 0;
--white: #ffffff;
--white-alpha: 255, 255, 255;
--offset: 20px;
}
@font-face {
font-family: 'Noir Pro';
src: url(/projects_files/project_4395/assets/NoirPro-Light-8e0718a0.ttf);
font-weight: 300;
}
@font-face {
font-family: 'Noir Pro';
src: url(/projects_files/project_4395/assets/NoirPro-Medium-46a8f524.ttf);
font-weight: 600;
}
@font-face {
font-family: 'Noir Pro';
src: url(/projects_files/project_4395/assets/NoirPro-Bold-5900d6ff.ttf);
font-weight: 700;
}
body {
font-family: 'Noir Pro', sans-serif;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #949494;
color: var(--dark-grey);
text-transform: uppercase;
text-align: center;
margin-left: auto;
margin-right: auto; font-weight: bold; }
h2 {
font-size: 35px;
}
@media screen and (max-width: 640px) {
h2 {
font-size: 23px;
}
}
p {
margin-top: 20px;
margin-bottom: 20px;
margin-top: var(--offset);
margin-bottom: var(--offset);
}
main p,
.header_intro p {
text-align: justify;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
button {
outlin-color: transparent;
}
html {
scroll-behavior: smooth;
}
body {
margin: 0;
display: flex;
flex-direction: column;
min-height: 100vh;
}
body > header,
body > footer {
flex-grow: 0;
}
body > main {
flex-grow: 1;
}
.container {
width: max(360px, min(99%, 1400px));
margin-left: auto;
margin-right: auto;
padding-left: 2rem;
padding-right: 2rem;
}
@media screen and (max-width: 640px) {
.container {
padding-left: 1rem;
padding-right: 1rem;
}
}
section {
display: flex;
flex-wrap: wrap;
gap: 0 2rem; }
section > h1,
section > h2,
section > h3,
section > h4,
section > h5,
section > h6 {
width: 100%;
}
section .section__column {
flex: 1;
}
@media screen and (max-width: 640px) {
section {
display: block;
}
}
header {
isolation: isolate;
}
header .header_image {
height: 100vh;
height: 100svh; position: relative;
padding-top: 20px;
padding-top: var(--offset);
}
header .header_image img {
height: 100%;
width: 100%;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-o-object-fit: cover;
object-fit: cover;
}
header .header_image::before {
content: '';
position: absolute;
width: 100%;
top: 0;
height: 50%;
background: linear-gradient(180deg, #000000 0%, rgba(48, 48, 48, 0) 70.31%);
z-index: 1;
opacity: 0.65;
}
header .header_image::after {
content: '';
position: absolute;
width: 100%;
bottom: 0;
height: 25%;
background: linear-gradient(0, #000000 0%, rgba(48, 48, 48, 0) 70.31%);
opacity: 0.65;
}
header .copyright {
position: relative;
margin-left: auto;
margin-right: auto;
margin-top: 0;
margin-bottom: 0;
color: #ffffff;
color: var(--white);
text-transform: uppercase;
text-align: center;
font-weight: 600;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
z-index: 2;
}
header h1 {
font-size: 106px;
line-height: 127.2px;
color: #ffffff;
color: var(--white);
text-transform: uppercase;
max-width: 80%;
margin-top: -0.1em;
position: relative;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
z-index: 2;
}
header .scroll-down {
position: absolute;
bottom: 0px;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 90px;
z-index: 2;
}
header .container {
position: absolute;
height: 100%;
top: 0;
left: 50%;
transform: translateX(-50%);
}
header .header_intro {
position: absolute;
width: calc(50% - 20px / 2);
width: calc(50% - var(--offset) / 2);
left: 50%;
bottom: calc(20px * 5);
bottom: calc(var(--offset) * 5);
background-color: rgba(0, 0, 0, 0.5);
background-color: rgba(var(--black-alpha), 0.5);
color: #ffffff;
color: var(--white);
padding-left: 20px;
padding-right: 20px;
padding-left: var(--offset);
padding-right: var(--offset);
font-weight: 700;
}
@media not all and (-webkit-min-device-pixel-ratio: 0), not all and (min-resolution: 0.001dpcm) {
header .header_image h1 {
margin-top: 0px;
}
}
@media screen and (min-width: 641px) and (max-width: 1200px) {
header h1 {
font-size: max(34px, min(10.2vw, 86px));
line-height: 1.3em;
}
header .header_intro {
left: 50%;
transform: translateX(-50%);
width: calc(80% - 1rem);
}
}
@media screen and (max-width: 640px) {
header .header_image {
height: auto;
aspect-ratio: 1/1;
}
header .container {
position: static;
transform: none;
}
header .header_intro {
transform: none !important;
width: 100% !important;
}
header .header_intro {
position: static;
width: auto;
color: inherit;
background-color: transparent;
padding: 0;
}
header .scroll-down {
display: none;
}
header h1 {
line-height: 36px !important;
}
header h1 {
font-size: 34px;
line-height: 40.8px;
position: absolute;
bottom: 0;
left: 0;
right: 0;
}
}
@media screen and (max-height: 768px) {
header h1 {
font-size: 38px;
line-height: 1.9em;
}
header .header_intro {
left: 50%;
transform: translateX(-50%);
width: calc(90% - 1rem);
}
}
@media screen and (max-height: 500px) {
header .container {
position: static;
transform: none;
display: flex;
}
header .header_intro {
transform: none !important;
width: 100% !important;
}
header .header_intro {
position: static;
width: auto;
color: inherit;
background-color: transparent;
padding: 0;
}
header .scroll-down { }
}
footer {
padding-top: 20px;
padding-bottom: 20px;
background-color: #093350;
background-color: var(--uber-blue);
color: #ffffff;
color: var(--white);
font-weight: bold;
}
footer p {
text-transform: uppercase;
font-size: 16px;
text-align: center;
}
.statistics {
display: flex;
gap: 2rem;
align-content: center;
justify-content: center;
place-content: center;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
flex-wrap: wrap;
margin-top: 3rem;
margin-bottom: 3rem;
}
.statistics__item {
flex: 1;
align-content: center;
justify-content: center;
place-content: center;
display: flex;
flex-direction: column;
font-weight: bold;
}
.statistics__item > * {
margin-top: 0;
margin-bottom: 0;
}
.statistics__item .figure {
font-size: max(80px, min(21vw, 256px));
color: #1a5177;
color: var(--dark-blue);
text-align: center;
line-height: calc(1em - 6vw);
}
.statistics__item .description {
font-size: max(19px, min(4vw, 62px));
color: #949494;
color: var(--dark-grey);
text-align: center;
text-transform: uppercase;
margin-top: 2vw;
}
@media screen and (max-width: 640px) {
.statistics__item .figure {
font-size: max(100px, min(9vw, 150px));
}
.statistics__item .description {
font-size: max(23px, min(3vw, 35px));
}
.statistics__item:first-child { }
}
.parallax-scene {
position: relative;
overflow: hidden;
display: grid;
grid-template-areas: 'stack';
height: var(--height);
margin-top: 20px;
margin-bottom: 20px;
margin-top: var(--offset);
margin-bottom: var(--offset);
}
.parallax-scene > * {
grid-area: stack;
}
.parallax-scene:last-child {
margin-bottom: 0;
}
.parallax-scene img,
.parallax-scene video {
position: absolute;
width: 100%;
height: 100%; -o-object-fit: cover;
object-fit: cover;
}
.parallax-scene .container {
position: absolute;
height: 100%;
top: 0;
left: 50%;
transform: translateX(-50%);
}
.parallax-scene .description {
color: #093350;
color: var(--uber-blue);
position: absolute;
top: 50%;
left: 10%;
transform: translateY(-50%);
background-color: rgba(255, 255, 255, 0.75);
background-color: rgba(var(--white-alpha), 0.75);
padding-left: 20px;
padding-right: 20px;
padding-left: var(--offset);
padding-right: var(--offset);
width: max(290px, min(50%, 800px));
font-weight: 700;
}
@media screen and (max-width: 640px) {
.parallax-scene {
height: 300px;
}
.parallax-scene .container {
transform: none;
left: 0;
display: flex;
align-items: center;
justify-items: center;
place-items: center;
}
.parallax-scene .description {
width: 100%;
position: static;
transform: none;
}
.parallax-scene--tall {
height: 600px;
}
} .section__column.contains_glider {
max-width: calc(50% - 20px);
}
@media screen and (max-width: 640px) {
.section__column.contains_glider {
max-width: 100%;
}
}
.glider-contain {
margin-top: 20px;
margin-bottom: 20px;
margin-top: var(--offset);
margin-bottom: var(--offset);
}
.glider-contain .glider-slide.active img {
cursor: zoom-in;
}
.glider-contain .glider-slide img {
aspect-ratio: auto;
aspect-ratio: var(--aspect-ratio, auto);
}
.glider-contain .glider-prev,
.glider-contain .glider-next {
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAgCAYAAAAWl4iLAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFxSURBVHgBtZYPzYQwDMWbTwE4mAQcgIQ5YA7AATgAB5wDJCBhEiYBHOzb409CyDFW4F7S5BKaH6N9a49oUeZicDGu0bsQ9FBSCGGHYbDjOM7RNI2N4xgvkPRAuu97e5TW2uKF7nlJN2XPZIzZ4DXdkEEZfPAkSQBviKkSpwLgTKi7lBJwNDhiw1FXn+q6BtwQ0zESTvjWyDfgSDZVVXnhsCMtfk9eh9+1o3Chy7L0wp/Y8QOrwRW/gFcMO2LGsOx4CYdQOperuXAVRZH13dIdvCOmYC8Du/nK4nLGP+Irchfp9OE0TcTVXIqraw//E6MUdUjz8jxnNa8NsVuapttJL6FI+GRZFnpBgua1wCcppbyfvoNWoVCD8egT/Ixmutw8BDr7tG1bL7TrOtbYVCGDfrVT8KAPWk1FUWx2CoKqEDutHmUtU+076ZP174Vy7HTU8G0U7nZaQTeVAQALbfVE59/4UzjDaWnM5k/8Zq32o/4BNtzOwv22fZ0AAAAASUVORK5CYII=);
top: calc(50% - 32px);
width: 23px;
height: 32px;
background-repeat: no-repeat;
}
.glider-contain .glider-prev:not(.disabled):hover,
.glider-contain .glider-next:not(.disabled):hover,
.glider-contain .glider-prev:not(.disabled):focus,
.glider-contain .glider-next:not(.disabled):focus {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAgCAYAAAAWl4iLAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMVSURBVHgBpZZPaNNwFMdfmqydbsx4UHvoobrLEAZlu3QXl6G4nlwFZWMXizLxZosnUVwLEy+OFm86cHqZFAfb2EAUZa072ItuUhl62NigB/8cVqeTtjaN76WJ1Da/JrVfeOTfL5+8vPfNLz+AsiSMZYwdLeYw3NCk/LYjLqX1TlzZH0+rYR+7pXDtB+gBfvhP8RhP7KFJp9DbD5zdoQbf1QN8T3+r/DY5Anu733FMChoUh6G0LW0bXix9yUDu+jAoXzMRPAxDgxkH+O4+EctR+9T2DuC9g1D6kJKUnW8innoOFkVgDm/0CX2DwLV1GMKFE2dAyWx4S5kNCU8tYOSsgFMK1lFOvfBh5sAdPFQLx7oTnAPOLadTIxo8awYGDf5eXlnyca7OVpur03hwt5fgIsL9ZnC+Yv8jFPJx+fUi3SRS9kx4W4cov0sGoFzzz2Zg0DJYKJUzYsPRjoJ3kOx4hWVH3uA+HS7B3g8nj/42EvWCHEO9QTjZNmEG1uH3S59Wj+KNHrVx2MAauGZHHCNVw1lgXfPoX5BXFqW6djx1nuwooR09UK57zgxMSqJj1KyYcM2OOK4L39KHp+JWwDp8u/hy1m/Dxhl9pSShVyK4E+FODhoTveoczn7ulqFLhgPo7X4Nd2dt0LhEnFKZF5Wfu+pWAOsKYH2ncd4G27HjzEHFV09pM2+1FGGs6zhBucMu5qB89BqCZ9dwd8AKOIbQq/WgVNfcxBjgR/UID0MY2Xpgmn9jODdccNycMrQZqeJnENOgqlhgN8accPKcxxGaBJYqoGE8jFRe4xjQZftoyN0yGmRC5fQbyE9cpjIE8PBx9fVqsOpTx9i4Wxi6yIRig6hRNJ8MYKwZjakEB9CfUXvwrih4TzOhhZko/J6JbWnQLdY4HRzEzkcdN6bqejQ/FYHiwkPK8Gw9qA4OIHTazE6FBxEqQUKD1v3f6eDVffeeeViZUufzt9Gjm+v/2MkK2MqCJQxVdjITTUIJ/OvWQjfXdWiwUaguiRaF+CFQ5uqiEP3b9KLwLxzKy1gFystY2vdAE/oDm31PEDfYXZQAAAAASUVORK5CYII=);
}
.glider-contain .glider-prev {
position: absolute;
left: 10px;
transform: translateY(-50%) rotate(180deg);
}
.glider-contain .glider-next {
position: absolute;
right: 10px;
transform: translateY(-50%);
}
.glider-contain .dots.glider-dots {
margin-top: 20px;
margin-bottom: 20px;
}
.glider-contain .glider-dot {
--width: 16px;
border: 2px solid #093350;
border: 2px solid var(--uber-blue);
background-color: transparent;
display: grid;
align-content: center;
justify-content: center;
place-content: center;
width: var(--width);
height: var(--width);
border-radius: 50%;
}
.glider-contain .glider-dot.active::before {
--width: 8px;
content: '';
display: block;
width: var(--width);
height: var(--width);
background-color: #0bb4e1;
background-color: var(--light-blue);
border-radius: 50%;
} .fslightbox-slide-number-container {
display: none !important;
}
.fslightbox-toolbar [title='Enter fullscreen'] {
display: none !important;
}
.fslightbox-container > .fslightbox-absoluted { }