@charset "UTF-8";

@font-face {
    font-family: swiper-icons;
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.swiper-container-vertical>.swiper-wrapper {
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: initial
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    transform: translateZ(0)
}

.swiper-container-multirow>.swiper-wrapper {
    flex-wrap: wrap
}

.swiper-container-multirow-column>.swiper-wrapper {
    flex-wrap: wrap;
    flex-direction: column
}

.swiper-container-free-mode>.swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-container-pointer-events {
    touch-action: pan-y
}

.swiper-container-pointer-events.swiper-container-vertical {
    touch-action: pan-x
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height
}

.swiper-container-3d {
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(270deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(90deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-css-mode>.swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-container-css-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: start start
}

.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper {
    scroll-snap-type: x mandatory
}

.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper {
    scroll-snap-type: y mandatory
}

:root {
    --swiper-navigation-size: 44px
}

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color))
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: normal;
    line-height: 1
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    left: 10px;
    right: auto
}

.swiper-button-prev:after,
.swiper-container-rtl .swiper-button-next:after {
    content: "prev"
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    right: 10px;
    left: auto
}

.swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
    content: "next"
}

.swiper-button-next.swiper-button-white,
.swiper-button-prev.swiper-button-white {
    --swiper-navigation-color: #fff
}

.swiper-button-next.swiper-button-black,
.swiper-button-prev.swiper-button-black {
    --swiper-navigation-color: #000
}

.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: opacity .3s;
    transform: translateZ(0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(.33)
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    background: #000;
    opacity: .2
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--swiper-pagination-color, var(--swiper-theme-color))
}

.swiper-container-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0, -50%, 0)
}

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: transform .2s, top .2s
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: transform .2s, left .2s
}

.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: transform .2s, right .2s
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top
}

.swiper-container-horizontal>.swiper-pagination-progressbar,
.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-container-vertical>.swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-white {
    --swiper-pagination-color: #fff
}

.swiper-pagination-black {
    --swiper-pagination-color: #000
}

.swiper-pagination-lock {
    display: none
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, .1)
}

.swiper-container-horizontal>.swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical>.swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, .5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-scrollbar-lock {
    display: none
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center
}

.swiper-zoom-container>canvas,
.swiper-zoom-container>img,
.swiper-zoom-container>svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

.swiper-slide-zoomed {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s linear infinite;
    box-sizing: border-box;
    border-radius: 50%;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-top: 4px solid transparent
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #000
}

@keyframes swiper-preloader-spin {
    to {
        transform: rotate(1turn)
    }
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube {
    overflow: visible
}

.swiper-container-cube .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%
}

.swiper-container-cube .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    z-index: 0
}

.swiper-container-cube .swiper-cube-shadow:before {
    content: "";
    background: #000;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    filter: blur(50px)
}

.swiper-container-flip {
    overflow: visible
}

.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.frameColorBorderActive {
    border: 4px solid #029c36 !important
}

.frameColorBorder {
    border: 4px solid #619171
}

.previewColorBorderActive {
    border: 3px solid #d7d7d7 !important
}

.details-space-gray2 {
    background: #ededea;
    padding: 0 15px 12px 21px;
    border-radius: 4px;
    display: flex;
    align-items: center
}

body {
    background-color: #fff !important
}

.left_labelDEMO {
    font-family: Product Sans, Arial, sans-serif;
    color: #125498;
    font-weight: 700;
    margin: 0;
    font-size: 16px;
    white-space: nowrap
}

.details-space-grayDEMO {
    background: #e3e3e3;
    padding: 12px 15px 12px 21px;
    border-radius: 4px;
    display: flex;
    align-items: center
}

.sticky-header {
    position: fixed;
    position: -webkit-sticky;
    top: 70px;
    z-index: 999;
    background-color: #fff;
    width: 530px;
    box-shadow: -2px 11px 5px -6px #d4d4d4;
    animation: smoothScroll 1s forwards
}

.leftpanelcls {
    width: calc(100% - 584px);
    padding: 18px 0 0 30px;
    background: #fff
}

.rightpanelcls {
    width: 584px;
    background-color: #fff;
    padding-right: 50px;
    padding-left: 0
}

.breadcrumb-title {
    color: #919090;
    font-size: 10px;
    padding: 0
}

.breadcrumb-title a {
    color: #919090;
    font-size: 10px;
    font-family: Product Sans, Arial, sans-serif
}

.seo-productdetails {
    color: #464646;
    font-size: 10px;
    height: 38px;
    padding: 0
}

.uploadimg {
    width: 45%;
    cursor: pointer
}

.slider_area {
    padding: 17px 0 0
}

.main_img_preview {
    padding-top: 4px;
    min-height: 500px;
    display: block;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.imgUpdRows {
    padding: 20px 0
}

.bg-imagesize_newcls {
    background: url(https://www.arttoframe.com/images/ProductPageSprites.png) -186px -10px;
    width: 26px;
    height: 22px;
    padding: 4px 13px
}

.bg-outerdimension_newcls {
    background: url(https://www.arttoframe.com/images/ProductPageSprites.png) -35px -452px;
    width: 26px;
    height: 22px;
    padding: 6px 15px
}

.details-label {
    font-size: 12px;
    color: #646464;
    text-align: center;
    display: inline-block;
    padding-top: 12px
}

.productType_cls {
    font-size: 22px;
    color: #363636;
    margin: 0;
    padding: 0;
    font-family: Product Sans, Arial, sans;
    display: flex;
    align-items: center
}

.add-to-cartbtn,
.addtocartbtnwithQty {
    font-family: Product Sans, Arial, sans !important;
    color: #fff;
    background: #169c4c !important;
    height: 42px;
    border-radius: 3px;
    padding: 0;
    text-align: center;
    margin-bottom: 11px;
    width: 34%;
    float: right
}

.Qtyname,
.Quantity {
    height: 42px;
    color: #000;
    padding: 1px 0
}

.cartquantityinput,
.cartquantityinput_1 {
    width: 32px;
    margin: 9px 13px;
    text-align: center;
    border-radius: 3px;
    border: none
}

.addtocartag {
    font-size: 18px;
    height: 42px;
    padding: 9px 0;
    text-align: left
}

.addtocartag a,
.seeAllframe {
    color: #fff;
    font-family: Product Sans, Arial, sans-serif
}

.TopAddToCartBtn {
    padding-top: 17px;
    padding-bottom: 15px;
    padding-left: 0
}

.price-text,
.price-txt {
    font-size: 25px;
    color: #363636;
    font-weight: 400
}

.left_label {
    font-family: Product Sans, Arial, sans-serif;
    color: #125498;
    font-weight: 700;
    font-size: 16px;
    white-space: nowrap;
    margin: 2px 0 0 10px
}

.details-space-gray {
    background: #ededea;
    padding: 12px 10px;
    border-radius: 4px;
    display: -webkit-box;
    display: block;
    align-items: center
}

.MoreInfo_text {
    font-family: Product Sans, Arial, sans !important;
    font-size: 13px !important;
    color: #262626;
    font-weight: 400;
    padding: 0 9px
}

.MoreInfo_text img {
    max-width: 100%;
    padding: 0 4px
}

.tooltiptext {
    background: #f7f7f7;
    position: absolute;
    top: 19px;
    left: -81px;
    width: 375px;
    border-radius: 7px;
    box-shadow: 6px 9px 10px -3px rgba(0, 0, 0, .32);
    z-index: 99999;
    min-height: 95px;
    padding: 20px
}

.tooltiptext p {
    font-family: Product Sans, Arial, sans !important;
    font-size: 14px !important;
    color: #204998 !important;
    margin: 0 !important;
    line-height: normal !important;
    text-align: left !important;
    padding: 0 !important;
    line-height: 1.8 !important
}

.sizeBox {
    width: 24%;
    color: #000;
    font-weight: 700;
    margin-left: 5px;
    margin-top: -3px;
    border-radius: 3px;
    border: 1px solid #d7d7d7;
    height: 26px
}

.OKBTN,
.OKBTN2,
.OKBTN3,
.seeAllopening {
    background: #125498;
    color: #fff;
    font-family: Product Sans, Arial, sans !important;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    font-size: 15px;
    padding: 4px 8px 4.4px;
    top: 8px
}

.bottom-margin {
    margin-bottom: 16px
}

.seeall_btn {
    font-family: Product Sans, Arial, sans-serif;
    font-size: 12px;
    cursor: pointer;
    float: right;
    color: #fff;
    background: #125498;
    border-radius: 3px;
    text-decoration: none;
    padding: 3px 16px;
    height: 25px;
    border: 1px solid #125498;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center
}

.bx-shadow {
    border-radius: 4px;
    box-shadow: 0 4px 4px -1px rgba(0, 0, 0, .29)
}

.select-frame-cls {
    padding: 7px 10px 7px 11px;
    background: #fcfafa;
    border-top: 1px solid #cfcece;
    border-bottom: 1px solid #cfcece
}

.color-filter-cls {
    width: 21%;
    padding: 0
}

.blank-cls {
    width: 24.5%
}

.styled-select {
    cursor: pointer;
    margin: 0 3px;
    width: 100%
}

.styled-select select {
    background: #fff url(https://www.arttoframe.com/images/dropdown_arrow.svg);
    border: 1px solid #a5a5a5;
    font-size: 11px;
    line-height: 1;
    width: 100% !important;
    color: #747474;
    height: 21px;
    padding: 0 7px;
    cursor: pointer;
    border-radius: 2px;
    font-family: Product Sans, Arial, sans !important;
    -webkit-appearance: none;
    background-repeat: no-repeat;
    background-position: 96%
}

#popUp_info_name,
.glass_typ_title,
.hardware_option,
.input_titlefor_mat,
.input_titlefor_mat p,
.sel_glass,
.styled-select select,
.validbtn {
    text-transform: uppercase
}

.clsleft {
    float: left
}

.searchbox {
    border: 1px solid #a5a5a5;
    border-radius: 2px !important;
    float: right;
    margin-top: 0;
    height: 21px;
    font-size: 14px;
    padding-left: 4px;
    padding-right: 35px;
    width: 100%;
    color: #6e6e6e;
    cursor: pointer;
    font-family: Product Sans, Arial, sans !important
}

.bg-searchRepeat {
    background: url(https://www.arttoframe.com/images/Zoom-ic.svg) right 5px top 10px !important
}

.bg-searchRepeated {
    height: 30px !important;
    top: -5px;
    width: 30px;
    right: 1px !important;
    position: absolute
}

.bg-search {
    background: url(https://www.arttoframe.com/images/search-icon-new.png) right 19px top 10px;
    background-repeat: no-repeat !important
}

.frameDivs {
    width: 95px !important;
    margin-top: 0 !important;
    float: left;
    cursor: pointer;
    height: 170px
}

.frameDivs img {
    max-width: 80px;
    max-height: 80px;
    display: block;
    margin: 0 auto;
    height: 80px;
    width: 80px
}

.frameColorRoundActive {
    border: 4px solid #029c36
}

.frameColorRound {
    border: 4px solid #fff
}

.frameColorRound:hover,
.matColorRound:hover {
    border: 4px solid #909090
}

.matColorRound:hover,
.readinfo-txt {
    cursor: pointer
}

.readinfo-txt {
    font-size: 12px;
    font-family: Product Sans, Arial, sans !important;
    margin: 0;
    color: #8b8b8b;
    font-weight: 400;
    padding-left: 14px
}

.ReadInfo-tooltiptext {
    background: #f7f7f7;
    position: absolute;
    top: 19px;
    left: -5px;
    width: 323px;
    border-radius: 7px;
    box-shadow: 6px 9px 10px -3px rgba(0, 0, 0, .32);
    z-index: 99;
    min-height: 82px;
    padding: 20px;
    text-transform: none
}

.ReadInfo-tooltiptext p {
    font-family: Product Sans, Arial, sans !important;
    font-size: 14px !important;
    color: #204998 !important;
    margin: 0 !important;
    line-height: normal !important;
    text-align: left !important;
    padding: 0 !important;
    line-height: 1.8 !important;
    font-weight: 400;
    white-space: normal
}

#advanceOptionMode {
    padding: 0
}

.advance_matoption {
    cursor: pointer;
    position: relative;
    right: 0;
    top: 0;
    background: #656565
}

.bg-setting_advance {
    background: url(https://www.arttoframe.com/images/ProductPageSprites.png) -230px -303px;
    width: 15px;
    height: 11px;
    padding: 0 10px
}

.advance_matoption,
.seeallmatsetting {
    cursor: pointer;
    float: right;
    color: #fff;
    padding: 4px !important;
    border-radius: 3px;
    text-decoration: none;
    font-family: Product Sans, Arial, sans-serif !important;
    font-size: 10px;
    height: 21px;
    display: flex;
    align-items: center
}

.chat-now_btm {
    display: none
}

#seeallLoader_2 {
    width: 10px;
    height: 10px;
    margin: -24px auto;
    display: none
}

.bottomleftLabel.active,
.noftLabel.active,
.topleftLabel.active {
    background: url(https://www.arttoframe.com/images/switch_on.svg) 3px 4px no-repeat transparent
}

.bottomleftLabel,
.noftLabel,
.topleftLabel {
    height: 25px;
    margin-top: 4px;
    width: 35px;
    float: left;
    margin-left: 0;
    background: url(https://www.arttoframe.com/images/switch_Off.svg) 3px 4px no-repeat transparent
}

.matsTab_new {
    height: 37px;
    border-top: 7px solid #b5b5b5;
    background: #e0e0e0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    outline: 1px solid #fff
}

#bottomMatDiv,
#noMatDiv,
#topMatDiv {
    color: #363636;
    font-size: 14px;
    font-weight: 400;
    text-transform: capitalize
}

.active_no_matsClss {
    padding: 0;
    text-transform: uppercase;
    text-align: center;
    border-top: 7px solid #029c36;
    outline: 1px solid #fff
}

.matsTab label.active,
.noftLabel {
    left: 20px;
    top: -1px
}

.bottomleftLabel,
.topleftLabel {
    background: url(https://www.arttoframe.com/images/switch_Off.svg) 3px 4px no-repeat transparent
}

.styled-select {
    border: 0 solid #ccc;
    margin-top: -2px !important;
    border-radius: 2px;
    height: 21px
}

.matType-space {
    padding: 10px 0 10px 14px
}

.advancemat-dropdown {
    padding: 0
}

.bg-searchRepeat {
    height: 30px !important;
    top: -5px;
    width: 30px;
    right: 1px !important;
    position: absolute
}

.bg-search {
    background: url(https://www.arttoframe.com/images/Zoom-ic.svg) right 19px top 10px;
    width: 35px;
    height: 35px;
    padding: 8px 14px;
    background-repeat: no-repeat
}

.searchbox::-webkit-input-placeholder {
    color: #aeadad !important;
    font-family: Product Sans, Arial, sans !important
}

.searchbox:-ms-input-placeholder {
    color: #aeadad !important;
    font-family: Product Sans, Arial, sans !important
}

.searchbox::-moz-input-placeholder {
    color: #aeadad !important;
    font-family: Product Sans, Arial, sans !important
}

.matColorRound {
    width: 43px;
    height: 43px;
    border: 1px solid #d3d3d3;
    background: url(https://www.arttoframe.com/mat-color-pattern/89.jpg);
    border-radius: 50%;
    background-origin: border-box
}

.matColorRound,
.matColorRound_new {
    padding: 0;
    margin: 0 auto;
    cursor: pointer
}

.matColorRound_new {
    width: 63px;
    height: 63px;
    border-radius: 50%;
    background-origin: border-box;
    border: 1px solid #c2c2c2
}

.matColorRoundActive_new {
    width: 63px;
    height: 63px;
    border: 4px solid #039d36 !important;
    margin: 0 auto;
    border-radius: 50%;
    padding: 3px;
    border: 3px solid #000
}

.matColorRoundActive {
    width: 43px;
    height: 43px;
    border: 4px solid #039d36;
    background: url(https://www.arttoframe.com/mat-color-pattern/89.jpg);
    margin: 0 auto;
    border-radius: 50%
}

.MatNameCls {
    font-family: Product Sans, Arial, sans-serif;
    color: #797979;
    font-size: 9px;
    font-weight: 600;
    padding: 6px 0;
    text-align: center
}

.matfilter {
    width: 51px;
    float: left;
    text-align: center;
    display: block;
    margin: 0 15px 0 auto
}

.parentTopContainer {
    padding: 19px 13px 10px
}

.hdwparent-cls {
    background: #ededea;
    border-radius: 4px;
    padding: 0 5px;
    box-shadow: 0 4px 4px -1px rgba(0, 0, 0, .29)
}

.hardware_option {
    color: #125498 !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    text-align: center !important;
    font-family: Product Sans, Arial, sans !important;
    padding: 3px 0 !important;
    text-transform: capitalize !important;
    margin: 0 !important
}

.product-info-icon {
    float: right;
    padding-top: 4px;
    padding-right: 4px;
    cursor: pointer
}

.newdivider_line {
    margin: 0 0 10px;
    border-top: 1px solid #dfdfdf
}

.selectedglass_labelmore {
    border: 1px solid #aeaeae;
    background: #fff;
    color: #4d4d4d !important;
    padding: 0 7px;
    font-size: 14px !important;
    cursor: pointer;
    border-radius: 3px;
    font-family: Product Sans, Arial, sans !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 94%;
    margin: 0 auto;
    margin-bottom: 10px !important;
    text-align: center;
    line-height: 25px
}

.backing_selection,
.hardware_selection {
    padding: 0 4px;
    text-align: center;
    -webkit-appearance: none;
    border: 1px solid #aeaeae;
    background: #fff url(https://www.arttoframe.com/images/right-triangle.png) top 9px right 4px;
    background-repeat: no-repeat;
    line-height: 25px
}

.parentFrameContainer {
    width: 99%;
    height: 148px;
    overflow: hidden;
    cursor: pointer
}

.mCSB_dragger_bar {
    width: auto !important;
    margin-top: 6px !important;
    height: 15px !important;
    background-color: #5a5a5a !important
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    margin: 6px 0
}

.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
    height: 10px !important
}

.parentTopContainer {
    width: 99%;
    height: 82px;
    overflow: hidden;
    padding: 4px 0 5px 9px;
    cursor: pointer
}

.frame-price {
    font-size: 12px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 8px 0 0;
    color: #262626;
    margin: 0
}

#mCSB_2_container {
    width: 1000px
}

.type_selectionDrpdown {
    width: 100%;
    background-position: 208px 9px;
    text-transform: capitalize;
    padding: 3px;
    border-radius: 4px;
    border: 1px solid #d7d7d7;
    cursor: pointer;
    height: 25px;
    background-image: url(https://www.arttoframe.com/images/quantity-arrow.svg);
    background-position: 96%;
    -webkit-appearance: none;
    background-repeat: no-repeat
}

#innerlayer-canvas {
    z-index: 11;
    z-index: 13
}

#imagelayer-canvas,
#innerlayer-canvas {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0
}

#imagelayer-canvas {
    z-index: 11;
    z-index: 12
}

ng-scrollbar {
    --scrollbar-size: 10px;
    --scrollbar-thumb-color: rgba(94, 175, 255, 0.5);
    --scrollbar-thumb-hover-color: grey
}

.uploadimg {
    padding: 6px 1px 6px 0;
    width: 25%
}

.paddingForBottom {
    padding: 0
}

.dropZone {
    width: 300px;
    height: auto;
    padding: 10px;
    margin: 0 auto
}

#idSeeMore,
.dropZone {
    text-align: center
}

.borderDrop {
    border: 3px dashed rgba(0, 0, 0, .3)
}

#id_LinkSeeMore,
.btn {
    cursor: pointer
}

.btn {
    color: #fff !important;
    background-color: #0a569e !important;
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    border-color: #0a569e !important;
    margin-top: 30px
}

#custom-progress {
    margin-bottom: 15px
}

#myModalUpload {
    top: 100px
}

.upload-image-preview {
    border: 2px solid #c8c8c8;
    padding: 7px;
    width: 35%;
    margin-top: 55px
}

.upload-file-text ul li {
    margin: 0
}

.uploadimg,
.uploadimg:hover {
    color: #fff
}

.uploadimg:hover {
    text-decoration: none;
    outline: 0
}

.uploadimg {
    background: #125498 !important;
    text-transform: capitalize;
    font-size: 18px;
    padding: 11px 2px;
    border-radius: 4px;
    width: 40%;
    display: block;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    font-family: Product Sans, Arial, sans
}

.upload-dialog {
    width: 60%
}

.upload_img_options li {
    filter: grayscale(1);
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
    -ms-filter: grayscale(1);
    list-style-type: none;
    display: inline-block;
    width: 32%;
    text-align: center
}

.upload_img_options {
    width: 80%;
    margin: 0 auto
}

.upload_img_options li:hover {
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
    -moz-filter: grayscale(0);
    -o-filter: grayscale(0);
    -ms-filter: grayscale(0)
}

.Popup_note,
.popupListText li {
    color: #333;
    font-family: Product Sans, Arial, sans-serif;
    font-size: 14px
}

.popupListText li {
    padding: 3px 0
}

.UploadInfo {
    padding: 20px 30px;
    border: 1px solid #ccc;
    margin-top: 21px
}

.Up_OR_label {
    position: absolute;
    left: 0;
    right: 0;
    top: -89px;
    bottom: 0;
    font-size: 18px;
    margin: auto
}

.custom-file-input::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent
}

.uploadNew-image {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    align-items: center;
    justify-content: center;
    margin: auto;
    overflow: hidden
}

.custom-file-input,
.uploadNew-image {
    height: 100%;
    width: 100%;
    cursor: pointer
}

input[type=file] {
    color: transparent
}

.custom-file-input:focus {
    outline: 0 !important;
    border: none
}

#butnCloseFor3P {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer
}

#uploadImagePopup {
    z-index: 9999
}

.clsmodalTitle {
    color: #0d66a3;
    font-size: 38px;
    font-family: Product Sans, Arial, sans-serif;
    text-align: center;
    padding: 20px 0
}

#custom-progress {
    border: 1px solid #c8c8c8;
    padding: 5px;
    border-radius: 4px;
    text-align: center;
    height: 45px
}

.progress-bar {
    background-color: #43cb83 !important;
    background-image: linear-gradient(-45deg, hsla(0, 0%, 100%, .15) 25%, transparent 0, transparent 50%, hsla(0, 0%, 100%, .15) 0, hsla(0, 0%, 100%, .15) 75%, transparent 0, transparent);
    background-size: 2rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #007bff;
    transition: width .6s ease
}

ul.list-bullet {
    list-style-position: inside
}

.upload-file-text {
    border: 1px solid #c8c8c8;
    background-color: #fff;
    width: 100%;
    margin: left;
    font-size: 13px;
    padding: 15px
}

.upload-image-preview {
    margin-top: 50px;
    object-fit: fill
}

.upload-btn-wrapper input[type=file] {
    font-size: 100px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}

.carousel-inner>.item>a>img,
.carousel-inner>.item>img,
.img-responsive,
.thumbnail>img,
.thumbnail a>img {
    display: block;
    max-width: 100%
}

.edit-dialog {
    width: 870px !important
}

.edit-img-titl-cls {
    font-size: 27px;
    color: #0a529a;
    padding: 10px 0;
    text-align: center
}

.close-editpopup {
    position: absolute;
    right: 0;
    background: 0 0;
    border: none
}

.imgcls-content {
    width: 100%;
    height: 50%;
    margin-bottom: 40px;
    border: 1px solid #ddd;
    padding: 10px;
    background-color: hsla(0, 0%, 50.2%, .0196078431372549);
    display: flex;
    align-items: center;
    justify-content: center
}

#uploadImgSrc {
    max-height: 100%
}

.nopaddingcls {
    padding: 0
}

.optin-container ul {
    list-style-type: none;
    margin: 0
}

.optin-container {
    background: #fff;
    padding: 6px 76px;
    border-radius: 8px
}

.optin-container ul li {
    display: inline-block
}

.bg-colorcls {
    background-color: #ececec !important
}

.cust-titl-cls {
    font-size: 18px;
    text-align: center;
    color: #292929;
    padding: 34px 0 0;
    text-transform: capitalize
}

.cust-input-cls {
    width: 100%;
    border: 1px solid #535353;
    border-radius: 3px;
    padding: 5px;
    border-radius: 4px;
    color: #0a529a;
    font-size: 16px
}

.leftRightspace {
    padding: 30px 2px 20px !important
}

.alert_txtcls {
    font-size: 14px;
    color: #464646;
    padding: 0;
    text-align: center
}

.alert_txtcls img {
    position: absolute;
    right: 0;
    bottom: 10px
}

.edit_image_popup {
    z-index: 99999
}

.edit_image_popup~.modal-backdrop.in {
    z-index: 9999
}

#imageCropModal .modal-body {
    padding: 0 !important
}

.cropAreaFloater {
    background: #fff;
    height: calc(100% - 85px)
}

.select-areas-overlay {
    background-color: #000;
    overflow: hidden;
    position: absolute
}

.select-areas-outline {
    background: #fff;
    overflow: hidden
}

@media screen and (max-width:768px) and (min-width:320px) {
    .edit-dialog {
        width: 100%;
        margin: 0 auto
    }
}

#positionPopup {
    width: 90%;
    height: 90%;
    max-width: 1050px;
    max-height: 1300px;
    top: 40px
}

#leftSidebar {
    border-right: 1px solid #c7c9d1;
    background: #ececec;
    box-shadow: inset -2px 0 7px 0 rgba(0, 0, 0, .75)
}

#content {
    float: left;
    width: 100%
}

.mainImgContianer1 {
    text-align: center;
    position: relative;
    margin: 0 auto;
    max-width: 100%
}

.cancelmatsizebox {
    text-align: right;
    font-size: 18px;
    padding-top: 6px
}

.sliderTxtDivCont {
    font-size: 16px
}

.sliderTxtNumberCont {
    font-family: Montserrat;
    font-size: 11.9pt;
    color: #525163
}

.txtSize {
    width: 70px;
    margin: 8px;
    text-align: center;
    border-radius: 4px;
    background-color: #eee;
    border: 1px solid #ddd
}

.bg-borken2 {
    background: url(https://www.arttoframe.com/images/ProductPageSprites.png) -231px -95px;
    width: 17px;
    height: 17px;
    padding: 5px 14px
}

.bg-broken {
    background: url(https://www.arttoframe.com/images/ProductPageSprites.png) -231px -204px;
    width: 16px;
    height: 16px;
    padding: 5px 14px
}

.ui-slider-range,
.ui-state-active {
    background: #318839 !important
}

#advanceMatsDetails {
    z-index: 99999
}

.advanceMatsDetails.in~.modal-backdrop.in {
    z-index: 9999
}

.countReview {
    font-size: 11px;
    color: #363636;
    padding-left: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 3px
}

.borderRadiuscls {
    border-radius: 4px 4px 0 0
}

.whiteBorderCls {
    border: 1px solid #fff
}

.glassTypeTabs li a {
    margin-right: 4px;
    background-color: #f1f7fc;
    color: #7d9bb1;
    text-align: center;
    font-size: 17px;
    font-weight: 400;
    border: solid #7e9bb1;
    border-width: 1px 1px 0;
    height: 42px
}

#backing,
#glasstype,
#hardware {
    padding: 15px 15px 10px
}

.GlassNewSelect {
    width: 98%;
    margin-right: 3px;
    font-size: 13px;
    padding: 3px;
    border: none;
    border-radius: 3px;
    height: 21px
}

.tab_pane.active {
    border: 1px solid #234698
}

.glassTypeTabs>li.active>a,
.glassTypeTabs>li.active>a:hover {
    border: solid #234698;
    border-width: 1px 1px 0;
    background-color: #d2e3f0;
    color: #234698;
    height: 42px
}

.OnTapGlass:hover .defaultTabPaneActive {
    border: 1px solid #234698
}

.glassTypeTabs>li.active>a:focus {
    border: solid #234698;
    border-width: 1px 1px 0;
    background-color: #d2e3f0;
    color: #234698;
    height: 42px
}

.glassTabContent,
.modifyBtn {
    border: none
}

.modifyBtn {
    background: #204998;
    color: #fff;
    border-radius: 3px;
    padding: 3px 7px;
    width: 100%;
    text-align: center;
    font-size: 11px;
    height: 21px
}

.infoNewCls {
    width: 14px;
    height: 15px;
    position: absolute;
    z-index: 999;
    right: 12px;
    top: 12px;
    display: none
}

.glassTypeTabs>li.active .infoNewCls {
    display: block
}

.SeeAllNewBtn {
    background-color: #1d4c98;
    border-radius: 3px;
    color: #fff;
    width: 100%;
    text-align: center;
    padding: 0;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 21px;
    font-size: 11px
}

.SeeallNewSection {
    padding: 0
}

.ChooseTitle {
    color: #234698;
    font-size: 14px;
    text-align: left;
    padding: 0;
    margin: 0
}

.GlassOptions {
    background: url(https://www.arttoframe.com/images/ic_radio_button_unchecked_black_24px.svg);
    background-repeat: no-repeat;
    padding-left: 25px;
    padding-right: 10px;
    color: #234698;
    background-size: 19px;
    background-position: 1px -1px;
    cursor: pointer
}

.GlassOptions,
.GlassOptions:hover {
    text-decoration: none
}

.glazeName {
    white-space: nowrap;
    font-size: 10px;
    padding: 5px 0
}

.glazeName,
.GlazePrice {
    text-align: center;
    margin: 0
}

.GlazePrice {
    padding-bottom: 0;
    font-size: 12px
}

.GlassMaterialCls {
    padding: 10px 0;
    display: flex;
    align-items: center
}

.confirm_overlay {
    display: none
}

.selected_overlay {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto;
    width: 96px
}

.glaze_options:hover .confirm_overlay,
.glaze_options_plexi:hover .confirm_overlay {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto;
    width: 96px
}

.BackingName,
.HardwareName {
    color: #313131
}

.BackingName,
.BackingNameActive,
.HardwareName,
.HardwareNameActive {
    font-size: 10px;
    text-align: center;
    white-space: nowrap;
    padding: 4px 0 7px;
    text-overflow: ellipsis;
    overflow: hidden;
    margin: 0
}

.BackingNameActive,
.HardwareNameActive {
    color: #fff;
    background-color: #059f36
}

.fullWidth {
    width: 100%;
    border: 5px solid transparent;
    max-height: 100%
}

.fullWidthActive {
    width: 100%;
    border: 5px solid #059f36;
    max-height: 100%
}

.OutHardwareImage {
    height: 90px
}

.mat_color_big1 {
    margin: 13px 10px !important;
    background-color: #fff !important;
    font-family: montserrat light !important;
    float: left !important;
    height: 100px;
    max-width: 100%;
    width: 16% !important;
    border-radius: 0 !important;
    position: relative;
}

.disabled {
    pointer-events: none;
    cursor: default;
    background-color: gray !important;
}

.secondGroup {
    display: none;
}

.HardwarePrice {
    text-align: center;
    color: #262626;
    font-size: 12px;
    padding-bottom: 0;
    font-family: Product Sans, Arial, sans !important;
    display: block;
    padding-top: 0
}

.backing_select:hover .HardwarePrice {
    color: #fff;
    padding: 4px 0 7px;
    background-color: #059f36
}

.BackingPrice {
    text-align: center;
    color: #204998;
    font-size: 12px;
    padding-bottom: 0;
    font-family: Product Sans, Arial, sans !important;
    display: block
}

.backing_holders,
.hardwares_holder {
    padding: 0 10px
}

.backing_holders,
.Hardware_section {
    padding: 10px 0
}

.included_text {
    color: #204998;
    font-size: 14px;
    text-align: center
}

.Backing_tabs {
    margin-right: 0 !important
}

.ATC_quatity {
    padding: 0
}

.glssImg {
    height: 100px;
    margin: 0
}

.glssImg img {
    max-height: 100%
}

.ATC_quatity select {
    width: 100%;
    height: 48px;
    border-radius: 3px;
    color: #000;
    font-size: 18px;
    background-image: url(https://www.arttoframe.com/images/quantity-arrow.svg);
    background-position: 90%;
    -webkit-appearance: none;
    background-repeat: no-repeat;
    padding: 0 0 0 35px
}

.ATCButtonCls {
    padding: 0 0 0 10px
}

.ATCbutton_Green {
    background: #049e36;
    border-radius: 4px;
    height: 48px;
    align-items: center;
    justify-content: center;
    display: flex;
    text-align: center;
    color: #fff;
    font-weight: 400;
    font-size: 17px;
    cursor: pointer
}

.BorderRightsCls {
    border-right: 1px solid #fff
}

.BorderRightsCls p {
    margin: 0
}

.ATC_price {
    margin: 0;
    font-size: 17px;
    text-align: center
}

.ATC_AreaHolder {
    padding: 15px 0
}

.finished_text,
.Image_sizeTxt {
    color: #707070;
    font-size: 12px;
    position: relative;
    text-transform: uppercase
}

.finished_text {
    padding: 10px 0
}

.SeeallNewSection {
    display: block
}

#BackingPanel,
#hardwarePanel {
    display: none
}

.GlassOptionsActive {
    background: url(https://www.arttoframe.com/images/ic_radio_button_checked_black_24px.svg);
    background-repeat: no-repeat;
    padding-left: 25px;
    background-size: 19px;
    background-position: 1px -1px;
    padding-right: 10px
}

.GlassInfoDialog {
    width: 1040px
}

#BackingInfopopup,
#GlassInfopopup,
#HardwareInfopopup {
    top: 100px
}

.glassInfoClose {
    position: absolute;
    top: 0;
    right: 0
}

.glass_info_labels {
    padding: 20px 0 10px;
    font-size: 29px;
    color: #125498
}

.glass_info_desc {
    color: #707070;
    font-size: 18px;
    padding-right: 80px;
    line-height: 1.7;
    padding-bottom: 20px
}

.Back_to_optionsBtn {
    font-size: 13px;
    color: #707070;
    background: #fff;
    border: 1px solid #b2b2b2;
    border-radius: 3px;
    padding: 6px 15px;
    text-transform: uppercase;
    margin-bottom: 40px
}

.newBGClsGlass {
    background: #f0f0f0 !important;
    border-radius: 10px
}

.Valign_center {
    display: flex;
    align-items: center
}

.chat-now_btm {
    display: none !important
}

#brooklyn_usa_image img,
#corner_angle_image img,
#corner_image img,
#corner_profile_image img,
#hardware_image img,
#lifestyle_inside_corner img,
#lifestyle_lifestyle_original img,
#lifestyle_outside_corner img,
#lifestyle_with_hand img,
#main_image img,
#product_image img {
    width: 56px;
    height: 56px
}

