/* Appliquer la mise en page */
body,
html {
  height: 100%;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: url("../img/C-P-6.jpg") no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}
@font-face {
  font-family: "myHomeFont";
  src: url("./fonts/Runestars-Regular.ttf");
}

.main-page-container {
  padding: 2em;
  background-color:rgba(254, 254, 255, 0.6);;
  border-radius: 5%;
  text-align: center;
}

.main-page-container h1 {
  font-family: "myHomeFont";
  color: var(--main-dark-color);
  font-size: 3rem;
  margin-bottom: 20px;

}
.main-page-container h2 {
  font-size: 2rem;
  font-family: "myHomeFont";
  margin-bottom: 20px;

}

.main-page-links {
  display: flex;
  max-width:98vw;
  flex-wrap:wrap;
  justify-content: center;
  gap: 20px;
}

.main-page-links a {
  padding: 10px 20px;
  text-decoration: none;
  background-color: rgb(102 51 51/0.7);
  color: var(--main-clear-color);
  border-radius: 5px;
  font-size: 1.2rem;
  transition: background-color 0.3s;
}

.main-page-links a:hover {
  color: var(--secondary-blue-color);
  background-color: var(--main-dark-color);
}