body {
    color-code-background: #f8f8f8;
    color-code-foreground: black;
    font-stack: Montserrat, system-ui, -apple-system, BlinkMacSystemFont,"Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color-foreground-primary: black;
    color-foreground-secondary: #5a5c63;
    color-foreground-muted: #646776;
    color-foreground-border: #878787;
    color-background-primary: white;
    color-background-secondary: #f8f9fb;
    color-background-hover: #efeff4ff;
    color-background-over  transparent: #efeff400;
    color-background-border: #eeebee;
    color-announcement-background: #000000dd;
    color-announcement-text: #eeebee;
    color-brand-primary: #8044FF;
    color-brand-content: #8044FF;
    admonition-font-size: 0.9rem;
    admonition-title-font-size: 0.9rem;
    text-align: justify;
    width: 90vW;
  
  }
  body[data-theme="dark"] {
    color-code-background: #272822;
    color-code-foreground: #f8f8f2;
    font-stack: Montserrat, system-ui, -apple-system, BlinkMacSystemFont,"Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color-foreground-primary: #ffffffcc;
    color-foreground-secondary: #9ca0a5;
    color-foreground-muted: #81868d;
    color-foreground-border: #666666;
    color-background-primary: #131416;
    color-background-secondary: #131416;
    color-background-hover: #1e2124ff;
    color-background-over  transparent: #1e212400;
    color-background-border: #303335;
    color-announcement-background: #000000dd;
    color-announcement-text: #eeebee;
    color-brand-primary: #7C3EFF;
    color-brand-content: #7C3EFF;
    admonition-font-size: 0.9rem;
    admonition-title-font-size: 0.9rem;
  
  }
  @media (prefers-color-scheme: dark) {
    body:not([data-theme="light"]) {
    color-code-background: #272822;
    color-code-foreground: #f8f8f2;
    font-stack: Montserrat, system-ui, -apple-system, BlinkMacSystemFont,"Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color-foreground-primary: #ffffffcc;
    color-foreground-secondary: #9ca0a5;
    color-foreground-muted: #81868d;
    color-foreground-border: #666666;
    color-background-primary: #131416;
    color-background-secondary: #131416;
    color-background-hover: #1e2124ff;
    color-background-over  transparent: #1e212400;
    color-background-border: #303335;
    color-announcement-background: #000000dd;
    color-announcement-text: #eeebee;
    color-brand-primary: #7C3EFF;
    color-brand-content: #7C3EFF;
    admonition-font-size: 0.9rem;
    admonition-title-font-size: 0.9rem;
  
    }
  } 
  
    ul.simple {
    line-height: 1.5em ;
    list-style-type : disc ;
    margin-left:0 ;
  }

    ul.none {
    list-style-type : none ;
    margin-left:0 ;
  }

  
      ul.num {
    line-height: 1.5em ;
    list-style-type : upper-roman ;    
  }
  
  ul.pied{
  	  font-style:bold;
      line-height: 1.5em ;
      padding:0px;
	  list-style-type : none ;
  }

      ul.exo {
    line-height: 1.5em ;
    list-style-type : circle ;
  }

/* Create two columns/boxes that floats next to each other */
nav {
  float: left;
  width: 80vW;
  /* height: 300px; only for demonstration, should be removed */
  /*background: #ccc;*/
  /*border: solid;*/
  padding:20px;
  
  
}



article {
  float: left;
  padding: 10px;
  width: 80vw;
  
  /*background-color: #d4f1f4; */
  /* height: 300px; only for demonstration, should be removed */
}

/* Clear floats after the columns */
section::after {
  content: "";
  display: table;
  clear: both;
}

/* Create colored blocks */
.bloc-exo {
  width: 20vW;
  
  background: #ccc;
  border: solid;
  padding: 15px;
}

.bloc-rem {
  
  
  background: #d4f1f4;
  border: dashed blue;
  margin: 40px;
  padding:15px;
}

.bloc-rep {
	width: 65%;
  
  background: #d4f1f4;
  border: dashed red;
  margin: 40px;
  padding:15px;
}

.bloc-in {
	width: 95%;

}

/* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */
@media (max-width: 600px) {
  nav, article {
    width: 100%;
    height: auto;
  }
  
div.right {
font-size:10pt;
text-decoration:none;
font-weight:normal;
text-align:right;
color: #3effd2;

}



.container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: flex-start;
    width: 85%; /* largeur de la page*/
    
    /*height: 80vh;*/
    overflow: auto;
    flex-direction: row;
}

.container div {
    width: 45%; /* obligatoire sinon ca marche pas.  */
    height: auto;/*plus joli pour que les cadres soient identiques */
    margin: 10px;
    /*background-color: lightblue;*/
}
  
.reponse {
	color: blue;
	background-color: #f3d5f5;
	border: dashed red;
	}

code {
  font-family: Consolas,"courier new";
  color: crimson;
  background-color: #f1f1f1;
  padding: 2px;
  font-size: 105%;
}