.top-slider, .top-slider * { box-sizing: border-box; } .prology-slider { position: relative; width: 100%; max-height: unset!important; padding: 0; margin: 30px auto !important; overflow: hidden; } @media only screen and (max-width: 768px) { .prology-slider { margin-top:15px } } .prology-slider-items { position: relative; overflow: hidden; padding-bottom: 28.25%; width: 100%; height: 0; margin: 0; } .prology-slider-item { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: opacity .6s ease-in-out; overflow: hidden; margin: 0; } .prology-slider-item .prology-banner, .prology-slider-item .prology-banner > a { width: 100%; height: 100%; } .prology-slider-item.current { opacity: 1; z-index: 1 } .prology-slider-item img { width: 100%; height: 100%; object-fit: cover; border-radius: 30px } .prology-slider .divider-underline { display: none } @media only screen and (max-width: 768px) { .prology-slider-item img { border-radius:20px } } .prology-slider .buttons .button { position: absolute; z-index: 1; top: 50%; transform: translateY(-50%); } .prology-slider .buttons .prev { left: 10px } .prology-slider .buttons .next { right: 10px } .prology-slider .button { width: 32px; height: 32px; border: none; outline: none; padding: 0; background: transparent center no-repeat; cursor: pointer; opacity: .4 } .prology-slider .button:hover { opacity: .8 } .prology-slider .dots { position: absolute; bottom: 20px; left: 0; width: 100%; display: flex; justify-content: center; margin-top: 10px; z-index: 1 } @media only screen and (max-width: 768px) { .prology-slider .dots { display: none; } } .prology-slider .dot { display: block; width: 20px; height: 20px; border-radius: 50%; border: none; outline: none; padding: 0; background: #d9d9d9; cursor: pointer; opacity: 1; transition: opacity .4s ease-in-out; box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.25); } .prology-slider .dot:nth-child(n+2) { margin-left: 5px } .prology-slider .dot.current { opacity: 1; background: #56CCF2; }