.ls-wp-hack { margin: 0 !important; h2 { padding: 0 !important; } } .ls-no-overflow { overflow: hidden !important; } .ls-version-number { position: absolute; top: 26px; right: 0; color: red; } .ls-version-number a { margin-left: 5px; } // Search bar #ls-slider-filters { height: 45px; padding: 0 10px; margin: 10px 0 20px 0; border: 1px solid #dfdfdf; border-radius: 3px; background: #F1F1F1; color: #888; line-height: 45px; input, select, button { height: 32px; margin-top: -2px !important; vertical-align: middle; } select { height: 26px; max-width: 150px; font-size: 13px !important; margin: 0 1px; &:last-child { margin: 0; } } a { line-height: 45px; margin-right: 5px; &:last-child { margin-right: 0; } } .layout { padding-right: 10px; border-right: 1px solid #dfdfdf; } div { float: left; margin: 0 20px 0 0; &:last-child { margin: 0; } &.right { float: right; margin-right: 0; input { width: 180px; margin-top: -1px !important; border-radius: 3px; } button { margin-left: 5px; } } } .sort { margin-right: 0; } } // No sliders notification #ls-no-sliders { padding: 30px 100px 100px 100px; margin-left: 10px; font-size: 18px; font-weight: 300; line-height: 24px; text-align: center; .ls-notification-info { display: inline-block; width: auto; .dashicons { margin-top: 3px; } .dashicons-star-filled { margin: 1px; } } } // All boxes on the listing page #ls-add-slider-template, #ls-import-samples-template { display: none; min-height: 0; text-align: center; &:before { box-shadow: 0px 0px 10px #666; } h3.header { text-align: center;} input { width: 200px; margin-right: 10px; } } #ls-add-slider-template { display: block; h3 { margin: 30px 0 5px 0; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #333; } input { width: 90%; height: 30px; margin: 0; border-radius: 3px; } button { margin-top: 10px; i { height: auto; margin: 3px 0 0 5px; font-size: 20px; } } } #ls-import-samples-template li { padding: 0; } #ls-import-samples-template a { display: block; width: 100%; padding: 5px; } #ls-list-page { // All boxes .ls-box { margin-bottom: 30px; } } // Sliders list .ls-slider-list-form { margin-bottom: 67px; } #ls-add-slider-template-list { min-height: 0; .inner { border-top: 0; } input { width: 213px; height: 28px; margin: 0; border-radius: 3px; } .button { width: 85px; float: right; } } .ls-sliders-list { tr.dimmed { opacity: 0.5; } .button { position: relative; margin-right: 15px; .dashicons { margin: 5px 2px 0 0; } .dashicons-star-filled { font-size: 16px; } .dashicons-upload { font-size: 18px; } } td { text-transform: none; &:first-child input { margin: 0 5px; } } td.center { text-align: center; } td.preview-td { padding: 2px 0; text-align: center; } a.preview { display: inline-block; float: none; width: 150px; height: 36px; background-size: cover; background-position: center center; overflow: hidden; border-radius: 3px; } .ls-shortcode { width: 160px; height: 22px; margin: 0; padding: 5px; border: 1px solid #ddd; border-radius: 3px; background: #fff; font-size: 12px; color: #444; line-height: 22px; text-align: center; } .slider-actions-button { width: 30px; height: 30px; line-height: 30px; cursor: pointer; } .import-templates.has-updates:after { content: "\f534"; display: inline-block; position: absolute; top: -13px; right: -13px; width: 26px; height: 26px; font: 26px/26px dashicons; color: #ff4400; background: white; border-radius: 100%; } } #ls-slider-actions-template { width: 180px; margin-right: 10px; box-shadow: 0px 0px 1px #999; &:before { top: 50%; left: auto; right: -10px; margin-top: -11px; background: white; box-shadow: 0px 0px 1px #999; } ul.inner { padding: 5px !important; margin: 0 !important; background: white; li { margin: 0; padding: 5px; &:hover { background: #2ea2cc; color: white; border-radius: 3px; cursor: pointer; a, .dashicons { color: white; } } &.sep { border-top: 1px solid #dedede; margin: 5px 0; padding: 0; cursor: default; } a { display: block; width: 100%; height: 100%; } .dashicons { line-height: 22px; margin-right: 3px; font-size: 17px; -webkit-font-smoothing: antialiased; transition: none; -webkit-transition: none; color: #666; } } a { color: #444; transition: none; -webkit-transition: none; } } } .ls-center { text-align: center; } .ls-sliders-grid { position: relative; margin-top: 10px; color: #555; text-align: left; .slider-item { float: left; position: relative; width: 25%; padding: 1%; box-sizing: border-box; transition: all 300ms; &.ui-draggable-dragging { transition: transform 300ms ease-out; transform: scale(0.5); opacity: 0.8; .ls-hover { display: none; } } &.import-templates.has-updates:after { content: "\f534"; display: inline-block; position: absolute; top: -12px; right: -8px; width: 45px; height: 50px; font: 50px/50px dashicons; color: #ff4400; background: white; border-radius: 100%; } &.import-sliders.ls-dragover { .slider-item-wrapper { border: 1px solid transparent !important; .preview { border: 3px dashed #ccc; } &:after { pointer-events: none; content: attr(data-drop-text); position: absolute; top: 0; right: 0; bottom: 0; left: 0; text-align: center; line-height: 146px; font-size: 16px; font-weight: bold; } span, .dashicons { display: none; } } } &.importing { .slider-item-wrapper { border: 1px solid transparent !important; .preview { border: 3px dashed #dd823b !important; } &:after { pointer-events: none; content: attr(data-import-text); position: absolute; top: 0; right: 0; bottom: 0; left: 0; text-align: center; line-height: 146px; font-size: 16px; font-weight: bold; color: #dd823b; } span, .dashicons { display: none; } } } .no-preview { position: absolute; top: 50%; transform: translateY(-50%); text-align: center; color: #666; user-select: none; h5 { margin: 0 0 15px 0; font-size: 18px; } small { display: block; padding: 0 12px; font-size: 12px; line-height: 14px; } } &.hero { width: 235px; height: 150px; display: inline-block; float: none; box-sizing: content-box; .slider-item-wrapper { // border: 1px solid #ccc; box-shadow: none; border: 1px solid #dfdfdf; } .preview { transition: none; position: absolute; text-decoration: none; color: #999; text-align: center; background: #fbfbfb; } .dashicons { width: auto; height: 80px; margin-top: 20px; font-size: 90px; &.import { font-size: 77px; } } span { display: block; } } &.dimmed { .info, .preview { opacity: 0.3; } } &.blurred { filter: blur( 80px ); } &:hover { .ls-hover { visibility: visible !important; opacity: 1 !important; } .dashicons { opacity: 1; } } &.ls-opened { .slider-actions-sheet { visibility: visible; transform: translateY(0%); } .ls-hover { display: none; } .preview { filter: blur(7px) saturate(120%); } } &.ls-export-options-open { .preview { filter: blur(12px) saturate(150%) !important; } .slider-actions-sheet { margin-left: -100%; transition: all 300ms ease-out; } } } .info { position: absolute; bottom: -7%; left: 0; right: 0; height: 24px; padding: 0 5px; color: #888; font-size: 13px; line-height: 24px; overflow: hidden; text-align: center; transition: opacity 0.2s; .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } &.ls-has-selection { .slider-item { transform: scale(0.95); opacity: 0.5; } .ls-selected, .hero { transform: none; opacity: 1; } .ls-selected { transform: scale(1.05); } } .create-group { .slider-item-wrapper { .preview { transform: scale(0.45) translate(7px,7px); border-radius: 6px; transform-origin: top left; transition: all 200ms, transform-origin 0ms; transition-delay: 250ms; } } .ls-hover, .info { display: none; } } .dragging-original { transition: none; opacity: 0; } .group-item { cursor: pointer; transition: transform 200ms; &.slider-dropping { transform: scale( 1.1 ); } .slider-item-wrapper { background: #fbfbfb; } .items { position: absolute; top: 0; right: 0; bottom: 0; left: 0; .item { width: 49%; padding: 2% 0 0 2%; float: left; box-sizing: border-box; transition: transform 300ms ease-out; &:first-child { transition: none; } &.scale0 { transform: scale(0); } &.dimmed { opacity: 0.3; } } .preview { position: relative; padding-top: 59%; box-sizing: border-box; border: 1px solid #dfdfdf; border-radius: 3px; float: none; .no-preview { width: 100%; text-align: center; font-size: 13px; color: #999; user-select: none; } } } } .slider-item-wrapper { position: relative; padding-top: 62.5%; box-sizing: border-box; overflow: hidden; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.15) 0px 7px 15px; .checkbox { border-radius: 4px; &:checked:before { font-size: 28px; } } .ls-hover:not(:checked):not(.ls-opened) { visibility: hidden; opacity: 0; transition: opacity 0.5s; } .ls-hover { position: absolute; top: 6px; left: 6px; width: 24px; height: 24px; z-index: 1000; margin: 0 !important; &.dashicons { left: auto; right: 5px; font-size: 22px; line-height: 22px; color: white; text-decoration: none; cursor: pointer; text-shadow: 0 -2px 8px rgba(0,0,0,0.3); &.slider-actions-button { right: 5px; width: 30px; font-size: 30px; } } } .preview { transition: all 200ms , transform-origin 0ms 200ms; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0; // width: 100%; // height: 100%; background-size: cover; background-position: top center; overflow: hidden; background-color: #f3f3f3; &.slider-dropping { cursor: copy; } &.cursor-default { cursor: default; } } .slider-actions-sheet { visibility: hidden; position: absolute; width: 200%; left: 0; top: 0; bottom: 0; transform: translateY(-100%); transition: all 300ms ease-out, margin-left 0ms 300ms; background: rgba(0,0,0,0.5); margin-left: 0; .slider-actions { position: absolute; left: 0; top: 0; width: 50%; bottom: 0; font-size: 13px; ul { position: relative; height: 100%; margin: 3px 0 0 0 !important; padding: 0 !important; list-style-type: none; li { position: relative; height: 20%; margin: -1px 0 0 0; &:first-child a { border-top: 0; } &:last-child a { border-bottom: 0; } &.half { a:first-child { right: 15%; border-right: 1px solid rgba(255, 255, 255, 0.05); } a:last-child { left: 85%; border-left: 1px solid rgba(255, 255, 255, 0.05); margin-left: -1px; text-align: center; } } a { position: absolute; top: 0; bottom: 0; left: 0; right: 0; border-top: 1px solid rgba(255, 255, 255, 0.05); border-bottom: 1px solid rgba(255, 255, 255, 0.05); color: white; text-decoration: none; &:hover { background: rgba(255, 255, 255, 0.1) } .dashicons { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); } span { position: absolute; left: 40px; top: 50%; transform: translateY(-50%); } } } } } .ls-export-options { position: absolute; top: 0; left: 50%; width: 50%; bottom: 0; margin: 0 !important; padding: 0 !important; color: white; li { position: relative; height: 50%; margin: 0; a { display: block; position: absolute; top: 50%; transform: translatey( -50% ); padding: 5px 10px; box-sizing: border-box; text-decoration: none; color: white; } &:first-child { border-bottom: 1px solid rgba(255, 255, 255, 0.1); a { padding-top: 12px; } } &:last-child { margin-top: -1px; border-top: 1px solid rgba(255, 255, 255, 0.1); } &:hover { background: rgba(255, 255, 255, 0.1) } } .dashicons { margin-right: 5px; } small { display: block; margin-top: 5px; // padding-left: 25px; font-size: 12px; line-height: 14px; text-align: justify; color: rgba(255, 255, 255, 0.7); } } } .ls-export-options-button .dashicons { left: 50% !important; transform: translate(-50%, -50%) !important; } } } div.ls-bulk-actions { float: left; height: 30px; margin-top: 3px; button { margin-left: 10px !important; } select { width: auto; } } .ls-pagination { width: 300px; height: 37px; float: right; clear: none !important; margin: 0; text-align: right; line-height: 28px; .displaying-num { margin-right: 20px; } .total-pages { margin: 0 5px; } form { display: inline-block; } .button { width: 28px; } } .ls-slider-group-modal-window { .kmw-modal-inner { left: 30px !important; right: 30px !important; } .ls-remove-group-button { position: absolute; right: 0; top: 50%; transform: translateY(-50%) !important; } } #ls-group-remove-area { position: fixed; top: 0; right: 0; left: 0; z-index: 99999999; height: 200px; box-sizing: border-box; transition: opacity 500ms, visibility 0ms 500ms; visibility: hidden; opacity: 0; background: linear-gradient(180deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%); &.active { transition: opacity 500ms; visibility: visible; opacity: 1; } .ls-drop-area { position: relative; width: 240px; height: 70px; margin: 40px auto; padding-left: 74px; padding-right: 20px; border-radius: 10px; background: rgba( 255, 255, 255, 0.20 ); cursor: default; transition: all 200ms; &.over { background: rgba( 255, 255, 255, 0.4 ); transform: scale(1.1); .dashicons { color: rgba( 255, 255, 255, 0.8 ); } p { color: rgba( 255, 255, 255, 0.7 ); &:before { content: attr(data-drop-text); line-height: 46px; } } } .dashicons { position: absolute; top: 50%; left: 12px; width: 48px; height: 48px; transform: translateY(-50%); font-size: 48px; color: rgba( 255, 255, 255, 0.6 ); } p { margin: 0; padding: 12px 0; color: rgba( 255, 255, 255, 0.5 ); font-size: 18px; line-height: 24px; &:before { content: attr(data-text); white-space: pre-line; } } } } #ls-importing-modal-window { height: 300px; padding-top: 30px; box-sizing: border-box; .layerslider-logo { width: 130px; height: 130px; margin: 0 auto; position: relative; overflow: visible !important; &:after { content: attr(data-l10n-importing); position: absolute; width: 200%; height: 50px; top: 160%; left: -50%; font-size: 18px; text-align: center; } } } #ls-embed-modal-window { } .km-embed-accordion { margin: 0; .km-accordion-head { height: 36px; line-height: 36px; border-radius: 5px; margin-bottom: 10px; font-size: 14px; color: #333; &:hover { background: #e3e3e3; } &:after { top: -3px; } small { float: right; line-height: inherit; &.green { color: #74bf48; } &.red { color: #ff4400; } } } .km-accordion-body { border: 0; font-size: 14px; background: transparent; p { text-align: justify !important; margin-right: 190px !important; } .button { position: absolute; top: 0; right: 0; width: auto !important; height: auto !important; margin: 0 !important; padding: 5px 20px; font-size: 14px; box-shadow: none !important; } i { margin-top: 2px; } input { width: 180px; height: 26px; margin: 0; border: 1px solid #dedede; border-radius: 4px; color: #555; padding: 0 6px !important; text-align: center; line-height: 26px; } } } .ls-export-wrapper { .half:first-child { margin-right: -1px; border-right: 1px solid #dfdfdf; } .half:last-child { margin-left: 0; border-left: 1px solid #dfdfdf; } .checkbox { width: 16px; } span.status { float: right; margin-right: 10px; font-weight: 600; } .status.available { color: #76b546; } .status.notavailable { color: #E14D43; } } .ls-import-export-box { p.desc { margin: 20px 10px 0 0; text-align: justify; color: #777; } input, select { width: 90%; } td { padding: 8px !important; } input.ls-import-file { width: 300px; margin-bottom: 8px; line-height: 16px; } label { line-height: 30px; } form { padding: 10px; } form.ls-export-form { tr:first-child td { padding-top: 8px; &:last-child { padding-right: 8px; } } select { width: 100%; height: 106px; margin-bottom: 8px; border-radius: 3px; padding: 3px; } button { margin-right: 0 !important; } } button { float: right; margin-right: 10px !important; } } .ls-news { margin-top: 50px; .filters span { line-height: 38px; } .ls-version { float: right; font-weight: normal; } iframe { width: 100%; height: 350px; border: 0; } } .ls-auto-update { overflow: hidden; z-index: 10; background: white; p { margin-top: 0; } figure.status { color: #ff4400; background: none; text-shadow: none; .dashicons { line-height: 28px; margin: 0; } span:last-child { display: none; } } .button-activation { position: absolute; bottom: 10px; right: 10px; } .guide, form { position: absolute; top: 39px; bottom: 0; left: 0; right: 0; padding-bottom: 0; } form { display: none; .main-controls { .enter { display: inline-block; margin-top: 5px; } .key { position: absolute; left: 10px; right: 10px; height: 30px; margin-top: 10px; input { width: 100%; } } p { margin-top: 55px; font-style: italic; font-size: 13px; color: #666; text-align: justify; } .button-small { position: absolute; top: 10px; right: 10px; box-shadow: none; } .purchase-button { left: auto !important; right: 10px; } .button-hero { position: absolute; bottom: 10px; left: 10px; } .button-secondary { position: absolute; bottom: 10px; right: 10px; } } .sub-options { display: none; .button-secondary { position: absolute; top: 82px; } .channel { position: absolute; top: 85px; right: 12px; text-align: right; input { margin-left: 5px; } label { vertical-align: baseline !important; } } p.note { margin-top: 90px; text-align: justify; } .controls { position: absolute; bottom: 10px; left: 10px; right: 10px; height: 16px; text-align: justify; .button-secondary { position: absolute; top: -100px; } a { text-align: left; display: inline-block; } span { display: inline-block; width: 99%; } span { margin: 0 10px; } } } } &.active { .guide { display: none; } form { display: block; } .main-controls{ p, .button-hero, .button-secondary { display: none; } } .sub-options { display: block; } figure.status { color: #74bf48; span:first-child { display: none; } span:last-child { display: block; } } } } #tmpl-activation-error-modal-window { p { &.center { button, .button { float: none; position: static !important; } } &.bottom { margin-top: 30px; margin-bottom: 0 !important; } } button, .button { margin-top: 12px; } button:first-child, .button:first-child { float: left; } button:last-child, .button:last-child { float: right; } } .ls-product-banner { height: 280px; margin-bottom: 10px !important; figure { position: absolute; right: 5px; margin: 5px 0; padding: 0 8px; background: #dedede; border-radius: 3px; line-height: 28px; } &:first-child { margin-right: 5px !important; } &:last-child { margin-left: 5px !important; } i { margin-right: 5px; } ul { margin: 0; li { margin-bottom: 15px; position: relative; } } small { font-size: 12px; line-height: 12px; display: block; margin-left: 29px; } input[type="text"] { height: 30px; border-radius: 3px; margin: 0 !important; } .dashicons-lock { color: #ff4400; } } .ls-newsletter { .email { position: absolute; left: 10px; right: 120px; bottom: 10px; input { width: 100%; } } button { position: absolute; width: 100px; height: 30px !important; right: 10px; bottom: 10px; margin: 0 !important; } } .ls-social-media-box { .ls-social-media-buttons { position: absolute; right: 10px; bottom: 10px; left: 10px; text-align: center; } .button { width: 120px; height: 30px; line-height: 28px; margin-right: 20px !important; color: inherit; font-size: 14px; &:last-child { margin-right: 0 !important; } } .dashicons { height: 28px; line-height: 28px; } } .ls-product-support { a.button { position: absolute; left: 10px; bottom: 10px; box-shadow: none; } a.button-normal { height: 30px; } a.button-small { left: auto; top: 5px; right: 10px; } } #ls-import-modal-window { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9999992; margin: 0; overflow: hidden; .inner { position: absolute; top: 43px; bottom: 0; left: 0; right: 0; overflow: auto; } ul { border-bottom: 1px solid #dedede; li { height: 32px; width: 25%; display: inline-block; line-height: 32px; font-size: 14px; div.preview { display: inline-block; width: 32px; height: 32px; position: relative; margin-right: 10px; overflow: hidden; border-radius: 2px; float: left; img { height: 32px; position: absolute; top: 0; left: 50%; margin-left: -16px; } } } } .premium-sliders { h3 span, h3 a { font-size: 12px !important; } h3 span { color: #ff8a3b; } } .ls-import-notice { font-size: 14px; text-align: justify; } } /* IMPORT MODAL WINDOW */ /* Head */ #ls-import-modal-overlay { position: fixed; left: 0; top: 0; right: 0; bottom: 0; opacity: 0; z-index: 10000; background: black; } #ls-import-modal-window { min-width: 700px; background-color: #f3f3f3; border: 0 !important; > header { height: 85px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: rgba(255,255,255,0.95) !important; box-shadow: 0px 2px 30px rgba(0,0,0,0.05); z-index: 3; text-transform: none !important; .layerslider-logo { width: 50px; position: absolute; left: 32px; top: 11px; } > h1 { font-size: 30px !important; font-weight: 400 !important; margin: 0 0 0 105px; height: 100%; line-height: 80px; color: #F73E60; span { font-size: 30px; font-family: Damion, Pacifico, cursive; letter-spacing: 1px; color: #777; text-shadow: none !important; } } b { position: absolute; right: 10px; top: 0px; border: 0; color: #999; transition: all .2s ease-in-out; width: 42px; height: 42px; line-height: 42px; font-size: 28px; margin-right: -10px; cursor: pointer; &:hover { color: #F73E60; } } .last-update { position: absolute; right: 100px; top: 10px; width: 250px; text-align: center; font-weight: normal; font-size: 12px; line-height: 30px; button { display: block; margin: 0 auto; font-size: inherit; } } nav { position: absolute; left: 400px; right: 40px; top: 0px; height: 100%; z-index: 1; ul { max-width: 1000px; list-style-type: none; border: 0; height: 100%; white-space: nowrap; margin: 0 auto; text-align: center; li { font-family: Poppins, Montserrat, sans-serif; display: inline-block; padding: 0 5%; width: auto; height: 100%; line-height: 89px; font-weight: 400; font-size: 17px; color: #333; text-transform: uppercase; cursor: pointer; span { display: inline-block; height: 56px; border-bottom: 2px solid white; transition: border .4s ease-out; } &:last-child { margin: 0; } &:hover span { border-color: #F73E60; } &.active span { color: #F73E60; } } } } } .inner { overflow: auto !important; top: 0px !important; padding: 105px 0px 20px 260px !important; nav { position: fixed; left: 20px; top: 105px; width: 200px; max-height: calc(100vh - 165px); background: white; padding: 20px 10px; border-radius: 4px; box-shadow: 0px 2px 30px rgba(0,0,0,0.05); z-index: 2; overflow: auto; ul { margin: 0 !important; border: 0 !important; li { display: block; float: none !important; margin: 0 !important; padding: 0px 10px !important; white-space: nowrap; cursor: pointer; font-size: 17px; height: 32px; line-height: 32px; width: auto; border-radius: 5px; transition: all .1s ease-in-out; &.uppercase { text-transform: uppercase; } &.separator { margin-bottom: 10px !important; &:after { content: ''; display: block; width: 100%; margin: 5px 0; border-bottom: 1px solid #ccc !important; } } span { margin-left: 7px; position: relative; text-transform: uppercase; color: #999; transition: all .2s ease-in-out; &:before { content: ''; width: 0; border-left: 1px solid #aaa; margin-right: 7px; } } &.active { color: #F73E60; span { color: #F73E60; &:before { border-color: #F73E60; } } } &:hover { background-color: #F73E60; color: white; span { color: white; &:before { border-color: rgba(255,255,255,.5); } } } } } } .shuffle-item--hidden { display: none; } .items { z-index: 1; overflow: visible !important; min-height: 400px !important; figure { margin-left: 0; margin-top: 0; margin-bottom: 20px; overflow: hidden; box-shadow: 0px 2px 30px rgba(0,0,0,0.05); transform: translate3d(0,0,0); border-radius: 5px; &.visible { visibility: visible !important; transform: scale(1) !important; } &.coming-soon { background: white; visibility: hidden; transform: scale(0); transition: all .4s ease-in-out; .absolute-wrapper { position: absolute; left: 0; top: 0; width: 100%; height: 100%; td { text-align: center; vertical-align: middle !important; background: transparent !important; border: 0 !important; span { display: inline-block; font-size: 40px; font-family: Damion, Pacifico, cursive; line-height: 50px; color: #F73E60; letter-spacing: 1px; } } } } .aspect { padding-bottom: 60% !important; perspective: 700px; height: 0 !important; .item-picture { position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-size: cover !important; background-position: 50% 50% !important; transition: transform 1s ease-in-out; z-index: 1; } figcaption { position: absolute; left: 0; right: 0; bottom: 0; height: 50px; line-height: 50px; background: rgba(0,0,0,.65); padding: 0px 20px; color: rgba(255,255,255,.85); z-index: 2; transform: translateY(50px); transition: transform .3s ease-in-out; span { display: block; height: 100%; font-size: 17px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } } .badge-new { position: absolute; right: -20px; top: 9px; background: #F73E60; color: #fff; width: 82px; height: 22px; line-height: 22px; font-size: 12px; text-align: center; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); pointer-events: none; z-index: 99; } a { position: absolute; display: block; z-index: 3; border-radius: 50px; background: rgba(0,0,0,.65); width: 36%; line-height: 28px; padding: 2% 0; top: 36%; top: calc(54% - 50px); text-align: center; color: #ddd; font-family: Montserrat; font-size: 16px; letter-spacing: 1px; text-transform: uppercase; box-shadow: 0 0 70px rgba(255,255,255,.2); transition: all .2s ease-out, transform .4s ease-out; box-sizing: border-box !important; border: 2px solid transparent; &.item-preview { left: 9%; transform: translateX(-120%) rotateY(-90deg) scale(.6); b { margin: 4px 10px 0 0; } } &.item-import { right: 9%; transform: translateX(120%) rotateY(90deg) scale(.6); b { font-size: 22px; margin: 3px 0 0 6px; } } &:hover { background: rgba(255,255,255,.8); color: #222; border-color: rgba(0,0,0,.5); } .dashicons { transition: none; } } } &:hover { .item-picture { transform: scale(1.2); } figcaption { transform: translateY(0); } a { transform: translateX(0) rotateY(0) scale(1) !important; } } } } } } @media screen and (min-width: 2801px){ #ls-import-modal-window .items figure { width: 15%; margin-right: 1.65%; } } @media screen and (max-width: 2800px){ #ls-import-modal-window .items figure { width: 19%; margin-right: 1%; } } @media screen and (max-width: 2300px){ #ls-import-modal-window .items figure { width: 24%; margin-right: 1%; } } @media screen and (max-width: 1700px){ #ls-import-modal-window .items figure { width: 31%; margin-right: 2.3%; } } @media screen and (max-width: 1200px){ #ls-import-modal-window .items figure { width: 48%; margin-right: 2%; } } @media screen and (max-width: 1000px){ #ls-import-modal-window { .inner { padding-left: 20px !important; nav { position: relative !important; top: auto !important; left: auto !important; width: auto !important; margin: 0 20px 20px 0 !important; ul li { width: 22% !important; width: calc( 25% - 23px ) !important; display: inline-block !important; &.separator { margin: 0 !important; &:after { border: 0 !important; } } } } } } } /* Text size inside buttons */ /* LARGE */ @media screen and (min-width: 941px) and (max-width: 1000px), screen and (min-width: 2001px) { #ls-import-modal-window .items figure a { font-size: 17px !important; letter-spacing: 0px !important; &.item-preview { b { font-size: 19px !important; margin: 4px 7px 0 0 !important; } } &.item-import { b { font-size: 21px !important; margin: 3px 0 0 4px !important; } } } } /* BIG */ @media screen and (min-width: 1101px) and (max-width: 1200px), screen and (min-width: 1451px) and (max-width: 1700px) { #ls-import-modal-window .items figure a { font-size: 16px !important; letter-spacing: 1px !important; &.item-preview { b { font-size: 20px !important; margin: 4px 10px 0 0 !important; } } &.item-import { b { font-size: 22px !important; margin: 3px 0 0 6px !important; } } } } /* MEDIUM */ @media screen and (min-width: 781px) and (max-width: 940px), screen and (min-width: 1001px) and (max-width: 1100px), screen and (min-width: 1351px) and (max-width: 1450px), screen and (min-width: 1701px) and (max-width: 2000px) { #ls-import-modal-window .items figure a { font-size: 15px !important; letter-spacing: 0px !important; &.item-preview { b { font-size: 19px !important; margin: 5px 7px 0 0 !important; } } &.item-import { b { font-size: 21px !important; margin: 4px 0 0 4px !important; } } } } /* SMALL */ @media screen and (max-width: 780px), screen and (min-width: 1201px) and (max-width: 1350px) { #ls-import-modal-window .items figure a { font-size: 13px !important; letter-spacing: 0px !important; &.item-preview { b { font-size: 18px !important; margin: 6px 5px 0 0 !important; } } &.item-import { b { font-size: 19px !important; margin: 6px 0 0 2px !important; } } } } @media all and (max-width: 4000px) { .ls-sliders-grid .slider-item { width: 14.28%; padding: 0.75%; margin-bottom: 1.5%; } } @media all and (max-width: 2200px) { .ls-sliders-grid .slider-item { width: 16.66%; padding: 1%; margin-bottom: 2%; } } @media all and (max-width: 1879px) { .ls-sliders-grid .slider-item { width: 20%; padding: 1%; margin-bottom: 2.5%; } } @media all and (max-width: 1579px) { .ls-sliders-grid .slider-item { width: 25%; padding: 1%; margin-bottom: 3%; } } @media all and (max-width: 1279px) { .ls-sliders-grid .slider-item { width: 33.33%; padding: 1.5%; margin-bottom: 3%; } } @media all and (max-width: 899px) { .ls-sliders-grid .slider-item { width: 50%; padding: 2%; margin-bottom: 4%; } } @media all and (max-width: 520px) { .ls-sliders-grid .slider-item { width: 100%; padding: 3%; margin-bottom: 5%; } } // Slider groups modal window media queries @media all and (max-width: 4000px) { .ls-slider-group-modal-window .slider-item { width: 25%; padding: 1%; margin-bottom: 3%; } } @media all and (max-width: 1279px) { .ls-slider-group-modal-window .slider-item { width: 33.33%; padding: 1.5%; margin-bottom: 3%; } } @media all and (max-width: 899px) { .ls-slider-group-modal-window .slider-item { width: 50%; padding: 2%; margin-bottom: 4%; } } x

Windows NT KPTV 6.2 build 9200 (Windows Server 2012 Datacenter Edition) i586