/*************************
*******General******
**************************/

/* Was 110%, which scaled every rem-based Bootstrap size up ~10% and made the
 * page read noticeably larger than the GCS web UI. Back to the browser default
 * so typography matches the main app. */
html {
    width: 100%;
    font-size: 100%;
}

/* Clears the fixed navbar (min-height 64px in zenadrone-theme.css) plus
 * breathing room. Was 116px, sized for the old taller header. */
.content {
  margin-top: 96px;
  padding-bottom: 8px;
}

a {
  text-decoration: none !important;
}

/* Colours, fonts, weights and surfaces are owned by zenadrone-theme.css.
 * Only structural rules that the theme layer does not care about live here. */

h1 img {
    vertical-align: top;
}

/* upload page */
table.spaced {
	margin: 16px 0;
}

td.left {
	padding-right: 20px;
}

.align-right{
	float: right;
}

tr .space-above > td {
	padding-top: 1em;
}


.plot-legend-box {
	border-left-style: solid;
	border-left-width: 20px;
	padding-left: 4px;
}

.tooltip-inner {
    text-align: left;
}



/* browse page / DataTables */

/* The log table has 10 columns and needs more room than the centred content
 * column allows. Previously this was done with `width: 150%; margin-left: -25%`,
 * which overflowed the page on narrow viewports; scroll the table inside its
 * own container instead so the page body never scrolls sideways. */
.browse-table-scroll {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

table.dataTable {
	width: 100% !important;
	min-width: 900px;
}
table.dataTable td {
	text-align: left;
}
.map_overview {
   width: 70px;
   height: 70px;
   object-fit: cover;
   border-radius: 4px;
   transition: all 0.5s ease-in-out;
}
.map_overview:hover {
   transform: scale(7);
   position: relative;
   z-index: 20;
}

/*************************
*******Loading bar******
**************************/

.pace {
  -webkit-pointer-events: none;
  pointer-events: none;

  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pace-inactive {
  display: none;
}

.pace .pace-progress {
  position: fixed;
  z-index: 2000;
  top: 0;
  right: 100%;
  width: 100%;
  height: 2px;
}


/*************************
*******Header******
**************************/


#header {
  /* the following makes it sticky */
  width: 100%;
  position: fixed;
  z-index: 10000 !important;
  top: 0;
  /* and expand over the whole page */
  left: 0%;
  margin-left: 0px;
}

#header .navbar-brand h1 {
  padding: 0;
  margin: 0;
}

#header .navbar-brand a:hover {
  /* avoids text underlining for the image */
  text-decoration: none;
}

.dropdown:hover > .dropdown-menu {
	/* open submenu when hovering */
	-webkit-animation: fadeInUp 400ms;
	animation: fadeInUp 400ms;
}

#header .dropdown-item {
	/* reduce menu item size */
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}

.scaleIn {
  -webkit-animation-name: scaleIn;
  animation-name: scaleIn;
}

@-webkit-keyframes scaleIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes scaleIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.fa-angle-down{
	padding-left: 5px;
}

/*************************
*******Footer******
**************************/

.copyright-text p {
  margin-bottom: 0;
}

/*************************
*******Browse******
**************************/

.no_map_overview {
  text-align: center;
  font-size: .8em;
  padding: 5px;
}