:root {
    /* fonts */
    --main-font: nimbus-sans, sans-serif;
    --title-font: nimbus-sans-extended, sans-serif;

    /* font sizes */
    --header-font-size: 70px;
    --tag-title-font-size: 56px;
    --total-font-size: 36px;
    --price-font-size: 36px;
    --store-title-font-size: 32px;
    --title-font-size: 30px;
    --featured-font-size: 28px;
    --store-font-size: 24px;
    --discount-font-size: 24px;
    --sub-font-size: 21px;
    --payment-info-font-size: 21px;
    --label-font-size: 20px;
    --store-description-size: 18px;
    --button-font-size: 16px;
    --note-font-size: 16px;
    --product-summary-font-size: 16px;
    --description-font-size: 16px;
    --login-note-font-size: 15px;
    --sub-header-font-size: 12px;
    --language-font-size: 12px;
    --catalog-font-size: 12px;
    --corner-label-font-size: 10px;

    /* font weights */
    --header-weight: 300;
    --title-weight: 400;
    --button-weight: 700;

    /* colors */
    --background-color: #0e0e0e;
    --sub-header-background-color: #e3e3e3;
    --hover-color: #181514;
    --title-color: #ffffff;
    --paragraph-color: #aaaaaa;
    --sub-color: #878080;
    --field-color: #e8e2e2;
    --line-color: #707070;
    --strike-color: #ce2701;
    --accent-color: #F8B040;
    --error-color: red;
    --panel-color: #252222;
    --table-border-color: #444;

    /* borders */
    --field-border: 1px solid var(--line-color);
    --line-border: 1px solid var(--line-color);
    --image-border: 1px solid var(--line-color);
    --button-border: 1px solid var(--accent-color);

    /* dimensions */
    --moog-logo-width: 121px;
    --moog-logo-height: 36px;
    --cart-icon-width: 20px;
    --cart-icon-height: 20px;
    --cart-button-width: 160px;
    --page-content-width: 906px;
    --page-content-maxwidth: 906px;
    --mailchimp-content-width: 666px;
    --mailchimp-content-maxwidth: 666px;
    --catalog-featured-width: 924px;
    --catalog-wide-width: 436px;
    --catalog-standard-width: 280px;
    --grid-columns-store-featured: 515px 345px;
    --buttons-width: 410px;
    --checkout-buttons-width: auto;
    --promo-code-min-width: 300px;
    --user-links-width: 80%;

    /* padding & margins */
    --content-margin: 0 auto;
    --content-padding: 0 2em;
    --store-padding: 1rem 0;
    --footer-padding: 1.3rem 0;
    --header-margin: 0 auto;
    --logo-padding: 1.2rem 2rem 1rem 0;
    --navigation-links-padding: 0 1.5rem;
    --navigation-tags-padding: 3rem;
    --grid-gap-store-featured: 30px;
    --catalog-product-padding: 15px;
    --catalog-featured-productlist-margin: 0 0 0 0;
    --catalog-featured-summary-margin: 1em 0 2em 0;
    --user-links-margin: 0;
    --buttons-margin: 3em 0 0 auto;
    --instruction-padding: 4rem 3rem 3rem 0;
    --details-padding: 5rem 0 3rem 4rem;
    --thank-you-padding: 4rem 3rem 3rem 0;
    --table-padding: 5px;
    --primary-padding: 10px;

    /* miscellaneous */
    --title-whitespace: nowrap;
    --border-radius: 4px;
    --table-border: 1px solid var(--table-border-color);
}
body {
    margin: 0;
    background: var(--background-color);
    font-family: var(--main-font);
    line-height: 120%;
    -webkit-font-smoothing: antialiased;
}
#moogLogo {
    width: var(--moog-logo-width);
    height: var(--moog-logo-height);
}
#cartIcon {
    width: var(--cart-icon-width);
    height: var(--cart-icon-height);
}
a {
    text-decoration: none;
    opacity: 1.0;
    transition: opacity 0.6s ease;
}
a:hover {
    opacity: 0.7;
    transition: opacity 0.6s;
}
a.noTransition {
    opacity: 1.0;
    transition: none;
}
a.noTransition:hover {
    opacity: 1.0;
    transition: none;
}
hr {
    border: 0;
    border-top: var(--line-border);
}
button {
    width: 100%;
    height: 45px;
    background: var(--accent-color);
    color: var(--background-color);
    opacity: 1.0;
    font-size: var(--button-font-size);
    border: 0;
    font-weight: var(--button-weight);
    cursor: pointer;
    transition: opacity 0.6s ease;
    border-radius: var(--border-radius);
    box-shadow: 0 4px 5.5px 0 rgba(0, 0, 0, 0.07);
    align-items: center;
    align-content: center;
    padding: 2px 0 0 0;
    margin: 0;
    text-align: center;
    vertical-align: middle;
}
button:hover {
    opacity: 0.7;
    transition: opacity 0.6s;
}
button:disabled {
    opacity: 0.7;
    transition: opacity 0.6s;
}
.instruction {
    border-right: var(--line-border);
    padding: var(--instruction-padding);
}
.details {
    display: inline-block;
    padding: var(--details-padding);
    color: var(--sub-color);
    font-size: var(--label-font-size);
    line-height: 120%;
}
/* Parameter honeypot */
#signupForm label[for="country"],
#signupForm input[name="country"] {
    display: none;
}
h2 {
    font-family: var(--main-font);
    font-size: var(--store-font-size);
    line-height: 125%;
    color: var(--title-color);
    font-weight: var(--title-weight);
}
h3 {
    font-family: var(--main-font);
    font-size: var(--sub-font-size);
    line-height: 115%;
    color: var(--title-color);
    font-weight: var(--title-weight);
}
h4 {
    font-family: var(--main-font);
    font-size: var(--description-font-size);
    line-height: 100%;
    margin: 0;
    color: var(--title-color);
    font-weight: var(--title-weight);
}
table {
    padding: var(--primary-padding);
    border-spacing: 0;
    border-collapse: collapse;
}
th {
    font-weight: normal;
    padding: var(--table-padding);
    padding-right: var(--primary-padding);
    border-bottom: 1px solid var(--title-color);
    text-align: left;
    white-space: nowrap;
    font-size: var(--note-font-size);
    color: var(--title-color);

}
td {
    line-height: 250%;
    border: 0;
    padding: var(--table-padding);
    vertical-align: middle;
    white-space: nowrap;
    font-size: var(--note-font-size);
    color: var(--title-color);

}
tr {
    border-bottom: var(--table-border);
}
.details label {
    margin: 1em 0 0.5em 0;
    display: inline-block;
}
.thank-you {
    padding: var(--thank-you-padding);
    color: var(--sub-color);
    font-size: var(--note-font-size);
    width: 40%;
    min-width: 400px;
}
.error-404 {
    display: block;
    width: auto;
    min-width: 0;
    text-align: center;
}
.error-404 img {
    width: 75%;
    max-height: 90%;
    margin: 6rem auto 3rem auto;
}
.instruction .header {
    color: var(--title-color);
    font-family: var(--title-font);
    font-weight: var(--header-weight);
    font-size: var(--header-font-size);
    letter-spacing: -1.8px;
    line-height: 95%;
    margin: 0;
}
#header {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
    width: var(--page-content-width);
    margin: var(--header-margin);
    padding: 0;
}
#header .spacer {
    flex-grow: 1;
}
#logo {
    flex-grow: 0;
    padding: var(--logo-padding);
    margin: 0;
    border-right: var(--line-border);
}
#navigation {
    flex-grow: 0;
    display: table;
}
#navigation a {
    display: table-cell;
    color: var(--title-color);
    font-size: var(--label-font-size);
    font-weight: var(--header-weight);
    vertical-align: middle;
    border-left: var(--line-border);
    padding: var(--navigation-links-padding);
}
#navigationCenter {
    position: relative;
    display: grid;
    align-items: stretch;
}
#navigationTags {
    display: flex;
    gap: 1rem;
    padding-left: var(--navigation-tags-padding);
    align-items: stretch;
}
#navigationTagActive {
    display: none;
}
.navigationTag {
    display: flex;
    color: var(--title-color);
    font-size: var(--label-font-size);
    font-weight: var(--header-weight);
    align-items: center;
    padding: 0 1em;
}
.activeTag {
    border-top: 5px solid var(--accent-color);
    border-bottom: 5px solid transparent;
    color: var(--accent-color) !important;
}
#navigationTags a:visited {
    color: var(--title-color);
}
#navigation a:visited {
    color: var(--title-color);
}
#subHeader {
    background: var(--sub-header-background-color);
    font-family: var(--main-font);
    font-weight: var(--button-weight);
    font-size: var(--sub-header-font-size);
    margin: 0;
    padding: 0.1rem 0;
}
#subHeader > div {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: var(--content-margin);
    padding: 0;
    display: flex;
    flex-wrap: nowrap;
}
#siteTitle {
    display: inline-block;
    flex-grow: 1;
}
#language {
    display: inline-block;
    position: relative;
}
.languageTag {
    display: flex;
    color: var(--title-color);
    font-size: var(--language-font-size);
    font-weight: var(--button-weight);
    align-items: center;
    padding: 0 1em;
}
#languageTagActive {
    display: flex;
    margin-left: 2em;
    cursor: pointer;
    color: var(--background-color);
}
#languageTagActive span:after {
    margin-left: 0.5em;
    content: '▾';
}
#languageTags {
    z-index: 10;
    padding: 1em;
    position: absolute;
    display: none;
    grid-template-columns: auto;
    grid-template-rows: auto;
    background: black;
    border: var(--line-border);
    top: 110%;
    left: 1em;
    line-height: 250%;
}
#languageTags a {
    white-space: nowrap;
}
#languageTags .activeTag {
    border: none;
}

