@font-face {

    font-family: "arbutus";
    src: url(../font/ArbutusSlab-Regular.ttf);
}

@font-face {

    font-family: "authenticsans90";
    src: url(../font/AUTHENTICSans-90.otf);
}

@font-face {

    font-family: "authenticsans60";
    src: url(../font/AUTHENTICSans-60.otf);

}

@font-face {

    font-family: "authenticcondensed90";
    src: url(../font/AUTHENTICSans-Condensed-90.otf);

}



img {


    width : 140%
   
    
}


body {                /* body - or any parent wrapper */
    display: flex;
    flex-direction: column;
    min-height: 190vh;
    overflow-x: hidden;

  }

  pre {

    font-family: arbutus;
    
  }
  
main {
    flex: 1;
  }

header {


    height : 265px;

}

main {

    display: grid;
    grid-template-columns: repeat(5, 1fr);
    column-gap: 20px;
    min-height: 100%;
    margin-left: 20px;   
    margin-right: 20px;
}

h1 {
    font-family: authenticsans90 ;
    margin-left: 20px;
    font-size: 20px;
    text-decoration: underline;
}

h4 {
margin-left: 40px;
font-family: monospace;


}

a {
 
    font-family: authenticsans90 ;
    color: rgb(241, 65, 247);

}

figcaption {

    font-family: authenticsans90 ;
    font-size: 13px;
    

}

p {

    font-family: authenticsans90 ;
    font-size: 15px;
}

pre {

    font-family: monospace;
}

.cvdiv {

 grid-column: 2/5;
 margin-top: 0;
 margin-bottom: 20pt;
  
}


.cv {

    font-family: authenticsans90;
    background-color: #ffffff;
    border-radius: 50%;
    font-size: 15pt;
    box-shadow: 5px 5px 5px rgb(231, 78, 7);


}

.cvcache {

    display: block;
    font-family: authenticsans90 ;
    font-size: 11pt;


}

.cv:hover +.cvcache {

    display: block;

}
 


.rubrique {

    margin-bottom: 30px;
}


.numerique {

    grid-column: 0/1;

}

.affiche {

    grid-column: 1/2;
    border-right-style : dashed;
    border-right-width: 1px;
    

}

.edition {

        grid-column: 2/3;
        border-right-style: dashed;
        border-right-width: 1px;
        
}

.video {

    grid-column: 3/4;
    border-right-style : dashed;
    border-right-width: 1px;        
    
}

.dessin {

    grid-column: 4/5;
    border-right-style : dashed;
    border-right-width: 1px;
    
}

.descriptioncache {

    display: none;
    margin-right: 20px;
}

.decale {

    margin-left: 20px;

}




 img:hover {

    filter: blur(2px);

 }



 figure:hover + .descriptioncache {
    display : block
 }

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

    main {

     display: inline-block;

    }

    img {

        width: 85%;
    }

    pre {

        white-space: break-spaces;

        }

     img:hover {

            filter: blur(0px);
        
     }

    .cvcache {

        display: block;
    }

    .descriptioncache {

        display: block;
        margin-left: 20px;
        margin-right: 30px;
    }
  
    
}

.date {

    font-size : 9pt; 
    
    }