.ATCbutton_Green:hover {
    background: #03832c
}

.defaultTabPaneActive {
    border: 1px solid #c9c9c9 !important
}

.defaultClass {
    background-color: #fff !important;
    border-width: 1px 1px 0;
    border-style: solid;
    border-color: #c9c9c9 !important;
    color: #717171 !important
}

.glassTypeTabs li {
    margin-top: 0
}

.defaultActiveClass {
    background-color: #e3e3e3 !important;
    border: solid #c9c9c9 !important;
    border-width: 1px 1px 0 !important;
    color: #272727 !important
}

.modifyBtnDefaultActive {
    background: #656565 !important
}

stickyCls {
    position: fixed;
    left: 0;
    min-height: 915px;
    overflow: hidden;
    top: 0;
    background: #000
}

.rightNewClass {
    position: absolute;
    right: 0;
    background: red
}

.frame_price_Tag {
    font-size: 10px;
    text-align: center;
    color: #262626
}

.newSpacingclass {
    width: 100%;
    margin: 0 !important
}

.Note_txt {
    font-family: Product Sans, Arial, sans !important;
    font-size: 14px !important;
    text-align: center !important;
    background: #287db2 !important;
    padding: 6px 3px;
    color: #fff !important;
    line-height: 1.5 !important;
    margin-bottom: 15px !important;
    min-height: 27px !important
}

div {
    box-sizing: border-box
}

.horizontal-scroll-wrapper {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: calc(250px + 1px);
    max-height: 750px;
    margin: 0;
    padding-top: 1px;
    background: #abc;
    overflow-y: auto;
    overflow-x: hidden;
    transform: rotate(-90deg) translateY(-250px);
    transform-origin: right top
}

.horizontal-scroll-wrapper>div {
    display: block;
    padding: 5px;
    background: #cab;
    transform: rotate(90deg);
    transform-origin: right top
}

.squares {
    padding: 250px 0 0
}

.squares>div {
    width: 250px;
    height: 250px;
    margin: 10px 0
}

.glaze_options {
    width: 137px;
    height: 160px;
    margin: 0 4px;
    color: #262626;
    padding-top: 3px !important;
    cursor: pointer
}

.glaze_options:hover {
    background: #2374a9;
    color: #fff
}

.glaze_options.active {
    background: #059f36;
    color: #fff
}

.glaze_active {
    background: #059f36 !important;
    color: #fff !important;
    pointer-events: none !important
}

.glaze_options_plexi {
    width: 150px
}

#Glass_radio,
#plexi_radio {
    padding-bottom: 20px !important
}

.seeall_close {
    background: 0 0;
    text-align: center;
    border: none;
    position: absolute;
    top: 9px;
    right: 11px
}

.nopadding {
    padding: 0
}

.seeall_dialog {
    width: 95%
}

#seeall_popup {
    z-index: 9999
}

.tab-content-seeall {
    border: none;
    padding: 0
}

.seeall_tabs li {
    font-size: 18px;
    color: #000;
    width: 23.6%;
    text-align: center;
    background: #dcdcdc;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    margin: 0
}

.seeall_tabs {
    border-bottom: 3px solid #fff;
    background: #dcdcdc
}

.seeall_tabs>li>a:hover {
    border: 1px solid transparent
}

.seeall_tabs li a {
    color: #000;
    padding: 7px 15px
}

.seeall_tabs>li.active>a,
.seeall_tabs>li.active>a:focus,
.seeall_tabs>li.active>a:hover {
    border: 1px solid transparent;
    background-color: #125498 !important;
    color: #fff;
    border-radius: 0
}

.imageinfo {
    width: 100%;
    text-align: center;
    padding: 17px 0;
    min-height: 143px
}

.UnitPriceFrames {
    color: #000 !important;
    font-size: 21px;
    font-weight: 400 !important;
    padding: 13px 0;
    text-align: center;
    margin: 0
}

.frameInfo,
.UnitPriceFrames {
    font-family: Product Sans, Arial, sans-serif
}

.frameInfo {
    padding: 10px 0 10px 30px;
    background: #e5e5e5;
    margin-left: 54px;
    width: 71%;
    color: #000
}

.seeall_leftpanel {
    background: #f2f2f4;
    position: sticky;
    top: 10px
}

.main_preview_seeall {
    padding: 15px
}

#filter-container {
    padding: 3px 0 11px;
    margin-top: 20px;
    background: #dcdcdc;
    width: 91%
}

.styled-select2 {
    background: #fff url(https://www.arttoframe.com/images/new_product_caret.png) no-repeat scroll right 6px !important;
    border-radius: 2px;
    display: inline-block;
    overflow: hidden;
    font-size: 11px !important;
    border: 1px solid grey;
    margin: 5px !important;
    width: 100px !important
}

#filter-container .selectdiv select {
    margin: 0 !important;
    padding: 5px 6px;
    cursor: pointer
}

.styled-select2 select {
    background: transparent none repeat scroll 0 0;
    -webkit-appearance: none;
    text-transform: uppercase;
    border: 0;
    color: #576077;
    font-size: 12px !important;
    line-height: .9;
    padding-left: 7px;
    width: 100%;
    font-family: Product Sans, Arial, sans-serif
}

#searchTextBtn1 {
    border-radius: 2px;
    padding: 1.5px 10px;
    border: 1px solid grey !important;
    width: 100%;
    font-size: 12px !important
}

#searchTextBtn1s {
    right: -5px !important
}

.frame_images {
    width: 13%;
    list-style-type: none;
    float: left;
    margin-bottom: 5px;
    margin-right: 20px;
    cursor: pointer
}

.frame_images_active {
    width: 19%;
    list-style-type: none;
    float: left;
    margin-bottom: 20px;
    margin-right: 30px;
    padding: 4px;
    border: 4px solid #2374a9
}

.frame_names {
    padding: 0 2px
}

.frame_names,
.frame_prices {
    font-size: 11px !important;
    text-align: center;
    overflow: hidden;
    font-weight: 600;
    height: 20px;
    line-height: 26px;
    margin-bottom: 0 !important;
    color: #041c35 !important;
    font-family: Product Sans, Arial, sans-serif !important
}

.frame_images img {
    width: 100%
}

.frame_scrollbar {
    padding: 20px 0
}

.sizeDetailsLeft {
    background: #f2f2f4
}

.sizefor_img {
    color: #283139;
    font-size: 17px;
    font-family: Product Sans, Arial, sans-serif;
    text-align: center;
    padding-top: 40px
}

.preSizeBtnMob {
    color: #353535;
    background: #dcdcdc
}

.clsactiveoption1,
.preSizeBtnMob {
    padding: 5px 20px !important;
    text-align: center;
    border-radius: 5px;
    font-size: 18px;
    font-family: Product Sans, Arial, sans !important;
    border: 0 solid #999 !important;
    cursor: pointer;
    display: block;
    font-weight: 400;
    margin: 0 auto
}

.clsactiveoption1,
.preSizeBtnMob:hover {
    background: #006d1c !important;
    color: #fff
}

.preSizeBtnMob:hover {
    text-decoration: none
}

.canvas-tab-content {
    border: none;
    padding: 0
}

.my_size_box {
    clear: both
}

.my_size_box,
.size_listing_label {
    font-family: ProductSans-Regular, Arial, sans-serif !important
}

.size_listing_label {
    list-style-type: none;
    overflow-y: scroll;
    margin: 0;
    padding-top: 5px;
    background: #ededea
}

.opt_dis_p {
    padding: 4px 0 0;
    color: #125498 !important;
    text-align: center
}

.size-txt-cnv {
    color: #125498;
    font-size: 14px;
    text-align: center;
    padding-top: 7px;
    margin: 0;
    font-weight: 400
}

.custom_size_parent {
    padding: 20px 15px;
    clear: both;
    font-weight: 900;
    background: #eee;
    font-family: ProductSans-Regular, Arial, sans-serif !important
}

.switch-cnv {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 17px
}

.switch-cnv input {
    opacity: 0;
    width: 0;
    height: 0
}

input:checked+.slider-cnv {
    background-color: #019d48
}

.slider-cnv.round-cnv {
    border-radius: 34px
}

.slider-cnv {
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc
}

.slider-cnv,
.slider-cnv:before {
    position: absolute;
    transition: .4s
}

.slider-cnv:before {
    content: "";
    height: 13px;
    width: 13px;
    left: 1px;
    bottom: 2px;
    background-color: #fff
}

.slider-cnv.round-cnv:before {
    border-radius: 50%
}

input:checked+.slider-cnv:before {
    transform: translateX(20px)
}

.sizeBox_cnv {
    margin-top: 3px;
    font-family: ProductSans-Regular, Arial, sans-serif !important;
    width: 93px;
    border: 0 solid #777;
    border-radius: 0;
    color: #777 !important;
    font-weight: 100;
    font-size: 16px;
    height: 35px;
    max-width: 100%;
    padding-right: 11px;
    cursor: pointer;
    padding-top: 4px;
    background-position: 40px
}

.size_x_mark {
    font-size: 21px;
    padding: 8px 0;
    margin-top: 4px
}

#btnApply_glass,
.size_x_mark {
    font-family: Product Sans, Arial, sans !important
}

#btnApply_glass {
    margin-left: 10px;
    cursor: pointer;
    text-decoration: none;
    font-size: 16px;
    background: #125498;
    padding: 4px 8px;
    border-radius: 3px;
    color: #fff;
    font-weight: 400
}

.matDetailsLeft {
    background: #f2f2f4
}

.AppliedMatName2 {
    font-size: 18px !important;
    padding: 0 0 13px;
    margin: 0
}

.AppliedMatName2,
.AppliedMatName2 span {
    color: #474747 !important;
    font-family: Product Sans, Arial, sans !important;
    font-weight: 400 !important;
    text-align: center
}

.AppliedMatName2 span {
    font-size: 18px;
    padding: 10px 0
}

.Topbottom_mats {
    max-height: 169px;
    text-align: center;
    width: 68%;
    padding: 0;
    margin: 0 auto 27px 17%
}

.matPreviewCorner {
    height: 82px;
    background: url(https://www.arttoframe.com/mat-color-pattern/61.jpg)
}

.matPreviewCorner,
.matPreviewCorner2 {
    max-width: 82px;
    margin-bottom: 5px;
    width: 82px
}

.matPreviewCorner2 {
    background: url(https://www.arttoframe.com/mat-color-pattern/.jpg)
}

.AppliedMatName {
    padding-left: 7px
}

.MatTopBottomLeftActive {
    background-color: #125498 !important;
    color: #fff;
    padding: 6px;
    margin: 0;
    font-size: 14px;
    text-transform: uppercase
}

#topmat_leftsect {
    background: #fff;
    border-right: 0 !important;
    border-top: 6px solid #c8c8c8;
    min-height: 167px;
    border-left: 1px solid #d4d4d4;
    border-bottom: 1px solid #d4d4d4;
    padding: 0
}

.BottomMat_Leftsect {
    padding: 0;
    background: #fff;
    border: 1px solid #d4d4d4;
    border-top: 6px solid #c8c8c8;
    min-height: 143px
}

.matPreviewCorner2 {
    border: 1px solid #b6b6b6 !important;
    border-radius: 50%;
    width: 82px !important;
    height: 82px
}

.matPreviewCorner {
    border: 1px solid #b6b6b6 !important
}

.matPreviewCorner,
.matPreviewCorner2 {
    border-radius: 50%;
    max-height: 200px;
    overflow: hidden;
    margin: 15px auto 0
}

.AppliedMatName {
    font-size: 13px !important;
    color: #474747 !important;
    font-family: Product Sans, Arial, sans !important;
    font-weight: 400 !important;
    text-align: center;
    margin-top: 16px
}

.styled-select3 {
    padding: 1px !important;
    background: #fff url(https://www.arttoframe.com/images/dropdownMat.png) no-repeat scroll 100%/17px 10px !important;
    border: 1px solid #a6a6a6;
    border-radius: 3px;
    display: inline-block;
    overflow: hidden;
    font-size: 11px !important;
    margin: 2px 11px !important;
    width: 120px !important;
    background: 0 0;
    -webkit-appearance: none
}

.styled-select3 select {
    background: #fff url(https://www.arttoframe.com/images/drop-down-arrow.svg) no-repeat scroll 100%/17px 10px !important;
    border: 0;
    color: #576077;
    font-size: 12px !important;
    font-weight: 400;
    height: 20px;
    line-height: 1;
    padding-left: 7px;
    text-transform: uppercase;
    width: 117px !important;
    -moz-appearance: none;
    -webkit-appearance: none
}

.seeall_mattabs {
    border: none
}

.seeall_mattabs li {
    font-size: 18px;
    color: #000;
    width: 35.6%;
    text-align: center;
    background: #dcdcdc;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    margin: 0
}

.seeall_mattabs li a {
    color: #000;
    padding: 5px 15px;
    line-height: 1.42857143;
    font-size: 14px;
    text-transform: uppercase
}

.seeall_mattabs>li>a:hover {
    border: 1px solid transparent
}

.seeall_mattabs>li.active>a,
.seeall_mattabs>li.active>a:focus,
.seeall_mattabs>li.active>a:hover {
    border: 1px solid transparent;
    background-color: #125498 !important;
    color: #fff;
    border-radius: 0
}

.mat_color_big {
    margin: 10px 2px !important;
    background-color: #fff !important;
    font-family: montserrat light !important;
    float: left !important;
    height: 100px;
    max-width: 108px;
    width: 21% !important;
    border-radius: 0 !important;
    position: relative
}

.activeMat-Image {
    display: none;
    position: absolute;
    top: 25px;
    left: 17px;
    margin: 0 auto
}

.seeallactivemat {
    display: block
}

.mat_color_big div {
    text-align: center !important;
    margin: 0 auto;
    position: relative
}

.mats_info_text2 {
    border-radius: 0 !important;
    font-size: 12px !important;
    text-align: center;
    width: 100% !important;
    font-family: Product Sans, Arial, sans-serif;
    margin: 8px auto;
    font-weight: 600;
    height: 20px
}

.topmatcontent_seeall {
    height: 500px;
    padding-bottom: 20px !important
}

.glassoptiondiv {
    padding-bottom: 0
}

.glazeCatgName {
    padding: 2px 0 5px;
    text-align: center;
    min-height: 350px;
    color: #125c96 !important;
    font-family: Product Sans, Arial, sans-serif;
    font-weight: 500;
    font-size: 18px
}

.main-category-name {
    margin: 0;
    text-transform: uppercase;
    text-align: center
}

.newcls_glass {
    font-size: 17px
}

.newcls_glass,
.priceshow {
    color: #4e5255;
    font-weight: 400
}

.priceshow {
    font-size: 13px
}

.glass_label.active {
    padding: 3px 28px;
    background: #006d1c;
    color: #fff !important
}

.glass_label {
    padding: 3px 28px;
    border-radius: 3px;
    background: #316a9d;
    font-size: 12px;
    line-height: 23px;
    padding-left: 23px;
    color: #fff !important;
    text-transform: uppercase;
    font-weight: 500;
    font-family: Product Sans, Arial, sans-serif !important;
    cursor: pointer;
    width: 320px;
    text-align: left
}

.glazeCatgName:hover .overlay-glass {
    opacity: 1
}

.overlay-glass {
    opacity: 0;
    width: 165px;
    height: 183px;
    cursor: pointer;
    position: absolute;
    top: 11px;
    background-repeat: no-repeat;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 3px
}

.textfor_glass {
    color: #125c96;
    font-size: 29px;
    font-family: Product Sans, Arial, sans-serif;
    text-align: center;
    padding: 19px 0
}

.glassOptContainer {
    padding: 0 60px
}

.hgrid {
    cursor: pointer
}

.forHardwarePop {
    margin: 5px auto;
    padding: 15px 40px
}

.WatchVideoDIVSeeAll {
    background: #000;
    opacity: .7;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    cursor: pointer;
    width: 154px;
    position: absolute;
    left: 0;
    margin: 0 auto;
    right: 0;
    bottom: 134px
}

.WatchVideoDIV-hardware p,
.WatchVideoDIV p,
.WatchVideoDIVSeeAll p {
    margin: 0;
    padding: 5px
}

.hardwarev4_label {
    background: transparent url(https://www.arttoframe.com/images_2014/mobile/chk_img.png) no-repeat scroll 0/16px 16px;
    font-size: 16px;
    line-height: 32px;
    padding-left: 21px;
    color: #283139;
    font-family: Product Sans, Arial, sans-serif;
    white-space: nowrap
}

.hardwarev4_label.active {
    background: transparent url(https://www.arttoframe.com/images/blue_pointerimg.png) no-repeat scroll -1px/20px 16px
}

.Newpricehwd {
    font-size: 21px
}

.inactiveHardware {
    background: #a7a7a7;
    color: #fff;
    padding: 4px 25px;
    font-size: 14px;
    text-transform: uppercase;
    border-radius: 3px
}

.hgrid-img {
    border: 1px solid #9a9a9a;
    min-height: 189px
}

.hardware_seeall {
    padding: 0 60px;
    box-shadow: -1px 13px 31px -2px #bababa;
    z-index: 1;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px
}

.textfor_hdw {
    color: #3f3f3f;
    padding: 5px 0;
    font-size: 21px;
    font-family: Product Sans, Arial, sans-serif;
    text-align: center
}

.activeHardware {
    background: #00a453;
    color: #fff;
    padding: 4px 25px;
    font-size: 14px;
    text-transform: uppercase;
    border-radius: 3px
}

#popup_hardware_name {
    font-family: Product Sans, Arial, sans !important
}

.hardwarev4_label:hover {
    color: #283139;
    text-decoration: none
}

.textfor_baking {
    color: #3f3f3f;
    font-size: 21px;
    font-family: Product Sans, Arial, sans-serif;
    text-align: center;
    padding: 45px 0 40px
}

.backingdiv {
    padding: 0 4%
}

.backing-selectbtn {
    padding: 18px 0;
    margin: 0
}

.SelectBacking {
    background: #a7a7a7;
    color: #fff;
    padding: 4px 25px;
    font-size: 14px;
    text-transform: uppercase;
    border-radius: 3px;
    border: none;
    text-align: center;
    margin: 0 auto;
    font-family: Product Sans, Arial, sans-serif;
    display: block
}

.SelectBacking,
.SelectBacking_active {
    height: 28px;
    width: 110px
}

.backingNames:hover {
    text-decoration: none;
    color: #333
}

.backingNames {
    color: #333;
    background: transparent url(https://www.arttoframe.com/images_2014/mobile/chk_img.png) no-repeat scroll 0/16px 16px;
    color: #283139;
    white-space: nowrap
}

.backingNames,
.backingNames_active {
    font-size: 16px;
    line-height: 32px;
    padding-left: 21px;
    font-family: Product Sans, Arial, sans-serif
}

.backingNames_active {
    background: transparent url(https://www.arttoframe.com/images/blue_pointerimg.png) no-repeat scroll -1px/20px 16px;
    color: #283139
}

.size_active {
    background: #006d1c !important;
    color: #fff !important;
    text-decoration: none !important
}

.custom_div {
    padding-bottom: 22px;
    padding-top: 10px;
    text-align: center
}

.customize {
    font-family: Product Sans, Arial, sans;
    font-size: 17px;
    padding: 4px 0;
    color: #283139
}

.sizebox_seeall {
    text-align: center;
    border: 1px solid silver !important;
    border-radius: 5px;
    color: #818181;
    height: 30px;
    font-size: 14px !important;
    width: 100%;
    background: #e8e8e8;
    padding: 10px;
    cursor: pointer;
    font-family: Product Sans, Arial, sans !important;
    background-size: 10px 7px;
    background-position: 54px 11px
}

.sign_x {
    padding: 6px 3px;
    font-size: 11px;
    font-family: Product Sans, Arial, sans;
    color: #283139;
    width: 4%;
    font-weight: 700;
    text-align: center
}

.shipping {
    text-align: left;
    padding: 0 6px
}

.btnok {
    color: #fff;
    font-size: 14px !important;
    background: #01943c;
    border: none;
    padding: 5px 8px;
    border-radius: 4px
}

.btnok,
.or_text {
    font-family: Product Sans, Arial, sans
}

.or_text {
    text-align: center;
    font-size: 16px
}

.hardwarev4_label_active {
    background: transparent url(https://www.arttoframe.com/images/blue_pointerimg.png) no-repeat scroll -1px/20px 16px;
    font-size: 16px;
    line-height: 32px;
    padding-left: 21px;
    color: #283139;
    font-family: Product Sans, Arial, sans-serif
}

a:hover {
    text-decoration: none
}

.SelectBacking_active {
    background: green;
    color: #fff;
    padding: 4px 25px;
    font-size: 14px;
    text-transform: uppercase;
    border-radius: 3px;
    border: none;
    text-align: center;
    margin: 0 auto;
    font-family: Product Sans, Arial, sans-serif;
    display: block
}

#new-glass-details {
    top: 14%;
    z-index: 1.0565555555555555e+23
}

.glass-dialog {
    width: 1155px;
    margin: 0 auto !important
}

.bg-for-modal {
    background: #f5f5f5
}

.backbtn-holder {
    padding-top: 17px;
    padding-right: 13px
}

.backbtn-new {
    background: #316a9d;
    color: #fff;
    font-family: Product Sans, Arial, sans !important;
    font-size: 13px;
    padding: 4px 25px;
    border-radius: 3px;
    text-transform: uppercase;
    cursor: pointer
}

.glassImgDesc {
    height: 444px;
    display: flex;
    align-items: center;
    justify-content: center
}

.glass-info-container {
    padding: 20px 0 9px 51px
}

.glass_LeftBox {
    background: #fff;
    padding: 15px 40px;
    min-height: 461px
}

#popup_glass_name {
    padding: 5px 0;
    color: #125c96;
    font-size: 23px;
    font-family: Product Sans, Arial, sans-serif;
    margin: 0
}

.featuretxt {
    font-family: Product Sans, Arial, sans !important;
    font-size: 20px;
    color: #4e5255;
    padding: 20px 0;
    text-transform: capitalize
}

#glassDesc {
    min-height: 267px
}

#glassDesc,
.glassdetails_list {
    color: #6a6a6a;
    font-family: Product Sans, Arial, sans-serif;
    font-size: 14px;
    margin: 0
}

.glassdetails_list {
    text-align: left;
    padding: 5px 0 0 18px
}

.glassdetails_list li {
    padding: 3px 0;
    margin: 0
}

.cancel_btn_new {
    color: #316a9d;
    background: #f5f5f5;
    margin-right: 38px
}

.cancel_btn_new,
.select-btn-glass {
    border: 1px solid #316a9d;
    border-radius: 3px;
    padding: 4px 23px
}

.select-btn-glass {
    color: #fff;
    background: #316a9d
}

.full_width {
    width: 100%
}

.upload_dialog {
    width: 812px;
    margin: 0 auto
}

.upload-btn-wrapper {
    position: relative;
    overflow: hidden;
    display: inline-block;
    background-color: #165298;
    color: #fff;
    width: 37%;
    margin: 30px auto;
    display: block;
    font-size: 16px !important;
    text-transform: uppercase;
    padding: 6px 12px;
    height: auto
}

.upload-btn-wrapper input[type=file] {
    font-size: 0 !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    opacity: 0 !important;
    cursor: pointer;
    width: 100%;
    height: 50px
}

.drag_titles {
    color: #1a4f98;
    font-size: 19px;
    text-align: center;
    opacity: .4;
    padding-bottom: 10%
}

.upload_ic_area {
    border: 1px dashed #638dc7;
    border-radius: 10px;
    margin-top: 7%;
    background: #f0f0f0;
    cursor: pointer;
    padding-top: 16%;
    padding-bottom: 33px
}

.upload_ic_area:hover {
    background: #fff
}

.upload_ic_area:hover .camera_upload {
    filter: grayscale(0)
}

#uploadProcess {
    z-index: 9999;
    top: 100px
}

.upload-btn-wrapper:hover {
    color: #fff
}

.uploadProcess_cancel {
    border: 1px solid #707070;
    border-radius: 3px;
    color: #707070;
    font-size: 13px;
    text-transform: uppercase;
    padding: 7px 33px;
    float: right;
    background: #f0f0f0;
    margin-top: 15px
}

.UploadProcess_note {
    font-size: 13px;
    color: #707070;
    padding: 25px 12px 30px;
    margin: 0
}

.info_Icon_upload {
    display: inline-block;
    cursor: pointer
}

.information_upload ul li {
    color: #707070;
    font-size: 13px;
    padding: 5px 0;
    margin: 0
}

.information_upload {
    position: absolute;
    bottom: 72px;
    background: #fff;
    box-shadow: 20px 0 0;
    box-shadow: 1px 0 5px 3px #c9c9c9;
    border-radius: 5px;
    padding: 25px 10px !important;
    left: 0;
    right: 0;
    width: 70%;
    margin: 0 auto
}

.information_upload:after {
    content: "";
    position: absolute;
    top: 93%;
    left: 39.6%;
    margin-top: -5px;
    transform: rotate(0);
    box-shadow: 8px 10px 13px -5px #c9c9c9;
    background: #fff;
    width: 26px;
    height: 36px;
    transform: rotate(45deg)
}

.information_upload ul {
    padding-left: 30px
}

.info_Icon_upload img:hover .information_upload {
    display: block
}

.camera_upload {
    filter: grayscale(100%);
    cursor: pointer
}

.camera_upload:hover {
    filter: grayscale(0);
    cursor: pointer
}

.uplaoding_img {
    width: 250px;
    height: 210px;
    margin: 0 auto;
    cursor: pointer
}

.uplaoding_img img {
    max-height: 100%;
    border: 2px solid #fff;
    cursor: pointer
}

.uploading_title {
    text-align: center;
    font-size: 23px;
    color: #707070;
    padding: 50px 0 30px
}

.progress-bar {
    background-color: #1a4f98;
    border-radius: 8px
}

.progress {
    background: #becadc;
    height: 30px;
    margin-bottom: 10px;
    border-radius: 9px
}

.src-only {
    color: #1d4c98;
    text-align: center;
    font-size: 50px;
    padding: 10px 0;
    opacity: .4
}

.cropareas,
.src-only {
    display: flex;
    align-items: center;
    justify-content: center
}

.cropareas {
    height: 460px;
    padding: 30px
}

.confirmBtns {
    background: #059f36;
    font-size: 19px;
    text-align: center;
    text-transform: uppercase;
    border-radius: 3px;
    color: #fff;
    border: none;
    padding: 9px 22px;
    cursor: pointer;
    margin: 0 3px
}

progress[value] {
    width: 250px;
    height: 32px;
    background-color: #becadc;
    border: none
}

progress[value]::-webkit-progress-bar {
    background-color: #becadc;
    border-radius: 8px;
    height: 30px;
    background-image: none
}

progress[value]::-webkit-progress-value {
    background-color: #1a4f98
}

progress[value]::-moz-progress-bar {
    background-color: #1a4f98;
    border-radius: 8px;
    height: 30px;
    background-image: none
}

progress[value]::-moz-progress-value {
    background-color: red
}

.crop_Options {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 23px 0 27px;
    margin: 0;
    background: #fff;
    border-radius: 0 0 10px 10px;
    cursor: pointer
}

.nomargin {
    margin: 0
}

.crop_Options li {
    display: inline-block;
    padding: 0 17px;
    text-align: center
}

.topBorders {
    border-top: 1px solid #707070
}

.noBorderCls {
    border: none
}

.radius_border {
    border-radius: 10px;
    background-color: #f0f0f0
}

.crop_subarea {
    max-width: 100%;
    max-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

#Upload_content {
    padding: 0 20px
}

#process_content {
    padding-bottom: 15px
}

.offer-text-offer {
    top: -10px;
    z-index: 99;
    left: 50px;
    background: url(https://www.arttoframe.com/images/best-seller-tag.svg) no-repeat;
    width: 72px;
    background-size: 57px;
    height: 74px;
    border-radius: unset;
    position: absolute;
    padding: 15px 10px 1px 6px;
    color: #fff;
    font-size: 16px !important;
    line-height: 1.2;
    font-family: Product Sans, Arial, sans !important;
    color: #fff !important;
    line-height: 1.3 !important;
    text-align: center;
    text-transform: uppercase
}

.oversize-text2 {
    text-align: center;
    color: red;
    font-size: 18px
}

.available-sizes-title {
    font-size: 20px;
    text-align: center;
    font-weight: 700;
    color: #0d4e93;
    font-family: Product Sans, Arial, sans !important;
    margin: 0 !important;
    padding: 10px
}

.available-size-dialog {
    width: 370px;
    font-family: Product Sans, Arial, sans !important
}

.available-sizes-subtitle {
    font-size: 18px;
    color: #0d4e93;
    margin: 0 !important;
    padding: 5px 18px;
    line-height: normal
}

.available-sizes-subtitle,
.max-image-sizetxt {
    font-family: Product Sans, Arial, sans !important;
    text-align: center
}

.max-image-sizetxt {
    font-size: 16px !important;
    color: red !important
}

#available-size {
    top: 10px;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    background: #e9e9ea;
    width: 400px;
    margin: auto;
    height: 300px;
    z-index: 99;
    display: none
}

