.skitter{position:relative;max-width:800px;height:150px;background:transparent}.skitter.with-dots{margin-bottom:60px}.skitter.with-thumbs{margin-bottom:60px}.skitter>a img,.skitter>img{max-width:none}.skitter ul{display:none}.skitter .container_skitter{overflow:hidden;position:relative}.skitter .container_skitter .image_main{width:100%}.skitter .image{overflow:hidden}.skitter .image>a img,.skitter .image>img{width:100%;display:none}.skitter .box_clone{position:absolute;top:0;left:0;width:100px;overflow:hidden;display:none;z-index:20}.skitter .box_clone img{position:absolute;top:0;left:0;z-index:20}.skitter .prev_button{position:absolute;top:50%;left:35px;transform:translateY(-50%);z-index:152;width:42px;height:42px;overflow:hidden;text-indent:-9999em;transition:all 0.2s}.skitter .next_button{position:absolute;top:50%;right:35px;transform:translateY(-50%);z-index:152;width:42px;height:42px;overflow:hidden;text-indent:-9999em;transition:all 0.2s}.skitter .prev_button:hover,.skitter .next_button:hover{opacity:0.5}.skitter .info_slide{position:absolute;top:15px;left:15px;z-index:100;background-color:#000;color:#fff;font:bold 11px arial;padding:5px 0 5px 5px;border-radius:5px;opacity:0.75}.skitter .info_slide .image_number{background-color:#333;float:left;padding:2px 10px;margin:0 5px 0 0;cursor:pointer;border-radius:2px;transition:all 0.2s}.skitter .info_slide .image_number:hover{background-color:#000}.skitter .info_slide .image_number.image_number_select{background-color:#ccc;color:black}.skitter .container_thumbs{position:relative;overflow:hidden;height:50px}.skitter .info_slide_thumb{height:50px;border-radius:0;overflow:hidden;top:auto;top:0;left:0;padding:0;opacity:1.0}.skitter .info_slide_thumb .image_number{overflow:hidden;width:100px;height:50px;position:relative;margin:0;padding:0;border-radius:0;background-size:cover;background-position:center center}.skitter .info_slide_thumb .image_number.image_number_select{opacity:.4}.skitter .box_scroll_thumbs{padding:0}.skitter .box_scroll_thumbs .scroll_thumbs{position:absolute;bottom:60px;left:50px;background-color:#ccc;width:200px;height:10px;overflow:hidden;text-indent:-9999em;z-index:101;cursor:pointer;border:0px solid #333}.skitter .info_slide_dots{position:absolute;bottom:-40px;z-index:151;padding:5px 0 5px 5px;border-radius:50px}.skitter .info_slide_dots .image_number{background-color:#999;float:left;margin:0 5px 0 0;cursor:pointer;border-radius:50px;width:14px;height:14px;text-indent:-9999em;overflow:hidden;transition:all 0.2s}.skitter .info_slide_dots .image_number:hover{background-color:#777}.skitter .info_slide_dots .image_number.image_number_select{background-color:#222}.loading{position:absolute;top:50%;right:50%;z-index:10000;margin:-16px -16px;color:#fff;text-indent:-9999em;overflow:hidden;width:32px;height:32px}.label_skitter{z-index:150;position:absolute;bottom:0px;left:0px;display:none;z-index:150;position:absolute;bottom:0px;left:0px;display:none;background:linear-gradient(transparent, #000);width:100%}.label_skitter p{color:#fff;padding:10px;margin:0;font-size:14px}.progressbar{background-color:#000;position:absolute;top:5px;left:15px;height:5px;width:200px;z-index:99;border-radius:20px}

/* Custom progress strip container below slider */
  .slider-progress-container {
      width: 100%;
      height: 4px;
      background: rgba(255, 255, 255, 0.2);
      border-radius: 0;
      overflow: hidden;
    position: relative;
}

/* Custom green progress strip */
.slider-progress-strip {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #28a745, #20c997);
    border-radius: 0;
    transition: width 0.1s ease;
    animation: fillProgress 3s linear infinite;
}

@keyframes fillProgress {
    0% {
        width: 0%;
    }
    99% {
        width: 100%;
    }
    100% {
        width: 100%;
    }
}

/* Hide default Skitter progressbar */
.skitter-large .progressbar {
    display: none !important;
}

/* Ensure ALL slider images fit width properly */
.skitter img, .skitter-large img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
}

/* Remove any overlay or loading effects on first image */
.skitter .image_main,
.skitter-large .image_main {
    display: block !important;
    opacity: 1 !important;
}

/* Ensure container has no dark background */
.skitter .container_skitter,
.skitter-large .container_skitter {
    background: transparent !important;
}

.preview_slide{display:none;position:absolute;z-index:152;bottom:30px;left:-40px;width:100px;height:100px;background-color:#fff;border:1px solid #222;box-shadow:rgba(0,0,0,0.7) 2px 2px 5px;overflow:hidden}