#banner {
    text-align: center;
    display: block;
    height: auto;
}
#content {
    margin: 0;
    padding: 0;
    border-bottom: var(--line-border);
}
#fullContent {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: var(--content-margin);
    padding: var(--content-padding);
}
#banner {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: var(--content-margin);
    padding: 0;
    cursor: pointer;
}
#banner img {
    border: 0;
    width: 100%;
}
#userContent {
    display: grid;
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: var(--content-margin);
    padding: var(--content-padding);
    grid-template-columns: 50% 50%;
}
#storeContent {
    margin: var(--content-margin);
    padding: var(--store-padding);
    border-bottom: var(--line-border);
}
#cartContent {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: var(--content-margin);
    padding: 0;
}

/* Mailchimp subscribe */

#mailchimpFooter {
    margin: 0 auto;
    padding: 0;
    border-bottom: var(--line-border);
}
form#mc-embedded-subscribe-form {
    position: relative;
    width: var(--mailchimp-content-width);
    max-width: var(--mailchimp-content-maxwidth);
    padding: 2rem 3rem;
    margin: 0 auto;
    border-left: var(--line-border);
    border-right: var(--line-border);
}
.mailchimpCornerLabel {
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--title-color);
    color: var(--background-color);
    font-size: var(--corner-label-font-size);
    font-weight: var(--button-weight);
    padding: 2px 3rem 0 3rem;
}
form#mc-embedded-subscribe-form input {
    appearance: none;
    background: none;
    border: none;
    color: var(--field-color);
}
input#mce-EMAIL {
    padding: 0;
}
input#mce-EMAIL::placeholder {
    font-size: var(--description-font-size);
    color: var(--line-color);
}
input#mc-embedded-subscribe {
    color: var(--title-color);
    padding: 0;
    margin: 0;
}
.mc-field-decoration {
    transform: translateY(-12px);
    display: grid;
    grid-template-columns: 1fr 62px;
    height: 24px;
}
.mc-field-decoration1 {
    background-image: url("/images/signup-decoration1.svg");
    background-size: contain;
    background-repeat: repeat-x;
    background-position: center;
}
.mc-field-decoration2 {
    background-image: url("/images/signup-decoration2.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.mc-field-group label {
    display: block;
    font-size: var(--store-font-size);
    color: var(--title-color);
    margin: 1em 0;
}
.mce-field-description {
    font-size: var(--description-font-size);
    color: var(--sub-color);
}
input#mc-embedded-subscribe {
    color: var(--title-color) !important;
}

