body {
  font-family: sans-serif;
  margin: auto;
  max-width: 1280px;
}

/*NAVBAR*/
nav {
  position: sticky;
  top: 0;
  background-color: #005000;
  padding: 1em;
  
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-evenly;
}

nav a {
  font-size: larger;
  color: white;
  text-decoration: none;
}

/*DIPLOMES*/

.diplomes {
  background-color: #000050;
  color: white;
  padding: 1em;
}

/*COMPETENCES*/

.list_comp {
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 1em;
}

.list_comp div {
  padding: 1em;
  color:white;
}

#comp_real {
  background-color:#B80905;
}
#comp_opti {
  background-color:#ED8C51;
}
#comp_admi {
  background-color:#EFBA11;
}
#comp_gere {
  background-color:#8CC850;
}
#comp_cond {
  background-color:#0A215E;
}
#comp_cola {
  background-color:#0F0F0F;
}

/*PROJETS*/
.ligne_semestre {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  column-gap: 1em;
}

.projet {
  display: flex;
  flex-direction: column;
  align-items: center;
  
  width: fit-content;
  background-color: #D9D9D9;
  padding: 16px;
  border-radius: 20px;
}

.projet img {
  width: 140px;
}

.projet p {
  font-size: 24px;
  font-weight: bold;
  line-height: 0;
  color: black;
}

a:has( > .projet) {
  text-decoration: none;
}

.comp_dots {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

/*FOOTER*/
footer {
  background-color: black;
  color: white;
  margin: 1em 0;
  padding: 1em;
}

footer a {
  color: lightblue;
}

/*PAGES PROJETS*/

header:has( > .bnRetour) {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 1em;
}

.bnRetour {
  height: fit-content;
  padding: 1em;
  background-color: red;
  border-radius: 10px;
  
  text-decoration: none;
  color: white;
  font-weight: bold;
}

header ul {
  list-style: none;
  display: flex;
  flex-direction: row;
  column-gap: .5em;
}

header ul li {
  padding: 10px;
  color: white;
  border-radius: 1em;
}

/*Journal*/
.lespdf {
  width: 60%;
  display: grid;
  grid-template-columns: 50% 50%;
  grid-column-gap: 10px;
}

/*PICROSS*/
#solution_picross {
  float: right;
}