.ism-slider > ol, .ism-slider > ol > li, .ism-slider > ol > li > img {
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

.ism-slider {
    overflow: hidden;
    position: relative;
    padding: 0 !important;
    -webkit-user-select: none;
    user-select: none;
    cursor: default;
    z-index: 2;
    background-color: rgba(0, 0, 0, 0.1);
    -webkit-animation: ism-fadein 3s;
    background-clip: padding-box;
}

@-webkit-keyframes ism-fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

#my-slider {
    width: 100%;
    margin: 0;
    padding: 0;
    border-radius: 0;
    position: relative;
}

#my-slider:before {
    content: '';
    display: block;
    padding-top: 75%;
}

#my-slider .ism-frame {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
}

#my-slider .ism-button {
    display: block;
    border-radius: 25px;
    width: 50px;
    height: 50px;
    background-size: 16px 16px;
    top: 50%;
    margin-top: -25px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.3);
    visibility: visible;
}

#my-slider .ism-button-prev {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABABAMAAABYR2ztAAAAIVBMVEX///////////9/gMdvAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAAAuUAAALlARv+XnsAAABUSURBVEjH7dYxCgAgEAPB8weX/39WFBtBbsFSY2sYyzXicDLq0wQDKQGQAKiJAZTEvC+IRgPBYAEyYOB1AAf4hAkTXxB5nySOGmaRw4pp5rhv34MOQwscJ7/MrxQAAAAASUVORK5CYII=);
    left: 10px;
}

#my-slider .ism-button-next {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABABAMAAABYR2ztAAAAIVBMVEX///////////9/gMdvAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAAAuUAAALlARv+XnsAAABYSURBVEjH7dYxDoAwDEPR5Ab1/S8LVEgsyL8SG3XWWK/dnKpnumA0/L4lAOSJE/DEtXfEBBxxBwYFBH8IEWJbggL4RIAAPwFWC+VDqXEtYrFyNWO5v58HB4q9HAkl7KTYAAAAAElFTkSuQmCC);
    right: 10px;
}

#my-slider .ism-pause-button {
    width: 50px;
    height: 50px;
    background-size: 16px 16px;
    top: 50%;
    margin-top: -25px;
    border-radius: 25px;
    margin-left: -25px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.3);
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAc0lEQVR42u3SsQkAIAxFQeP+O38XsBKxMPfKgCQcjqHe1W6YJFeXVNXJuxd3zO4/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAID0RwuEoAh40yYcSQAAAABJRU5ErkJggg==);
}

#my-slider .ism-button:hover,
#my-slider .ism-pause-button:hover {
    background-color: rgba(0, 0, 0, 0.6);
}

#my-slider .ism-radios {
    display: block;
    height: 20px;
    text-align: center;
}

#my-slider .ism-radios label {
    width: 20px;
    height: 20px;
    border-radius: 3px;
    color: #000;
    background-color: rgba(255, 255, 255, 0.5);
}

#my-slider .ism-radios li.active label {
    background-color: rgba(255, 255, 255, 1.0);
}

#my-slider .ism-radios label:hover {
    background-color: rgba(255, 255, 255, 0.8);
}

#my-slider .ism-slide-0 .ism-caption-0 {
    font-size: 1.25em;
    font-family: sans-serif;
    position: absolute;
    top: 10%;
    left: 5%;
    border-radius: 4px;
    border: none;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.40);
}

/* Buang sebarang padding/margin global */
body, html {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
