.image-gallery {
    position: relative;
}

.image-content {
    display: none;
    opacity: 0;
    transition: opacity 0.5s;
}

.image-content.active {
    display: block;
    opacity: 1;
}

.arrow {
    position: absolute;
    bottom: 30%;
    transform: translateY(-50%);
    cursor: pointer;
	border:none;
	color:white;
	padding: 20px 10px;
	background:#808080a1;
	
}

.left-arrow {
    left: 0px;
}

.right-arrow {
    right: 0px;
}
/* Befintliga stilar här... */

/* Stilar för övergångseffekter */
.image-content.slide-out-left {
    animation: slideOutLeft 0.5s forwards;
}

.image-content.slide-in-right {
    animation: slideInRight 0.5s forwards;
}

@keyframes slideOutLeft {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}

@keyframes slideInRight {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}
.image-gallery {
    overflow: hidden; /* Förhindrar scrollbars när bilder animeras */
}
@media screen and (max-width: 768px) {
    .image-gallery {
  /*   border-bottom: 1px solid #c48e255e;*/

    }  }

	
/* Som standard, visa båda bilderna */
.hide-on-web, .hide-on-mobile, .hide-on-webbr {
    display: block;
}

/* Göm .hide-on-web på mobila enheter */
@media (max-width: 768px) {
    .hide-on-web {
        display: none;
    }
	
   .hide-on-webbr {
        display: none;
    }
}

/* Göm .hide-on-mobile på skrivbord/webb */
@media (min-width: 769px) {
    .hide-on-mobile {
        display: none;
    }
}