/* http://webdesignerwall.com/tutorials/css3-dropdown-menu */
/* Updated to follow Fugro Brand Guidlines */

html {
    margin:0;
    padding:0;
    height: 100%;
    box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
    font: normal .8em/1.5em Arial, Helvetica, sans-serif;
    background: #fff;
    color: #000;
    position: relative;
    margin:0;
    padding:0;
    padding-bottom: 8em;
    min-height: 100%;
}

#wrapper {
    margin: 0 auto;
}

#content {
    padding: 20px 20px 20px 20px;
}

#footer {
    position: absolute;
    right: 0; /* Sit it on the bottom */
    left: 0; /* Sit it on the bottom */
    bottom: 0; /* Sit it on the bottom */
    padding: 0.1em;
}

#user {
    padding-top: 10px;
    padding-right: 20px;
    text-align: right;
    color: #bbb;
    display:block;
}

#search {
    padding-top: 0px;
    padding-right: 20px;
    text-align: right;
    color: #666;
    display:block;
}

a:link {
    color: #000;
    text-decoration: underline;
}

a:visited {
    color: #000;
    text-decoration: underline;
}

a:hover {
    color: #000;
    text-decoration: underline;
    font-weight: bold;
}

a:active {
    color: #000;
    text-decoration: underline;
    font-weight: bold;
}

#copyright {
    color: #000;
    padding: 10px 20px 10px 20px;
    font-style: italic;
    text-align: right;
}

#logo {
    margin: 0;
    padding: 10px 10px 10px 10px;
    display: block;
    background: #fff;
}
#logo img {
    position: absolute;
    padding: 10px 20px 10px 10px;
    top: 0;
    right: 0;
    vertical-align: bottom;
}
#environment-label {
    display: inline-block;
    padding-left: 10px;
    font-weight: bold;
    font-size: 150%;
    vertical-align: bottom;
}
#nav {
    margin: 0;
    padding: 7px 6px 0;
    background: #437C92;
    width: 100%;
    line-height: 100%;
}
#nav li {
    margin: 0 5px;
    padding: 0 0 8px;
    float: left;
    position: relative;
    list-style: none;
}

h2 a {
    color: #fff;
    text-decoration: none;
}

h3 a {
    color: #fff;
    text-decoration: none;
}

/* main level link */
#nav a {
    color: #ddd;
    text-decoration: none;
    display: block;
    padding:  8px 20px;
    margin: 0;

/*    text-shadow: 0 1px 1px rgba(0,0,0, .3); */
}
#nav a:hover {
/*    font-weight: bold; */
/*    background: #000; */
    color: #fff;
}

/* main level link hover */
#nav .current > a, #nav li:hover > a {
/*    background: #666; */
    color: #ddd;
/*    border-top: solid 1px #f8f8f8; */
}

/* sub levels link hover */
#nav ul li:hover a, #nav li:hover li a {
    background: none;
    border: none;
}
#nav ul li a, #nav li li a {
    color: #ddd;
}

#nav ul a:hover {
/*    background: #0078ff !important; */
    color: #fff !important;
}

/* dropdown */
#nav li:hover > ul {
    z-index: 5;
    visibility: visible;
    transition: z-index 0s 0.15s, visibility 0s 0.15s;
    display: block;
}

/* level 2 list */
#nav ul {
    background: #437C92;
    z-index: -1;
    visibility: hidden;
    transition: z-index 0s 0.15s, visibility 0s 0.15s;
    display: none;

    margin: 0;
    padding: 0;
    width: 200px;
    position: absolute;
    top: 35px;
    left: 0;
/*    border: solid 1px #b4b4b4; */
}
#nav ul li {
    float: none;
    margin: 0;
    padding: 0;
}

#nav ul a {
    font-weight: normal;
}

/* level 3+ list */
#nav ul ul {
    width: 270px;
    left: 196px;
    top: -3px;
}

