Would like to change the slider settings text to pop-up

I would like to change the slider settings sales details to the following:

I would like the slider description only and the buy now button only to show. I would also like the background of the description to be transparent and description text color to be black. The "buy now" button I would like to be the light pink color which matches footer, etc and this color is: rgb(176, 122, 131 (I think).

I would like the slider description and buy now button to not show all the time, but only when the person hovers over the slider, then the description and buy now will pop up.

Thank you for your help. Your support is the most amazing support I have seen yet. It is greatly appreciated.

 

Hello,

Please paste the code given below in Custom CSS section
(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

.salesdetails h1 {
display: none !important;
}
.salesdetails p {
background: rgba(144, 129, 129, 0.42);
color:black;
}
.salesdetails .salesbutton {
background: #e43750;
border-radius: 5px;
}
.salesdetails p {
display: none !important;
}
.salesdetails .salesbutton {
display: none !important;
}
.sl-slides-wrapper:hover .salesdetails p , .sl-slides-wrapper:hover .salesdetails .salesbutton  {
display:block !important;
}

Thanks,
Praveen

 

That works wonderfully except the product description text block is too long. It doesn't adjust according to the size of the text and the text is not centered within that space. Can you help with that? Thank you.

 

Hello,

Please paste the code given below in Custom CSS section
(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

.salesdetails p {
text-align: center !important;
}

Thanks,
Praveen