@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);
@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:700);

@font-face {
    font-family: Avenir;
    src: url("/static/cma/fonts/AvenirNext_PC/AvenirNext_PC/AvenirNext-Regular.ttf") format("opentype");
}

.flex-container {
    display: flex;
}

.flex-container.main {
    height: 100%;
}

.flex-child.control_panel {
    transition: 0.2s;
    -o-transition: 0.2s;
    -webkit-transition: 0.2s;
    width: 40%;
/*     flex: 2; */
/*     border: 2px solid yellow; */
}  

.flex-child.map {
    flex: auto;
/*      width: 60%;  */
}

#map {
/*     display: inline-block; */
    position: fixed;
    top: 64;
    right: 0;
    height: 800px;
    width: 60%;
/*     width: 66%; */
}
#control_panel {
/*     display: inline-block; */
/*     width: 33%; */
    height: 800px;
    position: relative;
    
}

#content {
    padding: 0px;
}

body {
    background: #444;
}

td, th {
    border-bottom: None;
    padding: 4px 2px;
}

#header {
    background: #444;
    padding: 10px 30px;
}

#branding h1 {
    font-size: 2.0rem;
    font-weight: 600;
    color: #ccccff;
    letter-spacing: .20rem;
    font-family: Avenir;
    text-shadow: #222 -1px 1px 3px;
}
#branding h1 .compress {
    letter-spacing: 0.02rem;
} 

div.breadcrumbs {
/*     display: none; */
    background: #777;
    padding: 8px 40px;
}


.overlay {
    width: 100%;
    height: 100%;
    text-align: center;
    top: 0;
    left: 0;
    display: none;
    position: fixed; 
    z-index: 9990;
    background-color: rgba(50,50,50,0.8);
}
.modal {
    position: absolute; 
    width: 80%;
    background-color: #333;
    opacity: 0.95;
    border-radius: 3px;
    top:50%;
    left:50%;
    overflow: visible;
    transform: translate(-50%, -50%);
    padding: 10px 0px;
    margin: 0px auto;
}


.button {
    width: 160px;
/*     height: 100px; */
    border-radius: 3px;
    border: 0px solid #000;
    text-align: center;
    background: #888;
    margin: 8px auto 0px auto;
    font-size: 32px;
    line-height: 34px;
    cursor: pointer;
    padding: 3px 12px;
    transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
}
.button:hover {
    background: #444;
}


.leaflet-control-layers-table_label th {
    font-size: 11px;
    font-weight: normal;
    text-align: left;
    padding-bottom: 3px;
    height: 46px;
    vertical-align: bottom;
/*    height: 50px;*/
/*    width: 40px;*/
/*    position: relative;
    vertical-align: bottom;
    padding: 0;
    line-height: 0.8;*/

}

.leaflet-control-layers-table_label th div {
    width: 14px;
    height: 6px;
    -ms-transform: rotate(-80deg); /* IE 9 */
    -webkit-transform: rotate(-80deg); /* Chrome, Safari, Opera */
    transform: rotate(-80deg);
    transform-origin: left bottom 0;
    float: right;

}

.customLayerControl_th span {
/*    left: -20px;*/
}

.customLayersTableDiv {
    margin-top: 0px;
    max-height: 600px;;
    overflow: auto;
}

table.customLayersTable {
    border-spacing: 0px;
    width: 100%;
}
.customLayersTable td {
    text-align: right;
    vertical-align: top;
}

.layerLabelAndCheck {
    height: 19px;
    vertical-align: bottom;
    font-size: 12px;
    
}
/*.leaflet-control-layers-overlays {
    font-size: 12px;
    vertical-align: middle;
}*/
.layerCheckbox {
    display: inline;
    height: 19px;
    font-size: 16px;
    vertical-align: top;
    padding: 0.5px;
    margin-left: 10px;

}

.layerLabelAndCheck.footer {
    margin-top: 12px;
    padding-bottom: 4px;
    font-size: 10px;
    vertical-align: top;
}
.layerLabelAndCheck.other {
/*    margin-top: 12px;*/
    text-align: left;
    
}

.leaflet-control-layers-list {
    margin-bottom: 0px;
}

.leaflet-control-layers {
/*    background-color:rgba(256,256,256,0.8);*/
    background-color: transparent;
    padding-top: 34px;
/*    margin-right: 5px;
    margin-bottom: 5px;*/
    border-radius: 2px;
/*    box-shadow: none;*/
}
.leaflet-control-layers td,
.leaflet-control-layers th {
    background-color:#333;
}
.leaflet-control-layers.leaflet-control-layers-expanded.leaflet-control {
    margin: 3px 6px 6px 0px;
    padding: 0px 0px 2px 0px;
    border: none;
}

.layerLabelAndCheck.footer input[type='radio'] {
    margin-left: 2px;
}

.layerLabelAndCheck.footer {
    height: auto;
}
.layerLabelAndCheck.footer div {
    padding-right: 5px;
}

/*tr.m-basemap-selector,
tr.m-basemap-selector td {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}*/
tr.m-basemap-filler { 
    height: 4px;
}
tr.m-basemap-filler2 { 
    height: 12px;
    background-color: #333;
}
tr.m-basemap-filler3 { 
    height: 2px;
    background-color: #333;
}

tr.m-basemap-year-divider td,
tr.m-basemap-headeroo td { 
    text-align: left;
    font-size: 13px;
    font-family: monospace, ui-monospace, Arial;
    color: #c2c2c2;
    padding: 4px 4px 2px 4px;
    border-top: 1px dashed #444;
    cursor: pointer;
/*    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;*/
}
tr.m-basemap-year-divider td:hover {
    color: #fff;
    font-weight: bold;
}
tr.m-basemap-year-divider td.year_label {
    width: 130px;
}
tr.m-basemap-selector td {
    font-size: 13px;
    text-align: left;
    vertical-align: top;
    font-family: monospace, ui-monospace, Arial;
}
tr.m-basemap-selector td.control_label {
    cursor: default;
    padding: 1px 6px 0px 8px;
    font-size: 12px;
    border-bottom: None;
}
tr.m-basemap-selector td.control_label.date {
    color: #ffffcc;
    padding-left: 14px;
    width: 50px;
}
tr.m-basemap-selector td.control_label.source {
    color: #8faabc;
/*     font-family: 'PT Sans Narrow'; */
    font-size: 13px;
    cursor: pointer;
}
tr.m-basemap-selector {
    cursor: pointer;
}
tr.m-basemap-selector {
    color: #fff;
}
tr.m-basemap-selector td.control_label.product {
    color: #999;
    font-size: 11px;
}
.customLayersTable td.off {
    color: #c2c2c2;
    text-align: left;
    vertical-align: middle;
    font-size: 12px;
    font-family: monospace, ui-monospace;
    padding: 3px 0px 1px 14px;
}
tr.m-basemap-selector td.control_input {
    text-align: right;
    padding: 1px 0px 0px 0px;
    vertical-align: top;
}
tr.m-basemap-selector td.control_input input[type='checkbox'] {
    margin: 0px 3px 0px 0px;
    
}
tr.m-basemap-selector input {
    margin-top:0px;
    cursor: pointer;
    
}
tr.m-basemap-selector.header {
    font-weight: 600;
    text-transform: uppercase;
}
tr.m-basemap-selector.header td {
    background-color: rgba(80,80,80,0.9);
    color: #d9d9d9;
    font-size: 0.9rem;
    padding: 4px 2px 2px 6px;
    margin-bottom: 2px;
    font-family: 'Open Sans Condensed';
    cursor: pointer;
}
tr.m-basemap-selector.header td:hover {
    color: #fff;
}
tr.m-basemap-selector.header td.collapse {
    text-align: right;
    vertical-align: middle;
    font-size: 16px;
    font-weight: 500;
    line-height: 10px;
    cursor: pointer;
    padding-top: 2px;
    padding-right: 8px;
    border-radius: 0px;
}
tr.m-basemap-selector.header td.collapse:hover {
    font-weight: 800;
}
tr.m-basemap-selector.header.first td {
    margin-top: 0px;
}
tr.m-basemap-selector.buffer {
    height: 4px;
/*     background-color: transparent; */
}
tr.m-basemap-selector.divider {
    height: 3px;
    background-color: transparent;
}

