function _templateObject8() {
  var data = _taggedTemplateLiteral(["\n            margin-bottom: 10px;\n          "]);

  _templateObject8 = function _templateObject8() {
    return data;
  };

  return data;
}

function _templateObject7() {
  var data = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: 500;\n  font-size: ", "rem;\n"]);

  _templateObject7 = function _templateObject7() {
    return data;
  };

  return data;
}

function _templateObject6() {
  var data = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: 500;\n"]);

  _templateObject6 = function _templateObject6() {
    return data;
  };

  return data;
}

function _templateObject5() {
  var data = _taggedTemplateLiteral(["\n  color: ", ";\n  font-family: Rubik, sans-serif;\n  font-weight: normal;\n  font-size: ", "rem;\n  line-height: 150%;\n  text-decoration: none;\n  margin: 0;\n"]);

  _templateObject5 = function _templateObject5() {
    return data;
  };

  return data;
}

function _templateObject4() {
  var data = _taggedTemplateLiteral(["\n  height: 90px !important;\n  justify-self: end;\n\n  @media (max-width: ", "px) {\n    justify-self: start;\n  }\n"]);

  _templateObject4 = function _templateObject4() {
    return data;
  };

  return data;
}

function _templateObject3() {
  var data = _taggedTemplateLiteral(["\n  display: grid;\n  justify-content: center;\n\n  @media (max-width: ", "px) {\n    justify-content: start;\n    padding: 0;\n  }\n"]);

  _templateObject3 = function _templateObject3() {
    return data;
  };

  return data;
}

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  max-width: ", "px;\n  padding: 27px 20px;\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  align-items: end;\n\n  @media (max-width: ", "px) {\n    grid-template-columns: 1fr;\n    grid-template-rows: auto;\n    grid-row-gap: 30px;\n  }\n"]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n  height: 93px;\n  width: 100%;\n  background: #fff;\n\n  position: relative;\n  box-sizing: border-box;\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

import { jsx, css } from "@emotion/core";
import { Logo } from "@hackoregon/ui-brand";
import { BrandColors, browserDefaultSize } from "@hackoregon/ui-themes";
var footerWrapper = css(_templateObject());

var contentWrapper = function contentWrapper(props) {
  return css(_templateObject2(), props.greatestWidth, props.condensedWidth);
};

var businessWrapper = function businessWrapper(props) {
  return css(_templateObject3(), props.condensedWidth);
};

var logoStyle = function logoStyle(props) {
  return css(_templateObject4(), props.condensedWidth);
};

var textStyle = css(_templateObject5(), BrandColors.primary.hex, 15 / browserDefaultSize);
var boldText = css(_templateObject6(), textStyle);
var header = css(_templateObject7(), textStyle, 20 / browserDefaultSize);

var Footer = function Footer(props) {
  return jsx("footer", {
    css: footerWrapper
  }, jsx("div", {
    css: contentWrapper(props)
  }, jsx("div", {
    id: "contact-us"
  }, jsx("div", {
    css: css(_templateObject8())
  }, jsx("p", {
    css: header
  }, "Contact"), jsx("a", {
    css: [textStyle],
    href: "mailto:hi@civicsoftwarefoundation.org"
  }, "hi@civicsoftwarefoundation.org")), jsx("p", {
    css: boldText
  }, "Creative and Tech HQ"), jsx("p", {
    css: textStyle
  }, "Portland, OR"), jsx("a", {
    css: textStyle,
    href: "tel:5033839131"
  }, "+1-503-383-9131\u202C")), jsx("div", {
    css: businessWrapper(props)
  }, jsx("div", null, jsx("p", {
    css: boldText
  }, "Business HQ"), jsx("p", {
    css: textStyle
  }, "Washington, DC"), jsx("a", {
    css: textStyle,
    href: "tel:12026641223"
  }, "+1-202-664-1223"))), jsx(Logo, {
    css: logoStyle(props),
    type: "squareLogo"
  })));
};

Footer.defaultProps = {
  greatestWidth: 1200,
  condensedWidth: 580
};
Footer.displayName = "Footer";
export default Footer;