/* Footer */

#footer {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: var(--content-margin);
    padding: var(--footer-padding);
}
#footer a {
    color: var(--title-color);
    font-size: var(--note-font-size);
    font-weight: var(--header-weight);
    margin-right: 2em;
}
#footer a:visited {
    color: var(--title-color);
}

/* Store */

form.filter {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 10px;
    margin: 10px 0;
}
form.filter select:first-child {
    justify-self: end;
}
form.filter select {
    justify-self: start;
    width: 180px;
}
.tagContent {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: 1rem auto 0 auto;
    padding: 1rem 0 2rem 0;
    display: grid;
    gap: var(--grid-gap-store-featured);
    grid-template-columns: var(--grid-columns-store-featured);
    color: var(--title-color);
    align-items: end;
    border-bottom: var(--line-border);
}
.tagContent .tagTitle {
    font-size: var(--tag-title-font-size);
    line-height: 110%;
}
.tagContent .tagDescription {
    font-size: var(--description-font-size);
    color: var(--sub-color);
    line-height: 120%;
}
.catalog {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: 2rem auto 0 auto;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    column-gap: var(--grid-gap-store-featured);
}
.pageContent {
    color: var(--title-color);
    display: block;
    margin-bottom: 2em;
}
.pageContent p, .pageContent ul {
    font-size: var(--description-font-size);
    color: var(--paragraph-color);
    line-height: 120%;
}
.pageContent a {
    color: var(--title-color);
}
.underlined {
    text-decoration: underline;
}
.linkedCatalog {
    border-top: var(--line-border);
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: 2rem auto 2rem auto;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    column-gap: var(--grid-gap-store-featured);
}
.cartTotal {
    color: var(--title-color);
    width: 100%;
    margin: 0;
    line-height: 200%;
    font-size: var(--store-font-size);
    font-weight: var(--title-weight);
    text-align: right;
}
.paymentInfo {
    color: var(--title-color);
    width: 100%;
    margin: 0.5em 0;
    line-height: 120%;
    font-size: var(--payment-info-font-size);
    font-weight: var(--title-weight);
    text-align: left;
}
.promoCodeTitle {
    color: var(--title-color);
    width: 100%;
    margin: 0;
    line-height: 200%;
    font-size: var(--store-font-size);
    font-weight: var(--title-weight);
    text-align: left;
}
.cartSubTotalSection {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
}
.cartContinueShopping {
    color: var(--title-color);
    font-size: var(--note-font-size);
    padding-top: 0.7em;
}
.cartContinueShopping a,
.cartContinueShopping a:visited {
    color: inherit;
}
.cartDiscounts {
    color: var(--title-color);
    width: 100%;
    margin: 0;
    line-height: 200%;
    font-size: var(--note-font-size);
    font-weight: var(--title-weight);
    text-align: right;
}
.cartRemoveDiscounts {
    color: var(--title-color);
    width: 100%;
    margin: 0;
    text-align: right;
}
.cartRemoveDiscounts a,
.cartRemoveDiscounts a:visited {
    color: inherit;
}
.cart {
    color: var(--title-color);
    width: 100%;
    margin: 5px;
    display: flex;
}
.cartProduct {
    color: var(--title-color);
    width: 100%;
    margin: 0;
    display: flex;
    vertical-align: middle;
}
.cartButton {
    width: 300px;
    margin-left: auto;
    margin-right: 5px;
    min-height: 36px;
    height: auto;
}
.storeText {
    font-size: var(--product-summary-font-size);
    color: var(--sub-color);
    text-align: left;
}
.storeAddToCart, .storeAddProductToCart, .storeAddPackToCart, .storeTrialDownload, .storeSelectMore, .linkAddToCart {
    display: flex;
    font-size: var(--catalog-font-size);
    align-items: center;
    align-content: center;
    width: var(--cart-button-width);
    min-width: var(--cart-button-width);
    min-height: 26px;
    height: auto;
    padding: 2px 0 0 10px;
    margin: 0;
    text-align: left;
    vertical-align: middle;
    border-radius: 0;
}
.storeAddProductToCart {
    justify-content: space-between;
    padding: 2px 10px 0 10px;
}
.storeAddPackToCart {
    display: flex;
    align-items: center;
    align-content: center;
    width: 180px;
    min-width: 180px;
    min-height: 26px;
    height: auto;
    padding: 2px 0 0 10px;
    margin: 0;
    text-align: left;
    vertical-align: middle;
}
.storeAddToCart:after {
    background-image: url("/images/cart.svg");
    width: 1em;
    height: 1em;
    font-size: 1em;
    content: '';
    margin: 0 5px 2px auto;
    display: inline-block;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.linkAddToCart:after {
    background-image: url("/images/cart.svg");
    width: 1em;
    height: 1em;
    font-size: 1em;
    content: '';
    margin: 0 5px 2px auto;
    display: inline-block;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.storeAddPackToCart:after {
    background-image: url("/images/follow.svg");
    width: 1em;
    height: 1em;
    font-size: 1em;
    content: '';
    margin: 0 5px 2px auto;
    display: inline-block;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.storeTrialDownload {
    background: var(--background-color);
    color: var(--accent-color);
    border: var(--button-border);
}
.storeTrialDownload:after {
    background-image: url("/images/follow_accent.svg");
    width: 1em;
    height: 1em;
    font-size: 1em;
    content: '';
    margin: 0 5px 0 auto;
    display: inline-block;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.storeSelectMore {
    background: var(--sub-color);
    pointer-events: none;
}
#selectMore {
    display: grid;
    grid-template-columns: 1fr auto;
    padding-right: 10px;
}
.productAddToCart {
    max-width: 300px;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    min-height: 36px;
    height: auto;
}
.storeLeft {
    margin: auto 0;
}
.productQuantity {
    max-width: 100%;
}
.storeRight {
    display: grid;
    margin: 0 0 0 auto;
    text-align: right;
    font-size: var(--store-description-size);
    font-weight: var(--title-weight);
    align-items: center;
}
.cartPromoCodes {
    margin-left: 0;
    margin-right: auto;
    min-width: var(--promo-code-min-width);
}
.promoCode {
    min-width: var(--promo-code-min-width);
}
.checkout {
    margin-right: 0;
    margin-left: auto;
    width: var(--checkout-buttons-width);
}
.strikePrice {
    text-decoration: line-through;
    color: var(--strike-color);
}
.catalogProduct {
    border-bottom: var(--image-border);
    text-align: left;
    color: var(--title-color);
    width: var(--catalog-standard-width);
    overflow: hidden;
    margin: var(--catalog-product-padding) 0;
    user-select: none;
}
.catalogProductSummary {
    margin: 1em 0 1em 0;
    font-size: var(--product-summary-font-size);
    color: var(--sub-color);
    text-align: left;
}
.linkedCatalog .catalogProduct {
    border: none;
}
.catalog-stylewide {
    width: var(--catalog-wide-width);
}
.catalog-stylefeatured {
    width: var(--catalog-featured-width);
    padding-bottom: var(--catalog-product-padding);
}
.catalogProduct.catalog-stylefeatured {
    display: grid;
    height: auto;
    column-gap: var(--grid-gap-store-featured);
    grid-template-columns: var(--grid-columns-store-featured);
    grid-template-rows: auto auto 1fr;
    grid-template-areas:
    "image name"
    "image summary"
    "image action";
}
.catalogProduct.catalog-stylefeatured .catalogProductSummary {
    margin: var(--catalog-featured-summary-margin);
}
.catalogProduct.catalog-stylefeatured a:first-child {
    grid-area: name;
}
.catalogProduct.catalog-stylefeatured a:nth-child(2) {
    grid-area: image;
}
.catalogProduct.catalog-stylefeatured .cartProduct {
    grid-area: action;
    align-self: start;
}
.catalogProduct.catalog-stylefeatured a:nth-child(3) {
    grid-area: summary;
    align-self: start;
}
.catalogProduct a, .catalogProduct a,
.catalogProduct a:visited, .catalogProduct a:active {
    color: inherit;
}
.catalogProductTop {
    position: relative;
    justify-content: center;
    display: flex;
    margin-bottom: 1em;
}
.catalogProductImage {
    max-width: 100%;
    opacity: 100%;
}
.catalogSecondaryImage {
    max-width: 100%;
    position: absolute;
    opacity: 0;
}
.catalogProduct:hover .catalogProductImage {
    opacity: 0;
    transition: opacity 0.6s;
}
.catalogProduct:hover .catalogSecondaryImage {
    opacity: 100%;
    transition: opacity 0.6s;
}
.bottomSeparatorHider {
    position: relative;
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    background: var(--background-color);
    margin: -1.5em auto 0 auto;
    height: 1em;
    z-index: 10;
}

/* Affiliate Performance */
td.tableHeader, p.sectionHeader {
    color: var(--title-color);
}

/* Accordion */

.tab label {
    display: block;
    font-size: var(--store-description-size);
    line-height: 120%;
    padding: 1em 0;
    border-top: var(--line-border);
    cursor: pointer;
}
.tab label span:before {
    vertical-align: top;
    font-size: var(--title-font-size);
    color: var(--accent-color);
    content: '＋ ';
}
.tab input[type=checkbox]:checked ~ label span:before {
    vertical-align: top;
    font-size: var(--title-font-size);
    color: var(--accent-color);
    content: '－ ';
}
.tab input[type=radio]:checked ~ label span:before {
    vertical-align: top;
    font-size: var(--title-font-size);
    color: var(--accent-color);
    content: '－ ';
}
.tab input[type=checkbox] {
    display: none;
}
.tab input[type=radio] {
    display: none;
}
.tab .tabContent {
    display: none;
    padding-bottom: 1em;
    color: var(--sub-color);
}
.accordion .tab:last-child .tabContent {
    padding-bottom: 0;
}
.tab input[type=checkbox]:checked ~ .tabContent {
    display: block;
}
.tab input[type=radio]:checked ~ .tabContent {
    display: block;
}
.tab .tabContent ul {
    margin: 0;
    padding: 0 0 0 1.5em;
}

/* Store product page */

.storeProduct {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: 2em auto 0 auto;
    display: grid;
    height: auto;
    position: relative;
    gap: var(--grid-gap-store-featured);
    grid-template-columns: var(--grid-columns-store-featured);
}
.storeProductLeft {
}
.storeProductRight {
    text-align: left;
    color: var(--title-color);
}
.storeProductImage {
    max-width: 100%;
}
.storeProductPreviewImage {
    max-width: 100%;
    cursor: pointer;
}
.storeProductPreviewImage:hover {
    opacity: 0.7;
    transition: opacity 0.6s;
}
.storeProductPreviews {
    max-width: 100%;
    display: grid;
    margin: 0.5em auto 0 auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: var(--catalog-product-padding);
}
.storeProductPriceSection {
    margin: 1em 0 2em 0;
    display: grid;
    grid-template-columns: auto 1fr;
    justify-items: end;
    align-items: start;
}
.storeProductActionButtons {
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    row-gap: var(--catalog-product-padding);
}
.storeProductList {
    font-size: var(--label-font-size);
    font-weight: var(--title-weight);
    line-height: 125%;
    margin: 0 0 1em 0;
}
.storePackName {
    font-size: var(--label-font-size);
    font-weight: var(--title-weight);
}
.storeProductContent {
    width: var(--page-content-width);
    max-width: var(--page-content-maxwidth);
    margin: 0 auto;
    color: var(--sub-color);
}
.storeProductContent h2, .storeProductContent h3 {
    font-size: var(--store-font-size) !important;
    line-height: 115%;
    color: var(--title-color);
}
.storeProductContent .productContent a {
    color: var(--title-color);
}
.storeProductContent .productContent a:visited {
    color: var(--title-color);
}
.storeProductContent .productContent a:visited {
    color: var(--title-color);
}
.storeProductContent .productContent .contentTwoColumns {
    display: flex;
    flex-direction: row;
    column-gap: var(--grid-gap-store-featured);
}
.storeProductContent .productContent .contentTwoColumns h2 {
    margin-block-start: 0;
}
.storeProductContent .productContent .contentTwoColumns h3 {
    margin-block-start: 0;
}

/* Store catalog pages */

.catalog-stylewide .storeProductList {
    font-size: var(--store-font-size);
}
.catalog-stylefeatured .storeProductList {
    font-size: var(--featured-font-size);
    margin: var(--catalog-featured-productlist-margin);
}
.storeProductTitle {
    margin: 0;
    color: var(--title-color);
    font-size: var(--store-title-font-size);
    font-weight: var(--title-weight);
    text-align: left;
    line-height: 125%;
}
.store {
    font-size: var(--store-font-size);
    font-weight: var(--title-weight);
}
.storeSelect {
    color: var(--title-color);
    background: var(--panel-color);
    border: 0;
    padding: 5px;
}
strike {
    font-size: var(--button-font-size);
    font-weight: var(--title-weight);
}
.storeProductPrice {
    font-size: var(--store-description-size);
    font-weight: var(--title-weight);
}

.cartHeader {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    font-size: var(--sub-font-size);
}
.cartRow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.verticalSeparator {
    border-top: var(--line-border);
    margin-bottom: 2em;
}
#storeContent .verticalSeparator {
    margin-top: 2em;
    margin-bottom: 2em;
}
.cartNoProducts {
    text-align: left;
    color: var(--title-color);
    width: 100%;
    padding: 5px;
    margin-top: auto;
    margin-bottom: auto;
}
.cartProductInfo {
    text-align: left;
    color: var(--title-color);
    width: 10%;
    padding: 5px;
    margin-top: auto;
    margin-bottom: auto;
}
.cartProductLink {
    cursor: pointer;
}
.cartProductName {
    text-align: left;
    color: var(--title-color);
    width: 30%;
    padding: 5px;
    margin-top: auto;
    margin-bottom: auto;
}
.cartProductImage {
    max-height: 120px;
    max-width: 100%;
}

/* Cart popup */

.cartPopupImage {
    max-height: 50px;
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
}
.cartRow .cartProductInfo:last-child {
     width: 28px;
}
.cartProductRemove {
    width: 28px;
    height: 28px;
    border-radius: 14px;
    background-image: url("/images/remove.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.cartProductClose {
    position: fixed !important;
    top: 15px;
    right: 15px;
    width: 28px;
    height: 28px;
    border-radius: 14px;
    background-image: url("/images/remove.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.cartPopupInfo {
    text-align: center;
    color: var(--title-color);
    width: 25%;
    padding: 0;
    margin-top: auto;
    margin-bottom: auto;
}
.cartPopupName {
    text-align: left;
    color: var(--title-color);
    width: 60%;
    padding: 5px;
    margin-top: auto;
    margin-bottom: auto;
}
.cartPopupText {
    text-align: left;
    color: var(--title-color);
    margin: 5px;
}
.cartPopupButton {
    min-width: 280px;
    width: 280px;
    margin-left: auto;
    margin-right: auto;
    min-height: 36px;
    height: auto;
}
.cartApplyPromo {
    min-height: 36px;
    height: auto;
    min-width: 50px;
    width: 120px;
}
.cartProductInfo {
    text-align: center;
    color: var(--title-color);
    width: 10%;
    margin-top: auto;
    margin-bottom: auto;
}
.cartPopupPanel {
    position: fixed !important;
    width: 282px;
    top: 5px;
    right: 5px;
    z-index: 5000;
    color: var(--title-color);
    padding: 5px;
    background: var(--background-color);
    border: var(--image-border);
    text-align: center;
    float: right;
    display: none;
}
.cartPopupPanel:hover {
    background-color: var(--hover-color);
    cursor: pointer;
}
.details .header {
    color: var(--title-color);
    font-size: var(--title-font-size);
    margin: 0 0 0.5em 0;
    line-height: 125%;
}
.details .sub-header {
    color: var(--title-color);
    font-size: var(--sub-font-size);
    white-space: var(--title-whitespace);
}
.details .product .price {
    color: var(--accent-color);
    font-family: var(--title-font);
    font-weight: var(--title-weight);
    font-style: normal;
    font-size: var(--price-font-size);
    line-height: 125%;
    margin: 0 0 0.5em 0;
}
.loginFixedUsername {
    font-size: var(--label-font-size);
    color: var(--title-color);
}
.loginNote {
    font-size: var(--login-note-font-size);
    font-style: italic;
    color: var(--title-color);
    margin-bottom: 1em;
}
.login-options {
    text-align: right;
}
.login-options a {
    color: var(--sub-color);
}
.discount {
    text-decoration: line-through;
}
.details .product .discount {
    color: var(--sub-color);
    font-size: var(--discount-font-size);
}
.system-requirements, .informational {
    text-align: left;
    color: var(--sub-color);
    font-size: var(--note-font-size);
    line-height: 119%;
}
.header + .informational {
    margin-top: 1em;
}
.informational + label {
    margin-top: 2em;
}
.details .summary {
    max-width: 60%;
}
.details .total {
    font-family: var(--title-font);
    font-size: var(--total-font-size);
    color: var(--accent-color);
    text-align: right;
    margin-bottom: 1.5em;
}
.details form {
    width: 100%;
}
.details .your-purchase {
    margin-top: 1em;
}
#buttons {
    width: var(--buttons-width);
    margin: var(--buttons-margin);
}
#paymentOptions {
    font-size: var(--title-font-size);
    color: var(--title-color);
}
input[type=text], input[type=email], input[type=password] {
    width: 100%;
    font-size: var(--label-font-size);
    line-height: 150%;
    background-color: var(--field-color);
    border-radius: var(--border-radius);
    box-sizing: border-box;
    padding: 0 6px;
}
input[type=checkbox] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    position: relative;
    top: 4px;
    height: 20px;
    width: 20px;
    border: var(--field-border);
    border-radius: var(--border-radius);
    background-color: black;
    margin-right: 4px;
}
input[type=checkbox]:checked {
    background-size: contain;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAABYlAAAWJQFJUiTwAAABVUlEQVRYhe3Yyw2DMAwGYOgEjNARGKEjdARGYgRG6CiM0BEywe8emgMKJH5KcMBSbpXzKYkT056IuivH42wAFzfQGzfQHUS0G2UAmAFMUXPmfCPnICIeCGABQHm4kZt8aYs0AQucG9nKpwZWkpmRXD4VEMCrkUyNZHAE4GtZwUmAnBnYAODD5FgBDNYzKEEuDdwqwXWdr4rVSC3OBdwgkwRpwbmBeeJRghTglhIXAlQg1ec1DOhEVnGhQCOyiQsHZqSkGES4FtDTbj3z4GI8KgpxGLf4pdziFUV7JXFYi0RycR+N1EJGXTNWHIuMuKg5XMq/4TqXQ2TEUyee1II0A/H/flCviABJ2PSUJqB1uyxINdCL0yJVQPAtvwinOSaWFawVBnvpVpDNfNYzWCbdNZpOZFjLn7y4A2Roy+978Pf53mW+GrDn3t6z4/L/bt1Ab9xAb/wAAgDeBHgQG/IAAAAASUVORK5CYII=);
}
p.checkbox-label {
    margin-top: 2em;
    text-align: left;
    font-size: var(--label-font-size);
    color: var(--title-color);
    display: grid;
    grid-template-columns: min-content auto;
    white-space: normal;
}
p.checkbox-label label {
    margin-top: 0.4em;
    margin-left: 0.4em;
}
#paypalContainer {
    margin: 1em 0 0 0;
}
#paypalButtonContainer {
    width: var(--checkout-buttons-width);
}
.sale-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 1em;
    white-space: nowrap;
    margin-bottom: 1em;
}
.sale-summary .price {
    text-align: right;
}
.subtotals {
    display: block;
    white-space: nowrap;
    text-align: right;
}

