/*
   >>> Global Page Formatting <<<
*/
nav#research-nav.navbar {
    padding-left: 12px;
}

#content-container {
    font-size: 12px;
}

/*a, a:visited, a:hover80px
{
    color: #5e5e5e;
}*/
.series-tag, .series-tag:visited, .customize-data-collapse {
    color: #333;
}

.series-tag-cloud a {
    background: #f4f4f4;
    padding: 2px 7px;
    margin: 0 .5em 1em 0;
    border-radius: 4px;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    display: block;
    float: left;
}

.series-tag-cloud a:hover {
    background-color: #5e5e5e;
    text-decoration: none;
    color: #fff;
    cursor: pointer
}

.row {
    margin: 0;
    padding: 0
}

.scale-options {
    margin-top: 10px;
}

#add-series-container {
    padding-bottom: 1em;
}

.padding-r10 {
    padding-right: 10px;
}

.padding-l25 {
    padding-left: 25px;
}

.padding-r25 {
    padding-right: 25px;
}

.margin-t10 {
    margin-top: 10px;
}

.margin-b10 {
    margin-bottom: 10px;
}

.sloped-line .row {
    padding-bottom: 25px;
}

input.nbd {
    width: 110px;
}

.nbd-recession {
    margin-right: 7px;
}

a.customize-data-collapse {
    line-height: 20px;
}

.release-table i {
    padding-right: 5px;
}

.series-button-stdheight {
    position: relative;
    padding: 10px 15px;
    border-radius: 4px;
    background-color: #EDEDEE;
    color: #555555;
    font-size: 10px;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
}

.aggregation-select {
    padding-left: 20px;
}

button.series-button:visited, button.series-button:hover {
    color: #FFFFFF;
    text-decoration: none;
    cursor: pointer
    background-color: #5e5e5e;
}

button.btn-link:hover, button.btn-link:focus {
    color: #FFFFFF;
    text-decoration: none;
    cursor: pointer
    background-color: #5e5e5e;

}

.collapsable-btn-text {
    color: inherit;
}

.series-button {
    display: inline-block;
    min-width: 10px;
    padding: 7px;
    font-size: 12px;
    color: #000000;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #EDEDEE;
    border-radius: 10px;
    text-shadow: none;
    font-weight: normal;
    width: auto;
}

.add-trend-text {
    margin-right: 10px;
}

.settings-color-checkbox {
    padding: 0;
    margin-bottom: 5px;
}

.info-icon {
    font-size: 200%;
    color: #999;
    padding-left: 5px;
}

#footer {
    margin-top: 0;
}

.footer2 {
    padding: 0 10px;
}

.btn-link[disabled], .series-button[disabled],
.btn-link[disabled]:hover, .series-button[disabled]:hover {
    background-color: #f4f4f4;
    color: #58595B;
}

.series-button[href]:hover, .series-button[href]:focus,
.btn-link:hover, .btn-link:focus {
    background-color: #5e5e5e;
    text-decoration: none;
    color: #fff;
    cursor: pointer
}

.move-series-up {
    margin-right: 10px;
}

.settings-bar a {
    margin-right: 20px;
}

div#resizable-graph-container.ui-resizable {
    width: 100%;
    background-color: #e1e9f0;
}

.section-title {
    font-weight: normal;
}

.copy-units-container {
    padding-top: 5px;
}

#user-def-line-col1 .user-def-label, .input-col-divider {
    margin-top: 8px;
}

.controls-row {
    margin-top: 25px;
    padding-bottom: 20px;
}

div#content-container.clear {
    padding: 0 !important;
}

#content-container {
    margin: 0;
}

div#main-content-column.col-xs-12 {
    margin: 0;
    padding: 0;
    background-color: #F1F2F2;
}

.smaller {
    font-size: 60%;
    color: #666;
}

.bigger {
    font-size: 120%;
}

.btn-custom {
    display: inline-block;
    color: #FFF !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
    background-image: none !important;
    border: 5px solid #FFF;
    border-radius: 0;
    box-shadow: none !important;
    -webkit-transition: all ease .15s;
    transition: all ease .15s;
    cursor: pointer;
    vertical-align: middle;
    margin: 0;
    position: relative
}

.btn-scroll-up {
    border: 0;
    position: fixed;
    right: 100px;
    bottom: 2px;
    z-index: 11;
    color: #ffffff;

}

.btn-inverse {
    background-color: #555 !important;
    border-color: #555;
    color: #ffffff;
}

.padding-10 {
    padding: 10px;
}

#breadcrumbs {
    margin: 0;
    padding: 10px 0 10px 30px;
    border: none;
    background-color: #FFFFFF;
}

#viewall-button {
    width: 100%;
    display: block;
    text-align: center;
    color: white;
    margin-top: 10px;
}

.series-title {
    margin: 0;
    padding-left: 30px;
    width: 100%;
    background: #F2F4DF;
    display: table;
}

#page-title {
    background: #F2F4DF;
}

.series-title-attribs {
    font-weight: normal;
}

.series-title-background {
    background: #F2F4DF;
    padding: 10px;
    font-size: 14px;
    margin-left: -30px;
    margin-right: -30px;
    margin-bottom: 25px;
}

.series-recently-viewed {
    width: 100%;
    display: table-cell;
    vertical-align: middle;
    margin-top: 7px;
}

.series-title-text {
    font-size: 14px;
    margin-left: 20px;
    font-weight: bold;
}

.series-title #series-title-text-container {
    width: 100%;
    padding-top: 6px;
    display: table-cell;
    vertical-align: middle;
}

div#series-meta-row.row.series-attributes {
    padding: 10px 5px 10px 30px;
    background-color: #FFFFFF;
}

.series-meta-label {
    padding: 0;
    font-weight: bold;
    font-size: 75%;
    margin: 0;
}

.series-meta-value {
    color: #666;
}

.series-meta-observation-value {
    color: #000;
}

.meta-col {
    margin-right: 10px;
    padding-right: 10px;
    border-right: 1px solid #e1e9f0;
    margin-bottom: -399px;
    padding-bottom: 399px;
    max-width: 250px;
}

.remove-series {
    font-size: 160%;
    color: #b74635;
    margin-left: 10px;
}

.remove-series:hover {
    cursor: pointer
}

.series-attributes {
    /*  overflow: hidden;
    */
}

.related-resource {
    height: 200px;
}

.related-resource-title {
    overflow: hidden;
    width: 200px;
    position: relative;
    line-height: 1.2em;
    max-height: 3.6em;
    margin-right: -1em;
    padding-right: 1em;
}

.related-resource-title:before {
    content: '...';
    position: absolute;
    right: 0px;
    bottom: 0;
}

.related-resource-title:after {
    content: '';
    position: absolute;
    right: 0;
    width: 1em;
    height: 1em;
    margin-top: 0.2em;
    background: white;
}

