/*
SPACING SYSTEM (px)
2/4/8/12/16/24/32/48/64/80/96/128

FONT SIZE SYSTEM
10/12/14/16/18/20/24/30/36/44/52/62/74/86/98
*/

/*
MAIN COLOR:;
GREY COLOR:;
*/
/*Universal selector with the lowest priority*/


* {
  font-family:sans-serif;
  margin: 0;
  padding: 0;
}
/*page section*/
body {
  font-family: Georgia;
  color: black;
  width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px;
  position: relative;
  cursor: auto;

  /*background-color: #f6ee9ec2;*/
  background-image: -webkit-linear-gradient(#dcf9f2a9, #e6f7e1);
  /*border: 20px 20px;
  border-color: #1111ba;*/
}
.container {
  width: 800px;
  /*background-color: ;*/
  background-image: -webkit-linear-gradient(#dcf9f2a9, #e6f7e1);
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2%;
  border-top-width: 5px;
  border-bottom-width: 5px;
  border-left-width: 5px;
  border-right-width: 5px;
  border-color: #1111ba;
}
.main-header {
  /*text-decoration-color: #1005e9;*/
  text-align: center;
  font-size: 18px;
  background-color: #2ab7ef;
  /*padding: 20px;
  padding-left: 40px;
  padding-right: 40px;
  */
  /*shorthand 
  padding first value = top&bottom and second value =left-right*/
  padding: 20px 10px;
  margin-bottom: 30px;
  /*A fixe height may cause problems for other inline containers*/
  height: auto;
}
.post-header {
  margin-top: 40px;
  margin-bottom: 40px;
}

aside {
  /*background-image: -moz-linear-gradient(#1ea9ee, #cde6f4);*/
  border-width: 2px;
  border-top: 5px solid #439ce5;
  border-bottom: 5px solid #1098ad;
  border-left: 2px solid #1098ad;
  border-right: 2px solid #1098ad;
  padding: 50px 0;
  width: 500px;
}
section {
  width: 500px;
  margin: auto;

  /*background-image: -moz-linear-gradient(#1ea9ee, #cde6f4);*/
 /* border-top: 5px solid #439ce5;
  border-bottom: 5px solid #1098ad;
  border-left: 2px solid #1098ad;
  border-right: 2px solid #1098ad;*/
}

/*smaller elements*/
h1,
h2,
h3 {
  color: #f60606;
  text-align: center;
}
h1 {
  font-size: 42px;
  font-family: 'Franklin Gothic Medium', sans-serif;
  /*text-transform: uppercase;*/
  font-style: italic;
  text-shadow: 3px 2px 0px #000;
}

h2 {
  font-size: 36px;
  text-align: center;
  margin-bottom: 20px;
  text-shadow: 3px 1px 0px #000;
}

h3 {
  font-size: 20px;
  font-weight: 400;

  margin-bottom: 20px;
}

h4 {
  font-size: 18px;
  text-transform: uppercase;
  text-align: center;
}
h5 {
  color:#000
  font-size:18px;
  text-align: center;
}
h6{
  color: rgb(2, 66, 101);
  font-size: 48px;
  font-weight: 500;
  text-align: center;
}

li {
  font-size: 20px;
  padding-bottom: 10px;
}
li:last-child {
  margin-bottom: 0;
}

img{
  border-radius: 10px ;
}
footer p {
  font-size: 16px;
}
article {
  width: 780px;
  background-color: #a1e3fd96;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
  border-style: solid;
  border-width: 5px;
  border-color: #1005e9;
  border-collapse: collapse;
}
article header {
  margin-top: 20px;
  margin-bottom: 30px;
  text-align: center;
  font-style: italic;
}
article p {
  text-align: center;
}
table{
  width:780px;
  font-size: 20px;
  margin-top: 10px;
  border:2px solid #1005e9;
  border-collapse: collapse;
}

thead{
  color: black;
  background-color: rgb(26, 229, 229);
  font-size: 30px;
  font-style: italic;
  font-weight: 700;
  font-family: Times;
  text-align: center;
  border-bottom: 4px solid blue;
  padding: 32px 30px;
}
thead tr{
  background-color: rgb(26, 229, 229);
}

tbody {
  text-align: left;
  border-style: solid;
  border-width: 1px;
  padding: 16px 15px;
  border-collapse: collapse;
  /*
  border-bottom:2px;
  border-left: 2px;
  border-right: 2px;
  */
}
th,
td{
  
  padding:10px 10px 10px 10px;
  border: 2px solid blue;;
}
tbody tr:nth-child(odd){
  background-color: #cccecd;

}
tbody tr:nth-child(even){
  background-color: #d0d8d4;
}
/*article img{
  width: 500px;
  margin-top: 10px;
  margin-left: 100px;
  margin-right:100px;
  margin-top: 10px;
}*/
.fleur-de-leah-regular {
  font-family: "Fleur De Leah", cursive;
  font-weight: 400;
  font-style: normal;
}

.manufacturing-consent-regular {
  font-family: "Manufacturing Consent", system-ui;
  font-weight: 400;
  font-style: normal;
}

.jacquard-12-regular {
  font-family: "Jacquard 12", system-ui;
  font-weight: 400;
  font-style: normal;
  font-size: 36px;
}


.jacquard-24-regular {
  font-family: "Jacquard 24", system-ui;
  font-weight: 400;
  font-size: 72px;
  font-style: normal;
}

.inter-titre {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.merriweather-ancien {
  font-family: "Merriweather", serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: italic;
  font-variation-settings: "wdth" 100;
  /*color: rgb(2, 95, 64);*/
}
.dm-serif-display-regular {
  font-family: "DM Serif Display", serif;
  font-weight: 400;
  font-style: normal;
}

.dm-serif-display-regular-italic {
  font-family: "DM Serif Display", serif;
  font-weight: 400;
  font-style: italic;
}

.texte-area {
  width: 550px;
  margin: auto;
  color: rgb(32, 33, 34);
  font-family: "inter", sans-serif;
  text-align: left;
}
.list-area{
  width: 600px;
  margin: auto;
}
.centre {
  width: 200px;
  text-align: center;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
}
#author {
  font-style: italic;
  font-size: 18px;
}
#copyright {
  font-size: 16px;
}
.related-author {
  font-size: 18px;
  font-weight: bold;
}

.related {
  list-style: none;
}

.first-li {
  font-weight: bold;
}

.tdborder1 {
  border-bottom: 2px solid blue;
  border-top: 2px solid blue;
}
.here {
  text-decoration-color: #cccecd;
  }

p {
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 15px;
}
/*
li:first-child {
  font-weight: bold;
}
li:last-child {
  font-style: italic;
}

li:nth-child(2) {
  color: rgb(5, 142, 180);
}
li:nth-child(odd) {
  color: aqua;
}
*/

article p:last-child {
  color: rgb(11, 10, 10);

}


p i {
  color: #1005e9 !important;
}
/* styling links*/


nav a:link {
  color: rgba(3, 90, 157, 0.319);
  background-color: #c7fbee42;
  margin-right: 5px;
  font-weight: 500;
  font-size: 16px;
  text-decoration-color: black;
  border-radius: 5px;
}
nav a:hover {
  color: black;
  font-weight: bolder;
  text-decoration: underline orangered;
}
nav a:active {
  background-color: rgb(157, 3, 3);
  font-style: italic;
  font-family: serif;
}

nav a:link {
  color: black;
  display: inline-block;
  box-shadow: 2px 2px 3px #000;
  /*background-color: #c7fbee;*/
  
  margin-left: 10px;
  margin-top: 20px;
  padding: 10px;
  cursor: auto;
}


ul,
ol {
  display:flex;
  flex-direction: column;
  gap:20px;
  margin-left: 50px;
  
}

ol {
  list-style-type: decimal;
}
.two-img {
  width: 365px;
  height: 200px;
  margin-right: 10px;
  margin-left: 10px;
  border-width: 5px;
  border-color: #1005e9;
  border-style: solid;
}
/*img behave as inline-block elements*/
.post-img {
  width: 780px;
  height: auto;
  /*height:auto is only mrequires if height of element is specified elsewhere*/

}

.logo-club {
  width: 500px;
  height: auto;
  margin-left: 150px;
  margin-right: 50px;
  margin-top: 10px;
  border-width: 5px;
  border-color: #1005e9;
}
.mini-logo {
  width: 50px;
  height: auto;
  margin-left: 5px;
  box-shadow: 10px 10px 20px 1px rgba(240, 121, 180, 0.635);
}
/*lvha*/
/*Resolving conflicts*/
/*Note that the !important key word is the most priority*/
/*this is the most significant selector
#copyright {
  color: red;
}

.copyright {
  color: blue;
}
.text {
  color: yellow;
}
*/
.couleur-bleu {
  color: #036363;
}
footer p {
  width: 500px;
  color: green;
  text-align: center;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
}


button {
  font-size: 16px;
  /*padding: 20px;*/
  cursor: crosshair;
  /*border-radius: 50px;*/
  /*
  position: absolute;
  bottom: -50px;
  right: 50px;*/
}
/* default elements are all block level elements as they occupy the entire width of the screen
    such as: body,main,header,footer,section,nav,aside,div, h1-h6, p, ul,li, etc*/

/*inline boxes occupy only the space needed for their content such as strong element, 
    important etc the line and width properties do not have any effects and padding only 
    on the right&left sides*/