.leaflet-control-layers-table_cell_1 {
    padding: 0px 0px 0px 3px;
}


.leaflet-popup-tip-container {
    display: none;
    
}
.leaflet-popup-close-button {
    display: none;
    
}
.leaflet-popup-content-wrapper {
    border-radius: 2px;
    background: rgba(68,68,68,0.95);
    color: #fff;
    box-shadow: -8px 8px 8px rgba(40,40,40,0.5);
}
.leaflet-popup-content {
    margin: 4px 6px;
    font-size: 0.85rem;
}
.leaflet-popup-content span.label {
    font-size: 0.76rem;
    color: #bfbfbf;
    
}


.item {
    clear:both;
/*    margin:0px -34px 0 0px;*/
    margin:0px 0px 0 0px;
    line-height:14px;
    font-size: 11px;
    color:#999;
    text-align:left;
    vertical-align: bottom;
}
.bin {
    float:left;
    width:12px;
    height:12px;
    margin:0px 5px 1px 0px;
    border:1px solid #222;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
}

.leaflet-control-layers {
    min-width: 180px;
}

.leaflet-left .leaflet-control {
    margin-left: 6px;
}
.leaflet-top .leaflet-control {
    margin-top: 6px;
}
.controlPanel {
    min-width: 200px;
    padding: 4px;
    border-spacing: 0px;
    background-color: rgba(80, 80, 80, 0.9);
    border-radius: 1px;
    color: #fff;
    
}
.controlPanel table {
    padding: 4px;
    font-family: monospace, ui-monospace, Arial;
    margin: 0px auto;
    
}
.controlPanel tr {
    background-color: transparent;
}
.controlPanel tr.title {
/*     background-color: rgba(80, 80, 80, 0.9); */
    color: #d9d9d9;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
}
.controlPanel tr.title td {
    text-align: center;
    
}
.controlPanel td {
    vertical-align: middle;
}
.controlPanel img {
    background-color: white;
    border-radius: 2px;
    cursor: pointer;
    
}

select {
    padding: 1px 3px;
    height: 1.6rem;
}

.button.load_sites {
    font-size: 1.1rem;
    line-height: 1.5rem;
    background-color: #6aaf7a;
    width: 260px;
    margin: 10px auto;
    
}
.button.load_sites:hover {
    background-color: #24422b;
}
.button.load_sites.disabled {
    cursor: default;
    background-color: #999;
    pointer-events: none;
    
}

.collapse .header.topbar {
/*     font-style: italic; */

    width: calc(100% - 16px);
    text-transform: uppercase;
    border-radius: 2px;
    background-color: #333;
    padding: 4px 8px;
/*    margin-bottom: 16px;*/
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
    font-family: monospace, ui-monospace;
    font-size: 1.3rem;
    color: #b3b3b3;
    border-bottom: 2px solid #444;
    margin-bottom: 0px;
}

.collapse.sub .header.topbar,
.button.selected_model_config,
.button.model_type_label {
    margin: 0px 10px;
    background-color: transparent;
    font-size: 1.0rem;
    padding: 2px 8px;
    color: #a5cd98;
     width: calc(100% - 26px);
     margin: 0px 10px 0px 0px;
}

.collapse.sub.sub2 .header.topbar {
    font-size: 0.85rem;
    color: #fdc086;
    text-transform: none;
    margin: 0px 0px 0px 16px;
}

.collapse {
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px;
}
.collapse div {
    width:100%;
}

.collapse .header {
    width: 250px;
    padding: 2px 0px 2px 0px;
/*    margin-right: 10px;*/
    cursor: pointer;
    font-weight: 500;
}
.collapse .header.topbar:hover {
    background-color:#222;
}

.collapse .header div {
/*    padding: 0px 0px 0px 6px;*/
    
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}

.collapse .header span .plus {
    padding-left: 0px;
    color:#70AA70;
}

.collapse .header span .minus {
    padding-left: 0px;
    color:#C26666;
}
.collapse .header d:hover {
    color: #333; 
}
.collapse div.content {
    display: none;
    /*background-color: #444;*/
/*     padding: 0px 2px; */
    margin-top: 6px;
    margin-bottom: 10px;
}
.collapse.sub .content{
    margin-top: 0px;
}
span.collapse {
    font-weight: 700;
    color: #f2f2f2;
    font-family: monospace, ui-monospace;
}
.datalayer_table {
    margin: 0px 20px;
    width: calc(100% - 40px);
    
}
.datalayer_table tr,
.model_parameters_table tr {
    background-color: transparent;
    color: white;
    font-size: 0.8rem;
    transition: 0.3s ease;
    -o-transition: 0.3s ease;
    -webkit-transition: 0.3s ease;
}
.datalayer_table tbody tr:nth-child(odd),
.model_parameters_table tbody tr:nth-child(odd),
#sites_table tbody tr.odd {
    background-color: rgb(78, 78, 78);
}
.model_parameters_table tbody tr:nth-child(odd) {
    background-color: rgb(57, 57, 57);
}
.model_parameters_table tbody tr:nth-child(even),
#sites_table tbody tr.even {
    background-color: rgb(64, 64, 64);
}
.datalayer_table td,
.model_parameters_table td {
    padding: 2px 4px;
}
.datalayer_table td.name,
.datacube_layers_table td.name {
    font-family: 'Open Sans Condensed';
    font-size: 0.95rem;
    max-width: 140px;
}
.datacube_layers_table td.name {
    vertical-align: top;
    
}
.datalayer_table td.show_chk {
    text-align: center;
}
.datalayer_table td.info {
    text-align: center;
    cursor: pointer;
}
.datalayer_table td.download {
    text-align: center;
    cursor: pointer;
}
.datalayer_table td.download img {
    display: block;
    margin: 0px auto;
    
}