.thank-you .header,
.error-404 .header {
    color: var(--title-color);
    font-family: var(--title-font);
    font-weight: var(--header-weight);
    font-size: var(--header-font-size);
    letter-spacing: -1.8px;
    line-height: 95%;
    margin: 0;
}
.thank-you .instructions,
.error-404 .instructions {
    font-size: var(--title-font-size);
    line-height: 120%;
    color: var(--title-color);
    margin-top: 1.0em;
}
.thank-you a,
.error-404 a,
.details a {
    color: var(--title-color);
}
.thank-you a:visited,
.error-404 a:visited {
    color: var(--title-color);
}
button#checkout-button {
}
button#cancel-button {
    margin: 1em 0 0 0;
    background-color: var(--panel-color);
    color: var(--title-color);
}
button#explore-button {
    width: 80%;
    margin: 8em 0 0 0;
    background-color: var(--panel-color);
    color: var(--title-color);
}
input#registrationCode {
    text-transform: uppercase;
}
button#registration-button {
    margin: 0 0 0 0;
}

.userProfile button {
    margin-top: 20px;
    margin-bottom: 20px;
}
.translateButton {
    margin: 0 5px;
    padding: 5px;
    font-size: 11px;
    vertical-align: bottom;
}

.validationErrors {
    color: var(--error-color);
}
input:invalid {
    border-left: 5px solid var(--error-color);
}
input:invalid:required {
}

