@font-face {
  font-family: 'CenturySchoolbookProItalic';
  src: url('../fonts/Century-Schoolbook-Pro-Italic.woff') format('woff2'),
       url('../fonts/Century-Schoolbook-Pro-Italic.woff2') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'CenturySchoolbookProReg';
  src: url('../fonts/Century-Schoolbook-Pro-Regular.woff') format('woff2'),
       url('a../fonts/Century-Schoolbook-Pro-Regular.woff2') format('woff');
  font-weight: normal;
  font-style: normal;
}


a{
    text-decoration: none !important;
    color: black !important;
}

#videos-full-screen{
    position: fixed;
    top: 0;
    left: 0;
    /*background-color: red;*/
    height: 100dvh;
    width: 100vw;
    /*pointer-events: none;*/
}

@font-face {
  font-family: 'UniversLTStd';
  src: url('../fonts/UniversLTStd.woff2') format('woff2'),
       url('../fonts/UniversLTStd.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

.bonus_caption{
    text-align: center;
    margin-top: 38vw;
    font-family: 'CenturySchoolbookProReg';
    color: #B8B8B8;
    font-size: 1.3vw;
    position: absolute;
    z-index: 999999999999999999;
    letter-spacing:  0.098vw;
}

body{
    font-size: 1.5552vw; 
}

*{
	box-sizing: border-box;
}

#container_overlay{
    width: 100vw;
    height: 100vh;
    z-index: 100;
    /* background-color: blue; */
}

#menu{
    width: 100vw;
    height: auto;
    position: fixed;
    top:0;
    left: 0;
    z-index: 80000000;
    padding-top: 0.648vw;
    padding-left: 1.35vw;
    padding-right: 1.35vw;
    font-size: 1vw;
    display: flex;
    justify-content: space-between;
    color: #602222;
    font-family: 'CenturySchoolbookProReg';
}

*{user-select: none; }

.btn{background-color: white;
    padding-top: 0.23vw;
    padding-left: 0.45vw;
    padding-right: 0.5vw;
    padding-bottom: 0.23vw;
user-select: none;  }

#home_left{
    position: fixed;
    top: 0;
    left: 0;
    width: 50.1vw;
    height: 100vh;/* 
    background-color: brown; */
    z-index: 1;
    overflow: hidden;
    align-items: center;
    justify-content: center;
}

.home_left_images{
    object-fit: cover; 
    width: 101%;
    height: 100%;
    object-position: center center;
    transition: opacity 1.5s ;
}

#close-project{
  width:3.46vw !important;
  padding-left: 0.46vw !important;
  color: #FF0000 !important;
  font-size: 0.8vw !important;
  font-family: 'UniversLTStd' !important;
  letter-spacing: 0.0864vw !important;
  padding-top: 0.37vw !important;
  padding-bottom: 0.0vw !important;
  padding-left:0.71vw !important;
}

#project-menu{
  width: 100vw;
    height: auto;
    position: fixed;
    top:0;
    left: 0;
    z-index: 80000000;
    padding-top: 0.648vw;
    padding-left: 1.35vw;
    padding-right: 1.35vw;
    font-size: 1vw;
    display: flex;
    justify-content: space-between;
    color: #602222;
    font-family: 'CenturySchoolbookProReg';
}


#home_right{
    position: fixed;
    top: 0;
    left: 50vw;
    width: 50vw;
    height: 100vh;/* 
    background-color: pink; */
    z-index: 0;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    
}

#videoData{
  position: fixed;
  top:0;
  left:0;
  width: 100vw;
}

.home_right_images{
    object-fit: cover; 
    width: 101%;
    height: 100%;
    object-position: center center;
    transition: opacity 1.5s ;
}

#about-text-top{
    position: fixed;
    font-size: 3.348vw;
    line-height: 3.078vw;
    font-family: 'CenturySchoolbookProReg';
    text-align: center;
    top: 3vw;
    left: 0;
    width: 100vw;
    height: auto;
    padding-top: 0.81vw;
    padding-left: 2.43vw;
    padding-right: 2.43vw;
    color: yellow;
    z-index: 1;
    user-select: none;  
    pointer-events: none;
}