.related-resource-title-old {
    margin-top: 5px;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0px 15px;
}

.related-resource-content {
    font-style: italic;
}

.noscrollbar {
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
}

.noscrollbar::-webkit-scrollbar {
    width: 0px
}

.tab-content-scroll {
    position: relative;
    padding: 0;
    overflow-x: hidden;

}

.tabs-scroll {
    position: relative;
}

.tab-content-sticky {
    margin-left: 176px;
}

#tabbed-menu {
    /*   max-width:166px;*/
}

#tabbed-menu.sticky {
    position: fixed;
    top: 0;
}

.top-border {
    border-top: 1px solid #eeeeee;
    margin-top: 10px;
}

.right-border span {
    font-size: 100%;
}

#edit-button-container a.overlay-btn-large:visited {
    color: #FFFFFF;
}

#edit-button-container a.overlay-btn-large {
    background-color: #d86342;
    color: #FFFFFF;
    padding: 9px;
    text-transform: uppercase;
    margin-top: 1px;
}

i.fa.fa-download, .overlay-btn-large i.fa {
    font-size: 120%;
}

label[for=input-coed] {
    padding: 5px 5px 0 5px;
}

#download-button {
    background-color: #364D72 !important;
    margin: 0;
    padding: 7px;
    height: 34px;
    color: #FFFFFF;

}

#download-button-container {
    padding: 0;
    display: table-cell;
    vertical-align: middle;
}

#download-button-container .dropdown-menu {
    width: 200px;
}

#downloadBtn {
    background-color: #fafafa;
    color: #666;
    height: 23px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 1px;
    padding-bottom: 1px;
    font-weight: normal;
    border: none;
}

.integer-periods, .checkbox-inline {
    margin-top: 15px;
}

.transformation {
    margin-right: 10px;
}

span.link {
    color: #666;
}

div.col-xs-12.col-sm-12.content-2columns-main {
    padding: 0;
    margin: 0;
}

h1 {
    background: #f1f4df;
    padding: 10px 5px 10px 5px;
}

.customize-data .row, .normalize-by-date {
    padding-left: 0;
}

.select2-container {
    width: 100%;
}

#user-def-line-col1 div.input-col-divider {
    padding-left: 15px;
}

#user-def-line-col2 span.link.large {
    padding-right: 25px;
}

#user-def-line-col1 .text-success, #user-def-line-col1 .text-error {
    float: left;
    margin: 5px 0 0 5px;
}

.overlay-panel-content .sloped-line .series-title-background {
    display: block;
}

/*
   >>> Tab Formatting <<<
*/
.fred-series-tabs {
    /*   margin-left: 10px;
       margin-right: 10px;
    /  background-color: #ffffff;*/
}

div.tab-content, div.tab-content-sticky {
    font-size: 12px;
    /*   background-color: #e9e9e9;
       min-height: 260px;*/
}

.panel {
    margin-bottom: 0;
    border-radius: 3px;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.panel-inner {
    margin: 0;
    padding: 0;
}

.panel-heading {
    position: relative;
    height: 52px;
    line-height: 49px;
    padding: 0 0 0 30px;
    background: #fafafa;
    border: 1px solid #e2e2e2;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
}

.panel-heading, .panel-heading span {
    letter-spacing: 0.2px;
    color: #999999;
    font-size: 15px;
    font-weight: 400;
}

.overlay-panel .panel-heading {
    display: none;
}

.series-group .panel-heading {
    display: block;
    background: none;
    border: none;
    padding: 0;
}

.panel-heading + .panel-body {
    border-top: 0;
}

.panel-body {
    /* background: #FFF;*/
    position: relative;
    padding: 15px 15px 15px 30px;

}

.panel-body h4 {
    font-weight: normal;
    margin-top: 15px;
}

.no-margin-top {
    margin-top: 0 !important;
}

.related-resource {
    margin-bottom: 15px;
}

.tab-content .panel-body, .tab-content-sticky .panel-body {
    border: none;
    margin: 0;
    padding: 0;
}

/*#logo
{
    width:350px;
    height:auto;
}*/
.graph-footer {
    width: 100%;
    background: #E1E9F0;
    font-family: Open Sans;
    font-size: 12px;
    margin: 0;
    padding-left: 30px;
    padding-right: 8px;
    line-height: 1.5em
}

.graph-footer span {
    white-space: nowrap;
    color: #444;
}

div#zoom-and-share {
    /*    background-color: rgb(225, 233, 240);*/
    background-color: #FFFFFF;
}

div#zoom-controls.row.text-right {
    position: absolute;
    top: 90px;
    right: 130px;
    z-index: 12;
}

#date-quick-range {
    padding-right: 5px;
    padding-top: 5px;
    text-align: right;

}

.tab-content, .tab-content-sticky {
    padding: 15px 12px;
    position: relative;
    z-index: 11
}

.tab-content.no-padding {
    padding: 0
}

nav#tab-nav {
    max-width: 176px;
    float: left;
    margin: 0;
    padding: 0;
    display: block;
}

.nav-tabs {
    border-bottom: none;
    height: 100%;
}

.nav-tabs ol, ul {
    padding: 0;
    margin: 0;
}

.tabs-top > .nav-tabs {
    width: 100%;
}

.nav-tabs .tabs-top li {

    text-align: center;
}

.nav-tabs ul.dropdown-menu li {
    width: 100%;
}

.chevron2::before {
    border-style: solid;
    border-width: 0.25em 0.25em 0 0;
    content: '';
    display: inline-block;
    height: 0.45em;
    left: 0.15em;
    position: relative;
    top: 0.15em;
    transform: rotate(-45deg);
    vertical-align: top;
    width: 0.45em;
}

.chevron2-right:before {
    left: 0;
    transform: rotate(45deg);
}

.chevron-right {
    position: relative;
    top: 100px;
    text-align: center;
    padding: 12px;
    margin-bottom: 6px;
    height: 60px;
    width: 200px;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.nav-tabs li {

    width: 33.3%;
    font-size: 90%;
    height: 100%;
}

.nav-tabs li.icon-tab {
    width: 55px;
}

.nav-tabs > li > a {
    /*   padding: 8px 12px;*/
    border: 1px solid #ddd;
}

.nav-tabs > li > a, .nav-tabs > li > a:focus {
    border-radius: 0 !important;
    background: rgba(0, 0, 0, 0.028);
    color: #666;
    margin-right: -1px;
    line-height: 16px;
    position: relative;
    z-index: 11;
    height: 100%;
}

.nav-tabs > li > a:hover, .nav-tabs > li > span > a:hover {
    background-color: #FFF;
    color: #4c8fbd;
}

#series-dropdown-title,
#series-dropdown-title span {
    color: inherit;
}

.dropdown-backdrop {
    display: none !important;
}

