.ngparaproslider { width: 100%; position: relative; } .ngparaproslider ul { margin: 0; padding: 0; display: block; list-style: none; overflow: hidden; width: 100%; position: relative; } .ngparaproslider ul > li { margin: 0; padding: 0; display: block; list-style: none; position: absolute; } .ngparaproslider ul > li > img { width: 100%; height: auto; user-select: none; } .ngparaproslider .ngparaproslidernext, .ngparaproslider .ngparaprosliderprev { z-index: 1; cursor: pointer; position: absolute; top: 0; } .ngparaproslider .ngparaproslidernext { right: 0; } .ngparaproslider .ngparaprosliderprev { left: 0; } .ngparaproslider .ngparaproslidernext > img, .ngparaproslider .ngparaprosliderprev > img { width: 40px; height: 40px; position: absolute; display: block; opacity: 0.8; transition: opacity 0.2s; user-select: none; } .ngparaproslider .ngparaproslidernext > img { left: 0; } .ngparaproslider .ngparaprosliderprev > img { right: 0; } .ngparaprosliderbullets { display: flex; justify-content: center; margin-top: 10px; } .ngparaprosliderbullets div { width: 20px; height: 20px; background-repeat: no-repeat; opacity: 0.3; transition: opacity 0.2s; } .ngparaprosliderbullets div.ngparaprosliderbulletcurrent { opacity: 0.8; } .ngparaproslidermore a { border-color: #ebebeb; border-width: 2px; border-style: solid; padding: 6px; background: #4d6f8b; font: 12px 'Roboto Slab',Verdana,Helvetica,sans-serif; color: #ffffff; letter-spacing: 0px; box-shadow: 2px 2px 5px rgba(0,0,0,0.6); border-radius: 6px; display: inline-block; cursor: pointer; float: right; -webkit-appearance: none; margin-top: 20px; text-decoration: none; } .ngparaproslidermore:after { content: ""; display: table; clear: both; } .ngparaproslidermore a:hover { border-color: #afafaf; background: #4d6f8b; font-weight: normal; font-style: normal; text-transform: none; color: #ffffff; text-decoration: none; }