@import url('https://fonts.googleapis.com/css?family=Open+Sans|Roboto');

body {
    color: #4f4f5a;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    padding: 0;
    margin: 0;
}

#slider-wrap{ 
    max-width:970px;
    margin: 0 auto;
    margin-bottom: 20px;
}

#active-slide {
    width: 100%;
    position: relative;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

#slider{
    margin: 0;
    padding: 0;
    -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
    -webkit-transition-timing-function: ease-in-out;
    -o-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out;
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
}

.slide{
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative;
	transition-property: transform;
}

.slide img {
    max-width:100%;
}

.Radio-But{
    margin-top:10px;
    text-align:center;
}

.Radio-But .ctrl-select {
    margin:2px;
    display:inline-block;
    width:16px;
    height:16px;
    overflow:hidden;
   text-indent:-9999px;
    background:url(radioBg.png) center bottom no-repeat;
}

.Radio-But .ctrl-select:hover {
    cursor:pointer;
    background-position:center center;
}

.Radio-But .ctrl-select.active {
    background-position:center top;
}

#prewbutton, #nextbutton {
    display:block;
    width:40px;
    height:40px;
    position:absolute;
    top:50%;
	margin-top: -20px;
    overflow:hidden;
   text-indent:-999px;
    background: url("arrowBg.png") left center no-repeat;
    opacity:0.5;
    z-index:3;
    outline:none !important;
}

#prewbutton {
    left:10px;
}

#nextbutton {
    right:10px;
    background:url(arrowBg.png) right center no-repeat;
}

#prewbutton:hover, #nextbutton:hover {
    opacity:1;
}