import { styled } from 'styled-components';

export const StyledSectionHeader = styled.h1`
  padding: 0;
  margin: 0;
  margin-bottom: 0.25em;

  position: relative;
  font-size: 2.5em;
  font-family: ${({ theme }) => theme.fonts.monospace};
  font-weight: bold;

  // bottom line
  &::after {
    content: '';
    position: absolute;
    top: calc(100% + 3px);
    left: 0;
    width: 100%;
    max-width: 15em;
    height: 3px;
    background-color: #fff;
  }
`;