.updateSuccess {
    color: var(--accent-color);
}

input[type=text]:valid, input[type=email]:valid {
    border: 0;
}

form .half-row {
    width: 50%;
}

form#userLinks-input {
    text-align: left;
    width: var(--user-links-width);
    margin: var(--user-links-margin);
}

form#userLinks-input #sub-header {
    color: var(--title-color);
    font-family: var(--title-font);
    font-weight: var(--header-weight);
    font-size: 50px;
    letter-spacing: -1.8px;
    line-height: 95%;
    margin-top: 15px;
    margin-bottom: 15px;
    text-align: right;
}

form#userLinks-input .header {
    text-align: right;
}

form#userLinks-input button,
form#productRegistration button {
    width: 100%;
    margin-top: 25px;
    margin-bottom: 25px;
}

form#productRegistration .packProductLine {
    white-space: nowrap;
    font-size: var(--store-description-size);
    color: var(--title-color);
}

.packProductLine label {
    margin: 0;
}

form#userLinks-input #userLogoutLink {
    text-align: right;
}
form#userLinks-input #userLogoutLink a {
    color: var(--sub-color);
    font-family: var(--main-font);
    font-weight: 500;
    font-size: var(--label-font-size);
}

form#auth2FA-input {
    text-align: center;
}

form#auth2FA-input button {
    width: 150px;
}

