.qld__body.qld__body--dark a:hover:visited, .qld__body.qld__footer--dark a:hover:visited, .qld__footer.qld__body--dark a:hover:visited, .qld__footer.qld__footer--dark a:hover:visited {
    color: var(--QLD-color-dark-link);
    -webkit-text-decoration-color: var(--QLD-color-dark-hover-underline);
    text-decoration-color: var(--QLD-color-dark-hover-underline);
    text-decoration-thickness: var(--QLD-underline__thickness-thick);
}


.qld__card a.qld__card--clickable__link:hover:visited {
    color: var(--QLD-color-light-link__visited) !important;
    -webkit-text-decoration-color: var(--QLD-color-light-hover-visited-underline);
    text-decoration-color: var(--QLD-color-light-hover-visited-underline);
    text-decoration-thickness: var(--QLD-underline__thickness-thick);
}


.qld__card a.qld__card--clickable__link:visited {
    color: var(--QLD-color-light-link__visited) !important;
    -webkit-text-decoration-color: var(--QLD-color-light-visited-underline);
    text-decoration-color: var(--QLD-color-light-visited-underline);
}


.qld__page-alerts .qld__page-alerts--heading.qld__display-lg {
    color: var(--QLD-color-light-heading);
    margin-bottom: 16px;
    margin-bottom: 1rem;
    margin-top: 16px;
    margin-top: 0rem;
}

h3.qld__a-z__list__item__header {
    display: inline-block;
    border: 1px solid var(--QLD-color-light-border);
    text-align: center;
    border-radius: 0.25rem;
    width: 4.25rem;
    height: 4.25rem;
    background-color: var(--QLD-color-light-background__shade);
    font-size: 2.5rem;
    line-height: 4.25rem;
}

.qld__body--full-width .qld__tab-content {
    border-bottom: none;
    border-left: none;
    border-right: none;
    padding: 0;
}

#Home-Page-Multicol div div{
    display:flex;
}

.qld__filter-card-list{
    row-gap: 32px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin: 0px;
    padding: 0px;   
}

.qld__filter-card-list li{
    display: flex;
}


.sq-form-question-select select:hover, .sq-form-question-datetime select:hover, .qld__select:hover, select:hover{
    background-color: var(--QLD-color-light-background__shade);
    border-color: var(--QLD-color-light-button__hover);
}

.qld__label+.qld__select, .qld__label+input, .qld__label+textarea, label+.qld__select, label+input, label+textarea{
    background-color:#ffffff;
}

.qld__page-alerts{
    max-width:46rem;
}


.qld__footer p.qld__footer__copyrightMessage::before {
    margin-top: 16px;
    margin-top: 1rem;
    font-size: .875rem;
    content: "The Queensland Poisons Information Centre is hosted and delivered by Children's Health Queensland.";
    display: block;
    margin-bottom: 16px;
}


/*   New Image gallery styles
----------------------------------------------------------------------------------------------------------

---------------------------------------------------------------------------------------------------------- */






/* Style for the gallery region */
.qld__image-gallery{
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Style for the main image */
#main-image {
    max-width: 100%;
    height: auto;
    aspect-ratio: 3/2;
    object-fit: cover;
    border-radius: 4px;
}


/* Style for the main image */
.qld__body img {
    max-width: 100%;
    height: auto;
    aspect-ratio: 3/2;
    object-fit: cover;
    border-radius: 4px;
}

/* Style for the thumbnail list */
.qld__image-gallery .thumbnails {
  display: flex;
   justify-content: space-evenly;
   column-gap: 16px;
}

/* Style for the list items */
.qld__image-gallery .thumbnails a {
    display: flex;
    margin-top: 1rem;
    border-radius: 4px;
}

.qld__image-gallery .thumbnails a:hover {
-webkit-box-shadow: 7px 6px 13px rgba(0,0,0,0.02), 0px 2px 5px rgba(0,0,0,0.1), 0px 13px 20px rgba(0,0,0,0.1);
    box-shadow: 7px 6px 13px rgba(0,0,0,0.02), 0px 2px 5px rgba(0,0,0,0.1), 0px 13px 20px rgba(0,0,0,0.1);
}

.qld__image-gallery .thumbnails a:focus {
  outline: 3px solid var(--QLD-color-light-focus);
  outline-offset:2px;
}

/* Style for the selected list item */
.qld__image-gallery .thumbnails a[aria-selected="true"]{
  outline: 3px solid var(--QLD-color-light-focus);
  outline-offset:2px;
}

/* Style for the thumbnail images */
.qld__image-gallery .thumbnails img {
    max-width: 100%;
    height: auto;
    object-fit: cover;
     border-radius: 4px;
}

/* Style for the figure */
figure {
    padding: 0px;
    margin: 0px;
}

/* Style for the caption */
.qld__image-gallery figcaption {
  margin-top: 0.5rem;
  font-style: italic;
  text-align: center;
}


.qld__image-gallery{
 margin-top:24px;   
}



/*   New Table styles
----------------------------------------------------------------------------------------------------------

We were missing some table styles that are in DTA and i have also updated tabs styles to cater for more 
complext table designs 

---------------------------------------------------------------------------------------------------------- */


