html {
  font-size: 62.5%;
  font-family: Verdana, Helvetica;
}

input, button, textarea, select {
  font: inherit;
}

form {
  padding: 0;
  margin: 0;
}

/* for centering the content */
/*
div.main {
}
*/

/* styles and centering */
div.mainStyle {
  font-size: 1.4em;
  color: #002040;
  border: 1px solid #000;
  text-align: center;
  margin: auto;
  min-width: 900px;
  border-radius: 8px;
  overflow: hidden;
}

/* prevents div from being max width */
div.mainOuter {
  display: table;
}

div.mainInner {
  color: #002040;
  background-color: #fff;
}

/* TESTME */
.outerTable {
  color: #002040;
  border: 1px solid #000;
}

.innerTable, table.price {
  color: #002040;
  background-color: #fff;
  text-align: left;
}

.upgradeCodeInner {
  color: #002040;
  background-color: #fafafa;
  margin: 5px;
  text-align: center;
}

.upgradeCode {
  border: 1px solid black;
  border-radius: 3px;
}

span.whatisthis {
  font-size: 0.8em;
  color: #000;
}

table.formInfo {
  padding: 10px;
}

div.formInfo {
  display: inline-block;
  margin: auto;
  color: #000;
  background: #ddd;
  border: 1px solid #26313c;
  overflow: hidden;
  border-radius: 5px;
}

div.formInfoTitle {
  color: #fff;
  background: #26313c;
  padding: 10px;
  text-align: center;
  font-weight: bold;
  font-size: 12pt;
  overflow: hidden;
}

input.formInfo, textarea.formInfo {
  width: 400px;
  padding: 10px;
  border-radius: 4px;
  border: 1px solid #000;
}

.formInfoSubtext {
  white-space: nowrap;
  padding-top: 0;
  font-size: .8em;
}

div.license {
  border: 2px solid black;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 5px 10px;
  background-color: #ddd;
}

h2.license {
  margin: 0;
  white-space: nowrap;
}

table.price {
  border-collapse: collapse;
}

td.price {
  background-color: #ddd;
  font-weight: bold;
  padding: 5px 10px;
}

td.licenseType {
  background-color: #ddd;
  font-weight: bold;
  font-size: 1.3em;
  padding: 5px 10px;
}

div.price {
  font-size: 1.3em;
  color: #002040;
  font-weight: bold;
}

ul.licenseFeatures {
  font-style: italic;
  margin-bottom: 0px;
}

td.inputName, div.inputName {
  font-weight: bold;
  white-space: nowrap;
}

.menuBar {
  color: #fff;
  background-color: #26313c;
}

a.menuLink {
  color: #fff;
}

span.name {
  font-weight: bold;
}

span.smaller {
  font-size: 8pt;
}

span.header
{
  font-weight: bold;
  font-size: 14pt;
}

td.cellHeader {
  color: #000;
  font-weight: bold;
  border-bottom: 1px solid #000;
}

td.cell {
  vertical-align: top;
  color: #000;
}

div.copyright {
  font-size: 1.1em;
  color: #fff;
  margin: auto;
  display: table;
}

div.faqtitle {
  font-size: 1.6em;
  color: #002040;
  font-weight: bold;
  text-align: center;
  margin: 25px;
}

span.faq {
  color: #002040;
  font-weight: bold;
  text-align: left;
}

div.faq2 {
  color: #002040;
  font-weight: bold;
  width: 97%;
  background-color: #b9c5d0;
  padding: 10px;
  text-align: left;
  border-radius: 4px;
}

span.faq2 {
  color: #002040;
  font-weight: bold;
  width: 100%;
  background-color: #b9c5d0;
  padding: 3px 10px;
  text-align: left;
}

div.answer {
  color: #002040;
  text-align: left;
  padding: 0 10px;
}

/*
span.price {
}
*/

span.emp {
  font-weight: bold;
}

span.emp2 {
  font-weight: bold;
  color: #800;
}

span.point {
  font-weight: bold;
  color: #800;
}

.pointExpand {
  font-weight: bold;
  color: #800;
  cursor: pointer;
}

div.details {
  padding-left: 20px;
  color: #555;
  font-size: 0.9em;
  text-align: left;
}

td.caption {
  color: #002040;
  text-align: center;
}