#datalayer_container .content.main {
    max-height: 500px;
    overflow-y: auto;
    overflow-x: clip;
    direction: rtl;
    scrollbar-color: #555 #888;
    scrollbar-width: thin;
    margin-top: 0px;
}
#datalayer_container .collapse.sub {
    direction: ltr;
    
}
.datalayer_table tbody tr.subcategory_label,
.model_parameters_table tbody tr.subcategory_label
{
    background-color: transparent;
    
}
.datalayer_table tr:hover,
.model_parameters_table tbody tr:hover,
#modeling_status_pane .model_run_status_table tr:hover {
    background-color: #222;
    
}
#modeling_status_pane {
    color: #777;
    vertical-align: top;
    
}
tr.subcategory_label td {
    padding: 14px 4px 4px 4px;
    color: #fdc086;
    font-size: 0.8125rem;
    border-bottom: 1px solid #555;
    text-align: left;
}
tr.subcategory_label td.colname,
.content.datacube .datacube_layers_table thead td,
.cmamodelrun thead td,
.mineral_site_info_table td.colname
{
    font-size: 0.7rem;
    color: #999;
    text-align: center;
}
.model_parameters_table tbody tr.subcategory_label.optional td {
    font-style: italic;
    cursor: pointer;
    color: #888;
    
}

.editprocessingsteps_table td.colname {
    font-size: 0.82rem;
    color: #999;
    vertical-align: middle;
    
}


.content.datacube .datacube_layers_table thead td {
    text-align: left;
    padding-left: 4px;
    
}

.datalayer_table input {
    cursor: pointer;
}
.datalayer_table input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0px 0px;
    background-color: #999;
    
}
.datalayer_table input[type="number"] {
    max-width: 60px;
    background-color: #333;
    border: none;
    color: #f2f2f2;
    
}
select {
    color: white;
    background-color: #333;
    border: none;
    width: 240px;
}
option {
    color: white;
}
select:invalid {
    color: #666;
    
}
#draw_rectangle_icon {
    background-color: #fff;
    border: 1px solid #fc891d;
}
#draw_polygon_icon {
    border: 1px solid #fc891d;
}

.radiocube {
    text-align: center;
    display: none;
    
}
.radiocube input[type='radio'] {
    display: none;
}
.radiocube input + label {
    background-color: #666;
    color: #999;
    font-family: monospace, ui-monospace;
    cursor: pointer;
    transition: 0.3s ease;
    -o-transition: 0.3s ease;
    -webkit-transition: 0.3s ease;
}

.radiocube input + label:hover {
    color: #fff;
}

.radiocube input:checked + label {
/*     background-color: #8C8C8C; */
    color: #f2f2f2;
    cursor: auto;
}
.radiocube input:checked + label.no {
    background-color: #862d2d;
}
.radiocube input:checked + label.yes {
    background-color: #2d8643;
}
    
.radiocube label {
     padding: 0px 6px;
     margin: 0px;
     border-radius: 2px;
     width: 20px;
}

.overlay {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
    position: fixed; 
    z-index: 9999;
    background-color: rgba(50,50,50,0.8);
}


.modal {
    position: absolute; 
    background-color: #262626;
    opacity: 0.95;
    border-radius: 4px;
    top:50%;
    left:50%;
    overflow:visible;
    transform: translate(-50%, -50%);
    margin: 0px auto;
}
.overlay .modal {
    top: 25%;
    left: 25%;
    width: 50%;
    height: 50%;
    transform: translate(0%, 0%);
    overflow-y: auto;
    padding: 24px 40px;
    text-align: left;
/*     font-size: 14px; */
/*     color: #d9d9d9; */
}
#datalayer_info .modal {
    top: 12.5%;
    height: auto;
    width: 75%;
    left: calc(12.5% - 40px);
    max-height: 75%;
    color: #f2f2f2;
    font-size: 1.0rem;
    cursor: pointer;
    overflow-y: auto;
}
#datalayer_info .modal div {
    margin-bottom: 20px;
}
#dl_title,
.modal_title {
    font-size: 1.6rem;
    color: #f2f2f2;
    margin-bottom: 20px;
}
.modal_title .subtitle {
    font-size: 1.0rem;
    color: #999;
}
#datalayer_info span.label {
    color: #888;
    font-size: 0.9rem;
}

.content.datacube table,
table.modeling_params {
    background-color: transparent;
    color: white;
    margin: 10px auto 8px auto;
    width: 80%;
}
.content.datacube .datacube_layers_table tbody {
    background-color: #666;
    border: 2px dashed #478556;
}
.content.datacube table tr,
table.modeling_params tr {
    background-color: transparent;
}

table.modeling_params tr:hover {
    background-color: rgb(59, 59, 59);
    
}

#datacube_btn_build {
    width: 40%;
    height: 2.0rem;
    line-height: 2.0rem;
    vertical-align: middle;
    background-color: #6aaf7a;
    cursor: pointer;
}

.modeling_params td {
    text-align: right;
/*     color: #fdc086; */
    padding: 2px 4px;
    vertical-align: middle;
}

.modeling_params td.label {
    text-align: left;
    color: #bfbfbf;

}

.modeling_params input {
    width: 80px;
    background-color: #333;
    color: #f2f2f2;
    border: none;
    padding: 3px 6px;
    margin: 0px;
}
.modeling_params input[type='text'] {
    width: 160px;
}
.modeling_params select {
    margin: 0px;
}
#cma_crs {
    width: auto;
}
#cma_crs_units {
    color: #9d9dfb;
}
.snapshot {
    display: inline-block;
/*     float: center; */
    text-align: center;
    cursor: pointer;
    padding: 2px 4px 4px 4px;
    border-radius: 2px;
    vertical-align: middle;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
div.img_hover div:last-child {
  display: none;  
}
div.img_hover:hover div:last-child {
  display: block;  
}
div.img_hover:hover div:first-child {
  display: none;  
}
.datacube_layers_table tbody td {
    padding: 2px 6px;
    vertical-align: middle;
    border-bottom: 0.5px solid #777;
    
}
.datacube_layers_table td.name {
    font-size: 0.95rem;
    font-weight: 500;
    color: #fff;
    padding: 6px 8px;
    overflow-wrap: normal;
}
.datacube_layers_table tr.instructions td {
    font-style: italic;
    color: #f2f2f2;
    padding: 4px 4px;
}
.datacube_layers_table tr.label_raster {
    background-image: repeating-linear-gradient(135deg, #666666, #666666 14px, rgb(106, 106, 106) 14px, rgb(106, 106, 106) 28px);
}
.datacube_layers_table tr.label_raster:hover {
    background-image: none;
    background-color: #444;
}
.datacube_layers_table tbody tr:hover {
    background-color: #444;
}
.datacube_layers_table td.remove {
    padding: 0px 6px;
}
.link {
    color: #fc891d;
    cursor: pointer;
    transition: 0.2s ease;
    -o-transition: 0.2s ease;
    -webkit-transition: 0.2s ease;
}
.link:hover {
    color: #fdbd81;
}
a {
    cursor: pointer;
}
#datacube_processingsteps .modal,
.overlay.parameters_form .modal {
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}
.overlay.parameters_form .modal {
    padding: 10px 32px;
    overflow-y: auto;
    
}

table.editprocessingsteps_table {
    border: none;
}
table.editprocessingsteps_table tr,
table.editprocessingsteps_table td {
    color: white;
    background-color:transparent;
    border: 0px;
    padding: 4px 6px;
}

#processingsteps_listtable {
    margin: 10px auto;
    
}
#processingsteps_listtable td {
    border-bottom: 1px solid #444;
    color: #ffffcc;
    font-size: 0.85rem;
}
#processingsteps_listtable td.delete {
    width: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    color: #ff4d4d;
    cursor: pointer;
    font-family: monospace, ui-monospace;
}

