diff --git a/app/static/css/bulletin-but.css b/app/static/css/bulletin-but.css
index 46d915840..07fe50e29 100644
--- a/app/static/css/bulletin-but.css
+++ b/app/static/css/bulletin-but.css
@@ -3,9 +3,13 @@
 /* Styles généraux */
 /*******************/
 :root{
-    --couleurPrincipale: #09c;
+    --couleurPrincipale: rgb(240,250,255);
+    --couleurFondTitresUE: rgb(206,255,235);
+    --couleurFondTitresRes: rgb(125, 170, 255);
+    --couleurFondTitresSAE: rgb(255, 190, 69);
     --couleurSecondaire: #0c9;
     --couleurIntense: #c09;
+    --couleurSurlignage: rgba(232, 255, 132, 0.47);
 }
 body{
     font-family: arial;
@@ -30,7 +34,7 @@ main{
 .ready main{display: block;}
 h2{
     margin: 0;
-    color: var(--couleurPrincipale)
+    color: black;
 }
 section{
     background: #FFF;
@@ -94,10 +98,11 @@ section>div:nth-child(1){
     gap: 16px;
     border-color: var(--couleurPrincipale);
     background: var(--couleurPrincipale);
-    color: #FFF;
+    color: rgb(0, 0, 0);
 }
 .civilite{
     font-weight: bold;
+    font-size: 130%;
 }
 
 /************/
@@ -138,10 +143,10 @@ section>div:nth-child(1){
 /* Synthèse    */
 /***************/
 .synthese>.ue{
-    background: var(--couleurPrincipale);
+    background: var(--couleurFondTitresUE);
 }
 .synthese h3{
-    background: var(--couleurPrincipale);
+    background: var(--couleurFondTitresUE);
 }
 .synthese em,
 .eval em{
@@ -155,7 +160,7 @@ section>div:nth-child(1){
 /***************/
 .module, .ue{
     background: var(--couleurSecondaire);
-    color: #FFF;
+    color: #000;
     padding: 4px 32px;
     border-radius: 4px;
     display: flex;
@@ -190,8 +195,8 @@ h3{
     border-bottom: 1px solid #aaa;
 }
 .eval:hover, .syntheseModule:hover{
-    background: var(--couleurIntense);
-    color: #FFF;
+    background: var(--couleurSurlignage);
+    /* color: #FFF; */
 }
 .complement{
     pointer-events:none;