td {
  text-align: left;
}

span.key {
  font-weight: bold;
}

span.context {
  font-style: italic;
}

span.code {
  border: 1px solid black;
  background-color: #f3f3f3;
  font-family: monospace;
  font-size: 1.3em;
  padding: 3px;
  display: block;
}

span.term {
  font-weight: bold;
}

span.page {
  font-weight: bold;
}

span.section {
  font-weight: bold;
}

div.partner-link {
  & .text {
    margin-top: 10px;
    max-width: 400px;
    text-align: center;
  }

  & .space {
    margin-top: 40px;
  }
}

td.lang {
  &.lead {
    padding: 0 15px 0 33px;
  }

  &.data {
    padding-right: 25px;
  }

  &.header {
    padding-left: 10px;
    background-color: #e8dbd8;
    font-weight: bold;
  }

  &.gap {
    height: 30px;
  }
}

td.menuLink, td.menuLinkSelected {
  background-color: #26313c;
  padding: 3px 16px;
}

td.menuLinkSelected {
  background-color: #fff;
}

a.menuLinkSelected {
  color: #26313c;
}

span.linkbarLink {
  white-space: nowrap;
}

div.vspace {
  height: 2px;
  font-size: 1pt;
}

div.smallvspace {
  height: 15px;
  font-size: 1pt;
}

div.midvspace {
  height: 25px;
  font-size: 1pt;
}

div.mid2vspace {
  height: 50px;
  font-size: 1pt;
}

div.tallvspace {
  height: 65px;
  font-size: 1pt;
}


div.heading {
  font-weight: bold;
}


img.toggleImg {
  cursor: hand;
  cursor: pointer;
}

table.upgradeDiscount {
  color: #000;
  background-color: #ebc8ab;
  border: 1px solid #002040;
  border-bottom: none;
}

table.upgradeDiscount td {
  padding: 10px;
  border-bottom: 1px solid #002040;
}

table.upgradeDiscount th {
  background-color: #000;
  color: white;
  font-weight: bold;
  padding: 10px;
}

.downloadLink {
  font-size: 1.5em;
  font-weight: bold;
}

.downloadLinkGreen {
  color: #349633;
}

.downloadLinkBlue {
  color: #001fc2;
}

.downloadOlderVersion {
  font-size: 12pt;
}

div.upgradeInfo {
  color: #000;
  background-color: #ffd5d5;
}

div.upgradeInfoHeader {
  font-size: 1.3em;
  font-weight: bold;
  color: white;
  background-color: #800;
  padding: 5px;
  text-align: center;
}

div.upgradeInfoMain {
  padding: 5px;
}

div.upgradeInfo ul li {
  padding: 5px;
}


div.pcRequirements {
  color: #000;
  background-color: #ddd;
}

div.pcRequirementsHeader {
  font-weight: bold;
  color: white;
  background-color: #000;
  padding: 5px;
  text-align: center;
}

div.pcRequirementsMain {
  padding: 5px;
}

div.pcRequirements ul li {
  padding: 5px;
}

div.downloadNotes {
  line-height: 150%;
  width: 90%;
  margin: auto;
  text-align: center;
}

div.downloadWarning {
  border: 2px solid #800a;
  border-radius: 8px;
  padding: 10px;
  background: #8003;
}

ul.storecode li {
  padding: 3px;
}

#features {
  text-align: left;
  line-height: 150%;
}

#features li {
  margin-bottom: 5px;
}

#main_description {
  line-height: 150%;
  text-align: left;
  padding: 10px;
}

.sidebar {
  font-size: 1.2em;
  line-height: 150%;
  text-align: left;
  padding: 3px;
}

div.lookingForVersion2 {
  padding-top: 10px;
  font-size: 1.1rem;
}

div.downloadVersion2 {
  margin-top: 10px;
}

div.renewal_expired {
  border-radius: 3px;
  box-shadow: 0 0 0 4px #800;
  padding: 10px;
  color: #800;
  background: #88000010;
  text-align: center;
}

div.renewal_warning {
  border-radius: 3px;
  box-shadow: 0 0 0 4px #8808;
  padding: 10px;
  color: #800;
  background: #ffff0010;
  text-align: center;
}

