
#listedItems {
    padding: 0px;
    margin: 0px;
}
#listedItems li {
    display: inline-block;
    margin: 0px;
    padding: 0px;
    width: 20rem;
    vertical-align: top;
    background: rgba(40, 40, 40, 0.25);
    margin-left: 1px;
    min-width: 250px;
    margin: 1em 0.5em;
    border-radius: 1em;
}
#listedItems li :hover .listingContainer {
    background: rgba(10, 0, 100, 0.1);
    -webkit-animation: fadeinout 0.2s linear forwards;
    animation: fadeinout 0.2s linear forwards;
}
@-webkit-keyframes fadeinout {
    100% { background: rgba(10, 0, 100, 0.1); }
    0% { background: rgba(10, 0, 100, 0); }
}
  
@keyframes fadeinout {
    100% { background: rgba(10, 0, 100, 0.1); }
    0% { background: rgba(10, 0, 100, 0); }
}
.listingContainer {
    padding: 0px 0px;
    text-shadow: none;
}
.listingImage {
    width: 100%;
    height: 16rem;
    object-fit: cover;
    border-radius: 1em 1em 0em 0em;
}
.listingImageWrapper {
    text-align: center;
    height: 12rem !important;
    background-size: cover;
    background-position: center;
}
.listingInfo {
    vertical-align: top;
    margin: 0px;
    display: inline-block;
    font-size: 14px;
    width: 100%;
}
.listingTitle {
    color: rgba(255, 255, 255, 0.9);
    font-weight: 400;
    font-size: 1.3em;
    background: rgba(128, 128, 128, 0.1);
    height: 42px;
    padding: 5px 6px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.listingTitle a {
    color: rgba(255, 255, 255, 0.4) !important;
}
.listingPrice {
    color: #0FC;
    padding: 0.25em 0.5em;
    border-color: #0FC;
    width: fit-content;
    display: inline-block;
}
.listingPrice i {
    text-decoration: none;
    font-style: normal;
    font-size: 12px;
    color: #666666;
}
.listingDescription {
    padding: 0em 1em;
    color: rgba(255, 255, 255, 0.3);
    height: 250px;
    /** overflow-y: scroll; **/
    overflow: hidden;
    font-weight: 400 !important;
}
.listingDescription i {
    color: #00b8e6;
    margin: 4px 0px;
    margin-right: 0.5em !important;
}
.listingShipping {
    font-size: 12px;
}
.listingInfoBarText {
    text-align: left;
    font-size: 20px;
}
.listingTag {
    display: inline-block;
    color: #000000;
    background: rgba(160, 160, 160, 0.9);
    width: fit-content;
    text-shadow: none;
    font-size: 14px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 15px;
    margin: 10px 0px 10px 10px;
}
.listingInquiryButton, .listingPurchaseButton {
    color: rgba(255, 255, 255, 0.3) !important;
    width: auto;
    float: right;
    padding: 0.25em 0.5em;
    border-radius: 4em;
    margin: 0.5em;
    border: 2px solid rgba(255, 255, 255, 0.2);
}
.listingInquiryButton:hover, .listingPurchaseButton:hover {
    color: #FFFFFF;
    background: #004488;
}
.listingPrice, .listingInquiryButton {
    border-radius: 4em;
    margin: 0.5em;
    border: 2px solid;
}
.listingFadeEffect {
    width: 100%;
    height: 14em;
    background: linear-gradient(transparent, transparent, black);
    margin-top: -14em;
    z-index: 100;
    position: relative;
}


/** Mobile **/
@media all and (min-width: 800px) and (orientation: portrait) 
{
    .listingDescription i {
        margin-right: 1em !important;
    }
    .listingPrice, .listingInquiryButton {
        border-radius: 4em;
        margin: 0.5em;
        border: 0.1em solid;
        padding: 0.25em 0.5em;
        font-size: 2.5em !important;
    }
    .listingImageWrapper {
        height: 30em !important;
    }
}