#make-3D-space{
    position: relative;
    perspective: 800px;
    width:90%;
    height:500px;
    transform-style: preserve-3d;
    transition: transform 5s;
    margin-top: 5vh;
}

#product-card{
    width:100%;
    height:490px;
    position:absolute;
    top:10px;
    left:10px;
    text-align: center;
    box-shadow: 5px 10px 18px #888888;
    cursor: pointer;
    background-color: #f8f8f8;
    overflow:hidden;
    transform-style: preserve-3d;
    -webkit-transition:  100ms ease-out;
       -moz-transition:  100ms ease-out;
         -o-transition:  100ms ease-out;
            transition:  100ms ease-out;
}

#product-card.animate{
  height:500px;
    -webkit-transition:  100ms ease-out;
       -moz-transition:  100ms ease-out;
         -o-transition:  100ms ease-out;
            transition:  100ms ease-out;
}
.stats-container{
    background: rgba(192, 223, 229, 0.6);
    position:absolute;
    top:60%;
    left:0;
    width:100%;
    height:100%;
    padding:27px 35px 35px;
    overflow: hidden;
    text-align: center;
}

#product-card.animate .stats-container{
    top:0%;
    -webkit-transition: all 500ms ease-out;
       -moz-transition: all 500ms ease-out;
         -o-transition: all 500ms ease-out;
            transition: all 500ms ease-out;
}

.stats-container .product_name{
    font-size:22px;
    color:#393c45;
}
.stats-container p{
    font-size:16px;
    color: black;
    padding:2px 0 20px 0;
}
.stats-container .product_price{
    float:right;
    color:#48cfad;
    font-size:22px;
    font-weight:600;
}
.image_overlay{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    opacity:0;
}
#product-card.animate .image_overlay{
    opacity:0.7;
    -webkit-transition: all 500ms ease-out;
       -moz-transition: all 500ms ease-out;
         -o-transition: all 500ms ease-out;
            transition: all 500ms ease-out;
}

.logo-marque {
 background-color: white;
 height:256px;
 border-radius: 4px;
 padding: 2vh 1vh 3vh ;
/* margin: 2vh 1vh;*/
 overflow: scroll;
}

.logo-marque img {
  margin: 1vh;
}

.container-marque {
  position: absolute;
  top: 30%;
  left: 2vh;
  right: 2vh;
}