.open-modal-slide { cursor: pointer}
.modal {display: none;position: fixed;  left: 0;top: 0;z-index: 1000;inset: 0;background-color: rgba(0,0,0,0.9);width: 100%}
.modal-content {background-color: rgba(0,0,0,0.9);margin: 0 auto;max-width: 1000px;min-height: 100vh;}
.close { position: absolute;top: 10px;right: 15px;background: rgba(0,0,0,0.9);color: #fff;border: none;padding: 8px 12px;cursor: pointer;font-size: 20px;z-index: 9999999}
.slides {position: relative;}
.slide {display: none;}
.slide.active {display: block;}
.slide img {width: 100%;height: auto;display: block;object-fit: cover;}
.slider-btn {position: absolute;top: 50%;transform: translateY(-50%);background: rgba(0,0,0,0.9);color: #fff;border: none;padding: 8px 12px;cursor: pointer;font-size: 30px;}
.slider-btn.prev { left: 10px; z-index: 9999999999 }
.slider-btn.next { right: 10px; z-index: 9999999999 }		
@media screen and (max-width: 600px) {
.modal {background-color: #e5e1de;width: 100%}
.modal-content {background-color: #e5e1de;margin: 30% 5px 0 5px;}
.slider-btn {position: absolute;top: 55%;transform: translateY(-50%);background: rgba(0,0,0,0);color: #000000;border: none; cursor: pointer;font-size: 30px;}
.slider-btn.prev { left: 0; box-sizing: border-box;padding: 90% 35% 70% 10%; z-index: 9999999999 }
.slider-btn.next { right: 0; box-sizing: border-box;padding: 90% 10% 70% 35%; z-index: 9999999999 }
.close { position: absolute;top: 15px;right: 11%;background: rgba(0,0,0,0);color: #000000;border: none;box-sizing: border-box;padding: 8px 12px;cursor: pointer;font-size: 30px;z-index: 9999999}
}