.rotator {
	
	position: relative;
	margin: auto !important;
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none;   /* Chrome/Safari/Opera */
	-khtml-user-select: none;    /* Konqueror */
	-moz-user-select: none;      /* Firefox */
	-ms-user-select: none;       /* IE/Edge */
	user-select: none;
	width: 800px;
	max-width: 90%;
}

.rotator .carousel {
	
	position: relative;
	z-index: 2;
	overflow: hidden;
	background-color: white;
}

.rotator .carousel .carousel-inner {
	
	margin: auto;
}

.rotator .left-button {
	
	width: 28px;
    height: 48px;
    position: absolute;
    bottom: 25%;
    left: -23px;
    background-color: white;
    border: 1px solid lightgrey;
    border-radius: 1px;
    box-shadow: 2px 2px 3px grey;
    background-image: url('/support/videolibrary/images/arrow-left.png');
    background-size: 24px 24px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    z-index: 1;
}

.rotator .left-button:hover {
	
	z-index: 4;
}

.rotator .right-button {
	
	width: 28px;
    height: 48px;
    position: absolute;
    bottom: 25%;
    right: -23px;
    background-color: white;
    border: 1px solid lightgrey;
    border-radius: 1px;
    box-shadow: 2px 2px 3px grey;
    background-image: url('/support/videolibrary/images/arrow-right.png');
    background-size: 24px 24px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    z-index: 1;
}

.rotator .right-button:hover {
	
	z-index: 4;
}

.rotator .thumb {
	
	width: 150px;
	max-width: 150px;
	margin: 1em;
}

/**
	MEDIA QUERIES
*/
@media all and (max-width: 650px) {
	
	.rotator .carousel {
	
		overflow: scroll;
	}
	
	.rotator .left-button, .rotator .right-button {
		
		display: none !important;
	}
}