.nav-tabs > li > a:active, .nav-tabs > li > a:focus {
    outline: none !important
}

.nav-tabs > li:first-child > a {
    margin-left: 0
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #576373;
    background-color: rgba(128, 179, 236, 0.3);
    z-index: 12;
    line-height: 16px;
    /*    box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.15);*/
    height: 100%;

}

.nav > li > a {
    padding: 10px 6px;
}

.dropdown-menu > li > a {
    padding: 3px 14px;
}

.nav-tabs > li.active > a:before {
    /*   font-family: 'Glyphicons Halflings';
       content: "\e080";
       float: right;
       color: grey;*/
}

.tabs-left {
    background: none;
}

.tabs-left > .nav-tabs > li > a {
    min-width: 60px;
    height: 50px;
}

.tabs-left > .nav-tabs {
    top: auto;
    margin-bottom: 0;
    float: left
}

.tabs-left > .nav-tabs > li {
    float: none
}

.tabs-left > .nav-tabs > li > a, .tabs-left > .nav-tabs > li > a:focus, .tabs-left > .nav-tabs > li > a:hover {
    /*    border-color: #c5d0dc;
    */
    margin: 0 -1px 0 0
}

.tabs-left > .nav-tabs > li.active > a, .tabs-left > .nav-tabs > li.active > a:focus,
.tabs-left > .nav-tabs > li.active > a:hover {

    margin: 0 -1px 0 -1px;
    -webkit-box-shadow: -2px 0 3px 0 rgba(0, 0, 0, 0.15);
    box-shadow: -2px 0 3px 0 rgba(0, 0, 0, 0.15)
}

.nav-tabs > li > a > [class *

=
"icon-"
]
{
    opacity: .75
}

.nav-tabs > li.active > a > .badge, .nav-tabs > li.active > a > [class *

=
"icon-"
]
{
    opacity: 1
}

.nav-tabs li [class *

=
" icon-"
]
,
.nav-tabs li [class^="icon-"] {
    width: 1.25em;
    display: inline-block;
    text-align: center
}

.nav-tabs > li.open .dropdown-toggle {
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    color: #333;
    text-decoration: none;
    background-color: #fff;
    outline: 0
}

.nav-tabs > li.open .dropdown-toggle > [class *

=
"icon-"
]
{
    color: #FFF !important
}

.tabs-left .tab-content, .tab-content {
    overflow-x: hidden;
    /*background-color: #ffffff;*/
    background: rgba(255, 255, 255, 0.46);
    min-height: 500px;
}

/*.nav-pills .open .dropdown-toggle, .nav > li.dropdown.open.active > a:hover,
.nav > li.dropdown.open.active > a:focus {
    background-color: #4f99c6;
    color: #fff
}*/

.nav-pills .open .dropdown-toggle > [class *

=
"icon-"
]
,
.nav > li.dropdown.open.active > a:hover > [class *

=
"icon-"
]
,
.nav > li.dropdown.open.active > a:focus > [class *

=
"icon-"
]
{
    color: #FFF !important
}

.nav-tabs > li:not(.active):not(.open) > a:not(:hover) > [class *

=
"icon-"
]
:first-child.disabled {
    color: #909090 !important
}

.nav-tabs[class *

=
"tab-color-"
]
> li > a, .nav-tabs[class *

=
"tab-color-"
]
> li > a:focus,
.nav-tabs[class *

=
"tab-color-"
]
> li > a:hover {
    color: #FFF;
    margin-right: 3px
}

.nav-tabs[class *

=
"tab-color-"
]
> li:not(.active) > a:hover {
    opacity: .85;
    border-color: rgba(0, 0, 0, 0.15);
    /*    border-bottom-color: transparent
    */
}

.nav-tabs[class *

=
"tab-color-"
]
> li:not(.active) > a > [class *

=
"icon-"
]
:first-child {
    color: #FFF !important
}

.nav-tabs.tab-color-blue > li > a, .nav-tabs.tab-color-blue > li > a:focus {
    background-color: #7db4d8
}

.nav-tabs[class *

=
"tab-color-"
]
> li.active > a, .nav-tabs[class *

=
"tab-color-"
]
> li.active > a:focus,
.nav-tabs[class *

=
"tab-color-"
]
> li.active > a:hover {
    background-color: #FFF;
    color: #4f80a0;
    box-shadow: none
}

.nav-tabs.tab-color-blue > li.active > a, .nav-tabs.tab-color-blue > li.active > a:focus,
.nav-tabs.tab-color-blue > li.active > a:hover {
    color: #4c718a;
}

.nav-tabs.tab-color-blue {
}

.nav-tabs.background-blue {
    padding-top: 6px;
    background-color: #eff3f8;
}

.hide-series-dropdown {
    display: none !important;
}

.section {
    border-bottom: 2px solid #eeeeee;
    margin-bottom: 1em;
}

.section-last {
    border-bottom: none;
}

.mma-options {
    border-bottom: none;
    border-bottom: 2px solid #eeeeee;
}

.section-series-controls {
    border: none;
}

.section:first-child {
    /*    padding-top: 1em;
    */
}

.section-side {
    border-right: 1px solid #eeeeee;
    /*margin-right: 1em;*/
    /*    padding-right: 1em;
    */
}

.section .span3 {
    margin-left: 0;
}

.section-side > .section {
    padding: 0 0 1em 0 !important;
}

div.series-title-background.row {
    margin-bottom: 15px;
}

/*
   >>> Form Controls <<<
*/
.form-group {
    margin-top: 10px;
    margin-bottom: 0;
}

input.form-control.formula.pull-left {
    width: 100%;
}

.formula-units-container {
    width: 89%;
}

label.radio, label.checkbox {
    border-radius: 5px;
    margin: 0;
    padding: 2px;
}

label.stacking {
    font-weight: normal;
}

label.radio:hover, label.checkbox:hover {
    background: #EEE;
    cursor: pointer;
    cursor: hand;
}

label.radio input, label.checkbox input {
    margin-right: .5em;
}

label.disabled {
    color: #CCC;
}

select[disabled="disabled"] {
    color: #CCC;
}

.text-error {
    color: #b94a48 !important;
}

.input-error {
    border: 2px solid #b94a48 !important;
    color: #b94a48 !important;
}

/*
   >>> Content Formatting <<<
*/
div.tooltip {
    z-index: 100;
}

span.series-meta-observation-value {
    font-weight: bold;
    font-size: 120%;
    color: #666
}

.series-meta-value-units, .series-meta-value-frequency {
    color: #666;
}

.updated-text {
    font-size: 90%;
    color: #666;
}

.series-citation .section-title, #notes-content .section-title {
    margin: 0;
    padding-bottom: 5px;
    font-weight: bold;
}

#notes {
    background: #FFF;
}

