/* product placement */
a[href*="#prod_id_"],
.product-placed{
  display: inline-block;
  position: relative;
}
.product-placed .items-wrap{
    position: absolute;
    bottom: 100%;
    right: 0;
    display: block;
    opacity: 0;
    transform: scale(0);
    line-height: normal;
    text-align: left;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
    transform-origin: 100% 100%;
    z-index: 1000;    
    font-size: 12px;
    padding-bottom: 1em;
}
.product-placed .items-wrap:after{
    content: "";
    display: block;
    width: 2em;
    height: 2em;
    border-right: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    background: #fff;
    transform: rotate(45deg);
    transition: border-color 0.3s ease-in-out;    
    position: absolute;
    bottom: 0;
    right: 2em;
    margin-top: -0.5em;
    border-radius: 0 0 4px 0;
}
.product-placed .items-wrap-inner{
    color: #000;
    border: 1px solid #d8d8d8;
    background: #fff;
    padding: 2em;
    display: block;
    text-align: left;
    box-shadow: 0 0 4em 0 rgba(0,0,0,0.16);
    border-radius: 4px;
    transition: border-color 0.3s ease-in-out;
}
.product-placed .items-wrap:hover:after,
.product-placed .items-wrap:hover .items-wrap-inner{
    border-color: @maincolor;
}
.product-placed.hover .items-wrap{
  transform: scale(1);
  opacity: 1;
}
a.placed-item{
    color: @fontcolor;
}
.placed-item > .side-left{
    width: 75px;
    margin-right: 1em;
}
.placed-item > .side-right{
    width: 220px;
}
.placed-item > .side-right > *{
    display: block;
} 
.placed-item .item-row{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.placed-item .evaluation,
.placed-item .item-name{
    margin-bottom: 0.5em;
}
.placed-item .item-name{
    line-height: 1em;
    font-size: 1.2em;
}
.placed-item .evaluation:after{
    content: "";
    display: block;
    clear: both;
}
.placed-item .evaluation .votestars{
    float: left;
    margin: 0;
}
.placed-item .evaluation .votestars img[class*="star"]{
    width: 1.5em;
    height: 1.5em;
    background-size: contain;
    margin: 0;
}
.placed-item .item-price{
    font-size: 1.3em;
}
.placed-item .item-row ~ .item-price{
    margin-top: 0.5em;
}
.placed-item .item-price > *{
    display: block;
    text-align: right;
}
.placed-item .item-price em{
    font-weight: bold;
    color: @maincolor;
    font-style: normal;
}
.placed-item .item-price del{
    margin-left: 0.3em;
}
/* eof product placement */