@font-face {
  font-family: 'TruenoRegular';
  src: 
    local('Trueno-Regular'),
    url(../fonts/trueno/TruenoRg.otf) format('truetype');
}
@font-face {
  font-family: 'TruenoExtraBold';
  src: 
    local('Trueno-ExtraBold'),
    url(../fonts/trueno/TruenoExBd.otf) format('truetype');
}
@font-face {
  font-family: 'TruenoLight';
  src: 
    local('Trueno-Light'),
    url(../fonts/trueno/TruenoLt.otf) format('truetype');
}
@font-face {
  font-family: 'TruenoUltraLight';
  src: 
    local('Trueno-UltraLight'),
    url(../fonts/trueno/TruenoUltLt.otf) format('truetype');
}
@font-face {
  font-family: 'TruenoUltraLightItalic';
  src: 
    local('Trueno-UltraLightItalic'),
    url(../fonts/trueno/TruenoUltLtIt.otf) format('truetype');
}
@font-face {
  font-family: 'Libre Baskerville';
  src: 
    local('Libre_Baskerville_Regular'),
    url(../fonts/Libre_Baskerville/LibreBaskerville-Regular.ttf) format('truetype');
}

body {
  margin: 0;
  font-family: "TruenoRegular", sans-serif;
  /* background-color: rgb(255, 188, 111);
  animation: toggle-background 30s infinite;
  animation-duration: 20s;
  animation-timing-function: ease;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: toggle-background;  */
}

@font-face {
  font-family: "arrow Regular";
  src: local("arrow Regular"), local("arrow-Regular"), url("../resources/arrow-Regular.otf"), format("otf");
}
a {
  color: black;
}

.en {
  display: none;
}

.super {
  vertical-align: super;
  font-size: 0.7em;
}

.active {
  font-family: "TruenoLight" !important;
  text-decoration: underline;
  text-underline-offset: 0.1em;
}

.lien {
  text-decoration: underline 1px dotted blue;
  cursor: pointer;
}

@keyframes toggle-background {
  0% {
    background: #fcc688;
  }
  50% {
    background: #f86262;
  }
  100% {
    background: #fcc594;
  }
}
/* NAVBAR */
.contain {
  width: 100vw;
}

.navbar {
  font-weight: normal;
  font-style: normal;
  line-height: 1em;
  width: calc(100vw - 1.6em);
  margin-left: 1em;
}

.navbar2 {
  display: none;
}

#navtop {
  width: calc(100vw - 1.6em);
  font-family: "Libre Baskerville";
  font-weight: bold;
  padding: 0.4em 0 0;
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
}

#name {
  font-size: 1em;
  align-self: left;
  padding-right: 20px;
}

#name a, .about a {
  text-decoration: none;
}

#diffwork {
  padding-left: 3vw;
  padding-right: 3vw;
  display: flex;
  margin-top: -10px;
  margin-bottom: 0;
  padding-bottom: 0;
  flex-grow: 2;
}
/* #travo, #illus, #ceramique{
  flex-grow: 1;
} */
.occupation {
  padding-top: 0;
  font-family: "TruenoUltraLight";
  width: 50%;
  text-align: center;
  align-items: center;
  justify-content: center;
}

.occupation a {
  text-decoration: none;
}

.about {
  padding-left: 4vw;
  align-self: flex-end;
}

.btnlng {
  padding-left: 15vw;
  /* flex-basis: 20%; */
  text-align: right;
}

/* WORK */
.bodyofwork {
  width: 100vw;
  padding-bottom: 2vh;
}

.bodyofwork a {
  text-decoration: none;
}

.divimgindex {
  width: 100vw;
  padding: 0;
}

.imgworkindex {
  width: 100vw;
}

.work {
  width: 100vw;
  border-bottom: solid black 1px;
}

.details {
  margin-top: 1vh;
  margin-left: 0.8em;
  width: 85vw;
}

.title {
  width: calc(100vw - 1.6em);
  font-family: "Libre Baskerville";
  font-size: 1.5em;
}

.yeartype {
  width: calc(100vw - 1.6em);
  padding: 0;
  font-family: "TruenoExtraBold";
  font-size: 0.7em;
}

.targetlink {
  font-family: "arrow Regular";
  margin-top: -1vh;
  margin-left: 80vw;
  margin-bottom: 0.5vh;
  position: relative;
  font-size: 2em;
}

