body {
  font-family: "Quicksand", sans-serif;
    background-color: rgb(228, 218, 203);
}

h2 {
  color: white;
  text-align:center;
  text-transform:uppercase;
  font-size:26px; letter-spacing:1px;
  margin-left: 15px;
  margin-right: 15px; 
}

table{
  width: 100%;
}

.table1{
  width: 50%;
  margin: 20px 20px 20px 20px;
}

.table2{
  text-align: center;
  width: 90%;
  margin: 20px 20px 20px 20px;
}

.header1 {
    position: relative;
    overflow: hidden;
    font-size: 20px;
    font-weight: bold;
    background-color: #f1f1f1;
    padding: 10px 10px;
    display: grid; 
    grid-template-columns: 75px 1fr 1fr 1fr; 
    grid-template-rows: 4em; 
    gap: 0px 0px; 
    grid-template-areas: 
      "p1 p2 p3 p4";
}

.header2{
  background-color: #f1f1f1;
  text-align: center;
  font-family: "Quicksand", sans-serif;
}

.header1 > p {
  font-size: 30px;
}

.p1 { grid-area: p1;
text-align: center; }
.p2 { grid-area: p2;text-align: center; }
.p3 { grid-area: p3;text-align: center; }
.p4 { grid-area: p4;text-align: center; }

.header2 {
  overflow: hidden;
  background-color: #f1f1f1;
  padding: 20px 10px;
}

.header2 a {
  float: left;
  color: black;
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 18px;
  line-height: 25px;
  border-radius: 4px;
}

.header2 a.logo {
  font-size: 25px;
  font-weight: bold;
}

.header2 a:hover {
  background-color: #ddd;
  color: black;
}

.header2 a.active {
  background-color: dodgerblue;
  color: white;
}

.header-right {
  float: right;
  margin-left: 10px;
}

@media screen and (max-width: 500px) {
  .header2 a {
      float: none;
      display: block;
      text-align: left;
  }
  .header-right {
      float: none;
  }
}

.parent {
  margin-left: 20px; 
  margin-right: 20px;
  display: grid; 
  grid-template-columns: 1fr 1fr; 
  grid-template-rows: 1fr; 
  gap: 0px 0px; 
  grid-template-areas: 
    "div1 div2";
  grid-auto-rows: max-content;
}
    
.div1 { grid-area: div1; justify-self: stretch; }
.div2 { grid-area: div2; justify-self: stretch; }

.parent2{
  margin-top: 20px;
  margin-left: 20px; 
  margin-right: 20px;
  display: grid; 
  grid-template-columns: 1fr; 
  grid-template-rows: 1fr 1fr; 
  gap: 0px 0px; 
  grid-template-areas: 
    "part1"
    "part2";
  grid-auto-rows: max-content;
}

.part1 { grid-area: part1; justify-self: stretch; }
.part2 { grid-area: part2; justify-self: stretch; }

.titre1 {
  background-color: rgb(31, 31, 146);
  border-radius: 50px;
}

.titre2 {
  background-color: rgb(146, 33, 31);
  border-radius: 50px;
}

.titre3 {
  background-color: rgb(20, 107, 12);
  border-radius: 50px;
}

.absent-professor {
  font-size: 40px; 
  color: #000000;
  font-weight: bold;
  text-align: center;
}

.absent-professor > p > b > i{
  font-size: 30px; 
  color: #000000;
  margin-left: 30px;
}

.absent-professor > p > b{
  font-size: 40px; 
  color: #17820e;
}

.absent-professor.absent {
  font-size: 40px; 
  color: #267BBD; 
  font-weight: bold;
}

.indications{
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

.centerLogo{
  display: flex;
  justify-content: left;
}

.imgLogo{
  height: 75px;
  width: 75px;
}

.informations{
  font-size: 100px; 
  color: rgb(150, 36, 36);
  background-color: #859fcf;
  border-radius: 50px;
  padding-left: 10px;
  padding-right: 10px;
}

.marquee {
  height: 115px;
  padding-left: 10px;
  padding-right: 10px;
}

.custom-select{
  font-family: "Quicksand", sans-serif;
  position: relative;
  width: 90%;
}

.selectProf{
  height: 100px;
  text-align: center;
}

.formContainer {
  display: grid; 
  grid-template-columns: 1fr 1fr 1fr; 
  grid-template-rows: 1fr; 
  gap: 0px 0px; 
  grid-template-areas: 
    "area1 area2 area3"; 
}
.area1 { grid-area: area1; justify-self: stretch; text-align: center; padding-bottom: 20px;}
.area2 { grid-area: area2; justify-self: stretch; text-align: center;}
.area3 { grid-area: area3; justify-self: stretch; text-align: center;}

.inputSujet{
  width: 66%;
}

.inputCommentaire{
  height: 50px; 
  width: 66%;
}

.paddingButton{
    padding-left: 30%;
}

.button1 {
  background-color: #a7aa04; 
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

.imgIcons {
  height: 40px;
  width: 40px;
}

.imgLogos {
  height: 50px;
  width: 50px;
}