/* Stop chrome from lagging on click of links */
.s8-navigationPrimary
{
touch-action: manipulation;
}
/* ULs */
.s8-navigationPrimary, .s8-navigationPrimary ul
{
box-sizing: border-box;
list-style-type: none;
padding: 0px;
margin: 0px;
cursor: default;
}
/* Root LI */
.s8-navigationPrimary li
{
box-sizing: border-box;
display: block;
position: relative !important;
/* Turn off padding on li - should always be on */
padding: 0;
}
/* Root A */
.s8-navigationPrimary li a
{
box-sizing: border-box;
display: block !important;
text-decoration: none;
padding-top: 1em;
padding-bottom: 1em;
}
/* Sub Menus UL */
.s8-navigationPrimary li ul
{
box-sizing: border-box;
position: absolute !important;
z-index: 999;
padding: 0 !important;
width: auto !important;
}
.s8-navigationPrimary li ul li
{
box-sizing: border-box;
width: 100%;
white-space: nowrap;
}
.s8-navigationPrimary li ul li a
{
box-sizing: border-box;
padding: 0.5em 1em 0.5em 1em;
text-align: left;
width: 100%;
}
/* Horizontal styles */
.s8-navigationPrimary-horizontal
{
box-sizing: border-box;
display: flex;
justify-content: space-around;
}
.s8-navigationPrimary-horizontal li
{
flex-grow: 1;
text-align: center;
display: flex;
align-items: stretch;
/* IE 9 semi-support */
float: left;
}
.s8-navigationPrimary-horizontal li a
{
flex-grow: 1;
}
/* Vertical styles */
.s8-navigationPrimary-vertical li a
{
padding-left: 1em;
padding-right: 1em;
}
/* Open list items - positioning */
.s8-navigationPrimary-horizontal ul
{
top: 100% !important;
left: 0 !important;
}
.s8-navigationPrimary-horizontal ul ul
{
left: 100% !important;
top: 0 !important;
}
.s8-navigationPrimary-vertical ul
{
left: 100% !important;
top: 0 !important;
}
/* Sub Menu UL LI - Closed */
.s8-navigationPrimary li ul
{
-webkit-backface-visibility: hidden;
/* Animate with delay on max-height so we can play animation when -open class is added and removed */
visibility: hidden;
opacity: 0;
transform: translateX(-3px);
transition: opacity 0.15s ease-out 0s, transform 0.15s ease-out 0s, visibility 0.001s linear .15s;
pointer-events: none;
}
/* Horizontal menus pop in from top, so start top at -3 */
.s8-navigationPrimary-horizontal>li>ul
{
transform: translateY(-3px);
}
/* Sub Menu UL LI - Open */
.s8-navigationPrimary li.s8-navigationPrimaryLI-open>ul
{
visibility: visible;
transform: translate(0px, 0px);
opacity: 1;
transition: opacity 0.15s ease-out 0s, transform 0.15s ease-out 0s, visibility 0.001s linear 0.001s;
pointer-events: all;
}
/* When an li has children */
.s8-navigationPrimary li.s8-navigationPrimary-hasChildren>a::before
{
content: '';
margin-left: -0.2em;
}
.s8-navigationPrimary li.s8-navigationPrimary-hasChildren>a::after
{
font-family: Arial, sans-serif;
content: '\25bc';
font-size: 0.4em;
box-sizing: border-box;
margin-left: 0.5em;
margin-right: -0.2em;
width: 1px;
overflow: visible;
vertical-align: middle;
white-space: nowrap;
display: inline-block;
margin-top: -1px;
}
/* On tablets, reduce the letter spacing */
@media (max-width:1024px)
{
.s8-navigationPrimary
{
letter-spacing: -1px;
word-spacing: -1px;
}
/* Hide the drop downs to make space */
.s8-navigationPrimary-horizontal>li.s8-navigationPrimary-hasChildren>a::before,
.s8-navigationPrimary-horizontal>li.s8-navigationPrimary-hasChildren>a::after
{
display: none;
}
}
/* Mobile menu */
.s8-navigationPrimaryMobile
{
display: none;
text-align: left;
}
.s8-navigationPrimaryMobile>li>a svg
{
box-sizing: content-box;
width: 1em;
height: 1em;
padding: 0.5em;
margin-top: -.5em;
margin-bottom: -.5em;
vertical-align: text-top;
margin-right: 0.5em;
stroke: currentColor;
stroke-width: 2px;
stroke-linecap: round;
}
.s8-navigationPrimaryMobile .s8-navigationPrimaryMobile-bar1,
.s8-navigationPrimaryMobile .s8-navigationPrimaryMobile-bar3
{
transition: transform 0.25s linear;
}
.s8-navigationPrimaryMobile.s8-navigationPrimary-mobileOpen .s8-navigationPrimaryMobile-bar1
{
transform: translateY(5px);
}
.s8-navigationPrimaryMobile.s8-navigationPrimary-mobileOpen .s8-navigationPrimaryMobile-bar3
{
transform: translateY(-5px);
}
/* Mobile */
@media (max-width:700px)
{
/* Hide desktop menu */
.s8-navigationPrimary
{
display: none;
flex-direction: column;
transition: max-height 0.2s ease-out;
-webkit-tap-highlight-color: rgba(50, 50, 50, 0.05);
position: relative;
letter-spacing: normal;
word-spacing: normal;
}
.s8-navigationPrimary li
{
float: none;
flex-direction: column;
}
/* Desktop menu has left and right padding when open */
.s8-navigationPrimary li a
{
padding-left: 1em;
padding-right: 1em;
text-align: left;
}
/* Show desktop menu when mobileOpen class is added */
.s8-navigationPrimary.s8-navigationPrimary-mobileOpen
{
display: flex;
}
/* Show mobile menu */
.s8-navigationPrimaryMobile
{
display: flex;
}
.s8-navigationPrimaryMobile li a
{
display: block;
text-align: center;
}
/* Sub menus are not position absolute */
.s8-navigationPrimary li ul
{
position: relative !important;
margin-left: 1em;
left: 0 !important;
height: 0px;
overflow: hidden;
transform: translateY(-3px);
opacity: 1;
}
.s8-navigationPrimary li.s8-navigationPrimaryLI-open>ul
{
height: auto;
overflow: auto;
}
/* Restore the drop downs hidden on mobile */
.s8-navigationPrimary-horizontal>li.s8-navigationPrimary-hasChildren>a::before,
.s8-navigationPrimary-horizontal>li.s8-navigationPrimary-hasChildren>a::after
{
display: inline-block;
}
}
/*===============================
= Wrapper =
===============================*/
tooltip
{
top: 0px;
left: 0px;
display: none;
box-sizing: border-box;
position: absolute;
line-height: normal;
}
/*==================================
= Animations =
==================================*/
tooltip
{
-webkit-animation : tooltipAnimShowStandard 200ms forwards;
animation : tooltipAnimShowStandard 200ms forwards;
}
tooltip.animationDisable
{
-webkit-animation : none !important;
animation : none !important;
}
@-webkit-keyframes tooltipAnimShowStandard
{
0% {opacity: 0.6;}
100% {opacity: 1;}
}
@keyframes tooltipAnimShowStandard
{
0% {opacity: 0.6;}
100% {opacity: 1;}
}
tooltip.tooltipHide
{
-webkit-animation : tooltipAnimHideStandard 200ms forwards;
animation : tooltipAnimHideStandard 200ms forwards;
pointer-events: none;
}
tooltip.tooltipHide.animationDisable
{
opacity: 0;
}
@-webkit-keyframes tooltipAnimHideStandard
{
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes tooltipAnimHideStandard
{
0% {opacity: 1;}
100% {opacity: 0;}
}
.tooltipAnimated tooltipcontent
{
transition: all 500ms ease;
}
.tooltipAnimated tooltipcontent:hover
{
-webkit-box-shadow: 1px 1px 3px 1px rgba(12, 61, 131, 0.15);
-moz-box-shadow: 1px 1px 3px 1px rgba(12, 61, 131, 0.15);
box-shadow: 1px 1px 3px 1px rgba(12, 61, 131, 0.15);
}
.tooltipAnimated-bounce.C-30 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_LT 500ms forwards;
animation : tooltipAnim-bounce_LT 500ms forwards;
}
.tooltipAnimated-bounce.C-31 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_L 500ms forwards;
animation : tooltipAnim-bounce_L 500ms forwards;
}
.tooltipAnimated-bounce.C-32 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_LB 500ms forwards;
animation : tooltipAnim-bounce_LB 500ms forwards;
}
.tooltipAnimated-bounce.C-10 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_RT 500ms forwards;
animation : tooltipAnim-bounce_RT 500ms forwards;
}
.tooltipAnimated-bounce.C-11 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_R 500ms forwards;
animation : tooltipAnim-bounce_R 500ms forwards;
}
.tooltipAnimated-bounce.C-12 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_RB 500ms forwards;
animation : tooltipAnim-bounce_RB 500ms forwards;
}
.tooltipAnimated-bounce.C-00 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_TL 500ms forwards;
animation : tooltipAnim-bounce_TL 500ms forwards;
}
.tooltipAnimated-bounce.C-01 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_T 500ms forwards;
animation : tooltipAnim-bounce_T 500ms forwards;
}
.tooltipAnimated-bounce.C-02 tooltipcontent
{
-webkit-animation : tooltipAnim-bounce_TR 500ms forwards;
animation : tooltipAnim-bounce_TR 500ms forwards;
}
/* Left */
@-webkit-keyframes tooltipAnim-bounce_L
{
0% {transform: translateX(0px); opacity: 0;}
2% {transform: translateX(12px); opacity: 0.7;}
10% {transform: translateX(12px); }
50% {transform: translateX(0px); }
66% {transform: translateX(3px); }
100% {transform: translateX(0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_L
{
0% {transform: translateX(0px); opacity: 0;}
2% {transform: translateX(12px); opacity: 0.7;}
10% {transform: translateX(12px);}
50% {transform: translateX(0px); }
66% {transform: translateX(3px); }
100% {transform: translateX(0px); opacity: 1;}
}
@-webkit-keyframes tooltipAnim-bounce_LT
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(12px, 12px); opacity: 0.7;}
10% {transform: translate(12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_LT
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(12px, 12px); opacity: 0.7;}
10% {transform: translate(12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@-webkit-keyframes tooltipAnim-bounce_LB
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(12px, -12px); opacity: 0.7;}
10% {transform: translate(12px, -12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(3px, -3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_LB
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(12px, -12px); opacity: 0.7;}
10% {transform: translate(12px, -12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(3px, -3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
/* Right */
@-webkit-keyframes tooltipAnim-bounce_R
{
0% {transform: translateX(0px); opacity: 0;}
2% {transform: translateX(-12px); opacity: 0.7;}
10% {transform: translateX(-12px);}
50% {transform: translateX(0px); }
66% {transform: translateX(-3px); }
100% {transform: translateX(0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_R
{
0% {transform: translateX(0px); opacity: 0;}
2% {transform: translateX(-12px); opacity: 0.7;}
10% {transform: translateX(-12px);}
50% {transform: translateX(0px); }
66% {transform: translateX(-3px); }
100% {transform: translateX(0px); opacity: 1;}
}
@-webkit-keyframes tooltipAnim-bounce_RT
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(-12px, 12px); opacity: 0.7;}
10% {transform: translate(-12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(-3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_RT
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(-12px, 12px); opacity: 0.7;}
10% {transform: translate(-12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(-3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@-webkit-keyframes tooltipAnim-bounce_RB
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(-12px, -12px); opacity: 0.7;}
10% {transform: translate(-12px, -12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(-3px, -3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_RB
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(-12px, -12px); opacity: 0.7;}
10% {transform: translate(-12px, -12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(-3px, -3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
/* Top */
@-webkit-keyframes tooltipAnim-bounce_T
{
0% {transform: translateY(0px); opacity: 0;}
2% {transform: translateY(12px); opacity: 0.7;}
10% {transform: translateY(12px);}
50% {transform: translateY(0px); }
66% {transform: translateY(3px); }
100% {transform: translateY(0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_T
{
0% {transform: translateY(0px); opacity: 0;}
2% {transform: translateY(12px); opacity: 0.7;}
10% {transform: translateY(12px);}
50% {transform: translateY(0px); }
66% {transform: translateY(3px); }
100% {transform: translateY(0px); opacity: 1;}
}
@-webkit-keyframes tooltipAnim-bounce_TL
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(12px, 12px); opacity: 0.7;}
10% {transform: translate(12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_TL
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(12px, 12px); opacity: 0.7;}
10% {transform: translate(12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@-webkit-keyframes tooltipAnim-bounce_TR
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(-12px, 12px); opacity: 0.7;}
10% {transform: translate(-12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(-3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
@keyframes tooltipAnim-bounce_TR
{
0% {transform: translate(0px, 0px); opacity: 0;}
2% {transform: translate(-12px, 12px); opacity: 0.7;}
10% {transform: translate(-12px, 12px);}
50% {transform: translate(0px, 0px); }
66% {transform: translate(-3px, 3px); }
100% {transform: translate(0px, 0px); opacity: 1;}
}
.tooltipAnimated-none
{
-webkit-animation: none !important;
animation: none !important;
}
.tooltipAnimated-none.tooltipHide
{
display: none !important;
}
/*===============================
= Content =
===============================*/
tooltipcontent
{
box-sizing: border-box;
position: relative;
display: inline-block;
padding: 2px 6px 2px 6px;
min-width: 25px;
-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
border-radius: 4px;
background-color: #FFF;
}
tooltipclose
{
position: absolute;
display: block;
top: 5px;
right: 5px;
width: 16px;
height: 16px;
cursor: pointer;
}
tooltipclose::before, tooltipclose::after
{
content: "";
position: absolute;
width: 12px;
top: 7px;
left: 2px;
background: rgb(50,50,50);
height: 1px;
}
tooltipclose::before
{
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
tooltipclose::after
{
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
/*=============================
= tooltipTitle =
=============================*/
.s8ToolTip_Title
{
display: none;
width: 100%;
border-radius: 4px 4px 0px 0px;
text-transform: uppercase;
font-size: smaller;
margin-bottom: 5px;
}
/*===============================
= Text =
===============================*/
.s8ToolTip_Wrapper .s8ToolTip_Text
{
padding-left: 3px;
padding-right: 3px;
padding-top: 3px;
}
/*=======================================
= Chevron Wrapper =
=======================================*/
.C-00 tooltipchevronwrapper, .C-01 tooltipchevronwrapper, .C-02 tooltipchevronwrapper,
.C-20 tooltipchevronwrapper, .C-21 tooltipchevronwrapper, .C-22 tooltipchevronwrapper
{
width: 22px;
height: 10px;
}
.C-00 tooltipchevronwrapper, .C-01 tooltipchevronwrapper,
.C-20 tooltipchevronwrapper, .C-21 tooltipchevronwrapper
{
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.C-02 tooltipchevronwrapper, .C-22 tooltipchevronwrapper
{
-ms-transform: translateX(50%);
-webkit-transform: translateX(50%);
transform: translateX(50%);
}
.C-00 tooltipchevronwrapper, .C-01 tooltipchevronwrapper, .C-02 tooltipchevronwrapper
{
top: -10px;
}
.C-20 tooltipchevronwrapper, .C-21 tooltipchevronwrapper, .C-22 tooltipchevronwrapper
{
bottom: -10px;
}
.C-00 tooltipchevronwrapper, .C-20 tooltipchevronwrapper
{
left: 4px;
}
.C-01 tooltipchevronwrapper, .C-21 tooltipchevronwrapper
{
left: 50%;
}
.C-02 tooltipchevronwrapper, .C-22 tooltipchevronwrapper
{
right: 4px;
}
tooltipchevronwrapper
{
box-sizing: border-box;
position: absolute;
display: inline-block;
overflow: hidden;
pointer-events: none;
}
/* Left Right */
.C-30 tooltipchevronwrapper, .C-31 tooltipchevronwrapper, .C-32 tooltipchevronwrapper,
.C-10 tooltipchevronwrapper, .C-11 tooltipchevronwrapper, .C-12 tooltipchevronwrapper
{
width: 12px;
height: 22px;
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.C-32 tooltipchevronwrapper, .C-12 tooltipchevronwrapper
{
-ms-transform: translateY(50%);
-webkit-transform: translateY(50%);
transform: translateY(50%);
bottom: 4px; /* Offset border radius */
}
/* Left */
.C-30 tooltipchevronwrapper, .C-31 tooltipchevronwrapper, .C-32 tooltipchevronwrapper
{
left: -12px;
}
/* Right */
.C-10 tooltipchevronwrapper, .C-11 tooltipchevronwrapper, .C-12 tooltipchevronwrapper
{
right: -12px;
}
/* ___ Top */
.C-30 tooltipchevronwrapper, .C-10 tooltipchevronwrapper
{
top: 4px; /* Offset border radius */
}
/* ___ Center */
.C-31 tooltipchevronwrapper, .C-11 tooltipchevronwrapper
{
top: 50%;
}
/*================================
= Chevrons =
================================*/
tooltipchevron
{
box-sizing: border-box;
position: absolute;
display: inline-block;
background-color: #FFF;
/* Angular */
width: 7.1421356237px;
height: 7.1421356237px;
/* Square */
/*
width: 10px;
height: 10px;
*/
-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
}
.tooltipAnimated tooltipchevron
{
transition: all 100ms ease;
}
.tooltipAnimated tooltipcontent:hover tooltipchevron
{
-webkit-box-shadow: 1px 1px 3px 1px rgba(12, 61, 131, 0.15);
-moz-box-shadow: 1px 1px 3px 1px rgba(12, 61, 131, 0.15);
box-shadow: 1px 1px 3px 1px rgba(12, 61, 131, 0.15);
}
/* Specific Chevrons */
.C-31 tooltipchevron, .C-11 tooltipchevron,
.C-01 tooltipchevron, .C-21 tooltipchevron
{
width: 10px;
height: 10px;
}
/* Left */
.C-30 tooltipchevron, .C-31 tooltipchevron, .C-32 tooltipchevron
{
right: 0px;
}
.C-31 tooltipchevron
{
-ms-transform: translate(50%, -50%) rotate(45deg);
-webkit-transform: translate(50%, -50%) rotate(45deg);
transform: translate(50%, -50%) rotate(45deg);
}
/* Right */
.C-10 tooltipchevron, .C-11 tooltipchevron, .C-12 tooltipchevron
{
left: 0px;
}
.C-11 tooltipchevron
{
-ms-transform: translate(-50%, -50%) rotate(45deg);
-webkit-transform: translate(-50%, -50%) rotate(45deg);
transform: translate(-50%, -50%) rotate(45deg);
}
/* Left Right Top Center */
.C-30 tooltipchevron, .C-31 tooltipchevron,
.C-10 tooltipchevron, .C-11 tooltipchevron
{
top: 50%;
}
/* Left Top */
.C-30 tooltipchevron
{
-ms-transform: translateX(50%) skewX(45deg);
-webkit-transform: translateX(50%) skewX(45deg);
transform: translateX(50%) skewX(45deg);
}
/* Right Top */
.C-10 tooltipchevron
{
-ms-transform: translateX(-50%) skewX(-45deg);
-webkit-transform: translateX(-50%) skewX(-45deg);
transform: translateX(-50%) skewX(-45deg);
}
/* Left Bottom */
.C-32 tooltipchevron
{
bottom: 50%;
-ms-transform: translateX(50%) skewX(-45deg);
-webkit-transform: translateX(50%) skewX(-45deg);
transform: translateX(50%) skewX(-45deg);
}
/* Right Bottom */
.C-12 tooltipchevron
{
bottom: 50%;
-ms-transform: translateX(-50%) skewX(45deg);
-webkit-transform: translateX(-50%) skewX(45deg);
transform: translateX(-50%) skewX(45deg);
}
.C-00 tooltipchevron, .C-01 tooltipchevron, .C-02 tooltipchevron
{
bottom: 0px;
}
.C-00 tooltipchevron, .C-02 tooltipchevron, .C-20 tooltipchevron, .C-22 tooltipchevron
{
left: 50%;
}
.C-01 tooltipchevron
{
-ms-transform: translate(-50%, 50%) rotate(45deg);
-webkit-transform: translate(-50%, 50%) rotate(45deg);
transform: translate(-50%, 50%) rotate(45deg);
}
.C-00 tooltipchevron
{
-ms-transform: translateY(50%) skewY(45deg);
-webkit-transform: translateY(50%) skewY(45deg);
transform: translateY(50%) skewY(45deg);
}
.C-20 tooltipchevron, .C-21 tooltipchevron, .C-22 tooltipchevron
{
top: 0px;
}
.C-21 tooltipchevron, .C-01 tooltipchevron
{
left: 50%;
}
.C-21 tooltipchevron
{
-ms-transform: translate(-50%, -50%) rotate(45deg);
-webkit-transform: translate(-50%, -50%) rotate(45deg);
transform: translate(-50%, -50%) rotate(45deg);
}
.C-02 tooltipchevron
{
-ms-transform: translate(-100%, 50%) skewY(-45deg);
-webkit-transform: translate(-100%, 50%) skewY(-45deg);
transform: translate(-100%, 50%) skewY(-45deg);
}
.C-20 tooltipchevron
{
-ms-transform: translateY(-50%) skewY(-45deg);
-webkit-transform: translateY(-50%) skewY(-45deg);
transform: translateY(-50%) skewY(-45deg);
}
.C-22 tooltipchevron
{
-ms-transform: translate(-100%, -50%) skewY(45deg);
-webkit-transform: translate(-100%, -50%) skewY(45deg);
transform: translate(-100%, -50%) skewY(45deg);
}
tooltip.tooltipTitle.C-00 tooltipchevron,
tooltip.tooltipTitle.C-01 tooltipchevron,
tooltip.tooltipTitle.C-02 tooltipchevron,
tooltip.tooltipTitle.C-30 tooltipchevron,
tooltip.tooltipTitle.C-10 tooltipchevron
{
background-color: #DDD;
}
/*===================================
= Error Theme =
===================================*/
.tooltipTheme-error tooltipcontent
{
background-color: #bb0000;
color: #FFF;
padding: 8px;
white-space: nowrap;
}
.tooltipTheme-error tooltipcontent a
{
color: #FFF;
text-decoration: none;
border-bottom: 1px dotted #fff;
}
.tooltipTheme-error tooltipchevron,
.tooltipTheme-errortooltip.tooltipTitle.C-00 tooltipchevron,
.tooltipTheme-errortooltip.tooltipTitle.C-01 tooltipchevron,
.tooltipTheme-errortooltip.tooltipTitle.C-02 tooltipchevron,
.tooltipTheme-errortooltip.tooltipTitle.C-30 tooltipchevron,
.tooltipTheme-errortooltip.tooltipTitle.C-10 tooltipchevron
{
background-color: #bb0000;
border: 1px solid #bb0000;
}
tooltipvalidation .tooltipTheme-error
{
z-index: 1;
}
/*===================================
= Dark Theme =
===================================*/
.tooltipTheme-dark
{
position: absolute;
}
.tooltipTheme-dark tooltipcontent
{
background-color: #363640;
border: 1px solid #D2D2D2;
padding: 7px;
color: #fff;
font-size: small;
}
.tooltipTheme-dark tooltipchevron,
.tooltipTheme-darktooltip.tooltipTitle.C-00 tooltipchevron,
.tooltipTheme-darktooltip.tooltipTitle.C-01 tooltipchevron,
.tooltipTheme-darktooltip.tooltipTitle.C-02 tooltipchevron,
.tooltipTheme-darktooltip.tooltipTitle.C-30 tooltipchevron,
.tooltipTheme-darktooltip.tooltipTitle.C-10 tooltipchevron
{
background-color: #363640;
border: 1px solid #363640;
}
.tooltipTheme-dark tooltipclose::before, .tooltipTheme-dark tooltipclose::after
{
background: #fff;
}
/*===================================
= Editor Theme =
===================================*/
.tooltipTheme-editor
{
position: absolute;
z-index: 2147483647;
}
.tooltipTheme-editor tooltipcontent
{
background-color: #428bca;
border: 1px solid #428bca;
font-size: 16px;
font-weight: 900;
padding: 7px;
color: #fff;
}
.tooltipTheme-editor tooltipchevron,
.tooltipTheme-editortooltip.tooltipTitle.C-00 tooltipchevron,
.tooltipTheme-editortooltip.tooltipTitle.C-01 tooltipchevron,
.tooltipTheme-editortooltip.tooltipTitle.C-02 tooltipchevron,
.tooltipTheme-editortooltip.tooltipTitle.C-30 tooltipchevron,
.tooltipTheme-darktooltip.tooltipTitle.C-10 tooltipchevron
{
background-color: #428bca;
border: 1px solid #428bca;
}
/*===================================
= Editor Table Theme =
===================================*/
.tooltipTheme-editorTable
{
position: absolute;
z-index: 2147483647;
}
.tooltipTheme-editorTable tooltipcontent
{
background-color: #428bca;
border: 1px solid #428bca;
font-size: 16px;
font-weight: 900;
padding: 7px;
color: #fff;
padding: 0;
}
.tooltipTheme-editorTable tooltipchevron,
.tooltipTheme-editorTabletooltip.tooltipTitle.C-00 tooltipchevron,
.tooltipTheme-editorTabletooltip.tooltipTitle.C-01 tooltipchevron,
.tooltipTheme-editorTabletooltip.tooltipTitle.C-02 tooltipchevron,
.tooltipTheme-editorTabletooltip.tooltipTitle.C-30 tooltipchevron,
.tooltipTheme-editorTabletooltip.tooltipTitle.C-10 tooltipchevron
{
background-color: #428bca;
border: 1px solid #428bca;
}
/*===================================
= Editor Light Toolbar Theme =
===================================*/
.tooltipTheme-editorToolbar tooltipcontent
{
padding: 0px;
}
/*===================================
= Editor Dark Toolbar Theme =
===================================*/
.tooltipTheme-editorDark tooltipcontent
{
padding: 0px;
color: white;
background-color: #363640;
}
.tooltipTheme-editorDark tooltipchevron
{
background-color: #363640;
}
/*===================================
= Design Creator Tutorial Theme =
===================================*/
.tooltipTheme-DesignGeneratorTutorial tooltipcontent
{
padding: 0;
border-radius: 10px;
color: #363640;
background-color: #fff;
}
textarea
{
font-family: arial, sans-serif;
font-size: 10pt;
overflow: auto;
}