/* ZingChart | PINT (www.pint.com) */

/* @group FONTS */
/* ---------------------------------------------- */
/* @font-face { font-family:'Roboto'; src:url('../fonts/Roboto-Regular.ttf') format('truetype'); font-weight:normal; font-style:normal; }
@font-face { font-family:'Roboto'; src:url('../fonts/Roboto-Bold.ttf') format('truetype'); font-weight:bold; font-style:bold; }
@font-face { font-family:'Roboto Slab'; src:url('../fonts/RobotoSlab-Light.ttf'); }
@font-face { font-family:'Raleway'; src:url('../fonts/Raleway-Light.ttf'); }
@font-face { font-family:'Dosis'; src:url('../fonts/Dosis-Light.ttf'); } */
/* @end group FONTS */
 
/* @group ANIMATIONS */
/* ---------------------------------------------- */
/* ANIMATIONS -- Background Image Scoll */
@-webkit-keyframes animatedBackground {
  from {
    background-position: 0 center;
  }
  to {
    background-position: 300% center;
  }
}
@keyframes animatedBackground {
  from {
    background-position: 0 center;
  }
  to {
    background-position: 300% center;
  }
}

/* ANIMATIONS -- Zoom */
@-webkit-keyframes ANIMATE-ZOOM {
  0%   { opacity:0; -webkit-transform:scale(0.9); }
  100% { opacity:1; -webkit-transform:scale(1); }
}

/* ANIMATIONS -- Obscure */
@-webkit-keyframes ANIMATE-OBSCURE {
  0%   { opacity:1; }
  100% { opacity:.1; }
}

/* ANIMATIONS -- Slide Left */
@-webkit-keyframes ANIMATE-LEFT {
  0%   { margin-left:-30px; }
  100% { margin-left:0; }
}

/* ANIMATIONS -- Slide Right */
@-webkit-keyframes ANIMATE-RIGHT {
  0%   { margin-right:-20px; }
  100% { margin-right:0; }
}

/* ANIMATIONS -- Tabbox 1 */
@-webkit-keyframes ANIMATE-TABBOX-1 {
  0%   { margin-top:6px; opacity:0; }
  100% { margin-top:0; opacity:1; }
}

/* ANIMATIONS -- Tabbox 2 */
@-webkit-keyframes ANIMATE-TABBOX-2 {
  0%   { opacity:.5; }
  100% { opacity:1; }
}

/* ANIMATIONS -- TAB TEXT */
@-webkit-keyframes TAB-TEXT {
  0%   { left:0; }
  100% { left:-9px; }
}

/* ANIMATIONS -- TAB CLOSE */
@-webkit-keyframes TAB-CLOSE {
  0%   { right:12px; }
  100% { right:6px; }
}

/* ANIMATIONS -- BLINK */
@keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}

/* ANIMATIONS -- HOMEPAGE EDITOR FLASH */
@-webkit-keyframes highlightEditableFields {
    from {
        background: rgba(255, 235, 59, 0.1);
    }
    to {
        background: rgba(255, 235, 59, 0.8);
    }
}

@keyframes highlightEditableFields {
    from {
        background: rgba(255, 235, 59, 0.1);
    }
    to {
        background: rgba(255, 235, 59, 0.8);
    }
}

/* ANIMATIONS -- Bubbling ZC Logo */
@-webkit-keyframes poppingStars {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 0;
    -webkit-transform: translateY(-10px);
            transform: translateY(-10px);
  }
}

@keyframes poppingStars {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 0;
    -webkit-transform: translateY(-10px);
            transform: translateY(-10px);
  }
}

#logo:hover .plus {
  -webkit-animation-name: poppingStars;
          animation-name: poppingStars;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#logo:hover .plus__first {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}
#logo:hover .plus__mid {  
  -webkit-animation-delay: 0.1s;  
          animation-delay: 0.1s;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
}
#logo:hover .plus__last {  
  -webkit-animation-delay: 0.2s;  
          animation-delay: 0.2s;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}