/* rounded corners of first and last link */
#nav ul li:first-child > a {
}
#nav ul li:last-child > a {
}

/* clearfix */
#nav:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
#nav {
    display: inline-block;
} 
html[xmlns] #nav {
    display: block;
}

* html #nav {
    height: 1%;
}

#dataform {
    padding: 20px;
    background: #fff;
}

pre { 
    font: 90% courier,monospace; 
    overflow: auto; 
    overflow-x: scroll;
    color: #000;
}

#campaign-table, .roamestable
{
    width: 100%;
    padding: 20px;
    text-align: center;
    table-layout: auto;
    border-collapse: collapse;
    color: #000000;
    background: #f7f7f7;
    border-left: 1px solid #9b9b9b;
    border-right: 1px solid #9b9b9b;
}

#pipelinefailed-table, .roamestable
{
    width: 100%;
    padding: 20px;
    text-align: left;
    table-layout: auto;
    border-collapse: collapse;
    color: #000000;
    background: #f7f7f7; 
    border-left: 1px solid #9b9b9b;
    border-right: 1px solid #9b9b9b;
}

#pipelinerunning-table, .roamestable
{
    width: 100%;
    padding: 20px;
    text-align: left;
    table-layout: auto;
    border-collapse: collapse;
    color: #000000;
    background: #f7f7f7; 
    border-left: 1px solid #9b9b9b;
    border-right: 1px solid #9b9b9b;
}

#box-table, .roamestable
{
    width: 100%;
    padding: 20px;
    text-align: left;
    border-collapse: collapse;
    color: #000000;
    border-left: 1px solid #9b9b9b;
    border-right: 1px solid #9b9b9b;
}
#box-table th, .roamestable th
{
    /** text-align: left; */
    font-weight: bold;
    padding: 4px;
    background: #d5d5d5;
    border-top: 1px solid #9b9b9b;
    border-bottom: 1px solid #9b9b9b;
}
#box-table td, .roamestable td
{
    vertical-align: middle;
    padding: 4px;
    background: #f7f7f7; 
    border-bottom: 1px solid #9b9b9b;
    border-top: 1px solid transparent;
}
#box-table td td, .roamestable td td
{
    vertical-align:middle;
    padding: 0px;
    border: 0px;
}
#box-table tbody tr:hover td, .roamestable tbody tr:hover td
{
    background: #ffffff;
}

#context-column
{
    min-width: 34px;
}

#box-table td.error
{
    color: #ff0000;
}

.multilist {
    /* Changing width:40% to max-width:80% and width:70% */
    /* width: 40%; */
    width: 70%;
    max-width: 80%;
}

.cssform br
{
    clear:both;
}

.cssform label
{
    width:240px;
    float:left;
    text-align:right;
    margin-right:10px;
    margin-bottom:5px;
}

.cssform textarea,
.cssform input,
.cssform select
{
    width:300px;
    padding:2px 5px;
}

.warn-memory {
    color: #C90119;
    font-weight: bold;
}

table.dataset
{
    /* width: 1080px; */
    width: 100%;
    margin: 5px;
    text-align: left;
    border-collapse: collapse;
    color: #000000;
    border-left: 1px solid #9b9b9b;
    border-right: 1px solid #9b9b9b;
}
table.dataset th
{
    /** text-align: left; */
    font-weight: bold;
    padding: 4px;
    background: #d5d5d5;
    border-top: 1px solid #9b9b9b;
    border-bottom: 1px solid #9b9b9b;
}
table.dataset td
{
    vertical-align: middle;
    padding: 4px;
    background: #f7f7f7;
    border-bottom: 1px solid #9b9b9b;
    border-top: 1px solid transparent;
}

table.dataset td.MODIFIED a
{
    color: brown;
}

table.dataset td.ADDED a
{
    color: blue;
}

table.dataset td.DELETED
{
    text-decoration: line-through;
    color: #C90119;
}

