.topbar {
  width: 100%;
  min-height: 60px;
  max-height: 120px;
  z-index: 100;
  position: fixed;
  top: 0px;

  display: flex;
  align-items: stretch;
}

.topbar-left {
  height: 60px;

  display: flex;
  align-items: stretch;
  flex-shrink: 0;
}

.topbar-title {
  min-width: 0;
  height: 60px;
  padding: 0px 20px;

  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;

  text-align: center;
  overflow: hidden;
}

.topbar-title span {
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topbar-right {
  height: 60px;

  display: flex;
  align-items: stretch;
  flex-shrink: 0;
}

.topbar-btn {
  width: 60px;
  height: 60px;
  padding: 0 !important;
  text-align: center;

  display: flex;
  align-items: center;
  justify-content: center;
}

.topbar-easyelologo {
  min-width: 80px;
  height: 60px;
  padding: 0 !important;

  display: flex;
  align-items: center;
  justify-content: center;
}

.topbar-logo {
  min-width: 120px;
  height: 60px;
  padding: 0 !important;

  display: flex;
  align-items: center;
  justify-content: center;
}