html {
  --lumo-primary-color: green;
  --dark-primary-color: green;
  color: red;
  background-color: yellow;
  #--lumo-font-family: Times;
}

vaadin-grid::part(cell) {
  background: rgba(30, 40, 60, 0.80);
  border-right: 1px solid rgba(173, 200, 235, 0.14);
}
vaadin-grid::part(header-cell) {
  background: rgba(10, 30, 40, 0.80);
    font-weight: bold;
    font-size: 18px;
  text-align: center;
}
vaadin-grid-cell-content {
 font-size: 14px;
 font-family:'Raleway','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ',Meiryo,sans-serif;
 padding-left : 5px;
 padding-right: 5px;
}

vaadin-grid::part(first-column-cell) {
 font-size: 9px;
  background: rgba(10, 30, 40, 0.80);
}
vaadin-grid::part(selected-row-cell) {
  background: rgba(60, 80, 120, 0.90);
}

@media (max-width: 767px) {
  /* Target the vaadin-tabs component directly for bottom fixed positioning */
  vaadin-app-layout vaadin-tabs {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;
    #background-color: var(--lumo-base-color);
    background-color: #112233;
    box-shadow: var(--lumo-box-shadow-s);
  }
}