"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
/**
 * @Ganesh IMPORTANT
 * Replace with the appropriate elements
 * @todo use correct fonts
 */

const DescriptionHeading = styled.h3.attrs({
  children: props => props.text
})`
  @font (18, bold);
  color: $colors-black;
`;
exports.DescriptionHeading = DescriptionHeading; // dl

const DescriptionContainer = styled.div.attrs({
  'data-qa': props => props.qa
})`
  color: $colors-grey;
  margin: 0 auto;
  width: $spacing-max-width;
`;
exports.DescriptionContainer = DescriptionContainer;
const DescriptionItem = styled.div`
  display: flex;
  border-bottom: 1px solid $colors-lightgrey;
  padding: $spacing-small 0;
  flex-direction: row;
`;
exports.DescriptionItem = DescriptionItem; // dt

const DescriptionTitle = styled.div`
  @font (14,bold);
  flex: 0.5;
  @phone-or-smaller() {
    flex: 0.5;
  }
`;
exports.DescriptionTitle = DescriptionTitle; // dd

const DescriptionValue = styled.div`
  @font (14);
  flex: 3;
`;
exports.DescriptionValue = DescriptionValue; //# sourceMappingURL=styled.js.map