body{
 background-color: #bab8ba;
 background-image: url("https://transparenttextures.com/patterns/diagmonds.png");
 margin-top: 2%;
 display: flex;
 flex-direction: column;
}
html{
  position: relative;
  min-height: 100%;
}
.header{
  display: flex;
  justify-content: center;
}
.row{
  margin-top: 2%;
}
.btn-toolbar{
  margin-top: 2%;
}
h3{
  font-family: 'BioRhyme', serif;
  font-weight: 300;
  color: white;
  font-size: 2em;
}
#containerImg {
  position: relative;
  display: inline-block;
}
#containerImg p {
  color: white;
  position: absolute;
  font-weight: bolder;
  width: 100%;
  text-align: center;
  font-size: 30px;
}
#containerImg p.haut {
  top: 0px;
  font-family: 'Anton', 'Impact' sans-serif;
}
#containerImg p.bas {
  bottom: -20px;
  font-family: 'Anton', 'Impact' sans-serif;
}
.test{
  border: 1px solid white;
}
.dom{
  margin-bottom: 5%;
}
#void{
  margin-top: 2%;
  margin-bottom: 20%;
}
input[type=color].form-control {
  padding: 0px;
}
.footer{
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 50px;
  display: flex;
  justify-content:center;
  background-color: grey;
  box-shadow: 0px 3px 6px black inset;
}
.footer  {
  padding-top: 0.8em;
  font-family: 'BioRhyme', serif;
}
.btn{
  font-size: 0.875em;
  font-weight: 400;
  font-family: 'BioRhyme', serif;
}
h5{
  font-weight: 700;
}
@media (min-width:420px) {
  .card-columns {
    column-count: 2;
  }
}
@media (min-width:768px) {
  .card-columns {
    column-count: 3;
  }
}
@media (min-width:992px) {
  .card-columns {
    column-count: 4;
  }
}
@media (min-width:1200px) {
  .card-columns {
    column-count: 5;
  }
}

@media (max-width: 480px) {
  h1{
    font-size:75%;
  }
  .footer{
    height: 1%;
    display: flex;
    justify-content: space-around;
  }
}
@media (max-width: 768px){
  header{
    justify-content: center;
    margin-bottom: 10%;
  }
  .header-img{
    width: 60%;
    height: auto;
    margin-left: 15%;
  }
  .btn-lg, .share{
    margin-top: 3%;
  }
  .share{
    margin-left: -25%;
  }
}
@media (max-width: 992px){
  .share{
    margin-top: 3%;
  }
}
.carousel-wrap {
  margin: 90px auto;
  padding: 0 5%;
  width: 80%;
  position: relative;
}

/* fix blank or flashing items on carousel */
.owl-carousel .item {
  position: relative;
  z-index: 100; 
  -webkit-backface-visibility: hidden; 
  display:block;
}
/* end fix */

.owl-nav > div {
  margin-top: -26px;
  position: absolute;
  top: 50%;
  color: #cdcbcd;
}
.owl-nav i {
  font-size: 52px;
}
.owl-nav .owl-prev {
  left: -30px;
}
.owl-nav .owl-next {
  right: -30px;
}