Slider shadow

Try to copy and paste this code:

.crellyslider-slider {
margin-bottom: 30px;
position: relative;
background-color: #ddd;
}

.crellyslider-slider:before,
.crellyslider-slider:after {
z-index: -1;
position: absolute;
content: “”;
bottom: 15px;
left: 10px;
width: 50%;
top: 80%;
max-width:300px;
background: rgba(0, 0, 0, 0.7);
-webkit-box-shadow: 0 15px 10px rgba(0,0,0, 0.4);
-moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.4);
box-shadow: 0 15px 10px rgba(0, 0, 0, 0.4);
-webkit-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
-o-transform: rotate(-3deg);
-ms-transform: rotate(-3deg);
transform: rotate(-3deg);
}

.crellyslider-slider:after {
-webkit-transform: rotate(3deg);
-moz-transform: rotate(3deg);
-o-transform: rotate(3deg);
-ms-transform: rotate(3deg);
transform: rotate(3deg);
right: 10px;
left: auto;
}

Hi,

Sorry for the very late feedback.

This works.

Thanks a lot!!!

Regards,
Christophe

Great slider! Love the element transitions and animation!

I just tried the above CSS to add a shadow below the slider, and it works great. My question is, that I see the box shadows between slide transitions, and it doesn’t look great. Is there a solution to that?

Just that the shadows add a bit more dpeth to the slider.

thanks!

Try to add this:
.crellyslider-slider { background-color: #fff; }

Thanks! Worked like a charm!

I had actually tried that before you responded, but had forgotten the # tag before the color. ;0p

Thanks again!