#about-text-bottom{
    position: fixed;
    font-size: 3.348vw;
    line-height: 3.078vw;
    z-index: 0;
    text-align: center;
    font-family: 'CenturySchoolbookProReg';
    top: 3vw;
    left: 0;
    width: 100vw;
    height: auto;
    padding-top: 0.81vw;
    padding-left: 2.43vw;
    padding-right: 2.43vw;
    color: yellow;
     -webkit-text-stroke: 0.11vw #3C3C3C;
     user-select: none;  
     pointer-events: none;
}

#credit-text-top{
    position: fixed;
    font-size: 1.836vw;
    font-family: 'CenturySchoolbookProReg';
    text-align: center;
    bottom: 1.08vw;
    left: 0;
    width: 100vw;
    height: auto;
    color: yellow;
   
    z-index: 2;
    user-select: none;  
    pointer-events: none;
}

#credit-text-bottom{
    position: fixed;
    font-size: 1.836vw;
    font-family: 'CenturySchoolbookProReg';
    text-align: center;
    bottom: 1.08vw;
    left: 0;
    width: 100vw;
    height: auto;
    z-index: 1;
      -webkit-text-stroke: 0.09vw #3C3C3C;
    color: yellow;
    user-select: none;  
    pointer-events: none;
}

#contact{
    position: fixed;
    top: calc(50vh - 8.4vw);
    width: 26.73vw;
    height: 16.47vw;
    background-color: white;
    overflow-y: hidden;
}

#card{
    text-align: center;
    color: black;
    font-size: 0.864vw;
    position: relative;
    margin-top: 4.86vw;
    line-height: 1.3vw;
    font-family: 'UniversLTStd';
}

.line-card{
    line-height: 1.89vw;
}

.name{font-size: 1.123vw;
margin-right: 0.54vw;}

.overlay{
    position: relative;
    z-index: 50;
}

.click-overlay2{
    z-index: 99999999999;
}

.btn:hover{
    cursor: pointer;
}

.video-display {
  position: relative;
  height: 16.524vw;
  width: auto;
  cursor: pointer;
}

.video-display iframe {
  width: auto   ;
  height: 16.524vw   ;
  display: block   ;
  min-width: 100%;
}

.fade-in {
opacity: 0; 
}

#videos {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;   
  overflow-x: auto;   
  overflow-y: hidden;  
  scrollbar-width: none; 
  -ms-overflow-style: none;
}

#videos-container {
  display: flex;
  gap: 2.025vw;
  width: max-content;   
  padding: 0 1.35vw;
  padding-top: calc(50vh - 8.4vw);
  position: relative;  
  top: 0;
  left: 0;
}

#wrapper-videos-full-screen{
    position: fixed;
    height: 100dvh;
    width: 100vw;
     transition: opacity 1s ;
     justify-content: center;
    align-items: center;
    top:0;
    left:0;
    /*background-color: blue;*/
}

#wrapper-videos-full-screen iframe {
    display: block;
    position: fixed;
    height: 100dvh;
    width: 100vw;
    z-index: 1;
     transition: opacity 1s ;
     justify-content: center;
    align-items: center;
    top:0;
    left:0;
}

#fixedvideos{
    position: fixed;
    z-index: 999999999999999;
    top:0;
    left: 0;
    width: 100vw;
    height: 100dvh;
    pointer-events: none;
}



#videos::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

#project-title{
  z-index: 10;
  top: 3.24vw;
  left: 1.35vw;
  color: #492B2B;
  width: 90vw;
  height: auto;
  font-family: 'UniversLTStd';
  letter-spacing:  0.098vw;
  font-size: 0.972vw;
  position: fixed;
}

#project-grid-container {
    /* transition: row-gap 1s ease-in-out; */
    z-index: 10;
    width: 100%;
    padding-top: 5.184vw;
    padding-left: 1.35vw;
    padding-right: 1.35vw;
    padding-bottom: 1.35vw;
    position:fixed;
    display: block;
    top: 0;
    left: 0;
    overflow-y: scroll;
    display: flex;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE & Edge */

    display: flex;
    flex-wrap: wrap;
    gap: 0.54vw;
}


#photography {
    /* transition: row-gap 1s ease-in-out; */
    height: 100dvh;
    width: 100%;
    padding-top: 3.24vw;
    padding-left: 1.35vw;
    padding-right: 1.35vw;
    padding-bottom: 1.35vw;
    position:fixed;
    display: block;
    top: 0;
    left: 0;
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE & Edge */

    display: flex;
    flex-wrap: wrap;
    place-content: start space-between;
    -webkit-box-pack: justify;
    gap: 2.025vw 1.62vw;
}

