/*Auteur originel : Maxime Cauté*/
/*Original author : Maxime Cauté*/

html
{
  overflow-x: hidden;
  height: 100%;
  width: 100%;

  font-size: 18pt;
  font-family: "Verdana";
}

@media (prefers-color-scheme: dark){
  body
  {
    background-color: black;
    color: white;
  }
}

@media (prefers-color-scheme: light){
  body
  {
    background-color: white;
    color: black;
  }
}

body
{
  overflow:hidden;

  margin : 0;
  padding: 0;

  height: 100vh;

  width: 100vw;

  display: flex;

  flex-direction: row;
  align-items: center;
}

/*~~~~~~~~~~~~~~*/
/* Header style */
/*~~~~~~~~~~~~~~*/

header
{
  background-color: orange;
  color: black;
  font-family: "Times New Roman", "Comic Sans MS";

  overflow: auto;

  height: 100vh;

  width: 15%;

  display: flex;
  flex-direction: column;
  align-items: center;

  border: solid black;

  margin: 0;
  margin-left: 5%;
  padding : 5px;

}

/* Resume button */
header .resume-button
{
  background-color: white;
  color: inherit;

  text-decoration: none;

  padding: 8px;

  font-family: inherit;
  border: solid black;
  border-radius: 10px;
}

header h3 a, header h3 a:visited
{
  color: black;
  font-family:inherit;
}

header p, header a
/* header p */
{
  color: black;
  display: flex;
  flex-direction: column;
  align-items: center;
}

header a
{
    margin: 0px;
}

/*~~~~~~~~~~~~*/
/* Body style */
/*~~~~~~~~~~~~*/

/* .postcard-item
{
  font-style: italic;
  font-family: "palatino";
  text-align:center;
  margin: 1%;
} */

#postcard
{
  display: flex;
  flex-direction: column;
  align-items: center;

  font-style: italic;
  font-family: "palatino";
  text-align:center;
  margin: 1%;
}

.postcard{}

#main-section
{
  display: flex;
  flex-direction: column;
  height:100%;
  width:70%;
}

section
{
  padding: 5px;
  margin: 0% 5%;

  height: 100%;


  display:flex;

  flex-direction: column;

  overflow: auto;
}

.subsection
{
  margin : 2% 10%;
  padding: 10px;

  border: thick double orange;

}

.tab
{
  padding: 20px;
}

section h1, section h2
{
  text-align: center;
  font-family: "Palatino";
}

p, ul, li, article
{
  /* color: inherit; */

  font-family: "Palatino";
}

a
{
  color:orange
}

a:hover
{
  color: grey
}

a:visited
{
  color: orange
}

/*~~~~~~~~~~~~~~~*/
/* Miscellaneous */
/*~~~~~~~~~~~~~~~*/

#PhotoProfil
{
  width:60%;
  border: solid black;
}

.flag
{
  width: 30%;
  border: 2px solid black;
}