I want move the opaque black mouse over hover tile in promoted links lower down as it is covering my images in the tile (user pictures).
Ideally I would like to increase the opacity so that only the text is seen and not the tile. Currently using CSS to style the tile so if it can be done with CSS then that would be great.
<style>
.ms-promlink-body {
max-width:100%;
}
.ms-promlink-headerNav {
display: none;
}
.ms-tileview-tile-content,.ms-tileview-tile-detailsBox, .ms-tileview-tile-content > a > div > span {
height:150px !important;
width:150px !important;
}
.ms-tileview-tile-content > a > div > img {
max-width:100%;
width:100% !important;
}
.ms-tileview-tile-content img {width: 160px; height: 160px;}
ul.ms-tileview-tile-detailsListMedium {
height:160px;
padding:0;
}
.ms-tileview-tile-titleTextMediumCollapsed{
filter: alpha(opacity=100);
opacity: 1;
color:#FFFFFF;
width: 150px;
height: 29px;
position: absolute;
top: 33px;
left: 0px;
padding: 0px 2px 2px;
font-size: 16px;
font-weight:bold !important;
line-height: 16px;
}
.ms-tileview-tile-descriptionMedium, .ms-tileview-tile-titleTextMediumExpanded {
font-size: 16px;
font-weight:bold !important;
}
</style>