#available-size-close {
    color: #000 !important;
    float: right !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-shadow: 0 1px 0 #fff !important;
    box-shadow: none;
    position: relative !important;
    top: auto;
    right: auto;
    width: auto;
    border-radius: 0 !important
}

.disabledContainer {
    pointer-events: none;
    opacity: .4
}

#main_innerlayer_canvas {
    z-index: 11;
    z-index: 13
}

#main_imagelayer_canvas,
#main_innerlayer_canvas {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0
}

#main_imagelayer_canvas {
    z-index: 11;
    z-index: 12
}

.oversize-text {
    text-align: center;
    color: red;
    font-size: 18px;
    padding: 10px 0
}

.no_match_record {
    display: none;
    padding: 35px;
    font-size: 15px;
    color: red
}

.productDetailsButton {
    color: #5f5f5f;
    font-size: 8px;
    text-transform: uppercase;
    background: #f0f0f0;
    border: 1px solid #bfbfbf;
    border-radius: 3px;
    padding: 3px;
    cursor: pointer;
    white-space: nowrap
}

.frameReviewCount {
    padding-right: 6px
}

.productdetailsDioalog {
    width: 100%;
    margin: 0 auto
}

.productdetailTabs li a {
    color: #484848;
    text-transform: uppercase;
    font-size: 16px;
    padding: 10px 1px;
    border: none;
    text-align: center
}

.productdetailTabs li {
    width: 25%
}

.productdetailTabs {
    height: 76px;
    padding-top: 15px;
    border-bottom: 7px solid #d5d5d5
}

.productClosebtn {
    background: #9a9a9a
}

.productClosebtn,
.productClosebtn:hover {
    font-size: 16px !important;
    border-radius: 3px;
    padding: 1px 25px !important;
    color: #fff !important;
    margin-top: 9px;
    width: 100%
}

.productClosebtn:hover {
    background: #9a9a9a !important
}

.productdetailTabs>li.active>a,
.productdetailTabs>li.active>a:focus,
.productdetailTabs>li.active>a:hover {
    border: none;
    border-bottom: 7px solid #00509b;
    background-color: #fff
}

.productdetailTabs>li>a:hover {
    border: none
}

.productdetailsContent {
    border: none;
    padding: 0
}

.productDetails_titles {
    font-size: 31px;
    text-align: center;
    color: #004ba0;
    padding: 40px 0;
    background: #f8f8f8;
    margin: 0;
    font-family: Product Sans, Arial, sans-serif !important
}

.prod_details_list li {
    font-size: 16px;
    font-weight: 700;
    padding: 2px 0;
    margin: 0
}

.prod_details_list li span {
    font-weight: 400
}

.prod_notes {
    font-size: 11px;
    color: #3b3b3b;
    margin: 0
}

.prod_details_list {
    padding-bottom: 60px
}

.ratingNumbers {
    font-size: 61px;
    color: #3b3b3b
}

.numberofReviews {
    font-size: 15px;
    padding: 20px
}

.rating-desc {
    cursor: pointer !important;
    padding-top: 0;
    padding-bottom: 0;
    margin: 1px 0
}

.starvv {
    font-size: 15px
}

.progress {
    border-radius: 0 !important;
    height: 17px;
    margin: 1px 8px;
    background: #fff;
    border: 1px solid #d8d8d8
}

.bgreen,
.progress-bar-success {
    background-color: #fb0 !important;
    background-image: none;
    border-radius: 0
}

.progress-bar {
    box-shadow: none
}

.actualCount {
    padding: 0
}

.reviewscomment {
    padding: 2% 7% !important
}

.user_name {
    font-size: 13px;
    color: #3b3b3b;
    margin: 0
}

.userSubtitle {
    font-size: 8px;
    letter-spacing: 1px;
    color: #838383
}

.userSections {
    width: 13%;
    border-right: 1px solid #e8e8e8
}

.commentText {
    width: 70%;
    padding-left: 10%;
    padding-right: 7%
}

.dateArea {
    width: 16%;
    text-align: center;
    padding-top: 5%
}

.mainComment {
    font-size: 19px;
    text-transform: uppercase;
    font-weight: 400;
    color: #000
}

.CommentInfo {
    font-size: 12px;
    color: #4b4b4b;
    line-height: 1.7
}

#productdetailspopup {
    overflow-y: scroll
}

.DateSpace {
    margin-bottom: 30px
}

.lineHr {
    padding: 1.5%;
    border-bottom: .5px solid #e2e2e2;
    border-top: 0
}

.Comt_bottmSpace {
    padding-bottom: 26px
}

.loadMoreButton {
    font-size: 16px;
    background: #004e9d;
    border-radius: 5px;
    text-align: center;
    color: #fff;
    border: none;
    padding: 9px;
    width: 20%;
    text-transform: uppercase;
    margin: 0 auto;
    display: block
}

.reviewMainComponent {
    background: #f8f8f8;
    padding: 0 0 30px
}

.descriptionText {
    font-size: 15px;
    padding: 4% 18%
}

.searchForAnswer {
    background: #f4f4f4;
    border: 1px solid #b1b1b1;
    width: 100%;
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 50px
}

.FAQ_details {
    padding: 3% 18% 0 18.2%
}

.QuestionTypes {
    width: 7%;
    text-align: right;
    font-weight: 700;
    font-size: 16px;
    padding: 0 0 15px;
    color: #4b4b4b
}

.AnswerTypes {
    width: 93%;
    padding-left: 4%;
    padding-bottom: 15px
}

.questionText {
    color: #0048a3;
    font-size: 15px
}

.AnswerTypes span {
    color: #7c7c7c;
    font-size: 12px
}

.detailsTypes {
    padding: 27px 6%
}

.similarProductName {
    font-size: 15px;
    font-weight: 700;
    padding: 20px 0 0;
    text-align: center;
    color: #201711;
    text-overflow: ellipsis;
    width: 100%;
    white-space: nowrap;
    overflow: hidden
}

.similarproductSize {
    color: #676767;
    font-size: 13px;
    text-align: center
}

.similarprodReview {
    color: #676767;
    font-size: 10px;
    text-align: center;
    padding-bottom: 10px;
    min-height: 30px;
    text-overflow: ellipsis;
    width: 100%;
    white-space: nowrap;
    overflow: hidden
}

.similarPrices {
    font-size: 13px;
    color: #201710;
    padding: 10px 0;
    border-top: 2px dotted #a8a8a8
}

.similarPrices span {
    float: right;
    font-weight: 700
}

.similar_space {
    padding: 3% 17%
}

.bx-wrapper .bx-pager.bx-default-pager a.active {
    background: 0 0;
    border: none;
    width: 17px;
    height: 17px;
    border-radius: 50%
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #b1b1b1;
    width: 9px;
    height: 9px
}

.bx-wrapper .bx-pager {
    display: flex;
    align-items: center;
    justify-content: center
}

#productdetailspopup {
    z-index: 9999
}

.productDetailsSticky {
    position: sticky;
    top: 0;
    top: 75px;
    background: #f8f8f8;
    z-index: 999;
    width: 100%
}

.bottomspaces {
    margin-bottom: 40px;
    margin-top: 15px
}

.bx-viewport.bx-viewport {
    min-height: 90vh !important
}

.similarreviews {
    display: inline-block
}

.contactUs_similar {
    padding: 10px
}

.contactUs_similar_text {
    font-size: 31px;
    color: #314257 !important;
    font-weight: 400;
    white-space: nowrap
}

.contactDivsHolder {
    display: flex;
    align-items: center;
    justify-content: center
}

.customers_servicesTag {
    font-size: 16px;
    display: block;
    padding-left: 47px;
    position: absolute;
    top: -14px;
    color: #314257
}

.bottomContactSection {
    padding: 2% 0;
    display: flex;
    align-items: center;
    justify-content: center
}

@media (max-width:480px) {
    .similarproductSlider {
        width: 100%;
        max-width: 480px
    }
}

@media (min-width:481px) and (max-width:768px) {
    .similarproductSlider {
        max-width: 768px;
        min-width: 481px;
        width: 100%
    }
}

@media (min-width:769px) and (max-width:992px) {
    .similarproductSlider {
        min-width: 769px;
        max-width: 992px;
        width: 100%
    }
}

@media (min-width:993px) and (max-width:1199px) {
    .similarproductSlider {
        min-width: 993px;
        max-width: 1199px;
        width: 100%
    }
}

@media (min-width:1200px) {
    .similarproductSlider {
        min-width: 1200px;
        width: 100%
    }
}

.bx-wrapper {
    box-shadow: none !important;
    border: none !important
}

.note1 {
    display: inline-block;
    height: 0;
    width: 0
}

.modal {
    z-index: 99999 !important;
    overflow-x: hidden;
    overflow-y: auto
}

.containerforcart {
    margin: 90px auto;
    padding-left: 15px;
    padding-right: 15px;
    max-height: 90% !important;
    z-index: 1200;
    font-family: Product Sans, Arial, sans-serif
}

.info_content {
    padding: 0 6px 35px 15px
}

.show_info {
    font-family: Product Sans, Arial, sans-serif;
    font-size: 14px;
    margin: 0
}

.show_info2 {
    float: right
}

@media screen and (max-width:768px) and (min-width:320px) {

    .continuebtn,
    .viewcartbtn {
        margin-bottom: 10px
    }

    .added_item,
    .price_info {
        font-size: 14px
    }

    .cartnumber_lineitem {
        right: 14px
    }

    .personal_note {
        height: 44px;
        overflow: scroll
    }

    #personalNote {
        width: 70%;
        text-align: right
    }

    .price_info_holder {
        padding: 0 !important
    }

    .GiftTitles {
        font-size: 17px
    }

    .GiftSubTitle {
        font-size: 11px
    }

    .add_to_card_btn {
        width: 100% !important
    }
}

.backing_select,
.bottomleftLabel,
.hardware_select,
.infoNewCls,
.noftLabel,
.shuffle_height_width,
.topleftLabel {
    cursor: pointer
}

.table_popup td {
    width: 50%
}

.glass-img-gl {
    min-height: 96px;
    margin: 0
}

.bx-wrapper img {
    min-height: 105px !important
}

.slidetext {
    font-size: 12px;
    font-family: Product Sans, Arial, sans-serif;
    padding: 10px 0;
    margin: 0;
    min-height: 60px
}

.slidetext,
.upgradeit {
    color: #000;
    text-align: center
}

.upgradeit {
    border: 1px solid #000;
    background: #fff;
    padding: 7px;
    font-size: 16px;
    cursor: pointer;
    width: 100px
}

.slidetext span {
    font-weight: 700;
    font-family: Product Sans, Arial, sans-serif
}

.reset_c1 {
    background: #b7d2da;
    color: #124a5a;
    padding: 7px 30px;
    text-align: center;
    cursor: pointer
}

.relatedproduct {
    color: #000;
    font-size: 25px;
    font-family: Product Sans, Arial, sans-serif;
    text-align: center;
    margin: 0;
    padding: 10px 0
}

affix {
    position: fixed;
    transform: translateZ(0);
    top: 70px !important;
    width: 100%;
    left: 0;
    right: 0
}

.nav-stacked>li {
    float: left
}

html {
    scroll-behavior: smooth
}

.reviewTooltipTitle {
    font-size: 19px;
    font-weight: 700;
    font-family: Product Sans, Arial, sans-serif
}

.customerRatingText {
    color: #363636;
    font-size: 13px
}

.tooltiptextReview {
    background: #fff;
    position: absolute;
    top: 105px;
    left: 0;
    width: 70%;
    border-radius: 7px;
    z-index: 99999;
    min-height: 95px;
    padding: 9px;
    border: 1px solid #ccc;
    border-radius: 5px
}

.tooltiptextReview .progress {
    height: 15px
}

.blue_text {
    color: #00509b;
    padding: 0 14px
}

.HrClass_bottom {
    margin-top: 20px;
    margin-bottom: 0;
    border: 0;
    border-bottom: 1px solid #d8d8d8;
    height: 20px
}

.ReadAllReview {
    color: #00509b;
    font-size: 13px;
    text-align: center;
    display: block;
    padding: 15px 0 8px
}

.tooltiptextReview:after {
    content: "";
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin: auto;
    width: 15px;
    height: 15px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    transform: rotate(46deg);
    background: #fff
}

#customerFAQ,
#description,
#product_details,
#review,
#similarproduct {
    padding: 0
}

.bg-colorss {
    background: #f8f8f8
}

.bg-colorss,
.QUE_space {
    margin-bottom: 20px
}

.backgrounfclrs {
    background: #fff;
    height: 77px
}

.bgNewClrs {
    background: #f8f8f8
}

.left-thumbImg {
    padding: 5px 0
}

.img-responsive {
    cursor: pointer
}

.leftThumbImgs img {
    width: 56px;
    height: 56px;
    margin: 0 auto
}

.shiping_days2 {
    font-family: Product Sans, Arial, sans-serif;
    position: relative;
    top: 17px;
    color: #5a5a5a;
    font-size: 14px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 20px
}

.hardwareInnerSelect:hover .fullWidth {
    border: 5px solid #059f36
}

.hardwareInnerSelect:hover {
    color: #fff;
    background-color: #059f36;
    padding: 0
}

.HardwarePriceActive {
    display: block;
    font-size: 12px;
    text-align: center
}

.hardwareInnerSelect:hover .HardwarePrice,
.HardwarePriceActive {
    color: #fff;
    background-color: #059f36;
    padding: 0 0 7px
}

.hardwareInnerSelect:hover .hardwarenamecommon {
    color: #fff;
    padding: 4px 0 7px;
    background-color: #059f36
}

.backing_select:hover .fullWidth {
    border: 5px solid #059f36
}

.backing_select:hover .BackingPrice {
    background-color: #059f36;
    color: #fff;
    padding: 0 0 7px
}

.backing_select:hover .backingnamecommon {
    color: #fff;
    padding: 4px 0 7px;
    background-color: #059f36
}

.TopMatNewClls {
    background: #125498;
    color: #fff
}

.BottomMatNewClls,
.TopMatNewClls {
    padding: 6px;
    margin: 0;
    font-size: 14px;
    text-transform: uppercase
}

.BottomMatNewClls {
    background: #c8c8c8;
    color: #474747
}

.matDescriptionNew table {
    width: 40%;
    margin: 0 auto
}

.matDescriptionNew {
    padding-bottom: 30px
}

.hardwareInfo_left {
    margin-bottom: 0
}

.middlebox {
    padding: 15px 20px
}

#popup_hardware_name {
    color: #125c96
}

#hardwareDesc,
#popup_hardware_name {
    font-size: 18px;
    font-family: Product Sans, Arial, sans-serif
}

#hardwareDesc {
    color: #565656
}

.cls-container {
    width: 250px;
    text-align: center;
    float: none;
    margin: 0 auto
}

.cls-container .left {
    float: left;
    width: 55px;
    height: 18px;
    background: #c2c2c2;
    background: url(https://www.arttoframe.com/images/left_arrows.svg) no-repeat scroll 0 4px transparent
}

.cls-container .right {
    float: right;
    width: 55px;
    height: 18px;
    background: #c2c2c2;
    background: url(https://www.arttoframe.com/images/right_arrows.svg) no-repeat scroll 0 4px transparent
}

.cls-container .middle {
    float: none
}

.cls-container_outer {
    width: 250px;
    text-align: center;
    float: none;
    margin: 0 auto
}

.cls-container_outer .left {
    float: left;
    width: 153px;
    height: 18px;
    background: #c2c2c2;
    background: url(https://www.arttoframe.com/images/left_arrows_outer.svg) no-repeat scroll 0 4px transparent
}

.cls-container_outer .right {
    float: right;
    width: 153px;
    height: 18px;
    background: #c2c2c2;
    background: url(https://www.arttoframe.com/images/right_arrows_outer.svg) no-repeat scroll 0 4px transparent
}

.cls-container_outer .middle {
    float: none;
    width: auto
}

.bx-wrapper {
    max-width: 100% !important
}

.a-size-large {
    font-size: 21px !important;
    line-height: 1.3 !important;
    color: #555 !important
}

#chain_break1,
#chain_green1 {
    cursor: pointer
}

#framecanvas,
#framecanvasMobile {
    box-shadow: 3px 3px 5px 0 #9e9e9e
}

#innerlayer-canvas {
    box-shadow: inset -1px 2px 9px 10px rgba(0, 0, 0, .75)
}

#review {
    padding-bottom: 40px
}

.nav>li>a:focus,
.nav>li>a:hover {
    background: 0 0
}

.the-arrow {
    transition: all .2s
}

.the-arrow.-left {
    position: absolute;
    top: 10px;
    left: 0
}

.the-arrow.-left>.shaft {
    width: 64px;
    background-color: #999
}

.the-arrow.-left>.shaft:after,
.the-arrow.-left>.shaft:before {
    width: 8px;
    background-color: #999
}

.the-arrow.-left>.shaft:after {
    transform: rotate(-140deg)
}

.the-arrow.-right {
    position: absolute;
    top: 10px;
    right: 0
}

.the-arrow.-right>.shaft {
    width: 64px;
    transition-delay: .2s
}

.the-arrow.-right>.shaft:after,
.the-arrow.-right>.shaft:before {
    width: 8px;
    transition-delay: .3s;
    transition: all .5s
}

.the-arrow.-right>.shaft:before {
    transform: rotate(40deg)
}

.the-arrow.-right>.shaft:after {
    transform: rotate(-40deg)
}

.the-arrow>.shaft {
    position: relative;
    will-change: transform
}

.the-arrow>.shaft,
.the-arrow>.shaft:after,
.the-arrow>.shaft:before {
    background-color: #999;
    display: block;
    height: 1px;
    transition: all .2s;
    transition-delay: 0
}

.the-arrow>.shaft:after,
.the-arrow>.shaft:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0
}

.the-arrow>.shaft:before {
    transform-origin: top right
}

.the-arrow>.shaft:after {
    transform-origin: bottom right
}

.animated-arrow {
    display: block;
    margin: 5px auto;
    color: #707070;
    font-size: 15px;
    text-decoration: none;
    position: relative;
    transition: all .2s;
    text-align: center;
    width: 260px
}

.animated-arrow>.main>.text {
    margin: 0 6px;
    line-height: 1
}

.animated-arrow>.main>.the-arrow {
    position: relative
}

.the-arrow.-left>.shaft:before {
    transform: rotate(140deg);
    left: -7px
}

.the-arrow.-left>.shaft:after {
    left: -7px
}

.the-arrow-new {
    transition: all .2s
}

.the-arrow-new.-left-new {
    position: absolute;
    top: 10px;
    left: 0
}

.the-arrow-new.-left-new>.shaft-new {
    width: 64px;
    background-color: #999
}

.the-arrow-new.-left-new>.shaft-new:after,
.the-arrow-new.-left-new>.shaft-new:before {
    width: 8px;
    background-color: #999
}

.the-arrow-new.-left-new>.shaft-new:after {
    transform: rotate(-140deg)
}

.the-arrow-new.-right-new {
    position: absolute;
    top: 10px;
    right: 0
}

.the-arrow-new.-right-new>.shaft-new {
    width: 64px;
    transition-delay: .2s
}

.the-arrow-new.-right-new>.shaft-new:after,
.the-arrow-new.-right-new>.shaft-new:before {
    width: 8px;
    transition-delay: .3s;
    transition: all .5s
}

.the-arrow-new.-right-new>.shaft-new:before {
    transform: rotate(40deg)
}

.the-arrow-new.-right-new>.shaft-new:after {
    transform: rotate(-40deg)
}

.the-arrow-new>.shaft-new {
    background-color: #999;
    display: block;
    height: 1px;
    position: relative;
    transition: all .2s;
    transition-delay: 0;
    will-change: transform
}

.the-arrow-new>.shaft-new:after,
.the-arrow-new>.shaft-new:before {
    background-color: #999;
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    transition: all .2s;
    transition-delay: 0
}

.the-arrow-new>.shaft-new:before {
    transform-origin: top right
}

.the-arrow-new>.shaft-new:after {
    transform-origin: bottom right
}

.animated-arrow-new {
    display: block;
    color: #707070;
    font-size: 15px;
    text-decoration: none;
    position: relative;
    transition: all .2s;
    text-align: center;
    width: 260px;
    margin: 0 auto
}

.animated-arrow-new>.main-new>.text-new {
    margin: 0 6px;
    line-height: 1
}

.animated-arrow-new>.main-new>.the-arrow-new {
    position: relative
}

.the-arrow-new.-left-new>.shaft-new:before {
    transform: rotate(140deg);
    left: -7px
}

.the-arrow-new.-left-new>.shaft-new:after {
    left: -7px
}

.up-arrowCls {
    position: fixed;
    bottom: 150px;
    width: 50px;
    height: 50px;
    border: 0 solid #d6d6d6;
    z-index: 99;
    padding: 0;
    text-align: center;
    margin-left: 1560px;
    display: none
}

.frame_hover_popup {
    position: absolute;
    left: -210px;
    top: 140px;
    border: 1px solid #b4b4b4;
    background: #f8f8f8;
    z-index: 999;
    width: 198px
}

.HoverPopup_description p {
    line-height: normal;
    padding: 10px 14px 0
}

.HoverPopup_description li,
.HoverPopup_description p {
    color: #555;
    font-size: 12px;
    margin: 0
}

.HoverPopup_description ul {
    padding-left: 28px
}

.Popup_corner_image {
    padding: 10px
}

.frame_hover_popup:after {
    content: "";
    position: absolute;
    right: -9px;
    top: 50%;
    width: 16px;
    height: 16px;
    border-color: #b4b4b4;
    border-style: solid;
    border-width: 1px 0 0 1px;
    transform: rotate(138deg);
    background: #fff
}

.glass_hover_popup {
    position: absolute;
    left: -210px;
    top: 26%;
    border: 1px solid #b4b4b4;
    background: #f8f8f8;
    z-index: 999;
    width: 198px;
    padding: 15px
}

.glass_hover_popup:after {
    content: "";
    position: absolute;
    right: -9px;
    top: 50%;
    width: 16px;
    height: 16px;
    border-color: #b4b4b4;
    border-style: solid;
    border-width: 1px 0 0 1px;
    transform: rotate(138deg);
    background: #fff
}

.HoverPopup_description_glass p {
    font-size: 12px;
    font-weight: 700;
    color: #555
}

.HoverPopup_description_glass h4 {
    font-size: 17px;
    color: #555
}

@media screen and (max-width:1650px) and (min-width:1100px) {
    .up-arrowCls {
        position: fixed;
        bottom: 150px;
        width: 50px;
        height: 50px;
        border: 0 solid #d6d6d6;
        z-index: 99;
        padding: 0;
        text-align: center;
        margin-left: 1260px;
        display: none
    }
}

#framecanvas:after,
#framecanvasMobile:after {
    content: "";
    top: -10px;
    z-index: 99;
    left: 50px;
    background: url(https://www.arttoframe.com/images/best-seller-tag.svg) no-repeat;
    width: 72px;
    background-size: 57px;
    height: 74px;
    border-radius: unset;
    position: absolute;
    padding: 15px 10px 1px 6px;
    color: #fff;
    text-transform: uppercase;
    font-size: 16px !important;
    line-height: 1.2;
    font-family: Product Sans, Arial, sans !important;
    color: #fff !important;
    line-height: 1.3 !important;
    text-align: center
}

.mCSB_scrollTools .mCSB_draggerContainer {
    top: auto !important
}

.validationErrorTxt {
    font-size: 15px;
    display: block
}

.validationErrorCrop,
.validationErrorTxt {
    color: red;
    font-family: Product Sans, Arial, sans-serif;
    font-weight: 100
}

.validationErrorCrop {
    font-size: 12px;
    text-align: center !important;
    display: none
}

.activeAvailableSize {
    color: #000;
    font-weight: 800;
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline
}

.seeallSizeActive {
    background: #006d1c !important;
    color: #fff;
    text-decoration: none
}

.msrp_txt {
    text-decoration: line-through !important;
    color: #041c35 !important
}

.clsSeeInRoom {
    margin-top: 20px
}

.fl {
    float: left
}

.clsEye {
    background: transparent url(https://www.arttoframe.com/images/shadow_box_frames/grayeye.png) 0 no-repeat;
    font-weight: 700;
    padding: 3px 0 3px 33px;
    filter: grayscale(100%)
}

.fr {
    float: right
}

.closeZoomBtn {
    font-size: 16px;
    color: #707070;
    border: 1px solid #b5b5b5;
    border-radius: 3px;
    float: right;
    padding: 3px 10px;
    background: #fff;
    margin: 15px 4px 0
}

#myModalZoom {
    top: 10px;
    z-index: 9999
}

.widthFullCls {
    width: 100%
}

.carousel-indicators-custom {
    position: static;
    width: 100%;
    padding: 20px 0;
    border-top: 1px solid #d3d3d3;
    margin: 0
}

.carousel-indicators-custom li {
    width: 60px;
    height: 60px;
    text-indent: unset
}

.carousel-indicators-custom li img {
    max-height: 100%;
    max-width: 100%;
    margin: 0 auto
}

.carousel-indicators-custom.active {
    border: 1px solid #1a1a1a
}

.carousel-indicators-custom li {
    border: 1px solid #ccc;
    margin: 0 5px;
    border-radius: 0
}

.carousel-indicators .active {
    border: 1px solid #1a1a1a
}

.zoom_modalDialog {
    width: 90%;
    margin: 0 auto
}

.myModalZoom.in~.modal-backdrop.in {
    z-index: 99999
}

.modalZoomConten {
    border-radius: 3px
}

.carousel-inner-custom {
    width: 97%;
    margin: 20px auto
}

.carousel-inner-custom img {
    max-width: 100%;
    max-height: 100%
}

.carousel-control-custom.left,
.carousel-control-custom.right {
    background-image: none !important
}

.carousel-inner-custom .item {
    width: 100%;
    align-items: center;
    justify-content: center
}

.carousel-control-custom {
    display: flex;
    align-items: center
}

.zoom_arrows_left {
    right: 0;
    position: absolute
}

.carousel-inner>.active,
.carousel-inner>.next,
.carousel-inner>.prev {
    display: flex
}

.all-sizes {
    clear: right;
    float: left;
    font-size: 12px;
    width: 48px;
    padding-left: 3%
}

.added_item {
    font-size: 25px;
    text-align: left;
    margin: 0;
    padding: 16px 0 0
}

.added_item,
.price_info {
    color: #000;
    font-family: Product Sans, Arial, sans-serif
}

.price_info {
    text-align: center;
    font-size: 22px
}

.cartnumber_lineitem {
    position: absolute;
    right: 30px;
    top: 8px
}

#cart_lineitemdetail {
    position: absolute;
    color: #fff;
    font-size: 16px;
    right: 10px;
    top: 1px;
    left: 11px;
    text-align: center
}

.bottomborder {
    border-top: 1px solid #a9a9a9;
    margin: 0;
    padding: 10px
}

.new_btnclose_cart {
    position: absolute;
    top: -6px;
    right: 5px;
    border: none;
    font-size: 31px;
    color: #000;
    cursor: pointer;
    background: 0 0 !important
}

.cart_table td {
    border-top: none !important;
    padding: 3px !important
}

.continuebtn {
    border: 1px solid #000;
    color: #000
}

.continuebtn,
.viewcartbtn {
    padding: 5px 0;
    width: 100%;
    text-align: center;
    font-size: 19px;
    font-family: Product Sans, Arial, sans-serif;
    cursor: pointer
}

.viewcartbtn {
    color: #fff;
    background: #0a7e2b
}

.w-full {
    width: 100%
}

.cart_table {
    color: #333 !important;
    font-family: Product Sans, Arial, sans-serif;
    font-size: 16px
}

.AdInnerDiv {
    background: #fff;
    width: 200px;
    height: 120px;
    border-radius: 3px;
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    padding: 14px
}

.AdInnerDiv p {
    margin: 0;
    padding-top: 10px
}

.adLoader {
    text-align: center;
    font-size: 16px
}

.sharesave_help {
    display: table;
    margin-left: auto;
    margin-right: auto
}

.btn_share_save {
    color: #fff !important;
    background-color: grey !important;
    display: inline-block;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    margin-left: 10px
}

#modalLogin .lgbtn {
    padding: 4px 23px;
    background-color: #43cb83 !important;
    border-color: #fff
}

#cf_login_btn {
    background: #44c985
}

.openregister,
.three_fifth a {
    color: #30a768 !important
}

#modalLogin h2.loginDiv {
    font-size: 25px;
    font-family: Product Sans, Arial, sans-serif !important
}

.modal-title {
    margin: 0;
    line-height: 1.42857143
}

.fb_btn_sprite {
    background: transparent url(https://www.arttoframe.com/images/header_sprite_images.png) -23px 104px;
    width: 109px;
    height: 34px;
    padding: 12px 52px 21px
}

.fb_login {
    cursor: pointer
}

.bottomSpace {
    margin-bottom: 10px
}

#modalLogin .one_fifth {
    width: 21.4%
}

.text-right {
    text-align: right
}

#modalLogin .three_fifth {
    position: relative;
    margin: 0;
    width: 73.4%
}

.forgotPassMsg {
    color: #4cae4c;
    font-family: Product Sans, Arial, sans-serif !important
}

#modalLogin .modal-content {
    padding: 38px 75px;
    font-family: Product Sans !important;
    height: auto !important
}

.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .2;
    border: 0
}

#modalLogin .modal-header .close {
    position: none;
    opacity: 1;
    background: #fff none repeat scroll 0 0 !important;
    box-shadow: none;
    top: 10px;
    right: 10px;
    position: absolute !important
}

.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    bottom: 20px !important
}

body {
    margin: 0;
    font-family: Roboto, Helvetica Neue, sans-serif
}

md-spinner {
    float: left;
    width: 24px !important;
    height: 24px !important;
    margin: 5px 10px 0 0 !important
}

.carousel-showmanymoveone .carousel-control {
    width: 4%;
    background-image: none
}

.carousel-showmanymoveone .carousel-control.left {
    margin-left: 0
}

.carousel-showmanymoveone .carousel-control.right {
    margin-right: 0
}

.carousel-showmanymoveone .cloneditem-1,
.carousel-showmanymoveone .cloneditem-2,
.carousel-showmanymoveone .cloneditem-3 {
    display: none
}

.carousel .item .col-xs-12 {
    padding: 0
}

@media only screen and (max-width:992px) {
    .carousel .item .col-xs-12:nth-last-child(-n+2) {
        display: none
    }
}

@media (min-width:768px) {

    .carousel-showmanymoveone .carousel-inner>.active.left,
    .carousel-showmanymoveone .carousel-inner>.prev {
        left: -50%
    }

    .carousel-showmanymoveone .carousel-inner>.active.right,
    .carousel-showmanymoveone .carousel-inner>.next {
        left: 50%
    }

    .carousel-showmanymoveone .carousel-inner>.active,
    .carousel-showmanymoveone .carousel-inner>.left,
    .carousel-showmanymoveone .carousel-inner>.prev.right {
        left: 0
    }

    .carousel-showmanymoveone .carousel-inner .cloneditem-1 {
        display: block
    }
}

@media (min-width:768px) and (transform-3d),
all and (min-width:768px) and (-webkit-transform-3d) {

    .carousel-showmanymoveone .carousel-inner>.item.active.right,
    .carousel-showmanymoveone .carousel-inner>.item.next {
        transform: translate3d(50%, 0, 0);
        left: 0
    }

    .carousel-showmanymoveone .carousel-inner>.item.active.left,
    .carousel-showmanymoveone .carousel-inner>.item.prev {
        transform: translate3d(-50%, 0, 0);
        left: 0
    }

    .carousel-showmanymoveone .carousel-inner>.item.active,
    .carousel-showmanymoveone .carousel-inner>.item.left,
    .carousel-showmanymoveone .carousel-inner>.item.prev.right {
        transform: translateZ(0);
        left: 0
    }
}

