/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */
body {
  width: 90%;
  margin: 0 auto;
}
#wrapper {}
a { color: black;}
#header {
  background-color: #f99;
  padding: 15px 20px;
}
#header h1 {
  margin: 0;
}
#header h1 a, #header h1 a:visited {
  text-decoration: none;
  color: black;
}
#menu {
  background-color: #f99;
  padding: 0;
  border-top: 2px solid #f66;
  border-bottom: 2px solid #f66;
}
#menu::hover {color: blue;}
#menu::after {
  content: ""; 
  display: table;
  clear: both;
}
#menu a { 
  display:block;
  padding: 10px 20px;
  float: left;
  border-right: 2px solid #f66;
  border-left: 2px solid #f66;
}
#menu a:hover {
  background-color: #f66;
}


#content {
  background-color: #fee;
  padding: 20px;
}
#content h2 {
  margin: 0;
}

#grid_container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(1050px, 1fr));
  gap: 0%;
}
.grid_item {
}

.inv_data {
  border-collapse: collapse;
  border: 2px solid black;
}
.inv_data .table_header {
  background-color: #f99;
}
.inv_data th, .inv_data td {
  padding: 3px;
}
.td_amount {
  text-align: right;
}


#footer {
  background-color: #f99;
  height: 15px;
}