.breakable {
    word-wrap: break-word;
    word-break: break-all;
}

.two-col-notes {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;

    -webkit-column-gap: 20px;
    -moz-column-gap: 20px;
    column-gap: 20px;
}

/* overflow is needed on content container for when user resizes graph outside page area */
#content {
    overflow: visible !important;
}

/*#resizer {max-width: 670px;}*/
#resizer i, #resizer span {
    color: #999;
}

#resizer i:hover, #resizer span:hover {
    color: #333;
}

#resizer span {
    font-size: 0.9em;
    cursor: pointer;
    cursor: hand;
}

#browse-series-modal {
    width: 600px;
    max-width: 600px;
}

.modal {
    z-index: 2000;
}

#permalink-modal .modal-body {
    min-height: 130px;
}

#permalink-modal .modal-footer {
    margin-top: 15px;
}

.series-transformation-group {
    margin-bottom: 1em;
}

.share-form {
    padding-bottom: 28px;
}

.share-button {
}

.button-twitter-large {
    background: url(//research.stlouisfed.org/images/twitter-logo-large.png) top left no-repeat;
    background-size: 50px 50px;
}

.button-facebook-large {
    background: url(//research.stlouisfed.org/images/facebook-logo-large.png) top left no-repeat;
    background-size: 50px 50px;
}

.button-gplus-large {
    background: url(//research.stlouisfed.org/images/gplus-logo-large.png) top left no-repeat;
    background-size: 50px 50px;
}

.button-mail-large {
    background: url(//research.stlouisfed.org/images/mail-logo-large.png) top left no-repeat;
    background-size: 50px 50px;
}

i.bigger {
    font-size: 120%;
    color: #939598;
}

a.series-button:visited {
    color: #000000;

}

.save-share .series-button {
    margin-left: 5px;
    /*    padding-top:4px;
    */
}

#show-options {
    margin-left: 34px;
}

.save-share h4 {
    margin-top: 0;
}

#share-col-1 .series-button {
    padding: 5px;
    margin-left: 0;
    margin-right: 5px;
}

#share-col-2 .fred-help {
    margin-left: 0;
    margin-right: 0;
}

#customize-help {
    margin-top: -4px;
}

#units-help {
    padding-top: 5px;
}

#copy-link-code,
#copy-link-code > i,
#copy-embed-code,
#copy-embed-code > i,
#copy-image-code,
#copy-image-code > i {
    font-size: 13px;
    line-height: 15px;
    height: 15px !important;
}

.permalinks {
    margin: 0 -15px 0 -10px;
}

.page-permalink-container {
    margin-bottom: 15px;
}

.save-share .embed-input-container {
    width: 97%;
}

#save-share-tab {
    background-color: #FFFFFF;
    padding-bottom: 15px;
    padding-left: 25px;
}

.save-share ul.dropdown-menu {
    width: 200px;
}

.save-share .dropdown-menu > li > a {
    padding: 7px;
}

.permalinks .fred-help .fa {
    margin-top: 3px;
}

/*.permalinks .series-button{width:100%;}*/
.social-links {
    text-align: center;
}

.round-button {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 2px solid #A7A9AC;
    border-radius: 40px;
    margin-right: 10px;
    background-color: #A7A9AC;
}

.no-color a {
    background-color: #A7A9AC !important;
    border: 2px solid #A7A9AC !important;

}

.account-dropdown {
    margin-left: 5px;
}

.social-links a {
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 2px solid #A7A9AC;
    border-radius: 35px;
    margin-right: 5px;
    background-color: #A7A9AC;
}

.social-links .tooltip {
    z-index: 1901;
}

.social-links a.share-twitter {
    background: #55acee;
    border-color: #55acee;
}

.social-links a.share-reddit {
    background: #ff5700;
    border-color: #ff5700;
}

.social-links a.share-facebook {
    background: #3b5998;
    border-color: #3b5998;
}

.social-links a.share-linkedin {
    background: #0077b5;
    border-color: #0077b5;
}

.social-links a.share-pinterest {
    background: #cb2027;
    border-color: #cb2027;
}

.label-default {
    background-color: #f4f4f4;
    color: #555555;
    margin-bottom: 20px;
    margin-right: 20px;
}

.label {
    font-size: 10px;
    font-weight: normal;
}

.social-links a i {
    padding: 3px;
    font-size: 20px;
    color: white;
}

.lighter-text {
    color: #58595B;
}

.readonly {
    cursor: text !important;
}

#series-error {
    margin: 1em;
}

.settings-bar span {
    cursor: pointer;
    cursor: hand;
}

.apply-saved-settings-sign-in iframe,
.save-settings-sign-in iframe {
    width: 100%;
    height: 250px;
    border: 0;
}

.accordion-group {
    border: 0;
    background: #FFF;
}

.dropdown-menu > li > a {
    white-space: normal;
}

.dropdown-menu {
    z-index: 1901;
}

.color {
    border: 1px solid #999;
    cursor: pointer;
    cursor: hand;
    width: 16px;
    height: 16px;
    display: block;
    float: left;
    margin-right: .5em;
    margin-top: 8px;
}

#color-options .color {
    margin-top: 0;
}

.popover .color {
    margin: .25em;
}

.color .popover-content {
    width: 150px;
}

.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
    padding-top: 0;
}

.move-series {
    float: right;
    margin-top: 10px;
}

.copyright-indicator {
    color: #B94A48;
    font-weight: bold;
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
}

.ie9-fix {
    display: none;
}

.ie9 .ie9-fix {
    display: inline-block !important;
    width: 0;
    height: 0;
}

.datepicker-years .disabled {
    visibility: hidden;
}

.datepicker-years .new,
.datepicker-years .old {
    color: inherit !important;
}

#zoom-controls {
    padding-bottom: 3px;
    margin-top: 3px;
}

.ui-menu-item {
    font-family: "Lucida Sans", Lucida, verdana, arial, sans-serif !important;
    font-size: 0.9em !important;
    border-bottom: 1px solid #ddd;
}

.ui-menu-item:last-child {
    border: none;
}

.ui-menu-item .fa-star, .ui-menu-item .fa-none {
    color: #DDD;
    float: left;
    margin-right: 5px;
    margin-top: 3px;
}

.ui-menu-item span.recent-series {
    overflow: hidden;
    display: block; /* this makes the text wrap aligned with the icon margin */
}

.ui-autocomplete-category {
    font-family: "Lucida Sans", Lucida, verdana, arial, sans-serif !important;
    font-size: 0.8em !important;
    padding: 5px 12px;
    color: #999;
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
    background: #EEE !important;
    color: inherit !important;
    border-color: #EEE !important;
}

/*
   >>> Highcharts Overrides <<<
*/

.highcharts-subtitle {
    line-height: 1em !important;
}

.highcharts-container {
}

