[data-theme="dark"] {
    --font1:rgb(180,180,180);
    --link1:rgb(255,200,150);
    --link2:rgb(255,125,0);
    --link3:rgb(180,180,180);
    --background-img:url(Background/Dark.jpg);
    --background: rgb(0,0,0);
    --borders:rgb(50,50,50);
}

[data-theme="light"] {
    --font1:black;
    --link1:rgb(200,100,50);
    --link2:rgb(255,40,20);
    --link3:rgb(50,50,50);
    --background-img:url(Background/Light.jpg);
    --background:rgb(230,230,220);
    --borders:rgb(0,0,0);
}

html, body, section, div, header, article, h1, h2, h3, time,p {
    
display: block;}

body {
	line-height: 1;
    background-image: var(--background-img);
    overflow-x:hidden;
    font:var(--font1);
}


.lien li {
    list-style-position: inside;
    max-height: 2.5em;
    margin-bottom: 1em;
    overflow: hidden;
    
}

a {
    text-decoration: underline;
    color: var(--link3);
}

a:hover {
    text-decoration:none;
    border-bottom-style:  dotted;
    border-bottom-width: 0.8px;
    color: var(--link1);
    }


li[clique="True"] a {color: var(--link2);}

.row {
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    align-items:stretch;
    justify-content: center;
    flex-direction: row;

	}
.col-centre, .col-cote {
    padding: 12px;
    background: var(--background) ;
    margin: 2% 15px 2% 15px;
    margin-top: 50px;
    border: 1px solid var(--borders);
    color: var(--font1);
    }

.col-centre {
    width: 50%;
    text-align: justify;
    height:auto;
}
.col-centre > (h1,h2) {
    text-align:left;
}

.col-cote {
    width: 20%;
    text-align: left;
    box-sizing: border-box;
    display:inline-table;
}
#nav {height: 50px;
    width:100%
    position: fixed;
    display:flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    color: var(--font1);
}

.col-centre h1 {
    font-size: 2.2em;
    text-align: center;
    margin-top: 0;
}
.col-centre h2 {
    font-size: 1.5em;
    text-align: left;
}
.col-centre h3 {
    font-size: 1.3em;
    text-align: left;
}

.col-centre h6 {
    margin-top: 5em;
    margin-bottom: 0;
}
