:root { color-scheme: light; --bg: radial-gradient(circle at top left, #1f3d7a, #0d1221 60%); --panel-bg: rgba(18, 25, 46, 0.72); --panel-border: rgba(255, 255, 255, 0.08); --text-primary: #f5f7ff; --text-secondary: rgba(245, 247, 255, 0.75); --accent: #5bc0f8; } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); color: var(--text-primary); } main.layout { flex: 1; display: grid; grid-template-columns: minmax(240px, 360px) minmax(0, 1fr); gap: clamp(1.5rem, 3vw, 3rem); padding: clamp(1.5rem, 4vw, 4rem); align-items: stretch; } main.layout { padding-bottom: 1rem !important; } .info-panel { background: var(--panel-bg); border: 1px solid var(--panel-border); border-radius: 24px; padding: clamp(1.5rem, 3vw, 2.25rem); display: flex; flex-direction: column; gap: 1.25rem; backdrop-filter: blur(12px); box-shadow: 0 28px 50px rgba(0, 0, 0, 0.35); align-self: start; } .spec-form { display: flex; flex-direction: column; gap: 1.25rem; overflow-y: auto; padding-right: 0.35rem; margin-right: -0.35rem; height: clamp(18rem, 48vh, 26rem); overscroll-behavior: contain; } .spec-form fieldset { border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 18px; padding: 1.25rem; display: grid; gap: 1rem; background: rgba(12, 18, 32, 0.5); } .spec-form legend { font-size: 0.9rem; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(245, 247, 255, 0.65); } .field { display: grid; gap: 0.45rem; font-size: 0.95rem; } .field span { color: rgba(245, 247, 255, 0.75); } .field input, .field select { width: 100%; padding: 0.6rem 0.75rem; border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(7, 10, 19, 0.6); color: var(--text-primary); font: inherit; transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } .field input:focus, .field select:focus { outline: none; border-color: rgba(91, 192, 248, 0.65); background: rgba(7, 10, 19, 0.8); box-shadow: 0 0 0 3px rgba(91, 192, 248, 0.25); } .input-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; } .input-suffix { display: grid; grid-template-columns: 1fr auto; align-items: center; background: rgba(7, 10, 19, 0.6); border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.08); overflow: hidden; } .input-suffix:focus-within { border-color: rgba(91, 192, 248, 0.65); background: rgba(7, 10, 19, 0.8); box-shadow: 0 0 0 3px rgba(91, 192, 248, 0.25); } .input-suffix input { border: none; background: transparent; padding: 0.6rem 0.75rem; color: inherit; } .input-suffix input:focus { outline: none; box-shadow: none; background: transparent; } .input-suffix .suffix { padding: 0 0.75rem; font-size: 0.85rem; color: rgba(245, 247, 255, 0.6); } .checkbox-grid, .radio-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.75rem; } .choice { display: flex; align-items: center; gap: 0.6rem; padding: 0.65rem 0.75rem; border-radius: 12px; background: rgba(7, 10, 19, 0.45); border: 1px solid rgba(255, 255, 255, 0.08); transition: border-color 0.2s ease, background 0.2s ease; } .choice input { accent-color: #5bc0f8; } .choice span { font-size: 0.95rem; color: rgba(245, 247, 255, 0.8); } .choice:focus-within { border-color: rgba(91, 192, 248, 0.6); background: rgba(7, 10, 19, 0.7); } .spec-form::-webkit-scrollbar { width: 8px; } .spec-form::-webkit-scrollbar-track { background: transparent; } .spec-form::-webkit-scrollbar-thumb { background: rgba(91, 192, 248, 0.35); border-radius: 999px; } .spec-form::-webkit-scrollbar-thumb:hover { background: rgba(91, 192, 248, 0.55); } .info-panel h1 { font-size: clamp(1.75rem, 4vw, 2.6rem); font-weight: 700; } .info-panel p { font-size: 1rem; line-height: 1.6; color: var(--text-secondary); } .hint-list { display: grid; gap: 0.75rem; list-style: none; } .hint-list li { display: flex; align-items: center; gap: 0.75rem; font-size: 0.95rem; color: var(--text-secondary); } .hint-list kbd { background: rgba(255, 255, 255, 0.1); padding: 0.2rem 0.55rem; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.2); font-size: 0.85rem; letter-spacing: 0.05em; } .viewer-panel { position: relative; border-radius: 28px; overflow: hidden; border: 1px solid rgba(91, 192, 248, 0.2); box-shadow: 0 35px 65px rgba(8, 14, 28, 0.55); background: linear-gradient(160deg, rgba(14, 20, 37, 0.9), rgba(12, 17, 29, 0.65)); min-height: clamp(360px, 60vh, 640px); } .viewer { position: absolute; inset: 0; } .tooltip { position: absolute; max-width: min(280px, 40vw); padding: 1rem 1.25rem; border-radius: 16px; background: rgba(8, 11, 19, 0.92); border: 1px solid rgba(91, 192, 248, 0.35); box-shadow: 0 20px 35px rgba(0, 0, 0, 0.45); transform: translate(-50%, -110%); pointer-events: none; } .tooltip h2 { font-size: 1.05rem; margin-bottom: 0.35rem; } .tooltip p { font-size: 0.9rem; line-height: 1.5; color: var(--text-secondary); } .footer { padding: 1rem 2rem 2rem; text-align: center; font-size: 0.85rem; color: rgba(245, 247, 255, 0.55); } @media (max-width: 960px) { main.layout { grid-template-columns: 1fr; } .info-panel { text-align: center; } .hint-list li { justify-content: center; } } @media (max-width: 640px) { main.layout { padding: 1.5rem; gap: 1.5rem; } .info-panel { border-radius: 18px; } .viewer-panel { border-radius: 22px; } } .primary-action { position: relative; display: inline-block; align-self: stretch; margin-right: 0.35rem; /* same as .spec-form */ padding: 0.8rem 1.8rem; font-size: 1.05rem; font-weight: 600; color: var(--text-primary); background: rgba(12, 17, 29, 0.7); border-radius: 14px; cursor: pointer; border: 1px solid #5bc0f8; outline: none; letter-spacing: 0.03em; user-select: none; transition: background 0.25s ease, transform 0.2s ease, box-shadow 0.3s ease; z-index: 0; line-height: 30px; padding-top: 1em !important; } /* Gradient border (this is the neon effect) */ .primary-action::before { content: ""; position: absolute; inset: 0; padding: 1.5px; /* thickness of the border */ border-radius: inherit; -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; z-index: -1; } .primary-action:hover { background: rgba(14, 20, 37, 0.9); box-shadow: 0 0 18px rgba(91, 192, 248, 0.45), 0 0 28px rgba(91, 192, 248, 0.25); transform: translateY(-2px); } .primary-action:active { transform: translateY(0); box-shadow: 0 0 10px rgba(91, 192, 248, 0.35); background: rgba(14, 20, 37, 0.8); } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } /* Base select */ .field select { appearance: none; -webkit-appearance: none; -moz-appearance: none; } .field--select { position: relative; } /* style the select & hide native arrow */ .field--select select { appearance: none; -webkit-appearance: none; -moz-appearance: none; width: 100%; padding: 0.6rem 0.75rem; padding-right: 2.4rem; /* space for our custom arrow */ border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.08); background-color: rgba(7, 10, 19, 0.6); color: var(--text-primary); font: inherit; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; } /* keep your focus styling */ .field--select select:focus { outline: none; border-color: rgba(91, 192, 248, 0.65); background-color: rgba(7, 10, 19, 0.8); box-shadow: 0 0 0 3px rgba(91, 192, 248, 0.25); } /* THIN V ARROW ON THE WRAPPER (never disappears) */ .field--select::after { content: ""; position: absolute; right: 1rem; top: calc(50% + 13px); /* <-- adjust this value */ transform: translateY(-50%); width: 10px; height: 6px; pointer-events: none; background-image: url("data:image/svg+xml;utf8,<svg width='10' height='6' xmlns='http://www.w3.org/2000/svg'><path d='M1 1 L5 5 L9 1' stroke='white' stroke-width='1.4' fill='none' stroke-linecap='round'/></svg>"); background-repeat: no-repeat; background-size: 10px 6px; } .primary-action[disabled] { background: linear-gradient(135deg, rgb(2 2 2 / 45%), rgb(158 158 158 / 35%)); border: 1px solid #9a9a9a !important; color: rgb(147 147 147); cursor: not-allowed; box-shadow: none; transform: none; } .primary-action[disabled]:hover, .primary-action[disabled]:active { transform: none; box-shadow: none; } .display-none { display: none !important; } /* Removes arrows in Firefox */ input[type="number"] { -moz-appearance: textfield; } .button-spinner { border: 2px solid transparent; border-top: 2px solid white; border-right: 2px solid white; border-radius: 50%; width: 14px; height: 14px; display: inline-block; margin-left: 6px; animation: spin 0.6s linear infinite; vertical-align: middle; } @keyframes spin { 100% { transform: rotate(360deg); } } .hidden { display: none !important; }

.exit-config-action {
        position: relative;
    display: inline-block;
    align-self: stretch;
    margin-right: 0.35rem;
    padding: 0.9rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-primary);
    background: rgba(12, 17, 29, 0.7);
    border-radius: 14px;
    cursor: pointer;
    border: 1px solid #5bc0f8;
    outline: none;
    letter-spacing: 0.03em;
    user-select: none;
    transition: background 0.25s ease, transform 0.2s ease, box-shadow 0.3s ease;
    z-index: 0;
    line-height: 20px;
    width: 60%;
}

.spec-form {
    overflow-x: hidden !important;
}

 #loadingOverlay {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: #f0f0f0;
     display: flex;
     align-items: center;
     justify-content: center;
     z-index: 9999;
     opacity: 1;
     transition: opacity 0.5s ease;
 }

 .svg-wrapper {
     width: 308px;
     /* enough to contain diagonal */
     height: 308px;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 svg {
     width: 217.68px;
     height: 217.62px;
     animation: rotate 10s linear infinite;
 }

 @keyframes rotate {
     0% {
         transform: rotate(0deg);
     }

     100% {
         transform: rotate(360deg);
     }
 }

 .cls-1 {
     fill: #727272;
 }

 @keyframes animate-svg-fill {
     0% {
         fill: transparent;
     }

     100% {
         fill: #727272;
     }
 }

 .svg-elem-1 {
     animation: animate-svg-fill 5s ease-in 0.8s both;
 }

 .svg-elem-2 {
     animation: animate-svg-fill 5s ease-in 0.9s both;
 }

 .svg-elem-3 {
     animation: animate-svg-fill 5s ease-in 1s both;
 }

 .svg-elem-4 {
     animation: animate-svg-fill 5s ease-in 1.1s both;
 }

 .top-logo svg {
     animation: none !important;
 }

 .st0 {
     fill: #000000;
 }

 .st1 {
     fill: url(#SVGID_1_);
 }

 .st2 {
     fill: url(#SVGID_2_);
 }

 .st3 {
     fill: url(#SVGID_3_);
 }

 .st4 {
     fill: none;
 }

 .st5 {
     fill: url(#SVGID_4_);
 }

 .st6 {
     fill: url(#SVGID_5_);
 }

 .st7 {
     fill: url(#SVGID_6_);
 }

 .st8 {
     fill: url(#SVGID_7_);
 }

 .st9 {
     fill: url(#SVGID_8_);
 }

 .st10 {
     fill: url(#SVGID_9_);
 }

 .st11 {
     fill: url(#SVGID_10_);
 }

 .st12 {
     fill: url(#SVGID_11_);
 }

 .st13 {
     fill: url(#SVGID_12_);
 }

 .st14 {
     fill: url(#SVGID_13_);
 }

 .st15 {
     fill: url(#SVGID_14_);
 }

 .st16 {
     fill: url(#SVGID_15_);
 }

 .st17 {
     fill: url(#SVGID_16_);
 }

 .st18 {
     fill: url(#SVGID_17_);
 }

 .st19 {
     fill: url(#SVGID_18_);
 }

 .st20 {
     fill: url(#SVGID_19_);
 }

 .st21 {
     fill: url(#SVGID_20_);
 }

 .st22 {
     fill: url(#SVGID_21_);
 }

 .st23 {
     fill: url(#SVGID_22_);
 }

 .st24 {
     fill: url(#SVGID_23_);
 }

 .st25 {
     fill: url(#SVGID_24_);
 }

 .st26 {
     fill: url(#SVGID_25_);
 }

 .st27 {
     fill: url(#SVGID_26_);
 }

 .st28 {
     fill: url(#SVGID_27_);
 }

 .st29 {
     fill: url(#SVGID_28_);
 }

 .st30 {
     fill: url(#SVGID_29_);
 }

 .st31 {
     fill: url(#SVGID_30_);
 }

 .st32 {
     fill: url(#SVGID_31_);
 }

 .st33 {
     fill: url(#SVGID_32_);
 }

 .st34 {
     fill: url(#SVGID_33_);
 }

 .st35 {
     fill: url(#SVGID_34_);
 }

 .st36 {
     fill: url(#SVGID_35_);
 }

 .st37 {
     fill: url(#SVGID_36_);
 }

 .st38 {
     fill: url(#SVGID_37_);
 }

 .st39 {
     fill: url(#SVGID_38_);
 }

 .st40 {
     fill: url(#SVGID_39_);
 }

 .st41 {
     fill: url(#SVGID_40_);
 }

 .st42 {
     fill: url(#SVGID_41_);
 }

 .st43 {
     fill: url(#SVGID_42_);
 }

 .st44 {
     fill: url(#SVGID_43_);
 }

 .st45 {
     fill: url(#SVGID_44_);
 }

 .st46 {
     fill: url(#SVGID_45_);
 }

 .st47 {
     fill: url(#SVGID_46_);
 }

 .st48 {
     fill: url(#SVGID_47_);
 }

 .st49 {
     fill: url(#SVGID_48_);
 }

 .st50 {
     fill: url(#SVGID_49_);
 }

 .st51 {
     fill: url(#SVGID_50_);
 }

 .st52 {
     fill: url(#SVGID_51_);
 }

 .st53 {
     fill: url(#SVGID_52_);
 }

 .st54 {
     fill: url(#SVGID_53_);
 }

 .st55 {
     fill: url(#SVGID_54_);
 }

 .st56 {
     fill: url(#SVGID_55_);
 }

 .st57 {
     fill: url(#SVGID_56_);
 }

 .st58 {
     fill: url(#SVGID_57_);
 }

 .st59 {
     fill: url(#SVGID_58_);
 }

 .st60 {
     fill: url(#SVGID_59_);
 }

 .st61 {
     fill: url(#SVGID_60_);
 }

 .st62 {
     fill: url(#SVGID_61_);
 }

 .st63 {
     fill: url(#SVGID_62_);
 }

 .st64 {
     fill: url(#SVGID_63_);
 }

 .st65 {
     fill: url(#SVGID_64_);
 }

 .st66 {
     fill: url(#SVGID_65_);
 }

 .st67 {
     fill: url(#SVGID_66_);
 }

 .st68 {
     fill: url(#SVGID_67_);
 }

 .st69 {
     fill: url(#SVGID_68_);
 }

 .st70 {
     fill: url(#SVGID_69_);
 }

 .st71 {
     fill: url(#SVGID_70_);
 }

 .st72 {
     fill: url(#SVGID_71_);
 }

 .st73 {
     fill: url(#SVGID_72_);
 }

 .st74 {
     fill: url(#SVGID_73_);
 }

 .st75 {
     fill: url(#SVGID_74_);
 }

 .st76 {
     fill: url(#SVGID_75_);
 }

 .st77 {
     fill: url(#SVGID_76_);
 }

 .st78 {
     fill: url(#SVGID_77_);
 }

 .st79 {
     fill: url(#SVGID_78_);
 }

 .st80 {
     fill: url(#SVGID_79_);
 }

 .st81 {
     fill: url(#SVGID_80_);
 }

 .st82 {
     fill: url(#SVGID_81_);
 }

 .st83 {
     fill: url(#SVGID_82_);
 }

 .st84 {
     fill: url(#SVGID_83_);
 }

 .st85 {
     fill: url(#SVGID_84_);
 }

 .st86 {
     fill: url(#SVGID_85_);
 }

 .st87 {
     fill: url(#SVGID_86_);
 }

 .st88 {
     fill: url(#SVGID_87_);
 }

 .st89 {
     fill: url(#SVGID_88_);
 }

 .st90 {
     fill: url(#SVGID_89_);
 }

 .st91 {
     fill: url(#SVGID_90_);
 }

 .st92 {
     fill: url(#SVGID_91_);
 }

 .st93 {
     fill: url(#SVGID_92_);
 }

 .st94 {
     fill: url(#SVGID_93_);
 }

 .st95 {
     fill: url(#SVGID_94_);
 }

 .st96 {
     fill: url(#SVGID_95_);
 }

 .st97 {
     fill: url(#SVGID_96_);
 }

 .st98 {
     fill: url(#SVGID_97_);
 }

 .st99 {
     fill: url(#SVGID_98_);
 }

 .st100 {
     fill: url(#SVGID_99_);
 }

 .st101 {
     fill: url(#SVGID_100_);
 }

 .st102 {
     fill: url(#SVGID_101_);
 }

 .st103 {
     fill: url(#SVGID_102_);
 }

 .st104 {
     fill: url(#SVGID_103_);
 }

 .st105 {
     fill: url(#SVGID_104_);
 }

 .st106 {
     fill: url(#SVGID_105_);
 }

 .st107 {
     fill: url(#SVGID_106_);
 }

 .st108 {
     fill: url(#SVGID_107_);
 }

 .st109 {
     fill: url(#SVGID_108_);
 }

 .st110 {
     fill: url(#SVGID_109_);
 }

 .st111 {
     fill: url(#SVGID_110_);
 }

 .st112 {
     fill: url(#SVGID_111_);
 }

 .st113 {
     fill: url(#SVGID_112_);
 }

 .st114 {
     fill: url(#SVGID_113_);
 }

 .st115 {
     fill: url(#SVGID_114_);
 }

 .st116 {
     fill: url(#SVGID_115_);
 }

 .st117 {
     fill: url(#SVGID_116_);
 }

 .st118 {
     fill: url(#SVGID_117_);
 }

 .st119 {
     fill: url(#SVGID_118_);
 }

 .st120 {
     fill: url(#SVGID_119_);
 }

 .st121 {
     fill: url(#SVGID_120_);
 }

 .st122 {
     fill: url(#SVGID_121_);
 }

 .st123 {
     fill: url(#SVGID_122_);
 }

 .st124 {
     fill: url(#SVGID_123_);
 }

 .st125 {
     fill: url(#SVGID_124_);
 }

 .st126 {
     fill: url(#SVGID_125_);
 }

 .st127 {
     fill: url(#SVGID_126_);
 }

 .st128 {
     fill: url(#SVGID_127_);
 }

 .st129 {
     fill: url(#SVGID_128_);
 }

 .st130 {
     fill: url(#SVGID_129_);
 }

 .st131 {
     fill: url(#SVGID_130_);
 }

 .st132 {
     fill: url(#SVGID_131_);
 }

 .st133 {
     fill: url(#SVGID_132_);
 }

 .st134 {
     fill: url(#SVGID_133_);
 }

 .st135 {
     fill: url(#SVGID_134_);
 }

 .st136 {
     fill: url(#SVGID_135_);
 }

 .st137 {
     fill: url(#SVGID_136_);
 }

 .st138 {
     fill: url(#SVGID_137_);
 }

 .st139 {
     fill: url(#SVGID_138_);
 }

 .st140 {
     fill: url(#SVGID_139_);
 }

 .st141 {
     fill: url(#SVGID_140_);
 }

 .st142 {
     fill: url(#SVGID_141_);
 }

 .st143 {
     fill: url(#SVGID_142_);
 }

 .st144 {
     fill: url(#SVGID_143_);
 }

 .st145 {
     fill: url(#SVGID_144_);
 }

 .st146 {
     fill: url(#SVGID_145_);
 }

 .st147 {
     fill: url(#SVGID_146_);
 }

 .st148 {
     fill: url(#SVGID_147_);
 }

 .st149 {
     fill: url(#SVGID_148_);
 }

 .st150 {
     fill: url(#SVGID_149_);
 }

 .st151 {
     fill: url(#SVGID_150_);
 }

 .st152 {
     fill: url(#SVGID_151_);
 }

 .st153 {
     fill: url(#SVGID_152_);
 }

 .st154 {
     fill: url(#SVGID_153_);
 }

 .st155 {
     fill: url(#SVGID_154_);
 }

 .st156 {
     fill: url(#SVGID_155_);
 }

 .st157 {
     fill: url(#SVGID_156_);
 }

 .st158 {
     fill: url(#SVGID_157_);
 }

 .st159 {
     fill: url(#SVGID_158_);
 }

 .st160 {
     fill: url(#SVGID_159_);
 }

 .st161 {
     fill: url(#SVGID_160_);
 }

 .st162 {
     fill: url(#SVGID_161_);
 }

 .st163 {
     fill: url(#SVGID_162_);
 }

 .st164 {
     fill: url(#SVGID_163_);
 }

 .st165 {
     fill: url(#SVGID_164_);
 }

 .st166 {
     fill: url(#SVGID_165_);
 }

 .st167 {
     fill: url(#SVGID_166_);
 }

 .st168 {
     fill: url(#SVGID_167_);
 }

 .st169 {
     fill: url(#SVGID_168_);
 }

 .st170 {
     fill: url(#SVGID_169_);
 }

 .st171 {
     fill: url(#SVGID_170_);
 }

 .st172 {
     fill: url(#SVGID_171_);
 }

 .st173 {
     fill: url(#SVGID_172_);
 }

 .st174 {
     fill: url(#SVGID_173_);
 }

 .st175 {
     fill: url(#SVGID_174_);
 }

 .st176 {
     fill: url(#SVGID_175_);
 }

 .st177 {
     fill: url(#SVGID_176_);
 }

 .st178 {
     fill: url(#SVGID_177_);
 }

 .st179 {
     fill: url(#SVGID_178_);
 }

 .st180 {
     fill: url(#SVGID_179_);
 }

 .st181 {
     fill: url(#SVGID_180_);
 }

 .st182 {
     fill: url(#SVGID_181_);
 }

 .st183 {
     fill: url(#SVGID_182_);
 }

 .st184 {
     fill: url(#SVGID_183_);
 }

 .st185 {
     fill: url(#SVGID_184_);
 }

 .st186 {
     fill: url(#SVGID_185_);
 }

 .st187 {
     fill: url(#SVGID_186_);
 }

 .st188 {
     fill: url(#SVGID_187_);
 }

 .st189 {
     fill: url(#SVGID_188_);
 }

 .st190 {
     fill: url(#SVGID_189_);
 }

 .st191 {
     fill: url(#SVGID_190_);
 }

 .st192 {
     fill: url(#SVGID_191_);
 }

 .st193 {
     fill: url(#SVGID_192_);
 }

 .st194 {
     fill: url(#SVGID_193_);
 }

 .st195 {
     fill: url(#SVGID_194_);
 }

 .st196 {
     fill: url(#SVGID_195_);
 }

 .st197 {
     fill: url(#SVGID_196_);
 }

 .st198 {
     fill: url(#SVGID_197_);
 }

 .st199 {
     fill: url(#SVGID_198_);
 }

 .st200 {
     fill: url(#SVGID_199_);
 }

 .st201 {
     fill: url(#SVGID_200_);
 }

 .st202 {
     fill: url(#SVGID_201_);
 }

 .st203 {
     fill: url(#SVGID_202_);
 }

 .st204 {
     fill: url(#SVGID_203_);
 }

 .st205 {
     fill: url(#SVGID_204_);
 }

 .st206 {
     fill: url(#SVGID_205_);
 }

 .st207 {
     fill: url(#SVGID_206_);
 }

 .st208 {
     fill: url(#SVGID_207_);
 }

 .st209 {
     fill: url(#SVGID_208_);
 }

 .st210 {
     fill: url(#SVGID_209_);
 }

 .st211 {
     fill: url(#SVGID_210_);
 }

 .st212 {
     fill: url(#SVGID_211_);
 }

 .st213 {
     fill: url(#SVGID_212_);
 }

 .st214 {
     fill: url(#SVGID_213_);
 }