.highcharts-tooltip {
    z-index: 100;
    opacity: .9;
}

.highcharts-tooltip span {
    background-color: #fff;
    opacity: .9;
    z-index: 102 !important;
    padding: 3px 5px;
}

.select2-fred-series-title {

}

.select2-fred-series-subtitle {
    color: #999;
    font-size: .9em;
}

.select2-fred-series-popularity {

}

/*
   >>> Bootstrap overrides <<<
*/

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2,
.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4,
.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8,
.col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10,
.col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    padding: 0;
}

.input-sm, .form-group-sm .form-control {
    height: 34px;
}

#graph-date-range .form-control {
    display: inline;
}

input[type="radio"], input[type="checkbox"] {
    margin: 3px 0 0;
}

.settings-col {
    padding-right: 30px;
    padding-left: 30px;
}

#show-label {
    margin-top: 17px;
    margin-left: -15px;
    padding-right: 5px;
}

#color-group-label {
    margin-top: 22px;
    padding-right: 5px;
}

.color-label {
    float: left;
    padding-right: 5px;
}

#color-options .color-label {
    margin: 0;
}

label.control-label {
    margin-right: 8px;
    margin-top: 8px;
    font-weight: normal;
}

.ui-menu .ui-menu-item {
    padding: 10px;
    /*width:100%;*/
}

#add-series-container ul.ui-autocomplete {
    z-index: 200 !important;
    max-height: 350px;
    position: relative;
}

.input-divider {
    margin: 8px 10px 0 10px;
}

.copy-integer-periods {
    margin-left: 5px;
}

.integer-periods {
    margin-left: 15px;
}

.integer-periods label {
    margin: 8px 10px 0 0;
    font-weight: normal;
}

.margin-20 {
    margin-left: 20px;
    margin-right: 20px;
}

#settings-col2 label.control-label {
    margin: 0;
}

#settings-col-2 input {
    padding-top: 3px;
    padding-bottom: 3px;
}

div.scale-pos-options {
    padding-left: 5px;
    margin-top: 10px;
}

.form-control {
    width: auto;
    font-size: 12px;
}

#date-custom-range {
    padding-left: 10px;
}

#date-custom-range .date-seperator {
    margin: 8px 5px 0 5px;
}

#date-custom-range input[type="text"].form-control {
    width: 85px;
}

#graph-settings input[type="text"].form-control {
    width: 80px;
}

.integer-periods input[type="text"].form-control {
    width: 70px;
}

#user-def-line-col1 input[type="text"].form-control {
    width: 85%;
    float: left;
}

.highcharts-legend-item span {
    /*width: 500px;*/
}

div.related-resource img {
    width: 200px;
    padding-bottom: 5px;
}

.form-horizontal .form-group-sm {
    margin-right: -17px;
}

.form-horizontal .form-group-sm .control-label {
    margin: 8px 0 0 0;
    padding: 0;
}

.form-group .text-label {
    margin-top: 5px;
}

#mobile-meta-icons {
    display: none;
}

#download-button span {
    color: #ffffff;
    text-transform: uppercase;
}

.meta-col {
    display: block;
}

div#settings-col4 {
    padding-right: 0;
}

#settings-col3, #settings-col4 {
    padding-top: 15px;
}

.scale-top-pad {
    padding-top: 5px;
}

.series-group-edit {
    margin: 0 0 25px 15px;
}

div.panel.time-series {
    padding-bottom: 30px;
}

.series-group-edit .row > * {
    margin-right: 25px;
}

.series-group-edit .right-border {
    padding-right: 45px;
}

.series-group-edit .form-group-sm .form-control {
    padding: 5px 2px;
}

.overlay-panel-content .series-group-edit label.control-label.pull-left {
    margin: 0;
}

.log-scale {
    padding-right: 10px;
}

#log-scale-control .form-group {
    margin: 0;
}

#log-scale-options .log-scale {
    margin: 0;
    padding: 0;
}

@media only screen and (min-width: 1200px) {

    nav#tab-nav {
        display: block !important;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .series-group span.color-label, .series-group .color {
        margin-top: 0;
    }

    .form-horizontal .form-group {
        margin-right: -25px;
        margin-left: -25px
    }

    .meta-col {
        max-width: 170px;
    }

    nav#tab-nav {
        display: block !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    #settings-col1 {
        padding-left: 10px;
    }

    .series-title #series-title-text-container {
        width: 100%;
    }

    #font {
        width: 100px;
    }

    .series-group span.color-label, .series-group .color {
        margin-top: 0;
    }

    #date-quick-range {
        padding: 0 25px 0 0;
    }

    #download-button {
        margin-top: 15px;
        margin-left: 0;
    }

    #edit-button-container a.overlay-btn-large {
        padding: 10px 7px;
        margin-top: 7px;
    }

    nav#tab-nav {
        display: none;
    }

    .meta-col {
        margin-right: 5px;
        padding-right: 5px;
        max-width: 170px;
    }

    #tab-nav {
        position: absolute;
        z-index: 200;
        /*background-color: whitesmoke;*/
        margin: 0;
        padding: 0;
        border: 2px solid #e2e2e2;
        border-left: none;
        top: -10px;
    }

    #nav-tab-toggle {
        /*        display:block!important;
                position: absolute;
                z-index: 1000;
                color: #364D72;
                top:-10px;
                width:175px;*/
    }

    .nav-drawer-open {
        left: 175px;
    }

    div.btn-group.share-dropdown {
        display: block !important;
        margin-bottom: 10px;
    }

}

