html {
  box-sizing: border-box;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
body {
  /* background-color: rgb(0, 201, 254); */
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
.type-2 a {
  color: #ff0000;
}
#mon-objet-unique {
  background-color: #ffffff;
}
#xyz {
  font-size: 30px;
}
.page {
  /* background-color: rgb(173, 217, 255); */
  width: auto;
  margin: 20px;
}

.footer {
  /* background-color: rgb(226, 251, 31); */
  margin: 30px 0px;
  padding-top: 5px;
  border-top: 1px dashed #999999;
  text-align: center;
}

.titre {
  /* background-color: rgb(226, 251, 31); */
  margin: 30px auto;
  text-align: center;
}

.masonry {
  /* background-color: rgb(255, 255, 255); */
  margin: 1.5em auto;
  max-width: 1000px;
}

.masonry.col-5 {
  column-count: 5;
  column-gap: 20px;
}
/*
.masonry.col-2 {

  column-count: 2;
  column-gap: 0em;
}
*/

.item {
  display: inline-block;
  padding: 8px;
  margin: 0 0 20px 0;
  width: 100%;
  background-color: #eee;
}

.krtop {
  background-color: #dbffd2;
}

.type-2 {
  background-color: #405678;
  color: #ffffff;
}

@media only screen and (min-width: 1224px) {
  .masonry.col-5 {
    column-count: 5;
  }
  .titre,
  .masonry,
  .footer {
    max-width: 1000px;
  }
}

@media only screen and (max-width: 1223px) and (min-width: 1024px) {
  .masonry.col-5 {
    column-count: 4;
  }
  .titre,
  .masonry,
  .footer {
    max-width: 900px;
  }
}

@media only screen and (max-width: 1023px) and (min-width: 768px) {
  .masonry.col-5 {
    column-count: 3;
  }
  .titre,
  .masonry,
  .footer {
    max-width: 1000px;
  }
}

@media only screen and (max-width: 767px) and (min-width: 421px) {
  .masonry.col-5 {
    column-count: 2;
  }
  .titre,
  .masonry,
  .footer {
    max-width: 700px;
  }
}

@media only screen and (max-width: 420px) {
  .masonry.col-5 {
    column-count: 1;
  }
  .titre,
  .masonry,
  .footer {
    max-width: 700px;
  }
}