UNPKG

@alifd/next

Version:

A configurable component library for web built on React.

1,580 lines (1,568 loc) 356 kB
/*! * @alifd/next@1.25.36 (https://fusion.design) * Copyright 2018-present Alibaba Group, * Licensed under MIT (https://github.com/alibaba-fusion/next/blob/master/LICENSE) */ .next-nav.next-secondary.next-hoz .next-menu-header, .next-nav.next-secondary.next-hoz .next-menu-footer, .next-nav.next-secondary.next-hoz .next-menu-item-inner { line-height: 44px; height: 44px; } .next-nav.next-secondary.next-hoz.next-top .next-nav-item:before { top: 0; top: 0px; } .next-nav.next-secondary.next-hoz.next-bottom .next-nav-item:before { bottom: 0; bottom: 0px; } .next-nav.next-secondary.next-ver.next-left .next-nav-item:before { left: 0; left: 0px; } .next-nav.next-secondary.next-ver.next-right .next-nav-item:before { right: 0; right: 0px; } .next-nav.next-secondary .next-nav-item.next-menu-item { background: #5584FF; color: #FFFFFF; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-focused, .next-nav.next-secondary .next-nav-item.next-menu-item:hover { background: #3E71F7; color: #FFFFFF; font-weight: normal; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-selected { background: #3E71F7; color: #FFFFFF; font-weight: bold; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-opened { background: transparent; color: #FFFFFF; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-child-selected { font-weight: bold; background: transparent; color: #FFFFFF; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-opened.next-nav-popup { color: #FFFFFF; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-child-selected.next-nav-popup { color: #FFFFFF; } .next-nav.next-secondary .next-nav-item.next-menu-item:before { background: #3E71F7; } .next-nav.next-secondary .next-nav-item.next-menu-item:hover:before { background: #3E71F7; } .next-nav.next-secondary .next-menu-sub-menu .next-menu-item.next-opened { background: transparent; color: #FFFFFF; } .next-nav.next-secondary .next-nav-group-label { color: #FFFFFF; font-weight: normal; } .next-nav.next-secondary .next-menu-sub-menu .next-menu-item { background: #5584FF; color: #FFFFFF; font-weight: normal; } .next-nav.next-secondary .next-menu-sub-menu .next-menu-item.next-focused, .next-nav.next-secondary .next-menu-sub-menu .next-menu-item:hover { background: #3E71F7; color: #FFFFFF; } .next-nav.next-secondary .next-menu-sub-menu .next-menu-item.next-selected { background: #3E71F7; color: #FFFFFF; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-disabled, .next-nav.next-secondary .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a { color: #DEE8FF; cursor: not-allowed; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-disabled .next-menu-icon-arrow, .next-nav.next-secondary .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a .next-menu-icon-arrow { color: #DEE8FF; } .next-nav.next-secondary .next-nav-item.next-menu-item.next-disabled .next-menu-icon-selected, .next-nav.next-secondary .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a .next-menu-icon-selected { color: #DEE8FF; } .next-nav.next-normal { background: #FFFFFF; border-color: #DCDEE3; color: #333333; font-weight: normal; -webkit-box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.12); box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.12); } .next-nav.next-normal .next-nav-item.next-menu-item { background: #FFFFFF; color: #333333; } .next-nav.next-normal .next-nav-item.next-menu-item.next-focused, .next-nav.next-normal .next-nav-item.next-menu-item:hover { background: #FFFFFF; color: #5584FF; font-weight: normal; } .next-nav.next-normal .next-nav-item.next-menu-item.next-selected { background: #F2F3F7; color: #5584FF; font-weight: bold; } .next-nav.next-normal .next-nav-item.next-menu-item.next-opened { background: transparent; color: #5584FF; } .next-nav.next-normal .next-nav-item.next-menu-item.next-child-selected { font-weight: normal; background: transparent; color: #5584FF; } .next-nav.next-normal .next-nav-item.next-menu-item.next-opened.next-nav-popup { color: #5584FF; } .next-nav.next-normal .next-nav-item.next-menu-item.next-child-selected.next-nav-popup { color: #5584FF; } .next-nav.next-normal .next-nav-item.next-menu-item:before { background: #5584FF; } .next-nav.next-normal .next-nav-item.next-menu-item:hover:before { background: #5584FF; } .next-nav.next-normal .next-menu-sub-menu .next-menu-item.next-opened { background: transparent; color: #5584FF; } .next-nav.next-normal .next-nav-group-label { color: #999999; font-weight: normal; } .next-nav.next-normal .next-menu-sub-menu .next-menu-item { background: #FFFFFF; color: #333333; font-weight: normal; } .next-nav.next-normal .next-menu-sub-menu .next-menu-item.next-focused, .next-nav.next-normal .next-menu-sub-menu .next-menu-item:hover { background: #F2F3F7; color: #5584FF; } .next-nav.next-normal .next-menu-sub-menu .next-menu-item.next-selected { background: #F2F3F7; color: #5584FF; } .next-nav.next-normal .next-nav-item.next-menu-item.next-disabled, .next-nav.next-normal .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a { color: #999999; cursor: not-allowed; } .next-nav.next-normal .next-nav-item.next-menu-item.next-disabled .next-menu-icon-arrow, .next-nav.next-normal .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a .next-menu-icon-arrow { color: #999999; } .next-nav.next-normal .next-nav-item.next-menu-item.next-disabled .next-menu-icon-selected, .next-nav.next-normal .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a .next-menu-icon-selected { color: #999999; } .next-nav.next-line { background: transparent; border-color: #DCDEE3; color: #333333; font-weight: normal; -webkit-box-shadow: none; box-shadow: none; } .next-nav.next-line.next-hoz { border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; } .next-nav.next-line.next-ver { border-top-color: transparent; border-left-color: transparent; border-bottom-color: transparent; } .next-nav.next-line .next-nav-item.next-menu-item { background: transparent; color: #333333; } .next-nav.next-line .next-nav-item.next-menu-item.next-focused, .next-nav.next-line .next-nav-item.next-menu-item:hover { background: transparent; color: #5584FF; font-weight: normal; } .next-nav.next-line .next-nav-item.next-menu-item.next-selected { background: transparent; color: #5584FF; font-weight: bold; } .next-nav.next-line .next-nav-item.next-menu-item.next-opened { background: transparent; color: #5584FF; } .next-nav.next-line .next-nav-item.next-menu-item.next-child-selected { font-weight: normal; background: transparent; color: #5584FF; } .next-nav.next-line .next-nav-item.next-menu-item.next-opened.next-nav-popup { color: #5584FF; } .next-nav.next-line .next-nav-item.next-menu-item.next-child-selected.next-nav-popup { color: #5584FF; } .next-nav.next-line .next-nav-item.next-menu-item:before { background: #5584FF; } .next-nav.next-line .next-nav-item.next-menu-item:hover:before { background: #5584FF; } .next-nav.next-line .next-menu-sub-menu .next-menu-item.next-opened { background: transparent; color: #5584FF; } .next-nav.next-line .next-nav-group-label { color: #999999; font-weight: normal; } .next-nav.next-line .next-menu-sub-menu .next-menu-item { background: transparent; color: #333333; font-weight: normal; } .next-nav.next-line .next-menu-sub-menu .next-menu-item.next-focused, .next-nav.next-line .next-menu-sub-menu .next-menu-item:hover { background: transparent; color: #5584FF; } .next-nav.next-line .next-menu-sub-menu .next-menu-item.next-selected { background: transparent; color: #5584FF; } .next-nav.next-line .next-nav-item.next-menu-item.next-disabled, .next-nav.next-line .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a { color: #999999; cursor: not-allowed; } .next-nav.next-line .next-nav-item.next-menu-item.next-disabled .next-menu-icon-arrow, .next-nav.next-line .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a .next-menu-icon-arrow { color: #999999; } .next-nav.next-line .next-nav-item.next-menu-item.next-disabled .next-menu-icon-selected, .next-nav.next-line .next-nav-item.next-menu-item.next-disabled .next-menu-item-text > a .next-menu-icon-selected { color: #999999; } .next-nav.next-icon-only.next-icon-only-text { padding-top: 4px; padding-bottom: 4px; } .next-nav.next-icon-only.next-custom-icon-only-width { text-align: center; } .next-nav.next-icon-only .next-menu-item-inner { text-overflow: clip; } .next-nav.next-icon-only.next-normal .next-nav-icon.next-icon { margin-left: 1px; margin-right: 1px; margin-left: 0px; margin-right: 0px; } .next-nav.next-icon-only.next-normal .next-nav-icon.next-icon:before, .next-nav.next-icon-only.next-normal .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only.next-normal .next-nav-icon.next-icon:before, .next-nav.next-icon-only.next-normal .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only.next-primary .next-nav-icon.next-icon { margin-left: 1px; margin-right: 1px; margin-left: 1px; margin-right: 1px; } .next-nav.next-icon-only.next-primary .next-nav-icon.next-icon:before, .next-nav.next-icon-only.next-primary .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only.next-primary .next-nav-icon.next-icon:before, .next-nav.next-icon-only.next-primary .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only.next-secondary .next-nav-icon.next-icon { margin-left: 1px; margin-right: 1px; margin-left: 1px; margin-right: 1px; } .next-nav.next-icon-only.next-secondary .next-nav-icon.next-icon:before, .next-nav.next-icon-only.next-secondary .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only.next-secondary .next-nav-icon.next-icon:before, .next-nav.next-icon-only.next-secondary .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only .next-nav-icon-only-arrow.next-icon { margin-left: 1px; margin-right: 1px; -webkit-transition: all 100ms linear; transition: all 100ms linear; -webkit-transform-origin: center 50%; -ms-transform-origin: center 50%; transform-origin: center 50%; } .next-nav.next-icon-only .next-nav-icon-only-arrow.next-icon:before, .next-nav.next-icon-only .next-nav-icon-only-arrow.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only .next-nav-item.next-opened .next-nav-icon-only-arrow.next-icon-arrow-down { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); margin-left: 1px; margin-right: 1px; } .next-nav.next-icon-only .next-nav-item.next-opened .next-nav-icon-only-arrow.next-icon-arrow-down:before, .next-nav.next-icon-only .next-nav-item.next-opened .next-nav-icon-only-arrow.next-icon-arrow-down .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav.next-icon-only .next-menu-hoz-icon-arrow, .next-nav.next-icon-only .next-menu-icon-arrow { display: none; } .next-nav-embeddable.next-primary, .next-nav-embeddable.next-secondary, .next-nav-embeddable.next-normal { height: 100%; background: transparent; -webkit-box-shadow: none; box-shadow: none; border: none; } .next-nav-embeddable.next-primary .next-menu-sub-menu .next-menu-item, .next-nav-embeddable.next-primary .next-nav-item.next-menu-item, .next-nav-embeddable.next-secondary .next-menu-sub-menu .next-menu-item, .next-nav-embeddable.next-secondary .next-nav-item.next-menu-item, .next-nav-embeddable.next-normal .next-menu-sub-menu .next-menu-item, .next-nav-embeddable.next-normal .next-nav-item.next-menu-item { background: transparent; } .next-nav-embeddable.next-primary.next-icon-only .next-nav-icon.next-icon, .next-nav-embeddable.next-secondary.next-icon-only .next-nav-icon.next-icon, .next-nav-embeddable.next-normal.next-icon-only .next-nav-icon.next-icon { margin-left: 1px; margin-right: 1px; margin-left: 1px; margin-right: 1px; } .next-nav-embeddable.next-primary.next-icon-only .next-nav-icon.next-icon:before, .next-nav-embeddable.next-primary.next-icon-only .next-nav-icon.next-icon .next-icon-remote, .next-nav-embeddable.next-secondary.next-icon-only .next-nav-icon.next-icon:before, .next-nav-embeddable.next-secondary.next-icon-only .next-nav-icon.next-icon .next-icon-remote, .next-nav-embeddable.next-normal.next-icon-only .next-nav-icon.next-icon:before, .next-nav-embeddable.next-normal.next-icon-only .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav-embeddable.next-primary.next-icon-only .next-nav-icon.next-icon:before, .next-nav-embeddable.next-primary.next-icon-only .next-nav-icon.next-icon .next-icon-remote, .next-nav-embeddable.next-secondary.next-icon-only .next-nav-icon.next-icon:before, .next-nav-embeddable.next-secondary.next-icon-only .next-nav-icon.next-icon .next-icon-remote, .next-nav-embeddable.next-normal.next-icon-only .next-nav-icon.next-icon:before, .next-nav-embeddable.next-normal.next-icon-only .next-nav-icon.next-icon .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-nav-embeddable.next-nav.next-hoz .next-menu-item-inner { height: 100%; } .next-nav-embeddable.next-nav.next-hoz .next-menu-sub-menu .next-menu-item, .next-nav-embeddable.next-nav.next-hoz .next-nav-item.next-menu-item { height: 100%; } .next-nav-embeddable, .next-nav-embeddable .next-nav-item.next-disabled, .next-nav-embeddable .next-nav-item.next-disabled .next-menu-item-text > a { background: transparent; border: none; } .next-nav[dir=rtl] .next-nav-icon.next-icon { margin-left: 4px; margin-right: 0; } .next-nav[dir=rtl] .next-nav-icon.next-icon:before, .next-nav[dir=rtl] .next-nav-icon.next-icon .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-nav[dir=rtl].next-hoz .next-menu-header { float: right; } .next-nav[dir=rtl].next-hoz .next-menu-footer { float: left; } .next-nav[dir=rtl].next-hoz .next-nav-item:before { width: 0; left: 50%; } .next-nav[dir=rtl].next-hoz .next-selected.next-nav-item:before { width: 100%; left: auto; right: 0; } .next-nav[dir=rtl].next-ver.next-left .next-nav-item:before { right: 0; right: -1px; left: auto; } .next-nav[dir=rtl].next-ver.next-right .next-nav-item:before { left: 0; left: -1px; right: auto; } .next-nav[dir=rtl].next-primary.next-ver.next-left .next-nav-item:before { right: 0; right: 0px; left: auto; } .next-nav[dir=rtl].next-primary.next-ver.next-right .next-nav-item:before { left: 0; left: 0px; right: auto; } .next-nav[dir=rtl].next-secondary.next-ver.next-left .next-nav-item:before { right: 0; right: 0px; left: auto; } .next-nav[dir=rtl].next-secondary.next-ver.next-right .next-nav-item:before { left: 0; left: 0px; right: auto; } .next-nav[dir=rtl] .next-nav.next-line.next-ver { border-top-color: transparent; border-right-color: transparent; border-left-color: transparent; border-bottom-color: transparent; } .next-nav[dir=rtl].next-icon-only .next-nav-icon.next-icon, .next-nav[dir=rtl].next-icon-only .next-nav-icon-only-arrow.next-icon, .next-nav[dir=rtl].next-icon-only .next-nav-item.next-opened .next-nav-icon-only-arrow.next-icon-arrow-down { margin-left: 0; margin-right: 1px; } .next-nav[dir=rtl].next-icon-only .next-nav-icon.next-icon:before, .next-nav[dir=rtl].next-icon-only .next-nav-icon.next-icon .next-icon-remote, .next-nav[dir=rtl].next-icon-only .next-nav-icon-only-arrow.next-icon:before, .next-nav[dir=rtl].next-icon-only .next-nav-icon-only-arrow.next-icon .next-icon-remote, .next-nav[dir=rtl].next-icon-only .next-nav-item.next-opened .next-nav-icon-only-arrow.next-icon-arrow-down:before, .next-nav[dir=rtl].next-icon-only .next-nav-item.next-opened .next-nav-icon-only-arrow.next-icon-arrow-down .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-number-picker { -webkit-box-sizing: border-box; box-sizing: border-box; display: inline-block; /* stylelint-disable declaration-no-important */ } .next-number-picker *, .next-number-picker *:before, .next-number-picker *:after { -webkit-box-sizing: border-box; box-sizing: border-box; } .next-number-picker .next-btn { padding: 0 !important; line-height: 0 !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .next-number-picker-normal .next-input { width: 100%; } .next-number-picker-normal .next-input .next-input-control { padding-right: 0; height: 100%; } .next-number-picker-normal:not(.next-number-picker-no-trigger) .next-input input { padding-right: 2px; } .next-number-picker-normal .next-btn { display: block; } .next-number-picker-normal .next-btn:hover { z-index: 1; } .next-number-picker-normal .next-btn:first-child { border-right: none; border-top: none; height: 50%; border-top-left-radius: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .next-number-picker-normal .next-btn:last-child { border-right: none; border-bottom: none; margin-top: -1px; height: calc(50% + 1px); border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 0; } .next-number-picker-normal .next-number-picker-handler { -webkit-transition: opacity 100ms linear; transition: opacity 100ms linear; height: 100%; display: block; } .next-number-picker-normal:not(.next-number-picker-show-trigger) .next-number-picker-handler { opacity: 0; } .next-number-picker-normal:hover .next-number-picker-handler, .next-number-picker-normal.hover .next-number-picker-handler { opacity: 1; } .next-number-picker-normal .next-input.next-disabled .next-number-picker-handler { opacity: 0; } .next-number-picker-normal .next-number-picker-up-icon::before { content: "\E625"; } .next-number-picker-normal .next-number-picker-down-icon::before { content: "\E63D"; } .next-number-picker-normal.next-small { width: 68px; } .next-number-picker-normal.next-small .next-btn { width: 20px; } .next-number-picker-normal.next-small .next-btn:first-child { border-top-right-radius: 3px; } .next-number-picker-normal.next-small .next-btn:last-child { border-bottom-right-radius: 3px; } .next-number-picker-normal.next-small .next-icon:before, .next-number-picker-normal.next-small .next-icon .next-icon-remote { width: 8px; font-size: 8px; line-height: inherit; } @media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) { .next-number-picker-normal.next-small .next-icon { -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); margin-left: -4px; margin-right: -4px; } .next-number-picker-normal.next-small .next-icon:before { width: 16px; font-size: 16px; } } .next-number-picker-normal.next-medium { width: 80px; } .next-number-picker-normal.next-medium .next-btn { width: 20px; } .next-number-picker-normal.next-medium .next-btn:first-child { border-top-right-radius: 3px; } .next-number-picker-normal.next-medium .next-btn:last-child { border-bottom-right-radius: 3px; } .next-number-picker-normal.next-medium .next-icon:before, .next-number-picker-normal.next-medium .next-icon .next-icon-remote { width: 8px; font-size: 8px; line-height: inherit; } @media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) { .next-number-picker-normal.next-medium .next-icon { -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); margin-left: -4px; margin-right: -4px; } .next-number-picker-normal.next-medium .next-icon:before { width: 16px; font-size: 16px; } } .next-number-picker-normal.next-large { width: 80px; } .next-number-picker-normal.next-large .next-btn { width: 20px; } .next-number-picker-normal.next-large .next-btn:first-child { border-top-right-radius: 3px; } .next-number-picker-normal.next-large .next-btn:last-child { border-bottom-right-radius: 3px; } .next-number-picker-normal.next-large .next-icon:before, .next-number-picker-normal.next-large .next-icon .next-icon-remote { width: 8px; font-size: 8px; line-height: inherit; } @media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) { .next-number-picker-normal.next-large .next-icon { -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); margin-left: -4px; margin-right: -4px; } .next-number-picker-normal.next-large .next-icon:before { width: 16px; font-size: 16px; } } .next-number-picker-inline input { text-align: center; } .next-number-picker-inline .next-input input { padding: 0; } .next-number-picker-inline .next-number-picker-add-icon::before { content: "\E655"; } .next-number-picker-inline .next-number-picker-minus-icon::before { content: "\E601"; } .next-number-picker-inline.next-small { width: 68px; min-width: 60px; } .next-number-picker-inline.next-small .next-icon:before, .next-number-picker-inline.next-small .next-icon .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-number-picker-inline.next-small .next-btn { height: 20px; } .next-number-picker-inline.next-small .next-before .next-btn { margin-right: 2px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .next-number-picker-inline.next-small .next-after .next-btn { margin-left: 2px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .next-number-picker-inline.next-medium { width: 100px; min-width: 84px; } .next-number-picker-inline.next-medium .next-icon:before, .next-number-picker-inline.next-medium .next-icon .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-number-picker-inline.next-medium .next-btn { height: 28px; } .next-number-picker-inline.next-medium .next-before .next-btn { margin-right: 2px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .next-number-picker-inline.next-medium .next-after .next-btn { margin-left: 2px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .next-number-picker-inline.next-large { width: 128px; min-width: 120px; } .next-number-picker-inline.next-large .next-icon:before, .next-number-picker-inline.next-large .next-icon .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-number-picker-inline.next-large .next-btn { height: 40px; } .next-number-picker-inline.next-large .next-before .next-btn { margin-right: 2px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .next-number-picker-inline.next-large .next-after .next-btn { margin-left: 2px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .next-number-picker-inline .next-btn.next-small { width: 20px; } .next-number-picker-inline .next-btn.next-medium { width: 28px; } .next-number-picker-inline .next-btn.next-large { width: 40px; } @-moz-document url-prefix() { .next-number-picker-normal.next-small .next-number-picker-handler { height: 18px; } .next-number-picker-normal.next-medium .next-number-picker-handler { height: 26px; } .next-number-picker-normal.next-large .next-number-picker-handler { height: 38px; } } .next-number-picker-normal[dir=rtl] .next-btn:first-child { border-right: 1px solid #C4C6CF; border-left: 0; border-top-right-radius: 0; } .next-number-picker-normal[dir=rtl] .next-btn:first-child.next-small { border-top-left-radius: 3px; } .next-number-picker-normal[dir=rtl] .next-btn:first-child.next-medium { border-top-left-radius: 3px; } .next-number-picker-normal[dir=rtl] .next-btn:first-child.next-large { border-top-left-radius: 3px; } .next-number-picker-normal[dir=rtl] .next-btn:last-child { border-right: 1px solid #C4C6CF; border-left: 0; border-bottom-right-radius: 0; } .next-number-picker-normal[dir=rtl] .next-btn:last-child.next-small { border-bottom-left-radius: 3px; } .next-number-picker-normal[dir=rtl] .next-btn:last-child.next-medium { border-bottom-left-radius: 3px; } .next-number-picker-normal[dir=rtl] .next-btn:last-child.next-large { border-bottom-left-radius: 3px; } .next-number-picker-normal[dir=rtl] .next-input .next-input-control { padding-left: 0; } .next-number-picker-inline[dir=rtl] .next-before .next-btn { margin-right: 0; } .next-number-picker-inline[dir=rtl] .next-before .next-btn.next-small { margin-left: 2px; border-top-right-radius: 3px !important; border-bottom-right-radius: 3px !important; } .next-number-picker-inline[dir=rtl] .next-before .next-btn.next-medium { margin-left: 2px; border-top-right-radius: 3px !important; border-bottom-right-radius: 3px !important; } .next-number-picker-inline[dir=rtl] .next-before .next-btn.next-large { margin-left: 2px; border-top-right-radius: 3px !important; border-bottom-right-radius: 3px !important; } .next-number-picker-inline[dir=rtl] .next-after .next-btn { margin-left: 0; } .next-number-picker-inline[dir=rtl] .next-after .next-btn.next-small { margin-right: 2px; border-top-left-radius: 3px !important; border-bottom-left-radius: 3px !important; } .next-number-picker-inline[dir=rtl] .next-after .next-btn.next-medium { margin-right: 2px; border-top-left-radius: 3px !important; border-bottom-left-radius: 3px !important; } .next-number-picker-inline[dir=rtl] .next-after .next-btn.next-large { margin-right: 2px; border-top-left-radius: 3px !important; border-bottom-left-radius: 3px !important; } .next-pagination[dir=rtl] .next-pagination-total { margin-right: 0; margin-left: 16px; } .next-pagination[dir=rtl] .next-pagination-jump-go { margin-left: 0; margin-right: 4px; } .next-pagination[dir=rtl] .next-pagination-size-selector-title { margin-right: 0; margin-left: 4px; } .next-pagination[dir=rtl] .next-pagination-size-selector-btn.next-btn-text + .next-pagination-size-selector-btn { border-left: none; border-right: 1px solid #DCDEE3; } .next-pagination[dir=rtl] .next-pagination-pages + .next-pagination-size-selector, .next-pagination[dir=rtl] .next-pagination-size-selector + .next-pagination-pages { margin-left: 0; margin-right: 40px; } .next-pagination[dir=rtl].next-start .next-pagination-pages { float: left; } .next-pagination[dir=rtl].next-start .next-pagination-size-selector { float: right; } .next-pagination[dir=rtl].next-end .next-pagination-pages { float: right; } .next-pagination[dir=rtl].next-end .next-pagination-size-selector { float: left; } .next-pagination[dir=rtl].next-small .next-pagination-list { margin: 0 4px; } .next-pagination[dir=rtl].next-small .next-pagination-total { line-height: 20px; vertical-align: middle; } .next-pagination[dir=rtl].next-small .next-pagination-item { padding: 0 6px; border-width: 1px; border-radius: 3px; } .next-pagination[dir=rtl].next-small .next-pagination-item + .next-pagination-item { margin: 0 4px 0 0; } .next-pagination[dir=rtl].next-small .next-pagination-ellipsis { height: 20px; line-height: 20px; margin-left: 8px; margin-right: 8px; } .next-pagination[dir=rtl].next-small .next-pagination-ellipsis:before, .next-pagination[dir=rtl].next-small .next-pagination-ellipsis .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-pagination[dir=rtl].next-small .next-pagination-display { font-size: 12px; } .next-pagination[dir=rtl].next-small .next-pagination-display em { font-size: 12px; } .next-pagination[dir=rtl].next-small .next-pagination-jump-text { font-size: 12px; } .next-pagination[dir=rtl].next-small .next-pagination-jump-input { width: 28px; } .next-pagination[dir=rtl].next-small .next-pagination-size-selector-title { height: 20px; line-height: 20px; font-size: 12px; vertical-align: middle; } .next-pagination[dir=rtl].next-small .next-pagination-size-selector-btn { padding: 0 8px; } .next-pagination[dir=rtl].next-small .next-pagination-item.next-prev:not([disabled]) i, .next-pagination[dir=rtl].next-small .next-pagination-item.next-next:not([disabled]) i { color: #666666; } .next-pagination[dir=rtl].next-small .next-pagination-item:hover.next-prev:not([disabled]) i, .next-pagination[dir=rtl].next-small .next-pagination-item:hover.next-next:not([disabled]) i { color: #333333; } .next-pagination[dir=rtl].next-medium .next-pagination-list { margin: 0 4px; } .next-pagination[dir=rtl].next-medium .next-pagination-total { line-height: 28px; vertical-align: middle; } .next-pagination[dir=rtl].next-medium .next-pagination-item { padding: 0 10px; border-width: 1px; border-radius: 3px; } .next-pagination[dir=rtl].next-medium .next-pagination-item + .next-pagination-item { margin: 0 4px 0 0; } .next-pagination[dir=rtl].next-medium .next-pagination-ellipsis { height: 28px; line-height: 28px; margin-left: 8px; margin-right: 8px; } .next-pagination[dir=rtl].next-medium .next-pagination-ellipsis:before, .next-pagination[dir=rtl].next-medium .next-pagination-ellipsis .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-pagination[dir=rtl].next-medium .next-pagination-display { font-size: 12px; } .next-pagination[dir=rtl].next-medium .next-pagination-display em { font-size: 12px; } .next-pagination[dir=rtl].next-medium .next-pagination-jump-text { font-size: 12px; } .next-pagination[dir=rtl].next-medium .next-pagination-jump-input { width: 36px; } .next-pagination[dir=rtl].next-medium .next-pagination-size-selector-title { height: 28px; line-height: 28px; font-size: 12px; vertical-align: middle; } .next-pagination[dir=rtl].next-medium .next-pagination-size-selector-btn { padding: 0 12px; } .next-pagination[dir=rtl].next-medium .next-pagination-item.next-prev:not([disabled]) i, .next-pagination[dir=rtl].next-medium .next-pagination-item.next-next:not([disabled]) i { color: #666666; } .next-pagination[dir=rtl].next-medium .next-pagination-item:hover.next-prev:not([disabled]) i, .next-pagination[dir=rtl].next-medium .next-pagination-item:hover.next-next:not([disabled]) i { color: #333333; } .next-pagination[dir=rtl].next-large .next-pagination-list { margin: 0 8px; } .next-pagination[dir=rtl].next-large .next-pagination-total { line-height: 40px; vertical-align: middle; } .next-pagination[dir=rtl].next-large .next-pagination-item { padding: 0 15px; border-width: 1px; border-radius: 3px; } .next-pagination[dir=rtl].next-large .next-pagination-item + .next-pagination-item { margin: 0 8px 0 0; } .next-pagination[dir=rtl].next-large .next-pagination-ellipsis { height: 40px; line-height: 40px; margin-left: 8px; margin-right: 8px; } .next-pagination[dir=rtl].next-large .next-pagination-ellipsis:before, .next-pagination[dir=rtl].next-large .next-pagination-ellipsis .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-pagination[dir=rtl].next-large .next-pagination-display { font-size: 16px; } .next-pagination[dir=rtl].next-large .next-pagination-display em { font-size: 16px; } .next-pagination[dir=rtl].next-large .next-pagination-jump-text { font-size: 16px; } .next-pagination[dir=rtl].next-large .next-pagination-jump-input { width: 48px; } .next-pagination[dir=rtl].next-large .next-pagination-size-selector-title { height: 40px; line-height: 40px; font-size: 16px; vertical-align: middle; } .next-pagination[dir=rtl].next-large .next-pagination-size-selector-btn { padding: 0 16px; } .next-pagination[dir=rtl].next-large .next-pagination-item.next-prev:not([disabled]) i, .next-pagination[dir=rtl].next-large .next-pagination-item.next-next:not([disabled]) i { color: #666666; } .next-pagination[dir=rtl].next-large .next-pagination-item:hover.next-prev:not([disabled]) i, .next-pagination[dir=rtl].next-large .next-pagination-item:hover.next-next:not([disabled]) i { color: #333333; } .next-pagination { -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 0; } .next-pagination *, .next-pagination *:before, .next-pagination *:after { -webkit-box-sizing: border-box; box-sizing: border-box; } .next-pagination:after { visibility: hidden; display: block; height: 0; font-size: 0; content: " "; clear: both; } .next-pagination-total { display: inline-block; font-size: 14px; margin-right: 16px; } .next-pagination-pages { display: inline-block; } .next-pagination-list { display: inline-block; vertical-align: top; } .next-pagination .next-pagination-item:not([disabled]) { display: inline-block; border-style: solid; border-color: #C4C6CF; background: #FFFFFF; color: #333333; -webkit-box-shadow: none; box-shadow: none; } .next-pagination .next-pagination-item { -webkit-transition: none; transition: none; } .next-pagination .next-pagination-item.next-current { border-color: #5584FF; background: #5584FF; color: #FFFFFF; -webkit-box-shadow: none; box-shadow: none; } .next-pagination .next-pagination-item.next-current:hover, .next-pagination .next-pagination-item.next-current:focus { border-color: transparent; background: #3E71F7; color: #FFFFFF; -webkit-box-shadow: none; box-shadow: none; } .next-pagination-ellipsis { display: inline-block; color: #999999; vertical-align: top; } .next-pagination-display { display: inline-block; margin: 0 16px; color: #333333; vertical-align: middle; } .next-pagination-display em { font-style: normal; color: #5584FF; } .next-pagination-jump-text { display: inline-block; vertical-align: middle; color: #999999; } .next-pagination-jump-input { margin: 0 4px; vertical-align: top; } .next-pagination-jump-go { margin-left: 4px; vertical-align: top; } .next-pagination-size-selector { display: inline-block; position: relative; } .next-pagination-size-selector-title { margin-right: 4px; color: #999999; } .next-pagination-size-selector-filter { display: inline-block; vertical-align: middle; } .next-pagination-size-selector-dropdown { vertical-align: top; min-width: 64px; } .next-pagination-size-selector-dropdown .next-select-inner { min-width: 64px; } .next-pagination-size-selector-popup { min-width: 64px; } .next-pagination-size-selector-btn.next-btn-text { height: initial; line-height: initial; color: #666666; border-radius: 0; } .next-pagination-size-selector-btn.next-btn-text.next-current { color: #5584FF; } .next-pagination-size-selector-btn.next-btn-text + .next-pagination-size-selector-btn { border-left: 1px solid #DCDEE3; } .next-pagination-pages + .next-pagination-size-selector, .next-pagination-size-selector + .next-pagination-pages { margin-left: 40px; } .next-pagination.next-hide { display: none; } .next-pagination.next-start .next-pagination-pages { float: right; } .next-pagination.next-start .next-pagination-size-selector { float: left; } .next-pagination.next-end .next-pagination-pages { float: left; } .next-pagination.next-end .next-pagination-size-selector { float: right; } .next-pagination.next-small .next-pagination-list { margin: 0 4px; } .next-pagination.next-small .next-pagination-total { line-height: 20px; vertical-align: middle; } .next-pagination.next-small .next-pagination-item { padding: 0 6px; border-width: 1px; border-radius: 3px; } .next-pagination.next-small .next-pagination-item + .next-pagination-item { margin: 0 0 0 4px; } .next-pagination.next-small .next-pagination-ellipsis { height: 20px; line-height: 20px; margin-left: 8px; margin-right: 8px; } .next-pagination.next-small .next-pagination-ellipsis:before, .next-pagination.next-small .next-pagination-ellipsis .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-pagination.next-small .next-pagination-display { font-size: 12px; } .next-pagination.next-small .next-pagination-display em { font-size: 12px; } .next-pagination.next-small .next-pagination-jump-text { font-size: 12px; } .next-pagination.next-small .next-pagination-jump-input { width: 28px; } .next-pagination.next-small .next-pagination-size-selector-title { height: 20px; line-height: 20px; font-size: 12px; vertical-align: middle; } .next-pagination.next-small .next-pagination-size-selector-btn { padding: 0 8px; } .next-pagination.next-small .next-pagination-item.next-prev:not([disabled]) i, .next-pagination.next-small .next-pagination-item.next-next:not([disabled]) i { color: #666666; } .next-pagination.next-small .next-pagination-item:hover.next-prev:not([disabled]) i, .next-pagination.next-small .next-pagination-item:hover.next-next:not([disabled]) i { color: #333333; } .next-pagination.next-small.next-arrow-only .next-pagination-item.next-prev, .next-pagination.next-small.next-arrow-only .next-pagination-item.next-next { width: 20px; padding: 0; } .next-pagination.next-small.next-arrow-only .next-pagination-item.next-prev .next-icon, .next-pagination.next-small.next-arrow-only .next-pagination-item.next-next .next-icon { margin: 0 auto; } .next-pagination.next-small.next-arrow-prev-only .next-pagination-item.next-prev { width: 20px; padding: 0; } .next-pagination.next-small.next-arrow-prev-only .next-pagination-item.next-prev .next-icon { margin: 0 auto; } .next-pagination.next-small.next-no-border .next-pagination-item.next-prev, .next-pagination.next-small.next-no-border .next-pagination-item.next-next { padding: 0; border: none; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; } .next-pagination.next-small.next-no-border .next-pagination-item.next-prev .next-icon, .next-pagination.next-small.next-no-border .next-pagination-item.next-next .next-icon { margin: 0; } .next-pagination.next-small.next-no-border .next-pagination-item.next-prev:not([disabled]):hover i, .next-pagination.next-small.next-no-border .next-pagination-item.next-next:not([disabled]):hover i { color: #5584FF; } .next-pagination.next-small.next-no-border .next-pagination-display { margin: 0 8px; } .next-pagination.next-small.next-mini .next-pagination-item.next-prev { margin-right: 4px; } .next-pagination.next-small.next-mini .next-pagination-item.next-next { margin-left: 4px; } .next-pagination.next-medium .next-pagination-list { margin: 0 4px; } .next-pagination.next-medium .next-pagination-total { line-height: 28px; vertical-align: middle; } .next-pagination.next-medium .next-pagination-item { padding: 0 10px; border-width: 1px; border-radius: 3px; } .next-pagination.next-medium .next-pagination-item + .next-pagination-item { margin: 0 0 0 4px; } .next-pagination.next-medium .next-pagination-ellipsis { height: 28px; line-height: 28px; margin-left: 8px; margin-right: 8px; } .next-pagination.next-medium .next-pagination-ellipsis:before, .next-pagination.next-medium .next-pagination-ellipsis .next-icon-remote { width: 12px; font-size: 12px; line-height: inherit; } .next-pagination.next-medium .next-pagination-display { font-size: 12px; } .next-pagination.next-medium .next-pagination-display em { font-size: 12px; } .next-pagination.next-medium .next-pagination-jump-text { font-size: 12px; } .next-pagination.next-medium .next-pagination-jump-input { width: 36px; } .next-pagination.next-medium .next-pagination-size-selector-title { height: 28px; line-height: 28px; font-size: 12px; vertical-align: middle; } .next-pagination.next-medium .next-pagination-size-selector-btn { padding: 0 12px; } .next-pagination.next-medium .next-pagination-item.next-prev:not([disabled]) i, .next-pagination.next-medium .next-pagination-item.next-next:not([disabled]) i { color: #666666; } .next-pagination.next-medium .next-pagination-item:hover.next-prev:not([disabled]) i, .next-pagination.next-medium .next-pagination-item:hover.next-next:not([disabled]) i { color: #333333; } .next-pagination.next-medium.next-arrow-only .next-pagination-item.next-prev, .next-pagination.next-medium.next-arrow-only .next-pagination-item.next-next { width: 28px; padding: 0; } .next-pagination.next-medium.next-arrow-only .next-pagination-item.next-prev .next-icon, .next-pagination.next-medium.next-arrow-only .next-pagination-item.next-next .next-icon { margin: 0 auto; } .next-pagination.next-medium.next-arrow-prev-only .next-pagination-item.next-prev { width: 28px; padding: 0; } .next-pagination.next-medium.next-arrow-prev-only .next-pagination-item.next-prev .next-icon { margin: 0 auto; } .next-pagination.next-medium.next-no-border .next-pagination-item.next-prev, .next-pagination.next-medium.next-no-border .next-pagination-item.next-next { padding: 0; border: none; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; } .next-pagination.next-medium.next-no-border .next-pagination-item.next-prev .next-icon, .next-pagination.next-medium.next-no-border .next-pagination-item.next-next .next-icon { margin: 0; } .next-pagination.next-medium.next-no-border .next-pagination-item.next-prev:not([disabled]):hover i, .next-pagination.next-medium.next-no-border .next-pagination-item.next-next:not([disabled]):hover i { color: #5584FF; } .next-pagination.next-medium.next-no-border .next-pagination-display { margin: 0 12px; } .next-pagination.next-medium.next-mini .next-pagination-item.next-prev { margin-right: 4px; } .next-pagination.next-medium.next-mini .next-pagination-item.next-next { margin-left: 4px; } .next-pagination.next-large .next-pagination-list { margin: 0 8px; } .next-pagination.next-large .next-pagination-total { line-height: 40px; vertical-align: middle; } .next-pagination.next-large .next-pagination-item { padding: 0 15px; border-width: 1px; border-radius: 3px; } .next-pagination.next-large .next-pagination-item + .next-pagination-item { margin: 0 0 0 8px; } .next-pagination.next-large .next-pagination-ellipsis { height: 40px; line-height: 40px; margin-left: 8px; margin-right: 8px; } .next-pagination.next-large .next-pagination-ellipsis:before, .next-pagination.next-large .next-pagination-ellipsis .next-icon-remote { width: 16px; font-size: 16px; line-height: inherit; } .next-pagination.next-large .next-pagination-display { font-size: 16px; } .next-pagination.next-large .next-pagination-display em { font-size: 16px; } .next-pagination.next-large .next-pagination-jump-text { font-size: 16px; } .next-pagination.next-large .next-pagination-jump-input { width: 48px; } .next-pagination.next-large .next-pagination-size-selector-title { height: 40px; line-height: 40px; font-size: 16px; vertical-align: middle; } .next-pagination.next-large .next-pagination-size-selector-btn { padding: 0 16px; } .next-pagination.next-large .next-pagination-item.next-prev:not([disabled]) i, .next-pagination.next-large .next-pagination-item.next-next:not([disabled]) i { color: #666666; } .next-pagination.next-large .next-pagination-item:hover.next-prev:not([disabled]) i, .next-pagination.next-large .next-pagination-item:hover.next-next:not([disabled]) i { color: #333333; } .next-pagination.next-large.next-arrow-only .next-pagination-item.next-prev, .next-pagination.next-large.next-arrow-only .next-pagination-item.next-next { width: 40px; padding: 0; } .next-pagination.next-large.next-arrow-only .next-pagination-item.next-prev .next-icon, .next-pagination.next-large.next-arrow-only .next-pagination-item.next-next .next-icon { margin: 0 auto; } .next-pagination.next-large.next-arrow-prev-only .next-pagination-item.next-prev { width: 40px; padding: 0; } .next-pagination.next-large.next-arrow-prev-only .next-pagination-item.next-prev .next-icon { margin: 0 auto; } .next-pagination.next-large.next-no-border .next-pagination-item.next-prev, .next-pagination.next-large.next-no-border .next-pagination-item.next-next { padding: 0; border: none; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; } .next-pagination.next-large.next-no-border .next-pagination-item.next-prev .next-icon, .next-pagination.next-large.next-no-border .next-pagination-item.next-next .next-icon { margin: 0; } .next-pagination.next-large.next-no-border .next-pagination-item.next-prev:not([disabled]):hover i, .next-pagination.next-large.next-no-border .next-pagination-item.next-next:not([disabled]):hover i { color: #5584FF; } .next-pagination.next-large.next-no-border .next-pagination-display { margin: 0 16px; } .next-pagination.next-large.next-mini .next-pagination-item.next-prev { margin-right: 8px; } .next-pagination.next-large.next-mini .next-pagination-item.next-next { margin-left: 8px; } .next-pagination-icon-prev::before { content: "\E61D"; } .next-pagination-icon-next::before { content: "\E619"; } .next-pagination-icon-ellipsis::before { content: "\E654"; } .next-paragraph { color: #333333; } .next-paragraph-short { line-height: 1.5; } .next-paragraph-long { line-height: 1.7; } .next-paragraph-small { font-size: 12px; } .next-paragraph-medium { font-size: 14px; } .next-progress-circle[dir=rtl] .next-progress-circle-container { -webkit-transform: scaleX(-1); -ms-transform: scaleX(-1); transform: scaleX(-1); } .next-progress-line[dir=rtl] .next-progress-line-overlay { left: auto; right: 0; } .next-progress-line { -webkit-box-sizing: border-box; box-sizing: border-box; } .next-progress-line *, .next-progress-line *:before, .next-progress-line *:after { -webkit-box-sizing: border-box; box-sizing: border-box; } .next-progress-line { width: 100%; display: inline-block; position: relative; } .next-progress-line-container { display: inline-block; width: 100%; vertical-align: middle; } .next-progress-line-underlay { position: relative; overflow: hidden; width: 100%; background: #EBECF0; } .next-progress-line-overlay { position: absolute; left: 0; top: 0; -webkit-transition: all 300ms ease; transition: all 300ms ease; } .next-progress-line-overlay-normal { background: #5584FF; } .next-progress-line-overlay-success { background: #46BC15; } .next-progress-line-overlay-error { background: #FF3000; } .next-progress-line-overlay-started { background: #FF3000; } .next-progress-line-overlay-middle { background: #FF9300; } .next-progress-line-overlay-finishing { background: #46BC15; } .next-progress-line.next-small .next-progress-line-underlay { border-radius: 20px; height: 4px; } .next-progress-line.next-small .next-progress-line-overlay { height: 4px; border-radius: 20px; top: 50%; margin-top: -2px; } .next-progress-line.next-small .next-progress-line-text { font-size: 12px; line-height: 4px; } .next-progress-line.next-medium .next-progress-line-underlay { border-radius: 20px; height: 8px; } .next-progress-line.next-medium .next-progress-line-overlay { height: 8px; border-radius: 20px; top: 50%; margin-top: -4px; } .next-progress-line.next-medium .next-progress-line-text { font-size: 12px; line-height: 8px; } .next-progress-line.next-large .next-progress-line-underlay { border-radius: 20px; height: 12px; } .next-progress-line.next-large .next-progress-line-overlay { height: 12px; border-radius: 20px; top: 50%; margin-top: -6px; } .next-progress-line.next-large .next-progress-line-text { font-size: 12px; line-height: 12px; } .next-progress-line-show-info .next-progress-line-container { padding-right: 60px; margin-right: -60px; } .next-progress-line-show-info .next-progress-line-text { width: 50px; text-align: left; margin-left: 10px; vertical-align: middle; display: inline-block; color: #333333; } .next-progress-line-show-border .next-progress-line-underlay { border: 1px solid #DCDEE3; } .next-progress-line-show-border.next-small .next-progress-line-underlay { border-radius: 20px; height: 6px; } .next-progress-line-show-border.next-small .next-progress-line-overlay { height: 4px; border-radius: 20px; top: 50%; margin-top: -2px; } .next-progress-line-show-border.next-small .next-progress-line-text { font-size: 12px; line-height: 6px; } .next-progress-line-show-border.next-medium .next-progress-line-underlay { border-radius: 20px; height: 10px; } .next-progress-line-show-border.next-medium .next-progress-line-overlay { height: 8px; border-radius: 20px; top: 50%; margin-top: -4px; } .next-progress-line-show-border.next-medium .next-progress-line-text { font-size: 12px; line-height: 10px; } .next-progress-line-show-border.next-large .next-progress-line-underlay { border-radius: 20px; height: 14px; } .next-progress-line-show-border.next-large .next-progress-line-overlay { height: 12px; border-radius: 20px; top: 50%; margin-top: -6px; } .next-progress-line-show-border.next-large .next-progress-line-text { font-size: 12px; line-height: 14px; } .next-progress-circle { -webkit-box-sizing: border-box; box-sizing: border-box; } .next-progress-circle *, .next-progress-circle *:before, .next-progress-circle *:after { -webkit-