@charset "UTF-8";

@font-face {
  font-family: "Karla-Regular";
  src: url("../fonts/Karla-Regular.ttf");
  font-weight: normal;
}

@font-face {
  font-family: "junicode-regular-webfont"; 
  src: url("../fonts/junicode-regular-webfont.ttf");
  font-weight: normal;
}

@font-face {
  font-family: "junicode-italic-webfont";
  src: url("../fonts/junicode-italic-webfont.ttf");
  font-weight: normal;
}

:root {
  
  --font-size: 24px;
  --small-font-size: 16px;
  --line-height: 28px;
  --small-line-height: 20px;
  
  --padding: var(--line-height);
  --max-paragraph: calc(var(--font-size) * 45);

  --color-article: blueviolet;
  --color-event:  	rgb(0,120,0);
}

html {
	scroll-behavior: smooth;
}

body {
  font-family: "Karla-Regular";
  font-size: var(--font-size);
  line-height: var(--line-height);
  padding: var(--padding);
  cursor: grab;
}

footer {
  font-size: var(--small-font-size);
  line-height: var(--small-line-height);
  margin-top: calc(var(--line-height) * 4);
}

a:hover {
  color: grey;
  cursor: pointer;
}

em{

  font-family: "junicode-italic-webfont";
}

p,
ul,
span:not(.author){

  color:  	rgb(47,89,89);
}

nav{

    position: absolute;
    top: 0;
    z-index: 1;
    padding-top: var(--padding);
    display: flex;
    width: var(--max-paragraph);
}

nav a{
    
    color: #000;
    display: block;
}

nav ul a{

    color: var(--color-article);
}

nav ul{
    
    display: flex;
    margin-left: var(--line-height);
}

canvas{

    position: fixed;
    z-index: -1;
    width: 50%;
    bottom: 25%;
    right: 25%;
    background: whitesmoke;
    filter: blur(5px);
}

.part a em{
    
    color: blue;
}

/* HOMEPAGE */ 


/* ARTICLE / EVENTS */

.part > a{
    
    display: block;
}

.part a.active span,
.part a.active .title,
.part a.active .tag{

}

.part > a:hover,
.part > a:hover > *,
.part > a:hover  .tags,
.part > a:hover  span,
.part > a:hover  .tags .theme,
.part > a:hover  .authors,
.part > a:hover .title{

    color: grey;
    cursor: pointer;
    
}

.part a > * {
  vertical-align: top;
  color: #000;
}

.part > a .tags,
.part > a .authors{

  margin-left: 6px;
}

.part > a > *{

 display: inline-block;
}

.part .tags{

  margin-top: 6px;
  font-size: var(--small-font-size);
  line-height: var(--small-line-height);
}

.part .authors .author,
.part .tags .tag{

    display: block;
}

.part .top {
  
    margin-bottom: calc(var(--line-height) * 1);
    max-width: var(--max-paragraph);
}



.part .top .headerconf {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;

}

.part .top .headerconf ul {

  font-size: var(--small-font-size);
  line-height: var(--small-line-height);
  margin-right: var(--padding);
  margin-bottom: 24px;

}

.part .place,
.part .date{

  font-family: "junicode-regular-webfont";
}

.part.article h2,
.part.article .title{
  color: var(--color-article);
}


.part.event h2,
.part.event .title,
.part.article .theme{
    
    color: var(--color-event);

}

.part.article .lang{

    font-size: var(--small-font-size);
    text-transform: uppercase;
    vertical-align: top;
    line-height: calc(var(--small-line-height) / 2);

}

.part.home + .part.event::before,
.part.event + .part.article::before{
    
    display: block;
    margin: var(--line-height) 0;
}


.part.home + .part.event::before{
    
    content: "Events";
}

.part.event + .part.article::before{

    content: "Contributions";
}

.part:not(.home) .article-content,
.part .top{

    margin-left: var(--line-height);
    margin-right: var(--line-height);
}



