table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    background-color: #103d65;
}
.invis {
    clip: rect(1px,1px,1px,1px);
    height: 1px;
    margin: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
}
.table-responsive {
    padding-right: 2px;
}

.caption {
    color: #333;
    font-size: 1.1em;
    font-weight: 700;
    /*padding: 4px 0;*/
}
table {
    /*padding-top: 3px;*/
}
.shaded {
    background-color: #f5f5f5;
    padding: 10px 15px;
}
.keyFindingsTextHeader {
    font-size: 22px;
    font-weight: bold;
}
.keyFindingsIcon {
    text-align: center;
    margin-top: 15px;
    margin-bottom: 15px;
    /*flex: 0 0 20%;*/
}
caption {
    text-align: left;
}

/*fig1-4*/
#fig1Container .c, #fig1Container .n, #fig2Container .c, #fig2Container .n, #fig3Container .c, #fig3Container .n, #fig4Container .c, #fig4Container .n    {
    font-size: 16px;
}
#fig1Container .c text:lang(fr), #fig2Container .c text:lang(fr), #fig3Container .c text:lang(fr), #fig4Container .c text:lang(fr) {
    transform: translate(-5px, 0) rotate(-45deg);
    text-anchor: end;
}
#fig1Container .c-axis-title:lang(fr), #fig2Container .c-axis-title:lang(fr), #fig3Container .c-axis-title:lang(fr), #fig4Container .c-axis-title:lang(fr) {
    transform: translate(0, 35px)
}


#fig5Container .legend text {
    font-size: small;
}

#fig5Container .n-axis-title, #fig5Container .c-axis-title{
    font-size: medium;
}
#fig5Container .legend-group[data-category="val0"] {
    transform: translate(100px, 0);
}

/*fig 6 custom grid rules and makeshift border*/
#fig6DisorderGrid {
    display: grid;
    grid-template-columns: 10px auto;
}
#fig6DisorderBorderWrapper {
    margin-bottom: 8px;
}
#fig6DisorderBorder {
    width: 100%;
    height: 100%;
    /*background-image: url('data:image/svg+xml,<svg width="10" height="10" xmlns="http://www.w3.org/2000/svg"><rect width="10" height="10" fill="%234e79a7"></rect><circle cx="5" cy="5" r="1" fill="%23343434" stroke="black" stroke-width="0"></circle><circle cx="0" cy="0" r="1" fill="%23343434" stroke="black" stroke-width="0"></circle><circle cx="0" cy="10" r="1" fill="%23343434" stroke="black" stroke-width="0"></circle><circle cx="10" cy="0" r="1" fill="%23343434" stroke="black" stroke-width="0"></circle><circle cx="10" cy="10" r="1" fill="%23343434" stroke="black" stroke-width="0"></circle></svg>');*/
    background-repeat: repeat;
    background-color: #f90;
}
#fig6Disorder {
    padding-left: 5px;
}
#fig6Container {
    display: block;
    margin: auto;
    max-width: 555px;
}
#fig6Container .c0 text {
    transform: translate(-5px, 0) rotate(-45deg);
    text-anchor: end;
}

#fig6Container .legend text {
  font-size: 10px;
}
#fig6Container .custom text {
    font-size: 10px;
}

#fig6Container .c0 text, #fig6Container .n text {
    font-size: 10px;
}

#fig6Container .n-axis-title, #fig6Container .c-axis-title{
    font-size: small;
}
#fig6Container .c-axis-title:lang(fr) {
    transform: translate(0, 0);
}

/*fig7*/
#fig7Container .bar-label {
    font-size: x-small;
}

#fig7Container .legend text {
  font-size: medium;
}

#fig7Container .n-axis-title, #fig7Container .c0 text, #fig7Container .c1 text{
    font-size: 16px;
}
#fig7Container .n text{
    font-size: 16px;
}
#fig7Container .c1 text{
    transform: translate(0, 55px);
}
#fig7Container .c1 text:lang(fr){
    transform: translate(0, 80px);
}
#fig7Container .c2 text {
    transform: translate(-5px, -3px) rotate(-45deg);
    text-anchor: end;
    font-size: 14px;
}
#fig7Container .c2 text:lang(fr) {
    transform: translate(-5px, -3px) rotate(-45deg);
    text-anchor: end;
    font-size: 14px;
}
#fig7Container .legend-group:first-of-type:lang(en) {
    transform: translate(70px, 0);
}
#fig7Container .legend-group:first-of-type:lang(fr) {
    transform: translate(100px, 0);
}

