/* width */
::-webkit-scrollbar {
  width:  0px;
}

/*FONTS*/

@font-face {
  font-family: 'Switzer-Bold';
  src: url('webfonts/Switzer-Bold.woff') format('woff');
}

@font-face {
    font-family: 'Switzer Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Switzer Italic'), url('Switzer-Italic.woff') format('woff');
    }

@font-face {
  font-family: 'Switzer-Regular';
  src: url('webfonts/Switzer-Regular.woff2') format('woff2'),
       url('webfonts/Switzer-Regular.woff') format('woff'),
       url('webfonts/Switzer-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Switzer-Medium';
  src: url('webfonts/Switzer-Medium.woff2') format('woff2'),
       url('webfonts/Switzer-Medium.woff') format('woff'),
       url('webfonts/Switzer-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'MartianMono-Regular';
  src: url('webfonts/MartianMono-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'MartianMono-Bold';
  src: url('webfonts/MartianMono-Bold.ttf') format('truetype');
}

body{
	overflow-x: hidden;
	/*overflow-y: hidden;*/
  /*cursor: crosshair;*/
}

::selection {
  background-color: #2e6dff;
  color: #000;
}

h1{
  font-size: 10px;
	text-transform: uppercase;
	font-family: 'Switzer-Bold';
}

h2{
	height: 34px;
	font-family: 'Switzer-Regular';
}

/* HEADER */

.header {
	height: 6vh;
	position: fixed;
	background-color: white;
/*	border-bottom: 0.08vh solid #000;			line noire*/
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 1;

  padding: 1vh 8vw;
  box-sizing: border-box;
}

/* NAVIGATION */

.header-nav {
	display: flex;
  align-items: center;
  /*background-color: green;*/
  padding-top: 14px;
}

.header-nav a {
	margin-left: 2vw;
  color: grey;
  text-decoration: none;
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  transition: opacity 0.2s ease;
}

/* LOGO */

.header-logo img {
  width: auto;
  height: 24px;
  object-fit: contain;
  display: block;
}


/* GRILLE PROJETS */

.project-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 26vh;
	/*border-bottom: 0.08vh solid #000;			line noire*/	
  width: 100%;
  box-sizing: border-box;
  gap: 1.2vw;
  padding: 8vw;
  padding-top: 7vh;
}

.project-column {
  background-color: white;
  min-width: 0;
  overflow: hidden;
}

.project-column img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* LIENS PROJETS */

.project-link {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

/* IMAGES */

.project-link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: opacity 0.3s ease;
  transition: transform 0.6s ease;
}

/* VOILE ET TITRE */

.project-title {
  position: absolute;
  inset: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  background-color: rgba(30, 30, 30, 0.5);

  color: #fff;
  font-family: 'Switzer-Medium';
  font-size: 16px;
  text-transform: uppercase;
  text-decoration: none;

  opacity: 0;
  transition: opacity 0.3s ease;
}

/* SURVOL */

.project-link:hover .project-title {
  opacity: 1;
}

.project-link:hover img {
  transform: scale(1.04);
}

.project-grid .project-column a span{
  font-family: 'MartianMono-Bold';
  font-size: 14px;
/*  letter-spacing: -0.02vw*/
}

#droits {
  margin-top: 4vh;
  margin-bottom: 2vh;
  color: #999;
  display: flex;
  align-content: center;
  justify-content: center;
  font-size: 8px;
}

.header-nav a.active {
  color: #000;
  font-family: 'Switzer-Medium';
}

.header-nav a.passive:hover {
  color: #000;
  font-family: 'Switzer-Regular';
}


/* INDEX TABLE */

.index-table {
  width: 100%;
  color: #000;
/*  padding: 10vh 6vw;*/
  box-sizing: border-box;
}

.index-table table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  text-align: left;
  font-size: 8px;
}

/* LARGEUR DES COLONNES */

.index-table th:nth-child(2),
.index-table td:nth-child(2) {
  width: 20%;
}

.index-table th:nth-child(1),
.index-table td:nth-child(1) {
  width: 15%;
}

.index-table th:nth-child(3),
.index-table td:nth-child(3) {
  width: 15%;
}