/* Extra Small Devices, Phones */
@media only screen and (max-width: 767px) {
    .graph-footer-embed {
        display: none;
    }

    .settings-col {
        height: auto;
    }

    .save-share .series-button {
        margin-right: 0;
        margin-left: 0;
    }

    .save-share {
        padding-left: 7px !important;
    }

    .overlay-panel-content .series-title-text {
        padding-left: 8px;
    }

    .save-share .dropdown-menu {
        width: 100%;
    }

    .social-links a {
        margin-right: 0
    }

;
    nav#tab-nav {
        display: none;
    }

    .series-page #content-container .site-breadcrumbs {
        display: none;
    }

    .form-control {
        width: 100%;
    }

    .info-icon {
        display: none;
    }

    .right-border, .section-side {
        border: none;
    }

    #research-nav {
        height: 100%;
    }

    .graph-recession-text {
        display: none;
    }

    .graph-credits-text {
        display: none;
    }

    .series-group .row {
        padding: 0;
    }

    .series-title #series-title-text-container {
        width: 100%;
    }

    #user-def-line-col1 div.input-col-divider {
        padding: 0 5px 0 5px;
    }

    .related-resource {
        margin-bottom: 0;
        height: 130px;
    }

    div.related-resource img {
        float: left;
        margin-right: 10px;
        width: 150px;
    }

    .related-resource-title {
        margin-top: 10px;
        width: 41%;
    }

    #share-col-2 {
        padding: 0;
        border: none;
        min-height: 0;
    }

    #date-custom-range input[type="text"].form-control {
        width: 70px;
        padding: 1px 4px;

    }

    .normalize-by-date #nbd-recession-label {
        width: 100%;
    }

    .normalize-by-date .margin20 {
        margin-left: 8px;
        margin-right: 8px;
    }

    .fa-cog {
        font-size: 2em
    }

    input.nbd {
        width: 120px;
    }

    .aggregation-select {
        padding: 0;
    }

    .series-button {
        width: 100%;
    }

    div.btn-group.share-dropdown {
        display: block !important;
        margin-bottom: 10px;
    }

    .meta-button-round {
        display: inline-block;
        width: 34px;
        height: 34px;
        background-color: #55acee;
        border-radius: 34px;
        margin: 0;
        color: #ffffff;
    }

    #date-quick-range {
        padding-top: 0;
    }

    #date-quick-range span.link {
        font-size: 12px;
        padding: 0 3px 0 3px;
    }

    .controls-row {
        margin: 0;
        padding: 0;
    }

    #date-custom-range {
        display: none;
    }

    #download-button-container {
        display: none;
    }

    #download-button span {
        display: none;
    }

    #download-button {
        margin: 0;
        padding: 2px 3px 0 5px;
        margin: 0;
        height: 34px;
        font-size: 140%;

    }

    #mobile-meta-icons {
        display: block;
    }

    #meta-download-button-sm, #meta-twitter-button-sm {
        margin-right: 10px;
    }

    #download-button .fa {
        margin-left: -2px;
    }

    .section {
        border: none;
    }

    #mobile-meta-col {
        display: block !important;
        padding-bottom: 10px;
        color: #58595B;
        border-bottom: 1px solid #e1e9f0;
    }

    #cal-button-container {
        display: block !important;
        padding-right: 10px;
        padding-top: 5px;

    }

    #cal-button-container .fa {
        color: #364D72;
    }

    a.edit-icon-toggle {
        display: block !important;
        padding-top: 5px;
        padding-left: 6.5px;
        height: 34px;
        width: 34px;
        /*        background-color:#FFFFFF !important;
        */
    }

    .edit-icon-toggle .fa {
        color: #ffffff;
    }

    .overlay-btn-large {
        display: none;
    }

    .meta-col {
        display: none;
    }

    #meta-right-col {
        padding-top: 10px;
    }

    div#series-meta-row.row.series-attributes {
        padding: 10px 5px 10px 10px;
    }

    .series-title {
        padding-left: 10px;
    }

    span.series-meta-observation-value {
        font-size: 120%;
    }

    #tab-nav {
        position: absolute;
        z-index: 100;
        /* background-color: whitesmoke;*/
        margin: 0;
        padding: 0;
        border: 2px solid #e2e2e2;
        border-left: none;
        top: -10px;
    }

    #nav-tab-toggle {
        /*        display:block!important;
                position: absolute;
                z-index: 1000;
                color: #364D72;
                top:-10px;
                width:175px;*/
    }

    .nav-drawer-open {
        left: 175px;
    }

    #tab-nav ul.nav-tabs {
        margin: 0;
    }

    #meta-twitter-button-sm .fa {
        color: #ffffff;
        padding: 5px 6px 0 6px;
    }

    #log-scale-options .log-scale {
        padding-left: 20px;
    }

    .control-label {
        color: #777;
        font-weight: bold;
    }

    .button-container {
        text-align: center;
        padding: 0;
    }

    .remove-series {
        float: right !important;
        margin-top: 25px;
    }

    .customize-data .button-container button {
        margin: 0 auto;
        margin-top: 10px;
        float: none !important;
    }

    .two-col-notes {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }

    #add-series-button {
        margin: 0 auto;
        margin-top: 10px;
        float: none !important;
    }

    #add-trendline-container {
        margin-top: 25px;
    }

    h4.section-title {
        padding-bottom: 10px;
    }

    #add-series-container .col-xs-12 {
        text-align: center;
    }

    #add-trendline-container div.padding-l25 {
        padding-left: 0;
    }

    #settings-col2 {
        display: none;
    }

    #save-col-1 .export-button-container {
        width: 50%;
        padding-bottom: 10px;
    }

    .select2-fred-series-subtitle {
        font-size: .8em;
    }

    .highcharts-legend {
        /*left: 25px !important;*/
    }

    .highcharts-legend-item span {
        font-size: 10px !important;
        /*white-space: normal !important;*/
        /*width: 250px !important;*/
    }

}

@media only screen and (max-width: 479px) {

    #date-quick-range {
        text-align: center;
        padding-right: 0;
    }
}

@media only screen and (max-width: 375px) {
    .collapsable-btn-text {
        display: none;
    }
}

@media only screen and (max-width: 320px) {
    #logo-replacement {
        font-size: 1.5em;
    }

    #cal-button-container {
        width: 9%;
    }

    #edit-button-container {
        width: 9%
    }

    #date-quick-range {
        text-align: center;
        padding-right: 0;
    }

    #date-custom-range {
        padding: 0;
    }

    #share-col-2 {
        width: 43%;
    }

    #share-col-1 {
        width: 57%;
    }
}

/******** BACK TO TOP BUTTON *****/
.back-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 60px;
    right: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: rgba(54, 77, 114, 0.8) url(../images/back-top-arrow.svg) no-repeat center 50%;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .3s 0s, visibility 0s .3s;
    -moz-transition: opacity .3s 0s, visibility 0s .3s;
    transition: opacity .3s 0s, visibility 0s .3s;
}

.back-top.back-is-visible, .back-top.back-fade-out, .no-touch .back-top:hover {
    -webkit-transition: opacity .3s 0s, visibility 0s 0s;
    -moz-transition: opacity .3s 0s, visibility 0s 0s;
    transition: opacity .3s 0s, visibility 0s 0s;
}

.back-top.back-is-visible {
    visibility: visible;
    opacity: 1;
}

.back-top.back-fade-out {
    opacity: .5;
}

.no-touch .back-top:hover {
    background-color: rgba(128, 179, 236, 1);
    opacity: 1;
}

@media only screen and (min-width: 768px) {
    .back-top {
        right: 20px;
        bottom: 60px;
    }
}

@media only screen and (min-width: 1024px) {
    .back-top {
        height: 60px;
        width: 60px;
        right: 30px;
        bottom: 60px;
    }
}

/******** END BACK TO TOP BUTTON *****/

/******** TRAY OVERLAY *****/
ul#tabbed-menu-overlay.nav.nav-tabs {
    margin-right: 50px;
}

.fa-cog {
    /*    font-size:130%;
    */
}