.qld__table, table {
    border-collapse: collapse; /* Combine adjacent borders */
    border-spacing: 0; /* Set the border spacing to 0 */
    width:100%; /* Set the table to always span to the full width of the page */
    margin:0px; /* clears any margins set in global css */
}

.qld__table p.qld__caption {
    font-style: normal;
    color: var(--QLD-color-light-text__muted);
    display: block;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
    margin-top:8px;
}

/* When a table is in a container and follows another element it will have a margin top based on the space between components */

* + .qld__table {
    margin-top:24px;
    margin-top:1.5rem;
}

/* When a table container has 2 header rows they take on a striped style  */

.qld__table thead tr:nth-last-child{
      background-color: var(--QLD-color-light-background__shade);
}

.qld__table thead tr:nth-first-child{
      background-color: var(--QLD-color-light-background);
}


/* This sets the styles for the caption in table containers  */

.qld__table .qld__table__caption, .qld__table caption {
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 32px;
    text-align: left;
    display: table-caption;
    font-weight: 600;
    color: var(--QLD-color-light-heading);
    height: fit-content;
    padding: 12px;
    padding: 0.75rem;
    padding-bottom: 12px;    /* This is needed to override a setting in global css */
    padding-bottom: 0.75rem; /* This is needed to override a setting in global css */
    border-bottom: none;
    -webkit-box-shadow: inset 0 -1px 0 var(--QLD-color-light-border);
    box-shadow: inset 0 -1px 0 var(--QLD-color-light-border);
    background-color: var(--QLD-color-light-background);
}


/* When captions are within a tab container they are smaller then default */

.qld__tab-container .qld__table .qld__table__caption{
    font-size: 16px;
    font-size: 1rem;
}

/* Do to limitations in the sticky scroll headerer, caption text cannot wrap on to multiple lines */

.qld__tab-container .qld__table--scroll .qld__table .qld__table__caption{
    white-space: nowrap; 
}


/* These are the defaults for table heading cells */

.qld__table .qld__table__header, .qld__table th, table .qld__table__header, table th {
    padding: 20px 16px 20px 16px;
    padding: 1.25rem 1rem 1.25rem 1rem;
    -webkit-box-shadow: inset 0 -2px 0 var(--QLD-color-light-designAccent);
    box-shadow: inset 0 -2px 0 var(--QLD-color-light-designAccent);
    color: var(--QLD-color-light-heading);
    font-weight: 600;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.5;
    text-align: left;
    vertical-align: middle
}

/* These are the defaults for table cells */

.qld__table .qld__table__cell,
.qld__table td {
    padding: 12px;
    padding: .75rem;
    -webkit-box-shadow: inset 0 -1px 0 var(--QLD-color-light-border);
    box-shadow: inset 0 -1px 0 var(--QLD-color-light-border);
}

/* These are the defaults for table footer/total cells */

.qld__table tfoot{
inset-block-end: 0;
background-color: var(--QLD-color-light-background);
font-weight: 600;
-webkit-box-shadow: inset 0 2px 0 var(--QLD-color-light-designAccent);
box-shadow: inset 0 2px 0 var(--QLD-color-light-designAccent);
}


/* These are override styles from DTA that were missing to change the table cell wdiths */

.qld__table th.qld__table__header--width-10 {
    width: 10%
}

.qld__table th.qld__table__header--width-15 {
    width: 15%
}

.qld__table th.qld__table__header--width-20 {
    width: 20%
}

.qld__table th.qld__table__header--width-25 {
    width: 25%
}

.qld__table th.qld__table__header--width-33 {
    width: 33%
}

.qld__table th.qld__table__header--width-40{
    width: 40%
}

.qld__table th.qld__table__header--width-50{
    width: 50%
}

.qld__table th.qld__table_header--width-75 {
    width: 75%
}


/* This is an override styles from DTA that were missing apply tabular numbers and right align cells */

td.qld__table__cell--numeric, th.qld__table__cell--numeric{
    text-align: right !important;
    font-variant: tabular-nums;
}


/* This style aligns table cells to be cetnre aligned */

 td.qld__table__cell--middle, th.qld__table__cell--middle{
    text-align: center !important;
}


/* Tables that recieve a vertical scroll must be focusable for accessibiliy these styles set focus elements based on DTA styles */

.qld__table.qld__table__head .qld__table__header:focus {
    outline: 3px solid var(--QLD-color-light-focus);
}

.qld__table .qld__table__cell:focus {
    outline: 3px solid var(--QLD-color-light-focus);
}


/* These styles set a while col to be right aligned based on column number, these are placed in the <table> element */
/* These styles are set to ignore headers that span multiple cols, in this instance classes should be placced manually */

.qld__table.qld__table__col-1-num tr td:nth-child(1), .qld__table.qld__table__col-1-num tr th:nth-child(1):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}