.close-top {
    position:relative;
    float:right;
    cursor: pointer;
    top: -18px;
    right:-30px;
}
#message_modal_small .close-top {
    top: -6px;
    right: -8px;
    
}
.header.topbar.sub {
    margin-top: 6px;
}

#sidebar_collapse_button {
    position: absolute;
    top: 16px;
    font-size: 1.0rem;
    right: -18px;
    width: 18px;
    float: right;
    padding: 0px; 
    color: #cccccc;
    line-height: 60px;
    height: 60px;
    text-align: center;
    border-radius: 0px 3px 3px 0px;
    background-color: rgba(40,40,40,.3);
    z-index: 900;
    cursor: pointer;
}
#sidebar_collapse_button:hover {
    background-color: #222;
    color: #f2f2f2;
}

#sidebar_collapse_button .symbol_container {
    margin: auto;
}
.sublabel {
    color: #fdc086;
    font-size: 0.81rem;
    padding: 12px 0px 0px 46px;
}
.collapse div.modeling_instructions,
.selected_model_description
{
    padding: 4px 10px 4px 34px;
    color: #d9d9d9;
    font-size: 0.75rem;
    width: calc(100% - 52px);
}
.goto {
    color: #ccffff;
    cursor: pointer;
}
.goto:hover {
    color: #33ffff;
}

.legend.leaflet-control .layer_legend {
    background-color: rgba(60,60,60,0.8);
    color: #fff;
    padding: 4px 8px;
    border-radius: 1px;
    font-family: 'Open Sans Condensed';
    font-weight: bold;
    font-size: 0.9rem;
    margin-bottom: 2px;
}
.legend.leaflet-control .layer_legend table {
    background-color: transparent;
    margin: 0px auto;
    font-family: monospace, ui-monospace;
    font-weight: normal;
}

.legend.leaflet-control .layer_legend td,
.legend.leaflet-control .layer_legend tr {
    background-color: transparent;
    vertical-align: top;
    font-size: 0.81rem;
}
a:link {
    color: #86a1c6;
}
a:hover {
    color: #4da6ff;
}
a:visited {
    color: #b3d9ff;
}

#dl_url {
    font-size: 0.8rem;
}
#modeling_buttons_table {
    display: none;
    width: calc(100% - 12px);
    margin: 10px 6px;
    
}
#modeling_buttons_table tr {
    background: transparent;
}
#modeling_buttons_table td {
    padding: 0px 4px;
    width: 25%;
    
}
#modeling_buttons_table div.button {
/*     width: 24%; */
    width: auto;
    max-width: 240px;
    margin: 0px auto;
    font-size: 1rem;
    border-radius: 3px;
    background-color: #6aaf7a;
/*     color: #cccccc;  */
/*     opacity: 0.5; */
/*     border: 2px solid #cd7aad; */
}

#modeling_buttons_table div.button.pretrain {
    border-color: #cd7aad;
/*     color: w; */
}
#modeling_buttons_table div.button.train {
    border-color: #bd5189;
/*     color: black; */
}
#modeling_buttons_table div.button.test {
    border-color: #a33e63;
/*     color: white; */
}
#modeling_buttons_table div.button.predict {
    border-color: #8a0f44;
/*     color: white; */
}
#modeling_buttons_table div.button:hover {
    opacity: 1.0;
    color: white;
    background-color: #24422b; 
/*     border-width: 4px; */
}
.content.datacube .datacube_layers_table .processingsteps_list table {
    margin: 0px;
    width: 100%;
}
.content.datacube .datacube_layers_table .processingsteps_list table tbody {
    border: none;
    background-color: transparent;
}
.content.datacube .datacube_layers_table .processingsteps_list table tr:hover {
    background-color: transparent;
}
.datacube_layers_table .processingsteps_list table td {
    font-size: 0.70rem;
    border: none;
    color: #ffffcc;
}

.header_info {
    font-size: 0.85rem;
    color: #baba5e;
    text-transform: none;
    font-style: italic;
}
.header_info.warning {
    color: #d65c5c;
}


.file {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}
.file + label {
    font-size: 20px;
    font-weight: 700;
    color: white;
    text-align: center;
    background-color: #538cc6;
    padding: 6px 26px;
    border-radius: 3px;
    display: inline-block;
    cursor: pointer;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}

.file + label:hover {
    background-color: #2273c3;
}
.file.xml + label {
    font-size: 0.9rem;
    font-weight: normal;
    color: #888;
    background-color: transparent;
    padding: 2px 2px;
    float: left;
    border-radius: 1px;
    display: inline-block;
    cursor: pointer;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.file.xml + label:hover {
    background-color: #111;
    font-weight: bold;
}
.modal_upload .modal {
    height: auto;
    
}
.modal_upload td {
    padding: 2px 8px;
}
.modal_upload td.input {
    text-align: right;
}
.modal_upload tr {
    background-color: transparent;
    
}
.modal_upload tr.instructions td {
/*     padding-left: 40px; */
    font-size: 13px;
    color: #999;
    text-align: right;
}
.modal_upload td.main_label {
    width: 100px;
    color: #f2f2f2;
}
.modal_upload .footer_buttons td {
    padding-top: 10px;    
}


.footer_buttons {
    text-align: center;
}
.footer_buttons td {
    padding-right: 6px;
    padding-bottom: 10px;
}
.footer_buttons .button {
    color: #f2f2f2;
    padding: 4px 12px;
    margin: 0px 1px;
    font-weight: bold;
    font-size: 1.5rem;
    display: inline;
    border-radius: 4px;
}
.footer_buttons .button.submit {
    background-color: #318131;
}
.footer_buttons .button.submit:hover {
    background-color: #3fa63f;
    color: #fff;
}
.footer_buttons .button.submit.disabled {
    pointer-events: none;
    opacity: 0.3;
}
.modal_upload .footer_buttons td {
    padding-top: 10px;    
}
form {
    margin-block-end: 2px;
}
#uploadForm {
    margin-top: 6px;
}