/*fig8*/
#fig8Container .legend text {
    font-size: 11px;
}
#fig8Container .n-axis-title, #fig8Container .c-axis-title{
    font-size: 13px;
}
#fig8Container .legend-group:first-of-type:lang(en) {
    transform: translate(15px, 0);
}
#fig8Container .legend-group:last-of-type:lang(en) {
    transform: translate(-90px, 0);
}
#fig8Container .legend-group:first-of-type:lang(fr) {
    transform: translate(80px, 0);
}
#fig8Container .legend-group:last-of-type:lang(fr) {
    transform: translate(-20px, 0);
}

/*fig9*/
#fig9Container .n-axis-title, #fig9Container .c-axis-title{
    font-size: 13px;
}

#fig9Container .legend text{
    font-size: 11px;
}
#fig9Container .c-axis-title {
    transform: translate(0, -20px);
}
#fig9Container .devText {
    transform: translate(0, 10px);
}
#fig9Container .hospText:lang(en) {
    transform: translate(0, 120px);
}
#fig9Container .hospText:lang(fr) {
    transform: translate(0, 140px);
}

/*fig10*/
#fig10Container .n-axis-title, #fig10Container .c-axis-title{
    font-size: 13px;
}

#fig10Container .legend text{
    font-size: 11px;
}
#fig10Container .c-axis-title {
    transform: translate(0, -20px);
}
#fig10Container .devText {
    transform: translate(0, 5px);
}
#fig10Container .hospText:lang(en) {
    transform: translate(0, 155px);
}
#fig10Container .hospText:lang(fr) {
    transform: translate(0, 165px);
}

/* Tooltip styling */
div.tooltip {
  background-color: white;
  color: black;
  border: 1px solid black;
  border-radius: 5px;
  padding: 10px;
  position: fixed;
  max-width: 200px;
}

#disorderDiv {
    padding-top: 0;
}

/*match the figure headers so that they arent offset when taking half the page*/
@media all and (min-width: 991px) {
    #fig4:lang(fr) {
        min-height: 138.56px;
    }
    #disorderDiv {
        padding-top: 30px;
    }
}
@media all and (min-width: 1200px) {
    #fig4 {
        min-height: 85.54px;
    }
    #fig2:lang(fr) {
        min-height: 112.17px;
    }
    #fig4:lang(fr) {
        min-height: 112.17px;
    }
}

