@font-face {
font-family: 'Apax';
src: url('../fonts/Apax-Regular.woff2') format('woff2');
}
body {
overflow: hidden;
background:
-webkit-animation: fadein 2s;
/* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 2s;
/* Firefox < 16 */
-ms-animation: fadein 2s;
/* Internet Explorer */
-o-animation: fadein 2s;
/* Opera < 12.1 */
animation: fadein 2s;
}
::-webkit-scrollbar {
width: 0px;
*/ height: 0px;
*/ background: transparent;
*/
}
}
/* ------------------------------------- */
/* Native */
/* ------------------------------------- */
* {
box-sizing: border-box;
}
body {
}
html,
body {
margin: 0;
}
h1,
h2,
h3,
h4,
h5,
p,
a,
button {
line-height: 1;
color: black;
text-decoration: none;
padding: 0;
margin: 0;
font-weight: normal;
font-size: 10px;
font-family: Apax;
}
/* ------------------------------------- */
/* CSS Variables */
/* ------------------------------------- */
:root {
/* Global (Dark Theme) */
--color-background-color: #ffffff;
--color-text: #1a1a1a;
--color-link: #808080;
--color-link-active: #1a1a1a;
}
/* ------------------------------------- */
/* CONTAINER INFORMATIONS */
/* ------------------------------------- */
.container-information-sm {
position: fixed;
bottom: 0px;
background-color: var(--color-background-color);
}
.container-information {
height: calc(100vh - 0px);
background-color: var(--color-background-color);
}
.links {
color: var(--color-link);
transition: 0.5s;
text-decoration: underline;
}
.links:hover {
color: var(--color-link-active);
transition: 0.5s;
text-decoration: underline;
}
.tableau-all {
overflow-y: scroll;
height: calc(100vh - 0px);
}
.tableau-Prime {
border-bottom: 1pt solid var(--color-link);
}
.tableau-Prime:after {
content: "";
display: table;
clear: both;
}
.introduction {
padding-top: 10px;
}
.tableau {
border-bottom: 1pt solid var(--color-link);
cursor: pointer;
}
.tableau:after {
content: "";
display: table;
clear: both;
}
.description-01 {
display: inline;
line-height: 1.4;
float: left;
padding-left: 15px;
padding-right: 0px !important;
text-decoration: none;
color: var(--color-link);
font-size: 15px;
padding-bottom: 10px;
}
.description-02 {
display: inline;
line-height: 25pt;
float: left;
padding-left: 15px;
padding-right: 0px !important;
text-decoration: none;
color: var(--color-text);
font-size: 15px;
}
.description-02:hover {
color: var(--color-text);
}
.description-projet {
margin-left: 8%;
padding-left: 15px;
padding-bottom: 13px;
display: none;
float: left;
color: var(--color-text);
}
.description-projet p {
line-height: 1.4;
font-size: 15px;
color: var(--color-link);
}
.tableau-numbers {
color: var(--color-link)!important;
transition: 0.5s;
}
.links {
line-height: 1.4;
font-size: 15px;
color: var(--color-link);
transition: 0.5s;
}
.links:hover {
color: var(--color-link-active);
transition: 0.5s;
}
.indicator{
color: var(--color-link)!important;
transition: 0.5s;
}
/* ------------------------------------- */
/* OTTO GT */
/* ------------------------------------- */
.cv-copyright {
bottom: 10;
position: sticky;!important;;
border-top: 1pt solid var(--color-link);
background-color: var(--color-background-color);
margin-right: -15px;
padding-left: 14px;
}
.cv-copyright p {
color: var(--color-link);
}
/* ------------------------------------- */
/* CONTAINER SLIDESHOW */
/* ------------------------------------- */
.slideshow {
border-radius: none;
overflow-y: scroll;
height: calc(100vh - 90px);
padding-left: 0px!important;
background-color: var(--color-background-color);
}
iframe {
position:
absolute;
top:0;
left:0;
width:100%;
height:100%;
}
.video {
padding:66.67% 0 0 0;
position:relative;
}
/* ********************************************************************** */
/* (sm) Small devices (landscape phones, 576px and up) */
/* ********************************************************************** */
@media (min-width: 576px) {
.slideshow {
height: calc(100vh - 0px);
}
/* ------------------------------------- */
/* Cursor */
/* ------------------------------------- */
.cursor {
  z-index: 1000;
  position: absolute;
  width: 35px;
  height: 35px;
  top: 50%;
  left: 50%;
  margin: 0;
  border-radius: 50%;
  background-color: orange; /* Set a solid color for the cursor */
  filter: invert(1); /* Invert the color to create a negative effect */
  backface-visibility: hidden;
  transition: transform 0.2s ease-out;
  mix-blend-mode: normal Set to "normal" to remove the blend mode */
  pointer-events: none;
}

.cursor.is-moving {
  transform: scale(0.8);
}

.c-symbols {
  color: var(--color-link);
  transition: 0.5s;
}

.active {
  color: var(--color-link-active) !important;
  transition: 0.5s;
}

.slideshow a:-webkit-any-link {
  cursor: none;
}
}
/* ********************************************************************** */
/* (md) Medium devices (tablets, 768px and up) */
/* ********************************************************************** */
@media (min-width: 768px) {...}
/* ********************************************************************** */
/* (lg) Large devices (desktops, 992px and up) */
/* ********************************************************************** */
@media (min-width: 992px) {...}
/* ********************************************************************** */
/* (xl) Extra large devices (large desktops, 1200px and up) */
/* ********************************************************************** */
@media (min-width: 1200px) {...}
/* ********************************************************************** */
/* (xll) Extra large devices (large desktops, 2000px and up) */
/* ********************************************************************** */
@media (min-width: 2000px) {...}
/* ********************************************************************** */
/* Unused media queries */
/* ********************************************************************** */
/*  Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {...}
/*  Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {...}
/*  Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {...}
/*  Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {...}
/*  Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {...}
/*  Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {...}
/*  Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {...}
/*  Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {...}