.modal_upload span.highlight {
    color: #ff8080;
}
span.highlight.allgood {
    color: #66ff66;
}
span.highlight.notRelevant {
    color: #666;
}
.modal_upload .highlight {
    font-weight: 600;
}
.collapse div.model_select_div {
    width: calc(100% - 40px);
    display: none;
    color: #999;
    font-size: 1.0rem;
    text-align: center;
    margin: 0px auto;
    vertical-align: middle;
}
.model_select_div select {
    margin-left: 3px;
    width: auto;
    font-size: 1.1rem;
    padding: 3px 6px;
    height: 2.0rem;
}
/*.selected_model_description {
    margin: 8px 4px 10px 30px;
    color: #c2c2a3;
}*/


.collapse_training,
.collapse_model_run, 
.collapse_parameters, 
.collapse_datacube {
    display: none;
}

table.model_parameters_table {
    margin: 0px auto;
    width: 100%;
}
.model_parameters_table td {
    text-align: right;
    vertical-align: middle;
/*     line-height: 0.8rem; */
    padding: 1px 6px;
}
.model_parameters_table td.label {
    text-align: left;
    font-size: 0.75rem;
    padding: 2px 6px;
    color: #ccc;
}

.model_parameters_table input {
    padding: 1px 6px;
    width: auto;
    background-color: #333;
    color: #ccffcc;
    border: none;
    margin-bottom: 0px;
}
.model_parameters_table input[type="number"] {
    width: 40px;
    text-align: right;
}
.model_parameters_table input[type="number"]::-webkit-outer-spin-button,
.model_parameters_table input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.model_parameters_table input[type="number"] {
    -moz-appearance: textfield;
}

.model_parameters_table select {
    width: auto;
    color: #ccffcc;
    margin-bottom: 0px;
}
#cma_initialize_form {
    display: none;
}
.cma_navigate {
    color: #999;
    position: relative;
    margin-left: 8px;
    vertical-align: middle;
    font-size: 1.0rem;
    cursor: pointer;
    float: left;
}
.cma_navigate:hover {
    color: #f2f2f2;
}
.cma_button_container {
    text-align: center;
    margin: 20px auto 4px auto;
    width: 70%;
}

.button.cmainit {
    margin: 0px 10px;
    display: inline-block;
    width: 25%;
}
.button.cancel {
    background-color: #a97070;
}
.button.cancel:hover {
    background-color: #cf1717;
}
.form_validation_message {
    text-align: center;
    margin: 4px auto;
    color: #e06c6c;
    font-size: 0.8rem;
}

.leaflet-top .cma_header.leaflet-control {
    margin-top: 0px;
    margin-right: 0px;
    min-width: 200px;
    background-color: rgba(68,68,68,0.9);
    text-align: center;
    padding: 0px 0px 10px 0px;
    border-radius: 0px 0px 0px 6px;
}

/*safari only*/
_::-webkit-full-page-media, _:future, :root select {
    -webkit-appearance: none; 
    padding: 3px 8px;
}
_::-webkit-full-page-media, _:future, :root input[type="checkbox"] {
    accent-color: white;
    
}

.cma_header input::-webkit-outer-spin-button,
.cma_header input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.cma_header table {
    min-width: 180px;
    margin: 2px auto;
    
}
.cma_header tr {
    background: transparent;
    
}
.cma_header td {
    text-align: center;
    background-color: transparent;
    color: white;
    font-size: 0.8rem;
    padding: 4px 2px 2px 2px;
    border: none;
    
}

.button.cma {
    padding: 3px 5px;
    color: #ffcc66;
    background-color: transparent;
    font-size: 0.8rem;
    line-height: 0.85rem;
    margin: 0px auto;
}
#cma_loaded {
    margin-top: 0px;
    color: #90d5c4;
    font-weight: bold;
    font-size: .95rem;
    line-height: 1.1rem;
}
#cma_loaded.notactive {
    color: #999;
    font-size: 0.95rem;;
    font-weight: normal;
    font-style: italic;
}

.leaflet-top.leaflet-left {
    margin-left: 20px;
/*     left: 50%; */
/*     transform: translate(-50%, 0%); */
}
#cma_initialize_params table {
    width: 100%;
}
#cma_initialize_params td {
    font-size: 0.75rem;
    text-align: right;
    color: #f2f2f2;
}
#cma_initialize_params td.label {
    text-align: left;
}
.cma_initiate_title {
    color: #999;
    font-size: 1.0rem;
    padding-top: 6px;
}

.modeling_message {
    padding: 4px 20px;
    color: #f2f2f2;
    font-size: 1.0rem;
}

.start_cma_link {
    color: #ffcc66;
    cursor: pointer;
}
.start_cma_link:hover {
    color: #ffb366;
}

#processingsteps_listtable td.edit img {
    cursor: pointer;
    fill: white;
}

.loading_spinner,
.button.load_sites.sites .loading_spinner,
.collapse div.loading_spinner
{
/*     display: none; */
    width: 10px;
    height: 10px;
    margin: 0px 4px;
    float: right;
    border: 3px solid #555;
    border-top: 3px solid #b3b3b3;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
.loading_fishnet,
.loading_sites {
    color: #666;
    display: none;
}
.button.load_sites.sites .loading_spinner {
    position: relative;
    top: 9px;
}
#cma_fishnet_message {
    color: #d5d590;
}

.parameters_form_table {
    text-align: center;
    
}
.parameters_form_title {
    margin: 0px 0px 12px 0px;
    font-size: 1.0rem;
    color: #f2f2f2;
}
.parameters_form .close-top {
    top: -4px;
}

.parameters_form .button {
    min-width: auto;
    width: 30%;
    margin: 0px 4px;
    float: right;
}

.parameters_form .button.cancel {
    float: left;
    
}
.overlay.parameters_form {
/*     display: block; */
}
.button_container {
    margin-top: 20px;
    min-width: 200px;
    text-align: center;
    width: 100%;
    vertical-align: middle;
}
.button.selected_model_config,
.button.model_type_label {
    display: none;
    text-transform: uppercase;
    font-family: monospace, ui-monospace, Arial; 
    margin: 0px 0px 0px 20px;
    text-align: left;
/*    margin: 10px auto;
    width: 260px;
    font-size: 1.1rem;
    background-color: #8a8a5c;*/
}
.button.model_type_label {
    display: block;
    
}
.button.selected_model_config:hover {
/*     background-color: #006600; */
    background-color: #333;
}
.parameters_form_header {
    color: #888;
    font-size: 0.8rem;
}

