.content {
  padding: var(--contentPaddingTopBottom) var(--contentPaddingLeftRight);
  background-color: var(--contentBackgroundColor);
}

.entryRow {
  margin-bottom: var(--entryRowMargin);
}

.headerRow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  color: var(--headerRowColor);
  padding: var(--headerRowPadding);
}

.leftHeader {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-right: var(--leftHeaderMargin);
}

.headerText {
  font-size: var(--headerTextFontSize);
}

.header {
  background-color: var(--headerBackgroundColor);
  color: var(--headerColor);
  padding: var(--headerPaddingTopBottom) var(--headerPaddingLeftRight);
  display: flex;
  justify-content: space-between;
  vertical-align: middle;
  align-items: center;
}

.rightHeader {
  text-align: right;
  padding-left: var(--rightHeaderPaddingLeft);
}

.footer,
.leftFooter,
.rightFooter {
  display: flex;
  flex-direction: row;
}

.footer {
  text-align: left;
  padding-bottom: var(--footerPaddingBottom);
  padding-top: var(--footerPaddingTop);
}

.rightFooter {
  flex: 8 0 0;
  justify-content: flex-end;
  padding-left: var(--rightFooterPaddingLeftRight);
  padding-right: var(--rightFooterPaddingLeftRight);
}

.entryEdit {
  border-bottom: var(--entryEditBorderWidth) solid var(--entryEditBorderColor);
}