#photography a img {
  display: block;   
  height: auto;
}

.no-scroll {
  overflow: hidden !important;
}

#photography::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

.btn-actif{
  background-color: #FF2929;
}


#caption-wrapper{
    position: absolute;
    text-align: center;
    top:32.4vw;
    width: 100vw;
    left: 0;
    color: #E5FF00;
    font-family: 'UniversLTStd';
    letter-spacing:  0.142vw;
    font-size:1.134vw;
    display: none;
}

#caption-wrapper2{
    position: absolute;
    text-align: center;
    top:32.4vw;
    width: 100vw;
    left: 0;
    color: #E5FF00;
    font-family: 'UniversLTStd';
    letter-spacing:  0.142vw;
    font-size:1.134vw;
    display: none;
}

.photo-box3 {
  width: auto;
  height: 10vw;
}

.bonus {
  width:100vw;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  display: none;
  z-index: 999999999999;
  align-items: center;
  justify-content: center;
}

.bonus_container{
  width:34vw;
  height: 42vw;
}

.bonus_container img{
  width: 100%;
  height: 100%;
}

.photo-box-project {
  width: auto;
  height: 6.804vw;
}

.test-photo{
    width: auto;
    height: 100%;
  transition: opacity 1s ;
}
.test-photo2{
    width: auto;
    height: 100%;
    transition: opacity 1s ;
}

.test-photo2:hover{
   cursor: pointer;
}

#full-screen{
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0vw;
    justify-content: center;
    align-items: center;
    display: flex;
    /* background-color: red; */
    pointer-events: none;
    transition: opacity 0.3s ;
}

#full-screen-project{
     transition: opacity 0.3s ; 
}

.player{
  transition: opacity 1s ;
}

#img-wrapper {
  display: inline-block; 
  position: relative;
  pointer-events: auto;
}

#img-wrapper2 {
  display: inline-block; 
  position: relative;
  pointer-events: auto;
}

#img-full-screen {
  display: block;
  max-width: 100vw;
  max-height: 100vh;
  width: auto;
  height: auto;
}

#img-full-screen2 {
  display: block;
  max-width: 100vw;
  max-height: 100vh;
  width: auto;
  height: auto;
}


.btn,
.test-photo:hover{
    cursor: pointer;
}

#see-project{
    font-size: 0.8vw;
    color: #FF0000;
    font-family: 'UniversLTStd';
    position: fixed;
    bottom: 1.08vw;
    letter-spacing: 0.0864vw;
    pointer-events: auto;
    
}

#full-screen-close{
    font-size: 0.8vw;
    color: #FF0000;
    font-family: 'UniversLTStd';
    position: fixed;
    bottom: 1.08vw;
    letter-spacing: 0.0864vw;
    pointer-events: auto;
    display: none;
}

#btn-see-project, #full-screen-close-btn{
    padding-top: 0.378vw ;
    padding-left: 0.486vw ;
    padding-right: 0.486vw ;
    padding-bottom: 0.378vw ;
}

#btn-see-project{
    padding-top: 0.37vw !important;
    padding-left: 0.55vw !important;
    padding-right: 0.55vw !important;
    padding-bottom: 0.33vw !important;
}

.cursor-next {
  cursor: none !important;
}

#cursor_fullscreen.cursor-next::after {
  content: var(--cursor-label, "");
  position: fixed;
  pointer-events: none;
  top: 0;
  left: 0;
  transform: translate(var(--x, 0), var(--y, 0));
  color: #E5FF00;
  font-family: 'UniversLTStd';
  letter-spacing:  0.259vw;
  font-size:1.1344vw;
  z-index: 999999999999;
}



#see-project:hover {
    cursor: pointer !important;
}

#project{
  width: 100vw;
  height: 100vh;
  position: fixed;
  top:0;
  left:0;
  /* transition: opacity 0.1s ; */
}

#project-background{
  width: 100vw;
    height: 100vh;
    position: fixed;
    background-color: #D9D9D9;
    opacity: 0.9;
    z-index: 1;
    top: 0;
    left: 0;
}