.overlay-panel-content .series-title-background {
    margin-left: -15px;
    margin-right: -15px;
    display: table;
}

.overlay-panel-content .series-title-text {
    display: table-cell;
    vertical-align: middle;
}

.overlay-panel-content .title-series-remove {
    display: table-cell;
    vertical-align: middle;
    float: none;
    padding-right: 10px;
}

.overlay-panel .panel-heading {
    line-height: 21px;
    height: 21px;
    margin-bottom: 10px;
}

.overlay-panel-content label.control-label {
    margin-bottom: 5px;
}

.overlay-panel-content label.control-label.pull-left {
    margin: 8px 10px 0 0;
}

.input-group-addon .series-button {
    margin-left: 5px;
    vertical-align: top;

}

.overlay-panel-content h4 {
    margin-top: 15px;
}

.overlay-panel-content div.scale-pos-options {
    padding: 0;
}

.overlay-panel-content div.controls-row {
    margin-top: 0;
    padding: 15px 0 15px 0;
}

.overlay-panel-content .section {
    margin: 0;
}

#graph-appearance .section {
    padding: 15px 0 15px 0;
}

.panel #graph-appearance {
    margin-bottom: 192px;
}

.series-transformation-group {
    margin: 0;
}

.input-group-addon {
    min-width: 40px;
    padding: 9px 12px;
    font-size: 13px;
    font-weight: normal;
    line-height: 1;
    color: #3498db;
    text-align: center;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 2px;
    text-align: left;
}

.controls-row > div {
    padding-right: 20px;
}

.controls-row > div:last-child {
    padding: 0;
}

label.control-label {
    margin: 0;
    font-weight: normal;
}

.scale-options {
    margin: 0;
}

div.scale-pos-options {
    margin: 0;
}

.input-group-addon, .input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

.input-group-addon, .input-group-btn, .input-group .form-control {
    display: table-cell;
}

.download-menu,
.datepicker,
.popover {
    z-index: 1901;
}

.overlay-btn {
    color: #FFFFFF;
    background-color: #d86342;
}

.overlay-panel-header *, .overlay-panel-header *::after, .overlay-panel-header *::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.overlay-panel-header .overlay-panel-close::before, .overlay-panel-header .overlay-panel-close::after {
    content: '';
}

.overlay-panel {
    /*  position: fixed;*/
    top: 0;
    left: 0;
    height: 100%;
    /*  width: 100%;*/
    z-index: 1900;
    visibility: hidden;
    overflow-x: hidden;
    -webkit-transition: visibility 0s 0.6s;
    -moz-transition: visibility 0s 0.6s;
    transition: visibility 0s 0.6s;
}

.overlay-panel::after {
    /* overlay layer */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    cursor: pointer;
    -webkit-transition: background 0.3s 0.3s;
    -moz-transition: background 0.3s 0.3s;
    transition: background 0.3s 0.3s;
}

.overlay-panel.is-visible {
    visibility: visible;
    -webkit-transition: visibility 0s 0s;
    -moz-transition: visibility 0s 0s;
    transition: visibility 0s 0s;
}

.overlay-panel.is-visible::after {
    background: rgba(0, 0, 0, 0.6);
    -webkit-transition: background 0.3s 0s;
    -moz-transition: background 0.3s 0s;
    transition: background 0.3s 0s;
}

.overlay-panel.is-visible .overlay-panel-close::before {
    -webkit-animation: overlay-close-1 0.6s 0.3s;
    -moz-animation: overlay-close-1 0.6s 0.3s;
    animation: overlay-close-1 0.6s 0.3s;
}

.overlay-panel.is-visible .overlay-panel-close::after {
    -webkit-animation: overlay-close-2 0.6s 0.3s;
    -moz-animation: overlay-close-2 0.6s 0.3s;
    animation: overlay-close-2 0.6s 0.3s;
}

@-webkit-keyframes overlay-close-1 {
    0%, 50% {
        -webkit-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(45deg);
    }
}

@-moz-keyframes overlay-close-1 {
    0%, 50% {
        -moz-transform: rotate(0);
    }
    100% {
        -moz-transform: rotate(45deg);
    }
}

@keyframes overlay-close-1 {
    0%, 50% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
    }
}

@-webkit-keyframes overlay-close-2 {
    0%, 50% {
        -webkit-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(-45deg);
    }
}

@-moz-keyframes overlay-close-2 {
    0%, 50% {
        -moz-transform: rotate(0);
    }
    100% {
        -moz-transform: rotate(-45deg);
    }
}

@keyframes overlay-close-2 {
    0%, 50% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
}

ul#tabbed-menu-overlay.nav.nav-tabs {
    background: rgba(0, 0, 0, 0.028);
}

.overlay-panel-header {
    position: fixed;
    height: 54px;
    background: #f5f5f5;
    width: 450px;
    z-index: 1903;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
    -webkit-transition: top 0.3s 0s;
    -moz-transition: top 0.3s 0s;
    transition: top 0.3s 0s;
    letter-spacing: 0.2px;
    color: #999999;
    font-size: 13px;
    background: #fafafa;
    border: 1px solid #e2e2e2;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    text-align: center;
    padding-top: 10px;
}

.overlay-panel-header h2 {
    /* font-weight: bold;
     padding-left: 5%;
     padding-top:20px;*/
}

.overlay-panel-header .panel-header-text {
    color: #999999;
    height: 100%;

}

.from-right .overlay-panel-header, .from-left .overlay-panel-header {
    top: -150px;
}

.from-right .overlay-panel-header {
    right: 0;
}

.from-left .overlay-panel-header {
    left: 0;
}

.is-visible .overlay-panel-header {
    top: 0;
    -webkit-transition: top 0.3s 0.3s;
    -moz-transition: top 0.3s 0.3s;
    transition: top 0.3s 0.3s;
}

.overlay-panel-close {
    position: absolute;
    top: 10px;
    right: 0;
    height: 44px;
    width: 50px;
    background-color: #F1F2F2;
    /* image replacement */
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

.overlay-panel-close::before, .overlay-panel-close::after {
    position: absolute;
    top: 20px;
    left: 18px;
    height: 3px;
    width: 20px;
    background-color: #424f5c;
    /* this fixes a bug where pseudo elements are slighty off position */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.overlay-panel-close::before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.overlay-panel-close::after {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.no-touch .overlay-panel-close:hover {
    /*  background-color: #424f5c;
    */
}

.overlay-panel-container {
    position: fixed;
    height: 100%;
    z-index: 1902;
    top: 0;
    width: 450px;

    background-color: rgba(255, 255, 255, 1);
    /*background: #dbe2e9;*/
    /*background-color:white;*/
    max-width: 100%;
    overflow-x: hidden;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    transition-delay: 0.3s;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22);
}

.from-right .overlay-panel-container {
    right: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    -moz-transform: translate3d(100%, 0, 0);
    -ms-transform: translate3d(100%, 0, 0);
    -o-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
}

.from-left .overlay-panel-container {
    left: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    -moz-transform: translate3d(-100%, 0, 0);
    -ms-transform: translate3d(-100%, 0, 0);
    -o-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
}

.is-visible .overlay-panel-container {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
}

#overlay-tabs {
    float: none;
    background: #FFFFFF;
    cursor: pointer;
    height: 100%;
}

.overlay-panel-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-top: 50px;
    overflow: auto;
    z-index: 1100;
    /* smooth scrolling on touch devices */
    -webkit-overflow-scrolling: touch;
}

