@font-face {
    font-family: 'Courier New';
	src: url(/fonts/cour.ttf);
}

:root {
    --font-family-header: 'Courier New', monospace ;
    --font-family-body: 'arimo', sans-serif;
    --main-color: black;
    --highlight-color: rgb(218, 3, 3);
    --highlighting-color: rgb(228, 2, 2);
}

html {
	box-sizing: border-box;
  }
  * {
    box-sizing: inherit;
  }

  *::selection {
      background-color: var(--highlight-color);
      color: var(--main-color);
  }

body {
	margin: 0; padding: 0; /* annulation des marges */
    
	font-family: var(--font-family-body);
	overflow-x: hidden;
    width: 100vw;
    color: black;	
}

@media (min-width: 900px) {
    body {
        display: flex;
    }
}

/** SCROLL BAR **/
::-webkit-scrollbar {
    width: 5px;
	height: 7px;
	border-radius: 50%;
	z-index: 99;
	height: 50px;
	visibility: hidden;
	}
	::-webkit-scrollbar-track {
        background: rgb(195, 195, 195);
        width: 1px;
	}
	::-webkit-scrollbar-thumb { /*rgb(218, 3, 3)*/
		background: black;
		
	}
	::-webkit-scrollbar-thumb:active, ::-webkit-scrollbar-thumb:hover{
        background-color: var(--highlight-color);
	}

main {
    padding: 10px;
    margin-top: 1em;
}

@media (min-width: 500px) {
    main  {
        padding: 10px 25px;
    }
}

@media (min-width: 900px) {
    main {
        width: calc(100% - 450px);
        padding-top: 0;
        margin-top: calc(2.9em + 98px + 25px);
        border-left: solid 1px black;
        padding-left: 20px;
        margin-left: 450px;
        margin-bottom: 3em;
        height: calc(100% - 2.9em - 97px - 25px);
        overflow-y: scroll;
        position: fixed;

    }

    article {
        max-width: 800px;
    }
}



h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-header) ;
    font-weight: normal;
}

h2 {
    font-weight: bold;
    font-size: 1.4em;
}

@media (min-width: 900px) {
    h2 {
        margin-top: 0;
    }
}

pre span span span span {
    font-family: var(--font-family-body);
    width: 100%;
    white-space: normal;
    text-align: justify;
}

p, pre {
    text-align: justify;
    font-size: 15px;
    line-height: 23px;
    white-space: normal;
    font-family: var(--font-family-body);
}

img, figure, iframe {
    max-width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;

}

figcaption {
    font-family: var(--font-family-header);
    font-size: .7em;
    margin-top: .5em;
}

/* .wp-block-gallery ul {
    display: flex;
    flex-wrap: wrap;
}

.wp-block-gallery ul {
    margin: 0;
    padding: 0;
}

.wp-block-gallery li {
    list-style: none;
}

.columns-2 li {
    width: 50%;
    

}

.columns-3 li {
    width: 33%;
} */

a {
    color: var(--highlight-color);
}

a:focus, a:hover, a:active {
    text-decoration: none;
}

a:visited {
    color: var(--highlight-color);
}

/* Breadcrumbs */

h2 a {
    display: block;
    text-decoration: none;
}

h2 a:hover, h2 a:focus, h2 a:active {
    text-decoration: underline;
}

@media (min-width: 800px) {
    .breadcrumbs {
        display: none;
    }
}

.bottom-navigation {
    margin-top: 2em;
    font-family: var(--font-family-header);
    font-size: 15px;
    margin-bottom: 1em;
}

.bottom-navigation p {
    margin-bottom: 0;
    font-family: var(--font-family-header);
    font-size: 15px;
}

.bottom-navigation ul {
    list-style: none;
    padding-left: 5px;
    margin-top: 0;
}

/* ABOUT PAGE */
.facebook::before {
    display: inline-block;
    background-image: url(/img/facebook.svg);
    width: 45px;
    height: 45px;
}