/* css styles */

/************************************************************/
/* Titles                                                   */
/************************************************************/

h1,h2,h3,h4 {
  color:#447099;
}

h2::before {
  content: '\25B6'; /*Arrow Forward*/
  margin-right: 8px;
}

h3::before {
  content: '\1F538'; /*Orange Diamond*/
  margin-right: 8px;
}

h4::before {
  content: '\1F4CD';  /*Pushpin*/
  margin-right: 8px;
}

.header-section-number:after { /*add a dot after the section number (1 title -> 1. title)*/
  content: ".";
} 

/************************************************************/
/* Format                                                   */
/************************************************************/

.column{
  width: 50%;
  padding: 5px;
}
  
img{                       /*center figures */
  max-width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

p{
  text-align: justify;
}


/************************************************************/
/* Box                                                      */
/************************************************************/

.green-box,
.blue-box,
.yellow-box,
.white-box  {
  color: black;
  border-radius: 10px;
  margin: 0 0 15px;
  overflow: hidden;
  padding: 2px;
  width: 100%;
}

.green-box {
  background-color: #d9f0dd;
  border: solid 2px #226D68;
}

.blue-box {
	background-color: #bbc5ee;
  border: solid 2px #2f3bda;
}

.yellow-box {
  background-color: #fdf0c9;
  border: solid 2px #fdc218;
}

.white-box {
  background-color: white;
  border: solid 2px black;
}

.green-button {
  display: inline-block;
  padding: 2px 5px;
  font-size: 14px;
  color: white;
  background-color: green;
  border: none;
  border-radius: 12px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.green-button:hover {
  background-color: darkgreen;
}

.grey-button {
  display: inline-block;
  padding: 2px 2px;
  font-size: 14px;
  color: black;
  background-color: grey;
  border: 2px solid blue;
  border-radius: 5px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

.grey-button:hover {
  background-color: darkgrey;
  border-color: darkblue;
}

/************************************************************/
/* html Vs RevealJS                                         */
/************************************************************/

/* Hide revealJS speaker notes in the html*/
.notes,
.hide-html-render{       /*::: {.content-hidden when-format="html"}*/
  display: none;
}


/************************************************************/
/* Various                                                  */
/************************************************************/

.sourceCode .co {         /* SQL comments */
  color: green;
}

.terminal {
  background-color: #1e1e1e;
  color: #33ff33;
  font-family: "Courier New", monospace;
  padding: 10px;
  border-radius: 5px;
  white-space: pre-wrap; /* Préserve les espaces et les sauts de ligne */
  font-size: 14px;
}

.terminal::before {
  content: "$ ";
  color: #ffcc00;
}