@media (min-width:992px) {

    .carousel-showmanymoveone .carousel-inner>.active.left,
    .carousel-showmanymoveone .carousel-inner>.prev {
        left: -16.6%
    }

    .carousel-showmanymoveone .carousel-inner>.active.right,
    .carousel-showmanymoveone .carousel-inner>.next {
        left: 16.6%
    }

    .carousel-showmanymoveone .carousel-inner>.active,
    .carousel-showmanymoveone .carousel-inner>.left,
    .carousel-showmanymoveone .carousel-inner>.prev.right {
        left: 0
    }

    .carousel-showmanymoveone .carousel-inner .cloneditem-2,
    .carousel-showmanymoveone .carousel-inner .cloneditem-3 {
        display: block
    }
}

@media (min-width:992px) and (transform-3d),
all and (min-width:992px) and (-webkit-transform-3d) {

    .carousel-showmanymoveone .carousel-inner>.item.active.right,
    .carousel-showmanymoveone .carousel-inner>.item.next {
        transform: translate3d(16.6%, 0, 0);
        left: 0
    }

    .carousel-showmanymoveone .carousel-inner>.item.active.left,
    .carousel-showmanymoveone .carousel-inner>.item.prev {
        transform: translate3d(-16.6%, 0, 0);
        left: 0
    }

    .carousel-showmanymoveone .carousel-inner>.item.active,
    .carousel-showmanymoveone .carousel-inner>.item.left,
    .carousel-showmanymoveone .carousel-inner>.item.prev.right {
        transform: translateZ(0);
        left: 0
    }
}

.carousel-cell img,
[_nghost-nyp-c62] .carousel-cells .carousel-cell video {
    height: 100%;
    object-fit: contain;
    position: relative;
    width: unset !important
}

.p-component {
    font-size: unset !important
}

@keyframes p-progress-spinner-color {

    0%,
    to {
        stroke: #d62d20
    }

    40% {
        stroke: #0057e7
    }

    66% {
        stroke: #008744
    }

    80%,
    90% {
        stroke: #ffa700
    }
}

p-progressSpinner {
    margin-left: 48% !important
}

.p-dialog-mask {
    display: block !important
}

.centerDialog {
    padding: 20px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

body,
html {
    padding: 0;
    margin: 0;
    position: relative;
    height: 100%
}

.swiper-container {
    width: 100%;
    height: 86%;
    margin: 0 auto
}

.swiper-slide {
    margin-top: 0;
    color: #000;
    text-align: center;
    line-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center
}

.p-paginator .p-paginator-pages .p-paginator-page {
    min-width: 3.357rem !important;
    height: 3.357rem !important
}

.p-link {
    font-size: 1.2rem !important
}

.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #efefef !important
}

#mCSB_1_container {
    height: 150px !important
}

.swiper-wrapper {
    height: 95% !important
}

.p-progress-spinner-circle {
    fill: #fff !important
}

.modal-backdrop {
    height: 100%;
    z-index: 20 !important
}

.RatingBox {
    background: #e3b51c;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 14px;
    margin: 20px 0 0
}

.RatingBox,
.ReviewButtonGray {
    font-family: Product Sans, Arial, sans !important
}

.ReviewButtonGray {
    background: #e6e6e6;
    padding: 13px;
    font-size: 14px;
    color: #5c5c5c;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-bottom: 20px
}

.Comment_title {
    font-size: 16px;
    color: #000;
    font-weight: 700
}

.Comment_title,
.User_by {
    font-family: Product Sans, Arial, sans !important
}

.User_by {
    font-size: 13px;
    color: #3b3b3b
}

.CommentBox_inner {
    background: #fff
}

.CommentBox,
.CommentBox_inner {
    padding: 15px;
    font-family: Product Sans, Arial, sans !important
}

.CommentBox {
    box-shadow: 0 3px 6px rgba(0, 0, 0, .10980392156862745);
    background: #f4f4f4;
    border-radius: 11px;
    margin-bottom: 20px
}

.Product_by {
    font-size: 11px
}

.comment_User,
.Product_by {
    color: #4b4b4b;
    font-family: Product Sans, Arial, sans !important
}

.comment_User {
    font-size: 12px;
    line-height: 1.6
}

.Commnet_text {
    font-size: 14px;
    color: #fff;
    font-family: Product Sans, Arial, sans !important;
    line-height: normal
}

.RatingPoints {
    background: #fff;
    width: 51px;
    height: 51px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    color: #e3b51c;
    margin: 15px auto
}

.RatingPoints,
.ReviewCounts {
    text-align: center;
    font-family: Product Sans, Arial, sans !important
}

.ReviewCounts {
    font-size: 12px;
    color: #fff
}

.Pro_comment {
    font-size: 25px;
    color: #fff;
    margin: 0;
    font-family: Product Sans, Arial, sans !important
}

.loadMoreReview {
    border: 1px solid #707070;
    font-size: 16px;
    color: #383838;
    width: 80%;
    margin: 20px auto;
    display: flex;
    padding: 10px;
    background: #fff;
    border-radius: 5px;
    align-items: center;
    justify-content: center;
    line-height: normal
}

.contentRating {
    border: none;
    box-shadow: none;
    border-radius: 15px
}

.swiper-button-next,
.swiper-button-prev {
    display: none !important
}

:root {
    --surface-a: #fff;
    --surface-b: #f8f9fa;
    --surface-c: #e9ecef;
    --surface-d: #dee2e6;
    --surface-e: #fff;
    --surface-f: #fff;
    --text-color: #495057;
    --text-color-secondary: #6c757d;
    --primary-color: #2196f3;
    --primary-color-text: #fff;
    --font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    --surface-0: #fff;
    --surface-50: #fafafa;
    --surface-100: #f5f5f5;
    --surface-200: #eee;
    --surface-300: #e0e0e0;
    --surface-400: #bdbdbd;
    --surface-500: #9e9e9e;
    --surface-600: #757575;
    --surface-700: #616161;
    --surface-800: #424242;
    --surface-900: #212121;
    --content-padding: 1rem;
    --inline-spacing: 0.5rem
}

* {
    box-sizing: border-box
}

.p-component {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 1rem;
    font-weight: 400
}

.p-component-overlay {
    background-color: rgba(0, 0, 0, .4);
    transition-duration: .2s
}

.p-component:disabled,
.p-disabled {
    opacity: .6
}

.p-error {
    color: #f44336
}

.p-text-secondary {
    color: #6c757d
}

.p-link,
.pi {
    font-size: 1rem
}

.p-link {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    border-radius: 3px
}

.p-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

:root {
    --blue-50: #f4fafe;
    --blue-100: #cae6fc;
    --blue-200: #a0d2fa;
    --blue-300: #75bef8;
    --blue-400: #4baaf5;
    --blue-500: #2196f3;
    --blue-600: #1c80cf;
    --blue-700: #1769aa;
    --blue-800: #125386;
    --blue-900: #0d3c61;
    --green-50: #f6fbf6;
    --green-100: #d4ecd5;
    --green-200: #b2ddb4;
    --green-300: #90cd93;
    --green-400: #6ebe71;
    --green-500: #4caf50;
    --green-600: #419544;
    --green-700: #357b38;
    --green-800: #2a602c;
    --green-900: #1e4620;
    --yellow-50: #fffcf5;
    --yellow-100: #fef0cd;
    --yellow-200: #fde4a5;
    --yellow-300: #fdd87d;
    --yellow-400: #fccc55;
    --yellow-500: #fbc02d;
    --yellow-600: #d5a326;
    --yellow-700: #b08620;
    --yellow-800: #8a6a19;
    --yellow-900: #644d12;
    --cyan-50: #f2fcfd;
    --cyan-100: #c2eff5;
    --cyan-200: #91e2ed;
    --cyan-300: #61d5e4;
    --cyan-400: #30c9dc;
    --cyan-500: #00bcd4;
    --cyan-600: #00a0b4;
    --cyan-700: #008494;
    --cyan-800: #006775;
    --cyan-900: #004b55;
    --pink-50: #fef4f7;
    --pink-100: #fac9da;
    --pink-200: #f69ebc;
    --pink-300: #f1749e;
    --pink-400: #ed4981;
    --pink-500: #e91e63;
    --pink-600: #c61a54;
    --pink-700: #a31545;
    --pink-800: #801136;
    --pink-900: #5d0c28;
    --indigo-50: #f5f6fb;
    --indigo-100: #d1d5ed;
    --indigo-200: #acb4df;
    --indigo-300: #8893d1;
    --indigo-400: #6372c3;
    --indigo-500: #3f51b5;
    --indigo-600: #36459a;
    --indigo-700: #2c397f;
    --indigo-800: #232d64;
    --indigo-900: #192048;
    --teal-50: #f2faf9;
    --teal-100: #c2e6e2;
    --teal-200: #91d2cc;
    --teal-300: #61beb5;
    --teal-400: #30aa9f;
    --teal-500: #009688;
    --teal-600: #008074;
    --teal-700: #00695f;
    --teal-800: #00534b;
    --teal-900: #003c36;
    --orange-50: #fff8f2;
    --orange-100: #fde0c2;
    --orange-200: #fbc791;
    --orange-300: #f9ae61;
    --orange-400: #f79530;
    --orange-500: #f57c00;
    --orange-600: #d06900;
    --orange-700: #ac5700;
    --orange-800: #874400;
    --orange-900: #623200;
    --bluegray-50: #f7f9f9;
    --bluegray-100: #d9e0e3;
    --bluegray-200: #bbc7cd;
    --bluegray-300: #9caeb7;
    --bluegray-400: #7e96a1;
    --bluegray-500: #607d8b;
    --bluegray-600: #526a76;
    --bluegray-700: #435861;
    --bluegray-800: #35454c;
    --bluegray-900: #263238;
    --purple-50: #faf4fb;
    --purple-100: #e7cbec;
    --purple-200: #d4a2dd;
    --purple-300: #c279ce;
    --purple-400: #af50bf;
    --purple-500: #9c27b0;
    --purple-600: #852196;
    --purple-700: #6d1b7b;
    --purple-800: #561561;
    --purple-900: #3e1046
}

.p-autocomplete .p-autocomplete-loader {
    right: .5rem
}

.p-autocomplete.p-autocomplete-dd .p-autocomplete-loader {
    right: 2.857rem
}

.p-autocomplete .p-autocomplete-multiple-container {
    padding: .25rem .5rem
}

.p-autocomplete .p-autocomplete-multiple-container:not(.p-disabled):hover {
    border-color: #2196f3
}

.p-autocomplete .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token {
    padding: .25rem 0
}

.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 1rem;
    color: #495057;
    padding: 0;
    margin: 0
}

.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-token {
    padding: .25rem .5rem;
    margin-right: .5rem;
    background: #e3f2fd;
    color: #495057;
    border-radius: 3px
}

.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
    margin-left: .5rem
}

p-autocomplete.ng-dirty.ng-invalid>.p-autocomplete>.p-inputtext {
    border-color: #f44336
}

.p-autocomplete-panel {
    background: #fff;
    color: #495057;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-autocomplete-panel .p-autocomplete-items {
    padding: .5rem 0
}

.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item {
    margin: 0;
    padding: .5rem 1rem;
    border: 0;
    color: #495057;
    background: transparent;
    transition: box-shadow .2s;
    border-radius: 0
}

.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item:hover {
    color: #495057;
    background: #e9ecef
}

.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
    margin: 0;
    padding: .75rem 1rem;
    color: #495057;
    background: #fff;
    font-weight: 600
}

p-calendar.ng-dirty.ng-invalid>.p-calendar>.p-inputtext {
    border-color: #f44336
}

.p-datepicker {
    padding: .5rem;
    background: #fff;
    color: #495057;
    border: 1px solid #ced4da;
    border-radius: 3px
}

.p-datepicker:not(.p-datepicker-inline) {
    background: #fff;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-datepicker:not(.p-datepicker-inline) .p-datepicker-header {
    background: #fff
}

