.progress {
    position:relative;
    width:100%;
    border-radius: 0;
}
.progress-bar {
    background-color: #5156be;
    width:0%;
    height: 13px;
    color: #fff;
    font-weight: bold;
}
.percent {
    position:absolute;
    display:inline-block;
    left:50%;
    color: #040608;
}

.img-thumb {
    display: block;
    height: 200px;
    width: 100%;
    overflow: hidden;
    background-color: #999;
}

.img-thumb img {
    width: 100%;
    height: 200px;
    object-fit: contain;
    padding: 10px;
}

.hover10 figure img {
	-webkit-filter: grayscale(0) blur(0);
	filter: grayscale(0) blur(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.hover10 figure:hover img {
	-webkit-filter: grayscale(100%) blur(3px);
	filter: grayscale(100%) blur(3px);
    cursor: pointer;
}

.content-details {
    position: absolute;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
    width: 100%;
    top: 50%;
    left: 50%;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
  }

.hover10:hover .content-details{
    top: 50%;
    left: 50%;
    opacity: 1;
}

.content-details a{
color: #e83e8c;
font-size: 1em;
font-weight: 500;
}

.fadeIn-bottom{
top: 84%;
}