.index-table th:nth-child(4),
.index-table td:nth-child(4) {
  width: 15%;
}

.index-table th:nth-child(5),
.index-table td:nth-child(5) {
  width: 6%;
}

/* EN-TÊTE */

.index-table th {
  font-size: 8px;
  font-weight: 400;
  text-transform: uppercase;
/*  padding: 1vh 2vh;*/
  border-bottom: 1px solid #555;
}

/* LIGNES */

.index-table td {
/*  padding: 1vh 2vh;*/
  border-bottom: 1px solid #000; 
}

/* LIGNES CLIQUABLES */

.index-table tbody tr {
  cursor: pointer;
  transition: color 0.2s ease;
}

/* SURVOL */

/*.index-table tbody tr:hover td {
  color: #999;
}*/

/* SURVOL2 */

.index-table tbody tr:hover {
  background-color: #2e6dff;
}

th{
	height: 3vh;
	font-family: 'Switzer-Regular';
}

td{
	font-family: 'MartianMono-Regular';
	font-size: 6.4px;
	letter-spacing: -0.02vw
}

#presentation{
  display: flex;
  padding: 10vh 7vw;
  flex-direction: column;

}

h3{
  font-family: 'Switzer-Medium';
  font-size: 18px;
  color: #000;
 /* text-indent: 20px;*/
 /* text-align: justify;*/
  letter-spacing: -0.02vw
}


/* INFORMATIONS */

#about-informations {
  display: grid;
  grid-template-columns: repeat(3, 1fr);

  width: 100%;
  padding: 60px 24px;
  box-sizing: border-box;

  gap: 20px;
  align-items: start;
  padding: 10vh 7vw;
}

/* COLONNES */

.info-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

h4{
  text-decoration: none;
  color: #000;
  font-size: 8px;
  font-family: Switzer-Regular;
  text-transform: uppercase;
}

#about-informations .info-column a {
  text-decoration: none;
  color: #000;
  font-size: 8px;
  font-family: 'Switzer-Regular';
  text-transform: uppercase;
}

/* LIEN VISITÉ */
#about-informations .info-column a:visited {
  color: #000;
  text-decoration: none;
}

/* SURVOL */
#about-informations .info-column a:hover {
  color: #999;
  text-decoration: none;
}

/* CLIC */
#about-informations .info-column a:active {
  color: #000;
  text-decoration: none;
}

/* PAGE PROJET */

.project-page {
  width: 100%;
}

/* GALERIE */

.project-gallery {
  width: 85%;
  padding: 4vw;
  display: flex;
  flex-direction: column;
  gap: 1.8vw;
}

/* IMAGES */

.project-gallery img {
  display: block;
  width: 100%;
  height: auto;
}

#project-presentation {
  width: 65%;
  margin: auto;
  text-align: center;
  position: relative;
  padding-top: 100px;
  padding-bottom: 1vh;
}

.project-video {
  width: 100%;
  aspect-ratio: 16 / 9;
  position: relative;
}

.project-video iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
}

p{
  color: #000;
  font-size: 8px;
  font-family: Switzer-Regular;
  line-height: 1.2;
}

p sup {
  vertical-align: super;
  font-size: 6px;
  line-height: 0;
}

.back-to-top {
  position: fixed;
  bottom: 70px;
  right: 7vw;
  font-size: 0px;
  color: #999;
  text-decoration: none;

  z-index: 1000;
  cursor: pointer;

  transition: opacity 0.2s ease;
}

.back-to-top:hover {
  color: #000;
}

h5{
  color: #000;
  font-size: 0px;
  font-family: 'MartianMono-Regular';
  line-height: 1.2;
}

/* SCROLL SMOOTH */

html {
  scroll-behavior: smooth;
}

.small_break {
    display: block;
    height: 4px;
}

/* RETOURS À LA LIGNE RESPONSIVE */

.desktop_only {
    display: initial;
}

.phone_only {
    display: none;
}

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

    .desktop_only {
        display: none;
    }

    .phone_only {
        display: initial;
    }

}

@media screen and (max-width: 768px) {
    sup.desktop_only {
        display: none;
    }
}