.p-datepicker .p-datepicker-header {
    padding: .5rem;
    color: #495057;
    background: #fff;
    font-weight: 600;
    margin: 0;
    border-bottom: 1px solid #dee2e6;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-datepicker .p-datepicker-header .p-datepicker-next,
.p-datepicker .p-datepicker-header .p-datepicker-prev {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-datepicker .p-datepicker-header .p-datepicker-next:enabled:hover,
.p-datepicker .p-datepicker-header .p-datepicker-prev:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-datepicker .p-datepicker-header .p-datepicker-next:focus,
.p-datepicker .p-datepicker-header .p-datepicker-prev:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-datepicker .p-datepicker-header .p-datepicker-title {
    line-height: 2rem
}

.p-datepicker .p-datepicker-header .p-datepicker-title select {
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-datepicker .p-datepicker-header .p-datepicker-title select:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-month {
    margin-right: .5rem
}

.p-datepicker table {
    font-size: 1rem;
    margin: .5rem 0
}

.p-datepicker table th {
    padding: .5rem
}

.p-datepicker table th>span {
    width: 2.5rem;
    height: 2.5rem
}

.p-datepicker table td {
    padding: .5rem
}

.p-datepicker table td>span {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    transition: box-shadow .2s;
    border: 1px solid transparent
}

.p-datepicker table td>span.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-datepicker table td>span:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-datepicker table td.p-datepicker-today>span {
    background: #ced4da;
    color: #495057;
    border-color: transparent
}

.p-datepicker table td.p-datepicker-today>span.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-datepicker .p-datepicker-buttonbar {
    padding: 1rem 0;
    border-top: 1px solid #dee2e6
}

.p-datepicker .p-datepicker-buttonbar .p-button {
    width: auto
}

.p-datepicker .p-timepicker {
    border-top: 1px solid #dee2e6;
    padding: .5rem
}

.p-datepicker .p-timepicker button {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-datepicker .p-timepicker button:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-datepicker .p-timepicker button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-datepicker .p-timepicker button:last-child {
    margin-top: .2em
}

.p-datepicker .p-timepicker span {
    font-size: 1.25rem
}

.p-datepicker .p-timepicker>div {
    padding: 0 .5rem
}

.p-datepicker.p-datepicker-timeonly .p-timepicker {
    border-top: 0
}

.p-datepicker .p-monthpicker {
    margin: .5rem 0
}

.p-datepicker .p-monthpicker .p-monthpicker-month {
    padding: .5rem;
    transition: box-shadow .2s;
    border-radius: 3px
}

.p-datepicker .p-monthpicker .p-monthpicker-month.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-datepicker.p-datepicker-multiple-month .p-datepicker-group {
    border-right: 1px solid #dee2e6;
    padding: 0 .5rem
}

.p-datepicker.p-datepicker-multiple-month .p-datepicker-group:first-child {
    padding-left: 0
}

.p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child {
    padding-right: 0;
    border-right: 0
}

.p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled):hover {
    background: #e9ecef
}

.p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled):focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-datepicker:not(.p-disabled) .p-monthpicker .p-monthpicker-month:not(.p-highlight):not(.p-disabled):hover {
    background: #e9ecef
}

.p-datepicker:not(.p-disabled) .p-monthpicker .p-monthpicker-month:not(.p-highlight):not(.p-disabled):focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

@media screen and (max-width:769px) {

    .p-datepicker table td,
    .p-datepicker table th {
        padding: 0
    }
}

.p-cascadeselect {
    background: #fff;
    border: 1px solid #ced4da;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    border-radius: 3px
}

.p-cascadeselect:not(.p-disabled):hover {
    border-color: #2196f3
}

.p-cascadeselect:not(.p-disabled).p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-cascadeselect .p-cascadeselect-label {
    background: transparent;
    border: 0;
    padding: .5rem
}

.p-cascadeselect .p-cascadeselect-label.p-placeholder {
    color: #6c757d
}

.p-cascadeselect .p-cascadeselect-label:enabled:focus {
    outline: 0 none;
    box-shadow: none
}

.p-cascadeselect .p-cascadeselect-trigger {
    background: transparent;
    color: #6c757d;
    width: 2.357rem;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-cascadeselect-panel {
    background: #fff;
    color: #495057;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-cascadeselect-panel .p-cascadeselect-items {
    padding: .5rem 0
}

.p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item {
    margin: 0;
    border: 0;
    color: #495057;
    background: transparent;
    transition: box-shadow .2s;
    border-radius: 0
}

.p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item .p-cascadeselect-item-content {
    padding: .5rem 1rem
}

.p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item .p-cascadeselect-item-content:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item:not(.p-highlight):not(.p-disabled):hover {
    color: #495057;
    background: #e9ecef
}

.p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item .p-cascadeselect-group-icon {
    font-size: .875rem
}

p-cascadeselect.ng-dirty.ng-invalid>.p-cascadeselect {
    border-color: #f44336
}

.p-input-filled .p-cascadeselect {
    background: #f8f9fa
}

.p-input-filled .p-cascadeselect:not(.p-disabled):hover {
    background-color: #f8f9fa
}

.p-input-filled .p-cascadeselect:not(.p-disabled).p-focus {
    background-color: #fff
}

.p-checkbox {
    width: 20px;
    height: 20px
}

.p-checkbox .p-checkbox-box {
    border: 2px solid #ced4da;
    background: #fff;
    width: 20px;
    height: 20px;
    color: #495057;
    border-radius: 3px;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-checkbox .p-checkbox-box .p-checkbox-icon {
    transition-duration: .2s;
    color: #fff;
    font-size: 14px
}

.p-checkbox .p-checkbox-box.p-highlight {
    border-color: #2196f3;
    background: #2196f3
}

.p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover {
    border-color: #2196f3
}

.p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover {
    border-color: #0b7ad1;
    background: #0b7ad1;
    color: #fff
}

p-checkbox.ng-dirty.ng-invalid>.p-checkbox>.p-checkbox-box {
    border-color: #f44336
}

.p-input-filled .p-checkbox .p-checkbox-box {
    background-color: #f8f9fa
}

.p-input-filled .p-checkbox .p-checkbox-box.p-highlight {
    background: #2196f3
}

.p-input-filled .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover {
    background-color: #f8f9fa
}

.p-input-filled .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover {
    background: #0b7ad1
}

.p-checkbox-label {
    margin-left: .5rem
}

.p-chips .p-chips-multiple-container {
    padding: .25rem .5rem
}

.p-chips .p-chips-multiple-container:not(.p-disabled):hover {
    border-color: #2196f3
}

.p-chips .p-chips-multiple-container:not(.p-disabled).p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-chips .p-chips-multiple-container .p-chips-token {
    padding: .25rem .5rem;
    margin-right: .5rem;
    background: #e3f2fd;
    color: #495057;
    border-radius: 3px
}

.p-chips .p-chips-multiple-container .p-chips-token .p-chips-token-icon {
    margin-left: .5rem
}

.p-chips .p-chips-multiple-container .p-chips-input-token {
    padding: .25rem 0
}

.p-chips .p-chips-multiple-container .p-chips-input-token input {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 1rem;
    color: #495057;
    padding: 0;
    margin: 0
}

p-chips.ng-dirty.ng-invalid>.p-chips>.p-inputtext {
    border-color: #f44336
}

.p-colorpicker-preview,
.p-fluid .p-colorpicker-preview.p-inputtext {
    width: 2rem;
    height: 2rem
}

.p-colorpicker-panel {
    background: #323232;
    border-color: #191919
}

.p-colorpicker-panel .p-colorpicker-color-handle,
.p-colorpicker-panel .p-colorpicker-hue-handle {
    border-color: #fff
}

.p-colorpicker-overlay-panel {
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-dropdown {
    background: #fff;
    border: 1px solid #ced4da;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    border-radius: 3px
}

.p-dropdown:not(.p-disabled):hover {
    border-color: #2196f3
}

.p-dropdown:not(.p-disabled).p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-dropdown.p-dropdown-clearable .p-dropdown-label {
    padding-right: 1.5rem
}

.p-dropdown .p-dropdown-label {
    background: transparent;
    border: 0
}

.p-dropdown .p-dropdown-label.p-placeholder {
    color: #6c757d
}

.p-dropdown .p-dropdown-label:enabled:focus {
    outline: 0 none;
    box-shadow: none
}

.p-dropdown .p-dropdown-trigger {
    background: transparent;
    color: #6c757d;
    width: 2.357rem;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-dropdown .p-dropdown-clear-icon {
    color: #6c757d;
    right: 2.357rem
}

.p-dropdown-panel {
    background: #fff;
    color: #495057;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-dropdown-panel .p-dropdown-header {
    padding: .5rem 1rem;
    border-bottom: 0;
    color: #495057;
    background: #f8f9fa;
    margin: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-dropdown-panel .p-dropdown-header .p-dropdown-filter {
    padding-right: 1.5rem
}

.p-dropdown-panel .p-dropdown-header .p-dropdown-filter-icon {
    right: .5rem;
    color: #6c757d
}

.p-dropdown-panel .p-dropdown-items {
    padding: .5rem 0
}

.p-dropdown-panel .p-dropdown-items .p-dropdown-item {
    margin: 0;
    padding: .5rem 1rem;
    border: 0;
    color: #495057;
    background: transparent;
    transition: box-shadow .2s;
    border-radius: 0
}

.p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-dropdown-panel .p-dropdown-items .p-dropdown-item:not(.p-highlight):not(.p-disabled):hover {
    color: #495057;
    background: #e9ecef
}

.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
    padding: .5rem 1rem;
    color: #495057;
    background: transparent
}

.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
    margin: 0;
    padding: .75rem 1rem;
    color: #495057;
    background: #fff;
    font-weight: 600
}

p-dropdown.ng-dirty.ng-invalid>.p-dropdown {
    border-color: #f44336
}

.p-input-filled .p-dropdown {
    background: #f8f9fa
}

.p-input-filled .p-dropdown:not(.p-disabled):hover {
    background-color: #f8f9fa
}

.p-input-filled .p-dropdown:not(.p-disabled).p-focus {
    background-color: #fff
}

.p-editor-container .p-editor-toolbar {
    background: #f8f9fa;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-editor-container .p-editor-toolbar.ql-snow {
    border: 1px solid #dee2e6
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-stroke {
    stroke: #6c757d
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-fill {
    fill: #6c757d
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label {
    border: 0;
    color: #6c757d
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover {
    color: #495057
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-stroke {
    stroke: #495057
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-fill {
    fill: #495057
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
    color: #495057
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
    stroke: #495057
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
    fill: #495057
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    background: #fff;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    border-radius: 3px;
    padding: .5rem 0
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item {
    color: #495057
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item:hover {
    color: #495057;
    background: #e9ecef
}

.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded:not(.ql-icon-picker) .ql-picker-item {
    padding: .5rem 1rem
}

.p-editor-container .p-editor-content {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-editor-container .p-editor-content.ql-snow {
    border: 1px solid #dee2e6
}

.p-editor-container .p-editor-content .ql-editor {
    background: #fff;
    color: #495057;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-editor-container .ql-snow.ql-toolbar button:focus,
.p-editor-container .ql-snow.ql-toolbar button:hover {
    color: #495057
}

.p-editor-container .ql-snow.ql-toolbar button:focus .ql-stroke,
.p-editor-container .ql-snow.ql-toolbar button:hover .ql-stroke {
    stroke: #495057
}

.p-editor-container .ql-snow.ql-toolbar button:focus .ql-fill,
.p-editor-container .ql-snow.ql-toolbar button:hover .ql-fill {
    fill: #495057
}

.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active,
.p-editor-container .ql-snow.ql-toolbar button.ql-active {
    color: #2196f3
}

.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-stroke {
    stroke: #2196f3
}

.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-fill {
    fill: #2196f3
}

.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-picker-label,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-picker-label,
.p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-picker-label {
    color: #2196f3
}

.p-inputgroup-addon {
    background: #e9ecef;
    color: #6c757d;
    border-top: 1px solid #ced4da;
    border-left: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
    padding: .5rem;
    min-width: 2.357rem
}

.p-inputgroup-addon:last-child {
    border-right: 1px solid #ced4da
}

.p-inputgroup>.p-component,
.p-inputgroup>.p-float-label>.p-component {
    border-radius: 0;
    margin: 0
}

.p-inputgroup>.p-component+.p-inputgroup-addon,
.p-inputgroup>.p-float-label>.p-component+.p-inputgroup-addon {
    border-left: 0
}

.p-inputgroup>.p-component:focus,
.p-inputgroup>.p-component:focus~label,
.p-inputgroup>.p-float-label>.p-component:focus,
.p-inputgroup>.p-float-label>.p-component:focus~label {
    z-index: 1
}

.p-inputgroup-addon:first-child,
.p-inputgroup .p-float-label:first-child input,
.p-inputgroup button:first-child,
.p-inputgroup input:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-inputgroup-addon:last-child,
.p-inputgroup .p-float-label:last-child input,
.p-inputgroup button:last-child,
.p-inputgroup input:last-child {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-fluid .p-inputgroup .p-button {
    width: auto
}

.p-fluid .p-inputgroup .p-button.p-button-icon-only {
    width: 2.357rem
}

p-inputmask.ng-dirty.ng-invalid>.p-inputtext,
p-inputnumber.ng-dirty.ng-invalid>.p-inputnumber>.p-inputtext {
    border-color: #f44336
}

.p-inputswitch {
    width: 3rem;
    height: 1.75rem
}

.p-inputswitch .p-inputswitch-slider {
    background: #ced4da;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    border-radius: 30px
}

.p-inputswitch .p-inputswitch-slider:before {
    background: #fff;
    width: 1.25rem;
    height: 1.25rem;
    left: .25rem;
    margin-top: -.625rem;
    border-radius: 50%;
    transition-duration: .2s
}

.p-inputswitch.p-inputswitch-checked .p-inputswitch-slider:before {
    transform: translateX(1.25rem)
}

.p-inputswitch.p-focus .p-inputswitch-slider {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-inputswitch:not(.p-disabled):hover .p-inputswitch-slider {
    background: #b6bfc8
}

.p-inputswitch.p-inputswitch-checked .p-inputswitch-slider {
    background: #2196f3
}

.p-inputswitch.p-inputswitch-checked .p-inputswitch-slider:before {
    background: #fff
}

.p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider {
    background: #0d89ec
}

p-inputswitch.ng-dirty.ng-invalid>.p-inputswitch {
    border-color: #f44336
}

.p-inputtext {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 1rem;
    color: #495057;
    background: #fff;
    padding: .5rem;
    border: 1px solid #ced4da;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 3px
}

.p-inputtext:enabled:hover {
    border-color: #2196f3
}

.p-inputtext:enabled:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-inputtext.ng-dirty.ng-invalid {
    border-color: #f44336
}

.p-inputtext.p-inputtext-sm {
    font-size: .875rem;
    padding: .4375rem
}

.p-inputtext.p-inputtext-lg {
    font-size: 1.25rem;
    padding: .625rem
}

.p-float-label>label {
    left: .5rem;
    color: #6c757d;
    transition-duration: .2s
}

.p-float-label>.ng-invalid.ng-dirty+label {
    color: #f44336
}

.p-input-icon-left>i:first-of-type {
    left: .5rem;
    color: #6c757d
}

.p-input-icon-left>.p-inputtext {
    padding-left: 2rem
}

.p-input-icon-left.p-float-label>label {
    left: 2rem
}

.p-input-icon-right>i:last-of-type {
    right: .5rem;
    color: #6c757d
}

.p-input-icon-right>.p-inputtext {
    padding-right: 2rem
}

::-webkit-input-placeholder {
    color: #6c757d
}

:-moz-placeholder,
::-moz-placeholder {
    color: #6c757d
}

:-ms-input-placeholder {
    color: #6c757d
}

.p-input-filled .p-inputtext,
.p-input-filled .p-inputtext:enabled:hover {
    background-color: #f8f9fa
}

.p-input-filled .p-inputtext:enabled:focus {
    background-color: #fff
}

.p-inputtext-sm .p-inputtext {
    font-size: .875rem;
    padding: .4375rem
}

.p-inputtext-lg .p-inputtext {
    font-size: 1.25rem;
    padding: .625rem
}

.p-listbox {
    background: #fff;
    color: #495057;
    border: 1px solid #ced4da;
    border-radius: 3px
}

.p-listbox .p-listbox-header {
    padding: .5rem 1rem;
    border-bottom: 0;
    color: #495057;
    background: #f8f9fa;
    margin: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-listbox .p-listbox-header .p-listbox-filter {
    padding-right: 1.5rem
}

.p-listbox .p-listbox-header .p-listbox-filter-icon {
    right: .5rem;
    color: #6c757d
}

.p-listbox .p-listbox-header .p-checkbox {
    margin-right: .5rem
}

.p-listbox .p-listbox-list {
    padding: .5rem 0
}

.p-listbox .p-listbox-list .p-listbox-item {
    margin: 0;
    padding: .5rem 1rem;
    border: 0;
    color: #495057;
    transition: box-shadow .2s;
    border-radius: 0
}

.p-listbox .p-listbox-list .p-listbox-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-listbox .p-listbox-list .p-listbox-item:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-listbox .p-listbox-list .p-listbox-item .p-checkbox {
    margin-right: .5rem
}

.p-listbox .p-listbox-list .p-listbox-item-group {
    margin: 0;
    padding: .75rem 1rem;
    color: #495057;
    background: #fff;
    font-weight: 600
}

.p-listbox:not(.p-disabled) .p-listbox-item:not(.p-highlight):not(.p-disabled):hover {
    color: #495057;
    background: #e9ecef
}

p-listbox.ng-dirty.ng-invalid>.p-listbox {
    border-color: #f44336
}

.p-multiselect {
    background: #fff;
    border: 1px solid #ced4da;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    border-radius: 3px
}

.p-multiselect:not(.p-disabled):hover {
    border-color: #2196f3
}

.p-multiselect:not(.p-disabled).p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-multiselect .p-multiselect-label {
    padding: .5rem;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-multiselect .p-multiselect-label.p-placeholder {
    color: #6c757d
}

.p-multiselect.p-multiselect-chip .p-multiselect-token {
    padding: .25rem .5rem;
    margin-right: .5rem;
    background: #e3f2fd;
    color: #495057;
    border-radius: 3px
}

.p-multiselect.p-multiselect-chip .p-multiselect-token .p-multiselect-token-icon {
    margin-left: .5rem
}

.p-multiselect .p-multiselect-trigger {
    background: transparent;
    color: #6c757d;
    width: 2.357rem;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-inputwrapper-filled .p-multiselect.p-multiselect-chip .p-multiselect-label {
    padding: .25rem .5rem
}

.p-multiselect-panel {
    background: #fff;
    color: #495057;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-multiselect-panel .p-multiselect-header {
    padding: .5rem 1rem;
    border-bottom: 0;
    color: #495057;
    background: #f8f9fa;
    margin: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-inputtext {
    padding-right: 1.5rem
}

.p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-multiselect-filter-icon {
    right: .5rem;
    color: #6c757d
}

.p-multiselect-panel .p-multiselect-header .p-checkbox {
    margin-right: .5rem
}

.p-multiselect-panel .p-multiselect-header .p-multiselect-close {
    margin-left: .5rem;
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-multiselect-panel .p-multiselect-header .p-multiselect-close:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-multiselect-panel .p-multiselect-header .p-multiselect-close:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-multiselect-panel .p-multiselect-items {
    padding: .5rem 0
}

.p-multiselect-panel .p-multiselect-items .p-multiselect-item {
    margin: 0;
    padding: .5rem 1rem;
    border: 0;
    color: #495057;
    background: transparent;
    transition: box-shadow .2s;
    border-radius: 0
}

.p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-multiselect-panel .p-multiselect-items .p-multiselect-item:not(.p-highlight):not(.p-disabled):hover {
    color: #495057;
    background: #e9ecef
}

.p-multiselect-panel .p-multiselect-items .p-multiselect-item:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
    margin-right: .5rem
}

.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
    margin: 0;
    padding: .75rem 1rem;
    color: #495057;
    background: #fff;
    font-weight: 600
}

.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
    padding: .5rem 1rem;
    color: #495057;
    background: transparent
}

p-multiselect.ng-dirty.ng-invalid>.p-multiselect {
    border-color: #f44336
}

.p-input-filled .p-multiselect {
    background: #f8f9fa
}

.p-input-filled .p-multiselect:not(.p-disabled):hover {
    background-color: #f8f9fa
}

.p-input-filled .p-multiselect:not(.p-disabled).p-focus {
    background-color: #fff
}

.p-password.p-invalid.p-component>.p-inputtext {
    border-color: #f44336
}

.p-password-panel {
    padding: 1rem;
    background: #fff;
    color: #495057;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    border-radius: 3px
}

.p-password-panel .p-password-meter {
    margin-bottom: .5rem;
    background: #dee2e6
}

.p-password-panel .p-password-meter .p-password-strength.weak {
    background: #d32f2f
}

.p-password-panel .p-password-meter .p-password-strength.medium {
    background: #fbc02d
}

.p-password-panel .p-password-meter .p-password-strength.strong {
    background: #689f38
}

.p-radiobutton {
    width: 20px;
    height: 20px
}

.p-radiobutton .p-radiobutton-box {
    border: 2px solid #ced4da;
    background: #fff;
    width: 20px;
    height: 20px;
    color: #495057;
    border-radius: 50%;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover {
    border-color: #2196f3
}

.p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: #2196f3
}

.p-radiobutton .p-radiobutton-box .p-radiobutton-icon {
    width: 12px;
    height: 12px;
    transition-duration: .2s;
    background-color: #fff
}

.p-radiobutton .p-radiobutton-box.p-highlight {
    border-color: #2196f3;
    background: #2196f3
}

.p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover {
    border-color: #0b7ad1;
    background: #0b7ad1;
    color: #fff
}

p-radiobutton.ng-dirty.ng-invalid>.p-radiobutton>.p-radiobutton-box {
    border-color: #f44336
}

.p-input-filled .p-radiobutton .p-radiobutton-box,
.p-input-filled .p-radiobutton .p-radiobutton-box:not(.p-disabled):hover {
    background-color: #f8f9fa
}

.p-input-filled .p-radiobutton .p-radiobutton-box.p-highlight {
    background: #2196f3
}

.p-input-filled .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover {
    background: #0b7ad1
}

.p-radiobutton-label {
    margin-left: .5rem
}

.p-rating .p-rating-icon {
    color: #495057;
    margin-left: .5rem;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    font-size: 1.143rem
}

.p-rating .p-rating-icon.p-rating-cancel {
    color: #e74c3c
}

.p-rating .p-rating-icon:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-rating .p-rating-icon:first-child {
    margin-left: 0
}

.p-rating .p-rating-icon.pi-star,
.p-rating:not(.p-disabled):not(.p-readonly) .p-rating-icon:hover {
    color: #2196f3
}

.p-rating:not(.p-disabled):not(.p-readonly) .p-rating-icon.p-rating-cancel:hover {
    color: #c0392b
}

.p-selectbutton .p-button {
    background: #fff;
    border: 1px solid #ced4da;
    color: #495057;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-selectbutton .p-button .p-button-icon-left,
.p-selectbutton .p-button .p-button-icon-right {
    color: #6c757d
}

.p-selectbutton .p-button:not(.p-disabled):not(.p-highlight):hover {
    background: #e9ecef;
    border-color: #ced4da;
    color: #495057
}

.p-selectbutton .p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-left,
.p-selectbutton .p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-right {
    color: #6c757d
}

.p-selectbutton .p-button.p-highlight {
    background: #2196f3;
    border-color: #2196f3;
    color: #fff
}

.p-selectbutton .p-button.p-highlight .p-button-icon-left,
.p-selectbutton .p-button.p-highlight .p-button-icon-right {
    color: #fff
}

.p-selectbutton .p-button.p-highlight:hover {
    background: #0d89ec;
    border-color: #0d89ec;
    color: #fff
}

.p-selectbutton .p-button.p-highlight:hover .p-button-icon-left,
.p-selectbutton .p-button.p-highlight:hover .p-button-icon-right {
    color: #fff
}

p-selectbutton.ng-dirty.ng-invalid>.p-selectbutton>.p-button {
    border-color: #f44336
}

.p-slider {
    background: #dee2e6;
    border: 0;
    border-radius: 3px
}

.p-slider.p-slider-horizontal {
    height: .286rem
}

.p-slider.p-slider-horizontal .p-slider-handle {
    margin-top: -.5715rem;
    margin-left: -.5715rem
}

.p-slider.p-slider-vertical {
    width: .286rem
}

.p-slider.p-slider-vertical .p-slider-handle {
    margin-left: -.5715rem;
    margin-bottom: -.5715rem
}

.p-slider .p-slider-handle {
    height: 1.143rem;
    width: 1.143rem;
    background: #fff;
    border: 2px solid #2196f3;
    border-radius: 50%;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-slider .p-slider-handle:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-slider .p-slider-range {
    background: #2196f3
}

.p-slider:not(.p-disabled) .p-slider-handle:hover {
    background: #2196f3;
    border-color: #2196f3
}

.p-slider.p-slider-animate.p-slider-horizontal .p-slider-handle {
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s, left .2s
}

.p-slider.p-slider-animate.p-slider-horizontal .p-slider-range {
    transition: width .2s
}

.p-slider.p-slider-animate.p-slider-vertical .p-slider-handle {
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s, bottom .2s
}

.p-slider.p-slider-animate.p-slider-vertical .p-slider-range {
    transition: height .2s
}

.p-togglebutton.p-button {
    background: #fff;
    border: 1px solid #ced4da;
    color: #495057;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-togglebutton.p-button .p-button-icon-left,
.p-togglebutton.p-button .p-button-icon-right {
    color: #6c757d
}

.p-togglebutton.p-button:not(.p-disabled):not(.p-highlight):hover {
    background: #e9ecef;
    border-color: #ced4da;
    color: #495057
}

.p-togglebutton.p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-left,
.p-togglebutton.p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-right {
    color: #6c757d
}

.p-togglebutton.p-button.p-highlight {
    background: #2196f3;
    border-color: #2196f3;
    color: #fff
}

.p-togglebutton.p-button.p-highlight .p-button-icon-left,
.p-togglebutton.p-button.p-highlight .p-button-icon-right {
    color: #fff
}

.p-togglebutton.p-button.p-highlight:hover {
    background: #0d89ec;
    border-color: #0d89ec;
    color: #fff
}

.p-togglebutton.p-button.p-highlight:hover .p-button-icon-left,
.p-togglebutton.p-button.p-highlight:hover .p-button-icon-right {
    color: #fff
}

p-togglebutton.ng-dirty.ng-invalid>.p-togglebutton.p-button {
    border-color: #f44336
}

.p-button {
    color: #fff;
    background: #2196f3;
    border: 1px solid #2196f3;
    padding: .5rem 1rem;
    font-size: 1rem;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    border-radius: 3px
}

.p-button:enabled:hover {
    background: #0d89ec;
    color: #fff;
    border-color: #0d89ec
}

.p-button:enabled:active {
    background: #0b7ad1;
    color: #fff;
    border-color: #0b7ad1
}

.p-button.p-button-outlined {
    background-color: initial;
    color: #2196f3;
    border: 1px solid
}

.p-button.p-button-outlined:enabled:hover {
    background: rgba(33, 150, 243, .04);
    color: #2196f3;
    border: 1px solid
}

.p-button.p-button-outlined:enabled:active {
    background: rgba(33, 150, 243, .16);
    color: #2196f3;
    border: 1px solid
}

.p-button.p-button-outlined.p-button-plain {
    color: #6c757d;
    border-color: #6c757d
}

.p-button.p-button-outlined.p-button-plain:enabled:hover {
    background: #e9ecef;
    color: #6c757d
}

.p-button.p-button-outlined.p-button-plain:enabled:active {
    background: #dee2e6;
    color: #6c757d
}

.p-button.p-button-text {
    background-color: initial;
    color: #2196f3;
    border-color: transparent
}

.p-button.p-button-text:enabled:hover {
    background: rgba(33, 150, 243, .04);
    color: #2196f3;
    border-color: transparent
}

.p-button.p-button-text:enabled:active {
    background: rgba(33, 150, 243, .16);
    color: #2196f3;
    border-color: transparent
}

.p-button.p-button-text.p-button-plain {
    color: #6c757d
}

.p-button.p-button-text.p-button-plain:enabled:hover {
    background: #e9ecef;
    color: #6c757d
}

.p-button.p-button-text.p-button-plain:enabled:active {
    background: #dee2e6;
    color: #6c757d
}

.p-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-button .p-button-icon-left {
    margin-right: .5rem
}

.p-button .p-button-icon-right {
    margin-left: .5rem
}

.p-button .p-button-icon-bottom {
    margin-top: .5rem
}

.p-button .p-button-icon-top {
    margin-bottom: .5rem
}

.p-button .p-badge {
    margin-left: .5rem;
    min-width: 1rem;
    height: 1rem;
    line-height: 1rem;
    color: #2196f3;
    background-color: #fff
}

.p-button.p-button-raised {
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12)
}

.p-button.p-button-rounded {
    border-radius: 2rem
}

.p-button.p-button-icon-only {
    width: 2.357rem;
    padding: .5rem 0
}

.p-button.p-button-icon-only .p-button-icon-left,
.p-button.p-button-icon-only .p-button-icon-right {
    margin: 0
}

.p-button.p-button-icon-only.p-button-rounded {
    border-radius: 50%;
    height: 2.357rem
}

.p-button.p-button-sm {
    font-size: .875rem;
    padding: .4375rem .875rem
}

.p-button.p-button-sm .p-button-icon {
    font-size: .875rem
}

.p-button.p-button-lg {
    font-size: 1.25rem;
    padding: .625rem 1.25rem
}

.p-button.p-button-lg .p-button-icon {
    font-size: 1.25rem
}

.p-fluid .p-button {
    width: 100%
}

.p-fluid .p-button-icon-only {
    width: 2.357rem
}

.p-fluid .p-buttonset {
    display: flex
}

.p-fluid .p-buttonset .p-button {
    flex: 1
}

.p-button.p-button-secondary,
.p-buttonset.p-button-secondary>.p-button,
.p-splitbutton.p-button-secondary>.p-button {
    color: #fff;
    background: #607d8b;
    border: 1px solid #607d8b
}

.p-button.p-button-secondary:enabled:hover,
.p-buttonset.p-button-secondary>.p-button:enabled:hover,
.p-splitbutton.p-button-secondary>.p-button:enabled:hover {
    background: #56717d;
    color: #fff;
    border-color: #56717d
}

.p-button.p-button-secondary:enabled:focus,
.p-buttonset.p-button-secondary>.p-button:enabled:focus,
.p-splitbutton.p-button-secondary>.p-button:enabled:focus {
    box-shadow: 0 0 0 .2rem #beccd2
}

.p-button.p-button-secondary:enabled:active,
.p-buttonset.p-button-secondary>.p-button:enabled:active,
.p-splitbutton.p-button-secondary>.p-button:enabled:active {
    background: #4d646f;
    color: #fff;
    border-color: #4d646f
}

.p-button.p-button-secondary.p-button-outlined,
.p-buttonset.p-button-secondary>.p-button.p-button-outlined,
.p-splitbutton.p-button-secondary>.p-button.p-button-outlined {
    background-color: initial;
    color: #607d8b;
    border: 1px solid
}

.p-button.p-button-secondary.p-button-outlined:enabled:hover,
.p-buttonset.p-button-secondary>.p-button.p-button-outlined:enabled:hover,
.p-splitbutton.p-button-secondary>.p-button.p-button-outlined:enabled:hover {
    background: rgba(96, 125, 139, .04);
    color: #607d8b;
    border: 1px solid
}

.p-button.p-button-secondary.p-button-outlined:enabled:active,
.p-buttonset.p-button-secondary>.p-button.p-button-outlined:enabled:active,
.p-splitbutton.p-button-secondary>.p-button.p-button-outlined:enabled:active {
    background: rgba(96, 125, 139, .16);
    color: #607d8b;
    border: 1px solid
}

.p-button.p-button-secondary.p-button-text,
.p-buttonset.p-button-secondary>.p-button.p-button-text,
.p-splitbutton.p-button-secondary>.p-button.p-button-text {
    background-color: initial;
    color: #607d8b;
    border-color: transparent
}

.p-button.p-button-secondary.p-button-text:enabled:hover,
.p-buttonset.p-button-secondary>.p-button.p-button-text:enabled:hover,
.p-splitbutton.p-button-secondary>.p-button.p-button-text:enabled:hover {
    background: rgba(96, 125, 139, .04);
    border-color: transparent;
    color: #607d8b
}

.p-button.p-button-secondary.p-button-text:enabled:active,
.p-buttonset.p-button-secondary>.p-button.p-button-text:enabled:active,
.p-splitbutton.p-button-secondary>.p-button.p-button-text:enabled:active {
    background: rgba(96, 125, 139, .16);
    border-color: transparent;
    color: #607d8b
}

.p-button.p-button-info,
.p-buttonset.p-button-info>.p-button,
.p-splitbutton.p-button-info>.p-button {
    color: #fff;
    background: #0288d1;
    border: 1px solid #0288d1
}

.p-button.p-button-info:enabled:hover,
.p-buttonset.p-button-info>.p-button:enabled:hover,
.p-splitbutton.p-button-info>.p-button:enabled:hover {
    background: #027abc;
    color: #fff;
    border-color: #027abc
}

.p-button.p-button-info:enabled:focus,
.p-buttonset.p-button-info>.p-button:enabled:focus,
.p-splitbutton.p-button-info>.p-button:enabled:focus {
    box-shadow: 0 0 0 .2rem #89d4fe
}

.p-button.p-button-info:enabled:active,
.p-buttonset.p-button-info>.p-button:enabled:active,
.p-splitbutton.p-button-info>.p-button:enabled:active {
    background: #026da7;
    color: #fff;
    border-color: #026da7
}

.p-button.p-button-info.p-button-outlined,
.p-buttonset.p-button-info>.p-button.p-button-outlined,
.p-splitbutton.p-button-info>.p-button.p-button-outlined {
    background-color: initial;
    color: #0288d1;
    border: 1px solid
}

.p-button.p-button-info.p-button-outlined:enabled:hover,
.p-buttonset.p-button-info>.p-button.p-button-outlined:enabled:hover,
.p-splitbutton.p-button-info>.p-button.p-button-outlined:enabled:hover {
    background: rgba(2, 136, 209, .04);
    color: #0288d1;
    border: 1px solid
}

.p-button.p-button-info.p-button-outlined:enabled:active,
.p-buttonset.p-button-info>.p-button.p-button-outlined:enabled:active,
.p-splitbutton.p-button-info>.p-button.p-button-outlined:enabled:active {
    background: rgba(2, 136, 209, .16);
    color: #0288d1;
    border: 1px solid
}

.p-button.p-button-info.p-button-text,
.p-buttonset.p-button-info>.p-button.p-button-text,
.p-splitbutton.p-button-info>.p-button.p-button-text {
    background-color: initial;
    color: #0288d1;
    border-color: transparent
}

.p-button.p-button-info.p-button-text:enabled:hover,
.p-buttonset.p-button-info>.p-button.p-button-text:enabled:hover,
.p-splitbutton.p-button-info>.p-button.p-button-text:enabled:hover {
    background: rgba(2, 136, 209, .04);
    border-color: transparent;
    color: #0288d1
}

.p-button.p-button-info.p-button-text:enabled:active,
.p-buttonset.p-button-info>.p-button.p-button-text:enabled:active,
.p-splitbutton.p-button-info>.p-button.p-button-text:enabled:active {
    background: rgba(2, 136, 209, .16);
    border-color: transparent;
    color: #0288d1
}

.p-button.p-button-success,
.p-buttonset.p-button-success>.p-button,
.p-splitbutton.p-button-success>.p-button {
    color: #fff;
    background: #689f38;
    border: 1px solid #689f38
}

.p-button.p-button-success:enabled:hover,
.p-buttonset.p-button-success>.p-button:enabled:hover,
.p-splitbutton.p-button-success>.p-button:enabled:hover {
    background: #5e8f32;
    color: #fff;
    border-color: #5e8f32
}

.p-button.p-button-success:enabled:focus,
.p-buttonset.p-button-success>.p-button:enabled:focus,
.p-splitbutton.p-button-success>.p-button:enabled:focus {
    box-shadow: 0 0 0 .2rem #c2e0a8
}

.p-button.p-button-success:enabled:active,
.p-buttonset.p-button-success>.p-button:enabled:active,
.p-splitbutton.p-button-success>.p-button:enabled:active {
    background: #537f2d;
    color: #fff;
    border-color: #537f2d
}

.p-button.p-button-success.p-button-outlined,
.p-buttonset.p-button-success>.p-button.p-button-outlined,
.p-splitbutton.p-button-success>.p-button.p-button-outlined {
    background-color: initial;
    color: #689f38;
    border: 1px solid
}

.p-button.p-button-success.p-button-outlined:enabled:hover,
.p-buttonset.p-button-success>.p-button.p-button-outlined:enabled:hover,
.p-splitbutton.p-button-success>.p-button.p-button-outlined:enabled:hover {
    background: rgba(104, 159, 56, .04);
    color: #689f38;
    border: 1px solid
}

.p-button.p-button-success.p-button-outlined:enabled:active,
.p-buttonset.p-button-success>.p-button.p-button-outlined:enabled:active,
.p-splitbutton.p-button-success>.p-button.p-button-outlined:enabled:active {
    background: rgba(104, 159, 56, .16);
    color: #689f38;
    border: 1px solid
}

.p-button.p-button-success.p-button-text,
.p-buttonset.p-button-success>.p-button.p-button-text,
.p-splitbutton.p-button-success>.p-button.p-button-text {
    background-color: initial;
    color: #689f38;
    border-color: transparent
}

.p-button.p-button-success.p-button-text:enabled:hover,
.p-buttonset.p-button-success>.p-button.p-button-text:enabled:hover,
.p-splitbutton.p-button-success>.p-button.p-button-text:enabled:hover {
    background: rgba(104, 159, 56, .04);
    border-color: transparent;
    color: #689f38
}

.p-button.p-button-success.p-button-text:enabled:active,
.p-buttonset.p-button-success>.p-button.p-button-text:enabled:active,
.p-splitbutton.p-button-success>.p-button.p-button-text:enabled:active {
    background: rgba(104, 159, 56, .16);
    border-color: transparent;
    color: #689f38
}

.p-button.p-button-warning,
.p-buttonset.p-button-warning>.p-button,
.p-splitbutton.p-button-warning>.p-button {
    color: #212529;
    background: #fbc02d;
    border: 1px solid #fbc02d
}

.p-button.p-button-warning:enabled:hover,
.p-buttonset.p-button-warning>.p-button:enabled:hover,
.p-splitbutton.p-button-warning>.p-button:enabled:hover {
    background: #fab710;
    color: #212529;
    border-color: #fab710
}

.p-button.p-button-warning:enabled:focus,
.p-buttonset.p-button-warning>.p-button:enabled:focus,
.p-splitbutton.p-button-warning>.p-button:enabled:focus {
    box-shadow: 0 0 0 .2rem #fde6ab
}

.p-button.p-button-warning:enabled:active,
.p-buttonset.p-button-warning>.p-button:enabled:active,
.p-splitbutton.p-button-warning>.p-button:enabled:active {
    background: #e8a704;
    color: #212529;
    border-color: #e8a704
}

.p-button.p-button-warning.p-button-outlined,
.p-buttonset.p-button-warning>.p-button.p-button-outlined,
.p-splitbutton.p-button-warning>.p-button.p-button-outlined {
    background-color: initial;
    color: #fbc02d;
    border: 1px solid
}

.p-button.p-button-warning.p-button-outlined:enabled:hover,
.p-buttonset.p-button-warning>.p-button.p-button-outlined:enabled:hover,
.p-splitbutton.p-button-warning>.p-button.p-button-outlined:enabled:hover {
    background: rgba(251, 192, 45, .04);
    color: #fbc02d;
    border: 1px solid
}

.p-button.p-button-warning.p-button-outlined:enabled:active,
.p-buttonset.p-button-warning>.p-button.p-button-outlined:enabled:active,
.p-splitbutton.p-button-warning>.p-button.p-button-outlined:enabled:active {
    background: rgba(251, 192, 45, .16);
    color: #fbc02d;
    border: 1px solid
}

.p-button.p-button-warning.p-button-text,
.p-buttonset.p-button-warning>.p-button.p-button-text,
.p-splitbutton.p-button-warning>.p-button.p-button-text {
    background-color: initial;
    color: #fbc02d;
    border-color: transparent
}

.p-button.p-button-warning.p-button-text:enabled:hover,
.p-buttonset.p-button-warning>.p-button.p-button-text:enabled:hover,
.p-splitbutton.p-button-warning>.p-button.p-button-text:enabled:hover {
    background: rgba(251, 192, 45, .04);
    border-color: transparent;
    color: #fbc02d
}

.p-button.p-button-warning.p-button-text:enabled:active,
.p-buttonset.p-button-warning>.p-button.p-button-text:enabled:active,
.p-splitbutton.p-button-warning>.p-button.p-button-text:enabled:active {
    background: rgba(251, 192, 45, .16);
    border-color: transparent;
    color: #fbc02d
}

.p-button.p-button-help,
.p-buttonset.p-button-help>.p-button,
.p-splitbutton.p-button-help>.p-button {
    color: #fff;
    background: #9c27b0;
    border: 1px solid #9c27b0
}

.p-button.p-button-help:enabled:hover,
.p-buttonset.p-button-help>.p-button:enabled:hover,
.p-splitbutton.p-button-help>.p-button:enabled:hover {
    background: #8c239e;
    color: #fff;
    border-color: #8c239e
}

.p-button.p-button-help:enabled:focus,
.p-buttonset.p-button-help>.p-button:enabled:focus,
.p-splitbutton.p-button-help>.p-button:enabled:focus {
    box-shadow: 0 0 0 .2rem #df9eea
}

.p-button.p-button-help:enabled:active,
.p-buttonset.p-button-help>.p-button:enabled:active,
.p-splitbutton.p-button-help>.p-button:enabled:active {
    background: #7d1f8d;
    color: #fff;
    border-color: #7d1f8d
}

.p-button.p-button-help.p-button-outlined,
.p-buttonset.p-button-help>.p-button.p-button-outlined,
.p-splitbutton.p-button-help>.p-button.p-button-outlined {
    background-color: initial;
    color: #9c27b0;
    border: 1px solid
}

.p-button.p-button-help.p-button-outlined:enabled:hover,
.p-buttonset.p-button-help>.p-button.p-button-outlined:enabled:hover,
.p-splitbutton.p-button-help>.p-button.p-button-outlined:enabled:hover {
    background: rgba(156, 39, 176, .04);
    color: #9c27b0;
    border: 1px solid
}

.p-button.p-button-help.p-button-outlined:enabled:active,
.p-buttonset.p-button-help>.p-button.p-button-outlined:enabled:active,
.p-splitbutton.p-button-help>.p-button.p-button-outlined:enabled:active {
    background: rgba(156, 39, 176, .16);
    color: #9c27b0;
    border: 1px solid
}

.p-button.p-button-help.p-button-text,
.p-buttonset.p-button-help>.p-button.p-button-text,
.p-splitbutton.p-button-help>.p-button.p-button-text {
    background-color: initial;
    color: #9c27b0;
    border-color: transparent
}

.p-button.p-button-help.p-button-text:enabled:hover,
.p-buttonset.p-button-help>.p-button.p-button-text:enabled:hover,
.p-splitbutton.p-button-help>.p-button.p-button-text:enabled:hover {
    background: rgba(156, 39, 176, .04);
    border-color: transparent;
    color: #9c27b0
}

.p-button.p-button-help.p-button-text:enabled:active,
.p-buttonset.p-button-help>.p-button.p-button-text:enabled:active,
.p-splitbutton.p-button-help>.p-button.p-button-text:enabled:active {
    background: rgba(156, 39, 176, .16);
    border-color: transparent;
    color: #9c27b0
}

.p-button.p-button-danger,
.p-buttonset.p-button-danger>.p-button,
.p-splitbutton.p-button-danger>.p-button {
    color: #fff;
    background: #d32f2f;
    border: 1px solid #d32f2f
}

.p-button.p-button-danger:enabled:hover,
.p-buttonset.p-button-danger>.p-button:enabled:hover,
.p-splitbutton.p-button-danger>.p-button:enabled:hover {
    background: #c02929;
    color: #fff;
    border-color: #c02929
}

.p-button.p-button-danger:enabled:focus,
.p-buttonset.p-button-danger>.p-button:enabled:focus,
.p-splitbutton.p-button-danger>.p-button:enabled:focus {
    box-shadow: 0 0 0 .2rem #edacac
}

.p-button.p-button-danger:enabled:active,
.p-buttonset.p-button-danger>.p-button:enabled:active,
.p-splitbutton.p-button-danger>.p-button:enabled:active {
    background: #aa2424;
    color: #fff;
    border-color: #aa2424
}

.p-button.p-button-danger.p-button-outlined,
.p-buttonset.p-button-danger>.p-button.p-button-outlined,
.p-splitbutton.p-button-danger>.p-button.p-button-outlined {
    background-color: initial;
    color: #d32f2f;
    border: 1px solid
}

.p-button.p-button-danger.p-button-outlined:enabled:hover,
.p-buttonset.p-button-danger>.p-button.p-button-outlined:enabled:hover,
.p-splitbutton.p-button-danger>.p-button.p-button-outlined:enabled:hover {
    background: rgba(211, 47, 47, .04);
    color: #d32f2f;
    border: 1px solid
}

.p-button.p-button-danger.p-button-outlined:enabled:active,
.p-buttonset.p-button-danger>.p-button.p-button-outlined:enabled:active,
.p-splitbutton.p-button-danger>.p-button.p-button-outlined:enabled:active {
    background: rgba(211, 47, 47, .16);
    color: #d32f2f;
    border: 1px solid
}

.p-button.p-button-danger.p-button-text,
.p-buttonset.p-button-danger>.p-button.p-button-text,
.p-splitbutton.p-button-danger>.p-button.p-button-text {
    background-color: initial;
    color: #d32f2f;
    border-color: transparent
}

.p-button.p-button-danger.p-button-text:enabled:hover,
.p-buttonset.p-button-danger>.p-button.p-button-text:enabled:hover,
.p-splitbutton.p-button-danger>.p-button.p-button-text:enabled:hover {
    background: rgba(211, 47, 47, .04);
    border-color: transparent;
    color: #d32f2f
}

.p-button.p-button-danger.p-button-text:enabled:active,
.p-buttonset.p-button-danger>.p-button.p-button-text:enabled:active,
.p-splitbutton.p-button-danger>.p-button.p-button-text:enabled:active {
    background: rgba(211, 47, 47, .16);
    border-color: transparent;
    color: #d32f2f
}

.p-button.p-button-link {
    color: #0b7ad1;
    background: transparent;
    border: transparent
}

.p-button.p-button-link:enabled:hover {
    background: transparent;
    color: #0b7ad1;
    border-color: transparent
}

.p-button.p-button-link:enabled:hover .p-button-label {
    text-decoration: underline
}

.p-button.p-button-link:enabled:focus {
    background: transparent;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    border-color: transparent
}

.p-button.p-button-link:enabled:active {
    background: transparent;
    color: #0b7ad1;
    border-color: transparent
}

.p-carousel .p-carousel-content .p-carousel-next,
.p-carousel .p-carousel-content .p-carousel-prev {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s;
    margin: .5rem
}

.p-carousel .p-carousel-content .p-carousel-next:enabled:hover,
.p-carousel .p-carousel-content .p-carousel-prev:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-carousel .p-carousel-content .p-carousel-next:focus,
.p-carousel .p-carousel-content .p-carousel-prev:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-carousel .p-carousel-indicators {
    padding: 1rem
}

.p-carousel .p-carousel-indicators .p-carousel-indicator {
    margin-right: .5rem;
    margin-bottom: .5rem
}

.p-carousel .p-carousel-indicators .p-carousel-indicator button {
    background-color: #e9ecef;
    width: 2rem;
    height: .5rem;
    transition: background-color .2s, color .2s, box-shadow .2s;
    border-radius: 0
}

.p-carousel .p-carousel-indicators .p-carousel-indicator button:hover {
    background: #dee2e6
}

.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button {
    background: #e3f2fd;
    color: #495057
}

.p-datatable .p-paginator-bottom,
.p-datatable .p-paginator-top {
    border-width: 0 0 1px;
    border-radius: 0
}

.p-datatable .p-datatable-header {
    background: #f8f9fa;
    color: #495057;
    border: 1px solid #e9ecef;
    border-width: 1px 0;
    padding: 1rem;
    font-weight: 600
}

.p-datatable .p-datatable-footer,
.p-datatable .p-datatable-thead>tr>th {
    background: #f8f9fa;
    color: #495057;
    border: solid #e9ecef;
    border-width: 0 0 1px;
    padding: 1rem;
    font-weight: 600
}

.p-datatable .p-datatable-thead>tr>th {
    text-align: left;
    transition: box-shadow .2s
}

.p-datatable .p-datatable-tfoot>tr>td {
    text-align: left;
    padding: 1rem;
    border: solid #e9ecef;
    border-width: 0 0 1px;
    font-weight: 600;
    color: #495057;
    background: #f8f9fa
}

.p-datatable .p-sortable-column .p-sortable-column-icon {
    color: #6c757d;
    margin-left: .5rem
}

.p-datatable .p-sortable-column .p-sortable-column-badge {
    border-radius: 50%;
    height: 1.143rem;
    min-width: 1.143rem;
    line-height: 1.143rem;
    color: #495057;
    background: #e3f2fd;
    margin-left: .5rem
}

.p-datatable .p-sortable-column:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon {
    color: #6c757d
}

.p-datatable .p-sortable-column.p-highlight {
    background: #f8f9fa;
    color: #2196f3
}

.p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon {
    color: #2196f3
}

.p-datatable .p-sortable-column.p-highlight:hover {
    background: #e9ecef;
    color: #2196f3
}

.p-datatable .p-sortable-column.p-highlight:hover .p-sortable-column-icon {
    color: #2196f3
}

.p-datatable .p-sortable-column:focus {
    box-shadow: inset 0 0 0 .15rem #a6d5fa;
    outline: 0 none
}

.p-datatable .p-datatable-tbody>tr {
    background: #fff;
    color: #495057;
    transition: box-shadow .2s;
    outline-color: #a6d5fa
}

.p-datatable .p-datatable-tbody>tr>td {
    text-align: left;
    border: solid #e9ecef;
    border-width: 0 0 1px;
    padding: 1rem
}

.p-datatable .p-datatable-tbody>tr>td .p-row-editor-cancel,
.p-datatable .p-datatable-tbody>tr>td .p-row-editor-init,
.p-datatable .p-datatable-tbody>tr>td .p-row-editor-save,
.p-datatable .p-datatable-tbody>tr>td .p-row-toggler {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-datatable .p-datatable-tbody>tr>td .p-row-editor-cancel:enabled:hover,
.p-datatable .p-datatable-tbody>tr>td .p-row-editor-init:enabled:hover,
.p-datatable .p-datatable-tbody>tr>td .p-row-editor-save:enabled:hover,
.p-datatable .p-datatable-tbody>tr>td .p-row-toggler:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-datatable .p-datatable-tbody>tr>td .p-row-editor-cancel:focus,
.p-datatable .p-datatable-tbody>tr>td .p-row-editor-init:focus,
.p-datatable .p-datatable-tbody>tr>td .p-row-editor-save:focus,
.p-datatable .p-datatable-tbody>tr>td .p-row-toggler:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-datatable .p-datatable-tbody>tr>td .p-row-editor-save {
    margin-right: .5rem
}

.p-datatable .p-datatable-tbody>tr.p-highlight {
    background: #e3f2fd;
    color: #495057
}

.p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-top>td {
    box-shadow: inset 0 2px 0 0 #e3f2fd
}

.p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-bottom>td {
    box-shadow: inset 0 -2px 0 0 #e3f2fd
}

.p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-datatable .p-column-resizer-helper {
    background: #2196f3
}

.p-datatable .p-datatable-scrollable-footer,
.p-datatable .p-datatable-scrollable-header {
    background: #f8f9fa
}

.p-datatable .p-datatable-loading-icon {
    font-size: 2rem
}

.p-datatable.p-datatable-gridlines .p-datatable-header {
    border-width: 1px 1px 0
}

.p-datatable.p-datatable-gridlines .p-datatable-footer {
    border-width: 0 1px 1px
}

.p-datatable.p-datatable-gridlines .p-paginator-top {
    border-width: 0 1px
}

.p-datatable.p-datatable-gridlines .p-paginator-bottom {
    border-width: 0 1px 1px
}

.p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td,
.p-datatable.p-datatable-gridlines .p-datatable-tfoot>tr>td,
.p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th {
    border-width: 1px
}

.p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(2n) {
    background: #fcfcfc
}

.p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(2n).p-highlight {
    background: #e3f2fd;
    color: #495057
}

.p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(2n).p-highlight .p-row-toggler,
.p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(2n).p-highlight .p-row-toggler:hover {
    color: #495057
}

.p-datatable.p-datatable-sm .p-datatable-footer,
.p-datatable.p-datatable-sm .p-datatable-header,
.p-datatable.p-datatable-sm .p-datatable-tbody>tr>td,
.p-datatable.p-datatable-sm .p-datatable-tfoot>tr>td,
.p-datatable.p-datatable-sm .p-datatable-thead>tr>th {
    padding: .5rem
}

.p-datatable.p-datatable-lg .p-datatable-footer,
.p-datatable.p-datatable-lg .p-datatable-header,
.p-datatable.p-datatable-lg .p-datatable-tbody>tr>td,
.p-datatable.p-datatable-lg .p-datatable-tfoot>tr>td,
.p-datatable.p-datatable-lg .p-datatable-thead>tr>th {
    padding: 1.25rem
}

.p-dataview .p-paginator-bottom,
.p-dataview .p-paginator-top {
    border-width: 0 0 1px;
    border-radius: 0
}

.p-dataview .p-dataview-header {
    background: #f8f9fa;
    color: #495057;
    border: 1px solid #e9ecef;
    border-width: 1px 0;
    padding: 1rem;
    font-weight: 600
}

.p-dataview .p-dataview-content {
    background: #fff;
    color: #495057;
    border: 0;
    padding: 0
}

.p-dataview .p-dataview-footer,
.p-dataview.p-dataview-list .p-dataview-content>.p-grid>div {
    border: solid #e9ecef;
    border-width: 0 0 1px
}

.p-dataview .p-dataview-footer {
    background: #f8f9fa;
    color: #495057;
    padding: 1rem;
    font-weight: 600;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-dataview .p-dataview-loading-icon {
    font-size: 2rem
}

.p-dataview .p-dataview-emptymessage {
    padding: 1rem
}

.p-column-filter-row .p-column-filter-clear-button,
.p-column-filter-row .p-column-filter-menu-button {
    margin-left: .5rem
}

.p-column-filter-menu-button {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-column-filter-menu-button:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-column-filter-menu-button.p-column-filter-menu-button-open,
.p-column-filter-menu-button.p-column-filter-menu-button-open:hover {
    background: #e9ecef;
    color: #495057
}

.p-column-filter-menu-button.p-column-filter-menu-button-active,
.p-column-filter-menu-button.p-column-filter-menu-button-active:hover {
    background: #e3f2fd;
    color: #495057
}

.p-column-filter-menu-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-column-filter-clear-button {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-column-filter-clear-button:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-column-filter-clear-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-column-filter-overlay {
    background: #fff;
    color: #495057;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    min-width: 12.5rem
}

.p-column-filter-overlay .p-column-filter-row-items {
    padding: .5rem 0
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item {
    margin: 0;
    padding: .5rem 1rem;
    border: 0;
    color: #495057;
    background: transparent;
    transition: box-shadow .2s;
    border-radius: 0
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item:not(.p-highlight):not(.p-disabled):hover {
    color: #495057;
    background: #e9ecef
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-separator {
    border-top: 1px solid #dee2e6;
    margin: .25rem 0
}

.p-column-filter-overlay-menu .p-column-filter-operator {
    padding: .5rem 1rem;
    border-bottom: 0;
    color: #495057;
    background: #f8f9fa;
    margin: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-column-filter-overlay-menu .p-column-filter-constraint {
    padding: 1rem;
    border-bottom: 1px solid #dee2e6
}

.p-column-filter-overlay-menu .p-column-filter-constraint .p-column-filter-matchmode-dropdown {
    margin-bottom: .5rem
}

.p-column-filter-overlay-menu .p-column-filter-constraint .p-column-filter-remove-button {
    margin-top: .5rem
}

.p-column-filter-overlay-menu .p-column-filter-constraint:last-child {
    border-bottom: 0
}

.p-column-filter-overlay-menu .p-column-filter-add-rule {
    padding: .5rem 1rem
}

.p-column-filter-overlay-menu .p-column-filter-buttonbar {
    padding: 1rem
}

.fc .fc-view-container th {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    color: #495057
}

.fc .fc-view-container td.fc-widget-content {
    background: #fff;
    border: 1px solid #dee2e6;
    color: #495057
}

.fc .fc-view-container td.fc-head-container {
    border: 1px solid #dee2e6
}

.fc .fc-view-container .fc-row {
    border-right: 1px solid #dee2e6
}

.fc .fc-view-container .fc-event {
    background: #0d89ec;
    border: 1px solid #0d89ec;
    color: #fff
}

.fc .fc-view-container .fc-divider {
    background: #f8f9fa;
    border: 1px solid #dee2e6
}

.fc .fc-toolbar .fc-button {
    color: #fff;
    background: #2196f3;
    border: 1px solid #2196f3;
    font-size: 1rem;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
    border-radius: 3px;
    display: flex;
    align-items: center
}

.fc .fc-toolbar .fc-button:enabled:hover {
    background: #0d89ec;
    color: #fff;
    border-color: #0d89ec
}

.fc .fc-toolbar .fc-button:enabled:active {
    background: #0b7ad1;
    color: #fff;
    border-color: #0b7ad1
}

.fc .fc-toolbar .fc-button:enabled:active:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.fc .fc-toolbar .fc-button .fc-icon-chevron-left {
    font-family: PrimeIcons !important;
    text-indent: 0;
    font-size: 1rem
}

.fc .fc-toolbar .fc-button .fc-icon-chevron-left:before {
    content: ""
}

.fc .fc-toolbar .fc-button .fc-icon-chevron-right {
    font-family: PrimeIcons !important;
    text-indent: 0;
    font-size: 1rem
}

.fc .fc-toolbar .fc-button .fc-icon-chevron-right:before {
    content: ""
}

.fc .fc-toolbar .fc-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.fc .fc-toolbar .fc-button.fc-dayGridMonth-button,
.fc .fc-toolbar .fc-button.fc-timeGridDay-button,
.fc .fc-toolbar .fc-button.fc-timeGridWeek-button {
    background: #fff;
    border: 1px solid #ced4da;
    color: #495057;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.fc .fc-toolbar .fc-button.fc-dayGridMonth-button:hover,
.fc .fc-toolbar .fc-button.fc-timeGridDay-button:hover,
.fc .fc-toolbar .fc-button.fc-timeGridWeek-button:hover {
    background: #e9ecef;
    border-color: #ced4da;
    color: #495057
}

.fc .fc-toolbar .fc-button.fc-dayGridMonth-button.fc-button-active,
.fc .fc-toolbar .fc-button.fc-timeGridDay-button.fc-button-active,
.fc .fc-toolbar .fc-button.fc-timeGridWeek-button.fc-button-active {
    background: #2196f3;
    border-color: #2196f3;
    color: #fff
}

.fc .fc-toolbar .fc-button.fc-dayGridMonth-button.fc-button-active:hover,
.fc .fc-toolbar .fc-button.fc-timeGridDay-button.fc-button-active:hover,
.fc .fc-toolbar .fc-button.fc-timeGridWeek-button.fc-button-active:hover {
    background: #0d89ec;
    border-color: #0d89ec;
    color: #fff
}

.fc .fc-toolbar .fc-button.fc-dayGridMonth-button:focus,
.fc .fc-toolbar .fc-button.fc-timeGridDay-button:focus,
.fc .fc-toolbar .fc-button.fc-timeGridWeek-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa;
    z-index: 1
}

.fc .fc-toolbar .fc-button-group .fc-button {
    border-radius: 0
}

.fc .fc-toolbar .fc-button-group .fc-button:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px
}

.fc .fc-toolbar .fc-button-group .fc-button:last-child {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-orderlist .p-orderlist-controls {
    padding: 1rem
}

.p-orderlist .p-orderlist-controls .p-button {
    margin-bottom: .5rem
}

.p-orderlist .p-orderlist-header {
    background: #f8f9fa;
    color: #495057;
    padding: 1rem;
    border: 1px solid #dee2e6;
    border-bottom: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-orderlist .p-orderlist-header .p-orderlist-title {
    font-weight: 600
}

.p-orderlist .p-orderlist-filter-container {
    padding: 1rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-bottom: 0
}

.p-orderlist .p-orderlist-filter-container .p-orderlist-filter-input {
    padding-right: 1.5rem
}

.p-orderlist .p-orderlist-filter-container .p-orderlist-filter-icon {
    right: .5rem;
    color: #6c757d
}

.p-orderlist .p-orderlist-list {
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    padding: .5rem 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-orderlist .p-orderlist-list .p-orderlist-item {
    padding: .5rem 1rem;
    margin: 0;
    border: 0;
    color: #495057;
    background: transparent;
    transition: box-shadow .2s
}

.p-orderlist .p-orderlist-list .p-orderlist-item:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-orderlist .p-orderlist-list .p-orderlist-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-orderlist .p-orderlist-list:not(.cdk-drop-list-dragging) .p-orderlist-item:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-orderlist-item.cdk-drag-preview {
    padding: .5rem 1rem;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    border: 0;
    color: #495057;
    background: #fff;
    margin: 0
}

.p-organizationchart .p-organizationchart-node-content.p-organizationchart-selectable-node:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-organizationchart .p-organizationchart-node-content.p-highlight {
    background: #e3f2fd;
    color: #495057
}

.p-organizationchart .p-organizationchart-node-content.p-highlight .p-node-toggler i {
    color: #6cbbf5
}

.p-organizationchart .p-organizationchart-line-down {
    background: #dee2e6
}

.p-organizationchart .p-organizationchart-line-left {
    border-right: 1px solid;
    border-color: #dee2e6
}

.p-organizationchart .p-organizationchart-line-top {
    border-color: #dee2e6;
    border-top: 1px solid #dee2e6
}

.p-organizationchart .p-organizationchart-node-content {
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    padding: 1rem
}

.p-organizationchart .p-organizationchart-node-content .p-node-toggler {
    background: inherit;
    color: inherit;
    border-radius: 50%
}

.p-organizationchart .p-organizationchart-node-content .p-node-toggler:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-paginator {
    background: #fff;
    color: #6c757d;
    border: 0 solid #e9ecef;
    padding: .5rem 1rem;
    border-radius: 3px
}

.p-paginator .p-paginator-first,
.p-paginator .p-paginator-last,
.p-paginator .p-paginator-next,
.p-paginator .p-paginator-prev {
    background-color: initial;
    border: 0;
    color: #6c757d;
    min-width: 2.357rem;
    height: 2.357rem;
    margin: .143rem;
    transition: box-shadow .2s;
    border-radius: 3px
}

.p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):hover,
.p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):hover,
.p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):hover,
.p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):hover {
    background: #e9ecef;
    border-color: transparent;
    color: #495057
}

.p-paginator .p-paginator-first {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-paginator .p-paginator-last {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-paginator .p-dropdown {
    margin-left: .5rem;
    height: 2.357rem
}

.p-paginator .p-dropdown .p-dropdown-label {
    padding-right: 0
}

.p-paginator .p-paginator-current {
    padding: 0 .5rem
}

.p-paginator .p-paginator-current,
.p-paginator .p-paginator-pages .p-paginator-page {
    background-color: initial;
    border: 0;
    color: #6c757d;
    min-width: 2.357rem;
    height: 2.357rem;
    margin: .143rem
}

.p-paginator .p-paginator-pages .p-paginator-page {
    transition: box-shadow .2s;
    border-radius: 3px
}

.p-paginator .p-paginator-pages .p-paginator-page.p-highlight {
    background: #e3f2fd;
    border-color: #e3f2fd;
    color: #495057
}

.p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):hover {
    background: #e9ecef;
    border-color: transparent;
    color: #495057
}

.p-picklist .p-picklist-buttons {
    padding: 1rem
}

.p-picklist .p-picklist-buttons .p-button {
    margin-bottom: .5rem
}

.p-picklist .p-picklist-header {
    background: #f8f9fa;
    color: #495057;
    padding: 1rem;
    border: 1px solid #dee2e6;
    border-bottom: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-picklist .p-picklist-header .p-picklist-title {
    font-weight: 600
}

.p-picklist .p-picklist-filter-container {
    padding: 1rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-bottom: 0
}

.p-picklist .p-picklist-filter-container .p-picklist-filter-input {
    padding-right: 1.5rem
}

.p-picklist .p-picklist-filter-container .p-picklist-filter-icon {
    right: .5rem;
    color: #6c757d
}

.p-picklist .p-picklist-list {
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    padding: .5rem 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-picklist .p-picklist-list .p-picklist-item {
    padding: .5rem 1rem;
    margin: 0;
    border: 0;
    color: #495057;
    background: transparent;
    transition: box-shadow .2s
}

.p-picklist .p-picklist-list .p-picklist-item:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-picklist .p-picklist-list .p-picklist-item.p-highlight {
    color: #495057;
    background: #e3f2fd
}

.p-picklist .p-picklist-list .p-picklist-empty-message {
    padding: .5rem 1rem;
    color: #495057
}

.p-picklist .p-picklist-list:not(.cdk-drop-list-dragging) .p-picklist-item:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-picklist-item.cdk-drag-preview {
    padding: .5rem 1rem;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    border: 0;
    color: #495057;
    background: #fff;
    margin: 0
}

.p-timeline .p-timeline-event-marker {
    border: 2px solid #2196f3;
    border-radius: 50%;
    width: 1rem;
    height: 1rem;
    background-color: #fff
}

.p-timeline .p-timeline-event-connector {
    background-color: #dee2e6
}

.p-timeline.p-timeline-vertical .p-timeline-event-content,
.p-timeline.p-timeline-vertical .p-timeline-event-opposite {
    padding: 0 1rem
}

.p-timeline.p-timeline-vertical .p-timeline-event-connector {
    width: 2px
}

.p-timeline.p-timeline-horizontal .p-timeline-event-content,
.p-timeline.p-timeline-horizontal .p-timeline-event-opposite {
    padding: 1rem 0
}

.p-timeline.p-timeline-horizontal .p-timeline-event-connector {
    height: 2px
}

.p-tree {
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    padding: 1rem;
    border-radius: 3px
}

.p-tree .p-tree-container .p-treenode {
    padding: .143rem
}

.p-tree .p-tree-container .p-treenode .p-treenode-content {
    border-radius: 3px;
    transition: box-shadow .2s;
    padding: .5rem
}

.p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler {
    margin-right: .5rem;
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-tree .p-tree-container .p-treenode .p-treenode-content .p-treenode-icon {
    margin-right: .5rem;
    color: #6c757d
}

.p-tree .p-tree-container .p-treenode .p-treenode-content .p-checkbox {
    margin-right: .5rem
}

.p-tree .p-tree-container .p-treenode .p-treenode-content .p-checkbox .p-indeterminate .p-checkbox-icon {
    color: #495057
}

.p-tree .p-tree-container .p-treenode .p-treenode-content:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight {
    background: #e3f2fd;
    color: #495057
}

.p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight .p-tree-toggler,
.p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight .p-tree-toggler:hover,
.p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight .p-treenode-icon,
.p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight .p-treenode-icon:hover {
    color: #495057
}

.p-tree .p-tree-container .p-treenode .p-treenode-content.p-treenode-dragover,
.p-tree .p-tree-container .p-treenode .p-treenode-content.p-treenode-selectable:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-tree .p-tree-filter-container {
    margin-bottom: .5rem
}

.p-tree .p-tree-filter-container .p-tree-filter {
    width: 100%;
    padding-right: 1.5rem
}

.p-tree .p-tree-filter-container .p-tree-filter-icon {
    right: .5rem;
    color: #6c757d
}

.p-tree .p-treenode-children {
    padding: 0 0 0 1rem
}

.p-tree .p-tree-loading-icon {
    font-size: 2rem
}

.p-tree .p-treenode-droppoint.p-treenode-droppoint-active {
    background-color: #89c8f7
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content {
    border-radius: 3px;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #495057;
    padding: .5rem;
    transition: box-shadow .2s
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content.p-highlight {
    background-color: #e3f2fd;
    color: #495057
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content.p-highlight .p-treenode-icon {
    color: #495057
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-tree-toggler {
    margin-right: .5rem
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-treenode-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-checkbox {
    margin-right: .5rem
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-treenode-label:not(.p-highlight):hover {
    background-color: inherit;
    color: inherit
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content.p-treenode-selectable:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-tree.p-tree-horizontal .p-treenode .p-treenode-content:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-treetable .p-paginator-bottom,
.p-treetable .p-paginator-top {
    border-width: 0 0 1px;
    border-radius: 0
}

.p-treetable .p-treetable-header {
    background: #f8f9fa;
    color: #495057;
    border: 1px solid #e9ecef;
    border-width: 1px 0;
    padding: 1rem;
    font-weight: 600
}

.p-treetable .p-treetable-footer,
.p-treetable .p-treetable-thead>tr>th {
    background: #f8f9fa;
    color: #495057;
    border: solid #e9ecef;
    border-width: 0 0 1px;
    padding: 1rem;
    font-weight: 600
}

.p-treetable .p-treetable-thead>tr>th {
    text-align: left;
    transition: box-shadow .2s
}

.p-treetable .p-treetable-tfoot>tr>td {
    text-align: left;
    padding: 1rem;
    border: solid #e9ecef;
    border-width: 0 0 1px;
    font-weight: 600;
    color: #495057;
    background: #f8f9fa
}

.p-treetable .p-sortable-column {
    outline-color: #a6d5fa
}

.p-treetable .p-sortable-column .p-sortable-column-icon {
    color: #6c757d;
    margin-left: .5rem
}

.p-treetable .p-sortable-column .p-sortable-column-badge {
    border-radius: 50%;
    height: 1.143rem;
    min-width: 1.143rem;
    line-height: 1.143rem;
    color: #495057;
    background: #e3f2fd;
    margin-left: .5rem
}

.p-treetable .p-sortable-column:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-treetable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon {
    color: #6c757d
}

.p-treetable .p-sortable-column.p-highlight {
    background: #f8f9fa;
    color: #2196f3
}

.p-treetable .p-sortable-column.p-highlight .p-sortable-column-icon {
    color: #2196f3
}

.p-treetable .p-treetable-tbody>tr {
    background: #fff;
    color: #495057;
    transition: box-shadow .2s;
    outline-color: #a6d5fa
}

.p-treetable .p-treetable-tbody>tr>td {
    text-align: left;
    border: solid #e9ecef;
    border-width: 0 0 1px;
    padding: 1rem
}

.p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s;
    margin-right: .5rem
}

.p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-treetable .p-treetable-tbody>tr>td p-treetablecheckbox .p-checkbox {
    margin-right: .5rem
}

.p-treetable .p-treetable-tbody>tr>td p-treetablecheckbox .p-checkbox .p-indeterminate .p-checkbox-icon {
    color: #495057
}

.p-treetable .p-treetable-tbody>tr.p-highlight {
    background: #e3f2fd;
    color: #495057
}

.p-treetable .p-treetable-tbody>tr.p-highlight .p-treetable-toggler,
.p-treetable .p-treetable-tbody>tr.p-highlight .p-treetable-toggler:hover {
    color: #495057
}

.p-treetable.p-treetable-hoverable-rows .p-treetable-tbody>tr:not(.p-highlight):hover {
    background: #e9ecef;
    color: #495057
}

.p-treetable.p-treetable-hoverable-rows .p-treetable-tbody>tr:not(.p-highlight):hover .p-treetable-toggler {
    color: #495057
}

.p-treetable .p-column-resizer-helper {
    background: #2196f3
}

.p-treetable .p-treetable-scrollable-footer,
.p-treetable .p-treetable-scrollable-header {
    background: #f8f9fa
}

.p-treetable .p-treetable-loading-icon {
    font-size: 2rem
}

.p-treetable.p-treetable-gridlines .p-datatable-header {
    border-width: 1px 1px 0
}

.p-treetable.p-treetable-gridlines .p-treetable-footer {
    border-width: 0 1px 1px
}

.p-treetable.p-treetable-gridlines .p-treetable-top {
    border-width: 0 1px
}

.p-treetable.p-treetable-gridlines .p-treetable-bottom {
    border-width: 0 1px 1px
}

.p-treetable.p-treetable-gridlines .p-treetable-tbody>tr>td,
.p-treetable.p-treetable-gridlines .p-treetable-tfoot>tr>td,
.p-treetable.p-treetable-gridlines .p-treetable-thead>tr>th {
    border-width: 1px
}

.p-treetable.p-treetable-sm .p-treetable-header {
    padding: .875rem
}

.p-treetable.p-treetable-sm .p-treetable-footer,
.p-treetable.p-treetable-sm .p-treetable-tbody>tr>td,
.p-treetable.p-treetable-sm .p-treetable-tfoot>tr>td,
.p-treetable.p-treetable-sm .p-treetable-thead>tr>th {
    padding: .5rem
}

.p-treetable.p-treetable-lg .p-treetable-footer,
.p-treetable.p-treetable-lg .p-treetable-header,
.p-treetable.p-treetable-lg .p-treetable-tbody>tr>td,
.p-treetable.p-treetable-lg .p-treetable-tfoot>tr>td,
.p-treetable.p-treetable-lg .p-treetable-thead>tr>th {
    padding: 1.25rem
}

.p-virtualscroller .p-virtualscroller-header {
    background: #f8f9fa;
    color: #495057;
    border: 1px solid #e9ecef;
    border-width: 1px 0;
    padding: 1rem;
    font-weight: 600
}

.p-virtualscroller .p-virtualscroller-content {
    background: #fff;
    color: #495057;
    border: 0;
    padding: 0
}

.p-virtualscroller .p-virtualscroller-footer {
    background: #f8f9fa;
    color: #495057;
    border: solid #e9ecef;
    border-width: 0 0 1px;
    padding: 1rem;
    font-weight: 600;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px
}

.p-accordion .p-accordion-header .p-accordion-header-link {
    padding: 1rem;
    border: 1px solid #dee2e6;
    color: #495057;
    background: #f8f9fa;
    font-weight: 600;
    border-radius: 3px;
    transition: box-shadow .2s
}

.p-accordion .p-accordion-header .p-accordion-header-link .p-accordion-toggle-icon {
    margin-right: .5rem
}

.p-accordion .p-accordion-header:not(.p-disabled) .p-accordion-header-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-accordion .p-accordion-header:not(.p-highlight):not(.p-disabled):hover .p-accordion-header-link {
    background: #e9ecef;
    border-color: #dee2e6;
    color: #495057
}

.p-accordion .p-accordion-header:not(.p-disabled).p-highlight .p-accordion-header-link {
    background: #f8f9fa;
    border-color: #dee2e6;
    color: #495057;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.p-accordion .p-accordion-header:not(.p-disabled).p-highlight:hover .p-accordion-header-link {
    border-color: #dee2e6;
    background: #e9ecef;
    color: #495057
}

.p-accordion .p-accordion-content {
    padding: 1rem;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    border-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-accordion p-accordiontab .p-accordion-tab {
    margin-bottom: 0
}

.p-accordion p-accordiontab .p-accordion-content,
.p-accordion p-accordiontab .p-accordion-header .p-accordion-header-link {
    border-radius: 0
}

.p-accordion p-accordiontab:not(:first-child) .p-accordion-header .p-accordion-header-link,
.p-accordion p-accordiontab:not(:first-child) .p-accordion-header:not(.p-disabled).p-highlight:hover .p-accordion-header-link,
.p-accordion p-accordiontab:not(:first-child) .p-accordion-header:not(.p-highlight):not(.p-disabled):hover .p-accordion-header-link {
    border-top: 0
}

.p-accordion p-accordiontab:first-child .p-accordion-header .p-accordion-header-link {
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-accordion p-accordiontab:last-child .p-accordion-content,
.p-accordion p-accordiontab:last-child .p-accordion-header:not(.p-highlight) .p-accordion-header-link {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-card {
    background: #fff;
    color: #495057;
    box-shadow: 0 2px 1px -1px rgba(0, 0, 0, .2), 0 1px 1px 0 rgba(0, 0, 0, .14), 0 1px 3px 0 rgba(0, 0, 0, .12);
    border-radius: 3px
}

.p-card .p-card-body {
    padding: 1rem
}

.p-card .p-card-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: .5rem
}

.p-card .p-card-subtitle {
    font-weight: 400;
    margin-bottom: .5rem;
    color: #6c757d
}

.p-card .p-card-content {
    padding: 1rem 0
}

.p-card .p-card-footer {
    padding: 1rem 0 0
}

.p-divider .p-divider-content {
    background-color: #fff
}

.p-divider.p-divider-horizontal {
    margin: 1rem 0;
    padding: 0 1rem
}

.p-divider.p-divider-horizontal:before {
    border-top: 1px #dee2e6
}

.p-divider.p-divider-horizontal .p-divider-content {
    padding: 0 .5rem
}

.p-divider.p-divider-vertical {
    margin: 0 1rem;
    padding: 1rem 0
}

.p-divider.p-divider-vertical:before {
    border-left: 1px #dee2e6
}

.p-divider.p-divider-vertical .p-divider-content {
    padding: .5rem 0
}

.p-fieldset {
    background: #fff
}

.p-fieldset,
.p-fieldset .p-fieldset-legend {
    border: 1px solid #dee2e6;
    color: #495057;
    border-radius: 3px
}

.p-fieldset .p-fieldset-legend {
    padding: 1rem;
    background: #f8f9fa;
    font-weight: 600
}

.p-fieldset.p-fieldset-toggleable .p-fieldset-legend {
    padding: 0;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a {
    padding: 1rem;
    color: #495057;
    border-radius: 3px;
    transition: box-shadow .2s
}

.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a .p-fieldset-toggler {
    margin-right: .5rem
}

.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
    background: #e9ecef;
    border-color: #dee2e6;
    color: #495057
}

.p-fieldset .p-fieldset-content {
    padding: 1rem
}

.p-panel .p-panel-header {
    border: 1px solid #dee2e6;
    padding: 1rem;
    background: #f8f9fa;
    color: #495057;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-panel .p-panel-header .p-panel-title {
    font-weight: 600
}

.p-panel .p-panel-header .p-panel-header-icon {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-panel .p-panel-header .p-panel-header-icon:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-panel .p-panel-header .p-panel-header-icon:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-panel.p-panel-toggleable .p-panel-header {
    padding: .5rem 1rem
}

.p-panel .p-panel-content {
    padding: 1rem;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-panel .p-panel-content,
.p-panel .p-panel-footer {
    background: #fff;
    color: #495057;
    border: 1px solid #dee2e6;
    border-top: 0
}

.p-panel .p-panel-footer {
    padding: .5rem 1rem
}

.p-scrollpanel .p-scrollpanel-bar {
    background: #f8f9fa;
    border: 0
}

.p-splitter {
    border: 1px solid #dee2e6;
    background: #fff;
    border-radius: 3px;
    color: #495057
}

.p-splitter .p-splitter-gutter {
    transition: background-color .2s, color .2s, box-shadow .2s;
    background: #f8f9fa
}

.p-splitter .p-splitter-gutter-resizing,
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
    background: #dee2e6
}

.p-tabview .p-tabview-nav {
    background: #fff;
    border: solid #dee2e6;
    border-width: 0 0 2px
}

.p-tabview .p-tabview-nav li {
    margin-right: 0
}

.p-tabview .p-tabview-nav li .p-tabview-nav-link {
    border: 0 solid transparent;
    border-bottom: 2px solid #dee2e6;
    background: #fff;
    color: #6c757d;
    padding: 1rem;
    font-weight: 600;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    transition: box-shadow .2s;
    margin: 0 0 -2px
}

.p-tabview .p-tabview-nav li .p-tabview-nav-link:not(.p-disabled):focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-tabview .p-tabview-nav li:not(.p-highlight):not(.p-disabled):hover .p-tabview-nav-link {
    background: #fff;
    border-color: #6c757d;
    color: #6c757d
}

.p-tabview .p-tabview-nav li.p-highlight .p-tabview-nav-link {
    background: #fff;
    border-color: #2196f3;
    color: #2196f3
}

.p-tabview .p-tabview-left-icon {
    margin-right: .5rem
}

.p-tabview .p-tabview-close,
.p-tabview .p-tabview-right-icon {
    margin-left: .5rem
}

.p-tabview .p-tabview-panels {
    background: #fff;
    padding: 1rem;
    border: 0;
    color: #495057;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-toolbar {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    padding: 1rem;
    border-radius: 3px
}

.p-toolbar .p-toolbar-separator {
    margin: 0 .5rem
}

.p-confirm-popup {
    background: #fff;
    color: #495057;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12)
}

.p-confirm-popup .p-confirm-popup-content {
    padding: 1rem
}

.p-confirm-popup .p-confirm-popup-footer {
    text-align: right;
    padding: .5rem 1rem
}

.p-confirm-popup .p-confirm-popup-footer button {
    margin: 0 .5rem 0 0;
    width: auto
}

.p-confirm-popup .p-confirm-popup-footer button:last-child {
    margin: 0
}

.p-confirm-popup:after,
.p-confirm-popup:before {
    border: solid hsla(0, 0%, 100%, 0);
    border-bottom: solid #fff
}

.p-confirm-popup.p-confirm-popup-flipped:after,
.p-confirm-popup.p-confirm-popup-flipped:before {
    border-top-color: #fff
}

.p-confirm-popup .p-confirm-popup-icon {
    font-size: 1.5rem
}

.p-confirm-popup .p-confirm-popup-message {
    margin-left: 1rem
}

.p-dialog {
    border-radius: 3px;
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12);
    border: 0
}

.p-dialog .p-dialog-header {
    border-bottom: 0;
    background: #fff;
    color: #495057;
    padding: 1.5rem;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-dialog .p-dialog-header .p-dialog-title {
    font-weight: 600;
    font-size: 1.25rem
}

.p-dialog .p-dialog-header .p-dialog-header-icon {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s;
    margin-right: .5rem
}

.p-dialog .p-dialog-header .p-dialog-header-icon:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-dialog .p-dialog-header .p-dialog-header-icon:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-dialog .p-dialog-header .p-dialog-header-icon:last-child {
    margin-right: 0
}

.p-dialog .p-dialog-content {
    background: #fff;
    color: #495057;
    padding: 0 1.5rem 2rem
}

.p-dialog .p-dialog-footer {
    border-top: 0;
    background: #fff;
    color: #495057;
    padding: 0 1.5rem 1.5rem;
    text-align: right;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-dialog .p-dialog-footer button {
    margin: 0 .5rem 0 0;
    width: auto
}

.p-dialog.p-confirm-dialog .p-confirm-dialog-icon {
    font-size: 2rem
}

.p-dialog.p-confirm-dialog .p-confirm-dialog-message {
    margin-left: 1rem
}

.p-dialog-mask.p-component-overlay {
    background-color: rgba(0, 0, 0, .4)
}

.p-overlaypanel {
    background: #fff;
    color: #495057;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12)
}

.p-overlaypanel .p-overlaypanel-content {
    padding: 1rem
}

.p-overlaypanel .p-overlaypanel-close {
    background: #2196f3;
    color: #fff;
    width: 2rem;
    height: 2rem;
    transition: background-color .2s, color .2s, box-shadow .2s;
    border-radius: 50%;
    position: absolute;
    top: -1rem;
    right: -1rem
}

.p-overlaypanel .p-overlaypanel-close:enabled:hover {
    background: #0d89ec;
    color: #fff
}

.p-overlaypanel:after,
.p-overlaypanel:before {
    border: solid hsla(0, 0%, 100%, 0);
    border-bottom: solid #fff
}

.p-overlaypanel.p-overlaypanel-flipped:after,
.p-overlaypanel.p-overlaypanel-flipped:before {
    border-top-color: #fff
}

.p-sidebar {
    background: #fff;
    color: #495057;
    padding: 1rem;
    border: 0;
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12)
}

.p-sidebar .p-sidebar-close {
    width: 2rem;
    height: 2rem;
    color: #6c757d;
    border: 0;
    background: transparent;
    border-radius: 50%;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-sidebar .p-sidebar-close:enabled:hover {
    color: #495057;
    border-color: transparent;
    background: #e9ecef
}

.p-sidebar .p-sidebar-close:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-sidebar-mask.p-component-overlay {
    background: rgba(0, 0, 0, .4)
}

.p-tooltip .p-tooltip-text {
    background: #495057;
    color: #fff;
    padding: .5rem;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    border-radius: 3px
}

.p-tooltip.p-tooltip-right .p-tooltip-arrow {
    border-right-color: #495057
}

.p-tooltip.p-tooltip-left .p-tooltip-arrow {
    border-left-color: #495057
}

.p-tooltip.p-tooltip-top .p-tooltip-arrow {
    border-top-color: #495057
}

.p-tooltip.p-tooltip-bottom .p-tooltip-arrow {
    border-bottom-color: #495057
}

.p-fileupload .p-fileupload-buttonbar {
    background: #f8f9fa;
    padding: 1rem;
    color: #495057;
    border: 1px solid #dee2e6;
    border-bottom: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-fileupload .p-fileupload-buttonbar .p-button {
    margin-right: .5rem
}

.p-fileupload .p-fileupload-buttonbar .p-button.p-fileupload-choose.p-focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-fileupload .p-fileupload-content {
    background: #fff;
    padding: 2rem 1rem;
    border: 1px solid #dee2e6;
    color: #495057;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-fileupload .p-progressbar {
    height: .25rem
}

.p-fileupload .p-fileupload-row>div {
    padding: 1rem
}

.p-fileupload.p-fileupload-advanced .p-message {
    margin-top: 0
}

.p-fileupload-choose:not(.p-disabled):hover {
    background: #0d89ec;
    color: #fff;
    border-color: #0d89ec
}

.p-fileupload-choose:not(.p-disabled):active {
    background: #0b7ad1;
    color: #fff;
    border-color: #0b7ad1
}

.p-breadcrumb {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 3px;
    padding: 1rem
}

.p-breadcrumb ul li .p-menuitem-link {
    transition: box-shadow .2s;
    border-radius: 3px
}

.p-breadcrumb ul li .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-breadcrumb ul li .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-breadcrumb ul li .p-menuitem-link .p-menuitem-icon {
    color: #6c757d
}

.p-breadcrumb ul li.p-breadcrumb-chevron {
    margin: 0 .5rem;
    color: #495057
}

.p-breadcrumb ul li:last-child .p-menuitem-text {
    color: #495057
}

.p-breadcrumb ul li:last-child .p-menuitem-icon {
    color: #6c757d
}

.p-contextmenu {
    padding: .25rem 0;
    background: #fff;
    color: #495057;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    width: 12.5rem
}

.p-contextmenu .p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 0;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-contextmenu .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-contextmenu .p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-contextmenu .p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-contextmenu .p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-contextmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-contextmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-contextmenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-contextmenu .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-contextmenu .p-submenu-list {
    padding: .25rem 0;
    background: #fff;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-contextmenu .p-menuitem,
.p-contextmenu .p-menuitem:last-child {
    margin: 0
}

.p-contextmenu .p-menuitem.p-menuitem-active>.p-menuitem-link {
    background: #e9ecef
}

.p-contextmenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-contextmenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-icon,
.p-contextmenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-contextmenu .p-menu-separator {
    border-top: 1px solid #dee2e6;
    margin: .25rem 0
}

.p-contextmenu .p-submenu-icon {
    font-size: .875rem
}

.p-megamenu {
    padding: .5rem;
    background: #f8f9fa;
    color: #495057;
    border: 1px solid #dee2e6;
    border-radius: 3px
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 3px;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link .p-submenu-icon {
    color: #6c757d;
    margin-left: .5rem
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-megamenu .p-megamenu-root-list>.p-menuitem>.p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link,
.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-text,
.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-icon,
.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link .p-submenu-icon,
.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-megamenu .p-megamenu-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-megamenu .p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 0;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-megamenu .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-megamenu .p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-megamenu .p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-megamenu .p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-megamenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-megamenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-megamenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-megamenu .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-megamenu .p-megamenu-panel {
    background: #fff;
    color: #495057;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-megamenu .p-megamenu-submenu-header {
    margin: 0;
    padding: .75rem 1rem;
    color: #495057;
    background: #fff;
    font-weight: 600;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-megamenu .p-megamenu-submenu {
    padding: .25rem 0;
    width: 12.5rem
}

.p-megamenu .p-megamenu-submenu .p-menu-separator {
    border-top: 1px solid #dee2e6;
    margin: .25rem 0
}

.p-megamenu .p-megamenu-submenu .p-menuitem,
.p-megamenu .p-megamenu-submenu .p-menuitem:last-child {
    margin: 0
}

.p-megamenu .p-menuitem.p-menuitem-active>.p-menuitem-link {
    background: #e9ecef
}

.p-megamenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-megamenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-icon,
.p-megamenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-megamenu.p-megamenu-vertical {
    width: 12.5rem;
    padding: .25rem 0
}

.p-megamenu.p-megamenu-vertical .p-menuitem,
.p-megamenu.p-megamenu-vertical .p-menuitem:last-child {
    margin: 0
}

.p-menu {
    padding: .25rem 0;
    background: #fff;
    color: #495057;
    border: 1px solid #dee2e6;
    border-radius: 3px;
    width: 12.5rem
}

.p-menu .p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 0;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-menu .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-menu .p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-menu .p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-menu .p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-menu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-menu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-menu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-menu .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-menu.p-menu-overlay {
    background: #fff;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-menu .p-submenu-header {
    margin: 0;
    padding: .75rem 1rem;
    color: #495057;
    background: #fff;
    font-weight: 600;
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.p-menu .p-menu-separator {
    border-top: 1px solid #dee2e6;
    margin: .25rem 0
}

.p-menu .p-menuitem,
.p-menu .p-menuitem:last-child {
    margin: 0
}

.p-menubar {
    padding: .5rem;
    background: #f8f9fa;
    color: #495057;
    border: 1px solid #dee2e6;
    border-radius: 3px
}

.p-menubar .p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 0;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-menubar .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-menubar .p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-menubar .p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-menubar .p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-menubar .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-menubar .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-menubar .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-menubar .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 3px;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link .p-submenu-icon {
    color: #6c757d;
    margin-left: .5rem
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link,
.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-text,
.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-icon,
.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link .p-submenu-icon,
.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-menubar .p-submenu-list {
    padding: .25rem 0;
    background: #fff;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    width: 12.5rem
}

.p-menubar .p-submenu-list .p-menu-separator {
    border-top: 1px solid #dee2e6;
    margin: .25rem 0
}

.p-menubar .p-submenu-list .p-submenu-icon {
    font-size: .875rem
}

.p-menubar .p-submenu-list .p-menuitem,
.p-menubar .p-submenu-list .p-menuitem:last-child {
    margin: 0
}

.p-menubar .p-menuitem.p-menuitem-active>.p-menuitem-link {
    background: #e9ecef
}

.p-menubar .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-menubar .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-icon,
.p-menubar .p-menuitem.p-menuitem-active>.p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

@media screen and (max-width:960px) {
    .p-menubar {
        position: relative
    }

    .p-menubar .p-menubar-button {
        display: flex;
        width: 2rem;
        height: 2rem;
        color: #6c757d;
        border-radius: 50%;
        transition: background-color .2s, color .2s, box-shadow .2s
    }

    .p-menubar .p-menubar-button:hover {
        color: #6c757d;
        background: #e9ecef
    }

    .p-menubar .p-menubar-button:focus {
        outline: 0 none;
        outline-offset: 0;
        box-shadow: 0 0 0 .2rem #a6d5fa
    }

    .p-menubar .p-menubar-root-list {
        position: absolute;
        display: none;
        padding: .25rem 0;
        background: #fff;
        border: 0;
        box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
        width: 100%
    }

    .p-menubar .p-menubar-root-list .p-menu-separator {
        border-top: 1px solid #dee2e6;
        margin: .25rem 0
    }

    .p-menubar .p-menubar-root-list .p-submenu-icon {
        font-size: .875rem
    }

    .p-menubar .p-menubar-root-list>.p-menuitem {
        width: 100%;
        position: static
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link {
        padding: .75rem 1rem;
        color: #495057;
        border-radius: 0;
        transition: box-shadow .2s;
        -webkit-user-select: none;
        user-select: none
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link .p-menuitem-text {
        color: #495057
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link .p-menuitem-icon {
        color: #6c757d;
        margin-right: .5rem
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link .p-submenu-icon {
        color: #6c757d
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover {
        background: #e9ecef
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
        color: #495057
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
        color: #6c757d
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link:focus {
        outline: 0 none;
        outline-offset: 0;
        box-shadow: inset 0 0 0 .15rem #a6d5fa
    }

    .p-menubar .p-menubar-root-list>.p-menuitem>.p-menuitem-link>.p-submenu-icon {
        margin-left: auto;
        transition: transform .2s
    }

    .p-menubar .p-menubar-root-list>.p-menuitem.p-menuitem-active>.p-menuitem-link>.p-submenu-icon {
        transform: rotate(-180deg)
    }

    .p-menubar .p-menubar-root-list .p-submenu-list {
        width: 100%;
        position: static;
        box-shadow: none;
        border: 0
    }

    .p-menubar .p-menubar-root-list .p-submenu-list .p-submenu-icon {
        transition: transform .2s;
        transform: rotate(90deg)
    }

    .p-menubar .p-menubar-root-list .p-submenu-list .p-menuitem-active>.p-menuitem-link>.p-submenu-icon {
        transform: rotate(-90deg)
    }

    .p-menubar .p-menubar-root-list .p-menuitem {
        width: 100%;
        position: static
    }

    .p-menubar .p-menubar-root-list ul li a {
        padding-left: 2.25rem
    }

    .p-menubar .p-menubar-root-list ul li ul li a {
        padding-left: 3.75rem
    }

    .p-menubar .p-menubar-root-list ul li ul li ul li a {
        padding-left: 5.25rem
    }

    .p-menubar .p-menubar-root-list ul li ul li ul li ul li a {
        padding-left: 6.75rem
    }

    .p-menubar .p-menubar-root-list ul li ul li ul li ul li ul li a {
        padding-left: 8.25rem
    }

    .p-menubar.p-menubar-mobile-active .p-menubar-root-list {
        display: flex;
        flex-direction: column;
        top: 100%;
        left: 0;
        z-index: 1
    }
}

.p-panelmenu .p-panelmenu-header>a {
    padding: 1rem;
    border: 1px solid #dee2e6;
    color: #495057;
    background: #f8f9fa;
    font-weight: 600;
    border-radius: 3px;
    transition: box-shadow .2s
}

.p-panelmenu .p-panelmenu-header>a .p-menuitem-icon,
.p-panelmenu .p-panelmenu-header>a .p-panelmenu-icon {
    margin-right: .5rem
}

.p-panelmenu .p-panelmenu-header>a:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-panelmenu .p-panelmenu-header:not(.p-highlight):not(.p-disabled)>a:hover {
    background: #e9ecef;
    border-color: #dee2e6;
    color: #495057
}

.p-panelmenu .p-panelmenu-header.p-highlight {
    margin-bottom: 0
}

.p-panelmenu .p-panelmenu-header.p-highlight>a {
    background: #f8f9fa;
    border-color: #dee2e6;
    color: #495057;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.p-panelmenu .p-panelmenu-header.p-highlight:not(.p-disabled)>a:hover {
    border-color: #dee2e6;
    background: #e9ecef;
    color: #495057
}

.p-panelmenu .p-panelmenu-content {
    padding: .25rem 0;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    margin-bottom: 0;
    border-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 0;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-panelmenu-icon {
    margin-right: .5rem
}

.p-panelmenu .p-panelmenu-content .p-submenu-list:not(.p-panelmenu-root-submenu) {
    padding: 0 0 0 1rem
}

.p-panelmenu .p-panelmenu-panel {
    margin-bottom: 0
}

.p-panelmenu .p-panelmenu-panel .p-panelmenu-content,
.p-panelmenu .p-panelmenu-panel .p-panelmenu-header>a {
    border-radius: 0
}

.p-panelmenu .p-panelmenu-panel:not(:first-child) .p-panelmenu-header:not(.p-disabled).p-highlight:hover>a,
.p-panelmenu .p-panelmenu-panel:not(:first-child) .p-panelmenu-header:not(.p-highlight):not(.p-disabled):hover>a,
.p-panelmenu .p-panelmenu-panel:not(:first-child) .p-panelmenu-header>a {
    border-top: 0
}

.p-panelmenu .p-panelmenu-panel:first-child .p-panelmenu-header>a {
    border-top-right-radius: 3px;
    border-top-left-radius: 3px
}

.p-panelmenu .p-panelmenu-panel:last-child .p-panelmenu-content,
.p-panelmenu .p-panelmenu-panel:last-child .p-panelmenu-header:not(.p-highlight)>a {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.p-slidemenu {
    padding: .25rem 0;
    background: #fff;
    color: #495057;
    border: 1px solid #dee2e6;
    border-radius: 3px;
    width: 12.5rem
}

.p-slidemenu .p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 0;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-slidemenu .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-slidemenu .p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-slidemenu .p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-slidemenu .p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-slidemenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-slidemenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-slidemenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-slidemenu .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-slidemenu .p-slidemenu-list,
.p-slidemenu.p-slidemenu-overlay {
    background: #fff;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-slidemenu .p-slidemenu-list {
    padding: .25rem 0
}

.p-slidemenu .p-slidemenu.p-slidemenu-active>.p-slidemenu-link {
    background: #e9ecef
}

.p-slidemenu .p-slidemenu.p-slidemenu-active>.p-slidemenu-link .p-slidemenu-text {
    color: #495057
}

.p-slidemenu .p-slidemenu.p-slidemenu-active>.p-slidemenu-link .p-slidemenu-icon {
    color: #6c757d
}

.p-slidemenu .p-slidemenu-separator {
    border-top: 1px solid #dee2e6;
    margin: .25rem 0
}

.p-slidemenu .p-slidemenu-icon {
    font-size: .875rem
}

.p-slidemenu .p-slidemenu-backward {
    padding: .75rem 1rem;
    color: #495057
}

.p-steps .p-steps-item .p-menuitem-link {
    background: transparent;
    transition: box-shadow .2s;
    border-radius: 3px;
    background: #fff
}

.p-steps .p-steps-item .p-menuitem-link .p-steps-number {
    color: #495057;
    border: 1px solid #e9ecef;
    background: #fff;
    min-width: 2rem;
    height: 2rem;
    line-height: 2rem;
    font-size: 1.143rem;
    z-index: 1;
    border-radius: 50%
}

.p-steps .p-steps-item .p-menuitem-link .p-steps-title {
    margin-top: .5rem;
    color: #6c757d
}

.p-steps .p-steps-item .p-menuitem-link:not(.p-disabled):focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-steps .p-steps-item.p-highlight .p-steps-number {
    background: #e3f2fd;
    color: #495057
}

.p-steps .p-steps-item.p-highlight .p-steps-title {
    font-weight: 600;
    color: #495057
}

.p-steps .p-steps-item:before {
    content: " ";
    border-top: 1px solid #dee2e6;
    width: 100%;
    top: 50%;
    left: 0;
    display: block;
    position: absolute;
    margin-top: -1rem
}

.p-tabmenu .p-tabmenu-nav {
    background: #fff;
    border: solid #dee2e6;
    border-width: 0 0 2px
}

.p-tabmenu .p-tabmenu-nav .p-tabmenuitem {
    margin-right: 0
}

.p-tabmenu .p-tabmenu-nav .p-tabmenuitem .p-menuitem-link {
    border: 0 solid transparent;
    border-bottom: 2px solid #dee2e6;
    background: #fff;
    color: #6c757d;
    padding: 1rem;
    font-weight: 600;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    transition: box-shadow .2s;
    margin: 0 0 -2px
}

.p-tabmenu .p-tabmenu-nav .p-tabmenuitem .p-menuitem-link .p-menuitem-icon {
    margin-right: .5rem
}

.p-tabmenu .p-tabmenu-nav .p-tabmenuitem .p-menuitem-link:not(.p-disabled):focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-tabmenu .p-tabmenu-nav .p-tabmenuitem:not(.p-highlight):not(.p-disabled):hover .p-menuitem-link {
    background: #fff;
    border-color: #6c757d;
    color: #6c757d
}

.p-tabmenu .p-tabmenu-nav .p-tabmenuitem.p-highlight .p-menuitem-link {
    background: #fff;
    border-color: #2196f3;
    color: #2196f3
}

.p-tieredmenu {
    padding: .25rem 0;
    background: #fff;
    color: #495057;
    border: 1px solid #dee2e6;
    border-radius: 3px;
    width: 12.5rem
}

.p-tieredmenu .p-menuitem-link {
    padding: .75rem 1rem;
    color: #495057;
    border-radius: 0;
    transition: box-shadow .2s;
    -webkit-user-select: none;
    user-select: none
}

.p-tieredmenu .p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-tieredmenu .p-menuitem-link .p-menuitem-icon {
    color: #6c757d;
    margin-right: .5rem
}

.p-tieredmenu .p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-tieredmenu .p-menuitem-link:not(.p-disabled):hover {
    background: #e9ecef
}

.p-tieredmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
    color: #495057
}

.p-tieredmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon,
.p-tieredmenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon {
    color: #6c757d
}

.p-tieredmenu .p-menuitem-link:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: inset 0 0 0 .15rem #a6d5fa
}

.p-tieredmenu .p-submenu-list,
.p-tieredmenu.p-tieredmenu-overlay {
    background: #fff;
    border: 0;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.p-tieredmenu .p-submenu-list {
    padding: .25rem 0
}

.p-tieredmenu .p-menuitem,
.p-tieredmenu .p-menuitem:last-child {
    margin: 0
}

.p-tieredmenu .p-menuitem.p-menuitem-active>.p-menuitem-link {
    background: #e9ecef
}

.p-tieredmenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-text {
    color: #495057
}

.p-tieredmenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-menuitem-icon,
.p-tieredmenu .p-menuitem.p-menuitem-active>.p-menuitem-link .p-submenu-icon {
    color: #6c757d
}

.p-tieredmenu .p-menu-separator {
    border-top: 1px solid #dee2e6;
    margin: .25rem 0
}

.p-tieredmenu .p-submenu-icon {
    font-size: .875rem
}

.p-inline-message {
    padding: .5rem;
    margin: 0;
    border-radius: 3px
}

.p-inline-message.p-inline-message-info {
    background: #b3e5fc;
    border: 0 solid #0891cf;
    color: #044868
}

.p-inline-message.p-inline-message-info .p-inline-message-icon {
    color: #044868
}

.p-inline-message.p-inline-message-success {
    background: #c8e6c9;
    border: 0 solid #439446;
    color: #224a23
}

.p-inline-message.p-inline-message-success .p-inline-message-icon {
    color: #224a23
}

.p-inline-message.p-inline-message-warn {
    background: #ffecb3;
    border: 0 solid #d9a300;
    color: #6d5100
}

.p-inline-message.p-inline-message-warn .p-inline-message-icon {
    color: #6d5100
}

.p-inline-message.p-inline-message-error {
    background: #ffcdd2;
    border: 0 solid #e60017;
    color: #73000c
}

.p-inline-message.p-inline-message-error .p-inline-message-icon {
    color: #73000c
}

.p-inline-message .p-inline-message-icon {
    font-size: 1rem;
    margin-right: .5rem
}

.p-inline-message .p-inline-message-text {
    font-size: 1rem
}

.p-inline-message.p-inline-message-icon-only .p-inline-message-icon {
    margin-right: 0
}

.p-message {
    margin: 1rem 0;
    border-radius: 3px
}

.p-message .p-message-wrapper {
    padding: 1rem 1.5rem
}

.p-message .p-message-close {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: transparent;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-message .p-message-close:hover {
    background: hsla(0, 0%, 100%, .3)
}

.p-message .p-message-close:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-message.p-message-info {
    background: #b3e5fc;
    border: solid #0891cf;
    border-width: 0 0 0 6px;
    color: #044868
}

.p-message.p-message-info .p-message-close,
.p-message.p-message-info .p-message-icon {
    color: #044868
}

.p-message.p-message-success {
    background: #c8e6c9;
    border: solid #439446;
    border-width: 0 0 0 6px;
    color: #224a23
}

.p-message.p-message-success .p-message-close,
.p-message.p-message-success .p-message-icon {
    color: #224a23
}

.p-message.p-message-warn {
    background: #ffecb3;
    border: solid #d9a300;
    border-width: 0 0 0 6px;
    color: #6d5100
}

.p-message.p-message-warn .p-message-close,
.p-message.p-message-warn .p-message-icon {
    color: #6d5100
}

.p-message.p-message-error {
    background: #ffcdd2;
    border: solid #e60017;
    border-width: 0 0 0 6px;
    color: #73000c
}

.p-message.p-message-error .p-message-close,
.p-message.p-message-error .p-message-icon {
    color: #73000c
}

.p-message .p-message-text {
    font-size: 1rem;
    font-weight: 500
}

.p-message .p-message-icon {
    font-size: 1.5rem;
    margin-right: .5rem
}

.p-message .p-message-summary {
    font-weight: 700
}

.p-message .p-message-detail {
    margin-left: .5rem
}

.p-toast {
    opacity: .9
}

.p-toast .p-toast-message {
    margin: 0 0 1rem;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    border-radius: 3px
}

.p-toast .p-toast-message .p-toast-message-content {
    padding: 1rem;
    border-width: 0 0 0 6px
}

.p-toast .p-toast-message .p-toast-message-content .p-toast-message-text {
    margin: 0 0 0 1rem
}

.p-toast .p-toast-message .p-toast-message-content .p-toast-message-icon {
    font-size: 2rem
}

.p-toast .p-toast-message .p-toast-message-content .p-toast-summary {
    font-weight: 700
}

.p-toast .p-toast-message .p-toast-message-content .p-toast-detail {
    margin: .5rem 0 0
}

.p-toast .p-toast-message .p-toast-icon-close {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: transparent;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-toast .p-toast-message .p-toast-icon-close:hover {
    background: hsla(0, 0%, 100%, .3)
}

.p-toast .p-toast-message .p-toast-icon-close:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-toast .p-toast-message.p-toast-message-info {
    background: #b3e5fc;
    border: solid #0891cf;
    border-width: 0 0 0 6px;
    color: #044868
}

.p-toast .p-toast-message.p-toast-message-info .p-toast-icon-close,
.p-toast .p-toast-message.p-toast-message-info .p-toast-message-icon {
    color: #044868
}

.p-toast .p-toast-message.p-toast-message-success {
    background: #c8e6c9;
    border: solid #439446;
    border-width: 0 0 0 6px;
    color: #224a23
}

.p-toast .p-toast-message.p-toast-message-success .p-toast-icon-close,
.p-toast .p-toast-message.p-toast-message-success .p-toast-message-icon {
    color: #224a23
}

.p-toast .p-toast-message.p-toast-message-warn {
    background: #ffecb3;
    border: solid #d9a300;
    border-width: 0 0 0 6px;
    color: #6d5100
}

.p-toast .p-toast-message.p-toast-message-warn .p-toast-icon-close,
.p-toast .p-toast-message.p-toast-message-warn .p-toast-message-icon {
    color: #6d5100
}

.p-toast .p-toast-message.p-toast-message-error {
    background: #ffcdd2;
    border: solid #e60017;
    border-width: 0 0 0 6px;
    color: #73000c
}

.p-toast .p-toast-message.p-toast-message-error .p-toast-icon-close,
.p-toast .p-toast-message.p-toast-message-error .p-toast-message-icon {
    color: #73000c
}

.p-galleria .p-galleria-close {
    margin: .5rem;
    background: transparent;
    color: #f8f9fa;
    width: 4rem;
    height: 4rem;
    transition: background-color .2s, color .2s, box-shadow .2s;
    border-radius: 50%
}

.p-galleria .p-galleria-close .p-galleria-close-icon {
    font-size: 2rem
}

.p-galleria .p-galleria-close:hover {
    background: hsla(0, 0%, 100%, .1);
    color: #f8f9fa
}

.p-galleria .p-galleria-item-nav {
    background: transparent;
    color: #f8f9fa;
    width: 4rem;
    height: 4rem;
    transition: background-color .2s, color .2s, box-shadow .2s;
    border-radius: 3px;
    margin: 0 .5rem
}

.p-galleria .p-galleria-item-nav .p-galleria-item-next-icon,
.p-galleria .p-galleria-item-nav .p-galleria-item-prev-icon {
    font-size: 2rem
}

.p-galleria .p-galleria-item-nav:not(.p-disabled):hover {
    background: hsla(0, 0%, 100%, .1);
    color: #f8f9fa
}

.p-galleria .p-galleria-caption {
    background: rgba(0, 0, 0, .5);
    color: #f8f9fa;
    padding: 1rem
}

.p-galleria .p-galleria-indicators {
    padding: 1rem
}

.p-galleria .p-galleria-indicators .p-galleria-indicator button {
    background-color: #e9ecef;
    width: 1rem;
    height: 1rem;
    transition: background-color .2s, color .2s, box-shadow .2s;
    border-radius: 50%
}

.p-galleria .p-galleria-indicators .p-galleria-indicator button:hover {
    background: #dee2e6
}

.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
    background: #e3f2fd;
    color: #495057
}

.p-galleria.p-galleria-indicators-bottom .p-galleria-indicator,
.p-galleria.p-galleria-indicators-top .p-galleria-indicator {
    margin-right: .5rem
}

.p-galleria.p-galleria-indicators-left .p-galleria-indicator,
.p-galleria.p-galleria-indicators-right .p-galleria-indicator {
    margin-bottom: .5rem
}

.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators {
    background: rgba(0, 0, 0, .5)
}

.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator button {
    background: hsla(0, 0%, 100%, .4)
}

.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator button:hover {
    background: hsla(0, 0%, 100%, .6)
}

.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button {
    background: #e3f2fd;
    color: #495057
}

.p-galleria .p-galleria-thumbnail-container {
    background: rgba(0, 0, 0, .9);
    padding: 1rem .25rem
}

.p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-next,
.p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-prev {
    margin: .5rem;
    background-color: initial;
    color: #f8f9fa;
    width: 2rem;
    height: 2rem;
    transition: background-color .2s, color .2s, box-shadow .2s;
    border-radius: 50%
}

.p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-next:hover,
.p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-prev:hover {
    background: hsla(0, 0%, 100%, .1);
    color: #f8f9fa
}

.p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-item-content:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-galleria-mask.p-component-overlay {
    background-color: rgba(0, 0, 0, .9)
}

.p-avatar {
    background-color: #dee2e6;
    border-radius: 3px
}

.p-avatar.p-avatar-lg {
    width: 3rem;
    height: 3rem;
    font-size: 1.5rem
}

.p-avatar.p-avatar-lg .p-avatar-icon {
    font-size: 1.5rem
}

.p-avatar.p-avatar-xl {
    width: 4rem;
    height: 4rem;
    font-size: 2rem
}

.p-avatar.p-avatar-xl .p-avatar-icon {
    font-size: 2rem
}

.p-avatar-group .p-avatar {
    border: 2px solid #fff
}

.p-badge {
    background: #2196f3;
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    min-width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem
}

.p-badge.p-badge-secondary {
    background-color: #607d8b;
    color: #fff
}

.p-badge.p-badge-success {
    background-color: #689f38;
    color: #fff
}

.p-badge.p-badge-info {
    background-color: #0288d1;
    color: #fff
}

.p-badge.p-badge-warning {
    background-color: #fbc02d;
    color: #212529
}

.p-badge.p-badge-danger {
    background-color: #d32f2f;
    color: #fff
}

.p-badge.p-badge-lg {
    font-size: 1.125rem;
    min-width: 2.25rem;
    height: 2.25rem;
    line-height: 2.25rem
}

.p-badge.p-badge-xl {
    font-size: 1.5rem;
    min-width: 3rem;
    height: 3rem;
    line-height: 3rem
}

.p-blockui.p-component-overlay {
    background: rgba(0, 0, 0, .4)
}

.p-chip {
    background-color: #dee2e6;
    color: #495057;
    border-radius: 16px;
    padding: 0 .5rem
}

.p-chip .p-chip-text {
    line-height: 1.5;
    margin-top: .25rem;
    margin-bottom: .25rem
}

.p-chip .p-chip-icon {
    margin-right: .5rem
}

.p-chip .pi-chip-remove-icon {
    margin-left: .5rem
}

.p-chip img {
    width: 2rem;
    height: 2rem;
    margin-left: -.5rem;
    margin-right: .5rem
}

.p-chip .pi-chip-remove-icon {
    border-radius: 3px;
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-chip .pi-chip-remove-icon:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-inplace .p-inplace-display {
    padding: .5rem;
    border-radius: 3px;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s
}

.p-inplace .p-inplace-display:not(.p-disabled):hover {
    background: #e9ecef;
    color: #495057
}

.p-inplace .p-inplace-display:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 .2rem #a6d5fa
}

.p-progressbar {
    border: 0;
    height: 1.5rem;
    background: #dee2e6;
    border-radius: 3px
}

.p-progressbar .p-progressbar-value {
    border: 0;
    margin: 0;
    background: #2196f3
}

.p-progressbar .p-progressbar-label {
    color: #495057;
    line-height: 1.5rem
}

.p-scrolltop {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12);
    transition: background-color .2s, color .2s, box-shadow .2s
}

.p-scrolltop.p-link {
    background: rgba(0, 0, 0, .7)
}

.p-scrolltop.p-link:hover {
    background: rgba(0, 0, 0, .8)
}

.p-scrolltop .p-scrolltop-icon {
    font-size: 1.5rem;
    color: #f8f9fa
}

.p-skeleton {
    background-color: #e9ecef;
    border-radius: 3px
}

.p-skeleton:after {
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, .4), hsla(0, 0%, 100%, 0))
}

.p-tag {
    background: #2196f3;
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    padding: .25rem .4rem;
    border-radius: 3px
}

.p-tag.p-tag-success {
    background-color: #689f38;
    color: #fff
}

.p-tag.p-tag-info {
    background-color: #0288d1;
    color: #fff
}

.p-tag.p-tag-warning {
    background-color: #fbc02d;
    color: #212529
}

.p-tag.p-tag-danger {
    background-color: #d32f2f;
    color: #fff
}

.p-tag .p-tag-icon {
    margin-right: .25rem;
    font-size: .75rem
}

.p-terminal {
    background: #fff;
    color: #495057;
    border: 1px solid #dee2e6;
    padding: 1rem
}

.p-terminal .p-terminal-input {
    font-size: 1rem;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol
}

.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button,
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
    background-color: #2196f3
}

.p-component,
.p-component * {
    box-sizing: border-box
}

.p-hidden {
    display: none
}

.p-hidden-space {
    visibility: hidden
}

.p-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.p-hidden-accessible input,
.p-hidden-accessible select {
    transform: scale(0)
}

.p-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    text-decoration: none;
    font-size: 100%;
    list-style: none
}

.p-disabled,
.p-disabled * {
    cursor: default !important;
    pointer-events: none
}

.p-component-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.p-overflow-hidden {
    overflow: hidden
}

.p-unselectable-text {
    -webkit-user-select: none;
    user-select: none
}

.p-scrollbar-measure {
    width: 100px;
    height: 100px;
    overflow: scroll;
    position: absolute;
    top: -9999px
}

@keyframes p-fadein {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

button,
input[type=button],
input[type=file]::-webkit-file-upload-button,
input[type=reset],
input[type=submit] {
    border-radius: 0
}

.p-link {
    text-align: left;
    background-color: initial;
    margin: 0;
    padding: 0;
    border: 0;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none
}

.p-sr-only {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important
}

.p-connected-overlay {
    opacity: 0;
    transform: scaleY(.8);
    transition: transform .12s cubic-bezier(0, 0, .2, 1), opacity .12s cubic-bezier(0, 0, .2, 1)
}

.p-connected-overlay-visible {
    opacity: 1;
    transform: scaleY(1)
}

.p-connected-overlay-hidden {
    opacity: 0;
    transform: scaleY(1);
    transition: opacity .1s linear
}

.p-toggleable-content.ng-animating {
    overflow: hidden
}

.p-badge {
    display: inline-block;
    border-radius: 10px;
    text-align: center;
    padding: 0 .5rem
}

.p-overlay-badge {
    position: relative
}

.p-overlay-badge .p-badge {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
    transform-origin: 100% 0;
    margin: 0
}

.p-badge-dot {
    width: .5rem;
    min-width: .5rem;
    height: .5rem
}

.p-badge-dot,
.p-badge-no-gutter {
    border-radius: 50%;
    padding: 0
}

.p-button {
    margin: 0;
    display: inline-flex;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    align-items: center;
    vertical-align: bottom;
    text-align: center;
    overflow: hidden;
    position: relative
}

.p-button-label {
    flex: 1 1 auto
}

.p-button-icon-right {
    order: 1
}

.p-button:disabled {
    cursor: default
}

.p-button-icon-only {
    justify-content: center
}

.p-button-icon-only .p-button-label {
    visibility: hidden;
    width: 0;
    flex: 0 0 auto
}

.p-button-vertical {
    flex-direction: column
}

.p-button-icon-bottom {
    order: 2
}

.p-buttonset .p-button {
    margin: 0
}

.p-buttonset .p-button:not(:last-child) {
    border-right: 0
}

.p-buttonset .p-button:not(:first-of-type):not(:last-of-type) {
    border-radius: 0
}

.p-buttonset .p-button:first-of-type {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.p-buttonset .p-button:last-of-type {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.p-buttonset .p-button:focus {
    position: relative;
    z-index: 1
}

.p-checkbox {
    display: inline-flex;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    vertical-align: bottom
}

.p-checkbox-disabled {
    cursor: default !important;
    pointer-events: none
}

.p-checkbox-box {
    display: flex;
    justify-content: center;
    align-items: center
}

p-checkbox {
    display: inline-flex;
    vertical-align: bottom;
    align-items: center
}

.p-checkbox-label {
    line-height: 1
}

.p-colorpicker-panel .p-colorpicker-color {
    background: transparent url(color.6441e63a57ccc5105bad.png) no-repeat 0 0
}

.p-colorpicker-panel .p-colorpicker-hue {
    background: transparent url(hue.f8505bd4d6f3e3aa435b.png) no-repeat 0 0
}

.p-inputtext {
    margin: 0
}

.p-fluid .p-inputtext {
    width: 100%
}

.p-inputgroup {
    display: flex;
    align-items: stretch;
    width: 100%
}

.p-inputgroup-addon {
    display: flex;
    align-items: center;
    justify-content: center
}

.p-inputgroup .p-float-label {
    display: flex;
    align-items: stretch;
    width: 100%
}

.p-fluid .p-inputgroup .p-inputtext,
.p-inputgroup .p-inputtext {
    flex: 1 1 auto;
    width: 1%
}

.p-float-label {
    display: block;
    position: relative
}

.p-float-label label {
    position: absolute;
    pointer-events: none;
    top: 50%;
    margin-top: -.5rem;
    transition-property: all;
    transition-timing-function: ease;
    line-height: 1
}

.p-float-label textarea~label {
    top: 1rem
}

.p-float-label .p-inputwrapper-filled~label,
.p-float-label .p-inputwrapper-focus~label,
.p-float-label input.p-filled~label,
.p-float-label input:focus~label,
.p-float-label textarea.p-filled~label,
.p-float-label textarea:focus~label {
    top: -.75rem;
    font-size: 12px
}

.p-float-label .input:-webkit-autofill~label {
    top: -20px;
    font-size: 12px
}

.p-input-icon-left,
.p-input-icon-right {
    position: relative;
    display: inline-block
}

.p-input-icon-left>i,
.p-input-icon-right>i {
    position: absolute;
    top: 50%;
    margin-top: -.5rem
}

.p-fluid .p-input-icon-left,
.p-fluid .p-input-icon-right {
    display: block;
    width: 100%
}

.p-inputtextarea-resizable {
    overflow: hidden;
    resize: none
}

.p-fluid .p-inputtextarea {
    width: 100%
}

.p-password {
    position: relative;
    display: inline-flex
}

.p-password-panel {
    position: absolute
}

.p-password .p-password-panel {
    min-width: 100%
}

.p-password-meter {
    height: 10px
}

.p-password-strength {
    height: 100%;
    width: 0;
    transition: width 1s ease-in-out
}

.p-fluid .p-password {
    display: flex
}

.p-radiobutton {
    display: inline-flex;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    vertical-align: bottom
}

.p-radiobutton-box {
    display: flex;
    justify-content: center;
    align-items: center
}

.p-radiobutton-icon {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0) scale(.1);
    border-radius: 50%;
    visibility: hidden
}

.p-radiobutton-box.p-highlight .p-radiobutton-icon {
    transform: translateZ(0) scale(1);
    visibility: visible
}

p-radiobutton {
    display: inline-flex;
    vertical-align: bottom;
    align-items: center
}

.p-radiobutton-label {
    line-height: 1
}

.p-ripple {
    overflow: hidden;
    position: relative
}

.p-ink {
    display: block;
    position: absolute;
    background: hsla(0, 0%, 100%, .5);
    border-radius: 100%;
    transform: scale(0)
}

.p-ink-active {
    animation: ripple .4s linear
}

.p-ripple-disabled .p-ink {
    display: none !important
}

@keyframes ripple {
    to {
        opacity: 0;
        transform: scale(2.5)
    }
}

.p-tooltip {
    position: absolute;
    display: none;
    padding: .25em .5rem;
    max-width: 12.5rem
}

.p-tooltip.p-tooltip-left,
.p-tooltip.p-tooltip-right {
    padding: 0 .25rem
}

.p-tooltip.p-tooltip-bottom,
.p-tooltip.p-tooltip-top {
    padding: .25em 0
}

.p-tooltip .p-tooltip-text {
    white-space: pre-line
}

.p-tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.p-tooltip-right .p-tooltip-arrow {
    top: 50%;
    left: 0;
    margin-top: -.25rem;
    border-width: .25em .25em .25em 0
}

.p-tooltip-left .p-tooltip-arrow {
    top: 50%;
    right: 0;
    margin-top: -.25rem;
    border-width: .25em 0 .25em .25rem
}

.p-tooltip.p-tooltip-top {
    padding: .25em 0
}

.p-tooltip-top .p-tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -.25rem;
    border-width: .25em .25em 0
}

.p-tooltip-bottom .p-tooltip-arrow {
    top: 0;
    left: 50%;
    margin-left: -.25rem;
    border-width: 0 .25em .25rem
}

@font-face {
    font-family: primeicons;
    font-display: auto;
    src: url(primeicons.dfbfef2de4bfb34e9722.eot);
    src: url(primeicons.dfbfef2de4bfb34e9722.eot?#iefix) format("embedded-opentype"), url(primeicons.3a0d4a58da62cf7c55bb.ttf) format("truetype"), url(primeicons.e61f3495a7ecd3d571a4.woff) format("woff"), url(primeicons.c55d94a248721abbd220.svg?#primeicons) format("svg");
    font-weight: 400;
    font-style: normal
}

.pi {
    font-family: primeicons;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.pi:before {
    --webkit-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.pi-fw {
    width: 1.28571429em;
    text-align: center
}

.pi-spin {
    animation: fa-spin 2s linear infinite
}

@keyframes fa-spin {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(359deg)
    }
}

.pi-send:before {
    content: "\e9ca"
}

.pi-slack:before {
    content: "\e9c9"
}

.pi-sun:before {
    content: "\e9c8"
}

.pi-moon:before {
    content: "\e9c7"
}

.pi-vimeo:before {
    content: "\e9c6"
}

.pi-youtube:before {
    content: "\e9c5"
}

.pi-flag:before {
    content: "\e9c4"
}

.pi-wallet:before {
    content: "\e9c3"
}

.pi-map:before {
    content: "\e9c2"
}

.pi-link:before {
    content: "\e9c1"
}

.pi-credit-card:before {
    content: "\e9bf"
}

.pi-discord:before {
    content: "\e9c0"
}

.pi-percentage:before {
    content: "\e9be"
}

.pi-euro:before {
    content: "\e9bd"
}

.pi-book:before {
    content: "\e9ba"
}

.pi-shield:before {
    content: "\e9b9"
}

.pi-paypal:before {
    content: "\e9bb"
}

.pi-amazon:before {
    content: "\e9bc"
}

.pi-phone:before {
    content: "\e9b8"
}

.pi-filter-slash:before {
    content: "\e9b7"
}

.pi-facebook:before {
    content: "\e9b4"
}

.pi-github:before {
    content: "\e9b5"
}

.pi-twitter:before {
    content: "\e9b6"
}

.pi-step-backward-alt:before {
    content: "\e9ac"
}

.pi-step-forward-alt:before {
    content: "\e9ad"
}

.pi-forward:before {
    content: "\e9ae"
}

.pi-backward:before {
    content: "\e9af"
}

.pi-fast-backward:before {
    content: "\e9b0"
}

.pi-fast-forward:before {
    content: "\e9b1"
}

.pi-pause:before {
    content: "\e9b2"
}

.pi-play:before {
    content: "\e9b3"
}

.pi-compass:before {
    content: "\e9ab"
}

.pi-id-card:before {
    content: "\e9aa"
}

.pi-ticket:before {
    content: "\e9a9"
}

.pi-file-o:before {
    content: "\e9a8"
}

.pi-reply:before {
    content: "\e9a7"
}

.pi-directions-alt:before {
    content: "\e9a5"
}

.pi-directions:before {
    content: "\e9a6"
}

.pi-thumbs-up:before {
    content: "\e9a3"
}

.pi-thumbs-down:before {
    content: "\e9a4"
}

.pi-sort-numeric-down-alt:before {
    content: "\e996"
}

.pi-sort-numeric-up-alt:before {
    content: "\e997"
}

.pi-sort-alpha-down-alt:before {
    content: "\e998"
}

.pi-sort-alpha-up-alt:before {
    content: "\e999"
}

.pi-sort-numeric-down:before {
    content: "\e99a"
}

.pi-sort-numeric-up:before {
    content: "\e99b"
}

.pi-sort-alpha-down:before {
    content: "\e99c"
}

.pi-sort-alpha-up:before {
    content: "\e99d"
}

.pi-sort-alt:before {
    content: "\e99e"
}

.pi-sort-amount-up:before {
    content: "\e99f"
}

.pi-sort-amount-down:before {
    content: "\e9a0"
}

.pi-sort-amount-down-alt:before {
    content: "\e9a1"
}

.pi-sort-amount-up-alt:before {
    content: "\e9a2"
}

.pi-palette:before {
    content: "\e995"
}

.pi-undo:before {
    content: "\e994"
}

.pi-desktop:before {
    content: "\e993"
}

.pi-sliders-v:before {
    content: "\e991"
}

.pi-sliders-h:before {
    content: "\e992"
}

.pi-search-plus:before {
    content: "\e98f"
}

.pi-search-minus:before {
    content: "\e990"
}

.pi-file-excel:before {
    content: "\e98e"
}

.pi-file-pdf:before {
    content: "\e98d"
}

.pi-check-square:before {
    content: "\e98c"
}

.pi-chart-line:before {
    content: "\e98b"
}

.pi-user-edit:before {
    content: "\e98a"
}

.pi-exclamation-circle:before {
    content: "\e989"
}

.pi-android:before {
    content: "\e985"
}

.pi-google:before {
    content: "\e986"
}

.pi-apple:before {
    content: "\e987"
}

.pi-microsoft:before {
    content: "\e988"
}

.pi-heart:before {
    content: "\e984"
}

.pi-mobile:before {
    content: "\e982"
}

.pi-tablet:before {
    content: "\e983"
}

.pi-key:before {
    content: "\e981"
}

.pi-shopping-cart:before {
    content: "\e980"
}

.pi-comments:before {
    content: "\e97e"
}

.pi-comment:before {
    content: "\e97f"
}

.pi-briefcase:before {
    content: "\e97d"
}

.pi-bell:before {
    content: "\e97c"
}

.pi-paperclip:before {
    content: "\e97b"
}

.pi-share-alt:before {
    content: "\e97a"
}

.pi-envelope:before {
    content: "\e979"
}

.pi-volume-down:before {
    content: "\e976"
}

.pi-volume-up:before {
    content: "\e977"
}

.pi-volume-off:before {
    content: "\e978"
}

.pi-eject:before {
    content: "\e975"
}

.pi-money-bill:before {
    content: "\e974"
}

.pi-images:before {
    content: "\e973"
}

.pi-image:before {
    content: "\e972"
}

.pi-sign-in:before {
    content: "\e970"
}

.pi-sign-out:before {
    content: "\e971"
}

.pi-wifi:before {
    content: "\e96f"
}

.pi-sitemap:before {
    content: "\e96e"
}

.pi-chart-bar:before {
    content: "\e96d"
}

.pi-camera:before {
    content: "\e96c"
}

.pi-dollar:before {
    content: "\e96b"
}

.pi-lock-open:before {
    content: "\e96a"
}

.pi-table:before {
    content: "\e969"
}

.pi-map-marker:before {
    content: "\e968"
}

.pi-list:before {
    content: "\e967"
}

.pi-eye-slash:before {
    content: "\e965"
}

.pi-eye:before {
    content: "\e966"
}

.pi-folder-open:before {
    content: "\e964"
}

.pi-folder:before {
    content: "\e963"
}

.pi-video:before {
    content: "\e962"
}

.pi-inbox:before {
    content: "\e961"
}

.pi-lock:before {
    content: "\e95f"
}

.pi-unlock:before {
    content: "\e960"
}

.pi-tags:before {
    content: "\e95d"
}

.pi-tag:before {
    content: "\e95e"
}

.pi-power-off:before {
    content: "\e95c"
}

.pi-save:before {
    content: "\e95b"
}

.pi-question-circle:before {
    content: "\e959"
}

.pi-question:before {
    content: "\e95a"
}

.pi-copy:before {
    content: "\e957"
}

.pi-file:before {
    content: "\e958"
}

.pi-clone:before {
    content: "\e955"
}

.pi-calendar-times:before {
    content: "\e952"
}

.pi-calendar-minus:before {
    content: "\e953"
}

.pi-calendar-plus:before {
    content: "\e954"
}

.pi-ellipsis-v:before {
    content: "\e950"
}

.pi-ellipsis-h:before {
    content: "\e951"
}

.pi-bookmark:before {
    content: "\e94e"
}

.pi-globe:before {
    content: "\e94f"
}

.pi-replay:before {
    content: "\e94d"
}

.pi-filter:before {
    content: "\e94c"
}

.pi-print:before {
    content: "\e94b"
}

.pi-align-right:before {
    content: "\e946"
}

.pi-align-left:before {
    content: "\e947"
}

.pi-align-center:before {
    content: "\e948"
}

.pi-align-justify:before {
    content: "\e949"
}

.pi-cog:before {
    content: "\e94a"
}

.pi-cloud-download:before {
    content: "\e943"
}

.pi-cloud-upload:before {
    content: "\e944"
}

.pi-cloud:before {
    content: "\e945"
}

.pi-pencil:before {
    content: "\e942"
}

.pi-users:before {
    content: "\e941"
}

.pi-clock:before {
    content: "\e940"
}

.pi-user-minus:before {
    content: "\e93e"
}

.pi-user-plus:before {
    content: "\e93f"
}

.pi-trash:before {
    content: "\e93d"
}

.pi-external-link:before {
    content: "\e93c"
}

.pi-window-maximize:before {
    content: "\e93b"
}

.pi-window-minimize:before {
    content: "\e93a"
}

.pi-refresh:before {
    content: "\e938"
}

.pi-user:before {
    content: "\e939"
}

.pi-exclamation-triangle:before {
    content: "\e922"
}

.pi-calendar:before {
    content: "\e927"
}

.pi-chevron-circle-left:before {
    content: "\e928"
}

.pi-chevron-circle-down:before {
    content: "\e929"
}

.pi-chevron-circle-right:before {
    content: "\e92a"
}

.pi-chevron-circle-up:before {
    content: "\e92b"
}

.pi-angle-double-down:before {
    content: "\e92c"
}

.pi-angle-double-left:before {
    content: "\e92d"
}

.pi-angle-double-right:before {
    content: "\e92e"
}

.pi-angle-double-up:before {
    content: "\e92f"
}

.pi-angle-down:before {
    content: "\e930"
}

.pi-angle-left:before {
    content: "\e931"
}

.pi-angle-right:before {
    content: "\e932"
}

.pi-angle-up:before {
    content: "\e933"
}

.pi-upload:before {
    content: "\e934"
}

.pi-download:before {
    content: "\e956"
}

.pi-ban:before {
    content: "\e935"
}

.pi-star-o:before {
    content: "\e936"
}

.pi-star:before {
    content: "\e937"
}

.pi-chevron-left:before {
    content: "\e900"
}

.pi-chevron-right:before {
    content: "\e901"
}

.pi-chevron-down:before {
    content: "\e902"
}

.pi-chevron-up:before {
    content: "\e903"
}

.pi-caret-left:before {
    content: "\e904"
}

.pi-caret-right:before {
    content: "\e905"
}

.pi-caret-down:before {
    content: "\e906"
}

.pi-caret-up:before {
    content: "\e907"
}

.pi-search:before {
    content: "\e908"
}

.pi-check:before {
    content: "\e909"
}

.pi-check-circle:before {
    content: "\e90a"
}

.pi-times:before {
    content: "\e90b"
}

.pi-times-circle:before {
    content: "\e90c"
}

.pi-plus:before {
    content: "\e90d"
}

.pi-plus-circle:before {
    content: "\e90e"
}

.pi-minus:before {
    content: "\e90f"
}

.pi-minus-circle:before {
    content: "\e910"
}

.pi-circle-on:before {
    content: "\e911"
}

.pi-circle-off:before {
    content: "\e912"
}

.pi-sort-down:before {
    content: "\e913"
}

.pi-sort-up:before {
    content: "\e914"
}

.pi-sort:before {
    content: "\e915"
}

.pi-step-backward:before {
    content: "\e916"
}

.pi-step-forward:before {
    content: "\e917"
}

.pi-th-large:before {
    content: "\e918"
}

.pi-arrow-down:before {
    content: "\e919"
}

.pi-arrow-left:before {
    content: "\e91a"
}

.pi-arrow-right:before {
    content: "\e91b"
}

.pi-arrow-up:before {
    content: "\e91c"
}

.pi-bars:before {
    content: "\e91d"
}

.pi-arrow-circle-down:before {
    content: "\e91e"
}

.pi-arrow-circle-left:before {
    content: "\e91f"
}

.pi-arrow-circle-right:before {
    content: "\e920"
}

.pi-arrow-circle-up:before {
    content: "\e921"
}

.pi-info:before {
    content: "\e923"
}

.pi-info-circle:before {
    content: "\e924"
}

.pi-home:before {
    content: "\e925"
}

.pi-spinner:before {
    content: "\e926"
}

.mCustomScrollbar {
    touch-action: pinch-zoom
}

.mCustomScrollbar.mCS_no_scrollbar,
.mCustomScrollbar.mCS_touch_action {
    touch-action: auto
}

.mCustomScrollBox {
    position: relative;
    overflow: hidden;
    height: 100%;
    max-width: 100%;
    outline: none;
    direction: ltr
}

.mCSB_container {
    overflow: hidden;
    width: auto;
    height: auto
}

.mCSB_inside>.mCSB_container {
    margin-right: 30px
}

.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_container {
    margin-right: 0;
    margin-left: 30px
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-left: 0
}

.mCSB_scrollTools {
    position: absolute;
    width: 16px;
    height: auto;
    left: auto;
    top: 0;
    right: 0;
    bottom: 0
}

.mCSB_outside+.mCSB_scrollTools {
    right: -26px
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_scrollTools,
.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools {
    right: auto;
    left: 0
}

.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools {
    left: -26px
}

.mCSB_scrollTools .mCSB_draggerContainer {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: auto
}

.mCSB_scrollTools a+.mCSB_draggerContainer {
    margin: 20px 0
}

.mCSB_scrollTools .mCSB_draggerRail {
    width: 2px;
    height: 100%;
    margin: 0 auto;
    border-radius: 16px
}

.mCSB_scrollTools .mCSB_dragger {
    cursor: pointer;
    width: 100%;
    height: 30px;
    z-index: 1
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    position: relative;
    width: 4px;
    height: 100%;
    margin: 0 auto;
    border-radius: 16px;
    text-align: center
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    width: 12px
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 8px
}

.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonUp {
    display: block;
    position: absolute;
    height: 20px;
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    cursor: pointer
}

.mCSB_scrollTools .mCSB_buttonDown {
    bottom: 0
}

.mCSB_horizontal.mCSB_inside>.mCSB_container {
    margin-right: 0;
    margin-bottom: 30px
}

.mCSB_horizontal.mCSB_outside>.mCSB_container {
    min-height: 100%
}

.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
    margin-bottom: 0
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    width: auto;
    height: 16px;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0
}

.mCustomScrollBox+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox+.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    bottom: -26px
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal a+.mCSB_draggerContainer {
    margin: 0 20px
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 2px;
    margin: 7px 0
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 30px;
    height: 100%;
    left: 0
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 4px;
    margin: 6px auto
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    height: 12px;
    margin: 2px auto
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 8px;
    margin: 4px 0
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
    display: block;
    position: absolute;
    width: 20px;
    height: 100%;
    overflow: hidden;
    margin: 0 auto;
    cursor: pointer
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
    left: 0
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
    right: 0
}

.mCSB_container_wrapper {
    position: absolute;
    height: auto;
    width: auto;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-right: 30px;
    margin-bottom: 30px
}

.mCSB_container_wrapper>.mCSB_container {
    padding-right: 30px;
    padding-bottom: 30px;
    box-sizing: border-box
}

.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 20px
}

.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 20px
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden+.mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 0
}

.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 0
}

.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 20px
}

.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 0
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_container_wrapper {
    margin-right: 0;
    margin-left: 30px
}

.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden>.mCSB_container {
    padding-right: 0
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden>.mCSB_container {
    padding-bottom: 0
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0;
    margin-left: 0
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
    margin-bottom: 0
}

.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    transition: opacity .2s ease-in-out, background-color .2s ease-in-out
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail {
    transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out
}

.mCSB_scrollTools {
    opacity: .75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)"
}

.mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,
.mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools {
    opacity: 0;
    filter: "alpha(opacity=0)";
    -ms-filter: "alpha(opacity=0)"
}

.mCS-autoHide:hover>.mCustomScrollBox>.mCSB_scrollTools,
.mCS-autoHide:hover>.mCustomScrollBox~.mCSB_scrollTools,
.mCustomScrollbar>.mCustomScrollBox>.mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar>.mCustomScrollBox~.mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover>.mCSB_scrollTools,
.mCustomScrollBox:hover~.mCSB_scrollTools {
    opacity: 1;
    filter: "alpha(opacity=100)";
    -ms-filter: "alpha(opacity=100)"
}

.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .4);
    filter: "alpha(opacity=40)";
    -ms-filter: "alpha(opacity=40)"
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .75);
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)"
}

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .85);
    filter: "alpha(opacity=85)";
    -ms-filter: "alpha(opacity=85)"
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .9);
    filter: "alpha(opacity=90)";
    -ms-filter: "alpha(opacity=90)"
}

.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight,
.mCSB_scrollTools .mCSB_buttonUp {
    background-image: url(mCSB_buttons.5b35a39c5f877ba43637.png);
    background-repeat: no-repeat;
    opacity: .4;
    filter: "alpha(opacity=40)";
    -ms-filter: "alpha(opacity=40)"
}

.mCSB_scrollTools .mCSB_buttonUp {
    background-position: 0 0
}

.mCSB_scrollTools .mCSB_buttonDown {
    background-position: 0 -20px
}

.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: 0 -40px
}

.mCSB_scrollTools .mCSB_buttonRight {
    background-position: 0 -56px
}

.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover,
.mCSB_scrollTools .mCSB_buttonUp:hover {
    opacity: .75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)"
}

.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active,
.mCSB_scrollTools .mCSB_buttonUp:active {
    opacity: .9;
    filter: "alpha(opacity=90)";
    -ms-filter: "alpha(opacity=90)"
}

.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .15)
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75)
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: rgba(0, 0, 0, .85)
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: rgba(0, 0, 0, .9)
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px 0
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -20px
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -40px
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -56px
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .1);
    border-radius: 1px
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 4px;
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .75);
    border-radius: 1px
}

.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 4px;
    margin: 6px auto
}

.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .85)
}

.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .9)
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px 0
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -20px
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -40px
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -56px
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .1);
    border-radius: 1px
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75);
    border-radius: 1px
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .85)
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .9)
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px 0
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -20px
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -40px
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -56px
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .1);
    border-radius: 2px
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .75);
    border-radius: 2px
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 4px;
    margin: 6px 0
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 6px;
    margin: 5px auto
}

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .85)
}

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .9)
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -16px 0
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -16px -20px
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -20px -40px
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -20px -56px
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .1);
    border-radius: 2px
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75);
    border-radius: 2px
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .85)
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .9)
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -96px 0
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -96px -20px
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -100px -40px
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -100px -56px
}

.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .1)
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 2px
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 2px;
    margin: 7px auto
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .15)
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75)
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .85)
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .9)
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px 0
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -20px
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -40px
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -56px
}

.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .15)
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded.mCSB_scrollTools .mCSB_dragger {
    height: 14px
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 14px;
    margin: 0 1px
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 14px
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 14px;
    margin: 1px 0
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    width: 16px;
    height: 16px;
    margin: -1px 0
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 4px
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    height: 16px;
    width: 16px;
    margin: 0 -1px
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 4px;
    margin: 6px 0
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
    background-position: 0 -72px
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
    background-position: 0 -92px
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: 0 -112px
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
    background-position: 0 -128px
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75)
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .15)
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .85)
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .9)
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px -72px
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -92px
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -112px
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -128px
}

.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail {
    width: 4px
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    background-color: initial;
    background-position: 50%
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
    background-repeat: repeat-y;
    opacity: .3;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)"
}

.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    height: 4px;
    margin: 6px 0;
    background-repeat: repeat-x
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -16px -72px
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -16px -92px
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -20px -112px
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -20px -128px
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=")
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -96px -72px
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -96px -92px
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -100px -112px
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -100px -128px
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-repeat: repeat-y;
    background-image: linear-gradient(90deg, hsla(0, 0%, 100%, .5) 0, hsla(0, 0%, 100%, 0))
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    background-repeat: repeat-x;
    background-image: linear-gradient(180deg, hsla(0, 0%, 100%, .5) 0, hsla(0, 0%, 100%, 0))
}

.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger {
    height: 70px
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 70px
}

.mCS-3d-dark.mCSB_scrollTools,
.mCS-3d.mCSB_scrollTools {
    opacity: 1;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)"
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
    border-radius: 16px
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
    width: 8px;
    background-color: #000;
    background-color: rgba(0, 0, 0, .2);
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, .5), inset -1px 0 1px hsla(0, 0%, 100%, .2)
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #555
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 8px
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 8px;
    margin: 4px 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .5), inset 0 -1px 1px hsla(0, 0%, 100%, .2)
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 8px;
    margin: 4px auto
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .1);
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, .1)
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1)
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px
}