form#auth2FA-input label {
    display: block;
}

form#auth2FA-input input {
    height: 50px;
    font-size: var(--label-font-size);
    line-height: 150%;
    background-color: var(--field-color);
    border-radius: var(--border-radius);
    box-sizing: border-box;
    padding: 0 6px;
}

form#auth2FA-input input {
    width: 50px;
}

form#auth2FA-input #submit-container {
    margin: 15px;
    text-align: center;
}

.qr-code {
    text-align: center;
    margin: 50px;
}

.download a {
    text-decoration: underline;
}
.download li {
    line-height: 2em;
}

select#country {
    border: var(--field-border);
    border-radius: var(--border-radius);
    width: 100%;
}
.title {
    color: var(--title-color);
    font-weight: var(--title-weight);
    font-size: var(--store-title-font-size);
    text-align: center;
    line-height: 200%;
    margin: 1.5em 0;
}
.subtitle {
    color: var(--title-color);
    font-weight: var(--title-weight);
    font-size: var(--store-font-size);
    text-align: center;
    line-height: 150%;
    margin: 0;
}

.subtitleParagraph {
    color: var(--title-color);
    font-weight: var(--title-weight);
    font-size: var(--store-font-size);
    text-align: left;
    line-height: 150%;
    margin: 0;
}

