edit: interface évènement + modif typo texte (légèrement +gras)

src/style.css

@@ -23,7 +23,7 @@
 
 @font-face {
   font-family: 'velvelyne';
-  src: url('./typo/Velvelyne-Light.ttf') format('truetype');
+  src: url('./typo/Velvelyne-Book.ttf') format('truetype');
   font-weight: normal;
 }
 
@@ -189,6 +189,82 @@ html, body{
   color: var(--back-color);
 }
 
+/*==============FENETRES*/
+.windowStyle{
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-start;
+  background-color: var(--back-color);
+  border-style: solid;
+  border-width: thin;
+  border-radius: 16.1px;
+  border-color: var(--main-color);
+  overflow: hidden;
+}
+
+.zBase{
+  z-index: 33;
+}
+
+.zFocus{
+  z-index: revert;
+  z-index: 1312;
+}
+
+.windowTitle{
+  width:100%;
+  height:50px;
+  background-color: var(--main-color);
+  border-radius: 0;
+  font-family: 'velvelyne';
+  font-weight: bold;
+  text-transform: uppercase;
+  font-size: 22px;
+  color: var(--back-color);
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+  padding-left: 10px;
+  padding-right: 10px;
+  cursor: move;
+}
+
+
+.windowTitleLower{
+  font-family: 'velvelyne';
+  font-weight: bold;
+  font-size: 13.12px;
+}
+
+.closeBtn{
+  color: var(--back-color);
+  background-color: var(--main-color);
+  border-style: solid;
+  border-width: thin;
+  border-radius: 16.1px;
+  border-color: var(--back-color);
+  width: 33px;
+  height: 33px;
+  align-items: center;
+}
+
+.closeBtn:hover{
+  color: var(--main-color);
+  background-color: var(--back-color);
+}
+
+.windowContent{
+  height:77%;
+  width:100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-start;
+}
+
 /*=============INTERFACE*/
 .uiStyle{
   background-color: var(--back-color);
@@ -569,26 +645,39 @@ html, body{
   align-items: flex-start;
   justify-content: flex-start;
   box-sizing: border-box;
+  height: 50vh;
 
         #aboutText{
           width: 60%;
-          height: 100%;
-          overflow-y: scroll;
+          height: auto;
           padding-left: 4.44px;
           padding-right: 13.12px;
-          box-sizing: border-box;
+          padding-bottom: 13.12px;
+          overflow-y: scroll;
+
+          @media(min-width: 700px){
+            height: 50vh;
+          }
+          @media(min-width: 1300px){
+            height: 50vh;
+          }
 
                 p{
                   font-family: 'velvelyne';
                   font-weight: normal;
                   font-size: 13.12px;
                   color: var(--main-color);
+
+                  @media(min-width: 1300px){
+                    font-size: 20px;
+                  }
                 }
         }
 
         #eventSection{
           width: 40%;
-          height: auto;
+          height: 100%;
+          position: relative;
 
                 #title{
                   height: 44px;