*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	outline: none;
	box-sizing: border-box;
}

.container-gallery {
	margin: 0 auto;
	max-width: 100%;
	max-height: 100vh;
	background-color: white;
	margin-left:0px;
	margin-right:0px;
}


/* Useful Classes */
.xy-center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.transition-gallery {
	transition: all 350ms ease-in-out;
}

.r-3-2 {
	width: 100%;
	padding-bottom: 66.667%;
	background-color: #ddd;
}

.image-holder {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

/* Main Styles */
.gallery-wrapper {
	position: relative;
	overflow: hidden;
	max-width:100%;
	
    padding-bottom: -10px !important;
    margin-top: -16px;
	
}

.gallery {
	position: relative;
	white-space: nowrap;
	font-size: 0;
	width: 100%; 
	margin-bottom: -5px;
}

.item-wrapper {
	cursor: pointer;
	width: 23%; /* arbitrary value */
	display: inline-block;
	background-color: white;
}

.gallery-item { opacity: 0.5; }
.gallery-item.active { opacity: 1; }

.controls-gallery {
	font-size: 0;
	border-top: none;
	
    max-width: 100%;
    margin-top: -5px;
	
}
.move-btn-gallery {
	display: inline-block;
	width: 50%;
	border: none;
  color: #ccc;
	background-color: transparent;
	padding: 0.2em 1.5em;
}
.move-btn-gallery:first-child {border-right: none;}
.move-btn-gallery.left  { cursor: w-resize; }
.move-btn-gallery.right { cursor: e-resize; }