* {
  margin: 0;
  padding: 0;
}

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

html {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
}

body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  color: #333;
  background: #ddd;
  font: 13px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.disabled {
  display: none;
}

.button {
  transition-property: background, border-color, opacity;
  transition-duration: 0.2s;
  padding: 5px 10px;
  cursor: pointer;
  color: #eee;
  background: #000000;
  border: 1px solid hsla(0, 0%, 100%, 0.2);
  border-radius: 5px;
}

.button:disabled {
  cursor: default;
  opacity: 0.8;
}

.button:hover:not(:disabled),
.button:focus:not(:disabled) {
  background: hsla(211, 60%, 48%, 0.8);
  border-color: hsla(2, 82%, 49%, 0.05);
}

.button--saveEnabled {
  /*background: hsla(17, 98%, 49%, 0.2);
        border-color: hsla(17, 98%, 49%, 0.6);*/
  background: hsla(3, 80%, 38%, 0.8);
  background: hsla(3, 81%, 29%, 0.8);
}

.button--saveEnabled:hover:not(:disabled),
.button--saveEnabled:focus:not(:disabled) {
  /*          background: hsla(17, 98%, 49%, 0.3);
          border-color: hsla(17, 98%, 49%, 0.8);*/
  background: hsla(2, 81%, 41%, 0.8);
  background: hsla(2, 80%, 37%, 0.8);
}

.button--viewActive {
  background: hsla(120, 100%, 24%, 0.8);
  border-color: hsla(120, 100%, 19%, 0.6);
}

.button--viewActive:hover:not(:disabled),
.button--viewActive:focus:not(:disabled) {
  background: hsla(120, 100%, 24%, 0.5);
  border-color: hsla(120, 100%, 19%, 0.4);
}

.button--compact {
  padding: 2px 5px;
}

.sidepanel {

  max-height: 45%;
  color: #fff;
  border-bottom: 1px solid hsla(0, 0%, 0%, 0.2);
  box-shadow: 0 0 7px hsla(0, 0%, 0%, 0.1);
}

.sidepanel__header {
  display: flex;
  flex: 1 0;
}

.sidepanel__logo {
  padding: 10px;
  color: #000;
  background: #fff;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  border-right: 1px solid #d12d26;
}

.sidepanel__logo img {
  position: relative;
  top: -3px;
  display: block;
  margin: 0 auto 5px;
}

.sidepanel__info {
  flex: 1;
  padding: 10px;
  background: #fff;
}

.sidepanel__tools {
  box-sizing: border-box;
  padding: 10px;
  background: #1B4A78;
}

.sidepanel__body {
  display: flex;
  background: #f3f3f3;
}

.gapiAuth--statusUnknown,
.gapiAuth--isSignedIn .gapiAuth__signIn,
.gapiAuth--isSignedOut .gapiAuth__signOut {
  display: none;
}

.sheetTable {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: auto;
}

.sheetTable--hidden {
  display: none;
}

.sheetTable table {
  table-layout: fixed;
  border-collapse: collapse;
  ;
  margin-bottom: 20px;
}

.sheetTable__corner {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: 140px;
  height: 31px;
  background: #1B4A78;
  border: solid #153866;
  border-width: 0 1px 1px 0;
}

.sheetTable__headings th,
.sheetTable__body td {
  width: 130px;
  border: 1px solid #fff;
}

.sheetTable__headings {
  position: absolute;
  top: 0;
  left: 140px;
  z-index: 2;
  width: 100%;
}