.qld__table.qld__table__col-2-num tr td:nth-child(2), .qld__table.qld__table__col-2-num tr th:nth-child(2):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-3-num tr td:nth-child(3), .qld__table.qld__table__col-3-num tr th:nth-child(3):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-4-num tr td:nth-child(4), .qld__table.qld__table__col-4-num tr th:nth-child(4):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-5-num tr td:nth-child(5), .qld__table.qld__table__col-5-num tr th:nth-child(5):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-6-num tr td:nth-child(6), .qld__table.qld__table__col-6-num tr th:nth-child(6):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-7-num tr td:nth-child(7), .qld__table.qld__table__col-7-num tr th:nth-child(7):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-8-num tr td:nth-child(8), .qld__table.qld__table__col-8-num tr th:nth-child(8):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-9-num tr td:nth-child(9), .qld__table.qld__table__col-9-num tr th:nth-child(9):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}
.qld__table.qld__table__col-10-num tr td:nth-child(10), .qld__table.qld__table__col-10-num tr th:nth-child(10):not([colspan]){
    text-align: right;
    font-variant: tabular-nums
}



/* This is an override style that sets a left or right border for a cell */


.qld__table__cell-left-border {
border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table__cell-right-border {
border-right: 1px solid var(--QLD-color-light-border);
}

/* These styles a left or right border based on column number, these are placed in the <table> eelmenet */

.qld__table.qld__table__col-1-left-border tr td:nth-child(1){
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-1-right-border tr td:nth-child(1){
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-2-left-border tr td:nth-child(2) {
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-2-right-border tr td:nth-child(2) {
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-3-left-border tr td:nth-child(3){
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-3-right-border tr td:nth-child(3){
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-4-left-border tr td:nth-child(4){
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-4-right-border tr td:nth-child(4){
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-5-left-border tr td:nth-child(5) {
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-5-right-border tr td:nth-child(5){
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-6-left-border tr td:nth-child(6){
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-6-right-border tr td:nth-child(6) {
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-7-left-border tr td:nth-child(7) {
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-7-right-border tr td:nth-child(7){
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-8-left-border tr td:nth-child(8) {
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-8-right-border tr td:nth-child(8){
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-9-left-border tr td:nth-child(9){
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-9-right-border tr td:nth-child(9){
 border-right: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-10-left-border tr td:nth-child(10){
 border-left: 1px solid var(--QLD-color-light-border);
}

.qld__table.qld__table__col-10-right-border tr td:nth-child(10){
 border-right: 1px solid var(--QLD-color-light-border);
}



/* There are now two types of tables table scroll and table contained, table scroll has a max height and will automaticall apply a vertical scroll */

.qld__table--scroll{
    max-height: 640px;  /* Max height for mobile devices based on average available screen space on mobile devices */
    overflow-y: auto;
    border: 1px solid var(--QLD-color-light-border);
    border-radius: var(--Qld__border-radius--sm);
}


/* This sets the table caption to be sticky, because it has to be followed by table head it needs a fixed height */
.qld__table--scroll table caption{
    position: sticky;
    top: 0;
    min-height: 78px; /* 78px height so it can cater for additional information detailing table order under the caption text */
}

/* If there is a table caption (something that is not used if its figure) then thead starts at 78px from the top */
.qld__table--scroll table caption + thead{
    top: 78px;
}

/* This sets the table header and footers to be sticky when the table scrolls vertically */
.qld__table--scroll table thead, .qld__table--scroll table tfoot {
  position: sticky;
}

.qld__table--scroll table thead {
  inset-block-start: 0; /* "top" */
  background-color: var(--QLD-color-light-background);
}

.qld__table--scroll table tfoot {
  inset-block-end: 0; /* "bottom" */
}


/* So all tables have visual consistency non scrolling tables use the qld__table--container style to look visually similar to scrolling tables */

.qld__table--contained{
    border: 1px solid var(--QLD-color-light-border);
    border-radius: var(--Qld__border-radius--sm);
    overflow: auto;
}


.qld__tab-container .qld__table--scroll, .qld__tab-container .qld__table--contained{ 
margin-top: 16px;
margin-top: 1rem;/* Adds some additinal spacing when tables are contained with tabs, tables a visually heavy elements an require more white space between the tab buttons and table content */
}


/* Because scroll and contained tables sit within a div container they require classes to apply the correct vertical spacing */

* + .qld__table--scroll {
    margin-top:24px; /* Adds a margin-top to the table--scroll when it follows other objects in a container */
}


* + .qld__table--contained{
    margin-top: 24px; /* Adds a margin-top to the table--contained when it follows other objects in a container */
}


/* These are the media queries for tables */

@media (min-width: 992px){
    
    .qld__image-gallery{
 margin-top:0px;   
}

.qld__table--scroll{
    max-height: 1000px; /* On desktop vertical scroll kicks in at a larger height */
}

* + .qld__table--scroll {
    margin-top:32px;
    margin-top:2rem;   /* Desktop spacing between components */
}

* + .qld__table--contained{
    margin-top:32px;
    margin-top:2rem;   /* Desktop spacing between components */
}

* + .qld__table {
    margin-top:32px;
    margin-top:2rem; /* Desktop spacing between components */
}

}