.targetlink2 {
  margin-top: -1vh;
  margin-left: 80vw;
  margin-bottom: 0.5vh;
  position: relative;
  width: 9vw;
}

.expand {
  display: none;
  width: 100vw;
}

/* ABOUT */
.aboutpage {
  width: calc(100vw - 2.6em);
  margin-left: 0.8em;
}

.prez {
  font-family: "TruenoLight";
  font-size: 1.3em;
}

.h2 {
  font-size: 1.8em;
  margin-bottom: 0;
}

.courant {
  font-family: "TruenoLight";
  font-size: 1.1em;
  margin-top: 0;
  margin-bottom: 0;
}

.courantlight {
  margin-top: 0;
  font-family: "TruenoUltraLight";
}

.titleita {
  font-family: "TruenoUltraLightItalic";
}

.credits {
  font-size: 0.8em;
  padding-bottom: 0.8em;
}

.volcan {
  display: none;
}

/* WORK-PAGES*/
#myWork {
  display: none;
  position: relative;
  width: 100vw;
  height: 100vh;
  z-index: 1;
  background-color: white;
  top: 2vh;
  opacity: 1;
  animation-name: fadeInOpacity;
  animation-iteration-count: 1;
  animation-timing-function: ease-in;
  animation-duration: 1s;
}

@keyframes fadeInOpacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.xmlworkbody {
  width: calc(100vw - 1.6em);
  margin-left: 0.8em;
}

.displayimg {
  width: 100vw;
  padding: 0;
  margin-left: 0;
}

.vimeo {
  width: 100vw;
  padding: 0;
  margin-left: 0;
}

.closebtn {
  text-decoration: none;
  margin-left: 0.8em;
  margin-top: 2vh;
  padding-bottom: 2vh;
  font-size: 2em;
}

.itatitre {
  font-style: italic;
}

.descri {
  font-family: "TruenoLight";
}

.courantita {
  font-style: italic;
}

.bottom {
  width: 100vw;
  height: 2vh;
}

/* ILLUSTRATION */
.divillu {
  width: 100vw;
}

.illu {
  width: 100vw;
  /* border-bottom: 0.1px solid black;
  border-top: 0.1px solid black; */
  margin-top: 0;
  margin-bottom: 3vh;
}
/* CERAMIQUES */

.blockcera{
  width: 100vw;
}
.cera {
  width: 100vw;
  /* border-bottom: 0.1px solid black;
  border-top: 0.1px solid black; */
  margin-top: 0;
  margin-bottom: 2vh;
}
.secondtexte{
  font-family: "TruenoLight", sans-serif;
  font-size: 0.8em;
}
/* FOOTER */
.footer {
  margin-top: 0;
  margin-left: 0.8em;
  margin-right: 0.8em;
  font-size: 0.8em;
}

.mail {
  text-decoration: none;
}