.sheetTable__headings th {
  padding: 5px;
  overflow: hidden;
  background: #bb162b;
  border: 1px solid #bb162b;
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.sheetTable__body {
  width: 100%;
  margin: 30px 1px 1px 140px;
  color: #000;
}

.sheetTable__body tr,
.sheetTable__body td {
  position: relative;
  transition: background 0.2s;
  height: 23px;
  /* TODO: Remove, should not be needed to fix empty sheet rows */
  overflow: hidden;
}

.sheetTable__body input {
  position: relative;
  width: 100%;
  margin: 0 -1px -1px 0;
  padding: 5px;
  color: inherit;
  background: transparent;
  border: 0;
}

.sheetTable__body input:focus {
  z-index: 1;
  border-color: none;
  background-color: #fff;
  color: #000;
  outline: none;
}

.sheetTable__actions {
  position: absolute;
  top: 31px;
  left: 0;
  z-index: 2;
  width: 140px;
  background: #f3f3f3;
}

.sheetTable__actions td {
  padding: 2px 5px;
}

.sheetTable__actions__buttons {
  display: flex;
}

.sheetTable__actions button {
  flex: 1;
}

.sheetTable__actions button+button {
  margin-left: 5px;
}

.sheetTable__isDirty {
  background: hsla(17, 98%, 49%, 0.2);
}


.overlay {
  position: absolute;
  top: 1em;
  left: 0;
  right: 0;
  margin: 0 auto;
  background: #bb162b;
  width: 95%;
  z-index: 999;
  border-radius: 0.5em;
  overflow: hidden;
  box-shadow: 0 0 1em rgba(0, 0, 0, 1);
  padding: 1em;
}

.overlay--hidden {
  display: none;
}


.sheetTableAssets {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.sheetTableAssets--hidden {
  display: none;
}

.sheetTableAssets table {
  table-layout: fixed;
  border-collapse: collapse;
  ;
  margin-bottom: 20px;
}

.sheetTableAssets__corner {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: 140px;
  height: 31px;
  background: #153866;
  border: solid #113058;
  border-width: 0 1px 1px 0;
}

.sheetTableAssets__headings th,
.sheetTableAssets__body td {
  width: 130px;
  border: 1px solid #fff;
}

.sheetTableAssets__headings {
  position: absolute;
  top: 0;
  left: 140px;
  z-index: 2;
  width: 100%;
}

.sheetTableAssets__headings th {
  padding: 5px;
  overflow: hidden;
  background: #bb162b;
  border: 1px solid #113058;
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.sheetTableAssets__body {
  width: 100%;
  margin: 30px 1px 1px 140px;
  background: #f3f3f3;
}

.sheetTableAssets__body tr,
.sheetTableAssets__body td {
  position: relative;
  transition: background 0.2s;
  height: 23px;
  /* TODO: Remove, should not be needed to fix empty sheet rows */
  overflow: hidden;
  color: #000;
}

.sheetTableAssets__body input {
  position: relative;
  width: 100%;
  margin: 0 -1px -1px 0;
  padding: 5px;
  color: inherit;
  background: transparent;
  border: 0;
}

.sheetTableAssets__body input:focus {
  z-index: 1;
  border-color: none;
  background-color: #fff;
  color: #000;
  outline: none;
}

.sheetTableAssets__actions {
  position: absolute;
  top: 31px;
  left: 0;
  z-index: 2;
  width: 140px;
  background: #f3f3f3;
}

.sheetTableAssets__actions td {
  padding: 2px 5px;
}

.sheetTableAssets__actions__buttons {
  display: flex;
}

.sheetTableAssets__actions button {
  flex: 1;
}

.sheetTableAssets__actions button+button {
  margin-left: 5px;
}

.sheetTableAssets__isDirty {
  background: hsla(17, 98%, 49%, 0.2);
}

.confirm {
  display: none;
  background: rgba(255, 250, 255, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

}

.confirm .confirm_inner {
  background: rgba(255, 255, 255, 1);
  color: #000;
  width: auto;
  overflow: hidden;
  text-align: center;
  padding: 2em 4em;
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translate(-50%, -25%);
  border-radius: 0.5em;
  z-index: 999;
  width: 95%;
  max-width: 320px;
  border: 1px solid rgba(0, 0, 0, 0.25);
}

.confirm .confirm_msg {
  margin-bottom: 0.5em;
}

.confirm .button {
  background: #050;
  padding: 0.5em 1em;
}

.banners {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: auto;
  border-left: 1px solid #bbb;
}

.banner {
  padding: 10px 0;
  text-align: center;
  overflow: auto;
}

.banner+.banner {
  border-top: 1px solid #ccc;
}

.banner iframe {
  margin: 0 20px;
  overflow: hidden;
}

.banner__size {
  display: block;
  margin: 0 0 5px;
}

.width-helper {
  visibility: hidden;
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
}

.bannerMenu {
  overflow: auto;
  padding: 15px;
  background-color: #fff;
  display: none;
}

.viewContainer {
  display: flex;
}

.bannerListingItem {
  display: block;
  cursor: pointer;
  color: #777;
  padding: 2px;
}

.bannerListingItem:nth-child(odd) {
  background-color: #eee;
}

.bannerListingItem:hover {
  color: #000;
}

.banner-status-row-container {
  display: block;
  background: #fff;
  padding: 10px;
  box-sizing: border-box;
}

.banner-status-row {
  display: inline-block;
  height: 10px;
  padding: 4px;
}

.banner-status-TRUE {
  background-color: rgb(0, 150, 0);
}

.banner-status-FALSE {
  background-color: rgb(136, 0, 0);
}

.banner-active {
  width: 20px;
  border: 0px solid #000;
  border-radius: 20px;
}

.banner-reporting {
  font-weight: bold;
}

.searchMenu {
  padding: 15px;
  background-color: #fff;
}

.input__search {
  padding: 5px;
}

.sideBar {
  width: 30%;
}


.flag {
	display: inline-block;
	width: 5px;
	height: 10px;
	margin-right: 7px;
	border-radius: 5px;
	background-color: grey;
}

.flag.active {
	background-color: rgb(0, 150, 0);
}

.flag.inactive {
	background-color: rgb(136, 0, 0);
}