#registeredProductTable {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.userProductRow {
    border-top: var(--line-border);
    padding-top: 1rem;
    margin-top: 1rem;
}
.userProduct {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: var(--catalog-product-padding);
}
.userProductImage {
    width: 100px;
    opacity: 100%;
}
.userProductInfo {
}

.userProductTitle {
    color: var(--title-color);
    font-size: var(--button-font-size);
    white-space: var(--title-whitespace);
}
.userProductSummary {
    color: var(--sub-color);
    font-size: var(--description-font-size);
    line-height: 120%;
}
.userProductRow .tab label {
    color: var(--title-color);
    font-size: var(--button-font-size);
    border-top: none;
    margin: 0;
}
.userProductRow .tabContent {
    font-size: var(--button-font-size);
    white-space: var(--title-whitespace);
    padding: 0;
}
.userProductLicense {
    font-family: monospace;
}

#productPagination {
    width: 100%;
    font-size: var(--button-font-size);
    white-space: var(--title-whitespace);
    text-align: right;
}

@media screen and (max-width: 1024px) {
    :root {
        /* font sizes */
        --header-font-size: 50px;
        --tag-title-font-size: 44px;
        --total-font-size: 28px;
        --price-font-size: 26px;
        --store-title-font-size: 24px;
        --title-font-size: 24px;
        --featured-font-size: 24px;
        --store-font-size: 18px;
        --discount-font-size: 18px;
        --sub-font-size: 18px;
        --label-font-size: 16px;
        --store-description-size: 16px;
        --payment-info-font-size: 15px;
        --button-font-size: 14px;
        --note-font-size: 14px;
        --product-summary-font-size: 16px;
        --description-font-size: 16px;
        --sub-header-font-size: 10px;
        --language-font-size: 11px;
        --catalog-font-size: 10px;

        /* dimensions */
        --moog-logo-width: 86px;
        --moog-logo-height: 26px;
        --cart-icon-width: 14px;
        --cart-icon-height: 14px;
        --cart-button-width: 125px;
        --page-content-width: 606px;
        --mailchimp-content-width: 510px;
        --catalog-featured-width: 606px;
        --catalog-wide-width: 293px;
        --catalog-standard-width: 293px;
        --grid-columns-store-featured: 318px 269px;
        --buttons-width: 310px;
        --checkout-buttons-width: 284px;
        --promo-code-min-width: 210px;
        --user-links-width: auto;

        /* padding & margins */
        --logo-padding: 1rem 1.8rem 0.8rem 0;
        --navigation-links-padding: 0 1rem;
        --navigation-tags-padding: 1.5rem;
        --grid-gap-store-featured: 20px;
        --catalog-product-padding: 10px;
        --catalog-featured-productlist-margin: 0 0 0.5em 0;
        --catalog-featured-summary-margin: 0 0 1em 0;
        --buttons-margin: 2em 0 0 auto;
        --instruction-padding: 3rem 2rem 2rem 0;
        --details-padding: 4rem 0 2rem 2rem;
        --thank-you-padding: 3rem 2rem 2rem 0;

        /* miscellaneous */
        --title-whitespace: normal;
    }

    .storeProductContent .productContent .contentTwoColumns {
        display: flex;
        flex-direction: column;
        row-gap: var(--catalog-product-padding);
    }

    .contentTwoColumns iframe {
        aspect-ratio: 16 / 9;
        height: 100%;
        width: 100%;
    }

    .contentTwoColumns img {
        aspect-ratio: 3 / 2;
        height: 100%;
        width: 100%;
    }
}
@media screen and (max-width: 846px) {
    :root {
        /* font sizes */
        --header-font-size: 44px;
        --tag-title-font-size: 38px;

        /* dimensions */
        --moog-logo-width: 86px;
        --moog-logo-height: 26px;
        --cart-icon-width: 14px;
        --cart-icon-height: 14px;
        --cart-button-width: 180px;
        --page-content-width: auto;
        --page-content-maxwidth: 420px;
        --mailchimp-content-width: auto;
        --mailchimp-content-maxwidth: 420px;
        --catalog-featured-width: auto;
        --catalog-featured-maxwidth: 420px;
        --catalog-wide-width: auto;
        --catalog-standard-width: auto;

        /* padding & margins */
        --content-padding: 0 2em;
        --store-padding: 1rem 2em;
        --footer-padding: 1.3rem 2em;
        --header-margin: 0 1em;
        --logo-padding: 1rem 1rem 0.5rem 0;
        --user-links-margin: 0 2em;
    }
    #header {
        position: sticky;
        top: 0;
        z-index: 10;
        background: var(--background-color);
        margin: 0;
        padding: var(--header-margin);
        border-bottom: var(--line-border);
    }
    #header a:last-child {
        padding-right: 0;
    }
    #navigation a.navUser span {
        display: none;
    }
    #navigation a.navUser:after {
        background-image: url("/images/account.svg");
        width: 16px;
        height: 16px;
        font-size: 1em;
        content: '';
        margin: 0 0 0 0;
        display: inline-block;
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }
    #navigationTagActive {
        display: flex;
        margin-left: 2em;
        cursor: pointer;
    }
    #navigationTagActive span:after {
        margin-left: 0.5em;
        content: '▾';
    }
    #navigationTags {
        padding: 1em;
        position: absolute;
        display: none;
        grid-template-columns: auto;
        grid-template-rows: auto;
        background: black;
        border: var(--line-border);
        top: 100%;
        left: 1em;
    }
    #navigationTags a {
        white-space: nowrap;
    }
    #navigationTags .activeTag {
        border: none;
    }

    .tagContent {
        padding-top: 0;
        grid-template-rows: auto auto;
        grid-template-columns: none;
    }
    .catalogProduct.catalog-stylefeatured {
        display: block;
    }
    .catalogProduct.catalog-stylefeatured .catalogProductSummary {
        margin: 1em 0 1em 0;
    }
    .storeProduct {
        grid-template-rows: auto auto;
        grid-template-columns: none;
    }
    #storeContent .verticalSeparator {
        margin-top: 1em;
        margin-bottom: 1em;
    }
    #cartContent .title {
        padding: 0;
        margin: 0.5em;
    }
    #cartContent .cartRow {
        display: grid;
        justify-items: start;
        align-items: start;
        column-gap: 10px;
        row-gap: 10px;
        padding-bottom: 1em;
        grid-template-rows: auto 1fr;
        grid-template-columns: 40px 3fr auto 1fr 20px;
        grid-template-areas:
            "image name price total remove"
            "image name price quantity remove";
    }
    #cartContent hr + .cartRow {
        padding-top: 1em;
    }
    #cartContent .cartRow p {
        margin: 0;
        padding: 0;
    }
    #cartContent .cartRow .cartProductInfo {
        width: auto;
        margin: 0;
        padding: 0;
    }
    #cartContent .cartRow .cartProductName {
        width: auto;
        margin: 0;
        padding: 0;
        font-size: var(--note-font-size);
    }
    #cartContent .cartRow .cartImage {
        grid-area: image;
    }
    #cartContent .cartRow .cartName {
        grid-area: name;
    }
    #cartContent .cartRow .cartPrice {
        grid-area: price;
        justify-self: end;
        font-size: var(--note-font-size);
    }
    #cartContent .cartRow .cartQuantity {
        grid-area: quantity;
        justify-self: end;
        align-self: stretch;
    }
    #cartContent .cartRow .cartTotal {
        grid-area: total;
        justify-self: end;
        line-height: 100%;
    }
    #cartContent .cartRow .cartRemove {
        grid-area: remove;
        justify-self: end;
    }
    .cartProductRemove {
        width: 20px;
        height: 20px;
        border-radius: 10px;
    }
    .cartSubTotalSection {
        grid-template-columns: none;
        grid-template-rows: auto auto;
    }
    .cartContinueShopping {
        display: none;
    }
    #cartContent .catalog {
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: auto auto;
        grid-template-areas:
            "checkout"
            "discount";
        justify-items: stretch;
    }
    #cartContent .catalog .cartPromoCodes {
        border-top: var(--line-border);
        grid-area: discount;
        padding-top: 1em;
        margin-top: 1em;
        margin-right: 0;
    }
    #cartContent .catalog .checkout {
        grid-area: checkout;
        margin-left: 0;
        justify-self: center;
    }
    #userContent {
        border-bottom: none;
        padding: 0;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr max-content;
    }
    #fullContent {
        padding: 0;
    }
    .instruction,
    .thank-you,
    .error-404 {
        border-right: none;
        display: block;
        width: auto;
        min-width: 0;
    }
    .instruction {
        border-bottom: var(--line-border);
        padding: 1rem 0;
    }
    .thank-you,
    .error-404 {
        padding: 2rem 2rem;
    }
    .details {
        border-right: none;
        display: block;
        padding: 1rem 2rem;
    }
    .instruction .header,
    .thank-you .header,
    .error-404 .header {
        border-right: 0;
        padding: 1rem 2rem;
        line-height: 125%;
    }
    .thank-you .header,
    .error-404 .header {
        padding: 0;
    }
    #buttons {
        width: 100%;
        margin-top: 0;
    }
    .details .header,
    .thank-you .instructions,
    .error-404 .instructions {
        line-height: 120%;
    }
    .details .header {
        margin-top: 1rem;
    }
    .header + .informational {
        margin-top: 2em;
    }
    .thank-you .instructions,
    .error-404 .instructions {
        margin-top: 1rem;
    }
    .details .summary {
        max-width: 100%;
    }
    button {
        min-width: 0;
    }
    p.checkbox-label label {
        margin-top: 0.2em;
    }
    input[type=checkbox] {
        margin-top: 0;
    }
    button#explore-button {
        width: 100%;
        margin: 2em 0 0 0;
    }
}

@media screen and (max-width: 520px) {
    form#mc-embedded-subscribe-form {
        border: none;
    }
}
