/* Structure */
    html { padding: 0px; margin: 0px; scroll-behavior: smooth; }
    body { padding: 0px; margin: 0px; scroll-behavior: smooth; }
    main { /*overflow: hidden;*/ }
    img, iframe, svg { user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; }

    input:focus { border: none; outline: none; }
    a { color: unset; }
    
    *::selection { background: #F11500; }
    
    .hidden { display: none !important; }
    .dsk { display: flex !important; }
    .mob { display: none !important; }

    .round  { border-radius: 8px; }
    .circle { border-radius: 100%; }
    .border   { border: 1.5px solid; }
    .noborder { border: none; }

    .material-symbols-outlined { display: flex; justify-content: center; align-items: center; user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none }
    .grecaptcha-badge          { display: none !important; }

    .fullw { width:  100%;  }
    .fullh { height: 100%;  }
    .scrnw { width:  100vw; }
    .scrnh { height: 100vh; }

    .fitcont { width: fit-content; }
    .grow  { flex: 1; }
    .halfw { width: 50%;  }
    .samew > * { flex: 1; }

    .cont  { display: flex; box-sizing: border-box; flex-wrap: wrap; }
    .row   { flex-direction: row; }
    .col   { flex-direction: column; flex-wrap: nowrap !important; }
    .nwrap { flex-wrap: nowrap !important; }

    .col.apart { justify-content: space-between; }
    .col.start { justify-content: flex-start; }
    .col.end   { justify-content: flex-end; }
    .row.apart { justify-content: space-between; }
    .row.start { justify-content: flex-start; }
    .row.end   { justify-content: flex-end; }

    .col.vcent { justify-content: center; }
    .col.hcent { align-items: center; }
    .row.hcent { justify-content: center; }
    .row.vcent { align-items: center; }
    .fcent     { text-align: center; }
    .fleft     { text-align: left; }
    .fright    { text-align: right; }
    .fjustify  { text-align: justify; }
    
    .bgcover   { background-size: cover !important;   background-repeat: no-repeat !important; background-position: center !important; }
    .bgcontain { background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; }
    .bgtrans   { background: transparent; }

    .admOnly { display: none !important; }
/**/

/* Variables */
    :root {
        --red-1: #F18B8D; --red-2: #F37178; --red-3: #F45662; --red-4: #F63B4C; --red-5: #F72036; --red-6: #E22136; --red-7: #CC2136; --red-8: #9C1A30; --red-9: #6C1229;
        --drk-1: #FBFAF8; --drk-2: #B7B6B5; --drk-3: #8A8989; --drk-4: #5B5A5B; --drk-5: #2C2B2D; --drk-6: #262527; --drk-7: #202021; --drk-8: #1A1A1B; --drk-9: #141414;
        --ylw-3: #FFDB76; --ylw-5: #FFC257; --ylw-7: #FEAE22; --ppl-3: #873BEA; --ppl-5: #4C006C; --ppl-7: #361046; --inf-3: #45D6F4; --inf-5: #0AAACC; --inf-7: #208398;
        --scs-3: #62DB98; --scs-5: #1FCC6C; --scs-7: #168F4C; --wrn-3: #FFF4AD; --wrn-5: #FFE64D; --wrn-7: #F5D400; --err-3: #E25B4F; --err-5: #B3271B; --err-7: #8D2219;

        --spc-0: 0.250rem; --spc-1: 0.375rem; --spc-2: 0.500rem; --spc-3: 0.750rem; --spc-4: 1.000rem; --spc-5: 1.500rem; --spc-6: 2.000rem; --spc-7: 3.000rem; --spc-8: 4.000rem; --spc-9: 5.000rem; 

        --acdm-pry-3: #1E2C4C; --acdm-pry-5: #17203D; --acdm-pry-7: #11172C;
        --acdm-sec-3: #FAF7F2; --acdm-sec-5: #F4EEE4; --acdm-sec-7: #EDE3D4;
        --acdm-neu-3: #FBF8F2; --acdm-neu-5: #DBD8D2; --acdm-neu-7: #BBB8B2;
        --acdm-acc-3: #91F2E7; --acdm-acc-5: #64EDDC; --acdm-acc-7: #36E7D3;
    }
/**/

/* Typography */
    html { font-size: 16px; }
    a    { text-decoration: none;}
    
    h1, h2, h3, p { margin: 0px; padding: 0px; display: block; }

    .strike { text-decoration: line-through; }

    .rbt { font-family: 'Roboto', sans-serif; }
    .jst { font-family: 'Jost', sans-serif; }
    
    /* Deprecated */
        .tx1.rbt { font-size: 3.0rem; line-height: 090%; font-weight: 700; }
        .tx2.rbt { font-size: 2.0rem; line-height: normal; font-weight: 700; }
        .tx3.rbt { font-size: 1.5rem; line-height: 090%; font-weight: 700; }
        .tx4.rbt { font-size: 1.0rem; line-height: 090%; font-weight: 700; }
        .tx5.rbt { font-size: 0.7rem; line-height: 090%; font-weight: 700; }
    /**/

    .hero    { font-size: 4.50rem; line-height: 110%; font-weight: 700; }

    .tx1.jst { font-size: 3.25rem; line-height: 110%; font-weight: 700; }
    .tx2.jst { font-size: 2.88rem; line-height: 110%; font-weight: 700; }
    .tx3.jst { font-size: 2.00rem; line-height: 110%; font-weight: 700; }
    .tx4.jst { font-size: 1.50rem; line-height: 110%; font-weight: 700; }
    .tx5.jst { font-size: 1.13rem; line-height: 110%; font-weight: 700; }

    .txbtn { font-family: Roboto; font-size: 0.875rem; line-height: 24px; font-weight: 400; }
    .txnav { font-family: Jost;   font-size: 0.875rem; line-height: 150%; font-weight: 700; }
    
    .tx-lrg { font-family: Roboto; font-size: 1.130rem; line-height: 150%; font-weight: 400; }
    .tx-reg { font-family: Roboto; font-size: 1.000rem; line-height: 150%; font-weight: 400; }
    .tx-sml { font-family: Roboto; font-size: 0.875rem; line-height: 175%; font-weight: 400; }
    .tx-tny { font-family: Roboto; font-size: 0.750rem; line-height: 200%; font-weight: 400; }

    /* Academy */
        @font-face { font-family: "Anton";   font-weight: 700; src: url(academy/Anton-Regular.ttf); }
        @font-face { font-family: "Sweet Sans"; font-weight: 400; src: url(academy/Sweet-Sans.otf); }

        .ds1_3dph { font-family: Anton; font-size: 4.50rem; line-height: 110%; font-weight: 700; }

        .tx1_3dph { font-family: Anton; font-size: 3.25rem; line-height: 110%; font-weight: 700; }
        .tx2_3dph { font-family: Anton; font-size: 2.88rem; line-height: 110%; font-weight: 700; }
        .tx3_3dph { font-family: Anton; font-size: 2.00rem; line-height: 110%; font-weight: 700; }
        .tx4_3dph { font-family: Anton; font-size: 1.50rem; line-height: 110%; font-weight: 700; }
        .tx5_3dph { font-family: Anton; font-size: 1.13rem; line-height: 110%; font-weight: 700; }

        .txbtn_3dph { font-family: Roboto; font-size: 0.875rem; line-height: 24px; font-weight: 400; }
        .txnav_3dph { font-family: Anton;  font-size: 0.875rem; line-height: 150%; font-weight: 700; }
        
        .lrg_3dph { font-family: Sweet Sans; font-size: 1.130rem; line-height: 150%; font-weight: 400; }
        .reg_3dph { font-family: Sweet Sans; font-size: 1.000rem; line-height: 150%; font-weight: 400; }
        .sml_3dph { font-family: Sweet Sans; font-size: 0.875rem; line-height: 175%; font-weight: 400; }
        .tny_3dph { font-family: Sweet Sans; font-size: 0.750rem; line-height: 200%; font-weight: 400; }
    /**/

    @font-face { font-family: "Teutonic"; font-weight: 700; src: url(../fonts/Teutonic.ttf); }
/**/

/* Effects */
    .hover:hover { cursor: pointer; }
    .und:hover   { text-decoration: underline; } /* change to "an-und" and update references */
    .undl { text-decoration: underline; } /* change to "und" and update references */

    /**/

    .anbg-round { position: relative; }
    .anbg-round::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    .anbg-round::before { background: white; opacity: 0; width: 0px; height: 0px; transition: all 0.3s; border-radius: 100%; }
    .anbg-round:hover          { cursor: pointer; }
    .anbg-round:hover::before  { width: 40px; height: 40px; opacity: 0.2; transition: all 0.3s; }
    .anbg-round:active::before { width: 60px; height: 60px; opacity: 0.2; transition: all 0.3s; }

    .anbg-fill { transition: background-color 0.3s; }
    .anbg-fill:hover { background-color: rgba(255, 255, 255, 0.10); transition: background-color 0.3s; }

    :hover  > .anbg-round-parent         { cursor: pointer; }
    :hover  > .anbg-round-parent::before { width: 40px; height: 40px; opacity: 0.2; transition: all 0.3s; }
    :active > .anbg-round-parent::before { width: 60px; height: 60px; opacity: 0.2; transition: all 0.3s; }

    /**/

    .elev-1 { box-shadow: 0px 4px 4px 2px rgba(0, 0, 0, 0.25);   }
    .elev-2 { box-shadow: 0px 8px 8px 4px rgba(0, 0, 0, 0.25);   }
    .elev-3 { box-shadow: 0px 12px 12px 6px rgba(0, 0, 0, 0.25); }

    .at-elev-1:hover { box-shadow: 0px 4px 4px 2px rgba(0, 0, 0, 0.25);   }
    .at-elev-2:hover { box-shadow: 0px 8px 8px 4px rgba(0, 0, 0, 0.25);   }
    .at-elev-3:hover { box-shadow: 0px 12px 12px 6px rgba(0, 0, 0, 0.25); }
/**/

/* Color Palette */
    .red-1-cl { color: var(--red-1); } .red-1-bg { background-color: var(--red-1); } .red-1-bc { border-color: var(--red-1); }
    .red-2-cl { color: var(--red-2); } .red-2-bg { background-color: var(--red-2); } .red-2-bc { border-color: var(--red-2); }
    .red-3-cl { color: var(--red-3); } .red-3-bg { background-color: var(--red-3); } .red-3-bc { border-color: var(--red-3); }
    .red-4-cl { color: var(--red-3); } .red-4-bg { background-color: var(--red-3); } .red-4-bc { border-color: var(--red-3); }
    .red-5-cl { color: var(--red-5); } .red-5-bg { background-color: var(--red-5); } .red-5-bc { border-color: var(--red-5); }
    .red-6-cl { color: var(--red-6); } .red-6-bg { background-color: var(--red-6); } .red-6-bc { border-color: var(--red-6); }
    .red-7-cl { color: var(--red-7); } .red-7-bg { background-color: var(--red-7); } .red-7-bc { border-color: var(--red-7); }
    .red-8-cl { color: var(--red-8); } .red-8-bg { background-color: var(--red-8); } .red-8-bc { border-color: var(--red-8); }
    .red-9-cl { color: var(--red-9); } .red-9-bg { background-color: var(--red-9); } .red-9-bc { border-color: var(--red-9); }

    .drk-1-cl { color: var(--drk-1); } .drk-1-bg { background-color: var(--drk-1); } .drk-1-bc { border-color: var(--drk-1); }
    .drk-2-cl { color: var(--drk-2); } .drk-2-bg { background-color: var(--drk-2); } .drk-2-bc { border-color: var(--drk-2); }
    .drk-3-cl { color: var(--drk-3); } .drk-3-bg { background-color: var(--drk-3); } .drk-3-bc { border-color: var(--drk-3); }
    .drk-4-cl { color: var(--drk-4); } .drk-4-bg { background-color: var(--drk-4); } .drk-4-bc { border-color: var(--drk-4); }
    .drk-5-cl { color: var(--drk-5); } .drk-5-bg { background-color: var(--drk-5); } .drk-5-bc { border-color: var(--drk-5); }
    .drk-6-cl { color: var(--drk-6); } .drk-6-bg { background-color: var(--drk-6); } .drk-6-bc { border-color: var(--drk-6); }
    .drk-7-cl { color: var(--drk-7); } .drk-7-bg { background-color: var(--drk-7); } .drk-7-bc { border-color: var(--drk-7); }
    .drk-8-cl { color: var(--drk-8); } .drk-8-bg { background-color: var(--drk-8); } .drk-8-bc { border-color: var(--drk-8); }
    .drk-9-cl { color: var(--drk-9); } .drk-9-bg { background-color: var(--drk-9); } .drk-9-bc { border-color: var(--drk-9); }

    .ylw-3-cl { color: var(--ylw-3); } .ylw-3-bg { background-color: var(--ylw-3); } .ylw-3-bc { border-color: var(--ylw-3); }
    .ylw-5-cl { color: var(--ylw-5); } .ylw-5-bg { background-color: var(--ylw-5); } .ylw-5-bc { border-color: var(--ylw-5); }
    .ylw-7-cl { color: var(--ylw-7); } .ylw-7-bg { background-color: var(--ylw-7); } .ylw-7-bc { border-color: var(--ylw-7); }

    .ppl-3-cl { color: var(--ppl-3); } .ppl-3-bg { background-color: var(--ppl-3); } .ppl-3-bc { border-color: var(--ppl-3); }
    .ppl-5-cl { color: var(--ppl-5); } .ppl-5-bg { background-color: var(--ppl-5); } .ppl-5-bc { border-color: var(--ppl-5); }
    .ppl-7-cl { color: var(--ppl-7); } .ppl-7-bg { background-color: var(--ppl-7); } .ppl-7-bc { border-color: var(--ppl-7); }

    .inf-3-cl { color: var(--inf-3); } .inf-3-bg { background-color: var(--inf-3); } .inf-3-bc { border-color: var(--inf-3); }
    .inf-5-cl { color: var(--inf-5); } .inf-5-bg { background-color: var(--inf-5); } .inf-5-bc { border-color: var(--inf-5); }
    .inf-7-cl { color: var(--inf-7); } .inf-7-bg { background-color: var(--inf-7); } .inf-7-bc { border-color: var(--inf-7); }

    .scs-3-cl { color: var(--scs-3); } .scs-3-bg { background-color: var(--scs-3); } .scs-3-bc { border-color: var(--scs-3); }
    .scs-5-cl { color: var(--scs-5); } .scs-5-bg { background-color: var(--scs-5); } .scs-5-bc { border-color: var(--scs-5); }
    .scs-7-cl { color: var(--scs-7); } .scs-7-bg { background-color: var(--scs-7); } .scs-7-bc { border-color: var(--scs-7); }

    .wrn-3-cl { color: var(--wrn-3); } .wrn-3-bg { background-color: var(--wrn-3); } .wrn-3-bc { border-color: var(--wrn-3); }
    .wrn-5-cl { color: var(--wrn-5); } .wrn-5-bg { background-color: var(--wrn-5); } .wrn-5-bc { border-color: var(--wrn-5); }
    .wrn-7-cl { color: var(--wrn-7); } .wrn-7-bg { background-color: var(--wrn-7); } .wrn-7-bc { border-color: var(--wrn-7); }

    .err-3-cl { color: var(--err-3); } .err-3-bg { background-color: var(--err-3); } .err-3-bc { border-color: var(--err-3); }
    .err-5-cl { color: var(--err-5); } .err-5-bg { background-color: var(--err-5); } .err-5-bc { border-color: var(--err-5); }
    .err-7-cl { color: var(--err-7); } .err-7-bg { background-color: var(--err-7); } .err-7-bc { border-color: var(--err-7); }

    .inhe-cl { color: inherit; } /* add references where style="color:inherit" is used */

    /* Academy */
        .acdm-pry-3-cl { color: var(--acdm-pry-3); } .acdm-pry-3-bg { background-color: var(--acdm-pry-3); } .acdm-pry-3-bc { border-color: var(--acdm-pry-3); }
        .acdm-pry-5-cl { color: var(--acdm-pry-5); } .acdm-pry-5-bg { background-color: var(--acdm-pry-5); } .acdm-pry-5-bc { border-color: var(--acdm-pry-5); }
        .acdm-pry-7-cl { color: var(--acdm-pry-7); } .acdm-pry-7-bg { background-color: var(--acdm-pry-7); } .acdm-pry-7-bc { border-color: var(--acdm-pry-7); }

        .acdm-sec-3-cl { color: var(--acdm-sec-3); } .acdm-sec-3-bg { background-color: var(--acdm-sec-3); } .acdm-sec-3-bc { border-color: var(--acdm-sec-3); }
        .acdm-sec-5-cl { color: var(--acdm-sec-5); } .acdm-sec-5-bg { background-color: var(--acdm-sec-5); } .acdm-sec-5-bc { border-color: var(--acdm-sec-5); }
        .acdm-sec-7-cl { color: var(--acdm-sec-7); } .acdm-sec-7-bg { background-color: var(--acdm-sec-7); } .acdm-sec-7-bc { border-color: var(--acdm-sec-7); }

        .acdm-neu-3-cl { color: var(--acdm-neu-3); } .acdm-neu-3-bg { background-color: var(--acdm-neu-3); } .acdm-neu-3-bc { border-color: var(--acdm-neu-3); }
        .acdm-neu-5-cl { color: var(--acdm-neu-5); } .acdm-neu-5-bg { background-color: var(--acdm-neu-5); } .acdm-neu-5-bc { border-color: var(--acdm-neu-5); }
        .acdm-neu-7-cl { color: var(--acdm-neu-7); } .acdm-neu-7-bg { background-color: var(--acdm-neu-7); } .acdm-neu-7-bc { border-color: var(--acdm-neu-7); }

        .acdm-acc-3-cl { color: var(--acdm-acc-3); } .acdm-acc-3-bg { background-color: var(--acdm-acc-3); } .acdm-acc-3-bc { border-color: var(--acdm-acc-3); }
        .acdm-acc-5-cl { color: var(--acdm-acc-5); } .acdm-acc-5-bg { background-color: var(--acdm-acc-5); } .acdm-acc-5-bc { border-color: var(--acdm-acc-5); }
        .acdm-acc-7-cl { color: var(--acdm-acc-7); } .acdm-acc-7-bg { background-color: var(--acdm-acc-7); } .acdm-acc-7-bc { border-color: var(--acdm-acc-7); }
    /**/
/**/

/* Spacing */
    .ml-0 { margin-left: var(--spc-0); } .mr-0 { margin-right: var(--spc-0); } .mt-0 { margin-top: var(--spc-0); } .mb-0 { margin-bottom: var(--spc-0); } 
    .ml-1 { margin-left: var(--spc-1); } .mr-1 { margin-right: var(--spc-1); } .mt-1 { margin-top: var(--spc-1); } .mb-1 { margin-bottom: var(--spc-1); } 
    .ml-2 { margin-left: var(--spc-2); } .mr-2 { margin-right: var(--spc-2); } .mt-2 { margin-top: var(--spc-2); } .mb-2 { margin-bottom: var(--spc-2); } 
    .ml-3 { margin-left: var(--spc-3); } .mr-3 { margin-right: var(--spc-3); } .mt-3 { margin-top: var(--spc-3); } .mb-3 { margin-bottom: var(--spc-3); } 
    .ml-4 { margin-left: var(--spc-4); } .mr-4 { margin-right: var(--spc-4); } .mt-4 { margin-top: var(--spc-4); } .mb-4 { margin-bottom: var(--spc-4); } 
    .ml-5 { margin-left: var(--spc-5); } .mr-5 { margin-right: var(--spc-5); } .mt-5 { margin-top: var(--spc-5); } .mb-5 { margin-bottom: var(--spc-5); } 
    .ml-6 { margin-left: var(--spc-6); } .mr-6 { margin-right: var(--spc-6); } .mt-6 { margin-top: var(--spc-6); } .mb-6 { margin-bottom: var(--spc-6); } 
    .ml-7 { margin-left: var(--spc-7); } .mr-7 { margin-right: var(--spc-7); } .mt-7 { margin-top: var(--spc-7); } .mb-7 { margin-bottom: var(--spc-7); } 
    .ml-8 { margin-left: var(--spc-8); } .mr-8 { margin-right: var(--spc-8); } .mt-8 { margin-top: var(--spc-8); } .mb-8 { margin-bottom: var(--spc-8); } 
    .ml-9 { margin-left: var(--spc-9); } .mr-9 { margin-right: var(--spc-9); } .mt-9 { margin-top: var(--spc-9); } .mb-9 { margin-bottom: var(--spc-9); } 

    .mh-0 { margin-left: var(--spc-0); margin-right: var(--spc-0); } .mv-0 { margin-top: var(--spc-0); margin-bottom: var(--spc-0); } .m-0 { margin: var(--spc-0); }
    .mh-1 { margin-left: var(--spc-1); margin-right: var(--spc-1); } .mv-1 { margin-top: var(--spc-1); margin-bottom: var(--spc-1); } .m-1 { margin: var(--spc-1); }
    .mh-2 { margin-left: var(--spc-2); margin-right: var(--spc-2); } .mv-2 { margin-top: var(--spc-2); margin-bottom: var(--spc-2); } .m-2 { margin: var(--spc-2); }
    .mh-3 { margin-left: var(--spc-3); margin-right: var(--spc-3); } .mv-3 { margin-top: var(--spc-3); margin-bottom: var(--spc-3); } .m-3 { margin: var(--spc-3); }
    .mh-4 { margin-left: var(--spc-4); margin-right: var(--spc-4); } .mv-4 { margin-top: var(--spc-4); margin-bottom: var(--spc-4); } .m-4 { margin: var(--spc-4); }
    .mh-5 { margin-left: var(--spc-5); margin-right: var(--spc-5); } .mv-5 { margin-top: var(--spc-5); margin-bottom: var(--spc-5); } .m-5 { margin: var(--spc-5); }
    .mh-6 { margin-left: var(--spc-6); margin-right: var(--spc-6); } .mv-6 { margin-top: var(--spc-6); margin-bottom: var(--spc-6); } .m-6 { margin: var(--spc-6); }
    .mh-7 { margin-left: var(--spc-7); margin-right: var(--spc-7); } .mv-7 { margin-top: var(--spc-7); margin-bottom: var(--spc-7); } .m-7 { margin: var(--spc-7); }
    .mh-8 { margin-left: var(--spc-8); margin-right: var(--spc-8); } .mv-8 { margin-top: var(--spc-8); margin-bottom: var(--spc-8); } .m-8 { margin: var(--spc-8); }
    .mh-9 { margin-left: var(--spc-9); margin-right: var(--spc-9); } .mv-9 { margin-top: var(--spc-9); margin-bottom: var(--spc-9); } .m-9 { margin: var(--spc-9); }

    .pl-0 { padding-left: var(--spc-0); } .pr-0 { padding-right: var(--spc-0); } .pt-0 { padding-top: var(--spc-0); } .pb-0 { padding-bottom: var(--spc-0); } 
    .pl-1 { padding-left: var(--spc-1); } .pr-1 { padding-right: var(--spc-1); } .pt-1 { padding-top: var(--spc-1); } .pb-1 { padding-bottom: var(--spc-1); } 
    .pl-2 { padding-left: var(--spc-2); } .pr-2 { padding-right: var(--spc-2); } .pt-2 { padding-top: var(--spc-2); } .pb-2 { padding-bottom: var(--spc-2); } 
    .pl-3 { padding-left: var(--spc-3); } .pr-3 { padding-right: var(--spc-3); } .pt-3 { padding-top: var(--spc-3); } .pb-3 { padding-bottom: var(--spc-3); } 
    .pl-4 { padding-left: var(--spc-4); } .pr-4 { padding-right: var(--spc-4); } .pt-4 { padding-top: var(--spc-4); } .pb-4 { padding-bottom: var(--spc-4); } 
    .pl-5 { padding-left: var(--spc-5); } .pr-5 { padding-right: var(--spc-5); } .pt-5 { padding-top: var(--spc-5); } .pb-5 { padding-bottom: var(--spc-5); } 
    .pl-6 { padding-left: var(--spc-6); } .pr-6 { padding-right: var(--spc-6); } .pt-6 { padding-top: var(--spc-6); } .pb-6 { padding-bottom: var(--spc-6); } 
    .pl-7 { padding-left: var(--spc-7); } .pr-7 { padding-right: var(--spc-7); } .pt-7 { padding-top: var(--spc-7); } .pb-7 { padding-bottom: var(--spc-7); } 
    .pl-8 { padding-left: var(--spc-8); } .pr-8 { padding-right: var(--spc-8); } .pt-8 { padding-top: var(--spc-8); } .pb-8 { padding-bottom: var(--spc-8); } 
    .pl-9 { padding-left: var(--spc-9); } .pr-9 { padding-right: var(--spc-9); } .pt-9 { padding-top: var(--spc-9); } .pb-9 { padding-bottom: var(--spc-9); } 

    .ph-0 { padding-left: var(--spc-0); padding-right: var(--spc-0); } .pv-0 { padding-top: var(--spc-0); padding-bottom: var(--spc-0); } .p-0 { padding: var(--spc-0); }
    .ph-1 { padding-left: var(--spc-1); padding-right: var(--spc-1); } .pv-1 { padding-top: var(--spc-1); padding-bottom: var(--spc-1); } .p-1 { padding: var(--spc-1); }
    .ph-2 { padding-left: var(--spc-2); padding-right: var(--spc-2); } .pv-2 { padding-top: var(--spc-2); padding-bottom: var(--spc-2); } .p-2 { padding: var(--spc-2); }
    .ph-3 { padding-left: var(--spc-3); padding-right: var(--spc-3); } .pv-3 { padding-top: var(--spc-3); padding-bottom: var(--spc-3); } .p-3 { padding: var(--spc-3); }
    .ph-4 { padding-left: var(--spc-4); padding-right: var(--spc-4); } .pv-4 { padding-top: var(--spc-4); padding-bottom: var(--spc-4); } .p-4 { padding: var(--spc-4); }
    .ph-5 { padding-left: var(--spc-5); padding-right: var(--spc-5); } .pv-5 { padding-top: var(--spc-5); padding-bottom: var(--spc-5); } .p-5 { padding: var(--spc-5); }
    .ph-6 { padding-left: var(--spc-6); padding-right: var(--spc-6); } .pv-6 { padding-top: var(--spc-6); padding-bottom: var(--spc-6); } .p-6 { padding: var(--spc-6); }
    .ph-7 { padding-left: var(--spc-7); padding-right: var(--spc-7); } .pv-7 { padding-top: var(--spc-7); padding-bottom: var(--spc-7); } .p-7 { padding: var(--spc-7); }
    .ph-8 { padding-left: var(--spc-8); padding-right: var(--spc-8); } .pv-8 { padding-top: var(--spc-8); padding-bottom: var(--spc-8); } .p-8 { padding: var(--spc-8); }
    .ph-9 { padding-left: var(--spc-9); padding-right: var(--spc-9); } .pv-9 { padding-top: var(--spc-9); padding-bottom: var(--spc-9); } .p-9 { padding: var(--spc-9); }

    .gv-0 { row-gap: var(--spc-0); } .gh-0 { column-gap: var(--spc-0); } .g-0 { gap: var(--spc-0); }
    .gv-1 { row-gap: var(--spc-1); } .gh-1 { column-gap: var(--spc-1); } .g-1 { gap: var(--spc-1); }
    .gv-2 { row-gap: var(--spc-2); } .gh-2 { column-gap: var(--spc-2); } .g-2 { gap: var(--spc-2); }
    .gv-3 { row-gap: var(--spc-3); } .gh-3 { column-gap: var(--spc-3); } .g-3 { gap: var(--spc-3); }
    .gv-4 { row-gap: var(--spc-4); } .gh-4 { column-gap: var(--spc-4); } .g-4 { gap: var(--spc-4); }
    .gv-5 { row-gap: var(--spc-5); } .gh-5 { column-gap: var(--spc-5); } .g-5 { gap: var(--spc-5); }
    .gv-6 { row-gap: var(--spc-6); } .gh-6 { column-gap: var(--spc-6); } .g-6 { gap: var(--spc-6); }
    .gv-7 { row-gap: var(--spc-7); } .gh-7 { column-gap: var(--spc-7); } .g-7 { gap: var(--spc-7); }
    .gv-8 { row-gap: var(--spc-8); } .gh-8 { column-gap: var(--spc-8); } .g-8 { gap: var(--spc-8); }
    .gv-9 { row-gap: var(--spc-9); } .gh-9 { column-gap: var(--spc-9); } .g-9 { gap: var(--spc-9); }
/**/

/* Components */
    /* compCheckable */
        .compCheckable { column-gap: 0.5rem; }
        .compCheckableIcon { border: 2px solid var(--drk-1); border-radius: 2px; width: 18px; height: 18px; }
        .compCheckableText { font-family: 'Roboto'; font-weight: 400; font-size: 15px; line-height: 150%; color: var(--drk-3); }

        [active="false"] .compCheckableIcon span { opacity: 0%;   }
        [active="true"]  .compCheckableIcon span { opacity: 100%; }
        [active="true"]  .compCheckableIcon { background: var(--red-5); border-color: var(--red-5); }
    /**/

    /* compCheckchip */
        .compCheckchip { border-radius: 8px; padding: 9px 16px; }
        .compCheckchip[active="true"]  { background: var(--red-3); }
        .compCheckchip[active="false"] { background: var(--drk-8); }

        .compCheckchipText { font-family: 'Roboto'; font-weight: 400; font-size: 12px; line-height: 14px; }
        [active="true"]  > .compCheckchipText { color: var(--drk-8); }
        [active="false"] > .compCheckchipText { color: var(--drk-2); }

        [active="true"]  > .compCheckchipIcon { width: 14px; transition: all 0.3s; color: var(--drk-8); font-size: 18px; padding-right: 0.5rem; }
        [active="false"] > .compCheckchipIcon { width: 0px;  transition: all 0.3s; color: var(--drk-8); font-size: 18px; overflow: hidden; }
    /**/

    /* compChipclose */
        .compChipclose { border: 1px solid var(--drk-1); border-radius: 8px; padding: 6px 6px 6px 16px; column-gap: 10px; }
        .compChipcloseText { font-family: 'Roboto'; font-weight: 400; font-size: 12px; line-height: 14px; color: var(--drk-1); }
        .compChipcloseIcon span { font-size: 18px;}
    /**/

    /* compChip */
        .compChip { height: 36px; white-space: nowrap; }

        .compChip.info  > div { background: transparent; color: var(--drk-1); border-color: var(--drk-1); padding-left: var(--spc-3); padding-right: var(--spc-3); }
        .compChip.infox > div { background: transparent; color: var(--drk-1); border-color: var(--drk-1); padding-left: var(--spc-3); }

        .compChip.select > div       { background: var(--drk-8); color: var(--drk-2); padding-right: var(--spc-3); }
        .compChip.select:hover > div { background: var(--drk-6); color: var(--drk-2); }

        .compChip.select[status="true"] > div       { background: var(--red-3); color: var(--drk-8); }
        .compChip.select[status="true"]:hover > div { background: var(--red-1); color: var(--drk-8); }
        
        .compChip.select[status="false"] > div { padding-left: var(--spc-3); }
        .compChip.select[status="false"] .compChipLft { display: none; }
    /**/

    /* compRadioitem */
        .compRadioitem { column-gap: 11px; }
        .compRadioitemText span { font-family: 'Roboto'; font-weight: 400; font-size: 15px; line-height: 150%; color: var(--drk-3); }
        .compRadioitemIcon { border-radius: 100%; width: 20px; height: 20px; }
        [active="true"]  .compRadioitemIcon { border: 5px solid var(--red-7); transition: border 0.3s; }
        [active="false"] .compRadioitemIcon { border: 2px solid var(--drk-1); transition: border 0.3s; }
        [status="true"]  .compRadioitemIcon { border: 5px solid var(--red-7); transition: border 0.3s; }
        [status="false"] .compRadioitemIcon { border: 2px solid var(--drk-1); transition: border 0.3s; }
    /**/

    /* compSearchbar */
        .compSearchbar { position: relative; }
        .compSearchbar input { background: transparent; border: none; }
        .compSearchbar div   { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); }
        .compSearchbar.openSearchbar   { border-bottom: 1px solid var(--drk-1); }
        .compSearchbar.framedSearchbar { border: 1px solid var(--drk-1); }

        .compSearchbar input::placeholder { color: var(--drk-4); }
    /**/

    /* compDropDown2 */
        .compDropDown2 .compDropDownHeadLast { color: var(--drk-1); }

        .compDropDown2 input { background: transparent; color: inherit; border: none; }
        .compDropDown2 input::placeholder { color: inherit; }

        .compDropDown2.normal > label { color: var(--drk-3); }
        .compDropDown2.normal:focus-within > label { color: var(--drk-2); }
        .compDropDown2.normal > span { color: var(--drk-3); }
        .compDropDown2.normal:focus-within > span { color: var(--drk-1); }

        .compDropDown2.normal .compDropDownHead { border: 1.5px solid transparent; }
        .compDropDown2.normal .compDropDownHead { background: var(--drk-6); }
        .compDropDown2.normal .compDropDownHead { color: var(--drk-2); }
        .compDropDown2.normal .compTextLft span { color: var(--drk-4); }
        .compDropDown2.normal .compTextRgt span { color: var(--drk-1); }

        .compDropDown2.normal:focus-within .compDropDownHeadValue { color: var(--drk-1); }
        .compDropDown2.normal:focus-within .compTextLft span { color: var(--drk-1); }

        .compDropDown2.normal.frameless:focus-within .compDropDownHead { border-bottom-color: var(--red-3); }
        .compDropDown2.normal.framed:focus-within    .compDropDownHead { border-color: var(--red-3); }
                
        .compDropDown2.framed .compDropDownHead { border-radius: 8px; }

        /**/

        .compDropDown2 input { background: transparent; border: none; }

        .compDropDown2 .compDropDownItem { transition: all 0.3s; color: var(--drk-3); }
        .compDropDown2 .compDropDownItem:hover { color: var(--drk-1); background: rgba(255, 255, 255, 0.1); transition: all 0.3s; }
        
        .compDropDown2 .compDropDownActual { position: relative; }
        .compDropDown2 .compDropDownOpts   { overflow: hidden; position: absolute; width: 100%; top: 2.5rem; z-index: 1; }
        .compDropDown2 .compDropDownOpts > div { max-height: 100%; overflow-y: scroll; transition: all 0.3s; }
        .compDropDown2 .compDropDownOpts > div::-webkit-scrollbar { width: var(--spc-2); background: var(--drk-7); border-radius: 8px; }
        .compDropDown2 .compDropDownOpts > div::-webkit-scrollbar-thumb { background: var(--red-7); border-radius: 8px; }
    /**/

    /* oldDropDown */
        .oldDropDown { position: relative; }
        .oldDropDown .compDropDownHead { border: 1px solid var(--drk-3); border-radius: 8px; }
        .oldDropDown .compDropDownHeadValue { flex: 1; }

        .oldDropDown .compDropDownOpts { overflow: hidden; position: absolute; width: 100%; top: 2rem; z-index: 1; }
        .oldDropDown .compDropDownOpts > div { border-radius: 8px; border: 1px solid var(--drk-3); }

        .oldDropDown .compDropDownItem { transition: all 0.3s; }
        .oldDropDown .compDropDownItem:hover { color: var(--drk-1); background: rgba(255, 255, 255, 0.1); transition: all 0.3s; }

        .oldDropDown .compDropDownOpts > div { overflow-y: scroll; transition: all 0.3s; }
        .oldDropDown .compDropDownOpts > div::-webkit-scrollbar { width: var(--spc-2); background: var(--drk-7); border-radius: 8px; }
        .oldDropDown .compDropDownOpts > div::-webkit-scrollbar-thumb { background: var(--red-7); border-radius: 8px; }
    /**/

    /* compButton */
        .compButton { position: relative; height: fit-content; }
        .compButtonTooltip { display: none; height: fit-content; max-width: 14.25rem; }
        .compButtonTooltip { position: absolute; width: max-content; z-index: 1; transform: translate(-50%, -50%); }
        .compButton:not(.disabled):hover .compButtonTooltip { display: flex; }
        
        .compButton.disabled .anbg-round::before        { display: none; }
        .compButton.disabled .anbg-round-parent::before { display: none; }

        .compButton[active='true'] .compButtonRgt { color: var(--red-3); }
        .compButton[active='true'] .compButtonTooltipFalse { display: none; }
        .compButton[active='false'] .compButtonTooltipTrue { display: none; }

        .compButtonTooltip.top    { top:    -0.25rem; left: 50%; transform: translate(-50%, -100%); }
        .compButtonTooltip.bottom { bottom: -0.25rem; left: 50%; transform: translate(-50%,  100%); }
        .compButtonTooltip.left   { left:   -0.25rem; top: 50%;  transform: translate(-100%, -50%); }
        .compButtonTooltip.right  { right:  -0.25rem; top: 50%;  transform: translate( 100%, -50%); }

        .compButton_red          { background: var(--red-5); color: var(--drk-1); border-color: transparent; }
        .compButton_red.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_red:hover  { background: var(--red-3); color: var(--drk-1); }
        :not(.disabled) > .compButton_red:active { background: var(--red-7); color: var(--drk-2); }

        .compButton_green          { background: var(--scs-5); color: var(--drk-9); border-color: transparent; }
        .compButton_green.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_green:hover  { background: var(--scs-3); color: var(--drk-9); }
        :not(.disabled) > .compButton_green:active { background: var(--scs-7); color: var(--drk-9); }

        .compButton_open          { background: transparent; color: var(--drk-1); border-color: transparent; padding: 0 !important; }
        .compButton_open.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_open:hover  { background: transparent; color: var(--drk-1); } .compButton_open:hover > span { text-decoration: underline; }
        :not(.disabled) > .compButton_open:active { background: transparent; color: var(--drk-2); }

        .compButton_framed          { background: transparent; color: var(--drk-1); border-color: var(--drk-1); }
        .compButton_framed.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_framed:hover  { background-color: rgba(255, 255, 255, 0.10); color: var(--drk-1); }
        :not(.disabled) > .compButton_framed:active { background: transparent; color: var(--drk-2); }

        /**/

        .compButton_open-dark          { background: transparent; color: var(--drk-9); border-color: transparent; padding: 0 !important; }
        .compButton_open-dark.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_open-dark:hover  { background: transparent; color: var(--drk-9); } .compButton_open-black:hover > span { text-decoration: underline; }
        :not(.disabled) > .compButton_open-dark:active { background: transparent; color: var(--drk-8); }

        .compButton_framed-dark          { background: transparent; color: var(--drk-9); border-color: var(--drk-9); }
        .compButton_framed-dark.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_framed-dark:hover  { background-color: rgba(255, 255, 255, 0.10); color: var(--drk-9); }
        :not(.disabled) > .compButton_framed-dark:active { background: transparent; color: var(--drk-8); }

        /**/

        .compButton_acdm-blue          { background: var(--acdm-pry-5); color: var(--acdm-sec-7); border-color: transparent; border-radius: 0; }
        .compButton_acdm-blue.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_acdm-blue:hover  { background: var(--acdm-pry-3); color: var(--acdm-sec-7); } .compButton_acdm-blue:hover > span { text-decoration: underline; }
        :not(.disabled) > .compButton_acdm-blue:active { background: var(--acdm-pry-7); color: var(--acdm-sec-5); }

        .compButton_acdm-red          { background: var(--red-5); color: var(--drk-1); border-color: transparent; border-radius: 0; }
        .compButton_acdm-red.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_acdm-red:hover  { background: var(--red-3); color: var(--drk-1); } .compButton_acdm-red:hover > span { text-decoration: underline; }
        :not(.disabled) > .compButton_acdm-red:active { background: var(--red-7); color: var(--drk-2); }

        .compButton_acdm-open          { background: transparent; color: var(--acdm-sec-3); border-color: var(--acdm-sec-3); border-radius: 0; }
        .compButton_acdm-open.disabled { opacity: 0.33; }
        :not(.disabled) > .compButton_acdm-open:hover  { background: rgba(255, 255, 255, 0.10); color: var(--acdm-sec-3); } .compButton_acdm-open:hover > span { text-decoration: underline; }
        :not(.disabled) > .compButton_acdm-open:active { background: transparent; color:  var(--acdm-sec-7); }
    /**/

    /* compText */
        .compText input { background: transparent; color: inherit; border: none; }

        .compText.normal > label { color: var(--drk-3); }
        .compText.normal:focus-within > label { color: var(--drk-2); }
        .compText.normal > span { color: var(--drk-3); }
        .compText.normal:focus-within > span { color: var(--drk-1); }

        .compText.normal .compTextInput { border: 1.5px solid transparent; }
        .compText.normal .compTextInput { background: var(--drk-6); }
        .compText.normal .compTextInput { color: var(--drk-2); }
        .compText.normal .compTextLft span { color: var(--drk-4); }
        .compText.normal .compTextRgt span { color: var(--drk-1); }

        .compText.normal:focus-within .compTextInput { color: var(--drk-1); }
        .compText.normal:focus-within .compTextLft span { color: var(--drk-1); }

        .compText.normal.frameless:focus-within .compTextInput { border-bottom-color: var(--red-3); }
        .compText.normal.framed:focus-within    .compTextInput { border-color: var(--red-3); }
        
        .compText.framed .compTextInput { border-radius: 8px; }

        .compText.disabled > label { color: var(--drk-3); }
        .compText.disabled > span { color: var(--drk-3); }
        .compText.disabled .compTextInput { background: var(--drk-4); }
        .compText.disabled .compTextInput { color: var(--drk-6); }
        .compText.disabled .compTextLft span { color: var(--drk-6); }
        .compText.disabled .compTextRgt span { color: var(--drk-6); }

        .compText input:-webkit-autofill,
        .compText input:-webkit-autofill:hover, 
        .compText input:-webkit-autofill:focus, 
        .compText input:-webkit-autofill:active{
            -webkit-background-clip: text;
            -webkit-text-fill-color: var(--red-1);
            transition: background-color 5000s ease-in-out 0s;
            box-shadow: inset 0 0 20px 20px transparent;
        }
    /**/

    /* compSltToggle */
        .compSltToggleBox { width: var(--spc-5); height: var(--spc-5); }
        .compSltToggleBox > div { width: 1.25rem; height: 0.625rem; padding: 0rem 0.125rem; border-radius: 10px; transition: all 0.3s; }
        .compSltToggleBox > div > div { width: 0.375rem; height: 0.375rem; border-radius: 100%; background: var(--drk-9); transition: all 0.3s; }
        .compSltToggle.disabled { opacity: 0.33; }
        
        .compSltToggle[status="false"] > .compSltToggleBox > div > div { margin-left: 0.00rem; }
        .compSltToggle[status="true"]  > .compSltToggleBox > div > div { margin-left: 0.63rem; }

        .compSltToggle[status="false"] > .compSltToggleBox > div { background: var(--drk-1); }
        .compSltToggle[status="true"]  > .compSltToggleBox > div { background: var(--red-5); }
        .compSltToggle[status="false"]:hover > .compSltToggleBox > div { background: var(--drk-2); }
        .compSltToggle[status="true"]:hover  > .compSltToggleBox > div { background: var(--red-3); }
    /**/

    /* rewardsFeatured */
        .rewardsFeatured .deactivate        { display: none; }
        .rewardsFeatured.active .deactivate { display: flex; }
        .rewardsFeatured.active .activate   { display: none; }

        .rewardsFeatured:not(.active) .rewardsFeaturedActual > div:nth-child(n+9) { display: none; }
    /**/

    /* listingItem */
        .listingItem       { border-color: transparent; height: fit-content; transition: border-color 0.3s; }
        .listingItem:hover { border-color: var(--drk-5); transition: border-color 0.3s; } 
        .listingItem h2    { text-transform: uppercase; height: 2.25em; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
        
        .listingItemCard     { position: relative; }
        .listingItemCard img { object-fit: cover; object-position: top;  border-bottom-left-radius: 0; border-bottom-right-radius: 0; }

        .listingItemInfo { justify-content: space-between; transition: all 0.5s; position: relative; z-index: 1; }
        .listingItemInfo { border-top-right-radius: 0; border-top-left-radius: 0; transition: background-color 0.3s; }
        .listingItem:hover .listingItemInfo { background-color: var(--drk-5); transition: background-color 0.3s; }
        
        .listingItemButton { transition: all 0.3s; opacity: 0; }
        .listingItem:hover .listingItemButton { transition: all 0.3s; opacity: 1; }

        /**/

        .listingItem .notOwned { position: absolute; top: 12px; left: 12px; }
        
        .listingItem .otherIcons { position: absolute; top: 0px; right: 0px; border-bottom-left-radius: 8px; border-top-right-radius: 8px; }
        .listingItem .otherIcons { transition: all 0.3s; opacity: 0.3; }
        .listingItem .otherIcons > div[status="false"] { color: var(--drk-1); }
        .listingItem .otherIcons > div[status="true"]  { color: var(--red-5); }

        .listingItem .helperTxt { right: 0.25rem; position: absolute; transform: translate(-50%, -50%); width: fit-content; white-space: nowrap; top: 50%; }
        .listingItem .helperTxt { opacity: 0; transition: all 0.3s; }
        .listingItem:hover .otherIcons                    { opacity: 1; transition: all 0.3s; }
        .listingItem .otherIcons > div:hover > .helperTxt { opacity: 1; transition: all 0.3s; }

        /**/

        .listingItemPrice  { display: flex; } .listingItem.no_purc .listingItemPrice  { display: none; }
        .listingItemUnav   { display: none; } .listingItem.is_unav .listingItemUnav   { display: flex; }
        .cartToggleListing { display: flex; } .listingItem.no_purc .cartToggleListing { display: none; }

        .memberDiscNo  { display: flex; } .mem_disc .memberDiscNo  { display: none; }
        .memberDiscYes { display: none; } .mem_disc .memberDiscYes { display: flex; }

        .saleOff { display: none; position: absolute; top: var(--spc-2); left: var(--spc-2); }
        .saleMem { display: none; } .sale_mem .saleMem { display: flex; }
        .saleExt { display: none; } .sale_ext .saleExt { display: flex; }

        .listingItem:not(.mem_disc).sale_ext.sale_mem .saleMem { display: none; }
        .listingItem.mem_disc.sale_ext.sale_mem       .saleExt { display: none; }

        .notOwned { display: none; } .listingItem.owner_notown .notOwned { display: flex; }
        .listingItem.owner_notown.sale_mem .notOwned { display: none; }
        .listingItem.owner_notown.sale_ext .notOwned { display: none; }

        .listingItem.loot_reward .cartToggleListing { display: none; }
        .listingItem:not(.loot_reward) .listingItemCoin { display: none; }
        .listingItem.loot_reward .listingItemCoin       { display: flex; }

        .owner_yesown .saleOff { display: none; }
        
    /**/

    /* cartDrawer */
        .closeCart { display: none; }
        .closeCart.active { display: flex; }

        .cartDrawer.active { right: 0rem; overflow: hidden; transition: right 0.3s; }
        .cartDrawer { width: 18rem; right: -18rem; position: fixed; top: 0; z-index: 99; box-shadow: -4px 0px 4px 0px rgba(0, 0, 0, 0.50); transition: right 0.3s;  }

        .cartDrawerList { overflow-y: scroll; -ms-overflow-style: none; scrollbar-width: none; }
        .cartDrawerList::-webkit-scrollbar { display: none; }

        .cartDrawer .cartItemTemplate { display: none; }

        .cartDrawer .cartItemName p { display: none; }
        .cartDrawer .cartItemDelete { display: none; }
        .cartDrawer .cartItem:hover .cartItemDelete { display: flex; }
        .cartDrawer .cartItem:hover .cartItemPrice  { display: none; }
    /**/

    /* mainMenu */
        .mainMenu  { height: var(--spc-8); position: fixed; z-index: 100; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5); }
        .menuImage { width: var(--spc-8); }
        .menuImage img { object-fit: contain; }
        .menuActual > div { height: 100%; }

        .profMenu { position: relative; }
        .profMenu .profDrop { position: absolute; top: calc(-100% - (var(--spc-7) + 2px)); right: 0%; transition: all 0.33s; z-index: -1; }
        .profMenu .profDrop { padding-bottom: var(--spc-2); border-bottom: 2px solid var(--red-5); }
        .profMenu:hover .profDrop { top: 100%; }
        .profMenu .profDrop > div { white-space: nowrap; }
        .profMenu .profDrop > div a       { transition: color 0.3s; }
        .profMenu .profDrop > div:hover a { transition: color 0.3s; color: var(--drk-1); }

        .cartCounter { position: absolute; top: 1rem; right: 1rem; z-index: 2; width: 1rem; height: 1rem; }
    /**/
    
    /* misc */
        .backTo { width: fit-content !important; transition: color 0.3s; }
        .backTo:hover span { color: var(--drk-3); transition: color 0.3s; }

        .loader { height: 4px; background: var(--drk-8); width: 100%; z-index: 999; position: fixed; }
        .loaded { height: 4px; background: var(--red-5); width: 0%; transition: width 1s; }

        .btn { font-family: Roboto; font-size: 0.875rem; transition: all 0.3s; line-height: normal; font-weight: 400; border-radius: 8px; column-gap: var(--spc-1); }
        .btn { display: flex; box-sizing: border-box; flex-wrap: nowrap; align-items: center; }
        .btn.hcent { justify-content: center; }
        .btn:hover { cursor: pointer; }
        .btn.und:hover > span { text-decoration: underline; }

        .btn.auto  { width: fit-content !important; }

        [enabled="false"].btn { opacity: 33%; transition: opacity 0.3s; }
        
        .btn.red-5-bg:not([enabled="false"]):hover { background: var(--red-3); transition: background 0.3s; }

        .packBundles > div:not(:last-child) { display: none; }
    /**/
