@charset "UTF-8";
/* Palette and type lifted from blissfulartstudio.com's styles.css, so this
   tool feels like the same family of sites rather than a bolted-on utility
   page. Only the rules this one page actually needs are reproduced here. */

html, html * {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body {
  margin-left: auto;
  margin-right: auto;
  background: #FFFFFF;
  text-align: center;
}

header {
  text-align: left;
  padding: 10px 16px;
  border-bottom: 1px solid #CBA95A;
}

.nav-logo {
  height: 48px;
  width: auto;
  vertical-align: middle;
}

main {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px 16px;
}

.hero {
  background-color: #FFFFFF;
  color: #575551;
  padding: 0;
  text-align: center;
}

.title-logo {
  display: block;
  height: 40px;
  width: auto;
  margin: 8px auto 16px auto;
}

.pageTitle {
  text-align: center;
  font-size: 20px;
  text-transform: capitalize;
  font-weight: 300;
  margin-top: 10px;
}

p {
  color: #575551;
  font-size: 14px;
  margin-bottom: 16px;
}

.button {
  display: inline-block;
  color: #000000;
  background: #F2C399;
  border: 1px #A11D22 solid;
  padding: .5em 1.8em;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 400;
  font-size: 14px;
  cursor: pointer;
  font-family: inherit;
  box-shadow: inset 5px 5px 15px #9bb691;
}

#download-row {
  margin-top: 16px;
}

.button:hover:not(:disabled) {
  background: #FFFFFF;
  border-color: #B09393;
  color: #000000;
}

.button-small {
  margin-top: 16px;
  font-size: 12px;
}

.button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

input[type="file"] {
  display: block;
  margin: 0 auto 16px auto;
  font-size: 14px;
}

.form-status {
  font-size: 14px;
  font-weight: 400;
  margin-top: 14px;
  margin-bottom: 0;
  min-height: 18px;
  color: #575551;
}

.form-status.error {
  color: #A11D22;
}

footer {
  padding: 8px 10px;
  background-color: #DFDFDF;
  font-size: 16px;
  font-weight: 200;
  margin: 24px 4px 4px 4px;
  border: 1px solid #CBA95A;
}

.footer-text {
  font-size: 13px;
  margin-bottom: 2px;
  font-weight: 400;
  color: #4A4A4A;
}

#preview-container {
  margin-top: 24px;
  overflow-x: auto;
  text-align: left;
}

/* Fully isolate the rendered document from this page's own styles (text-align,
   color, font-family, box-sizing, etc. all inherit/cascade by default) --
   without this, e.g. body's text-align: center overrides every paragraph in
   the document that doesn't set its own alignment (most don't; left is the
   Word default and is often simply omitted from the XML rather than stated). */
#preview-container * {
  all: revert;
}

#preview-container .docx-wrapper {
  background: none;
}

#preview-container .docx {
  margin: 0 0 16px 0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}