html {
    background-color: black;
}

body{
    display: block;
    color: white;
    font-family:Arial, Helvetica, sans-serif;

}

a {
    color: inherit;
    text-decoration: none;
}

.centered {
    justify-self: center;
    display: flex;
}

.hcontainer {
    width: 90%;
    justify-self: center;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
}

.belt-item {
    cursor: pointer;
    display: inline-block;
    width: 400px;
}

.belt-item:hover .belt-item-description {
    visibility: visible;
    opacity: 1;
}

.belt-item:hover .belt-item-image {
   transform: scale(1.1);
}

.belt-item-image {
    transition: transform 0.7s ease-out;
    margin-left: 40px;
}

.belt-item-description {
    padding-top: 5px;
    padding-left: 50px;
    padding-right: 50px;
    padding-bottom: 20px;
    justify-self: center;
    visibility: hidden;
    z-index: 1;
    opacity: 0;
    transition: opacity .6s;
}