@media only screen and (max-width: 450px) {
    .overlay-panel-header {
        width: 320px;
    }

    .overlay-panel-container {
        width: 320px;
    }

    .nav > li > a {
        padding-top: 5px;
    }

    .nav-tabs li {
        width: 33.3%;
    }

}

@media only screen and (max-width: 991px) {
    .overlay-panel-content {
        padding-top: 60px;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    .is-visible .overlay-panel-header {
        right: 20px;
    }

    .is-visible .overlay-panel-container {
        right: 20px;
    }
}

@supports (-ms-accelerator:true) {
    /* IE Edge 12+ CSS styles go here */
    .is-visible .overlay-panel-header {
        right: 20px;
    }

    .is-visible .overlay-panel-container {
        right: 20px;
    }
}

/******** END TRAY OVERLAY *****/

/******** EDIT GRAPH BUTTON BADGE  *****/

.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 6px;
    font-size: 10px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1;
    vertical-align: baseline;
    white-space: nowrap;
    text-align: center;
    background-color: #777777;
    border-radius: 10px;
    position: fixed;
    top: 5px;
}

.badge.badge-hero {
    position: relative;
    top: -12px;
    margin-left: -10px;
    padding: 2px 5px;
    font-size: 11px;
}

.badge .badge-hero .badge-danger {
    background-color: #df5640;
}

.badge-primary {
    /*background-color: #3498db;*/
    background-color: #364D72;
    /*padding: .2em 0.85em .3em;*/
    border-radius: 1em;

}

.save-graph-modal-btn,
.add-to-dashboard,
.add-datalist,
.email-notify-container {
    cursor: pointer;
}

/******** END EDIT GRAPH BUTTON BADGE  *****/
.chart-modal {
    position: fixed;
    width: 100vw !important;
    height: 100vh !important;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1904 !important;
}

.chart-modal #graph-container {
    height: 485px;
    z-index: 1901;
}

/******** START FULLSCREEN GRAPH BUTTON   *****/
#fullscreen-btn {
    position: absolute;
    z-index: 1;
    right: 0;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;

}

#fullscreen-btn-icon {
    font-size: 18px;
    cursor: pointer;
}

.padding-btm20 {
    padding-bottom: 20px;
}

.padding-top20 {
    padding-top: 20px;
}

.embed-container-responsive {
    display: table;
}

/******** END FULLSCREEN GRAPH BUTTON   *****/

/******** START CONVERTED FROM INLINE STYLES *****/
.clear-both {
    clear: both;
}

.color-picker-pale-blue {
    background: #4572A7
}

.color-picker-rust {
    background: #AA4643
}

.color-picker-mid-green {
    background: #89A54E
}

.color-picker-light-purple {
    background: #80699B
}

.color-picker-turquoise {
    background: #3D96AE
}

.color-picker-light-orange {
    background: #DB843D
}

.color-picker-light-blue {
    background: #92A8CD
}

.color-picker-light-brown {
    background: #A47D7C
}

.color-picker-light-green {
    background: #B5CA92
}

.color-picker-white {
    background: #FFFFFF
}

.color-picker-blue {
    background: #0000FF
}

.color-picker-red {
    background: #FF0000
}

.color-picker-green {
    background: #006600
}

.color-picker-orange {
    background: #FF6600
}

.color-picker-purple {
    background: #6400C8
}

.color-picker-lavender {
    background: #CB4AC5
}

.color-picker-gold {
    background: #D6AE00
}

.color-picker-mid-blue {
    background: #336699
}

.color-picker-pink {
    background: #DD4477
}

.color-picker-brown {
    background: #660000
}

.color-picker-black {
    background: #000000
}

.color-picker-light-black {
    background: #444444
}

.color-picker-dark-grey {
    background: #666666
}

.color-picker-grey {
    background: #999999
}

.color-picker-light-grey {
    background: #CCCCCC
}

.padding-bottom-0 {
    padding-bottom: 0
}

.display-none {
    display: none
}

.position-absolute {
    position: absolute
}

.right-0 {
    right: 0px
}

.padding-right-15 {
    padding-right: 15px
}

.position-relative {
    position: relative
}

.top-50-percent {
    top: 50%
}

.text-align-center {
    text-align: center
}

.z-index-1900 {
    z-index: 1900
}

.z-index-5000 {
    z-index: 5000
}

.margin-right-1em {
    margin-right: 1em
}

.color-inherit-imp {
    color: inherit !important
}

.display-inline-block {
    display: inline-block
}

.text-transform-lower {
    text-transform: lowercase
}

.padding-top-10 {
    padding-top: 10px
}

.margin-top-10 {
    margin-top: 10px
}

.width-100-perc {
    width: 100%
}

.right-20 {
    right: 20px
}

.width-191 {
    width: 191px
}

.position-fixed {
    position: fixed
}

.bottom-0 {
    bottom: 0
}

.width-105 {
    width: 105px
}

.font-size-85 {
    font-size: .85em
}

.line-height-1-half {
    line-height: 1.5em
}

.max-height-200 {
    max-height: 200px
}

.overflow-auto {
    overflow: auto
}

.padding-btm20 {
    padding-bottom: 20px;
}

.padding-top20 {
    padding-top: 20px;
}

.embed-container-responsive {
    display: table;
}

/******** END CONVERTED FROM INLINE STYLES *****/
#fullscreen-btn {
    position: absolute;
    z-index: 1;
    right: 0;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;

}

#fullscreen-btn-icon {
    font-size: 18px;
    cursor: pointer;
}

.info-icon {
    display: none;
}

#zoom-and-share {
    background-color: rgb(225, 233, 240) !important;
    min-height: 350px;
}

#save-share-tab {
    padding-top: 10px;
}

.loading-ring {
    display: inline-block;
    position: absolute;
    left: 48%;
    top: 250px;
    width: 64px;
    height: 64px;
}

.loading-ring:after {
    content: " ";
    display: block;
    width: 46px;
    height: 46px;
    margin: 1px;
    border-radius: 50%;
    border: 5px solid #4572A7;
    border-color: #4572A7 transparent #4572A7 transparent;
    animation: loading-ring 1.2s linear infinite;
}

@keyframes loading-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
