/* Export button styling. Have to hide the previous one to create a new one */
.export {
    visibility: hidden;
    font-sze: 0px;
    width = 0px;
}
.export:before {
    content:'📥';
    visibility: visible;
    float: left;
}

/* Rotate text */
.rotateMe {
     transform: rotate(180deg);
     writing-mode: vertical-lr;
     text-align: center;
}

/* Turn a black svg white */
.svg-white {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%);
}

/* Provide the same colouring as the title */
.title-highlight {
    background: #EFEFEF;
/*    font-family: Roboto;
    font-weight: 300;
    font-size: 16.0px;*/
    color: rgba(84.00000259280205, 94.0000019967556, 117.00000062584877, 1.0);
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 2px;
    border-left-width: 2px;
    border-left-style: SOLID;
    border-left-color: rgba(1.952335238456726, 156.18750303983688, 102.8429938852787, 1.0);
    /*margin: 1px 0px 1px 1px;*/
    margin: 0 0 1px 0;
}

/* Summary card displays */
.summary-card {
    transition: box-shadow .3s;
    /* box-shadow: 0 0 11px rgba(150,150,150,.6); */
    border-top-left-radius: 25px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 2px;
    box-shadow: 0px 4px 4px rgb(0 0 0 / 25%);
    border-width: 2px;
    border-style: SOLID;
    border-color: rgba(84.00000259280205, 94.0000019967556, 117.00000062584877, 1.0);
}
.summary-card:hover {
  box-shadow: 0 0 11px rgba(50,50,50,.6);
}
.summary-card-graph {
    padding: 0.1vh 0 0.1vh 0;
}
.summary-card-graph-with-drop {
    padding: 0 0 0.1vh 0;
}
.summary-card-height {
    height: 29vh;
}
.summary-card-graph-height {
    height: 28.6vh;
}
.summary-card-with-drop-graph-height {
    height: 23.99vh;
}
.summary-card-with-drop-dropdown {
    padding: 0 0 0 0;
}
.summary-card-analysis-height {
    height: 40vh;
}
.summary-card-analysis-graph-height {
    height: 39.6vh;
}

/* Box-plot card displays */
.box-plot-card {
    height: 30vh;
    transition: box-shadow .3s;
    /* box-shadow: 0 0 11px rgba(150,150,150,.6); */
    border-top-left-radius: 25px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 2px;
    box-shadow: 0px 4px 4px rgb(0 0 0 / 25%);
    border-width: 2px;
    border-style: SOLID;
    border-color: rgba(84.00000259280205, 94.0000019967556, 117.00000062584877, 1.0);
}

.box-plot-card:hover {
  box-shadow: 0 0 11px rgba(50,50,50,.6);
}
.box-plot-card-graph {
    height: 29.5vh;
    padding: 0.01vh 0 0.01vh 0;
}


.above-all {
    position: relative;
    z-index: 9999;
}

/* Date picker style */
.DateInput_input {
    font-size: 12pt !important;
    font-weight: 200 !important;
    font-family: Roboto, sans-serif !important;
    padding: 2px 2px 0px 2px;
    text-align: center;
}

/* Collapse bar colour */
.bg-light {
    background-color: #efefef !important;
}

*{
    font-family: Roboto, sans-serif;
    font-weight: 200;
}

/* Vertically centre within container */
.vertical-centre {
  width: 100%;
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* Button styling */
.button-style {
    border-radius: 5px 25px 5px 25px;
    border: thick solid #ffffff;
    background-color: #029c67;
    border-radius: 5px 25px 5px 25px;
    background-color: gbl.COLOUR_HEADER;
    color: #ffffff;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 3px 10px 0 rgba(0,0,0,0.19);
}

/* Browser based widths */
.browser-width {
    width: -moz-available;          /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    width: fill-available;
}