.part .article-content img,
.part .article-content video{
  display: inline-block;
  max-width: calc(100% + var(--line-height) * 2);
  margin-left: calc(var(--line-height) * -1);
  max-height: 90vh;
}


.part .article-content *:not(h2, h3, h4, em, strong){

  font-family: "junicode-regular-webfont";
}


 .part .article-content ul, 
 .part .article-content ol,
 .part .article-content h3,
 .part .article-content h4 + *:not(h6),
 .part .article-content h5,
 .part .article-content h6,
 .part .article-content p{

  margin-bottom: var(--line-height);
  max-width: var(--max-paragraph);

}

.part .article-content h4{


    max-width: var(--max-paragraph);
}

 .part .article-content h4 + *:not(h6){

    margin-top: var(--line-height); 

 }

.part .article-content li::before {
  content: "* ";
}


.part .article-content h5{

    font-family: "Karla-Regular";  
    margin-bottom: var(--line-height);
}

.part .article-content h5::before{
    
    content: "↳ ";
}

/* PART:OPEN */

.part{

    width: calc(50% - var(--line-height));
} 


.part.open article::-webkit-scrollbar{
    
    display: none;

}

.part.open:not(:first-child) article{
    
    padding: var(--line-height) 0;
}

/* EVENT */

.part .top h3 span{
    
    display: block;
}

.part .article-content *:not(h2, h3, h4, h5, em, strong){

  font-family: "junicode-regular-webfont";
}


.part .top{
    
    position: relative;
}

.part .top .chapeau{

    display: flex;
    flex-wrap: wrap;
    margin-bottom: calc(var(--line-height) * 1);
}

.part .top .chapeau header{
    
    max-width: calc(100% - 450px);
    margin-right: var(--line-height);
}


.part .top .types{

    margin-top: 6px;
    font-size: var(--small-font-size);
    line-height: var(--small-line-height);
    height: 0;

}

.part .top .types .type{

    display: block;
}

.part .top .interview{

    padding: calc(var(--line-height) / 4) calc(var(--line-height) / 2) calc(var(--line-height) / 3) calc(var(--line-height) / 2);
    border: solid 2px var(--color-event);
    display: inline-block;
    text-align: center;
    border-radius: 5rem;
    position: absolute;
    right: 0;
    top: 0;
}

.part .top .interview a{

    color: var(--color-event);
}

.part .top .interview:hover,
.part .top .interview:hover a{ 
    
    cursor: pointer;
    border-color: var(--color-article); 
    color: var(--color-article);
}

 .part .article-content h3,
 .part .article-content h4{

    font-family: "Karla-Regular";
 }


 

.presentations li::before,
.part .article-content li::before {
  content: "* ";
}


.part .article-content img + em,
.part .article-content video + em{
    
    display: block;
    font-size: var(--small-font-size);
    line-height: var(--small-line-height);
    font-family: "junicode-regular-webfont";
}


/* PART:OPEN */

/* PRESENTATION */

.presentations{
    
    margin-top: var(--line-height);
}

.presentations h3{

    margin-bottom: var(--line-height);
}

.presentations ul{

    font-family: "junicode-regular-webfont";
}

/* EVENT */

.part .top h3 span{
    
    display: block;
}

.part.event table{

    border-collapse: collapse;
}

.part.event table td{
    
    padding-right: var(--line-height);
    max-width: 500px;
}

.part.event table td:nth-child(4){
    
    max-width: 300px;
}

.part.event table td:nth-child(2){

    font-family: "junicode-italic-webfont";
}

.part.event table td a em,
.part.event table td:nth-child(4),
.part.event table strong{

    font-family: "Karla-Regular";
}

.part.event table strong{
    
    color: var(--color-event);

}

.part.event table td a em{

    color: var(--color-article);
}

/* INFRABLES */

.part#infrables .article-content  p:not(:nth-child(13)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(10)) img {

    display: inline-block;
    max-width: 300px;
    margin: 0  var(--padding) var(--padding) 0;
}
