.rotating-slider-container { 
 width: 100%;
 height: 500px;
 margin: 20px 0;
 overflow: hidden;
}
.rotating-slider{
 margin: 40px auto 0 auto;
 position: relative;
}
.rotating-slider ul.direction-controls {
 list-style: none;
 margin: 0;
 padding: 0;
 position: absolute;
 bottom: -90px;
 display: flex;
 width: 100%;
 justify-content: center;
}
.rotating-slider ul.direction-controls li button{
 background: rgba(51, 122, 183, 0.8);
 border: none;
 outline: none;
 color: white;
 cursor: pointer;
 font-size: 40px;
 font-weight: bold;
 height: 60px;
 width: 60px;
 padding-bottom: 6px;
 text-align: center;
 transition: background 0.35s;
}
.rotating-slider ul.direction-controls li button:hover{
 background: rgba(51, 122, 183, 1);
}
.rotating-slider ul.direction-controls li.left-arrow button{
 border-radius: 100% 0 0 100%;
}
.rotating-slider ul.direction-controls li.right-arrow button{
 border-radius: 0 100% 100% 0;
}
.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%;
 text-shadow: 0 0 12px rgba(0,0,0,0.5), 0 2px 6px rgba(0,0,0,0.7); 
 color: #FFF;
 font-family: Verdana, sans-serif; 
 font-weight: bold; 
}
.rotating-slider ul.slides .slide-inner {
 position: absolute;
 bottom: 80px;
 right: 190px;
}
.rotating-slider ul.slides .slide-inner div {
 font-size: 36px;
 text-transform: uppercase;
}
.rotating-slider ul.slides .slide-inner p {
 font-size: 22px;
 margin-top: 10px;
}
.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%;
 box-sizing: content-box; 
}