.rotating-slider{
margin: 20px auto;
height: 160px;
position: relative;
width: 280px;
}
.rotating-slider ul.direction-controls{
list-style: none;
margin: 0;
padding: 0;
}
.rotating-slider ul.direction-controls li.left-arrow{
position: absolute;
    top: 50%;
    right: 100%;
transform: translateY(-50%);
}
.rotating-slider ul.direction-controls li.right-arrow{
position: absolute;
    top: 50%;
    left: 100%;
transform: translateY(-50%);
}
.rotating-slider ul.direction-controls li button{
background: rgba(0,0,0,0.2);
border: none;
color: white;
cursor: pointer;
font-size: 1.5em;
font-weight: bold;
height: 1.5em;
line-height: 1.5em;
padding: 0;
text-align: center;
transition: background 0.25s;
width: 1.5em;
}
.rotating-slider ul.direction-controls li button:hover{
background: rgba(0,0,0,0.6);
}
.rotating-slider ul.slides{
border-radius: 50%;
height: 100%;
margin: 0;
overflow: hidden;
padding: 0;
position: relative;
    top: 0;
    left: 50%;
transform: translateX(-50%) rotate(0);
transform-origin: center center;
width: 100%;
}
.rotating-slider ul.slides li{
background-color: #ecf0f1;
background-position: center;
background-size: cover;
display: block;
list-style: none;
position: absolute;
top: 0;
left: 50%;
text-align: center;
transform-origin: bottom center;
width: 100%;
}