.selectedButton {
    background-color: #26374a;
    color: white;
}

.keyHighlightTile {
    padding: 0px 10px;
}
 
.keyHighlightTileInner {
    /*border-radius: 30px;*/
    border-radius: 15px;
    /*border: 2px solid #333;*/
    border: 3px solid #ccc;
    margin: 20px 0px;
    padding: 10px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    
    /*font-size: 24px;*/
}

@media (min-width: 1200px) {
    .keyHighlightTileInner {
        height: 150px;
        /*width: 30%;*/
    }
}

@media (max-width: 1199px) {
/*@media (min-width: 992px) {*/
    .keyHighlightTileInner {
        height: 170px;
        /*width: 30%;*/
    }
}

@media (max-width: 991px) {
    .keyHighlightTileInner {
        /*height: auto;*/
        height: 150px;
        /*max-width: 100%;*/
    }
}

.keyHighlightTileInner span {
    display: block;
}

.keyHighlightNumber {
    font-weight: 700;
    font-size: 30px;
    margin-top: 10px;
}


.keyObs {
    font-weight: bold;
}


.lineOnBargraph {
    fill: none;
    stroke: #333;
    /*stroke-width: 1.5px;*/
    /*stroke: #c79e53;*/
    /*stroke: #26374a;*/
    stroke-width: 2.5px;
    stroke-dasharray: 10 5;
    /*stroke-linecap: round;*/
}

.lineOnBargraphText {
    /*font-size: 18px;*/
    font-size: 14px;
    text-anchor: middle;
    /*z-index: 10 !important;*/
    /*color: #26374a;*/
}

.lineOnBargraphTextPerm {
    font-size: 12px;
    text-anchor: middle;
    /*z-index: 10 !important;*/
    /*color: #26374a;*/
    pointer-events:none;
}

.lineOnBargraphTextRect {
    fill: white;
    rx: 5;
    stroke: black;
    /*stroke: #26374a;*/
    stroke-width: 1px;
}

/*.indVisSVG .axes text {*/
/*    font-size: 16px !important;*/
/*}*/


/*.hoveredBar {*/
/*    opacity: 0.7;*/
/*    stroke: #333;*/
/*}*/

/*.hoverVal {*/
/*    text-anchor: middle;*/
/*    font-size: 16px;*/
/*    fill: #333;*/
    /*z-index: 100 !important;*/
/*}*/

.lineOnBargraphCI {
    fill: grey;
    /*fill: #A2B8D2;*/
    stroke: none;
    z-index: -1;
    opacity: 0.7;
}

.lineOnBargraphRect {
    opacity: 0;
    /*display: block;*/
    fill: white;
}

/* Tooltip styling */   
div.tooltip {
    background-color: white;
    color: black;
    border: 1px solid black;
    border-radius: 5px;
    padding: 10px;
    position: fixed;
    max-width: 200px;
    font-size: 20px;
    
    display:none !important;
    opacity:0 !important;
}

.ttFuncMapRect {
    /*padding: 5px;*/
    width: 15px;
    height: 15px;
    display: inline-block;
    
    /*border: 1px solid #333;*/
}

.ttFuncRect {
    /*padding: 5px;*/
    width: 15px;
    height: 15px;
    display: inline-block;
    
    /*border: 1px solid #333;*/
}

.tableContainer {
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: auto;
}

.titles {
    font-size: 18px;
}


.notesDl dt {
    min-width: 25%;
}

.notesDl dd {
    max-width: 75%;
}

/*Align to the right all data download buttons*/
.downloadDataBtn {
    text-align: right;
    /*background-color: darkgrey;*/
    /*color: white;*/
    /*border-radius: 5px;*/
    /*text-decoration: none;*/
    margin-bottom: 15px;
}

/*.downloadDataBtn:hover {*/
/*    background-color: #333;*/
/*    color: white;*/
/*}*/

.fa-download {
    color: white;
}

/*.dataSourceText {*/
/*    font-size: 16px;*/
/*}*/

.lineOnBargraphTextBoxPerm {
    fill: white;
    border-radius: 5px;
    opacity: 0.5;
    pointer-events: none;
}


.figInfo {
    font-size: 16px;
}

.hoverTextDiv {
    /*background-color: #eaebed;*/
    border-radius: 10px;
    margin-bottom: 15px;
    padding: 10px 15px;
}

.boldInnerHoverText {
    font-weight: bold;
}

.hoverFootnote {
    font-size: 16px;
    line-height: 1.1em;
}


/* Set max width for tab navigation to ensure that it remains in one row for French */
/*nav .list-inline li {*/
/*    max-width: 25%;*/
/*    text-align: center;*/
/*}*/

/*nav .list-inline li a {*/
/*    min-height: 78px;*/
/*    text-align: center;*/
    /*line-height: 56px;*/
/*}*/

/*.navText {*/
    /*min-height: 78px;*/
/*    line-height: 15px;*/
/*    text-align: center;*/
/*}*/

nav .list-inline {
    display: flex;
    align-items: stretch;
}

nav .list-inline li a {
    height:100%;
}



/* Bold all legend titles, as well as axis titles */
svg .titles, svg .legend-title {
    font-weight: bold;
}

/* Add outline to canada group in map when hovering */
.canadaGroup:hover {
    outline: 3px solid #333;
}

/* Style new previous/next buttons for navigating bargraphs */
#fig3BarNavButtons {
    display: flex;
    justify-content: center;
}

.barNavButtons {
    margin-bottom: 10px;
}

/*#fig3BarNavButtons button {*/
/*    background-color: #26374a;*/
/*    color: white;*/
/*}*/


/* Style current focus bar consistently... */
.currentFocusBar {
    stroke: #333;
    stroke-width: 2px;
}

/* Also style the focused bar's y label */
.currentFocusLabel {
    font-weight: bold;
}

/* Style current focused/hovered arc text and arc */
.focusedArcText {
    font-weight: bold;
    opacity: 1;
}

/*.focusedArc {*/
/*    border: 2px solid #333;*/
/*    opacity: 1;*/
/*}*/