/* BUREAU */
@media screen and (min-width: 800px) {
  /* NAVBAR*/
  .navbar {
    display: none;
  }

  .navbar2 {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-direction: row;
    width: calc(100vw - 1.6em);
  }

  #navtop2 {
    font-family: "Libre Baskerville";
    margin-left: 0.8em;
    font-weight: bold;
    padding: 0.4em 0 0;
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
  }

  #name {
    order: 1;
  }

  .etoil {
    order: 2;
  }

  .about {
    font-family: "Libre Baskerville";
    align-self: flex-end;
    font-weight: bold;
    order: 4;
    width: 15vw;
  }

  #diffwork {
    justify-self: center;
  }

  .occupation {
    font-family: "TruenoLight";
  }

  .blankspace {
    width: 2vw;
  }

  .endflex {
    display: inline-block;
  }

  .btnlng {
    align-self: flex-end;
    order: 5;
  }

  .btnlng:hover {
    cursor: pointer;
    text-decoration: underline dotted 1px black;
  }

  /* TRAVAUX */
  .bodyofwork {
    display: flex;
    flex-wrap: wrap;
    width: 100vw;
    position: relative;
  }

  .work {
    align-items: center;
    position: relative;
    width: 20vw;
    border-bottom: none;
    padding-bottom: 0;
    margin: 0;
  }

  .work:hover {
    cursor: pointer;
  }

  .imgworkindex {
    width: 20vw;
  }

  .details {
    width: 19vw;
  }

  .targetlink2 {
    margin-left: 15vw;
    display: none;
  }

  .bottom {
    width: 100vw;
    height: 5vh;
  }

  #myWork {
    display: block;
    width: 100vw;
    height: 1vh;
  }
  #domitillenicolet:hover{
    background-color: #3d71ff;
  }
  #domitillenicolet:hover img{
    filter: grayscale(100%);
  }
  #banquet:hover{
    background-color: rgb(255, 55, 55);
  }
  #banquet:hover img{
    filter: grayscale(100%);
  }
  #atlas-absence:hover{
    background-color: #fdbf38;
  }
  #atlas-absence:hover img{
    filter: grayscale(100%);
  }
  #superformances:hover{
    background-color: #ff6929;
  }
   #superformances:hover img{
    filter: grayscale(100%);
  }
  #anamuri:hover{
    background-color: #7325fa;
  }
  #anamuri:hover img{
    filter: grayscale(100%);
  }
  #chasse-croise:hover {
    background-color: #67d8cd;
  }
  #chasse-croise:hover img {
    filter: grayscale(100%);
  }
  #haiku:hover {
    background-color: rgba(255, 90, 49, 0.973);
  }
  #haiku:hover img {
    filter: grayscale(100%);
  }

  #dnsep:hover {
    background-color: #4fc7ff;
  }
  #dnsep:hover img {
    filter: grayscale(100%);
  }

  #memoire:hover {
    background-color: rgba(21, 115, 255, 0.637);
  }
  #memoire:hover img {
    filter: grayscale(100%);
  }

  #whitebox:hover {
    background-color: rgba(0, 25, 253, 0.788);
  }
  #whitebox:hover img {
    filter: grayscale(100%);
  }

  #amintire:hover {
    background-color: #65ff29;
  }
  #amintire:hover img {
    filter: grayscale(100%);
  }

  #popweb:hover {
    background-color: #ffa8e9;
  }
  #popweb:hover img {
    filter: grayscale(100%);
  }

  #crary:hover {
    background-color: yellow;
  }
  #crary:hover img {
    filter: grayscale(100%);
  }

  #harmonie:hover {
    background-color: #c7cbff;
  }
  #harmonie:hover img {
    filter: grayscale(100%);
  }

  #calendrier:hover {
    background-color: #ff73ad;
  }
  #calendrier:hover img {
    filter: grayscale(100%);
  }

  /* PAGES TRAVAUX*/
  .blockimg {
    margin-top: 0.4em;
    margin-left: 0.7em;
    padding-right: 1.7em;
    display: flex;
  }

  .displayimg {
    margin-right: 0.4em !important;
    height: 50vh !important;
    width: auto !important;
  }
  .lastimage{
    padding-right: 1em;
  }
  .vimeo {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
  }

  .title {
    width: 50vw;
  }

  .xmlworkbody {
    width: 50vw;
  }

  /* ILLU */

  .divillu {
    flex-wrap: wrap;
    margin: auto;
    display: block;
  }

  .illu {
    flex-direction: row;
    align-items: center;
    justify-content: baseline;
    width: 20vw;
    height: auto;
    padding-left: 1vw;
    margin-top: 0;
  }

  .portre {
    max-height: 22vw;
    width: auto !important;
  }

  .space {
    width: 100vw;
    height: 2vh;
  }
  /* CERAMIQUES */
  .blockcera{
    width: 100vw;
    padding-left: 1vw;
  }
  .divcera {
    flex-wrap: wrap;
    margin: auto;
    display: block;
  }
  .cera {
    flex-direction: row;
    align-items: center;
    justify-content: baseline;
    width: 20vw;
    height: auto;
    margin-top: 0;
  }

  /* ABOUT */
  .aboutpage {
    margin-left: 1vw;
    width: 55vw;
  }

  .prez {
    font-size: 1.3em;
  }

  .courant {
    font-size: 1.1em;
  }

  .courantlight {
    font-size: 1.1em;
  }

  .credits {
    font-size: 1em;
  }

  .volcan {
    width: 30vw;
    display: block;
    float: right;
    margin-top: -45vw;
    margin-right: 8vw;
  }

  /* FOOTER*/
  .footercont {
    background-color: white;
    width: 100vw;
    border-top: 2px solid black;
    position: fixed;
    bottom: 0;
    z-index: 1;
  }

  .footer {
    margin-top: 2px;
    width: 100vw;
    font-size: 1em;
    font-family: "Libre Baskerville";
  }

  .footerlight {
    font-weight: bold;
  }

  .mail {
    text-decoration: underline 1px dotted blue;
  }
}

/*# sourceMappingURL=style_desktop.css.map */