@font-face {
    font-family: "Reckoner_Bold";
    src: url('../polices/Reckoner_Bold.ttf');
}

@font-face {
    font-family: "ASHBB";
    src: url('../polices/ASHBB.ttf');
}
@font-face {
    font-family: "starjedi";
    src: url('../polices/Starjedi.ttf');
}
/* Design des liens */
a {
  color: black;
  text-decoration: none;
}

ul {
  list-style-type: none;
}

.button {
  border:1px solid #1A1717;
  display:inline-block;
  color:rgb(255,255,255);
  font-size: 14px;
  padding:6px 6px;
  background-color:#1A1717;
  border-bottom: 4px solid #DB1C36;
  cursor: pointer;
}

/* Image de font */
html {
background-color:black;
background-image:url(../images/fond4.jpeg);
background-attachment: fixed;
background-position: center center;
background-repeat: repeat-x;
background-size: 60%;
font-size: 16px;
color: #a3a3a3;
font-weight: bold;
font-family: 'ASHBB';
overflow-x: hidden;
}

/* Début de gestion du format de la page */
body {
margin-left: 10%;
margin-right: 10%;
margin-top: 0%;
margin-bottom: 0%;
position: relative;
display: flex;
flex-direction: column;
min-height: 100vh;
background-color:#444141;
padding:5px;
box-shadow:
  0 2px 2px 3px rgba(0, 0, 0, 0.5) inset,
  0 1px 2px 0 rgba(255, 255, 255, 0.5);
}

.site-content {
  flex: 1;
}
/* Fin de gestion du format de la page */

/*Erreur design*/
.error{
  font-size: 250px;
  color: #FFFFFF;
}
.errorC {
  text-align: center;
}

/* Design du titre */
.title {
  margin-left:auto;
  margin-right:auto;
  margin-left: 38.5%;
  margin-top: 0.5%;
  margin-bottom: 1%;
  width:35%;
  color: #fff;
  font-family: "Reckoner_Bold";
  font-size: 60px;
}

/* Design du header */
.site-header {
  background-color: #1A1717;
  float:left;
  width: 100%;
  margin-left: -0.4%;
  padding-left: 0.8%;
  margin-top: -0.4%;
  padding-top:0.8%;
  margin-bottom:3%;
  box-shadow: 0 5px rgba(219, 28, 54, 0.8);
}

.article {
  background-color: rgb(238, 238, 238);
  color: #000000;
  margin-bottom: 10%;
  margin-left: 10%;
  margin-right: 10%;
  margin-top: 26%;
  padding: 2%;
  box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
}

.zone_boutons {
  text-align: center;
}

.zone_boutons-bouton {
  margin-left: 2%;
  margin-right: 2%;
  display: inline;
}

.articleT {
  background-color: #1A1717;
  color: #ffffff;
  float:left;
  width: 100%;
  margin-left: -2.7%;
  padding-left: 5.5%;
  margin-top: -2.7%;
  margin-bottom:3%;
  box-shadow: 0 5px #DB1C36;
}

/* Design du footer */
.site-footer {
  text-align: center;
  background-color:#1A1717;
  color: white;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.3);
}

.site-footer a {
  color: white;
}

/* Design info dev */
.dev-info-devs {
  margin-top: 10%;
  margin-left:10%;
  margin-right: 10%;
  border: 1px solid white;
  padding-left: 2%;
  padding:5px;
  background-color: white;
  box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
  display: inline-block;
}

.dev-info-devs-text-name {
  font-weight: 500;
  margin: 0px 0px 5px 0px;
  font-size: 24px;
  color: #FF5722;
}

.dev-info-devs-text-poste {
  font-weight: 500;
  margin: 0px 0px 5px 0px;
  font-size: 16px;
}

/* Design de la photo polaroid du husky */
.husky-zone {
  text-align: center;
  background-color: #444141;
  margin-bottom: 10%;
}

.husky-box {
  padding: 2%;
  background-color: white;
  display: inline-block;
  box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
}

.husky {
  display: inline-block;
  width: 250px;
  height:250px;
  border: none;
}

.husky-about {
  font-size:12px; /* Une police plus grande pose problème pour les écran de baisse résolution comme le mien ! A régler !*/
  color: black;
}

.style-content{
  /*position: absolute;*/
}