.button.selected_model_config {
/*     display: none; */
}

.model_parameters_table input[type='range'] {
    cursor: pointer;
    
}

.range_value {
/*     padding-left: 10px; */
/*     display: inline; */
    text-align: right;
    float: right;
/*     width: 100%; */
    vertical-align: middle;
    color: #ccffcc;
}
.range_label {
    font-size: 0.75rem;
    color: #777;
    vertical-align: middle;
}
td.range_td {
    text-align: left;
}

.emri_keyword {
    font-weight: bold;
    font-family: 'Open Sans Condensed';
    color: #8cd9d9;
}
.emri_keyword:hover {
    color: white;
    
}

.emri_keyword_break {
    color: #777;
    
}
.noUi-target {
    border: none;
    box-shadow: none;
}
.noUi-horizontal {
    height: 8px;
    
    
}
.noUi-connect {
    background: #0080ff;
    border: 1px solid #0080ff;
    
}
.noUi-base {
    cursor: pointer;
}
.noUi-handle:after, .noUi-handle:before {
    display: none;
}
.noUi-horizontal .noUi-handle {
    width: 18px;
    height: 18px;
    border-radius: 8px;
    cursor: pointer;
    background-color: #0080ff;
    box-shadow: none;
    border: none;
}
.noUi-horizontal .noUi-handle:hover,
.noUi-connect:hover 
{
    background-color: #0066cc;
    border-color: #0066cc;
}
.range_double {
    display:inline-block;
    width: 120px;
    margin: auto 4px;
    
}

.datalayer_table td.label {
    vertical-align: middle;
    
}

#mineral_sites_display_by {
    display: none;
    
}

.button.load_sites.cma {
    width: auto;
    display: inline-block;
}

.mineral_sites_results_message {
    margin: 6px auto 10px auto;
    text-align: center;
    color: #ababed;
}
.mineral_sites_n_results {
    font-weight: bold;
    color: #f2f2f2;
    font-size: 0.85rem;
}
.mineral_site_marker {
    transition: 0.2s;
    -o-transition: 0.2s;
    -webkit-transition: 0.2s;
}
.legend.leaflet-control #legendcontent_sites td.label {
    vertical-align: middle;
    padding: 0px 7px 0px 7px;
    color: #999;
    font-size: 0.73rem;
    font-family: var(--font-family-primary);
}

.dot {
  height: 12px;
  width: 12px;
  border-radius: 50%;
  display: inline-block;
/*   margin: 2px 2px 0px 2px; */
}
#sites_legend {
    margin: 10px 12px;
    
}

.legend_entry {
    margin-top: 2px;
    vertical-align: middle;
    font-weight: normal;
    line-height: 0.90rem;
    font-size: 0.80rem;
    font-family: monospace, ui-monospace, Arial; 
}

div.emri_keyword {
    margin-left: 10px;
    
}
.confidence {
    color: #f0f07a;
    font-weight: normal;
    font-size: 0.7rem;
    font-family: monospace, ui-monospace, Arial; 
}
.confidence .lab {
    color: #bfbfbf;
    font-family: var(--font-family-primary); 
    
}

.button.load_sites.sites {
    margin: 0px 10px 10px 10px;
    display: inline-block;
    line-height: 1.3rem;
    padding: 10px 10px;
    width: 30%;
    
}

.legend_header {
    background-color: rgba(110, 110, 110, 0.9);
    cursor: pointer;
    text-transform: uppercase;
    padding: 4px 10px 2px 6px;
}
.legend_body {
    background-color: rgba(40,40,40,0.6);
    padding: 4px 10px 10px 10px;
}

#legendcontent_sites {
    padding: 0px;
}

select#sites_display_select {
    background-color: #222;
}

#mineral_sites_extent_tr td {
    padding: 4px 4px;
}

.macrostrat_source {
    font-size: 0.75rem;
    line-height: 0.77rem;
}
.macrostrat_source a {
    
    
}

.message_modal_content {
    margin-top: 20px;
    color: white;
}
.message_modal_header {
    font-size: 1.2rem;
    color: #bfbfbf;
}

#choose_cma_table {
    margin-top: 10px;
    width: 100%;
}

#choose_cma_table td {
    text-align: left;
    padding: 6px 8px;
    font-size: 1.1rem;
}

#choose_cma_table td.description {
    color:#ababed;
}

#load_cma_modal .modal {
    height: auto;
    max-height: 600px;
    overflow-y: auto;
    width: 75%;
    left: calc(12.5% - 40px);
   
}

#choose_cma_table tbody tr {
    cursor: pointer;
}

.cma_start_div {
    padding: 0px 6px;
}

.mpm_top_options {
    padding: 4px 4px 0px 4px;
    color: #777;
    font-size: 0.85rem;
    text-align: right;
}
.mpm_top_options.modeling {
    text-align: left;
    padding: 0px 4px 10px 16px;
    display: none;
}
.mpm_top_active {
    margin-top: -12px;
    text-align: left;
    color: #bfbfbf;
    font-size: 0.8rem;
    padding: 0px 8px;
    min-width: 200px;
    max-width: 400px;
}

.download_icon {
    margin: auto 4px;
    cursor: pointer;
}

#model_info .parameters_form_title {
    font-size: 1.1rem;
    
}
#model_info .content {
    color: #f2f2f2;
    padding: 10px 20px;
    
}
/*.mpm_title {
    float: left;
    font-family: 'Open Sans Condensed';
    font-size: 0.9rem;
    margin-right: 10px;
    color: #f2f2f2;
    
}*/
#uploadForm_datalayer table,
#uploadFormCSV table {
    width: auto;
    margin: 0px auto;
    
}

#uploadForm_datalayer .model_parameters_table td {
    padding: 6px 10px;
    
}
.model_parameters_table td.buttons_td {
    text-align: center;
    background-color: #262626;
}

.modal_uploaddatalayer .modal {
    width: auto;
    overflow-x: hidden;
    transform: translate(calc(-50% + 0.5px), calc(-50% + 0.5px));
    top: 50%;
    left: 50%;
}

.collapse div.topbar_button,
.collapse .header div.topbar_button,
div.topbar_button {
/*     position: relative; */
    float: right;
    width: auto;
    display: inline;
    text-transform: none;
    font-size: 0.8rem;
    vertical-align: bottom;
    padding: 0px 0px;
}
.collapse div.topbar_button img,
.collapse .header div.topbar_button img,
div.topbar_button img {
    margin: 4px 0px 0px 0px;
    vertical-align: bottom;
}

.collapse .header div.topbar_button.super {
    margin-right: 10px;
    
}

.button.load {
    background-color: #957b9d;
}
.button.load:hover {
    background-color: #534158;
    
}

#model_runs_table tr {
    cursor: pointer;
    
}