/*for smaller widths*/
@media all and (max-width: 991px) {
    select {
        max-width: 300px;
        text-overflow: ellipsis;
    }
    
    /*fig1-4*/
    #fig1Container .c, #fig1Container .n, #fig2Container .c, #fig2Container .n, #fig3Container .c, #fig3Container .n, #fig4Container .c, #fig4Container .n    {
        font-size: 13px;
    }
    #fig1Container .c text:lang(fr), #fig2Container .c text:lang(fr), #fig3Container .c text:lang(fr), #fig4Container .c text:lang(fr) {
        transform: translate(0px, 0) rotate(0deg);
        text-anchor: middle;
    }
    #fig1Container .c-axis-title:lang(fr), #fig2Container .c-axis-title:lang(fr), #fig3Container .c-axis-title:lang(fr), #fig4Container .c-axis-title:lang(fr) {
        transform: translate(0, 0)
    }
    
    /*figure5*/
    #fig5Container .c text, #fig5Container .n text {
        font-size: 13px;
    }
    #fig5Container .c-axis-title, #fig5Container .n-axis-title {
        font-size: 20px;
    }
    #fig5Container .legend text {
      font-size: 20px;
    }
    #fig5Container .legend text:lang(fr) {
      font-size: 18px;
    }
    #fig5Container .legend-group[data-category="val0"] {
        transform: translate(0, 0);
    }
    
    /*figure6*/
    #fig6Container .legend text {
      font-size: 14px;
    }
    #fig6Container .legend circle {
        r: 8;
    }
    #fig6Container .custom text {
        font-size: 14px;
    }
    #fig6Container .custom line {
        stroke-width: 8;
    }
    #fig6Container .c0 text, #fig6Container .n text {
        font-size: 13px;
    }
    #fig6Container .c-axis-title, #fig6Container .n-axis-title{
        font-size: 16px;
    }
    #fig6Container .c-axis-title:lang(fr) {
        transform: translate(0, 10px);
    }
    
    /*figure7*/
    #fig7Container .bar-label {
        font-size: x-small;
    }
    #fig7Container .legend text {
      font-size: 20px;
    }
    #fig7Container .n-axis-title, #fig7Container .c0 text, #fig7Container .c1 text{
        font-size: 20px;
    }
    #fig7Container .c2 text{
        transform: translate(-5px, -3px) rotate(-45deg);
        text-anchor: end;
        font-size: 16px;
    }
    #fig7Container .c2 text:lang(fr) {
        transform: translate(-5px, -3px) rotate(-45deg);
        text-anchor: end;
        font-size: 16px;
    }
    #fig7Container .legend-group:last-of-type:lang(en) {
        transform: translate(70px, 0);
    }
    #fig7Container .legend-group:first-of-type:lang(fr) {
        transform: translate(0, 0);
    }
    #fig7Container .legend-group:last-of-type:lang(fr) {
        transform: translate(0, 0);
    }
    
    /*figure8*/
    #fig8Container .n-axis-title, #fig8Container .c-axis-title{
        font-size: 16px;
    }
    #fig8Container .legend text {
        font-size: 14px;
    }
    #fig8Container .legend text:lang(fr) {
        font-size: 14px;
    }
    #fig8Container .n, #fig8Container .c0{
        font-size: 13px;
    }
    #fig8Container .legend-group:last-of-type:lang(en) {
        transform: translate(-40px, 0);
    }
    #fig8Container .legend-group:first-of-type:lang(fr) {
        transform: translate(30px, 0);
    }
    #fig8Container .legend-group:last-of-type:lang(fr) {
        transform: translate(0, 0);
    }
    
    /*figure9*/
    #fig9Container .n-axis-title, #fig9Container .c-axis-title{
        font-size: 16px;
    }
    #fig9Container .legend text {
        font-size: 14px;
    }
    #fig9Container .legend text:lang(fr) {
        font-size: 14px;
    }
    #fig9Container .n, #fig9Container .c{
        font-size: 13px;
    }
    #fig9Container .c text{
        transform: translate(-5px, 0) rotate(-45deg);
        text-anchor: end;
    }
    #fig9Container .c-axis-title:lang(en) {
        transform: translate(0, 0px);
    }
    #fig9Container .c-axis-title:lang(fr) {
        transform: translate(0, 5px);
    }
    #fig9Container .devText {
        transform: translate(0, 0px);
    }
    #fig9Container .hospText:lang(en) {
        transform: translate(0, 120px);
    }
    #fig9Container .hospText:lang(fr) {
        transform: translate(0, 130px);
    }
    
    /*figure10*/
    #fig10Container .n-axis-title, #fig10Container .c-axis-title {
        font-size: 16px;
    }
    #fig10Container .legend text {
        font-size: 14px;
    }
    #fig10Container .legend text:lang(fr) {
        font-size: 14px;
    }
    #fig10Container .n, #fig10Container .c {
        font-size: 13px;
    }
    #fig10Container .c text {
        transform: translate(-5px, 0) rotate(-45deg);
        text-anchor: end;
    }
    #fig10Container .c-axis-title:lang(en) {
        transform: translate(0, 0px);
    }
    #fig10Container .c-axis-title:lang(fr) {
        transform: translate(0, 5px);
    }
    #fig10Container .devText {
        transform: translate(0, 0px);
    }
    #fig10Container .hospText:lang(en) {
        transform: translate(0, 150px);
    }
    #fig10Container .hospText:lang(fr) {
        transform: translate(0, 160px);
    }
    
}