html{
    font-family: "Helvetica Neue",Helvetica,"Nimbus Sans",Arial,sans-serif;
    font-size: 10pt;
    color: black;
    height: 100%;   
}

body {
    height: 100vh;
}

header div {
    display:inline-block;
}

.fixed {
    display: flex;
    justify-content: flex-end;
}
.flex-item {
    flex-grow: 1;
}

/* FONT STYLES */
h1{
    font-family: "Raleway", "Lucida Grande", "Lucida Sans Unicode", Tahoma, Sans-Serif;
    display: block;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-weight: normal;
    line-height: 20px;
    color: black;
    font-size: 2.2em;
    margin-bottom: 0.5em;
    margin-left: 0.2em
}
h2{
    display: inline-block;
    margin: 0.3em;
    font-size: 1.2em;
}
h3 {
    color: black;
}
h5 {
    color: black;
}
.padright {
    margin-right: 0.4em;
}
.padleft {
    margin-left: 0.4em;
}
.details {
    font-size: 0.8em;
    font-style: italic;
    color: grey;
    margin-top: 0.6em;
    margin-bottom: 0;
}

.description {
    font-weight: normal;
    font-style: italic;
    color: grey;
    /* padding-left: 5px; */
}
.idtip {
    text-decoration: underline solid blue;
    cursor: pointer;
}
.nowrap {
    white-space: nowrap;
}

a.heading {
    text-decoration: none;
}
a.heading, a.heading:visited, a.heading:hover, a.heading:active {
    color: inherit;
}

a.url {
    font-style: italic;
    font-size: 0.8em;
    /* overflow: hidden;
    text-overflow: ellipsis; */
}
.special {
    font-size: 0.9em;
    color: red;
    font-style: italic;
}
.doubt {
    /* color: orange; */
    text-decoration: underline dashed orange;
    opacity: 0.4;
}

/* TABLE */
table {
    border-collapse: collapse;
}
table.sheet {
    table-layout: auto;
    width: 100%;
    font-size: 0.9rem;
}
table.detailsTable {
    /* table-layout: auto; */
    font-size: 0.9em;
}
table.linkedsheet {
    width: 100%;
    font-size: 0.9em;
    border: 1px solid lightgrey;
}
table.linkedsheet.display tbody tr table tr:hover {
    background: none;
}
table.linkedsheet tbody tr {
    background-color: lightgoldenrodyellow;
}

table tr td {
    white-space: pre-line;
    word-wrap: break-word;
}
table tr td.linkedsheet {
    white-space: normal;
}
th { /* table.mainsheet ??? */
    /* text-align: left; */
    /* background-color:lightblue; */
    font-style: italic;
    color: midnightblue;
    font-family: "Raleway", "Lucida Grande", "Lucida Sans Unicode", Tahoma, Sans-Serif;
}
td {
    font-size: 0.9rem;
}

/* .dataTables_wrapper .dataTables_scroll {
    background-color: lightblue;
} */

table.dataTable thead th {
    padding: 8px 5px;
}
table.dataTable thead tr:nth-child(2) th {
    padding: 0px 5px;
    text-align: left;
}
table.dataTable tbody td {
    padding: 8px 4px;
}
table.dataTable tbody td:first-child {
    padding: 8px 10px;
}
table.dataTable tbody td.linkedsheet {
    padding: 2px 5px;
}
table.dataTable tbody td.linkedsheet div{
    /* display: inline-block; */
    vertical-align: top;
    white-space: normal;
}
table.dataTable thead tr:first-child {
    -webkit-box-shadow:0px 0px 100vh grey;
    -moz-box-shadow: 0px 0px 100vh grey;
    box-shadow: 0px 0px 100vh grey;
}
table.dataTable thead tr:last-child th {
    border-bottom-style: dotted;
}

td.detailsHeader {
    font-style: italic;
    text-align: right;
}

th.urlCol {
    font-size: 0.9em;
    /* word-wrap: break-all;
    white-space: nowrap; */
}


td.urlCol {
    max-width: 4vw;
    /* font-size: 0.9em; */
    /* word-wrap: break-all; */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;    
    white-space: nowrap;
}

td.details-control {
    background: url('icons/details_open.png') no-repeat center center;
    cursor: pointer;
}
tr.shown td.details-control {
    background: url('icons/details_close.png') no-repeat center center;
}

/* CHILD ROWS */
table.mainsheet > tbody tr td.child, table.sheet > tbody tr td.child {  /* table.mainsheet ??? */
    padding: 0px 2px 4px 20px;
    background-color: #ededed;
}

table.linkedsheet > thead tr th {
    background-color: #e6d7ad;
}
table.linkedsheet > tbody tr {
    background-color: #fffefa;
}

table.linkedsheet > tbody td {   
    border:1px solid lightgray;        
}

tr.detailsRow td {
    background-color: #ededed; /* same as .child */
}

td.title {
    font-weight: bold;
    font-style: italic;
}

/*normal datatable*/
div.dataTables_wrapper div.dataTables_filter {
    float: left;
    text-align: left;
}
div.dataTables_wrapper div.dataTables_filter label {
    font-family: "Raleway", "Lucida Grande", "Lucida Sans Unicode", Tahoma, Sans-Serif;
    font-weight: bold;
    margin: 0.3em;
    font-size: 1.1rem;
}
div.childdiv div.dataTables_wrapper div.dataTables_filter label {
    font-size: 1rem;
}
div.dataTables_wrapper div.dataTables_info {
    float: right;
    text-align: left;
    padding: 0;
    font-size: 0.9rem;
}
.dataTables_wrapper .dataTables_filter input {
    margin-top: 0.2em;
}
/* datatable inside childrow */
div.childdiv div.dataTables_wrapper {
    background-color: #e6d7ad;
}
div.childdiv div.dataTables_wrapper div.dataTables_filter label {
    font-weight: normal;
}
div.childdiv div.dataTables_wrapper div.dataTables_filter {
    float: right;
    /* text-align: left; */
}


p#details {
    margin: 0px 2px;
}
header div#activity {
    float: right;
}

div.childdiv {
    display: table;
    width: 100%;
}

/*BUTTONS*/
.btn {
    -webkit-border-radius: 2;
    -moz-border-radius: 2;
    border-radius: 0px 2px 2px 0px;
    color: #ffffff;
    font-size: 1.0em;
    padding: 4px 4px 0px 4px;
    margin: 0px 0px 0px 0px;
    text-decoration: none;
    border: 1px solid white;
}
.btn:hover {
    -webkit-filter: brightness(70%);
	-moz-filter: brightness(70%);
	-o-filter: brightness(70%);
	-ms-filter: brightness(70%);
	filter: brightness(70%);
}

.btn:active {
    -webkit-filter: brightness(70%);
	-moz-filter: brightness(70%);
	-o-filter: brightness(70%);
	-ms-filter: brightness(70%);
	filter: brightness(70%);
}

.btn:focus {
    -webkit-filter: brightness(70%);
	-moz-filter: brightness(70%);
	-o-filter: brightness(70%);
	-ms-filter: brightness(70%);
	filter: brightness(70%);
}

/*SEARCH BUTTON*/
.btn#search {
    background:pink;
}

@keyframes spinner {
    to {transform: rotate(360deg);}
  }
   
  .spinner:before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    border: 2px solid #ccc;
    border-top-color: #333;
    animation: spinner .6s linear infinite;
  }

#status {
    /* content: ''; */
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    /* width: 200px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    border: 2px solid #ccc;
    border-top-color: #333; */
    /* animation: spinner .6s linear infinite; */
}