.date {
    color: #c09cc9;
}
.time {
    color: #c99ca7;
}
.model_run_instructions {
    font-size: 0.80rem;
    text-align: left;
    padding: 2px 0px 16px 0px;
}
#model_run_loaded {
    padding: 2px 0px 8px 0px;
}

.model_run_id {
    color: #90d5c4;
}
.model_run_id.disabled {
    color: #c3c3c3;
}

#modeling_initial_message2 {
    margin-top: 10px;
    display: none;
    
}
#load_model_run .modal {
    width: 80%;
    left: 7%;
}
.datalayer_lowlight {
    color: #999;
}

.datalayer_table td.name:hover, .datacube_layers_table td.name:hover {
    color: white;
/*     font-weight: bold; */
}

.datalayer_lowlight:hover {
/*     color: white; */
    font-weight: normal;
}

.cmamodelrun tbody td {
    font-size: 0.9rem;
    padding: 3px 6px;
    
}
.header.topbar.toptop,
.header.topbar.deposit_sites,
.header.topbar.modeling,
.header.topbar.model_results {
    margin-bottom: 8px;
    
}
#uploadForm_datalayer .model_parameters_table td.label.subheader {
    padding-top: 20px;
    color: #fdc086;
}
.mineral_sites_download_link {
    display:none;
    font-size: 0.65rem;
}

.datalayer_table input[type="checkbox"].dedup_chk {
    margin-right: 6px;
    
}

#show_sites .modal,
#graph_modal .modal {
    width: 90%;
    height: 90%;
    top: calc(5% - 24px); 
    left: calc(5% - 40px);
}

#sites_table thead td {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: #262626;
}

#sites_table thead td.top {
    top: -16px;
}

#sites_table tbody td {
    overflow-x: hidden;
    max-width: 100px;
    text-align: left;
    font-size: 0.8rem;
}
/*#sites_table tbody tr:nth-child(odd) {
    background-color: rgb(64,64,64);
}
#sites_table tbody td {
    border-bottom: 1px solid #444;
}*/
#sites_table tbody tr:hover {
    background-color: #222;
}
#sites_table tbody td.msids {
/*     font-size:  */
}
#sites_table tbody td.sources {
     border-bottom: 1px solid #666; 
/*     background-color: transparent; */
/*     min-width: 200px; */
}
#sites_table tbody td.dt_data {
    font-size: 0.70rem;
    color: #acd2ac;
}
#sites_table tbody td.dt_data.conf {
    font-size: 0.8rem;
    font-family: monospace;
}
#sites_table tbody td.commodity {
    color: #ffffcc;
}
#sites_table tbody td.site_src_toggle_tr {
    color: #888;
    font-size: 0.7rem;
    font-style: italic;
    cursor: pointer;
    background: transparent;
}
#sites_table tbody td.site_src_toggle_tr:hover {
    color: #fff;
}
#sites_table tbody td.id {
    font-size: 0.6rem;
    color: #c3c3c3;
}
#sites_table td.primdep_header {
    color: #8bc18b;
}

#sites_table td.primdep_header.top {
    border-bottom: 1px solid #455445;
}
#sites_table td.sources {
    color: #fdc086;
    font-size: 0.7rem;
}
#sites_table td.primdep_header.sources.top {
    border-bottom: 1px solid #634c36;
}
#sites_table td.primdep_header .onecol_subhdr {
    width: 33%;
    display: inline-block;
}

.close-top.layer_legend_close {
    top: -4px;
    right:-8px;
    background-color: transparent;
}

a.site_src_link {
    font-size: 0.7rem;
    
}
#graph_modal .modal {
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}
#graph_modal_content text {
    fill: #fff;
    font-size: 0.9rem;
    
}

#graph_modal_content line,
#graph_modal_content path {
    stroke: #666;
}

.mineral_site_info_table {
    width: 100%;
}
.model_parameters_table table.mineral_site_info_table tr {
    background-color: transparent;
    
}
.mineral_site_info_table td {
    border-bottom: 1px solid: #222;
    text-align: right;
    
}
.mineral_site_info_table.sources td,
.mineral_site_info_table td.sources {
    text-align: left;
}
.mineral_site_info_table.sources td.rank,
.mineral_site_info_table td.rank {
    text-align: center;
}
.mineral_site_info_table.sources td.type,
.mineral_site_info_table td.type{
    font-size: 0.7rem;
}
.mineral_site_info_table td.label {
    text-align: left;
}
.button.histogram {
    background-color: #6a7baf;
}
#model_run_edited {
    display: none;
    color: #c3c3c3;
    font-size: 0.75rem;
}

#model_run_status.active {
/*     color: orange; */
    /*float: right;
    position: relative;
    width: auto;
    top: -30px;
    font-size: 0.8rem;*/
    animation: color-change 4s infinite;
}
.collapse.modeling .content.main {
    margin-top: 2px;
    
}
/*#model_select {
    float:right;
    margin-right: 20px;
    
}*/

.model_run_are_you_sure .modal {
    color: #f2f2f2;
    font-size: 1.0rem;
/*     width: auto; */
    height: auto;
    
}

.new_run_start_label {
    color: #6aaf7a;
    font-weight: bold;
}
.new_run_cancel_label {
    color: #a97070;
    font-weight: bold;
}

#modeling_status_navigation {
    display: none;
}
.back_arrow {
    color:#b3b3b3;
    display: inline-block;
    font-size: 1.2rem;
    line-height: 1.2rem;
    font-weight: bold;
    margin-left: 14px;
    cursor: pointer;
    max-width: 24px;
}
.back_arrow:hover {
    color: white;
}

.collapse div.model_run_status_title {
    display: inline-block;
    text-align: center;
    width: calc(100% - 80px);
    color: #c3c3c3;
    margin-left: 20px;
    font-size: 0.9rem;
/*     margin-bottom: 10px; */
}


#modeling_status_pane table thead th,
#modeling_status_pane table tr {
    background-color: transparent;
    color: #f2f2f2;
}

.collapse div.model_run_status_div {
    border-top: 1px solid #555;
    padding-top: 6px;
    margin: 8px 20px;
    width: calc(100% - 40px);
}

.model_run_status_header {
    color: #999;
    margin-bottom: 10px;
    font-size: 0.8rem;
}

.model_run_status_header .model_run_id {
    font-size: 1.0rem;
    
}
#modeling_status_pane .model_run_status_table {
    margin-left: 40px;
    width: calc(100% - 40px);
}

.model_run_status_table td.status {
    color: #f2f2a6;
    
}

#modeling_status_pane {
    display:none;
}

#model_output_layers_filter {
    margin: 0px 20px;
    width: calc(100% - 40px);
    color: #bfbfbf;
    font-size: 0.8rem;
    text-align: center;
}
#model_output_layers_filter select {
    width: 280px;    
}