/**/

/* Responsive */
    .co-12 { width: calc(98px * 12 + (1.5rem * (12 - 1))); }
    .co-11 { width: calc(98px * 11 + (1.5rem * (11 - 1))); }
    .co-10 { width: calc(98px * 10 + (1.5rem * (10 - 1))); }
    .co-09 { width: calc(98px * 9  + (1.5rem * (9 - 1)));  }
    .co-08 { width: calc(98px * 8  + (1.5rem * (8 - 1)));  }
    .co-07 { width: calc(98px * 7  + (1.5rem * (7 - 1)));  }
    .co-06 { width: calc(98px * 6  + (1.5rem * (6 - 1)));  }
    .co-05 { width: calc(98px * 5  + (1.5rem * (5 - 1)));  }
    .co-04 { width: calc(98px * 4  + (1.5rem * (4 - 1)));  }
    .co-03 { width: calc(98px * 3  + (1.5rem * (3 - 1)));  }
    .co-02 { width: calc(98px * 2  + (1.5rem * (2 - 1)));  }
    .co-01 { width: calc(98px * 1  + (1.5rem * (1 - 1)));  }

    /* Deprecated */
        .col-12 { width: 100.0%; }
        .col-11 { width: 91.66%; }
        .col-10 { width: 83.33%; }
        .col-09 { width: 75.00%; }
        .col-08 { width: 66.66%; }
        .col-07 { width: 58.33%; }
        .col-06 { width: 50.00%; }
        .col-05 { width: 41.66%; }
        .col-04 { width: 33.33%; }
        .col-03 { width: 25.00%; }
        .col-02 { width: 16.66%; }
        .col-01 { width: 08.33%; } 
        .clg-12 { width: calc((100% - (12 - 1) * 1rem) / 12); }
        .clg-11 { width: calc((100% - (12 - 1) * 1rem) / 11); }
        .clg-10 { width: calc((100% - (10 - 1) * 1rem) / 10); }
        .clg-09 { width: calc((100% - (9 - 1) * 1rem) / 9); }
        .clg-08 { width: calc((100% - (8 - 1) * 1rem) / 8); }
        .clg-07 { width: calc((100% - (7 - 1) * 1rem) / 7); }
        .clg-06 { width: calc((100% - (6 - 1) * 1rem) / 6); }
        .clg-05 { width: calc((100% - (5 - 1) * 1rem) / 5); }
        .clg-04 { width: calc((100% - (4 - 1) * 1rem) / 4); }
        .clg-03 { width: calc((100% - (3 - 1) * 1rem) / 3); }
        .clg-02 { width: calc((100% - (2 - 1) * 1rem) / 2); }
        .clg-01 { width: calc((100% - (1 - 1) * 1rem) / 1); }
    /**/

    @media only screen and (min-width: 1536px)
    {
        html { font-size: 16px; }
        .mwc { max-width: 1440px; column-gap: 1.5rem; }
    }
    
    @media only screen and (max-width: 1536px)
    {
        html { font-size: 16px; }
        .mwc { max-width: 90vw; column-gap: 1.5rem; }

        .co-12 { width: calc(((90vw - 16.5rem) / 12) * 12 + (1.5rem * (12 - 1))); }
        .co-11 { width: calc(((90vw - 16.5rem) / 12) * 11 + (1.5rem * (11 - 1))); }
        .co-10 { width: calc(((90vw - 16.5rem) / 12) * 10 + (1.5rem * (10 - 1))); }
        .co-09 { width: calc(((90vw - 16.5rem) / 12) * 9  + (1.5rem * (9 - 1)));  }
        .co-08 { width: calc(((90vw - 16.5rem) / 12) * 8  + (1.5rem * (8 - 1)));  }
        .co-07 { width: calc(((90vw - 16.5rem) / 12) * 7  + (1.5rem * (7 - 1)));  }
        .co-06 { width: calc(((90vw - 16.5rem) / 12) * 6  + (1.5rem * (6 - 1)));  }
        .co-05 { width: calc(((90vw - 16.5rem) / 12) * 5  + (1.5rem * (5 - 1)));  }
        .co-04 { width: calc(((90vw - 16.5rem) / 12) * 4  + (1.5rem * (4 - 1)));  }
        .co-03 { width: calc(((90vw - 16.5rem) / 12) * 3  + (1.5rem * (3 - 1)));  }
        .co-02 { width: calc(((90vw - 16.5rem) / 12) * 2  + (1.5rem * (2 - 1)));  }
        .co-01 { width: calc(((90vw - 16.5rem) / 12) * 1  + (1.5rem * (1 - 1)));  }
    }
/**/