* {
    box-sizing: border-box;
}

/* Change Font Family */
/* 
The following should be modified as required to apply the site's font family to the the Thinkwell app. 
The example will apply 'Arial' to the web app.
*/



.panel-group * {
    font-family: ‘Arial’;
}


body {
    color: black !important;
}

input[type="search"] {
    border: 1px solid #e0e0e0 !important;
    border-radius: 2px;

}

#resetFilters {
    margin-top: 10px;
}

div[aria-expanded="false"] .checklist-holder,
div[aria-expanded="false"] #resetFilters {
    display: none;
}

div[aria-expanded="false"] #filtersummary {
    display: none;
}

/*#collapsesummaryfiltersheader,*/
#collapsefiltersheader {
    cursor: pointer;
}

.tooltip-arrow,
.ttip + .tooltip > .tooltip-inner {
    background-color: #e0e0e0;
    color: #404040;
}

.ttip + .tooltip .tooltip-arrow {
    border-top-color: #e0e0e0 !important;
    background-color: transparent;
}

.badge.badge-warning {
    background: rgb(242, 200, 185) !important;
    color: #000000 !important;
    width: 40px;
}

.panel.panel-warning .panel-heading h4 {
    color: #000000 !important;
}

.checklist-holder {
    width: 19%;
    height: 170px;
    display: inline-block;
}

.checklist-holder .panel-header {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.checklist-holder .panel-body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.checklist-inner-holder {
    display: table;
    width: 100%;
    height: 100%;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.checklist {
    display: table-row;
}

.checklist span {
    /*white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;*/
    display: table-cell;
}

.checklist input[type="checkbox"] {
    border-radius: 0 !important;
    background: transparent !important;
    margin-right: 5px !important;
    height: 12px;
    width: 12px;
    display: table-cell;
}

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

#immunizationData_length {
    margin-right: 20px;
}

#immunizationData {
    margin-top: 10px;
    border-top: 1px solid rgba(200, 255, 200, 0.5);
}

#immunizationData>tbody>tr>td:nth-child(1) {
    width: 2%;
}

#immunizationData>tbody>tr>td:nth-child(2) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(3) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(4) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(5) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(6) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(7) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(8) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(9) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(10) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(11) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(12) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(13) {
    width: 7%;
}

#immunizationData>tbody>tr>td:nth-child(14) {
    width: 7%;
}

.footnote {
    margin-top: 20px;
}

.datatable-container {
    width: 100% !important;
    max-width: 100%;
    overflow: auto;
    height: auto;
}

.datatable-container input[type="search"] {
    border-radius: 0 !important;
}

.tab-pane tr {
    border-color: transparent !important;
}

tbody .tab-pane {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

thead th {
    vertical-align: middle !important;
}

td {
    vertical-align: top !important;
}

thead th.col9,
thead th.col10,
thead th.col11,
thead th.col12 {
    background-color: rgba(0, 165, 220, 0.5);
}

thead .cost-group {
    background-color: rgba(0, 165, 220, 0.25);
}

table.dataTable tbody tr.shown + tr {
    background-color: #ffffff !important;
}

table.dataTable tbody tr.shown + tr td {
    background-color: #ffffff !important;
}

table.dataTable tbody tr.shown + tr .tab-content {
    margin-bottom: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

table.dataTable tbody tr.shown + tr tr {
    background-color: #ffffff !important;
}

td.details-control {
    background-image: url(https://ian-jamieson-pne4.squarespace.com/s/details_open.png);
    background-repeat: no-repeat;
    background-position: center top;
    cursor: pointer;
    width: 20px;
    height: 20px;
}

tr.shown td.details-control {
    background-image: url(https://ian-jamieson-pne4.squarespace.com/s/details_close.png);
}

td.clickable {
    color: rgb(0, 165, 220);
    cursor: pointer;
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
    background: rgba(235, 230, 220, 1) !important;
}

/*table.dataTable.stripe thead tr, */
table.dataTable.stripe tbody tr.even, table.dataTable.display tbody tr.even {
    background: rgba(235, 230, 220, 0.5) !important;
}

.tab-content td,
.tab-content tr {
    border-top: 0px solid transparent !important;
    border-bottom: 0px solid transparent !important;
    border-top-color: transparent !important;
}


ul.nav {
    max-width: 99%;
}

.nav-item a {
    color: rgb(0, 165, 220) !important;
}

.nav-item.active a {
    color: gray !important;
}
.nav-item.active:nth-child(5) a.nav-link,
.nav-item.active:nth-child(6) a.nav-link,
.nav-item.active:nth-child(7) a.nav-link,
.nav-item.active:nth-child(8) a.nav-link {
    color: gray !important;
    background: white;
}

.nav-item:nth-child(5) a,
.nav-item:nth-child(6) a {
    color: black !important;
    background-color: rgba(0, 165, 220, 0.5);
}

.tab-content table {
    max-width: 99%;
}

.table-with-group-headers .table-header-group-end-label {
    margin-bottom: 20px;
}

.table-with-group-headers .table-header-group-end-label,
.table-with-group-headers .table-label {
    padding-left: 20px !important;
    font-weight: normal !important;
    color: black !important
}

.header-group-table.header-group-0 td,
.header-group-table.header-group-1 td {
    width: 290px;
}

.header-group-table.header-group-2 {
    width: 450px;
}

.header-group-table th {
    color: black;
    font-size: 2em;
    border-bottom-color: transparent !important;
    font-weight: normal !important;
    padding-top: 20px !important;
    margin-top: 20px;
}

.header-group-table tbody tr td:first-child {
    padding-left: 20px !important;
    padding-right: 10px !important;
}

.table-header-group-end-label {
    font-weight: bold;
    color: green;
    margin-left: -10px;
    margin-top: 50px;
}

.table-label {
    font-weight: bold;
}

table.subtable-a {
    margin-top: 10px;
    width: 99%;
    table-layout: auto;
}

.subtable {
    width: auto;
}

.subtable td,
.subtable th {
    white-space: nowrap;
    padding-right: 10px !important;
}

table.header-group-2 td,
table.header-group-2 th {
    white-space: nowrap;
}

/* Squarespace */
#page {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
}

/* Bootstrap overrides */
.panel,
.panel-heading {
    border-radius: 0 !important;
}

div.checklist-holder.panel-info>div.panel-heading {
    background-color: rgb(23, 76, 111) !important;
}
#collapsefiltersheader {
    background-color: rgb(23, 76, 111);
    font-size: 16px;
    font-weight: bold;
}

div.checklist-holder.panel-info>div.panel-heading,
#collapsefiltersheader h4,
#datasummaryheader h4,
#reportpanelheader h4,
#collapsesummaryfiltersheader h4 {
    font-weight: bold;
}

#datasummaryheader,
#collapsesummaryfiltersheader {
    background-color: rgb(242, 200, 185) !important;
    font-size: 16px !important;
    font-weight: bold !important;
}

#datasummaryheader h4,
#collapsesummaryfiltersheader h4 {
    color: black !important;
}

#reportpanelheader {
    background-color: rgb(0, 165, 220) !important;
    font-size: 16px !important;
    font-weight: bold !important;
}

button.btn-default,
button.dt-button {
    border-radius: 0 !important;
    background: rgb(235, 230, 225) !important;
    color: black;
}

#datasummarypanel {
    width: 300px;
    display: inline-block;
}

#filtersummarypanel {
    width: calc(100% - 320px);
    margin-left: 20px;
    float: right;
}

#datasummarypanel .panel-body,
#filtersummarypanel .panel-body {
    height: 150px;
    overflow-y: auto;
}