#outputlayer_container,
#processedlayer_container {
    display: none;
}
td.hypertune {
    padding: 0px 20px;
    
}
.rotate {
    transform: rotate(-70deg);
    
/*     writing-mode: vertical-lr; */
}
.rotate_container {
    width: 16px;
    padding-left: 4px;
    height: 70px;
    display: inline-block; 
    position: relative;
    left: -10px;
    top: 48px;
    pointer-events: none;
}
input.hypertune_input {
    margin-left: 4px;
    cursor: pointer;
}

.model_parameters_table tbody tr.hypertune_labels {
    background-color: transparent;
}
td.hypertune {
    display: none;
}
.model_parameters_table.vector_attrs th {
    text-align: center;
    font-weight: normal;
    color: #999;
}
.model_parameters_table.vector_attrs td {
    text-align: left;
}
.model_parameters_table.vector_attrs td.vals {
    font-family: 'Open Sans Condensed';
}
.attrvalue {
    color: #ffffcc;
    font-family: monospace;
    font-size: 0.8rem;
}
.topbar_button {
    color: #888;
}
.topbar_button img:hover {
    background-color: #111;
}
.legend_body tr.buttons td {
    padding: 0px 2px 4px 0px;
}
tr.site_src_row_extra {
    display: none;
}

#sites_tbody td {
    vertical-align: top;
}

.sites_sort_th td:not(.sources) {
    cursor: pointer;
}
.sites_sort_th td:not(.sources):hover {
    font-weight: bold;
}

.button.model_process_submit {
    line-height: 1.1rem;
    padding: 8px 10px;
    min-height: 2.2rem;
    height: 100%;
}

#modeling_buttons_table div.button.preprocess {
    background-color: #afaf6a;
}
#modeling_buttons_table div.button.preprocess:hover {
    background-color: #74743e;
}

#modeling_buttons_table div.button.run {
    background-color: #6a9daf;
}

#modeling_buttons_table div.button.run:hover {
    background-color: #365763;
}


.header.topbar.modeling_topbar {
    background-color: #3d2932;
}
.header.topbar.modeling_topbar:hover {
    background-color: #100a0d;
}

#uploadFormCSV table {
    width: 100%;
}
#uploadFormCSV td.label {
    color: #f2f2f2;
   min-width: 240px;
    
}

.datacube_layers_table tbody td.complete {
    color: #9cc9ab;
    font-style: italic;
    cursor: pointer;
}
.datacube_layers_table tbody td.complete:hover {
    color: #75f09e;
}

#modeling_buttons_table  div.button.model_process_submit.disabled {
    background-color: #666;
    color: #999;
    cursor: default;
}
#message_modal_small {
    display: none;
    position: fixed;
    background-color: rgba(40,40,40,0.9);
    border-radius: 2px;
    padding: 12px 16px;
    top: 10px;
    right: 10px;
    width: auto;
    height: auto;
    z-index: 99999;
}
#message_modal_small .content {
    color: #c3c3c3;
}

#message_modal_small .content .highlight {
    font-family: monospace;
    color: #ff8080;
}

#model_button_status_select_model,
#model_button_status,
#model_runtime_estimate {
    width: calc(100% - 40px);
    padding: 0px 20px;
    color: #d65c5c;
}
#model_runtime_estimate {
    color: #c3c3c3;
    text-align: center;
}
#model_runtime_estimate .runtime_minutes {
    color: #b3e6ff;
    font-family: monospace;
}
div.download {
    float: right;
    display: inline;
    cursor: pointer;
    width: auto;
    padding-top: 4px;
    
}
#user_upload_sites_tools {
/*     margin-top:20px; */
    display: none;
}
#training_data_user_sites_label {
    display: none;
    font-size: .75rem;
}
#training_data_user_sites_label .mineral_sites_n_included, 
#training_data_user_sites_label .n_user_upload_sites,
.n_user_upload_sites {
    color: #fff;
}
#training_info_using_processed_lr {
    display: none;
}
/*.content.training {
    padding: 0px 40px 8px 10px;
    color: #c3c3c3;
    width: calc(100%-26px);
}*/


.datacube_layers_table tr.label_raster.disabled td {
    color: #999;
    
}

.lr_asterisk {
    color: #ff33cc;
    font-size: 1.0rem;
    font-weight: bold;
}
#datacube_message_div {
    margin-bottom: 10px;
}

#uploaddl_subcategory_tr {
    display: none;
}

#recommended_proc_steps {
    color: #d6b85c;
}

.toggle_intersecting {
    color: #999;
    display: none;
    font-size: 0.75rem;
    text-align: center;
    direction: ltr;
    padding: 0px 8px 2px 8px;
    
}

#uploadFormCSV td {
    font-size: 0.95rem;
    line-height: 1.1rem;
    color: #f2f2f2;
}
label.chk_label {
    font-size: 0.73rem;
    padding-left: 5px;
    color: #999;
    cursor: pointer;
    font-family: var(--font-family-primary);
}
.preprocess_and_run {
    display: none;
}

.collapse div.modeling_instructions.uploadsites {
    padding: 4px 20px;
    font-size: 0.9rem;
    
}

#user_upload_sites_file_name {
    font-weight: bold;
    color: #baba5e;
    
}
.upload_sites_label {
    margin-bottom: 4px;
}

.upload_sites_options {
    margin-left: 10px;
    font-size: 0.95rem;
    
}
select[multiple] options.active,
select[multiple] options.focus,
select[multiple] options.hover,
select[multiple] options.checked:after {
    color: white;
}

#toggle_controls_toggle {
/*     cursor: pointer; */
    text-align: right;
    background-color: rgba(100,100,100,0.3);
    margin-bottom: 2px;
    padding: 0px 4px;
    
}
#toggle_controls_toggle label {
     cursor: pointer;
    
}

input.layer_toggle_radio {
    display: none;
}
#toggle_controls_toggle {
    display: none;
}

.n_layers {
    color: #999;
    font-size: 0.8rem;
    font-style: italic;
}

.n_layers .on_map {
    text-transform: none;
    font-style: normal;
    font-size: 0.70rem;
    color: #c7826b;
}

tr.datalayer_row.hide_table_row {
    display: none;
    
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@keyframes color-change {
  0% { color: white; }
  50% { color: orange; }
  100% { color: white; }
}
/*#btn_cma_load {
    color: #ffb366;
}*/
/*.content.datacube .datacube_layers_table tbody {
    box-shadow: 10px -5px rgba(90,90,90,0.5 );
}*/

.rec-warning {
    color: #d65c5c;
}

input.dynamic_search {
    margin-right: 10px;
    margin-top: 4px;
    text-align: left;
    direction:ltr;
}
input.dynamic_search::placeholder {
    text-align: left;
}

.leaflet-contextmenu {
    display: none;
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
    -webkit-border-radius: 4px;
    border-radius: 4px;
    padding: 4px 0;
    background-color: #fff;
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}