table.dataset tr:hover td
{
    background: #ffffff;
}

table.dataset td.totalrow
{
    vertical-align: middle;
    padding: 4px;
    background: #d5d5d5;
    border-bottom: 1px solid #9b9b9b;
    border-top: 1px solid transparent;
}

.scroll
{
    overflow-y: auto;
    height: 800px;
    contain: paint;
}

.scroll table
{
    width: 100%;
    text-align: left;
    border-collapse: separate;
    border-spacing: 0;
    color: #000000;
}

.scroll thead th
{
    text-align: left;
    position: sticky;
    top: 0px;
    font-weight: bold;
    padding: 4px;
    background: #d5d5d5;
    border-top: 1px solid #9b9b9b;
    border-bottom: 1px solid #9b9b9b;
    z-index: 4;
}

#flightline-table caption
{
    top: 0px !important;
    position: sticky;
    z-index: 4;
}

#flightline-table thead
{
    top: 35px !important;
    position: sticky;
    z-index: 4;
}

.scroll tbody td
{
    vertical-align: middle;
    padding: 4px;
    background: #f7f7f7;
    border-bottom: 1px solid #9b9b9b;
}
.scroll tbody td td
{
    vertical-align:middle;
    padding: 0px;
    border: 0px;
}

.scroll tbody tr:hover td
{
    background: #e5e5c9;
}

.scroll tr.hover td
{
    background: #e5e5c9;
}

.scroll tr.missing td
{
    background: #ffcccb;
}

.datasection
{
    vertical-align: middle;
    padding: 4px;
    background: #f7f7f7;
    border: 1px solid #9b9b9b;
}

.dropdown {
  position: absolute;
  padding-left: 2px;
  display: inline-block;
  align-items: center;
  align-content: center;
  vertical-align: middle;
  width: 25px;
}

.dropdown-content {
    display: none;
    position: absolute;
    background: #f7f7f7;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    border: 1px solid #9b9b9b;
    padding: 0px;
    z-index: 1;
    width:  100%;
}

.dropdown:hover .dropdown-content {display: block;}

.dropdown-content form:hover {background: #d5d5d5;}

.dropdown-content form {display: block;}

/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f7f7f7;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  vertical-align: middle;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 0px 14px;
  height: 30px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}

.operator-background {
    background-color: lightblue;
    color: black;
}

.operator-override-background {
    background-color: lightblue;
    color: red;
}

.deployment-background {
    background-color: lightgoldenrodyellow;
}

.overwrite-background {
    background-color: lightcoral;
}

.global-shadowed-background {
    background-color: orange;
}

.hide-delete {
    visibility: hidden;
}

.tooltip {
    position: relative;
}

.tooltip .card {
    visibility: hidden;
    width: 400px;
    color: #fff;
    padding: 0rem 1rem;

    /* Position the tooltip */
    position: absolute;
    left: 20%;
    z-index: 1;
    background: #506E61;
    border-radius: 1.5rem;
    overflow: hidden;

    h2 {
        font-size: 1.5rem;
        border-bottom: 2px solid rgba(255, 255, 255, 0.5);
        line-height: 3.2rem;
    }

    h3 {
        max-width: 60%;
        margin: 0.5rem 0 0.5rem;
    }

    .add-ons {
        border: 1px solid rgba(255, 255, 255, 0.3);
        padding: 1rem;
        border-radius: 1rem;
        font-size: 1rem;
        color: black;
    }
}

.tooltip:hover .card {
    visibility: visible;
}

.queue-configuration-managed {
    color: green;
}

.queue-configuration-custom {
    color: blue;
}

.queue-configuration-conflict {
    color: red;
}

/* DATA-2191: Georeferencing report table row states */
.roamestable tr.georef-residual-over-threshold td {
    color: red;
    font-weight: bold;
}

.roamestable tr.georef-uncovered td {
    color: #888888;
    font-style: italic;
}