• Resolved SFIQUET

    (@sfiquet)


    How to add shadow effect to the slider on Customizr theme ?
    I’ve found the css code below but dont know how to apply it to the slider.

    .box {
      position: relative;
      width: 400px;
      height: 300px;
      background-color: #fff;
      box-shadow: 0 1px 5px rgba(0,0,0,0.25), 0 0 50px rgba(0,0,0,0.1) inset;
      border-radius: 0%     0%     25%     25% /     0%     0%     3%     3%;
    }
    .box:before {
        content: '';
        position: absolute;
        z-index: -1;
        bottom: 15px;
        left: 10px;
        width: 50%;
        height: 20%;
        box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
        -webkit-transform: rotate(-3deg) skew(-0deg);
         -moz-transform: rotate(-3deg) skew(-0deg);
         -ms-transform: rotate(-3deg) skew(-0deg);
         -o-transform: rotate(-3deg) skew(-0deg);
         transform: rotate(-3deg) skew(-0deg);
        }
    .box:after {
        content: '';
        position: absolute;
        z-index: -1;
        bottom: 15px;
        right: 10px;
        width: 50%;
        height: 20%;
        box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
        -webkit-transform: rotate(3deg) skew(0deg);
         -moz-transform: rotate(3deg) skew(0deg);
         -ms-transform: rotate(3deg) skew(0deg);
         -o-transform: rotate(3deg) skew(0deg);
         transform: rotate(3deg) skew(0deg);
        }

Viewing 5 replies - 1 through 5 (of 5 total)
Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘how to add shadow effet to the slider – theme Customizr’ is closed to new replies.