.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools {
    opacity: 1;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)"
}

.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
    border-radius: 7px
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    border-radius: 5px
}

.mCSB_inside+.mCS-3d-thick-dark.mCSB_scrollTools_vertical,
.mCSB_inside+.mCS-3d-thick.mCSB_scrollTools_vertical {
    right: 1px
}

.mCS-3d-thick-dark.mCSB_scrollTools_vertical,
.mCS-3d-thick.mCSB_scrollTools_vertical {
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, .1), inset 0 0 14px rgba(0, 0, 0, .5)
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal,
.mCS-3d-thick.mCSB_scrollTools_horizontal {
    bottom: 1px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1), inset 0 0 14px rgba(0, 0, 0, .5)
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 1px 0 0 hsla(0, 0%, 100%, .4);
    width: 12px;
    margin: 2px;
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .4)
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #555
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 12px;
    width: auto
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
    background-color: #000;
    background-color: rgba(0, 0, 0, .05);
    box-shadow: inset 1px 1px 16px rgba(0, 0, 0, .1)
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail {
    background-color: initial
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px
}

.mCS-3d-thick-dark.mCSB_scrollTools {
    box-shadow: inset 0 0 14px rgba(0, 0, 0, .2)
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1), inset 0 0 14px rgba(0, 0, 0, .2)
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 1px 0 0 hsla(0, 0%, 100%, .4), inset -1px 0 0 rgba(0, 0, 0, .2)
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .4), inset 0 -1px 0 rgba(0, 0, 0, .2)
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #777
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
    background-color: #fff;
    background-color: rgba(0, 0, 0, .05);
    box-shadow: inset 1px 1px 16px rgba(0, 0, 0, .1)
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: initial
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px
}

