@font-face {
  font-family: "Computer Modern";
  src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunss.otf');
}
.small-caps {
  font-variant-caps: small-caps;
  font-style: italic;
}
@font-face {
  font-family: "Computer Modern";
  src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunsx.otf');
  font-weight: bold;
}

@font-face {
  font-family: "Computer Modern";
  src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunsi.otf');
  font-style: italic, oblique;
}

@font-face {
  font-family: "Computer Modern";
  src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunbxo.otf');
  font-weight: bold;
  font-style: italic, oblique;
}
/*#col {
  column-count: 2;
}
*/
body {
  font-family: "Computer Modern", sans-serif;
  font-size : 20px;
}

p { font-size: 20px;
}
h1 {font-size : 50px;
 color: burlywood;
 text-align: center ;
  height: 150px;
 }
html {
  /* px signifie "pixels". La taille de police de base est maintenant de 10
     pixels de haut */
  font-size: 20px;
  
  /* Remplacez EMPLACEMENT par la valeur de la propriété font-family obtenue
     depuis Google Fonts */
 /* font-family: EMPLACEMENT; */
}
ul { font-size: 20px;
line-height: 40px;
}

.joliviolet {
 font-size: 25px;
 line-height: 30px;
 text-align: center;
  padding: 1em;
  width: 100%;
  height: 350px;
  box-sizing: border-box;
 /*font-variant: small-caps;
   La couche la plus basse sera
     peinte avec un gris clair uni */
  background-color: #D9C1FA;

}
td {
    vertical-align: middle;
}
.jolimarron {
 font-size: 20px;
 line-height: 30px;
 text-align: center;
  padding: 1em;
  width: 100%;
  height: 350px;
  box-sizing: border-box;
 /*font-variant: small-caps;
   La couche la plus basse sera
     peinte avec un gris clair uni */
  background-color: #F8F6F8;

}

.joligris {
 font-size: 20px;
 line-height: 30px;
 text-align: center;
  padding: 1em;
  width: 100%;
  height: 350px;
  box-sizing: border-box;
 /*font-variant: small-caps;
   La couche la plus basse sera
     peinte avec un gris clair uni */
  background-color: #FDF1FC;

}

.joli {
 font-size: 20px;
 line-height: 30px;
 text-align: center;
  padding: 1em;
  width: 100%;
  height: 350px;
  box-sizing: border-box;
 /*font-variant: small-caps;
   La couche la plus basse sera
     peinte avec un gris clair uni */
 /* background-color: #DFDDDD;

}