/** px-popover styles */
.px-popover { /*------------------------------------*    #PX-COLORS-DESIGN
\*------------------------------------*/ /** Neutral Palette (gray20 is darkest, gray1 is lightest) */ /** Define grey = gray to avoid dev typos */ /** Actionable Palette */ /** Selection Palette */ /** Dark Actionable Palette */ /** Alerts and Status */ /** Data Visualization */ /** Orange */ /** Yellow */ /** Yellow Green */ /** Green */ /** Teal */ /** Aqua */ /** Cyan */ /** Blue */ /** Violet */ /** Purple */ /** Pink */ /** Red */ /** Brown */ /** Gray */ /** Define grey = gray to avoid dev typos */ /** Salmon */ }

.px-popover .alpha { font-size: 5rem; line-height: 1.06667; font-weight: normal; }

.px-popover .beta { font-size: 4rem; line-height: 1; font-weight: normal; }

.px-popover .gamma { font-size: 3rem; line-height: 1.33333; font-weight: normal; }

.px-popover .delta { font-size: 2rem; line-height: 1.33333; font-weight: normal; }

.px-popover .epsilon { font-size: 1.33333rem; line-height: 1; font-weight: normal; }

.px-popover .zeta { font-size: 0.8rem; line-height: 1.66667; font-weight: normal; }

.px-popover .heading--page { font-size: 2rem; line-height: 1.33333; color: var(--px-headings-heading-page-color, #2c404c); }

.px-popover .heading--section { font-size: 1.33333rem; line-height: 1; color: var(--px-headings-heading-section-color, #677e8c); text-transform: uppercase; }

.px-popover .heading--subsection { font-size: 1rem; line-height: 1.33333; color: var(--px-headings-heading-subsection-color, #2c404c); background-color: var(--px-headings-heading-subsection-background, rgba(136, 154, 165, 0.15)); text-transform: uppercase; letter-spacing: var(--px-headings-letter-spacing, 0.3px); display: -webkit-box; display: -ms-flexbox; display: flex; padding-left: 5px; padding-right: 5px; }

.px-popover .label { font-size: 0.8rem; line-height: 1.66667; color: var(--px-headings-label-color, #677e8c); text-transform: uppercase; letter-spacing: var(--px-headings-letter-spacing, 0.3px); }

.px-popover .value { font-size: 1rem; line-height: 1.33333; color: var(--px-headings-value-color, #2c404c); }

.px-popover--is-open .popover__carat { -webkit-box-shadow: 1px 1px 0 white, -1px 0 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 1px 0 white, -1px 0 1px rgba(0, 0, 0, 0.15); }

.px-popover .popover__wrapper { position: absolute; z-index: 1005; margin: 5px; }

.px-popover .fadeFromVisible { opacity: 0; visibility: hidden; -webkit-transition: visibility 0s 0.10s, opacity 0.10s ease-out; transition: visibility 0s 0.10s, opacity 0.10s ease-out; }

.px-popover .fadeFromHidden { -webkit-transition: opacity 0.10s ease-out; transition: opacity 0.10s ease-out; opacity: 1; visibility: visible; }

.px-popover .popover { outline: none; padding: 20px; max-width: var(--px-popover-max-width, 3000px); border: 1px solid var(--px-popover-border-color, black); background-color: var(--px-popover-background-color, white); margin: 7px; color: var(--px-popover-text-color, black); -webkit-box-shadow: 0 1px 3px 0 var(--px-popover-shadow-color, black); box-shadow: 0 1px 3px 0 var(--px-popover-shadow-color, black); }

.px-popover .popover h5 { margin: 0 0 20px; }

.px-popover .popover p { margin: 0; word-wrap: break-word; }

.px-popover .popover__carat { position: absolute; width: 9.899px; height: 9.899px; background-color: var(--px-popover-background-color, white); }

.px-popover .popover__carat.top { border: 1px solid transparent; border-color: transparent transparent var(--px-popover-border-color, black) var(--px-popover-border-color, black); -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-box-shadow: 1px 0 0 var(--px-popover-background-color, white), -1px 1px 1px var(--px-popover-shadow-color, black); box-shadow: 1px 0 0 var(--px-popover-background-color, white), -1px 1px 1px var(--px-popover-shadow-color, black); }

.px-popover .popover__carat.bottom { border: 1px solid transparent; border-color: var(--px-popover-border-color, black) transparent transparent var(--px-popover-border-color, black); -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.px-popover .popover__carat.left { border: 1px solid transparent; border-color: var(--px-popover-border-color, black) var(--px-popover-border-color, black) transparent transparent; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-box-shadow: -1px 1px 0 var(--px-popover-background-color, white), 1px 0 1px var(--px-popover-shadow-color, black); box-shadow: -1px 1px 0 var(--px-popover-background-color, white), 1px 0 1px var(--px-popover-shadow-color, black); }

.px-popover .popover__carat.auto, .px-popover .popover__carat.right { border: 1px solid transparent; border-color: var(--px-popover-border-color, black) transparent transparent var(--px-popover-border-color, black); -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-box-shadow: 1px 1px 0 var(--px-popover-background-color, white), -1px 0 1px var(--px-popover-shadow-color, black); box-shadow: 1px 1px 0 var(--px-popover-background-color, white), -1px 0 1px var(--px-popover-shadow-color, black); }

@-moz-document url-prefix() { .px-popover .popover__carat.top { box-shadow: -1px 1px 0 var(--px-popover-shadow-color, black); }
  .px-popover .popover__carat.left { box-shadow: 0 2px 0 var(--px-popover-background-color, white), 1px 0 0 var(--px-popover-shadow-color, black); }
  .px-popover .popover__carat.right { box-shadow: 0 2px 0 var(--px-popover-background-color, white), -1px 0 0 var(--px-popover-shadow-color, black); } }