/* ANIMATIONS -- ZOOM */
[data-zc-animate="zoom"][data-active] { -moz-animation:ANIMATE-ZOOM .6s; -o-animation:ANIMATE-ZOOM .6s; -webkit-animation:ANIMATE-ZOOM .6s; }
[data-zc-animate="zoom1"][data-active] { -moz-animation:ANIMATE-ZOOM 4s; -o-animation:ANIMATE-ZOOM 4s; -webkit-animation:ANIMATE-ZOOM .4s; }
[data-zc-animate="scale"] { -webkit-transition:all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
[data-zc-animate="scale"]:hover { -webkit-transform:scale(1.1); transform:scale(1.1); }
[data-zc-animate="fade"] { -webkit-transition:all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
[data-zc-animate="fade"]:hover { opacity:0.5; }

/* ANIMATIONS -- OBSCURE */
[data-zc-obscure] { opacity:.1; -moz-animation:ANIMATE-OBSCURE .3s; -o-animation:ANIMATE-OBSCURE .3s; -webkit-animation:ANIMATE-OBSCURE .5s; }

/* ANIMATIONS -- SLIDE RIGHT */
[data-zc-animate="right"][data-active] { -moz-animation:ANIMATE-RIGHT .3s; -o-animation:ANIMATE-RIGHT .3s; -webkit-animation:ANIMATE-RIGHT .3s; }

/* ANIMATIONS -- SLIDE LEFT */
[data-zc-animate="left"][data-active] { -moz-animation:ANIMATE-LEFT .3s; -o-animation:ANIMATE-LEFT .3s; -webkit-animation:ANIMATE-LEFT .5s; }

/* @end group ANIMATIONS */

/* @group ZINGCHART STYLE FIX */
/* ---------------------------------------------- */
.zc-menu {
    position: absolute;
    display: none;
    background-repeat: no-repeat !important;
    background-position: 50% 0% !important;
}
.zc-style {
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    text-shadow: none;
}

/* @end group ZINGCHART STYLE FIX */

/* @group DEFAULTS */
/* ---------------------------------------------- */

/* DEFAULTS -- Reset */
* { margin:0; padding:0; box-sizing:border-box; }
html { padding:0 0 1px; min-height:100%;}
html.mobile { -webkit-transition:-webkit-transform .15s; transition:-webkit-transform .15s; transition:transform .15s; transition:transform .15s, -webkit-transform .15s; }
html.open { position:fixed; -webkit-transform:translateX(230px); transform:translateX(230px);  -webkit-transition:transform .15s; }

/* DEFAULTS -- Body Styling */
body { padding-top:60px; min-height:100%; text-align:center; color:#505050; font:400 1rem/1.7 'Avenir','Open Sans',sans-serif; background:#f4f4f4; }
/* DEFAULTS -- Landing Page */
body[data-zc-page="landing"] { background:#fff; }

/* DEFAULTS -- Legacy Support of HTML elements */
section, aside, nav, footer { display:block; }

/* DEFAULTS -- Default Anchor Styling */
a, .a { color:#00abdd; text-decoration:none; -webkit-transition:color .15s, background-color .15s; transition:color .15s, background-color .15s; -moz-transition:color .15s, background-color .15s; }
a:hover { color:#0187ae; text-decoration:none; }

/* DEFAULTS -- Anchor with caret after */
a .fa-caret-right { margin-left:5px; }

hr { margin:0px; padding:0; width:100%; height:1px; display:inline-block; color:#d9d9d9; font-size:1px; overflow:hidden; clear:both; background:none; border:1px solid #d9d9d9; border-width:1px 0 0; }
hr[data-zc-noline] { color:transparent; background-color:transparent; border-color:transparent; }
img { max-width:100%; height:auto; border:0; }
body > iframe:first-child { display:none !important; }

ul { margin:0 0 18px 10px; list-style-type:none; }
ol { margin:0 0 18px 20px; }
li { line-height:inherit; }
ul li { margin-bottom:5px; }
.bullets li { background-repeat:no-repeat; background-position:-144px -112px; padding-left:15px; }
.webp .bullets li { background-image:url("../img/zingchart-sprite.webp"); }
.no-webp .bullets li { background-image:url("../img/zingchart-sprite.png"); }
.bullets.white li { background-position:-144px -120px; }
p { margin:0 0 18px; }
p strong { color:#7ca82b; }

/* Links */
p > a:not([data-zc-button]) { text-decoration: underline; }

table { border-collapse:collapse; }

/* DEFAULTS -- Headers */
h1,
.h1 {
    font-family: 'Avenir','Open Sans',sans-serif;
    font-size: 3rem;
    font-weight: normal;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
h1, .h1 { margin:0 0 32px; color:#003849; font:700 28px/24px 'Avenir','Open Sans',sans-serif; }
h2, .h2 { margin:0 0 18px; color:#003849; font:700 20px/24px 'Avenir','Open Sans',sans-serif; }
h2.alt, .h2-alt { margin:0 0 9px; text-transform:uppercase; color:#7ca82b; font-weight:normal; font-size:14px; line-height:18px; }
h3, .h3 { margin:0 0 15px; color:#003849; font:700 16px/22px 'Avenir','Open Sans',sans-serif; }
h3.alt, .h3-alt { color:#7ca82b; font-size:20px; }
h4, .h4 { margin:0 0 15px; color:#7ca82b; font:700 14px/16px 'Avenir','Open Sans',sans-serif; }
h5, .h5 { margin:0 0 15px; color:#003849; font:700 11px/13px 'Avenir','Open Sans',sans-serif; }
h6, .h6 { margin:0 0 15px; color:#003849; font:700 10px/12px 'Avenir','Open Sans',sans-serif; }

/* DEFAULTS -- Buttons */
button:focus { outline:none; }
button:disabled { cursor:not-allowed; }

/* DEFAULTS -- Flexbox */
.flex-column { display:flex; flex-direction:column; }
.flex-column iframe { margin-bottom:10px !important; flex:1; }
.flex-grow { flex-grow:1; }

/* DEFAULTS -- Forms */
form { font-size:14px; line-height:19px; -webkit-transition:background .15s; transition:background .15s; -moz-transition:background .15s; }
form:hover { -webkit-transition:background .15s; transition:background .15s; -moz-transition:background .15s; }
fieldset:after { content:''; display:block; clear:both; }
input:focus, textarea:focus { border-color:#96b9c5; box-shadow:0 0 8px #aeced9; -moz-box-shadow:0 0 8px #aeced9; -webkit-transition:box-shadow .15s; transition:box-shadow .15s; -moz-transition:box-shadow .15s; }
input:hover, textarea:hover { border-color:#cfcfcf; }
button, input, textarea { vertical-align:top; }
input[type="file"] { cursor:pointer; }
select { margin-top:12px; width:100%; max-width:100%; }
textarea { min-height:120px; resize:vertical; }
textarea:focus, input:focus { outline:none; }
fieldset { border:0; }
legend { display:none; }
label[for], input[type=checkbox], input[type=radio], input[type=submit], button, select { cursor:pointer; }
label { margin-bottom:3px; display:block; color:#003849; font-weight:bold; font-size:16px; }

/* DEFAULTS -- Placeholder */
::-webkit-input-placeholder { color:#5d7e89 !important; }
:focus::-webkit-input-placeholder { color:#5d7e89; opacity:.5; }
:-moz-placeholder, ::-moz-placeholder { color:#5d7e89; }
:-ms-input-placeholder { color:#5d7e89; }

/* DEFAULTS -- Input */
input {
    font-size: 16px;
}
input[type="text"],
input[type="email"],
input[type="tel"] {
    height: 50px;
    padding: 12px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
}
input[type="checkbox"] {
    display: none;
}
input[type="checkbox"] + label {
    display: inline;
    padding-left: 25px;
    background-repeat:no-repeat !important; 
    background-position:0px -181px !important;
}
.webp input[type="checkbox"] + label { background-image:url("../img/zingchart-sprite.webp"); }
.no-webp input[type="checkbox"] + label { background-image:url("../img/zingchart-sprite.png"); }
input[type="checkbox"]:checked + label {
    background-position: 0px -141px !important;
}

/* DEFAULTS -- Select */
select { margin:0px; -webkit-appearance:button; border-radius:4px; -webkit-padding-end:20px; -webkit-padding-start:14px; -webkit-user-select:none; -moz-appearance:none; border:1px solid #D9D9D9; font-size:20px; line-height:24px; background-color: white; background-repeat:no-repeat; background-position:100% -300px; color:#5d7e89; padding:11px; -moz-padding:11px; width:210px; }
.webp select { background-image:url("../img/zingchart-sprite.webp"); }
.no-webp select { background-image:url("../img/zingchart-sprite.png"); }
select:focus { outline:none; }
[data-zc-select*="cyan"] { color:#00baf0; border-color:#00baf0; background-position:100% -360px; }

/* DEFAULTS -- Content Selection */
::-moz-selection { color:#fff; background:#00baf0; }
::selection { color:#fff; background:#00baf0; }
/* @end group DEFAULTS */


/* @group SECTIONS */
/* ---------------------------------------------- */
[data-zc-bg] { background-color:#FFF; }
[data-zc-bg~="1"] { background-color:#003849; }
[data-zc-bg~="10"] { background:linear-gradient(to bottom, #003849 58%, #fff 42%); border-bottom: 2px solid #f4f4f4;}
[data-zc-bg~="2"] { background-color:#00baf0; }
[data-zc-bg~="3"] { background-color:#7CA82B; }
[data-zc-bg~="4"] { background-color:#F4F4F4; }
[data-zc-bg~="5"] { background-color:#EF8535; }
[data-zc-bg~="dissolve"] { -webkit-transition:0.25s background-color ease-in-out; transition:0.25s background-color ease-in-out; }
[data-zc-inner] { position:relative; margin:0 auto; padding:60px 10px; text-align:left; }
[data-zc-inner*="underline"] { border-bottom:1px solid #D9D9D9; }
[data-zc-inner*="feature"] { padding:40px 0px; }
[data-zc-inner~="banner"] { padding:40px 0px; }
[data-zc-inner~="banner"][data-zc-inner~="controls"] { padding-top:30px; }
[data-zc-inner*="nogap"] { padding: 60px 10px 0px; }
header [data-zc-inner] { padding:0px; }
.homepage-banner > [data-zc-inner]{ width:100%; max-width:1440px; padding:5px 10px; text-align:center;}

/* SECTIONS -- Feature Header */
[data-zc-inner*="feature"] h1 { color:#FFF; font-size:45px; line-height:60px; font-weight:normal; margin-bottom:0px; }

/* SECTIONS -- LOGO */
[data-zc-logo] { z-index:1003;  margin-top:-18px; padding:0; color:#7ca82b; font-size:25px; transform:scale(.5); -moz-transform:scale(.7);  -webkit-transform:scale(.7); }
[data-zc-logo] span { width:116px; height:39px; font-size:0; display:inline-block }

/* CHROMEFRAME */
.chromeframe { padding:15px; background:#f4f4f4; border-radius:4px; -moz-border-radius:4px; }

/* MAC SCROLLBAR */
.dropdown-menu::-webkit-scrollbar { -webkit-appearance:none; }
.dropdown-menu::-webkit-scrollbar:vertical { width:11px; }
.dropdown-menu::-webkit-scrollbar:horizontal { height:11px; }
.dropdown-menu::-webkit-scrollbar-thumb { border-radius:8px; border:2px solid white; background-color:rgba(0, 0, 0, .5); }
.dropdown-menu::-webkit-scrollbar-track { background-color:#fff; border-radius:8px; }
/* @end group SECTIONS */

/* @group COLUMNS */
/* ---------------------------------------------- */
[data-zc-row] { width:100%; position:relative; }
[data-zc-row]:after { content:""; display:table; clear:both; }
[data-zc-row="60 tall"] { height:60px; }
[data-zc-row*="tall"] [data-zc-column] { height:inherit; }
[data-zc-column] { float:left; min-height:1px; }

/* used on /features/mobile-charts to override data-zc-column width 2 lines up. Pat you were gone...quick fix -Nick*/
.mobile-chart { width:100%; }

/* also moving the context menu for mobile charts left 5px on /features/mobile-charts because the layout issues and once again...
 * Pat you were gone and I didn't want to add or change any lines to your beautiful CSS. Except these last couple lines and
 * comments.
 *
 * context menu already has absolute positioning*/
.mobile-chart > .zcm-cm-button-container > .zcm-cm-button {right:5px;}

[data-zc-column*="right"] { float:right; }

/* Flexboxin */
.row { display:-webkit-box; display:-ms-flexbox; display:flex; width:100%; }
.row > .col { -webkit-box-flex:1; -ms-flex:1; flex:1; }
.row.gutter > .col:nth-of-type(n + 2) { margin:0 0 0 18px; }
.row > .col._1_of_3 { -ms-flex-preferred-size:33%; flex-basis:33%; max-width:33%; }
.row > .col._1_of_4 { -ms-flex-preferred-size:25%; flex-basis:25%; max-width:25%; }
.row > .col._1_of_5 { -ms-flex-preferred-size:20%; flex-basis:20%; max-width:20%; }
.row > .col._1_of_6 { -ms-flex-preferred-size:16.6667%; flex-basis:16.6667%; max-width:16.6667%; }
.row > .col._1_of_7 { -ms-flex-preferred-size:16.6667%; flex-basis:16.6667%; max-width:14.2857%; }
.row > .col._1_of_8 { -ms-flex-preferred-size:12.5%; flex-basis:12.5%; max-width:12.5%; }
.row > .col._1_of_9 { -ms-flex-preferred-size:11.111111%; flex-basis:11.111111%; max-width:11.11111%; }
.row > .col._1_of_10 { -ms-flex-preferred-size:10%; flex-basis:10%; max-width:10%; }
.row > .col._1_of_10 { -ms-flex-preferred-size:10%; flex-basis:10%; max-width:10%; }
.row > .col._1_of_12 { -ms-flex-preferred-size:8.33333%; flex-basis:8.33333%; max-width:8.33333%; }
.row > .col._1_of_15 { -ms-flex-preferred-size:6.666667%; flex-basis:6.666667%; max-width:6.666667%; }
.row > .col._1_of_20 { -ms-flex-preferred-size:5%; flex-basis:5%; max-width:5%; }

/* @end group COLUMNS */

/* @group HEADER */
/* ---------------------------------------------- */
[data-zc-header] { position:absolute; top:0px; left:0; width:100%; height:74px; clear:both; color:#7ca82b; background:#fff; z-index:1002; box-shadow:0 2px 2px #d9d9d9; -ms-user-select:none; user-select:none; -moz-user-select:none; -webkit-user-select:none; }

/* HEADER -- Landing Page */
[data-zc-page="landing"] [data-zc-header] { background:none; border:0; box-shadow:none; }

/* HEADER -- Login */
[data-zc-login] { position:fixed; top:0; height:30px; background:#F0F0F0; z-index:9000; width:100%; border-bottom:1px solid #D9D9D9; }
[data-zc-login] a { text-decoration: underline; }
.secondary-header__nav { margin-bottom:0px; float:right;}
.secondary-header__link { line-height:16px; font-size:14px; padding:7px 0; float:left;  }
.secondary-header__link:not(:last-child) { padding-right:12px; margin-right:12px; border-right:1px solid #D9D9D9; }
[data-zc-login] .avatar { float:left; margin-right:5px; color:#00baf0; height:20px; overflow:hidden; width:20px; border-radius:50%; margin-top:-3px; }

/* HEADER -- Nav */
#custom-nav-width {
    width:100%;
    max-width:1440px;
}
[data-zc-header] ul { margin:0; }
[data-zc-header] li { list-style:none; cursor:default; }
[data-zc-header] a { display:inline-block; color:#003849; }
[data-zc-header] a.active { color:#7ca82b; }
[data-zc-header] a:hover { color:#01627f; }


/* HEADER -- Nav Mobile Wrap */
.mobile [data-zc-nav-group] { position:fixed; top:0; left:-230px; padding:20px 0 0; width:230px; height:100%; background:#f9f9f9; border-right:1px solid #f0f0f0; }

/* HEADER -- Nav Mobile Trigger */
[data-zc-nav-trigger] { display:none; }
.mobile [data-zc-nav-trigger] { z-index:1010; position:absolute; top:14px; left:14px; width:32px; height:32px; display:block; cursor:pointer; background-repeat:no-repeat; background-position:100% -60px; }
.webp .mobile [data-zc-nav-trigger] { background-image:url("../img/zingchart-sprite.webp"); }
.no-webp .mobile [data-zc-nav-trigger] { background-image:url("../img/zingchart-sprite.png"); }
/* HEADER -- Nav Mobile Mask */
.mobile [data-zc-nav-mask] { z-index:1011; position:fixed; top:0; left:0; width:100%; height:100%; cursor:pointer; }

/* HEADER -- Secondary Nav */
#trigger { border-radius:4px; font-size:18px; line-height:20px; cursor:pointer; color:#003849; }
#trigger .fa-caret-down { color:#00baf0; }
#options { display:none; background-color:#FFF; padding:10px; border-radius:4px; border:1px solid #d9d9d9; width:120px; position:relative; top:20px; }
#options.active { display:block; }
#options a, #options span { display:block; font-size:14px; padding:5px 0px; font-weight:lighter; }

/* HEADER -- Site Search */
#navSearch { height:40px; float:left; padding:8px; border:1px solid #d9d9d9; border-radius:4px; background:#FFF; }
#navSearch input { height:24px; border:none; padding: 5px 5px 5px 8px; margin-bottom:0px; }
#navSearch button { color:#00baf0; background-color:#FFF; height:24px; border:none; font-size:18px; position:relative; top:0px; right:0px; }
#navSearch button:hover { color:#00a5d5; }

/* Nav Secondary */
.avatar > img {
    border-radius:50%;
    height:25px;
    margin-top:-22px;
}

#support-user-dropdown {
    background: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 3px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    right: -15px;
    margin-top: 1px;
    min-width: 170px;
    padding: 10px 0px;
    position: absolute;
    text-align: left;
    z-index: 1000;
}

#support-user-dropdown[aria-expanded="true"] {
    opacity:1;
    pointer-events:visible;
}
#support-user-dropdown[aria-expanded="false"] {
    opacity:0;
    pointer-events:none;
}

#support-user-dropdown::before {
    content: "";
    display: inline-block;
    position: absolute;
    top: -7px;
    right: 4px;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #d8d8d8;
    border-left: 7px solid transparent;
}

#support-user-dropdown::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: -6px;
    right: 5px;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    border-left: 6px solid transparent;
}

#support-user-dropdown > a {
    display:block;
    padding:0px 20px;
}

#support-user-dropdown > a:hover {
    background-color:#eeeeee;
}

/* HEADER -- User Menu */
#user-menu { display:none; }
/* @end group HEADER */


/* @group FOOTER */
/* ---------------------------------------------- */
footer { text-align:left; }
/* Footer 1 */
footer address { font-style:normal; font-weight:400; line-height:1.7; }
footer address + a { margin-bottom:15px; display:inline-block; }
.footer-1 { background:#f4f4f4; }
.footer-1 [data-zc-inner] { padding:50px 6%; display:flex; flex-wrap:wrap; justify-content: space-between; color:#00394b; }
@media screen and (max-width:1023px) {
  .footer-1 [data-zc-inner] { width:100%; }
}
.footer-1 section { margin-bottom:30px; flex-basis:48%; }
.footer-1 [section-account] .fa { display:none; }
.footer-1 [section-other] { margin-bottom:0; flex-basis:100%; }
@media screen and (min-width:445px) {
  .footer-1 [section-product] { margin-top:10px; }
  [nav-social] { max-width:195px; }
}
.footer-1 nav a,
.footer-1 nav > span { padding:8px 0; display:flex; cursor:pointer; font-weight:500; font-size:1.05rem; line-height:1; color:#00394b; }
.footer-1 nav a:hover { color:#00baf0; }
.footer-1 nav > span { color:#00baf0; }
.footer-title {
  display: block;
  color: #9aadb0;
  font-size: 1.1667rem;
  font-weight: 900;
  line-height: 1.7;
  margin: 0 0 12px;
  text-transform: uppercase;
}
[nav-social] { display:flex; flex-wrap:wrap; }
[nav-social] a {
  align-items: center;
  background: #2e5c6a;
  border-radius: 50%;
  font-size: 1.25rem;
  height: 40px;
  justify-content: center;
  margin-bottom: 10px;
  margin-right: 10px;
  transform:scale(1);
  transition: transform .15s;
  width: 40px;
}
[nav-social] a:hover { transform:scale(1.15); }
[nav-social] svg { height:20px; }
[nav-social] path { fill:#fff; }
[nav-products] svg { height:22px; }
/* Footer 2 */
.footer-2 { color:#fff; background: linear-gradient(#073c4e, #265664); }
.footer-2 [data-zc-inner] { display:flex; flex-direction:column; align-items:center; }
.footer-2 [zc-logo] { display:none; }
.footer-2 nav { order:1; }
.footer-2 a { color:#fff; font-weight:bold; }
.footer-2 a + a { margin-left:30px; }
.footer-2 a + a { margin-left:30px; }

@media screen and (min-width:768px) {
  .footer-1 section { flex-basis:23%;}
  .footer-1 [section-product] { margin-top:0;}
  .footer-1 [section-zs] { margin-top:-10px; flex-basis:30%;}
}

@media screen and (min-width:1024px) {
  .footer-1 [data-zc-inner] { padding-right:0; padding-left:0; }
  .footer-1 section { flex-basis:20%;}

  .footer-2 [data-zc-inner] { padding-top:40px; padding-bottom:100px; flex-direction:row; }
  .footer-2 [zc-logo] { flex:1; display:block; order:1; transform:translateY(-5px); }
  .footer-2 [zc-logo] path,
  .footer-2 [zc-logo] rect { fill:#fff; }
  .footer-2 nav { order:2; }
  .footer-2 p { margin:0; }
}

@media screen and (min-width:1200px) {
  footer [data-zc-inner] { width:1156px; }
  .footer-1 section { margin-bottom:0; flex-basis:16%;}
  .footer-1 [section-zs] { flex-basis:24%; }
  .footer-1 [section-other] { flex-basis:21%; }
  [nav-products] svg { height:32px; }
  [nav-social] { max-width:100%; }
  [nav-social] { max-width:100%; }
}

@media screen and (min-width:1400px) {
  footer [data-zc-inner] { width:1360px; }
}

/* @group COMPONENTS */
/* ---------------------------------------------- */

/* COMPONENTS -- Tooltip */
[data-tooltip] {
    position: relative;
}
[data-tooltip]:not(a) {
    cursor: help;
}
[data-tooltip]:before {
    background: #505050;
    border: 1px solid #333;
    border-right: none;
    border-top: none;
    content: '';
    height: 10px;
    left: calc(100% + 5px);
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg);
    transition: 0.15s opacity;
    width: 10px;
    z-index: 200;
}
[data-tooltip]:after {
    background: #505050;
    border: 1px solid #333;
    border-radius: 2px;
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3), 0 2px 2px rgba(0, 0, 0, 0.1);
    color: white;
    content: attr(data-tooltip);
    left: calc(100% + 10px);
    opacity: 0;
    padding: 4px 6px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: 0.15s opacity;
    white-space: nowrap;
}
[data-tooltip]:hover:after,
[data-tooltip]:hover:before {
    opacity: 1;
    pointer-events: auto;
}

/* COMPONENTS -- Buttons */
[data-zc-button] { display:inline-block; padding:15px 20px; font-size:20px; line-height:20px; border:none; border-radius:5px; -webkit-transition:background-color 0.15s ease-in-out; transition:background-color 0.15s ease-in-out; }
[data-zc-button~="1"] { background-color:#00baf0; color:#FFF; }
[data-zc-button~="2"] { background-color:#F4F4F4; color:#00baf0; }
[data-zc-button~="3"] { background-color:#006C8C; color:#FFF; }
[data-zc-button~="4"] { background-color:#FFF; color:#00baf0; border:1px solid #D9D9D9; max-height:48px; }
[data-zc-button~="5"] { background-color:#4c6520; color:#FFF; }
[data-zc-button~="6"] { background-color:#7CA82B; color:#FFF; }
[data-zc-button~="7"] { background-color:#003849; color:#FFF; }
[data-zc-button~="8"] { background-color:#EF8535; color:#FFF; }
[data-zc-button~="fullwidth"] { width:100%; padding-left:0px; padding-right:0px; }
[data-zc-button~="fullheight"] { height:100%; padding-top:0px; padding-bottom:0px; }
[data-zc-button~="small"] { padding:2px 8px; font-size:16px; line-height:24px; }

/* COMPONENTS -- Buttons: Hover */
[data-zc-button~="1"]:hover { background-color:#00a5d5; color:#FFF; }
[data-zc-button~="5"]:hover { background-color:#4c6520; }
[data-zc-button~="6"]:hover { background-color:#4c6520; color:#FFF; }
[data-zc-button~="8"]:hover { background-color:#FF9545; color:#FFF; }

/* COMPONENTS -- Buttons: Disabled */
[data-zc-button]:disabled { background-color:#999; color:#EEE; border-color:#666; }

/* COMPONENTS -- Select :: Cyan */
select.cyan { color:#00baf0; border-color:#00baf0; background-position:100% -360px; }

/* COMPONENTS -- Select followed by button */
select + [data-zc-button] { vertical-align:bottom; }

/* COMPONENTS -- Faux-Select */
[data-zc-select] { min-width:180px; border:1px solid #D9D9D9; border-radius:4px; padding:14px; overflow:hidden; background-color:#FFF; z-index:5000; }
[data-zc-select] li { overflow:hidden; margin:0px; line-height:20px; }
[data-zc-select] li:first-child { display:block; cursor:pointer; color:#00baf0; }
[data-zc-select] li:not(:first-child) { height:0px; -webkit-transition:height 0.15s ease-in-out; transition:height 0.15s ease-in-out; }
[data-zc-select].active li { height:25px; -webkit-transition:height 0.15s ease-in-out; transition:height 0.15s ease-in-out; }
[data-zc-select] li:first-child .fa-caret-down { float:right; -webkit-transition:all 0.15s ease-in-out; transition:all 0.15s ease-in-out; padding-top:3px; }
[data-zc-select].active li:first-child .fa-caret-down { -webkit-transform:rotate(-180deg); transform:rotate(-180deg); }
[data-zc-select].active li:nth-child(2) { border-top:1px solid #F0F0F0; padding-top:5px; margin-bottom:5px; }

/* COMPONENTS -- Faux-Select Pinned */
[data-zc-select~="pinned"] { position:absolute; top:48px; }

/* COMPONENTS -- Banner Icons */
[data-zc-inner~="banner"][data-zc-inner~="controls"] [data-zc-icon] { position:relative; }
button[data-zc-icon] { background:none; border:none; display:block; width:100%; font-size:20px; line-height:25px; font-weight:bold; color:#003849; text-align:center; padding-top:80px; -webkit-transition:0.2s color ease-in-out; transition:0.2s color ease-in-out; }
button[data-zc-icon]:before { content:' '; background:url('../img/banner_icons.png'); background-repeat:no-repeat; position:absolute; width:100%; height:70px; position:absolute; top:0px; left:0px; }
button[data-zc-icon="interactive"]:before { background-position:50% -838px; }
button[data-zc-icon="beautiful"]:before { background-position:50% -640px; }
button[data-zc-icon="responsive"]:before { background-position:50% -478px; }
button[data-zc-icon="realtime"]:before { background-position:50% -323px; }
button[data-zc-icon="bigdata"]:before { background-position:50% 0px; }
button[data-zc-icon="api"]:before { background-position:50% -160px; }

/* COMPONENTS -- Banner Icons :: Hover */
button[data-zc-icon]:not(.active):hover { color:#005f7c; }

/* COMPONENTS -- Banner Icons :: Active */
button[data-zc-icon].active { color:#FFF; }
button[data-zc-icon="interactive"].active:before { background-position:50% -934px; }
button[data-zc-icon="beautiful"].active:before { background-position:50% -725px; }
button[data-zc-icon="responsive"].active:before { background-position:50% -559px; }
button[data-zc-icon="realtime"].active:before { background-position:50% -404px; }
button[data-zc-icon="bigdata"].active:before { background-position:50% -76px; }
button[data-zc-icon="api"].active:before { background-position:50% -238px; }

/* COMPONENTS -- Dots */
[data-zc-dot] { display:inline-block; float:left; width:60px; height:60px; font-size:28px; line-height:60px; text-align:center; font-weight:bolder; border-radius:100%; }
[data-zc-dot='green'] { background-color:#7ca82b; color:#FFF; }
[data-zc-dot='navy'] { background-color:#003849; color:#FFF; }
[data-zc-dot='cyan'] { background-color:#00baf0; color:#FFF; }
[data-zc-dot='red'] { background-color:#cc3300; color:#FFF; }
[data-zc-dot='grey'] { background-color:#505050; color:#FFF; }
[data-zc-dot] + span { margin-left:15px; margin-top:6px; text-align:left; }
a[data-zc-dot] { cursor:pointer; }
a[data-zc-dot]:hover { color:#FFF; background-color:#638622; }

/* COMPONENTS -- Quote */
[data-zc-quote] { text-align:left; }
[data-zc-quote] blockquote { padding:20px 8%; text-align:center; color:#003849; font-size:14px; line-height:20px; background:#f4f4f4; border:0; border-radius:4px; -moz-border-radius:4px; }
[data-zc-quote] blockquote span { width:19px; height:16px; display:inline-block; background:url('../img/bg-sprite-24.png') no-repeat 0 0; }
[data-zc-quote] [data-zc-quote-start] { margin-right:10px; background-position:-150px -107px; }
[data-zc-quote] [data-zc-quote-end] { margin-left:10px; background-position:-180px -107px; }
[data-zc-quote] p { margin:0 !important; padding-top:15px; padding-left:71px; min-height:33px; color:#7ca82b; font-size:13px; line-height:17px; background:url('../img/bg-sprite-24.png') no-repeat 0 -573px; }

/* COMPONENTS -- Calendar List */
.list-calendar { margin-left:0; }
.list-calendar li { position:relative; list-style:none; margin-bottom:8px; }
.list-calendar a { padding:4px 0 16px 66px; min-height:50px; display:block; line-height:21px; }
.list-calendar a[data-zc-single] { padding-top:13px; padding-bottom:17px; }
.list-calendar strong { position:absolute; top:0; left:0; margin:0 0 10px; width:50px; list-style:none; }
.list-calendar span { padding:2px 0 3px; display:block; text-align:center; text-transform:uppercase; color:#fff; font-size:12px; line-height:13px; background:#cc3300; border-radius:3px 3px 0 0; -moz-border-radius:3px 3px 0 0; }
.list-calendar em { padding:3px 0 4px; display:block; text-align:center; font-style:normal; font-weight:bold; color:#003849; font-size:22px; line-height:25px; background:#fff; border-radius:0 0 3px 3px; -moz-border-radius:0 0 3px 3px; }

/* COMPONENTS -- Tabs */
[data-zc-tabs] { width:100%; margin:0px; content:""; display:table; clear:both; }
[data-zc-tabs~="top"] { border-top:5px solid #7CA82B; }
[data-zc-tabs~="bottom"] { border-bottom:5px solid #7CA82B; }
[data-zc-tabs] li { float:left; line-height:48px; border:1px solid #d9d9d9; min-width:118px; text-align:center; margin:0px 5px 0px 0px; cursor:pointer; color:#5d7e89; -webkit-transition:all 0.15s ease-in-out; transition:all 0.15s ease-in-out; }
[data-zc-tabs] li.active { background-color:#7CA82B; border-color:#7CA82B; color:#FFF; }
[data-zc-tabs] li.active a { color: #FFF; }
[data-zc-tabs~="top"] li { border-top:0px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; }
[data-zc-tabs~="bottom"] li { border-bottom:0px; border-top-left-radius:4px; border-top-right-radius:4px; }

/* COMPONENTS -- Ordered List Big Ass Numbers */
ol[data-zc-list] { counter-reset:list; }
ol[data-zc-list]>li { list-style:none; position:relative; }
ol[data-zc-list]>li:before { counter-increment:list; content:counter(list); position:absolute; top:0px; left:0px; font-size:28px; line-height:60px; text-align:center; font-weight:bold; height:60px; width:60px; border-radius:50%; }
ol[data-zc-list~="green"]>li:before { background-color:#7CA82B; color:#FFF; }
ol[data-zc-list~="green"]>li { padding-left:80px; }

/* COMPONENTS -- Search Results */
.search-result { padding:40px 0px; border-bottom:1px solid #ECECEC; }
.search-result span { display:block; }

/* COMPONENTS -- Chart Type Buttons */
[data-zc-chart-type] { border:1px solid #D9D9D9; border-radius:4px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); padding:4px; float:left; margin:0px 0px 15px; cursor:pointer; background-color:#FFF; }
[data-zc-chart-type].active { background-color:#F4F4F4; }
[data-zc-chart-type] [data-zc-chart-type-icon] { float:left; }
[data-zc-chart-type] a, [data-zc-chart-type] .a { float:left; padding-left:8px; line-height:40px; }
[data-zc-chart-type] .count { float:right; padding-right:6px; line-height:40px; color:#D9D9D9; }
[data-zc-chart-type]:hover {transform: translate(-2px,-2px);box-shadow: 2px 2px 5px #d9d9d9;}
/* COMPONENTS -- Chart Type Icons */
[data-zc-chart-type-icon] { width:40px; height:40px; display:inline-block; background-repeat:no-repeat; }
.webp [data-zc-chart-type-icon] { background-image:url("../img/zingchart-sprite.webp"); }
.no-webp [data-zc-chart-type-icon] { background-image:url("../img/zingchart-sprite.png"); }
[data-zc-chart-type-icon="bar"] { background-position:0px -420px; }
[data-zc-chart-type-icon="scatter"] { background-position:0px -460px; }
[data-zc-chart-type-icon="heatmap"] { background-position:0px -500px; }
[data-zc-chart-type-icon="mixed"] { background-position:0px -540px; }
[data-zc-chart-type-icon="pop-pyramid"] { background-position:0px -580px; }
[data-zc-chart-type-icon="line"] { background-position:0px -620px; }
[data-zc-chart-type-icon="stock"] { background-position:0px -660px; }
[data-zc-chart-type-icon="wordcloud"] { background-position:0px -700px; }
[data-zc-chart-type-icon="treemap"] { background-position:0px -740px; }
[data-zc-chart-type-icon="spline"] { background-position:0px -780px; }
[data-zc-chart-type-icon="pareto"] { background-position:0px -820px; }
[data-zc-chart-type-icon="sparkline"] { background-position:0px -860px; }
[data-zc-chart-type-icon="maps"] { background-position:0px -900px; }
[data-zc-chart-type-icon="calendar"] { background-position:0px -940px; }
[data-zc-chart-type-icon="pie"] { background-position:0px -980px; }
[data-zc-chart-type-icon="bullet"] { background-position:0px -1020px; }
[data-zc-chart-type-icon="venn"] { background-position:0px -1060px; }
[data-zc-chart-type-icon="net-diagram"] { background-position:0px -1100px; }
[data-zc-chart-type-icon="ring"] { background-position:0px -1140px; }
[data-zc-chart-type-icon="area"] { background-position:0px -1180px; }
[data-zc-chart-type-icon="funnel"] { background-position:0px -1220px; }
[data-zc-chart-type-icon="rankflow"] { background-position:0px -1260px; }
[data-zc-chart-type-icon="grid"] { background-position:0px -1300px; }
[data-zc-chart-type-icon="radar"] { background-position:0px -1340px; }
[data-zc-chart-type-icon="chord"] { background-position:0px -1380px; }
[data-zc-chart-type-icon="gauge"] { background-position:0px -1420px; }
[data-zc-chart-type-icon="boxplot"] { background-position:0px -1460px; }
[data-zc-chart-type-icon="bubble"] { background-position:0px -1500px; }
[data-zc-chart-type-icon="waterfall"] { background-position:0px -1540px; }
[data-zc-chart-type-icon="stepped"] { background-position:0px -1580px; }
[data-zc-chart-type-icon="rose"] { background-position:0px -1620px; }
[data-zc-chart-type-icon="stacked"] { background-position:0px -1660px; }
[data-zc-chart-type-icon="staggered"] { background-position:0px -1700px; }
[data-zc-chart-type-icon="cone"] { background-position:0px -1740px; }
[data-zc-chart-type-icon="jumped"] { background-position:0px -1780px; }
[data-zc-chart-type-icon="horizontal"] { background-position:0px -1820px; }
[data-zc-chart-type-icon="100%-stacked"] { background-position:0px -1860px; }
[data-zc-chart-type-icon="histogram"] { background-position:0px -1900px; }
[data-zc-chart-type-icon="vertical"] { background-position:0px -1940px; }
[data-zc-chart-type-icon="3d-bar"] { background-position:0px -1980px; }
[data-zc-chart-type-icon="3d-ring"] { background-position:0px -2020px; }
[data-zc-chart-type-icon="3d-cylinder"] { background-position:0px -2060px; }
[data-zc-chart-type-icon="3d-pie"] { background-position:0px -2100px; }
[data-zc-chart-type-icon="3d-cone"] { background-position:0px -2140px; }
[data-zc-chart-type-icon="3d-line"] { background-position:0px -2180px; }
[data-zc-chart-type-icon="3d-spline"] { background-position:0px -2220px; }
[data-zc-chart-type-icon="3d-pyramid"] { background-position:0px -2260px; }
[data-zc-chart-type-icon="3d-area"] { background-position:0px -2300px; }
[data-zc-chart-type-icon="bubble-pie"] { background-position:0px -2340px; }

/* COMPONENTS -- Form for Features Page */
[data-zc-form="features"] p + .clearfix { padding-top:10px; }
[data-zc-form="features"] .wide-button { margin-bottom:40px; }
[data-zc-form="features"] .label-wrapper { margin:0 auto 20px; }
[data-zc-form="features"] .label-wrapper.last { margin-bottom:30px; }
[data-zc-form="features"] .label-wrapper label { text-align:left; margin-bottom:10px; }
[data-zc-form="features"] .label-wrapper input { width:100%; }

/* COMPONENTS -- Pseudo-iframe */
.pseudo-iframe-container { position:relative; width:100%; margin-bottom:1px; }
.pseudo-iframe-container iframe { display:block; }
.pseudo-iframe { height:430px; font-family:'Helvetica Neue','Helvetica','Avenir','Open Sans',sans-serif; font-weight:normal; background:#FFF; }
.pseudo-iframe #commands { float:left; }
.pseudo-iframe #actions { float:right; }
.pseudo-iframe #top { position:relative; top:0px; -webkit-font-smoothing:auto; white-space:nowrap; width:100%; height:31px; min-width:330px; border-bottom:1px solid #c1c1c1; }
.pseudo-iframe #top.blue { background-color:#29A2CC; color:white; }
.pseudo-iframe #content { overflow:hidden; height:100%; width:100%; }
.pseudo-iframe .btn { position:relative; float:left; min-width:70px; max-width:70px; height:30px; line-height:30px; text-align:center; font-size:12.8px; cursor:pointer; }
.pseudo-iframe .icon { min-width:30px; }
.pseudo-iframe .icon:last-child { margin-right:10px; }
.pseudo-iframe .btn.active::after{ top:100%; left:50%; border:solid transparent; content:" "; height:0; width:0; position:absolute; pointer-events:none; border-width:10px; margin-left:-10px; }
.pseudo-iframe #top.blue .btn.active{ background-color:#003849; }
.pseudo-iframe #top.blue .btn.active:after{ border-top-color:#003849; }
.pseudo-iframe .sprite { margin:5px; background-repeat:no-repeat; height:20px; background-image:url('//app.zingsoft.com/assets/sprite.png'); }
iframe.loading + .pseudo-iframe { position:absolute; top:0px; width:100%; }
iframe.rendered + .pseudo-iframe { display:none; }
.pseudo-iframe__loading {
    background: rgba(255, 255, 255, 0.8);
    height: 100%;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transition: 0.2s opacity;
    width: 100%;
    z-index: 200;
}
.pseudo-iframe__loading--active {
    opacity: 1;
    pointer-events: auto;
}
.pseudo-iframe__loading-message {
    color: #333;
    font-size: 24px;
    font-weight: bold;
    left: 50%;
    position: absolute;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    top: 50%;
    transform: translate(-50%, -50%);
}

/* COMPONENTS -- No Style */
[data-zc-nostyle] { display:none !important; }

/* COMPONENTS -- Notify */
.notify { position:fixed; top:80px; left:0px; width:100%; background-color:#EF8535; overflow:hidden; -webkit-transform:translateY(-50px); transform:translateY(-50px); -webkit-transition:all 0.15s ease-in-out; transition:all 0.15s ease-in-out; z-index:100; }
.notify.show{ -webkit-transform:translateY(0px); transform:translateY(0px); box-shadow:rgba(0,0,0,0.2) 0px 2px 4px; }
.docs .notify.show { -webkit-transform:translateY(50px); transform:translateY(50px); }
.notify--content { position:relative; }
#notify-text { text-align:center; line-height:50px; color:#FFF; }
#notify-text a { color:#FFF; text-decoration:underline; }
#notify-close { position:absolute; top:16px; right:10px; color:#FFF; background:none; border:none; font-size:inherit; }

/* COMPONENTS -- Pills */
[data-zc-pill] { color:#FFF; border-radius:8px; padding:2px 12px; color:#FFF; }
[data-zc-pill="numeric"] { background-color:#D31E1E; }
[data-zc-pill="mixed"] { background-color:#29A2CC; }
[data-zc-pill="string"] { background-color:#7CA82B; }
[data-zc-pill="array"] { background-color:#EF8535; }
[data-zc-pill="object"] { background-color:#A14BC9; }
[data-zc-pill="boolean"] { background-color:#A05F18; }

/* COMPONENTS -- Notes */
.note {
    background: #F6F9F1;
    border-color: #7CA82B;
    border: 1px solid #7CA82B;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    color: #7CA82B;
    margin-bottom: 18px;
    padding: 8px 12px;
}
.note > * {
    margin-bottom: 0;
}
.note * {
    color: #7CA82B !important; /* This hurts me but it works */
}
.note--tip {        
    background: rgba(239, 133, 53, 0.1);
    color: #ef8535;
    border: 1px solid #EF8535;
}
.note--tip * {
    color: #EF8535 !important; /* This hurts me but it works */
}
.note--warning {
    background: #F5D6CC;
    border-color: #C30;
    color: #C30;
}
.note--warning * {
    color: #C30 !important; /* This hurts me but it works */
}

/* @end group COMPONENTS */

/* @group SEARCH */
/* ---------------------------------------------- */
.site-search {
    position:relative;
    width:100%;
}

.site-search__label {
    background:#F0F0F0;
    border:1px solid #D9D9D9;
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
    height:40px;
    left:0px;
    line-height:40px;
    position:absolute;
    text-align:center;
    width:40px;
}

#header-search__query,
#docs-search__query {
    border-radius:4px;
    height:40px;
    padding:12px 12px 12px 50px;
    width: 100%;
}

.site-search__query { width:100%; border-radius:0; }
.site-search__query:focus { box-shadow:none; outline:none; }
#spacer { height:0px; }
.results { background:#FFF; border:1px solid #D9D9D9; border-bottom-right-radius:4px; border-bottom-left-radius:4px; box-shadow:rgba(0,0,0,0.1) 0 4px 8px; position:relative; top:-1px; z-index:500; }
.result { display:block; padding:12px; }
.result.highlight { background:rgba(0,0,0,0.03); }
.result em { font-style:normal; font-weight:bold; }

.docs .site-search {
    margin-bottom:40px;
}

.algolia-autocomplete {
  width: 100%;
}
.algolia-autocomplete .aa-input, .algolia-autocomplete .aa-hint {
  width: 100%;
}
.algolia-autocomplete .aa-hint {
  color: #999;
}
.algolia-autocomplete .aa-dropdown-menu {
  width: 100%;
  background-color: #fff;
  border: 1px solid #D9D9D9;
  border-top: none;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion {
  color:#505050;
  cursor: pointer;
  padding: 5px 4px;
  border-bottom:1px solid #D9D9D9;
  position:relative;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion.aa-cursor {
  background-color: rgba(0,186,240,0.1);
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion em {
  color:#505050;
  font-weight: bold;
  font-style: normal;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion small {
  color:#999;
  display:block;
  padding-right:50px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap !important;
  width:100%;
}
#new-search {
    opacity:0;
    background: #EF8535;
    color: #FFF;
    padding: 12px;
    text-align: center;
    border-radius: 4px;
    font-size: 18px;
    font-weight: bold;
    position: absolute;
    width: 100%;
    top: 50px;
    right: 0px;
    box-shadow: rgba(0,0,0,0.1) 0 4px 4px;
    -webkit-transition:0.1s opacity linear;
    transition:0.1s opacity linear;
}
#new-search:after {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(239, 133, 53, 0);
    border-bottom-color: #EF8535;
    border-width: 10px;
    margin-left: -10px;
}
#new-search.active {
    opacity:1;
}
#none {
    color:#505050;
    line-height:24px;
    text-align:center;
}
/* @end group SEARCH */

/* @group CONTENT */
/* ---------------------------------------------- */
code {
    background-color: #F7F7F7;
    border: 1px solid #D9D9D9;
    border-radius: 2px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    font-family: 'Consolas', 'Courier', monospace;
    color: #505050;
    font-size: 90%;
    font-weight: bold;
    padding: 2px 4px;
    white-space: nowrap;
}
.prettyprint code {
    background-color: initial;
    border: none;
    box-shadow: none;
    font-size: 100%;
    padding: 0;
}

i.highlight { font-style:normal; background-color:rgba(0,186,240,0.2); }
.centered { text-align:center; }
.centered ol, ol.centered { list-style-position:inside; }
.no-bottom { margin-bottom:0px; }
.clearfix:after { content:""; display:table; clear:both; }
[data-zc-left] { float:left; }
[data-zc-right] { float:right; }
.bold { font-weight:bold; }
.white { color:#FFF; }
.cyan { color:#00baf0; }
.green { color:#7CA82B; }
.paragraph-bottom { margin-bottom:18px; }
.section-bottom { margin-bottom:40px; }
.space-after { display:inline-block; margin-bottom:60px; }

a.anchor,
a.waypoint {
    display:inline-block;
    margin-top:-130px;
    padding-top:130px;
}

.mono { font-style:normal; font-family:monospace; }
[data-zc-button]~pre { margin-top:18px; }
.desktop-hide { display:none; }
/* @end group CONTENT */

/* @group PRETTYPRINT */
.prettyprint {
    font-size: 14px;
    word-wrap: break-word;
    white-space: pre-wrap;
    margin-bottom: 18px;
    line-height: 18px;
    position: relative;
}
.prettyprint .clipboard-button {
    background: #00baf0;
    border: none;
    border-radius: 4px;
    color: white;
    font-size: 14px;
    padding: 4px 8px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 10px;
    top: 10px;
    transition: 0.2s opacity, 0.2s background;
}
.prettyprint .clipboard-button__message {
    color: white !important;
}
.prettyprint:hover .clipboard-button {
    opacity: 1;
    pointer-events: auto;
}
.clipboard-button:hover {
    background: #00CBF3;
}

.com { color: #93a1a1; }
.lit { color: #195f91; }
.pun, .opn, .clo { color: #93a1a1; }
.fun { color: #dc322f; }
.str, .atv { color: #D14; }
.kwd, .linenums .tag { color: #1e347b; }
.typ, .atn, .dec, .var { color: teal; }
.pln { color: #48484c; }

.prettyprint { padding:8px; background-color:#f7f7f9; border:1px solid #e1e1e8;  }
.prettyprint.linenums {
  box-shadow:inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
}

/* Specify class=linenums on a pre to get line numbering */
ol.linenums { margin:0 0 0 33px; /* IE indents via margin-left */ } 
ol.linenums li { padding-left:12px; color:#bebec5; line-height:18px; }
/* @end group PRETTYPRINT */

/* @group PAGES */
/* ---------------------------------------------- */

    /* @group HOMEPAGE */
    /* ---------------------------------------------- */
    .homepage-h1 { font-size: 48px; line-height:1; margin-bottom:22px; /*override default h1 margin of 32px*/ } 
    /*.homepage-h2 { margin-bottom:24px; } */
    .homepage-h1-white { font-family: 'Roboto','Avenir','Open Sans',sans-serif; font-weight: normal !important; font-size: 2.1rem; line-height: 1; margin:10px;}
    .homepage-h2-white { font-family: 'Roboto','Avenir','Open Sans',sans-serif; font-weight: normal !important; font-size: 1.5rem; line-height: 1; }
    .homepage-cta-button { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) }
    .homepage-h2-gray { font-family: 'Roboto','Avenir','Open Sans',sans-serif; color: #424242; font-size: 2rem; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); margin: 0 0 32px; line-height: 1; text-align:center; }
    .homepage-link { letter-spacing: 1px; text-transform: uppercase; text-decoration: none !important; }
    .chart-toggle {
        height: 480px;
        margin-bottom: 18px;
    }    
    .homepage-chart-controls {
        margin: 0;
        height: 100%;
    }
    .homepage-chart-controls label {
        margin: 0;
    }
    .homepage-chart-controls [name="homepage-chart-toggle"] {
        display: none;
    }
    .homepage-chart-controls input[type="radio"] + label {
        background: #FFF;
        border: 1px solid #E1E1E8;
        border-radius: 6px;
        box-shadow: rgba(0, 0, 0, 0.1) -1px 1px 2px;
        font-size: 14px;
        font-weight: normal;
        margin-bottom: 5px;
        padding: 8px 10px;
        display:inline-block;
    }
    .homepage-chart-controls input[type="radio"]:checked + label {
        background: #64d3ff;
        border-color: #00baf0;
        color: #FFF;
    }
    .mobile-chart-switcher {
        display: none;
    }
    .editor {
        background: #FFF;
        border: 1px solid #D9D9D9;
    }
    .editor pre {
        background: none;
        border: none;
        height: 100%;
        overflow-y: scroll;
    }
    .arrow-container {
        height: 100%;
        position: relative;
    }
    #arrow {
        border-left: 30px solid #e1e1e8;
        border-top: 30px solid transparent;
        border-bottom: 30px solid transparent;
        position: absolute;
        top: 210px;
        z-index: 200;
    }
    #arrow:after {
        content: '';
        position: absolute;
        border-left: 30px solid #FFF;
        border-top: 30px solid transparent;
        border-bottom: 30px solid transparent;
        top: -30px;
        left: -31px;
        z-index: -1;
    }
    #homepage-chart-ctas {
        font-size: 18px;
        line-height: 24px;
    }
    #toggle-chart {
        border: 1px solid #D9D9D9;
    } 

    /* Chart Editor Section */
    .prettyprint .chart-editor {        
        animation-direction: alternate;
        animation-duration: 1.5s;
        animation-iteration-count: infinite;
        animation-name: highlightEditableFields;
        animation-timing-function: linear;
        /*background: rgba(255, 235, 59, 0.3);*/
        border-bottom: 1px dotted rgb(255, 193, 7);
        color: #06E;
        cursor: pointer;
        position: relative;
    }
    .chart-editor:hover {
        border-color: #03C;
        color: #09F;
    }
    .chart-editor__input {
        border: none;
        display: none;
        font-family: inherit;
        font-size: inherit;
        font-weight: inherit;
        margin: 0;
        padding: 0;
    }
    input.chart-editor__input {
        border: none;
        height: auto;
        height: initial;
        padding: 0;
    }
    select.chart-editor__input {
        width: auto;
        width: initial;
    }
    .chart-editor__input.short {
        padding: 0 5px;
    }
    .chart-editor__input:focus {
        border: none;
        box-shadow: none;
        outline: none;
    }
    .chart-editor__content {
        display: inline;
        display: initial;
    }
    .chart-editor__content span {
        color: #06E;
    }
    .chart-editor__tooltip {
        background: #FFF;
        border: 1px solid #D9D9D9;
        border-radius: 4px;
        box-shadow: rgba(0, 0, 0, 0.2) 0 2px 4px;
        display: none;
        padding: 2px 6px;
        position: absolute;
        top: -7px;
    }
    .chart-editor__tooltip:before {
        background: #D9D9D9;
        content: '';
        height: 8px;
        left: -5px;
        position: absolute;
        top: 8px;
        transform: rotate(45deg);
        width: 8px;
    }
    .chart-editor__tooltip:after {
        background: #FFFFFF;
        content: '';
        height: 8px;
        left: -3px;
        position: absolute;
        top: 8px;
        transform: rotate(45deg);
        width: 8px;
    }
    .chart-editor [type='range'],
    .chart-editor [type='color'] {
        background: none;
        height: 13px;
    }
    .chart-editor select {
        background: none;
        line-height: inherit;
        -webkit-appearance: menulist;
        -moz-appearance: menulist;
        -ms-appearance: menulist;
    }
    .chart-editor.active .chart-editor__input {
        display: inline;
        display: initial;
    }
    .chart-editor.active .chart-editor__tooltip {
        display: initial;
    }
    .chart-editor.active .chart-editor__content {
        display: none;
    }
    .js-lesson-export-trigger {
      position:absolute;
      top:5px;
      left: 355px;
    }   

    /* Blog post section */
    .blog-item {
        position: relative;
    }
    .blog-image {
        background-position: 50% 0;
        background-repeat: no-repeat;        
        background-size: cover;
        border: 1px solid #EEE;
        border-radius: 50%;
        box-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px;
        display: block;
        height: 50px;
        position: absolute;
        width: 50px;
    }
    .blog-title {
        margin-left: 60px;
    }   

    .boilerplate-wrapper {
        display:flex;
        flex-wrap:wrap;
        justify-content:space-around;
    }
    [data-boilerplate] {
        margin-bottom:18px;
        min-width:87px;
        padding-top:60px;
        position:relative;
        text-align:center;
    }
    [data-boilerplate]:before {
        background:url('../img/integration_icons.png');
        background-color:#FFF;
        background-repeat:no-repeat;
        border:2px solid;
        border-radius:50%;
        box-shadow:rgba(0,0,0,0.1) 0 1px 2px;
        content: '';
        font-size:0;
        height:50px;
        left:16.6667px;
        position:absolute;
        top:0;
        transform:scale(1.0);
        transition:transform 0.1s cubic-bezier(0, 0, 0.3, 1.0), box-shadow 0.1s cubic-bezier(0, 0, 0.3, 1.0);
        width:50px;
    }
    [data-boilerplate]:hover:before {
        cursor:pointer;
        transform:scale(1.2);
        box-shadow:rgba(0,0,0,0.3) 0 2px 4px;
    }
    [data-boilerplate="node"]:before {
        background-position:0px 0px;
        background-color:rgba(138,202,65,0.6);
        border-color:rgb(138,202,65);
    }
    [data-boilerplate="mysql"]:before {
        background-position:0px -50px;
        background-color:rgba(255, 255, 255, 1.0);
        border-color:rgb(233, 123, 0);
    }
    [data-boilerplate="mongo"]:before {
        background-position:0px -100px;
        background-color:rgb(52, 53, 55);
        border-color:rgb(125, 202, 80);
    }
    [data-boilerplate="couch"]:before {
        background-position:0px -150px;
        background-color:#EEE;
        border-color:#F00;
    }
    [data-boilerplate="php"]:before {
        background-position:0px -200px;
        background-color:rgb(96, 130, 187);
        border-color:rgb(16, 50, 97);
    }
    [data-boilerplate=".net"]:before {
        background-position:0px -250px;
        background-color:rgba(0,123,189,0.2);
        border-color:rgb(0, 102, 166);
    }
    [data-boilerplate="firebase"]:before {
        background-position:0px -300px;
        background-color:rgba(255,205,0,0.2);
        border-color:rgb(253, 198, 43);
    }
    [data-boilerplate="ruby"]:before {
        background-position:0px -350px;
        background-color:rgba(177, 17, 0, 0.6);
        border-color:rgb(177, 17, 0);
    }
    [data-boilerplate="rails"]:before {
        background-position:0 -400px;
        background-color:rgba(255,0,0,0.3);
        border-color:rgb(255, 0, 0);
    }
    [data-boilerplate="jsp"]:before {
        background-position:0px -450px;
        background-color:rgba(0,0,0,0.3);
        border-color:rgb(50, 50, 50);
    }
    [data-boilerplate="django"]:before {
        background-position:0px -500px;
        background-color:rgb(7, 46, 32);
        border-color:rgb(57, 96, 82);
    }
    
    /* Wrappers Tabs */
    .wrappers {
        border: 1px solid #D9D9D9;
        box-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px;
        margin-bottom: 30px;
    }
    .wrapper-controls {
        display: flex;
        margin-bottom: 10px;
    }
    .wrapper-controls input {
        display: none;
    }
    .wrapper-controls label {
        align-items: center;
        background-color: #FFFFFF;      
        border-bottom: 1px solid #D9D9D9;
        display: flex;
        flex: 1;
        height: 50px;
        justify-content: center;
        position: relative;
        text-align: center;
    }
    .wrapper-controls .wrapper-icon {
        /*background-image: url('../img/wrapper-icons-v2.png');*/
        background-repeat: no-repeat;
        background-position: 100% 0;
        background-size: cover;
        height: 30px;
        margin-right: 10px;
        width: 30px;
    }
    .webp .wrapper-controls .wrapper-icon {
        background-image: url('../img/wrapper-icons-v2.webp');
    }
    .no-webp .wrapper-controls .wrapper-icon {
        background-image: url('../img/wrapper-icons-v2.png');
    }
    .wrapper-controls label:after {
        bottom: 0;
        content: '';
        left: 0;
        position: absolute;
        width: 100%;
    }
    .wrapper-controls input:checked + label {
        background: #FFF;        
    }
    .wrapper-controls input:checked + label:after {
        bottom: 0;
        content: '';
        height: 2px;
        left: 0;
        position: absolute;
        width: 100%;
    }
    .wrapper-content {
        background: #FFFFFF;
        display: none;
        opacity: 0.3;
        padding: 10px 10px 20px;
        pointer-events: none;
        transform: translateY(-10px);
        width: 100%;
    }
    .wrapper-content.active {
        display: block;
        opacity: 1;
        pointer-events: auto;
        transform: none;
        transition: 0.3s opacity cubic-bezier(0.4, 0, 0.6, 1.0), 0.3s transform cubic-bezier(0.4, 0, 0.6, 1.0);
    }
    label[for="js"] .wrapper-icon {
        background-position: 100% -180px;
    }
    label[for="angularjs"] .wrapper-icon {
        background-position: 100% 0;
    }
    
    label[for="php"] .wrapper-icon {
        background-position: 100% -30px;
    }
    
    label[for="jquery"] .wrapper-icon {
        background-position: 100% -61px;
    }
    
    label[for="react"] .wrapper-icon {
        background-position: 100% -90px;
    }
    
    label[for="ember"] .wrapper-icon {
        background-position: 100% -120px;
    }
    
    label[for="backbone"] .wrapper-icon {
        background-position: 100% -150px;
    }
    #js:checked + label:after {
        background-color: rgb(240, 219, 79);
    }
    #angularjs:checked + label:after {
        background-color: rgb(224, 22, 0);
    }    
    #php:checked + label:after {
        background-color: rgb(95, 129, 189);
    }       
    #jquery:checked + label:after {
        background-color: rgb(0, 103, 175);
    }        
    #react:checked + label:after {
        background-color: rgb(90, 218, 253);
    }        
    #ember:checked + label:after {
        background-color: rgb(230, 101, 76);
    }       
    #backbone:checked + label:after {
        background-color: rgb(0, 111, 183);
    }

    /* Carousel ---------- */
    .demo-wrapper {
        height: 350px;
        position: relative;
    }
    .demo-scroll-wrapper {
        overflow-x: scroll;
    }
    .demo-scroll {
        white-space: nowrap;
    }
    .carousel-demo {
        display: inline-block;
        height: 345px;
        margin: 0;
        width: 500px;
    }
    .carousel-demo img {
        cursor: pointer;
        height: 100%;
        width: 100%;
    }
    .scroll-left,
    .scroll-right {
        background: #FFF;
        border: 1px solid #D9D9D9;
        border-radius: 50%;
        box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px;
        color: #DDD;
        font-size: 48px;
        padding: 0;
        position: absolute;
        top: 45%;
        transform: scale(1.0);
        transition: 0.2s transform cubic-bezier(0, 0, 0.2, 1.0);
    }
    .scroll-left {
        left: 5%;
    }
    .scroll-right {
        right: 5%;
    }
    .scroll-left:hover,
    .scroll-right:hover {
        transform: scale(1.6);
    }

    /* Cards ---------- */
    .card {
        background: #FFF;
        border: 1px solid #D9D9D9;
        border-radius: 4px;
        box-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px;
        padding: 10px;
    }
    .row > .col > .card { height:100%; }
    .item-list li {
        margin-bottom: 0;
    }
    .item-list li:nth-of-type(n+2) {
        margin-top: 18px;
    }
    .item-list strong {
        color: inherit;
    }

    /* Old Homepage ------ */
    #banner [data-zc-inner] { padding:40px 0px; }
    #banner-wrapper { height:510px; overflow:hidden; position:relative; padding-top:40px; }
    #banner-wrapper.rendered { padding-top:0px; }
    #banner-wrapper h1 { font-weight:normal; margin-bottom:18px;}
    /* FIRST CHART */
    #banner-chart { -webkit-transition:-webkit-transform 0.3s ease-in-out; transition:-webkit-transform 0.3s ease-in-out; transition:transform 0.3s ease-in-out; transition:transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } 
    #banner-chart.hide { -webkit-transform:translateY(430px) scaleY(0); transform:translateY(430px) scaleY(0); }
    /* ALL SUBSEQUENT CHART */
    #bannerChart { height:300px; margin:10px 0px; }
    #chartContainer { margin-bottom:18px; opacity:1.0; -webkit-transition:0.125s opacity ease-in-out; transition:0.125s opacity ease-in-out; }
    #chartContainer.rendering { opacity:0; }
    .resize-area #bannerChart { margin:0; }
    button[data-zc-icon].active:after { content:''; position:absolute; bottom:126%; left:33%; margin-left:8px; width:0; height:0; pointer-events:none; border:solid transparent; border-bottom-color:#00baf0; border-width:15px; }
    /* BANNER ACTIONS */
    [data-zc-banner] [data-zc-inline] { position:relative; }
    [data-zc-banner] [data-zc-inline="center"] { text-align:center; }
    [data-zc-banner] [data-zc-inline] > * { margin-right:20px; margin-left:20px; display:inline-block; vertical-align:top; }
    [data-zc-banner="label"] { padding:11px 0; display:inline-block; font-size:20px; }
    /* TYPED TOOLS */
    #toolName { color:#FFF; font-weight:normal; }
    .typed-cursor { color:#FFF; font-size:inherit; line-height:inherit; opacity:1; -webkit-animation:blink 0.7s infinite; animation:blink 0.7s infinite; }
    [data-zc-inner~="controls"] [data-zc-row] { left:0px; }
    /* DOTS */
    #dot-actions p[data-zc-left] { width:calc(100% - 80px); margin-left:20px; margin-top:6px; }
    
    /* @end group HOMEPAGE */

    /* @group GALLERY */
    /* ---------------------------------------------- */
    .gallery .chart-selector { list-style-type:none; margin:0px; }
    .gallery .chart-selector li { float:left; width:200px; margin-right:40px; }
    .gallery .chart-selector label { float:left; }
    .gallery h2 { line-height:40px; }
    .gallery h2 [data-zc-chart-type-icon] { float:left; margin-right:10px; }
    .gallery .chart-icon { min-height:191px; }
    [data-zc-gallery-new="header"] { float:left; width:100%; height:70px; border-bottom:1px solid #d9d9d9; margin:35px 0px 40px; }
    [data-zc-gallery-new="title"] { float:left; width:50%; text-align:left; }
    [data-zc-gallery-new~="controls"] { float:right; width:50%; text-align:right; }
    [data-zc-gallery-new~="sub"] { float:none; clear:both; text-align:center; width:100%; }
    [data-zc-gallery-type] { display:block; }
    [data-zc-gallery-type].hide { display:none; }
    [data-zc-gallery="chart-wrapper"] { padding:10px; border:1px solid #d9d9d9; border-radius:4px; background-color:#FFF; margin-bottom:40px; box-shadow: 0 2px 2px #d9d9d9; -webkit-transition:all 0.15s ease-in-out; transition:all 0.15s ease-in-out; }
    [data-zc-gallery="chart-wrapper"]:hover { -webkit-transform:scale(1.1); transform:scale(1.1); box-shadow:rgba(50,50,50,0.4) 0px 8px 12px; }
    /* @end group GALLERY */

    /* @group FEATURES */
    /* ---------------------------------------------- */
    /* FEATURES -- Search */
    .features #features-search { width:100%; height:50px; border:1px solid #d9d9d9; border-radius:4px; margin-bottom:30px; }
    .features #features-search input { width:80%; height:48px; float:left; padding: 12px 150px 12px 10px; border:none; border-radius:4px; }
    .features #features-search button { width:135px; float:right; padding:0px; border-left:1px solid #d9d9d9; }

    /* FEATURES -- Search Results */
    .features #features-search-results { display:none; }
    .features #result-list { opacity:1.0; -webkit-transition:opacity 0.2s ease-in-out; transition:opacity 0.2s ease-in-out; }
    .features #result-list.loading { opacity:0.1; }
    .features #result-counter { margin:20px 0px 0px; }
    .features #result-pagination { margin:40px 0px 0px; }
    .features [data-zc-pagination] { display:inline-block; list-style-type:none; text-align:center; color:#00baf0; }
    .features [data-zc-pagination*="disabled"] { color:#A7A7A7; }
    .features [data-zc-pagination*="number"] { width:25px; }
    .features [data-zc-pagination*="prev"] { padding-right:10px; }
    .features [data-zc-pagination*="next"] { padding-left:10px; }
    .features [data-zc-pagination*="active"] a { color:#7CA82B; cursor:default; }
    .features [data-zc-pagination]:not(:last-of-type) { border-right:1px solid #d9d9d9; }
    .features [data-zc-pagination] span { cursor:pointer; }
    .features [data-zc-pagination*="disabled"] span { cursor:default; }
    .features #end-search-results { position:relative; width: 960px; left:0px; margin:60px 0px 0px; border-top:1px solid #d9d9d9; }
    
    /* FEATURES -- Subnav */
    .features #features-subnav [data-zc-column] { height:60px; }
    .features #features-subnav button { font-size:18px; }

    /* FEATURES -- Subsections */
    .features [data-zc-left="image"] { margin-right:25px; }
    .features [data-zc-inline] { display:inline-block; }
    .features [data-zc-inline="copy"] { width:296px; }
    .features [data-zc-inline~="image"] { max-width:150px; max-height:150px; vertical-align:top; }

    /* FEATURES -- Feed Code */
    .features #feed-code { font-size:18px; line-height:12px; }
    .features #feed-code ol { counter-reset:item; list-style-type:none; }
    .features #feed-code li { color:#FFF; }
    .features #feed-code li:before { content:counter(item) " "; counter-increment:item; color:#000; opacity:0.4; }

    /* FEATURES -- Last Section */
    .features #last [data-zc-button] { margin-bottom:32px; }
    .features #last p, .features .last { margin-bottom:0px; }
    /* @end group FEATURES */

    /* @group FEATURES > INTERACTIVE CHARTS */
    /* ---------------------------------------------- */
    .features.interactive-javascript-charts .spacer { display:block; margin-bottom:33px; }
    /* @end group FEATURES > INTERACTIVE CHARTS */

    /* @group FEATURES > CHART DESIGN */
    /* ---------------------------------------------- */
    .features.chart-design-styling #beautifulChart { min-height:300px; }
    /* @end group FEATURES > CHART DESIGN */

    /* @group FEATURES > REAL TIME */
    /* ---------------------------------------------- */
    .features .real-time-chart-controls select { font-size:16px; width:156px; margin-right:8px; }
    .features #flow-controls button { border:none; color:#00baf0; background:none; font-size:18px; line-height:18px; -webkit-transition:color 0.15s ease-in-out; transition:color 0.15s ease-in-out; }
    .features #flow-controls button.active { color:#7CA82B; }
    /* @end group FEATURES > REAL TIME */

    /* @group DOCS */
    /* ---------------------------------------------- */
    /* Docs Search */
    .docs #docs-search-form input, .docs #docs-search-form button { box-shadow:rgba(0,0,0,0.1) 0 2px 4px; }
    .docs .prettyprint { font-size:14px; word-wrap:break-word; margin-bottom:18px; }
    .docs pre { white-space: pre-wrap; }
    .docs [data-zc-tabs] li { min-width: inherit; padding: 0 20px; }
    .docs [data-zc-tabs] li:not(.active) a { color: #5d7e89; }
    .docs [data-zc-tabs="bottom"] { margin-bottom: 15px; }
    .docs table, .docs ul.table { max-width: 100%; width: 100%; font-size: 12px; margin: 0 0 20px 0; display: table; }
    .docs thead, .docs h2.table-head { background-color:#7CA82B; color:white; font-size: 12px; margin: 0; }
    .docs .table-bordered { border: 1px solid #ddd; }
    .docs ul.table-bordered { border-width: 0; }
    .docs table.table-bordered { border-top-color: #7ba527; }
    .docs .table-striped > tbody > tr:nth-of-type(2n+1) { background-color: #f5f5f5; }
    .docs .table-condensed > thead > tr > th, .docs .table-condensed > tbody > tr > th, .docs .table-condensed > tfoot > tr > th, .docs .table-condensed.table-bordered .table-head { padding: 9px 10px 7px; border: 1px solid #a1bc71; }
    .docs .table-condensed > thead > tr > td, .docs .table-condensed > tbody > tr > td, .docs .table-condensed > tfoot > tr > td { padding: 9px 10px 5px; border: 1px solid #d9d9d9; }
    .docs table p { line-height:16px; margin-bottom:18px; }
    .docs table .attribute-values { font-weight: bold; }
    .docs table .centered { text-align: center; }
    .docs ul.table > li { display: table-cell; float: left; width: 33.334%; padding: 9px 10px 5px; border: 1px solid #d9d9d9; margin: 0; border-top: transparent; border-right: transparent; }
    .docs ul.table > li:nth-of-type(3n), .docs ul.table > li:last-of-type { border-right: 1px solid #d9d9d9; }
    .docs .well.pattern { margin-bottom: 1em; }
    .docs p strong { color:#505050; }
    .docs .json-header { margin-bottom:24px; }
    .docs .monospace { font-family:monospace; }
    .docs .monospace.h1 { float:left; margin:0px 10px 10px 0px; color:#505050; }
    .docs .monospace.h1+[data-zc-pill] { float:left; }
    .docs .accepts, .docs .other { clear:both; display:block; }
    .docs .other { font-family:monospace; }
    .docs .monospace.h1 a { display:inline-block; margin-left:-18px; padding-left:2px; font-size:18px; }
    .docs .monospace.h1 a .fa { visibility:hidden; }
    .docs .monospace.h1:hover a .fa { visibility:visible; }
    .docs .subnav-item input+label { line-height:24px; display:inline-block; padding-left:30px; position:relative; background:none; }
    .docs .subnav-item input+label:before { content:''; width:22px; height:22px; position:absolute; left:0px; background-repeat:no-repeat; background-position:0px -2400px; }
    .webp .docs .subnav-item input+label:before { background-image:url("../img/zingchart-sprite.webp"); }
    .no-webp .docs .subnav-item input+label:before { background-image:url("../img/zingchart-sprite.png"); }
    .docs .subnav-item input:checked+label:before { background-repeat:no-repeat; background-position:-40px -2400px; }
    .webp .docs .docs .subnav-item input:checked+label:before { background-image:url("../img/zingchart-sprite.webp"); }
    .no-webp .docs .docs .subnav-item input:checked+label:before { background-image:url("../img/zingchart-sprite.png"); }
    .docs .subnav-item span { font-weight:bold; padding-left:30px; }  
    .docs .subnav-item > a { font-size:18px; line-height:22px; font-weight:bold; }
    .docs .subnav-list { overflow:hidden; max-height:0px; }
    .docs .active .subnav-list { max-height:999px; border-top:1px solid #D9D9D9; margin-top:13px; padding:22px 5px 0px; }
    .docs button[data-src] { background:none; color:#003849; border:none; font-size:14px; font-weight:bold; }
    .docs button[data-src].active+iframe { border:1px solid #D9D9D9; }
    .docs [data-zc-docs="body"] { min-height:500px; }
    .json-attributes-syntax .demo-group { float:right; margin-left:15px; }
    .json-attributes-syntax .demo-group button { background-color:#00baf0; color:#FFF; border:none; border-radius:4px; padding:5px 10px; font-size:14px; font-weight:bold; margin-right:5px; }
    .json-attributes [data-url] { float:right; font-size:14px; padding:5px 10px; }
    .json-attributes [data-url]+iframe { margin-top:18px; }

    .scroll[data-zc-docs="main-nav"] { box-shadow: 0px -25px 10px -20px rgba(0, 0, 0, 0.1) inset; }
    .scroll[data-zc-docs*="nav"]::-webkit-scrollbar-track { background-color:#f4f4f4; border-radius:4px; }
    .scroll[data-zc-docs*="nav"]::-webkit-scrollbar-thumb { border-radius:4px; border:2px solid #f4f4f4; background-color:rgba(0, 0, 0, .3); }
    .scroll[data-zc-docs*="nav"]::-webkit-scrollbar:vertical { width:8px; }
    .scroll[data-zc-docs*="nav"]::-webkit-scrollbar { -webkit-appearance:none; }
    .scroll[data-zc-docs="sub-nav"] > ul { margin-right:0px; padding-right:10px; }

    .docs [data-zc-docs="main-nav"] a.active { color:#7CA82B; }
    .docs.json-attributes-syntax iframe { margin-bottom:18px; }
    [data-zc-docs="sub-nav"] ul { margin-bottom:0px; }
    [data-zc-docs="sub-nav"] li:last-child { margin-bottom:0px; }

    .demo-group {
        float: right;
        margin-left: 12px;
    }
    .demo-group .btn {
        color: white;
        background: #00baf0;        
        border: none;
        border-radius: 4px;
        font-size: 14px;
        font-weight: bold;
        padding: 4px 8px; 
    }
    .demo-group .btn + .btn {
        margin-left: 12px;
    }
    [data-loaded-demo] {
        display: none;
    }
    [data-loaded-demo].active {
        display: block;
    }

    /* Styling for button below top demo */
    .attention-row {
        text-align:center;
    }
    .attention-button {
        background: #00baf0;
        border-radius: 2rem;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.1);
        color: white;
        display: inline-block;
        font-family: 'Roboto','Helvetica Neue','Helvetica','Avenir','Open Sans',sans-serif;
        font-size: 1.2rem;
        font-weight: 300;
        line-height: 1;
        min-width: 300px;
        padding: 0.5rem 2rem;
        text-align: center;
        text-transform: uppercase;
    }
    .attention-button:hover {
        background: #29A2CC;
        color: white;
    }

    /* @end group DOCS */

    /* @group TOUR */
    /* ---------------------------------------------- */

    /* Hide the login on Landing Pages */
    .tour [data-zc-header] { top:0; }
    .tour [data-zc-login] { display:none; }
    .tour [data-zc-nav-group] { display:none; }
    .tour #tour-content { position:absolute; right:0px; top:42px; }
    /* @end group TOUR */

    /* @group ANGULARJS */
    /* ---------------------------------------------- */
    .angularjs-charts #iframe-controls { height:600px; display:-webkit-box; display:-ms-flexbox; display:flex; display:-webkit-flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-flex-direction:column; }
    .angularjs-charts [data-zc-target] { background-color:#b9babb; display:-webkit-box; display:-ms-flexbox; display:flex; display:-webkit-flex; -webkit-box-flex:1; -ms-flex-positive:1; flex-grow:1; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-flex-direction:column; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-justify-content:center; text-align:center; cursor:pointer; }
    .angularjs-charts [data-zc-target]:not(:last-of-type) { border-bottom:1px solid #FFF; }
    .angularjs-charts [data-zc-target] * { color:#FFF; } 
    .angularjs-charts [data-zc-target] p { max-height:0px; overflow:hidden; -webkit-transition:max-height 0.3s; transition:max-height 0.3s; }
    .angularjs-charts [data-zc-target].active { background-color:#939598; }
    .angularjs-charts [data-zc-target].active p { max-height:300px; -webkit-transition:max-height 1s; transition:max-height 1s; }
    .angularjs-charts .prettyprint { text-align:left; margin-right:20px; background-color:#FFF; }
    .angularjs-charts .centered li { font-size:24px; margin:20px; }
    /* @end group ANGULARJS */

    /* @group TRY PAGE */
    /* ---------------------------------------------- */
    .try #video { border:1px solid #D9D9D9; }
    .try #resource-toggle { border-bottom:5px solid #7CA82B; }
    .try #resource-toggle>[data-zc-column] { cursor:pointer; padding:15px 0px; border:1px solid #D9D9D9; border-bottom:0px; border-top-left-radius:4px; border-top-right-radius:4px; }
    .try #resource-toggle>[data-zc-column].active { background-color:#7CA82B; border:1px solid #7CA82B; }
    .try #resource-toggle>[data-zc-column].active h3 { color:#FFF; }
    .try .toggle-target { display:none; }
    .try .toggle-target.active { display:block; }
    /* @end group TRY PAGE */

/* @end group PAGES */

/* @group jQuery UI */
/*-- Layout helpers */
.ui-helper-hidden { display:none; }
.ui-helper-hidden-accessible { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }
.ui-helper-reset { margin:0; padding:0; border:0; outline:0; line-height:1.3; text-decoration:none; font-size:100%; list-style:none; }
.ui-helper-clearfix:before,
.ui-helper-clearfix:after { content:""; display:table; border-collapse:collapse; }
.ui-helper-clearfix:after { clear:both; }
.ui-helper-clearfix { min-height:0; }
.ui-helper-zfix { width:100%; height:100%; top:0; left:0; position:absolute; opacity:0; filter:Alpha(Opacity=0); }
.ui-front { z-index:100; }
/*-- Interaction Cues */
.ui-state-disabled { cursor:default !important; }
/*-- Icons */
.ui-icon { display:block; text-indent:-99999px; overflow:hidden; background-repeat:no-repeat; }
/*-- Misc visuals */
.ui-widget-overlay { position:fixed; top:0; left:0; width:100%; height:100%; }
.ui-autocomplete { position:absolute; top:0; left:0; cursor:default; }
.ui-menu { list-style:none; padding:2px; margin:0; display:block; outline:none; background:#fff; border:1px solid #ccc; font-size:95%; height:200px; overflow-y:scroll; text-align:left; }
.ui-menu .ui-menu { margin-top:-3px; position:absolute; }
.ui-menu .ui-menu-item { margin:0; padding:0; width:100%; list-style-image:url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); }
.ui-menu .ui-menu-item:hover{ background:#00baf0; }
.ui-menu .ui-menu-divider { margin:5px -2px 5px -2px; height:0; font-size:0; line-height:0; border-width:1px 0 0 0; }
.ui-menu .ui-menu-item a { text-decoration:none; display:block; padding:2px .4em; line-height:1.5; min-height:0; font-weight:normal; color:#505050; }
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active { font-weight:normal; color:#fff; background-color:#00baf0; }
.ui-menu .ui-state-disabled { font-weight:normal; margin:.4em 0 .2em; line-height:1.5; }
.ui-menu .ui-state-disabled a { cursor:default; }
/* icon support */
.ui-menu-icons { position:relative; }
.ui-menu-icons .ui-menu-item a { position:relative; padding-left:2em; }
/* left-aligned */
.ui-menu .ui-icon { position:absolute; top:.2em; left:.2em; }
/* right-aligned */
.ui-menu .ui-menu-icon { position:static; float:right; }

/* @end group jQuery UI */

/* @group ZC Viewsource/Bug Report */
[data-zc-data-points] [data-zc-select] { width:35%; }
.zc-viewsource textarea { padding:4px 6px; }
.zc-viewsource input { margin:0px 20px 0 0 !important; padding:4px 10px !important; width:auto; background-color:rgb(238, 238, 238) !important; border:2px outset rgb(204, 204, 204) !important; }

.zc-bugreport textarea { padding:4px 6px; height:40px !important; min-height:60px; }
.zc-bugreport input { margin:0px 20px 0 0 !important; padding:4px 10px !important; width:auto; background-color:rgb(238, 238, 238) !important; border:2px outset rgb(204, 204, 204) !important; }
.zc-bugreport #demo-chart-bugreport-email { width:96% !important; }

/* @end group ZC Viewsource/Bug Report */


/* @group Media Query ( Min:767px ) and (Max:980px) */
/* ------------------------------------------- */
@media (min-width:767px) and (max-width:980px) {
    [data-zc-row*="match-height"] .calculated img { position:relative; -webkit-transform:translateY(-50%); transform:translateY(-50%); top:50%; } 
}
/* @end group Media Query ( Min:767px ) and (Max:980px) */

/* @group Media Query ( Min:767px ) */
@media (min-width:768px) {
    
    /* @group Min:767px > Defaults */
    /* ------------------------------------------- */
    body { font-size:16px; line-height:24px; -webkit-font-smoothing:antialiased; }
    /* @end group Min:767px > Defaults */
    
    /* @group Min:767px > Header */
    /* ------------------------------------------- */
    [data-zc-logo] { transform:scale(1); -moz-transform:scale(1); -webkit-transform:scale(1); }
    [data-zc-header] { position:fixed; height:74px; }
    [data-zc-header] ul { position:absolute; }
    [data-zc-header] li { float:left; }
    
    #navSearch { width:100%; }
    #navSearch input { width:0px; padding:0px; -webkit-transition:width 0.15s ease-in-out; transition:width 0.15s ease-in-out; }
    #navSearch.open input { width:240px; }
    
    .nav-break {
      border-right:1px solid #01627f;
      padding-right:8px;
    }
    /* @end group Min:767px > Header */
    
    /* @group Min:767px > Footer */
    /* ------------------------------------------- */
    #copyright { display:inline-block; }
    [data-zc-footer] [data-zc-social] { position:absolute; top:30px; right:0; }
    /* @end group Min:767px > Footer */
    
    /* @group Min:767px > Sections */
    /* ------------------------------------------- */
    [data-zc-bg] { /*overflow:hidden;*/ position:relative; }
    [data-zc-inner] { width:100%; }
    /* @end group Min:767px > Sections */
    
    /* @group Min:767px > Columns */
    /* ------------------------------------------- */
    [data-zc-row] { width:100%; left:0px; }
    [data-zc-row~="padded"] [data-zc-column] { padding:0px 1%; }
    [data-zc-row]:not([data-zc-row~="flow"]) [data-zc-column]:not(:last-of-type) { margin-right:4%; }
    [data-zc-column~="2"] { width:45%; }
    [data-zc-column~="3"] { width:30%; }
    [data-zc-column~="4"] { width:22%; }
    [data-zc-column~="2/3"] { width:66%; }
    [data-zc-column~="6"] { width:13.3%; }
    [data-zc-column~="7"] { width:12.5%; }
    [data-zc-row] [data-zc-column~="7"]:not(:last-of-type) { margin-right:2%; }
    [data-zc-inner] [data-zc-row]:not([data-zc-row~="no-bottom"]):not(:last-of-type) { margin-bottom:30px; }
    [data-zc-inner] [data-zc-row~="no-bottom"] { margin-bottom:0px; }
    /* @end group Min:767px > Columns */
    
    /* @group Min:767px > Components */
    /* ------------------------------------------- */
    [data-zc-form="features"] .wide-button { width:266px; }
    [data-zc-form="features"] .label-wrapper { width:565px; }
    [data-zc-select~="pinned"] { right:10px; }
    [data-zc-chart-type] { width:30%; float:left; clear:none; }
    [data-zc-chart-type]:not(:nth-of-type(5n)) { margin-right:0px; }
    [data-zc-chart-type]:not(:nth-of-type(3n)) { margin-right:4%; }
    /* Components -- QUOTE */
    [data-zc-quote] blockquote { min-height:160px; font-size:20px; line-height:30px; }
    [data-zc-quote] p { font-size:16px; line-height:24px; }
    /* @end group Min:767px > Components */
    
    /* @group Min:767px > Pages */
    /* ------------------------------------------- */
        
        /* Pages -- Homepage */
        #banner-wrapper { height: 480px; }
        #bannerChart { width:86%; margin:0 auto; }
        #subscribe .email { width:56%; }
    
        [data-zc-banner] .real_time_controls { margin:0; padding:13px 20px 11px; width:100%; display:inline-block; text-align:center; background-color:rgba(255,255,255,0); color:#fff; border:1px solid #fff; border-radius:4px; }
        [data-zc-banner] .real_time_controls li { margin:0; display:inline-block; list-style:none; }
        [data-zc-banner] .real_time_controls button { color:#fff; font-size:20px; line-height:22px; outline:none; background-color:rgba(255,255,255,0); border:none; }
        [data-zc-banner] .real_time_controls button:hover { color:#ddd; }
        [data-zc-banner] .real_time_controls button.realtime_active { color:#9ab665; cursor:default; }
    
        /* Pages -- Features */
        .features.chart-design-styling #themes-image { position:absolute; top:-40px; right:-120px; -webkit-transform:scale(0.6); transform:scale(0.6); }
        .features [data-zc-inline~="wrap"] { float:right; margin:0px 0px 20px 20px; }
        .features [data-zc-left="copy"] { width:70%; }
        .features .chart-placeholder { min-height:320px; }
    
        /* Pages -- Docs */
        .docs #docs-search-form { position:absolute; right:0px; width:50%; top:-10px; z-index:500; }
        .docs #docs-search-form input { width:80%; }
        .json-attributes-syntax #docs-search-form { top:0px; }
    
        /* Pages -- Tour */
        .tour { padding-top:80px; }
        .tour [data-zc-logo] { top:14px; }
    
        /* GALLERY
        ---------------------------------------------- */
        [data-zc-gallery-new="view"] { float:left; width:100%; border-bottom:5px solid #7ca82b; }
        [data-zc-gallery-new="view"] button { float:left; width:115px; border:1px solid; border-bottom:none; border-top-right-radius:4px; border-top-left-radius:4px; background:#FFF; font-size:16px; text-align:center; padding:12px 0px; border-color:#d9d9d9; color:#5d7e89; }
        [data-zc-gallery-new="view"] button:first-child { margin-right:5px; }
        [data-zc-gallery-new="view"] button.active { background-color:#7CA82B; border-color:#7CA82B; color:#FFF; }
        [data-zc-gallery-new="main"] { margin-left:2%; }
        [data-zc-gallery-new="icon"] { width:230px !important; height:160px !important; }
        [data-zc-gallery-new="carousel"],
        [data-zc-gallery-new="header"] { width:92%; margin-left:4%; margin-right:4%; }
        
        [data-zc-gallery-new="carousel"] { height:105px;overflow-x:scroll;white-space:nowrap;overflow-y:hidden; }
    
        [data-zc-gallery-new="thumbnail"] { display:inline-block; }
        [data-zc-gallery-new="thumbnail"]:not(:last-child) { margin-right:15px; }
        [data-zc-gallery-new="thumbnail"] a { height:94px; border:2px solid #d9d9d9; display:inline-block; -webkit-transition:border-color .2s; transition:border-color .2s; }
        [data-zc-gallery-new="thumbnail"] a:hover { border-color:#00baf0; }
        [data-zc-gallery-new="thumbnail"] a.active { border-color:#7CA82B; }
        [data-zc-gallery-new="thumbnail"] img { height:90px; }

    
    /* @end group Min:767px > Pages */
    

}
/* @end group Media Query ( Min:767px ) */


/* @group Media Query ( Min:980px ) */
@media (min-width:980px) {
    
    /* @group Min:980px > Defaults */
    /* ------------------------------------------- */
    html {
        height: 100%;
    }
    body {
        background: white;
        min-height: 100%;
        min-width: 980px;
        position: relative;
    }
    /* @end group Min:980px > Defaults */
    
    /* @group Min:980px > Header */
    /* ------------------------------------------- */
    /* Header -- Nav Search */
    #navSearch { width:243px; }
    #navSearch input { width:197px; height:24px; }
    .nav-break {
      padding-right:24px;
    }
    /* @end group Min:980px > Headers */
        
    /* @group Min:980px > Sections */
    /* ------------------------------------------- */
    [data-zc-inner] { width:980px; }
    /* @end group Min:980px > Sections */
    
    /* @group Min:980px > Columns */
    /* ------------------------------------------- */
    [data-zc-row] { width:980px; position:relative; left:-10px; }
    [data-zc-row~="gap"] { margin-bottom:40px; }
    [data-zc-row~="padded"] [data-zc-column] { padding:0px 10px; }
    [data-zc-row] [data-zc-column~="nogap"] { margin-right:0px; }
    [data-zc-row]:not([data-zc-row~="flow"]) [data-zc-column]:not(:last-of-type) { margin-right:40px; }
    [data-zc-row]:not([data-zc-row~="flow"]) [data-zc-column~="6"]:not(:last-of-type), [data-zc-row]:not([data-zc-row~="flow"]) [data-zc-column~="7"]:not(:last-of-type){ margin-right:10px; }
    [data-zc-column~="2"] { width:470px; }
    [data-zc-column~="3"] { width:300px; }
    [data-zc-column~="4"] { width:215px; }
    [data-zc-column~="5"] { width:164px; }
    [data-zc-column~="6"] { width:155px; }
    [data-zc-column~="7"] { width:131px; }
    [data-zc-column~="2/3"] { width:640px; }
    [data-zc-column~="3/4"] { width:725px; }
    [data-zc-row="continuous"] [data-zc-row] { margin-right:40px; }
    [data-zc-row="continuous"] [data-zc-column="3"]:nth-of-type(3n) { margin-right:0px; }
    [data-zc-row~="flow"]>[data-zc-column~="5"] { width:20%; }
    [data-zc-row~="flow"]>[data-zc-column] { margin-right:0px; }
    /* @end group Min:980px > Columns */
    
    /* @group Min:980px > Components */
    /* ------------------------------------------- */
    [data-zc-top~="offset"] { position:relative; }
    [data-zc-top~="42"] { top:42px; }
    [data-zc-top~="12"] { top:12px; }
    [data-zc-top~="25"] { top:25px; }
    [data-zc-select~="pinned"] { right:0px; }
    [data-zc-chart-type] { width:180px; float:left; }
    [data-zc-chart-type]:not(:nth-of-type(3n)) { margin-right:0px; }
    [data-zc-chart-type]:not(:nth-of-type(5n)) { margin-right:15px; }
    
    /*****
    [data-zc-form="features"] .wide-button { width:266px; }
    [data-zc-form="features"] .label-wrapper { width:565px; }
    *****/
    
    /* @end group Min:980px > Components */
    
    /* @group Min:980px > Content */
    /* ------------------------------------------- */
    .mobile-show { display:none; }
    /* @end group Min:980px > Content */
    
    /* @group Min:980px > Pages */
    /* ------------------------------------------- */
        
        /* @group 980px > Homepage */
        /* ------------------------------------------- */
        #banner-wrapper { height: 510px; }
        #banner-title { width:1000px; position:relative; left:-10px; text-align:center; font-size:45px; line-height:50px; }
        #bannerChart { width:100%; }
        [data-zc-row="h-render"] [data-zc-col="2"]:last-of-type { margin-right:40px !important; }
        [data-zc-banner] [data-zc-inline] > [data-left] { margin:0px 10px 0px 0px; }
        [data-zc-banner] [data-zc-inline] > [data-right] { margin:0px 0px 0px 10px; }
        #subscribe .email { width:300px; }
        /* @end group 980px > Homepage */
    
        /* @group 980px > Features */
        /* ------------------------------------------- */
        .features.chart-design-styling #themes-image { -webkit-transform:scale(1); transform:scale(1); }
        .features #mobile-image { width:980px; position:relative; left:-10px; max-width:none; }
        .features .half-width { width:50%; display:inline-block; }
        .features .half-width + img { vertical-align:top; }
        .features [data-zc-left="copy"] { width:755px; }
        /* @end group 980px > Features */
    
        /* @group 980px > Docs */
        /* ------------------------------------------- */
        [data-zc-docs~="body"] { position:relative; left:255px; }
        [data-zc-docs="body"] { width:470px; }
        [data-zc-docs~="json"] { width:645px; left:325px; }
        [data-zc-docs*="nav"] { position:fixed; width:215px; overflow-y:scroll; height:calc(100% - 135px); }
        [footer-in-view] [data-zc-docs*="nav"] { position:absolute; bottom:35px; }
        [data-zc-docs~="json-tree"] { width:285px; background:#F7F7FA; border:1px solid #D9D9D9; border-radius:4px; padding:10px; right:50%; margin-right:195px; }
        [data-zc-docs="main-nav"] { right:50%; margin-right:275px; border:1px solid #D9D9D9; border-radius:4px; }
        [data-zc-docs="sub-nav"] { left:50%; margin-left:275px; top:140px; }
        [data-zc-docs~="body"] [data-zc-inner] { width:inherit; padding:0px; }
        [data-zc-docs~="body"] [data-zc-inner="underline"] { padding:40px 0px; }
        [data-zc-docs*="nav"] ul { margin-left:0px; }
        [data-zc-docs="main-nav"] .header { font-weight:bold; border-bottom:1px solid #D9D9D9; }
        [data-zc-docs="main-nav"] .subnav-list { font-size:16px; line-height:18px; }
        [data-zc-docs="main-nav"] .subnav-list li:not(:last-child) { padding-bottom:5px; }
        [data-zc-docs="main-nav"] a { color:#003849; }
        [data-zc-docs="main-nav"] .active { color:#7CA82B; }
        [data-zc-docs="main-nav"] .subnav-item { padding:13px 10px; margin-bottom:0px; }
        [data-zc-docs="main-nav"] .subnav-item:not(:last-of-type) { border-bottom:1px solid #D9D9D9; }
        [data-zc-docs="main-nav"] .subnav-list { margin-bottom:0px; }

        [data-zc-docs="sub-nav"] ul { background-color:#F4F4F4; border-radius:4px; margin:0px 10px; padding-bottom:20px; }
        [data-zc-docs="sub-nav"] li { padding-left:10px; padding-right:10px; margin-bottom:0px; -webkit-transition:background-color 0.2s ease-in-out; transition:background-color 0.2s ease-in-out; }
        [data-zc-docs="sub-nav"] a { color:#003849; }
        [data-zc-docs="sub-nav"] li.active a { color:#7CA82B; }
        [data-zc-docs="sub-nav"] li:not([data-zc-indent="0"]):hover { background-color:#00baf0; }
        [data-zc-docs="sub-nav"] li:not([data-zc-indent="0"]):hover a { color:#FFF; }
        [data-zc-docs~="json-tree"] a.active { font-size:13px; color:#FFF; background-color:rgba(124, 168, 43,0.6); padding:2px 5px; border-radius:4px; }
        [data-zc-docs~="json-tree"] button { padding:5px 10px; font-size:16px; width:48%; }
        [data-zc-docs~="json-tree"] button:first-of-type { margin-right:2%; }
        
        [data-zc-docs="sub-nav"] [data-zc-indent="0"] { padding-top:10px; font-size:20px; line-height:24px; font-weight:bold; }
        [data-zc-docs="sub-nav"] [data-zc-indent="1"] { font-weight:bold; padding:10px; }
        [data-zc-docs="sub-nav"] [data-zc-indent="1"]:not(:first-of-type) { border-top:1px solid #D9D9D9; margin-top:10px; }
        [data-zc-docs="sub-nav"] [data-zc-indent="1"]~[data-zc-indent="1"] { margin-top:0px; }
        [data-zc-docs="sub-nav"] [data-zc-indent="2"] { padding-left:15px; }
        [data-zc-docs="sub-nav"] [data-zc-indent="3"] { padding-left:25px; }
        [data-zc-docs="sub-nav"] [data-zc-indent="4"] { padding-left:35px; }
        [data-zc-docs="sub-nav"] [data-zc-indent="2"], [data-zc-docs="sub-nav"] [data-zc-indent="3"], [data-zc-docs="sub-nav"] [data-zc-indent="4"] { margin-bottom:0px; font-size:13px; line-height:20px; }
    
        /************* SCALEABLE CHANGES *****************/
        [data-zc-docs~="body"] [data-zc-inner] { margin-left:0px; width:100%; }
        [data-zc-docs="body"] { width:715px; }
        
        .docs #docs-search-form { margin-bottom:20px; position:static; width:100%; }
        .docs #docs-search-form input { width:635px; margin-right:10px; }
        .json-attributes-syntax #docs-search-form input { width:565px; }
    
        /*************************************************/
        
        /* @end group 980px > Docs */
    
        /* @group 980px > Try */
        .try #major-points>li:not(:last-child) { min-height:150px; border-bottom:1px solid #D9D9D9; margin-bottom:36px; }
        .try #video { -webkit-transform:translateY(50%); transform:translateY(50%); }
        /* @end group 980px > Try */
    
        /* @group 980px > Gallery */
        [data-zc-gallery-new="main"] { margin-left:0px; }
        [data-zc-gallery-new="icon"] { width:300px !important; height:208px !important; float:left; margin-bottom:40px; margin-left:0px; background-color:#F4F4F4; border:2px solid #E8E8E8; overflow:hidden; position:relative; display:none; }
        [data-zc-gallery-new="icon"].show { display:block; }
        [data-zc-gallery-new="icon"].not_third_child { margin-right:30px; }
        [data-zc-gallery-new="hover"] { width:100%; height:100%; background-color:rgba(255,255,255,0); position:absolute; z-index:999; -webkit-transition:background-color 0.1s ease-in; transition:background-color 0.1s ease-in; }
        
        [data-zc-gallery-new="hover"] [data-zc-gallery-new="name"] { opacity:0; display:none; }
        [data-zc-gallery-new="hover"].touch { background-color:rgba(255,255,255,0.3); }
        [data-zc-gallery-new="hover"].touch [data-zc-gallery-new="name"] { opacity:1; display:block; }
        
        [data-zc-gallery-new="name"] { opacity:0; z-index:1; -webkit-transition:opacity 0.1s ease-in; transition:opacity 0.1s ease-in; position:relative; display:block; -webkit-transform:translateY(-50%); transform:translateY(-50%); top:50%; width:180px; margin:auto; text-align:center; background-color:#00baf0; color:#FFF; padding:19px 0px; font-weight:bolder; }
        [data-zc-gallery-new="name"] p { font-weight:bold; color:#FFF; margin-bottom:0px; padding:0px 5px; }
        [data-zc-gallery-new="name"] span { font-weight:lighter; }
        [data-zc-gallery-new="image"] { width:100%; }
        /* GALLERY CHART VIEW */
        [data-zc-gallery-new="carousel"] { width:100%; height:105px; overflow-x:scroll; white-space:nowrap; overflow-y:hidden; margin-left:0px; margin-right:0px; }
        [data-zc-gallery-new="carousel"].hide { visibility:hidden; }
        [data-zc-gallery-new="thumbnail"] { display:inline-block; }
        [data-zc-gallery-new="thumbnail"]:not(:last-child) { margin-right:15px; }
        [data-zc-gallery-new="thumbnail"] a { height:85px; width:121px; display:inline-block; -webkit-transition:border-color .2s; transition:border-color .2s; }
        [data-zc-gallery-new="thumbnail"] a.loaded {  }
        [data-zc-gallery-new="thumbnail"] a:hover { border-color:#00baf0; }
        [data-zc-gallery-new="thumbnail"] a.active { border-color:#7CA82B; }
        [data-zc-gallery-new="thumbnail"] img { height:81px; }
        [data-zc-gallery-new="header"] { float:left; width:100%; height:70px; border-bottom:1px solid #d9d9d9; margin:35px 0px 40px; }
        [data-zc-gallery-new="title"] { float:left; width:70%; text-align:left; }
        [data-zc-gallery-new~="controls"] { float:right; width:30%; text-align:right; }
        [data-zc-gallery-new~="sub"] { float:none; clear:both; margin-bottom:24px; text-align:left; }
        [data-zc-gallery-new~="controls"] a { padding:14px 10px; border:1px solid #d9d9d9; border-radius:4px; }
        [data-zc-gallery-new~="controls"] .counter { width:64px; display:inline-block; text-align:center; color:#505050; }
        [data-zc-gallery-new="chart_container"] { width:725px; float:left; margin-right:40px; margin-left:0px; }
        [data-zc-gallery-new="chart"] { height:500px !important; background-color:#e7eced; }
        [data-zc-gallery-new="share"] { visibility:hidden; }
        [data-zc-gallery-new="share"].visible { visibility:visible; }
        [data-zc-gallery-new="details"] { margin:40px 10px 60px; }
        [data-zc-gallery-new="action_container"] { float:left; width:195px; margin-right:0px; margin-top: 32px; }
        [data-zc-gallery-new="action_container"] a { display:block; width:100%; padding:15px 0px; text-align:center; margin-bottom:10px; }
        [data-zc-gallery-new="action_container"] a:last-child { margin-bottom:0px; }
        [data-zc-gallery-new="info"] ul {
            list-style-type: disc;
        }
        [data-zc-gallery-new="info"] a {
            display: block;
            margin: 0;
            padding: 0;
            text-align: center;
        }
        /* @end group 980px > Gallery */
    
    /* @end group Min:980px > Pages */
}
/* @end group Media Query ( Min:980px ) */

/* @group Media Query ( Min:1200px ) */
@media (min-width:1200px) {
    .docs [data-zc-inner] { width:1140px; }
    [data-zc-docs~="body"], .docs [data-zc-docs~="body"] [data-zc-inner] { width:630px; }
    [data-zc-docs~="json"], .docs [data-zc-docs~="json"] [data-zc-inner] { width:805px; }
    [data-zc-docs="main-nav"] { margin-right:355px; }
    [data-zc-docs~="json-tree"] { margin-right: 285px; }
    [data-zc-docs~="sub-nav"] { margin-left:355px; display:block; }
    .docs #navSearch { width:300px; }
    .docs #navSearch input { width:258px; }
    .docs #navSearch button { position:absolute; top:6px; right:5px; }
    .docs #open-page-nav { display:none; }
    .docs #docs-search-form input { width:550px; }
    .json-attributes-syntax #docs-search-form input { width:725px; }
}
/* @end group Media Query ( Min:1200px ) */

/* @group Media Query (Max:1200px) */
@media (max-width:1200px) {
    [data-zc-docs="sub-nav"] { position:relative; left:0px; top:0px; margin-bottom:20px; margin-left:0px; width:100%; max-height:100%; overflow-y:hidden; }
    [data-zc-docs="sub-nav"] ul { margin:0px; }
    #open-page-nav { width:100%; text-align:left; }
    #open-page-nav .fa { float:right; }
    #open-page-nav:not(.active)+ul { max-height:0px; padding:0px; }
    #open-page-nav:not(.active) .fa-minus { display:none; }
    #open-page-nav.active+ul { max-height:9999px; }
    #open-page-nav.active .fa-plus { display:none; }
}
/* @end group Media Query (Max:1200px) */

/* @group Media Query (Max:980px) */
@media (max-width:980px) {
    
    /* @group Max:980px > Login */
    /* ------------------------------------------- */
    [data-zc-login] { padding:0 3%; }
    /* @end group Max:980px > Login */
    
    /* @group Max:980px > Content */
    /* ------------------------------------------- */
    .tablet-hide { display:none; }
    .tablet-hide-f { display:none !important; }
    /* @end group Max:980px > Content */
    
    /* @group Max:980px > Columns */
    /* ------------------------------------------- */
    [data-zc-row~="clear:980px"]>[data-zc-column] { float:none; width:100%; }
    [data-zc-row~="clear:980px"]>[data-zc-column]:not(:last-of-type) { margin-bottom:40px; }
    
    .row.collapse {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
    }
    .row.collapse > .col { max-width:100%; width:100%; }
    .row.collapse.gutter > .col:nth-of-type(n + 2) { margin:18px 0 0 0; }
    /* @end group Max:980px > Columns */
    
    /* @group Max:980px > Pages */
    /* ------------------------------------------- */
    
    /* Homepage ------- */
    .mobile-chart-switcher {
        display: block;
        margin-bottom: 18px;
        width: 100%;
    }
    .js-lesson-export-trigger {
      left: 5px;
    }      
    .homepage-chart-controls,
    .arrow-container,
    .editor {
        display: none;
    }
    
    .wrapper-controls label {
        font-size: 0;
    }
    .wrapper-controls .wrapper-icon {
        margin-right: 0;
    }
    .wrappers.prettyprint {
        font-size: 14px;
        overflow: scroll;
    }
    
    /* Homepage Carousel ------ */
    .demo-wrapper {
        display: none;
    }
    .scroll-left,
    .scroll-right {
        display: none;
    }                      
    
    /* Features ------- */
    .features.chart-types .clearfix { width:100%; }
    
    /*.features [data-zc-left="copy"] { width:100%; }*/
    
    /*.features [data-zc-left="image"] { width:100%; }*/
    
    .features [data-zc-inline="copy"] { width:75%; float:right; }
    .features [data-zc-inline="image"] { width:15%; height:15%; }
    .features .half-width { width:100%; display:block; }
    .features #features-subnav button { font-size:14px; }
    .features #feed-code { font-size:12px; } 
    [data-zc-inner] [data-zc-row]:not(:last-of-type) { margin-bottom:30px; }
    
    .angularjs-charts .prettyprint { font-size:12px; overflow:visible; word-wrap:break-word; }
    .angularjs-charts [data-zc-button="5"]:nth-of-type(2) { margin-top:10px; }
    
    /* Pages -- HOMEPAGE */
    [data-zc-inner~="banner"][data-zc-inner~="controls"] { padding:20px; }
    [data-zc-inner~="banner"][data-zc-inner~="controls"] [data-zc-column~="6"] { width:16%; }
    [data-zc-inner~="banner"][data-zc-inner~="controls"] [data-zc-column~="6"]:not(:last-of-type) { margin-right:5%; }
    button[data-zc-icon].active:after { bottom:115%; }
    /* @end group Max:980px > Pages */
    
    /* @group Max980px > Docs */
    /* ------------------------------------------- */
    .docs [data-zc-bg] { overflow:hidden; }
    .docs [data-zc-docs] [data-zc-inner] { padding-left: 0; padding-right: 0; }
    .docs [data-zc-docs~="main-nav"] { position:absolute; z-index:100; border:1px solid #D9D9D9; border-radius:4px; border-top-right-radius:0px; width:200px; overflow-y:scroll; max-height:500px; }
    .docs [data-zc-docs~="json-tree"] { width:300px; }
    .docs [data-zc-docs~="main-nav"] > ul { margin:10px; }
    .docs [data-zc-docs="sub-nav"] { display:none; }
    .docs #open-nav { position:absolute; top:0px; left:-10px; z-index:300; border:1px solid #D9D9D9; border-top-right-radius:4px; border-bottom-right-radius:4px; border-left:0px; background:#FFF; padding:4px 6px; width:100px; text-align:center; color:#00baf0; }
    .docs [data-zc-docs~="body"] { position:relative; padding-top:18px; z-index:200; background-color:#FFF; -webkit-transform:translateX(0px); transform:translateX(0px); -webkit-transition:-webkit-transform 0.2s ease-in-out; transition:-webkit-transform 0.2s ease-in-out; transition:transform 0.2s ease-in-out; transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; }
    .docs [data-zc-docs~="body"].active { -webkit-transform:translateX(200px); transform:translateX(200px); }
    .docs [data-zc-docs~="json"].active { -webkit-transform:translateX(300px); transform:translateX(300px); }
    .docs [data-zc-docs~="body"].active #open-nav:after { content:' '; position:absolute; bottom:-2px; left:-11px; background:#FFF; height:3px; width:20px; }
    .docs .subnav-item span { margin-bottom:18px; display:block; }
    .docs .subnav-item a { font-size:16px; color:#003849; }
    /* @end group Max980px > Docs */
    /* @end group Max:980px > Pages */

    /* @group Max980px > gallery > chart */
    [data-zc-gallery-new="action_container"] { width:92%; margin:4%; }
    [data-zc-gallery-new="chart_container"] { width:92%; margin:auto; z-index:999; position:relative; }
    [data-zc-gallery-new="details"] { margin:10px 0px 10px; float:left; width:100%; }
    /* @end group Max980px > gallery > chart */
}
/* @end group Media Query (Max:980px) */

/* @group Media Query ( Max:766px ) */
/* Landscape phones and down */
@media (max-width:766px) {
    
    /* @group Max:766px > Defaults */
    /* ---------------------------------------------- */
    html { will-change:auto; -webkit-transform:none; transform:none; -webkit-transition:none; transition:none; }
    h1, .h1 { font-size:22px; line-height:26px; }
    h2, .h2 { font-size:20px; line-height:24px; }
    .mobile-hide { display:none; }
    .mobile-hide-f { display:none !important; }
    .desktop-hide { display:initial; }
    .homepage-h1-white {margin-top:20px;}
    /* @end group Max:766px > Defaults */
    
    /* @group Max:766px > Header */
    /* ---------------------------------------------- */
    
    /* MAIN NAV */
    [data-zc-header] { position:fixed; top:-1px; }
    [data-zc-logo] { position:fixed; }
    [data-zc-nav-trigger] { z-index:1010; position:fixed; top:14px; left:14px; width:32px; height:32px; display:block; cursor:pointer; background:url(../img/bg-sprite-24.png) no-repeat -109px -29px; }
    [data-zc-nav-group] { position:fixed; top:0; left:-230px; padding:20px 0 0; width:230px; height:100%; background:#f9f9f9; border-right:1px solid #f0f0f0; }
    
    [data-zc-login] { display: none; }
    
    /* NAV:SECONDARY */
    [data-zc-dropdown] #trigger { border-radius:4px; font-size:18px; line-height:20px; cursor:pointer; color:#003849; }
    [data-zc-dropdown] #trigger .fa-caret-down { color:#00baf0; }
    
    #support-user-dropdown {
        position: relative;
    }

    #support-user-dropdown[aria-expanded="true"] {
        opacity:1;
        pointer-events:visible;
    }
    #support-user-dropdown[aria-expanded="false"] {
        opacity:0;
        pointer-events:none;
        position:fixed;
        left:-200px;
    }
    
    #support-user-dropdown::before {
        left: 12px;
        right: 100%;
    }

    #support-user-dropdown::after {
        left: 13px;
        right: 100%;
    }    
    
    #options { display:none; background-color:#FFF; padding:10px; border-radius:4px; border:1px solid #d9d9d9; width:120px; position:relative; top:20px; }
    #options.active { display:block; }
    
    #options a,
    #options span { display:block; font-size:14px; padding:5px 0px; font-weight:lighter; }
    
    #navSearch { width:220px; float:left; border:1px solid #d9d9d9; border-radius:4px; }
    #navSearch input { width:180px; border:none; padding: 5px 5px 5px 8px; margin-bottom:0px; }
    #navSearch button { position:absolute; right:0px; top:0px; color:#FFF; background-color:#d9d9d9; height:34px; width:34px; border:none; border-left:1px solid #d9d9d9; border-radius:0px; border-top-right-radius:4px; border-bottom-right-radius:4px; font-size:14px; }
    #navSearch button:hover { background-color:#c0c0c0; }
    
    /* Header -- Mobile Menu Drop Target:Default */
    [data-zc-menu-target] { position:fixed; top:0; right:-210px; left:auto; padding-top:17px; width:210px; height:100%; background:#003849; }
    [data-zc-menu-target].open { right:0; display:block; border-left:1px solid #d9d9d9; }
    [data-zc-menu-target] ul { display:block !important; }
    [data-zc-menu-target] li { margin:0; padding:5px 20px; display:block; color:#7ca82b; font-size:15px; }
    [data-zc-menu-target] li a { margin:-5px -20px; padding:5px 20px; display:block; color:#fff; }
    /* Header -- Mobile Menu Drop Target:Navs Combined */
    [data-zc-menu-target] [data-zc-nav] { position:relative; top:auto; left:auto; }
    /* Header -- Mask */
    [data-zc-nav-mask] { z-index:9; position:fixed; top:0; right:200px; width:100%; height:100%; cursor:pointer; }
    /* Header -- Nav */
    #trigger { display:none; }
    #options { display:block; position:static; top:0px; background:none; border:0px !important; padding:0px; margin:0px 0px 0px 5px; }
    #options a { font-size:14px; }
    #navSearch { float:left; padding:0px !important; background-color:#FFF; margin-left:20px; width:190px; }
    #navSearch input { display:inline-block; margin-left:0px; width:150px; height:100%; }
    #navSearch button[type='submit'] { position:relative; margin:0px; display:inline-block; padding:initial; height:100%; }
    #navSearch i.fa { padding:initial; margin:0px; }
    /* @end group Max:766px > Header */
    
    /* @group Max:766px > Sections */
    /* ---------------------------------------------- */
    [data-zc-inner] { width:100%; padding:30px 6%; }
    /* @end group Max:766px > Sections */
    
    /* @group Max:766px > Columns */
    /* ---------------------------------------------- */
    [data-zc-row] { width:100%; left:0px;  }
    [data-zc-row~="collapse"] { display:block; }
    [data-zc-row~="collapse"] [data-zc-column] { width:100%; margin-right:0px; float:none; clear:both; }
    [data-zc-row~="collapse"] [data-zc-column]:not(:last-of-type) { margin-bottom:30px; }
    [data-zc-column]:not(.centered) img { position:relative; -webkit-transform: translateX(-50%); transform: translateX(-50%); left:50%; }
    /* @end group Max:766px > Columns */
    
    /* @group Max:766px > Components */
    /* ---------------------------------------------- */
    [data-zc-top*="offset"] { position:relative; top:0px; }
    [data-zc-form="features"] .wide-button { width:100%; }
    [data-zc-form="features"] .label-wrapper { width:100%; }
    [data-zc-tabs] li { min-width:90px; }
    [data-zc-select~="pinned"] { position:relative; margin-left:0px; width:100%; top:0px; }
    [data-zc-chart-type] { width:100%; clear:both; margin-bottom:10px; }
    ol[data-zc-list] { margin-left:0px; }
    ol[data-zc-list~="green"]>li:before { font-size:20px; line-height:30px; height:30px; width:30px; }
    ol[data-zc-list~="green"]>li { padding-left:40px; }
    /* @end group Max:766px > Components */
    
    /* @group Max:766px > Pages */
    /* ---------------------------------------------- */
    
        /* @group Max:766px > Pages > Homepage */
        /* --------------------------------------------------*/
        #banner-wrapper { padding-top:21px; height:455px; }
        #bannerChart { width:86%; margin:0 auto; height:275px; }
        #chartContainer { margin-bottom:0px; }
        #banner [data-zc-inline="center"] [data-left] { display:none; }
        #banner [data-zc-inner] { padding-bottom:0px; }
        [data-zc-inner~="banner"][data-zc-inner~="controls"] { padding:10px 20px; }
        [data-zc-inner~="banner"][data-zc-inner~="controls"] [data-zc-column] { margin-bottom:0px; }
        [data-zc-inner~="banner"][data-zc-inner~="controls"] [data-zc-icon] { line-height:0px; font-size:0px; padding-top:70px; }
        button[data-zc-icon]:before { width:150%; height:70px; -webkit-transform:scale(0.7); transform:scale(0.7); left:-25%; }
        button[data-zc-icon].active:after { display:none; }
        #subscribe .email { width:100%; margin-bottom:18px; }
        #subscribe button[type="submit"] { width:100%; }
        /* @end group Max:766px > Pages > Homepage */
    
    
        /* @group Max:766px > Pages > Docs */
        /* --------------------------------------------------*/
        .docs #open-nav { left:-6%; }
        .docs [data-zc-docs="body"].active #open-nav:after { left:-1px; }
        .docs #tree { line-height:32px; }
        .docs .wrapper [data-zc-trigger] { left:-30px; top:-6px; border:1px solid #D9D9D9; background-color:#F4F4F4; border-radius:4px; width:24px; text-align:center; height:24px; line-height:24px; }
        .docs .json-attributes-syntax [data-zc-action] { font-size:16px; padding:5px 10px; }
        .docs #docs-search-form { position:absolute; top:-10px; right:0px; }
        .json-attributes-syntax #docs-search-form { top:0px; }
        .try #video { width:100%; }
        /* @end group Max:766px > Pages > Docs */
    
        /* @group Max:766px > Pages > Gallery */
        /* --------------------------------------------------*/
        #nav-gallery { display:none; }
        [data-zc-gallery-new="main"] { margin-top:0px !important; }
        [data-zc-gallery-mobile="0"].show { display:none; }
        [data-zc-gallery-new="icon"] { width:100% !important; clear:both; }
        /* HOVER */
        [data-zc-gallery-new="hover"] { background-color:rgba(255,255,255,0); }
        [data-zc-gallery-new="hover"] [data-zc-gallery-new="name"] { opacity:0; }
        [data-zc-gallery-new="hover"].touch { background-color:rgba(255,255,255,0.3); }
        [data-zc-gallery-new="hover"].touch [data-zc-gallery-new="name"] { opacity:1; }
        [data-zc-gallery-new="name"] a { padding-top:10px; padding-bottom:10px; }
        [data-zc-gallery-new="image"] { height:100%; }
        /* STUFF TO HIDE */
        [data-zc-gallery-new="carousel"],
        [data-zc-gallery-new="view"],
        [data-zc-gallery-new="view"],
        [data-zc-gallery-new="action_container"] .desktop { display:none !important; }
        [data-zc-gallery-new="header"] { float:none; height:50px; border-bottom:0px; margin:5px 0px 5px; }
        [data-zc-gallery-new="title"] { font-size:12px; line-height:12px; }
        [data-zc-gallery-new="title"] { font-size:12px; }
        [data-zc-gallery-new="controls"] a { padding:10px 5px; }
        [data-zc-gallery-new="controls"] .counter { top:71px; padding:0px 10px; background-color:#e7eced; border-top-left-radius:4px; border-top-right-radius:4px; }
  
        /* @end group Max:766px > Pages > Gallery */
    
        /* @group Max:766px > Pages > Tour */
        /* --------------------------------------------------*/
        .tour { padding-top:60px; }
        .tour #tour-content { display:none; }
        /* @end group Max:766px > Pages > Tour */
    
        /* @group Max:766px > Pages > Account */
        /* --------------------------------------------------*/
        #app input[type="text"], #app input[type="password"], #app input[type="email"], #app input[type="password"], #app textarea, #app [data-zc-button] { width:100%; }
        #app .ticket-header .ticket-status { display:block; margin-bottom:10px; }
        /* @end group Max:766px > Pages > Account */

        /* @group Max766px > gallery > chart */
        [data-zc-gallery-new="chart_container"] {width:100%;}
        /* @end group Max766px > gallery > chart */
        
    /* @end group Max:766px > Pages */
}
/* @end group Media Query ( Max:766px ) */


/* @group Media Query ( Max:480px ) */
/* Portrait phones and down */
@media (max-width:480px) {
    .pseudo-iframe #top { z-index:100; min-width:240px; }
    .pseudo-iframe img { left:0; position:absolute; top:30px; height:400px; z-index:0; }
    .docs #docs-search-form { display:none; } 
}
/* @end group Media Query ( Max:480px ) */

/* @group Media Query iPad */
@media only screen
and (min-device-width :768px)
and (max-device-width :1024px)
and (-webkit-min-device-pixel-ratio:1)  {
    /* For orientation specific, add this to query:and (orientation :portrait) */

    /* Content */
    .tablet-hide { display:none; }
    #banner-title { width:100%; left:0px; font-size:28px; }
    #banners-homepage { position:relative; top:auto; left:auto; }
    #chartContainer { margin-bottom:18px; }
    [data-zc-content] > [data-zc-wrap] { margin-top:20px !important; }
    h1.mobile_header { color:#00baf0; }
    img.mobile_placeholder { visibility:hidden; }
    img.big_placeholder { display:block; position:absolute; top:0; left:0; max-width:1024px; height:auto; z-index:1; }
    .mobile-cta-container { bottom:-300px; z-index:2; }
    .mobile-cta-container a.mobile-cta { color:#00baf0; border-color:#00baf0; }
    
    /* Pages -- HOMEPAGE */
    #banner-wrapper { height:480px; }
    [data-zc-inner~="banner"][data-zc-inner~="controls"] { padding:20px; }
    [data-zc-inner~="banner"][data-zc-inner~="controls"] [data-zc-column~="6"] { width:16%; }
    [data-zc-inner~="banner"][data-zc-inner~="controls"] [data-zc-column~="6"]:not(:last-of-type) { margin-right:5%; }
    button[data-zc-icon].active:after { bottom:115%; }

    /* About Us */
    [data-zc-vhighlight] .highlight .icon-wrap { min-height:200px; }
    .img_scale { max-width:90%; }

    /* #chart_19167 { width:722px; height:241px; } */
}
/* @end group Media Query iPad */

/* @group RETINA sprite replacement */
/* ---------------------------------------------- */
@media
only screen and (-webkit-min-device-pixel-ratio:2),
only screen and (   min--moz-device-pixel-ratio:2),
only screen and (        min-device-pixel-ratio:2),
only screen and (                -webkit-min-device-pixel-ratio:2),
only screen and (                min-resolution:192dpi),
only screen and (                min-resolution:2dppx) {
    [data-icon="fixed"],
    [data-zc-collapse-close],
    [data-zc-icon-full],
    [data-zc-login-close],
    [data-zc-logo] span,
    [data-zc-menu-trigger],
    [data-zc-new-tag-close],
    [data-zc-overlay-close],
    [data-zc-overlay-closeDS],
    [data-zc-paging] span,
    [data-zc-quote] blockquote span,
    [data-zc-quote] p,
    [data-zc-search] button,
    [data-zc-tags-close],
    [data-zc-checkbox] span,
    [data-zc-radio] span,
    .arrow,
    .select2-container .select2-choice,
    .SnapABug_Button,
    #user-menu strong {
        /* Reference the @2x Sprite */
        
        /*background-image:url(../img/bg-sprite-24@2x.png);*/
        
        /* Translate the @2x sprite's dimensions back to 1x */
        
        /*background-size:500px 785px;*/
    }
}
/* @end group RETINA sprite replacement */

/* @group PRINT */
/* ---------------------------------------------- */
@media print {

    body { color:black; font:normal 11pt/16pt arial,sans-serif; text-shadow:none !important; text-align:left; background:none; }
    img { max-width:100%; border:0; }
    a:link { color:#505050; text-decoration:underline; }
    a:visited { color:#666; text-decoration:underline; }
    /* a[href]:after { content:" [" attr(href) "]"; } */
    ul, ol { margin:10px 0 10px 15px; padding:0; }
    li { margin:5px 0; padding:0; }
    p, h2, h3 { orphans:3; widows:3; }
    h2, h3 { page-break-after:avoid; }

    /* SHARED ITEMS */
    #logo { margin:0 0 35px; display:block; }
    #logo:after { content:""; }

    /* COMPONENTS
    ---------------------------------------------- */
    /* OPTIONS */
    [data-zc-options] li, [data-zc-options] div { padding-right:0; padding-left:0; display:inline-block; float:left; text-align:center; border:0; }
    [data-zc-options] li:first-child, [data-zc-options] div:first-child { border-radius:4px 0 0 4px; -moz-border-radius:4px 0 0 4px; }
    [data-zc-options] li:last-child, [data-zc-options] div:last-child { background-image:none; border-radius:0 4px 4px 0; -moz-border-radius:0 4px 4px 0; }
    /* -- Widths */
    [data-zc-options][data-zc-items="2"] li, [data-zc-options][data-zc-items="2"] div { width:50%; }
    [data-zc-options][data-zc-items="3"] li, [data-zc-options][data-zc-items="3"] div { width:33.33%; }
    [data-zc-options][data-zc-items="4"] li, [data-zc-options][data-zc-items="4"] div { width:25%; }
    [data-zc-options][data-zc-items="5"] li, [data-zc-options][data-zc-items="5"] div { width:20%; }
    [data-zc-options][data-zc-items="6"] li, [data-zc-options][data-zc-items="6"] div { width:16.66%; }

    /* LOGIN */
    [data-zc-login] {
        display: none;
    }

    /* QUOTE */
    [data-zc-quote] blockquote { padding:0; }
    [data-zc-quote] span { display:none !important; }
    [data-zc-quote] p { padding-left:0; }


    /* ROW/COLS */
    [data-zc-row] [data-zc-col] { margin-bottom:0; padding-bottom:0; float:left; border:0; }
    [data-zc-row] [data-zc-col-offset="left"] { margin-left:53.5%; }
    [data-zc-row] [data-zc-col-offset="top"] { margin-top:0; }

    /* -- Full */
    [data-zc-row="full"] [data-zc-col] { width:100%; }
    /* -- 1 Across */
    [data-zc-row="1"] [data-zc-col-offset="left"] { width:46.5%; }
    /* -- 2 Across */
    [data-zc-row="2"] [data-zc-col] { margin-right:7%; width:46.5%; }
    /* -- 3 Across */
    [data-zc-row="3"] [data-zc-col] { margin-right:4%; width:30.66%; }
    /* -- 4 Across */
    [data-zc-row="4"] [data-zc-col] { margin-right:7%; width:19.41%; }
    [data-zc-row="4"] [data-zc-col]:last-child { width:20.75%; }
    [data-zc-items="3"] { margin-bottom:20px !important; }


    /* BUY */
    [data-buy="label"] { width:19%; }
    [data-buy="title"] { font-size:10px; }
    [data-buy="item"] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }


    /* MISC. CLASSES & IDS */
    .clearfix:after, [data-zc-inner]:after, [data-zc-content]:after { content:''; display:block; clear:both; }

    /* HIDE ITEMS */
    [data-nostyle], [data-zc-nav], [data-zc-buttons], [data-zc-btn] { display:none; }

}
/* @end group PRINT */



/* Features Page CSS
---------------------------------------------------------------------------- */
@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}


.headline {
    color: #424242;
    font-family: 'Roboto','Avenir','Open Sans',sans-serif;
    font-size: 48px;
    line-height: 1;
    margin: 0 0 24px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.headline--banner {
    display: inline-block;
    font-size: 64px;
    max-width: 50%;
}
.headline .fa {
    color: #7CA82B;
}
.headline--alt {
    font-size: 32px;
    margin: 0 0 16px;
}
.subheadline {
    color: #616161;
    font-size: 24px;
    line-height: 1;
    font-family: 'Roboto','Avenir','Open Sans',sans-serif;
    margin: 0 0 16px;
}
.subline {
    color: #757575;
    font-size: 20px;
    font-weight: lighter;
    line-height: 1.5;
    max-width: 75%;
}
.subline--banner {
    display: inline-block;
    max-width: 38%;
}
.info-line {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 24px;
}
.outlink {
    color: #00baf0;
    font-size: 80%;
    letter-spacing: 1px;
    position: relative;
    text-decoration: none !important;
    text-transform: uppercase;
    white-space: nowrap;
}
.outlink:after {
    content: '\2192';
    line-height: 1;
    position: absolute;
    right: -20px;
    top: 2px;
}
.outlink:hover {
    text-decoration: underline;
}

.features-waypoint {
    position: absolute;
    top: -110px;
}

.features-kitchen-sink-icon {
    animation: 3s spin infinite linear;
    color: #7CA82B;
}

/* CARDS
---------------------------------------------------------------------------- */
.split-card {
    border: 1px solid #DDD;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.split-card__content {
    background: white;
    padding: 1rem;
}
.split-card__content--gray {
    background: #F9F9F9;
}
.split-card__top {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom: 1px solid #DDD;
}
.split-card__bottom {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.card--attention {
    box-shadow:0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.1);
}

/* FEATURE LIST
---------------------------------------------------------------------------- */
.feature-header {
    color: #616161;
    display: block;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    text-transform: uppercase;
}
.feature-header .fa {
    color: #9E9E9E;
}
.feature-list {
    margin-left: 0;
    margin-bottom: 18px;
    padding: 0;
}
.feature-list li {
    padding: 0;
}
.feature-list a {
    font-size: 14px;
}
.feature-list a:hover {
    text-decoration: underline;
}

.kitchen-sink-cta {
    text-align: center;
}

/* ATTENTION BUTTON
---------------------------------------------------------------------------- */
.attention-button {
    background: #00baf0;
    border-radius: 2rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.1);
    color: white;
    display: inline-block;
    font-family: 'Roboto','Avenir','Open Sans',sans-serif;
    font-size: 1.2rem;
    font-weight: 300;
    line-height: 1;
    min-width: 300px;
    padding: 0.5rem 2rem;
    text-align: center;
    text-transform: uppercase;
}
.attention-button:hover {
    background: #29A2CC;
    color: white;
}

#ks-floated-link {
    font-family: 'Roboto','Avenir','Open Sans',sans-serif;    
}
#ks-floated-link h3 {        
    color: #616161;
    font-family: 'Roboto','Avenir','Open Sans',sans-serif;
    margin-bottom: 8px;
}

@media screen and (min-width:1024px) {    
    /* ON PAGE NAV
    ------------------------------------------------------------------------ */
    .on-page-nav__title {
        font-weight: bold;
        line-height: 1;
        margin-bottom: 8px;
    }
    .on-page-nav {
        border-left: 2px solid #DDD;
        margin: 0;
        padding: 0 0 0 16px;
    }
    .on-page-nav li {
        font-size: 14px;
        line-height: 1;
        margin-bottom: 8px;
    }
    .on-page-nav__item {
    }
    .on-page-nav a {
        position: relative;
        transform: none;
        transition: 0.2s transform;
    }    
    .on-page-nav a:hover {
        text-decoration: underline;
        transform: translateY(-4px);
    }    
    
    #image-link-overlay {
        /* background: rgba(255, 255, 255, 0.3); */
        height: 65%;
        opacity: 0;
        position: absolute;
        right: 0;
        top: 25px;
        /* transition: 0.2s opacity; */
        width: 65%;
    }
    #image-link-overlay:after {
        background: #00baf0;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2), 0 1px 1px rgba(0, 0, 0, 0.1);
        color: white;
        content: 'See all the demos';
        display: none;
        left: 50%;
        padding: 4px 8px;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    #image-link-overlay:hover {
        /* opacity: 1; */
    }
    
    #ks-floated-link {
        position: absolute;
        right: 18%;   
        text-align: center;
        top: 75%;
    }
}

/* MOBILE SIZE
---------------------------------------------------------------------------- */
@media screen and (max-width:1024px) {
    .headline {
        font-size: 24px;
    }
    .headline--banner {
        font-size: 32px;
    }
    .headline--banner,
    .subline--banner,
    .subline {
        max-width: 100%;
    }
    .outlink:after {
        display: none;
    }
    .on-page-nav__title {
        font-weight: bold;
        line-height: 1;
        margin-bottom: 8px;
    }
    .on-page-nav {
        border-left: 4px solid #DDD;
        margin-bottom: 0;
        padding-left: 16px;
    }
    .on-page-nav li {
        display: block;
    }
    .on-page-nav a:after {
        display: none;
    }
    .split-card__content--gray {
        display: none;
    }
    .split-card__content {
        border-radius: 4px;
    }
    .dependency-row [data-zc-column~="4"] {
        margin: 0 !important;
        width: 25%;
    }
    .dependency-row [data-zc-column~="3/4"] {
        margin: 0 !important;
        width: 75%;
    }
    .feature-list__container [data-zc-column] {
        margin: 0 !important;
        padding: 0;
        width: 25%;
    }
    
    #ks-floated-link {
        margin-top: 24px;
    }
}
@media screen and (max-width:768px) {
    .feature-list__container [data-zc-column] {
        margin: 0;
        padding: 0;
        width: 50%;
    }
    .dependency-row [data-zc-column~="4"] {
        display: none;
    }
    .dependency-row [data-zc-column~="3/4"] {
        margin: 0 !important;
        width: 100%;
    }
}

/* color classes */
.white {
    color: #fff;
}

/*Recent Blog Posts*/
.nostyle .blog-title a {
    text-decoration:none;
}
.mb20 {
    margin-bottom:20px;
}
.mb30 {
    margin-bottom:30px;
}
.nowrap {
    white-space:nowrap;
}
.tooltip-start {
    position: relative;
    display: inline-block;
    
}

.tooltip-start .tooltiptext {
    visibility: hidden;
    width: 550px;
    bottom: 100%;
    left: 50%;
    margin-left: -275px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip-start:hover .tooltiptext {
    visibility: visible;
}
.your-first-chart code {
    font-size:82%;
}