:root{--maincolor:red;--bordercl:rebeccapurple;--callouctcolor:dodgerblue;--hovercolor:navy;--darkMaincolor:#50fa7b}.image-gallery{position:relative;max-width:100%;margin:20px auto;overflow:hidden}.gallery-slider{width:100%;position:relative}.slide{display:none;width:100%}.slide.active{display:block}.slide img{width:100%;height:auto;display:block;border:none}.gallery-navigation{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.prev-slide,.next-slide{position:absolute;top:50%;transform:translateY(-50%);color:var(--darkMaincolor);font-size:24px;font-weight:700;padding:16px;background-color:rgba(0,0,0,.3);cursor:pointer;pointer-events:auto;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.prev-slide:hover,.next-slide:hover{background-color:rgba(0,0,0,.6)}.prev-slide{left:10px}.next-slide{right:10px}.gallery-indicator{text-align:center;margin-top:10px}.dot{height:10px;width:10px;margin:0 5px;background-color:#555;border-radius:50%;display:inline-block;transition:background-color .3s ease;cursor:pointer}.dot.active{background-color:var(--darkMaincolor)}.slide-caption{padding:10px;background-color:rgba(0,0,0,.7);color:#fff;text-align:center;position:absolute;bottom:0;left:0;right:0}@media(max-width:768px){.prev-slide,.next-slide{font-size:18px;padding:12px}}