div.renewal_good {
  border-radius: 3px;
  box-shadow: 0 0 0 4px #080;
  padding: 10px;
  color: #080;
  background: #00880006;
  text-align: center;
}

div.upgrade_invalid {
  border: 1px solid #fff;
  background-color: #800;
  padding: 10px;
  color: #fff;
}

div.upgrade_invalid a {
  color: white;
}

h3.license-found {
  color: #000;
}

.btnDownload {
  background-color: #348434;
  border-radius: 3px;
  box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.4), inset 0px 1px rgba(255, 255, 255, 0.2);
  padding: 14px 20px;
  width: 185px;
  font-size: 1.8rem;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  display: inline-block;
  text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.3);
  -webkit-transition: background-color ease .2s, box-shadow ease .2s;
  -moz-transition: background-color ease .2s, box-shadow ease .2s;
  transition: background-color ease .2s, box-shadow ease .2s;
  text-align: center;
  white-space: nowrap;
}

.btnDownload:hover {
  background-color: #035f03;
}

.btnDownload:after {
  content: "\25BA";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  margin-left: 10px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.btnSmaller {
  padding: 8px 20px;
  width: 150px;
  font-size: 1.5rem;
}

.btnUpgrade {
  background-color: #4668f0;
}

.btnUpgrade:hover {
  background-color: #1b45ed;
}

.btnValidate {
  padding: 8px 20px;
  font-size: 1.5rem;
  cursor: pointer;
  border-radius: 4px;
  background-color: #fff;
  border: 1px solid #0006;
}

.btnValidate:hover {
  background-color: #eee;
}

div.hr {
  border-top: 1px solid #a2a2a2;
  margin-top: 2px;
  font-size: 0;
}

div.partner {
  text-align: center;
  vertical-align: middle;
  margin: 25px auto;
  width: 400px;
}

img.partner, img.screenshot {
  border: 1px solid #000;
  box-shadow: 3px 3px 3px #888;
  border-radius: 5px;
}

div.issue {
  background-color: #000;
  padding: 1px;
  margin: 0px 50px;
}

div.issue div {
  background-color: #fff;
  padding: 1px;
}

div.issue div div {
  padding: 5px;
  color: #000;
  background-color: #f3e95f;
  text-align: center;
}

div.issue .iv div a {
  color: #000;
  font-weight: bold;
}

div.support-cat {
  color: #002040;
  font-weight: bold;
  width: 97%;
  background-color: #b9c5d0;
  padding: 10px;
  text-align: left;
  border-radius: 4px;
}

div.support-info {
  color: #002040;
  text-align: left;
  padding: 10px;
}

div.paypal-issue {
  background: #800;
  box-shadow: 0 0 5px #000;
  padding: 10px;
  color: #fff;
  border-radius: 3px;
}

div.paypal-issue a {
  color: #eee;
}

div.paypal-issue a:visited {
  color: #aaa;
}

div.paypal-issue a:hover {
  color: #fff;
}

div.key {
  color: #333;
  text-align: right;
  border: 1px solid #ccc;
  border-radius: 3px;
  box-shadow: 1px 1px #ccc;
  display: inline-block;
  background-color: #f7f7f7;
  padding: 1px 6px;
  white-space: nowrap;
}

span.register-highlight {
  font-weight: bold;
  white-space: nowrap;
}

.register-image {
  display: inline-block;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 2px 2px 8px rgba(0,0,0,0.1), -2px 0 8px rgba(0,0,0,0.1);
  /* Somehow an inherited line-height was causing extra space below the image */
  line-height: 0;
}

div.currency {
  color: #999;
  font-size: 0.8em;
  text-align: center;
  margin: 3px;
}

div.attention {
  padding: 5px;
  background: #eee;
  border-radius: 5px;
  font-size: 1em;
  font-weight: bold;

  &::before {
    content: "→ ";
  }
}

.expandable {
  transition: transform .25s ease-in-out;
  transform: rotate(0deg);

  &.open {
    transform: rotate(90deg);
  }
}

.expandable-text {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.25s ease;

  &.open {
    grid-template-rows: 1fr;
  }
}

.expandable-text-content {
  overflow: hidden;
  min-height: 0;
  opacity: 0;
  transition: opacity 250ms ease;

  &.open {
    opacity: 1;
  }

}