.ngparaeditableslider-bar { display: flex; justify-content: flex-end; gap: 12px; flex-wrap: wrap; margin: 24px 0; } .ngparaeditableslider form { display: block; margin: 24px 0; width: 100%; box-sizing: border-box; } .ngparaeditableslider button, .ngparaeditableslider input[type=submit] { border-color: #ffffff; border-width: 0px; border-style: solid; padding: 10px 20px 10px 20px; background: #2145aa; font: 15px Raleway,Verdana,Helvetica,sans-serif; color: #ffffff; letter-spacing: 0px; text-transform: uppercase; border-radius: 10px; cursor: pointer; } .ngparaeditableslider button:focus-visible, .ngparaeditableslider input[type=submit]:focus-visible { border-color: #ffffff; background: #2145aa; font-weight: normal; font-style: normal; text-transform: uppercase; color: #ffffff; outline: none; } .ngparaeditableslider button:hover:enabled, .ngparaeditableslider input[type=submit]:hover:enabled, .ngparaeditableslider input[type=file]:enabled::file-selector-button:hover { border-color: #444444; background: #444444; font-weight: normal; font-style: normal; text-transform: uppercase; color: #ffffff; } .ngparaeditableslider label { font: 15px Raleway,Verdana,Helvetica,sans-serif; color: #174769; letter-spacing: 0px; display: block; margin: 0 0 6px 0; box-sizing: border-box; } .ngparaeditableslider input { -webkit-appearance: none; } .ngparaeditableslider input[type=text], .ngparaeditableslider input[type=file] { border-color: #dae5ed; border-width: 1px; border-style: solid; padding: 6px 12px 6px 12px; background: #ffffff; font: 15px Raleway,Verdana,Helvetica,sans-serif; color: #323232; letter-spacing: 0px; border-radius: 0px; display: block; width: 100%; margin: 0 0 12px 0; box-sizing: border-box; } .ngparaeditableslider input[type=file] { padding: 6px; } .ngparaeditableslider input[type=text]:focus-visible { border-color: #dae5ed; background: #ffffff; } .ngparaeditableslider input[type=file]::file-selector-button { border-color: #ffffff; border-width: 0px; border-style: solid; padding: 10px 20px 10px 20px; background: #2145aa; font: 15px Raleway,Verdana,Helvetica,sans-serif; color: #ffffff; letter-spacing: 0px; text-transform: uppercase; border-radius: 10px; cursor: pointer; margin: 0 12px 0 0; } .ngparaeditableslider input[type=file]:focus-visible::file-selector-button { border-color: #ffffff; background: #2145aa; font-weight: normal; font-style: normal; text-transform: uppercase; color: #ffffff; outline: none; } .ngparaeditableslider button:disabled, .ngparaeditableslider input[type=submit]:disabled, .ngparaeditableslider input[type=file]:disabled::file-selector-button { opacity: 0.8; cursor: wait; } .ngparaeditableslider button.ngparaeditableslider-move { display: flex; justify-content: center; align-items: center; } .ngparaeditableslider-content { position: relative; box-shadow: var(--ngparaeditableslider-shadow, none); border-radius: var(--ngparaeditableslider-roundedcorners, 0); overflow: hidden; background-color: #000000; } .ngparaeditableslider-stage { overflow-x: scroll; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; width: 100%; } .ngparaeditableslider-stage::-webkit-scrollbar { display: none; } .ngparaeditableslider-container { display: flex; margin: 0; padding: 0; } .ngparaeditableslider-container li { flex-shrink: 0; width: 100%; display: block; margin: 0; padding: 0; position: relative; scroll-snap-align: start ; height: 0; } .ngparaeditableslider-container img { width: 100%; height: 100%; display: block; margin: 0; padding: 0; object-fit: cover; top: 0; left: 0; position: absolute; background-color: #000000; } .ngparaeditableslider-caption { text-align: center; position: absolute; width: 100%; color: var(--ngparaeditableslider-captioncolor, #ffffff); font-weight: var(--ngparaeditableslider-captionweight, bold); text-transform: var(--ngparaeditableslider-captiontexttransform, none); font-size: var(--ngparaeditableslider-captionsize, 16px); text-shadow: 0 0 2px rgba(0,0,0,0.75); pointer-events: none; } .ngparaeditableslider-caption-top { top: 15px; } .ngparaeditableslider-caption-bottom { bottom: 15px; } .ngparaeditableslider-prev, .ngparaeditableslider-next { position: absolute; top: 50%; width: 64px; height: 64px; margin-top: -32px; background-image: var(--ngparaeditableslider-navstyle); background-position: center; background-repeat: no-repeat; -webkit-tap-highlight-color: transparent; } .ngparaeditableslider-next { right: 0; } .ngparaeditableslider-prev { left: 0; transform: rotate(180deg); } .ngparaeditableslider-prev.ngparaeditableslider-inactive, .ngparaeditableslider-next.ngparaeditableslider-inactive { display: none; } @media ( min-width: 1024px ) { .ngparaeditableslider li { padding-bottom: var(--ngparaeditableslider-cropratiodesktop); } } @media ( max-width: 1023px ) { .ngparaeditableslider li { padding-bottom: var(--ngparaeditableslider-cropratiomobile); } .ngparaeditableslider-prev, .ngparaeditableslider-next { width: 48px; height: 48px; margin-top: -24px; } .ngparaeditableslider-navhidemobile .ngparaeditableslider-prev, .ngparaeditableslider-navhidemobile .ngparaeditableslider-next { display: none; } }