.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,
.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical {
    right: 0;
    margin: 12px 0
}

.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    bottom: 0;
    margin: 0 12px
}

.mCS-dir-rtl>.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,
.mCS-dir-rtl>.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical {
    left: 0;
    right: auto
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail {
    background-color: initial
}

.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger {
    height: 50px
}

.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 50px
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .2);
    filter: "alpha(opacity=20)";
    -ms-filter: "alpha(opacity=20)"
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .5);
    filter: "alpha(opacity=50)";
    -ms-filter: "alpha(opacity=50)"
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .2);
    filter: "alpha(opacity=20)";
    -ms-filter: "alpha(opacity=20)"
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .5);
    filter: "alpha(opacity=50)";
    -ms-filter: "alpha(opacity=50)"
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail {
    width: 6px;
    background-color: #000;
    background-color: rgba(0, 0, 0, .2)
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px
}

.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 6px;
    margin: 5px 0
}

.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 12px
}

.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 12px;
    margin: 2px 0
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75)
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .85)
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .9)
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .1)
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail {
    width: 12px;
    background-color: #000;
    background-color: rgba(0, 0, 0, .2)
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
    margin: 3px 5px;
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 6px;
    margin: 5px 3px;
    position: absolute;
    width: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 12px;
    margin: 2px 0
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75)
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .85)
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .9)
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .1)
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail {
    background-color: initial;
    border: 1px solid hsla(0, 0%, 100%, .2);
    box-sizing: border-box
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
    border-color: #000;
    border-color: rgba(0, 0, 0, .2)
}

.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .6)
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, .6)
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .75)
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .85)
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, .9)
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .75)
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .85)
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .9)
}