.elementor-9901 .elementor-element.elementor-element-9f72868{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9901 .elementor-element.elementor-element-067113a{width:100%;max-width:100%;}.elementor-9901 .elementor-element.elementor-element-067113a > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}/* Start custom CSS for html, class: .elementor-element-067113a *//* =========================================================
   TOPMETAL – U VISUALIZER (CSS FIX)
   Goals:
   - TRUE 5% margins on 2000px+ (wrap uses 90% width)
   - Premium/Standard show 2 rows (grid) so columns don’t go crazy tall
   - Bottom split: Ultra Premium + Basic side-by-side
   - Preview sticky on desktop
   - No loader overlay
========================================================= */

/* =========================================================
   RESPONSIVE FIX: text NEVER overflows tiles
========================================================= */
@media (max-width: 980px){
  /* Cuando todo cae a 1 columna, el bottom se vuelve un grid de 2 columnas:
     Basic (izq) + Ultra (der) */
  #tmColorUVisualizer .tmU-bottom{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    padding: 12px;
  }

  #tmColorUVisualizer .tmU-bottom .tmU-colHead{
    padding: 14px 14px 10px;
  }

  /* Asegura que cada bloque tenga su “caja” */
  #tmColorUVisualizer .tmU-bottom .tmU-listBottom{
    padding: 10px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(0,0,0,.12);
  }

  /* Si tu Ultra está en #tmUListUltra, le das un contenedor tipo caja */
  #tmColorUVisualizer .tmU-ultraBox{
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(0,0,0,.12);
    overflow: hidden;
  }
}

@media (max-width: 680px){
  /* En teléfonos muy chicos: vuelve a 1 columna */
  #tmColorUVisualizer .tmU-bottom{
    grid-template-columns: 1fr;
  }
}




/* Asegura que el contenido dentro del grid pueda encogerse */
#tmColorUVisualizer .tmU-tile,
#tmColorUVisualizer .tmU-txt,
#tmColorUVisualizer .tmU-meta{
  min-width: 0;
}

/* Por defecto: 1 línea con ellipsis (desktop) */
#tmColorUVisualizer .tmU-name{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* En pantallas pequeñas: permitir 2 líneas y cortar bonito */
@media (max-width: 720px){
  #tmColorUVisualizer .tmU-name{
    white-space: normal;                 /* permite wrap */
    display: -webkit-box;
    -webkit-line-clamp: 2;               /* máximo 2 líneas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.15;
  }

  /* Ajusta tamaños para que no explote */
  #tmColorUVisualizer .tmU-name{ font-size: 12px; }
  #tmColorUVisualizer .tmU-meta{ font-size: 11px; }
  #tmColorUVisualizer .tmU-tag{ font-size: 10px; padding: 5px 8px; }
}
@media (max-width: 720px){
  /* Tiles más compactos */
  #tmColorUVisualizer .tmU-tile{
    grid-template-columns: 56px 1fr;
    gap: 10px;
    padding: 10px;
  }

  #tmColorUVisualizer .tmU-thumb{
    width: 56px;
    height: 44px;
    border-radius: 11px;
  }

  /* Listas: 2 columnas para que no quede una lista infinita */
  #tmColorUVisualizer .tmU-list{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  /* Bottom: también 2 columnas */
  #tmColorUVisualizer .tmU-listBottom{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* =========================
   5% REAL MARGINS (NO BUGS)
   - Always 5vw left/right
   - No overflow from 100vw + scrollbar
========================= */
#tmColorUVisualizer .tmU-wrap{
  max-width: none;                 /* no cap */
  width: calc(100% - 10vw);        /* 100% minus 5vw+5vw */
  margin-left: 5vw;
  margin-right: 5vw;
  position: relative;
  z-index: 1;
}

#tmColorUVisualizer{
  width: 100%;
}



#tmColorUVisualizer{
  --navy:#0b2d5c;
  --navy2:#081f40;
  --ink:#0b1220;
  --white:#ffffff;
  --muted:#7b8798;
  --line:rgba(255,255,255,.14);
  --glass:rgba(255,255,255,.10);
  --glass2:rgba(255,255,255,.06);
  --shadow: 0 28px 70px rgba(0,0,0,.45);
  --shadow2: 0 22px 56px rgba(0,0,0,.35);
  --r24:24px;
  --r20:20px;
  --r16:16px;
  --r14:14px;
  --r12:12px;
  --max:1400px;

  position:relative;
  padding: clamp(56px, 6vw, 92px) 0;
  background: #072C66;

    
  color:var(--white);
  font-family:"Montserrat",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  overflow:hidden;
  isolation:isolate;
}

#tmColorUVisualizer *{ box-sizing:border-box; }
#tmColorUVisualizer a{ color:inherit; text-decoration:none; }
#tmColorUVisualizer button{ font-family:inherit; }

#tmColorUVisualizer .tmU-ambient{ position:absolute; inset:0; z-index:0; pointer-events:none; }
#tmColorUVisualizer .tmU-grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: 56px 56px;
  opacity:.10;
  transform: translateZ(0);
}
#tmColorUVisualizer .tmU-glow{ position:absolute; filter: blur(40px); opacity:.55; }
#tmColorUVisualizer .tmU-g1{ width:520px; height:520px; left:-120px; top:-160px; background:rgba(255,255,255,.14); border-radius:999px; }
#tmColorUVisualizer .tmU-g2{ width:680px; height:680px; right:-240px; top:40px; background:rgba(255,255,255,.10); border-radius:999px; }
#tmColorUVisualizer .tmU-noise{
  position:absolute; inset:0; opacity:.10; mix-blend-mode: overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
}

/* =========================================================
   5% REAL MARGINS
   - On very large screens: width is 90% => 5% left + 5% right
   - Still capped for readability (max)
========================================================= */
/* =========================
   5% REAL MARGINS (NO BUGS)
   - Always 5vw left/right
   - No overflow from 100vw + scrollbar
========================= */
#tmColorUVisualizer .tmU-wrap{
  max-width: none;                 /* no cap */
  width: calc(100% - 10vw);        /* 100% minus 5vw+5vw */
  margin-left: 5vw;
  margin-right: 5vw;
  position: relative;
  z-index: 1;
}

#tmColorUVisualizer{
  width: 100%;
}


/* Head */
#tmColorUVisualizer .tmU-head{ text-align:left; }
#tmColorUVisualizer .tmU-kickerRow{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
#tmColorUVisualizer .tmU-kickerBar{ width:34px; height:2px; background:rgba(255,255,255,.75); border-radius:99px; }
#tmColorUVisualizer .tmU-kicker{ letter-spacing:.18em; font-weight:800; font-size:12px; opacity:.9; }

#tmColorUVisualizer .tmU-title{
  font-family:"Poppins",system-ui,sans-serif;
  font-weight:900;
  line-height:1.05;
  font-size: clamp(30px, 3.2vw, 46px);
  margin:0 0 10px;
}
#tmColorUVisualizer .tmU-titleAccent{
  display:block;
  font-weight:800;
  opacity:.92;
  font-size: clamp(18px, 1.6vw, 22px);
  margin-top:6px;
}
#tmColorUVisualizer .tmU-sub{
  max-width: 82ch;
  margin: 0 0 18px;
  color: rgba(255,255,255,.86);
  font-size: 15px;
  line-height:1.65;
}

/* Buttons (WHITE ONLY) */
#tmColorUVisualizer .tmU-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
#tmColorUVisualizer .tmU-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 12px 16px;
  border-radius: 14px;
  font-family:"Poppins",system-ui,sans-serif;
  font-weight:800;
  letter-spacing:.08em;
  font-size:12px;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.55);
  background: rgba(255,255,255,.92);
  color: #0b2d5c;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  overflow:hidden;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
#tmColorUVisualizer .tmU-btn:hover{ transform: translateY(-1px); box-shadow: 0 24px 55px rgba(0,0,0,.32); }
#tmColorUVisualizer .tmU-btnIcon{ width:18px; height:18px; display:grid; place-items:center; }
#tmColorUVisualizer .tmU-btnIcon svg{ width:18px; height:18px; }
#tmColorUVisualizer .tmU-btnSheen{
  position:absolute; inset:-2px;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.65), transparent 70%);
  transform: translateX(-120%);
  transition: transform .6s ease;
  opacity:.55;
  pointer-events:none;
}
#tmColorUVisualizer .tmU-btn:hover .tmU-btnSheen{ transform: translateX(120%); }
#tmColorUVisualizer .tmU-btnOutline{
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.95);
  border-color: rgba(255,255,255,.42);
  box-shadow: none;
}
#tmColorUVisualizer .tmU-btnOutline:hover{
  background: rgba(255,255,255,.14);
  box-shadow: 0 18px 45px rgba(0,0,0,.28);
}

/* Tools */
#tmColorUVisualizer .tmU-tools{
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top: 10px;
}
#tmColorUVisualizer .tmU-search{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  width: min(720px, 100%);
}
#tmColorUVisualizer .tmU-searchIcon{ width:18px; height:18px; opacity:.9; }
#tmColorUVisualizer #tmUQuery{
  flex:1;
  background: transparent;
  border:0;
  outline:none;
  color: rgba(255,255,255,.95);
  font-size: 14px;
  font-family:"Montserrat",system-ui,sans-serif;
}
#tmColorUVisualizer #tmUQuery::placeholder{ color: rgba(255,255,255,.65); }
#tmColorUVisualizer .tmU-clear{
  background: rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.92);
  padding: 8px 10px;
  border-radius: 12px;
  font-weight:700;
  cursor:pointer;
  transition: background .2s ease, transform .2s ease;
}
#tmColorUVisualizer .tmU-clear:hover{ background: rgba(255,255,255,.18); transform: translateY(-1px); }

#tmColorUVisualizer .tmU-filter{ display:flex; gap:10px; flex-wrap:wrap; }
#tmColorUVisualizer .tmU-chip{
  padding: 9px 12px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.24);
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.92);
  font-weight:800;
  font-size: 12px;
  letter-spacing:.06em;
  cursor:pointer;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
#tmColorUVisualizer .tmU-chip:hover{ transform: translateY(-1px); background: rgba(255,255,255,.12); }
#tmColorUVisualizer .tmU-chip.is-on{
  background: rgba(255,255,255,.92);
  color: #0b2d5c;
  border-color: rgba(255,255,255,.65);
}

/* Divider */
#tmColorUVisualizer .tmU-divider{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  margin: 22px 0 26px;
}

/* =========================================================
   U GRID (top row)
   - Reduce center width a bit to avoid pushing down
========================================================= */
#tmColorUVisualizer .tmU-gridU{
  display:grid;
  grid-template-columns: 1fr minmax(340px, 500px) 1fr;
  gap: 16px;
  align-items:start;
}

/* Columns */
#tmColorUVisualizer .tmU-col{
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius: var(--r24);
  box-shadow: var(--shadow);
  overflow:hidden;
}

/* Column head */
#tmColorUVisualizer .tmU-colHead{
  padding: 16px 16px 12px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
#tmColorUVisualizer .tmU-colHeadBottom{
  padding: 16px 16px 12px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
#tmColorUVisualizer .tmU-colTitle{
  font-family:"Poppins",system-ui,sans-serif;
  font-weight:900;
  font-size: 16px;
  letter-spacing:.02em;
}
#tmColorUVisualizer .tmU-colSub{
  color: rgba(255,255,255,.78);
  font-size: 12px;
  margin-top:4px;
  line-height:1.4;
}

/* Lists base */
#tmColorUVisualizer .tmU-list{
  padding: 12px;
  display:grid;
  gap:10px;
}

/* Two rows on sides (THIS is the fix) */
#tmColorUVisualizer .tmU-list2Rows{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

/* Tile */
#tmColorUVisualizer .tmU-tile{
  display:grid;
  grid-template-columns: 64px 1fr;
  gap: 12px;
  align-items:center;
  padding: 10px 10px;
  border-radius: 16px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.16);
  cursor:pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
  text-align:left;
  width:100%;
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}
#tmColorUVisualizer .tmU-tile:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.24);
  background: rgba(0,0,0,.22);
  box-shadow: 0 14px 34px rgba(0,0,0,.28);
}
#tmColorUVisualizer .tmU-tile:focus{
  outline: 2px solid rgba(255,255,255,.55);
  outline-offset: 2px;
}
#tmColorUVisualizer .tmU-thumb{
  width:64px; height:48px;
  border-radius: 12px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  position:relative;
  box-shadow: 0 10px 22px rgba(0,0,0,.25);
}
#tmColorUVisualizer .tmU-thumb img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.02);
}
#tmColorUVisualizer .tmU-txt{ min-width:0; }
#tmColorUVisualizer .tmU-name{
  font-weight:900;
  font-size: 13px;
  line-height:1.15;
  letter-spacing:.01em;
  color: rgba(255,255,255,.95);
  font-family:"Poppins",system-ui,sans-serif;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#tmColorUVisualizer .tmU-meta{
  margin-top:6px;
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  color: rgba(255,255,255,.78);
  font-size: 12px;
}
#tmColorUVisualizer .tmU-tag{
  padding: 6px 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  font-weight:800;
  letter-spacing:.06em;
  font-size: 11px;
}
#tmColorUVisualizer .tmU-code{
  opacity:.9;
  font-weight:700;
  font-size: 11px;
  letter-spacing:.08em;
}
#tmColorUVisualizer .tmU-tile.is-selected{
  border-color: rgba(255,255,255,.60);
  background: rgba(255,255,255,.10);
  box-shadow: 0 18px 42px rgba(0,0,0,.34);
}

/* Ultra premium special styling */
#tmColorUVisualizer .tmU-tile.is-ultra{
  border-color: rgba(255,255,255,.22);
  background:
    radial-gradient(120px 60px at 20% 20%, rgba(255,255,255,.10), transparent 70%),
    linear-gradient(180deg, rgba(0,0,0,.24), rgba(0,0,0,.12));
}
#tmColorUVisualizer .tmU-tile.is-ultra .tmU-tag{
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.22);
}

/* Center preview + sticky */
#tmColorUVisualizer .tmU-center{ align-self:stretch; }
#tmColorUVisualizer .tmU-previewCard{
  border-radius: var(--r24);
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: var(--shadow);
  overflow:hidden;
  min-height: 520px;
  display:flex;
  flex-direction:column;
  position: sticky;
  top: 18px;
}
#tmColorUVisualizer .tmU-previewTop{
  padding: 16px 16px 12px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  border-bottom: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
#tmColorUVisualizer .tmU-selectedLabel{
  font-size:12px;
  color: rgba(255,255,255,.74);
  font-weight:700;
}
#tmColorUVisualizer .tmU-selectedName{
  font-family:"Poppins",system-ui,sans-serif;
  font-weight:900;
  font-size: 18px;
  margin-top:2px;
  letter-spacing:.01em;
}
#tmColorUVisualizer .tmU-selectedMeta{
  display:flex; gap:8px; flex-wrap:wrap;
  margin-top:8px;
}
#tmColorUVisualizer .tmU-pillTier,
#tmColorUVisualizer .tmU-pillCode{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.20);
  font-weight:800;
  letter-spacing:.06em;
  font-size: 11px;
  color: rgba(255,255,255,.92);
}
#tmColorUVisualizer .tmU-badge{
  display:flex; align-items:center; gap:8px;
  padding: 8px 10px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(0,0,0,.16);
  color: rgba(255,255,255,.84);
  font-size: 12px;
  font-weight:800;
  white-space:nowrap;
}
#tmColorUVisualizer .tmU-badgeDot{
  width:8px; height:8px; border-radius:999px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 0 0 6px rgba(255,255,255,.08);
}

#tmColorUVisualizer .tmU-previewMedia{
  position:relative;
  padding: 14px;
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(0,0,0,.18);
}
#tmColorUVisualizer .tmU-previewMedia img{
  width:100%;
  height:auto;
  max-height: 430px;
  object-fit:contain;
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
  transform: translateZ(0);
  transition: transform .24s ease, filter .24s ease, opacity .18s ease;
}
#tmColorUVisualizer .tmU-previewMedia img.is-swap{
  opacity: .75;
  transform: scale(.992);
  filter: saturate(1.03) contrast(1.02);
}
#tmColorUVisualizer .tmU-previewOverlay{
  position:absolute; inset:0;
  background:
    radial-gradient(600px 300px at 50% 20%, rgba(255,255,255,.08), transparent 60%),
    radial-gradient(700px 360px at 50% 120%, rgba(255,255,255,.06), transparent 65%);
  pointer-events:none;
}

#tmColorUVisualizer .tmU-previewFoot{
  padding: 14px 16px 16px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  border-top: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
#tmColorUVisualizer .tmU-footBox{
  border:1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.14);
  border-radius: 16px;
  padding: 12px 12px;
  min-height: 60px;
}
#tmColorUVisualizer .tmU-footKey{
  font-weight:900;
  font-size: 12px;
  letter-spacing:.08em;
  opacity:.9;
  font-family:"Poppins",system-ui,sans-serif;
}
#tmColorUVisualizer .tmU-footVal{
  margin-top:6px;
  font-size: 12px;
  color: rgba(255,255,255,.82);
  line-height:1.45;
}

/* =========================================================
   BOTTOM ROW (Ultra + Basic side-by-side)
========================================================= */
#tmColorUVisualizer .tmU-bottomRow{
  grid-column: 1 / -1;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items:stretch;
}
#tmColorUVisualizer .tmU-bottomCol{
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius: var(--r24);
  box-shadow: var(--shadow);
  overflow:hidden;
}
#tmColorUVisualizer .tmU-listBottom{
  padding: 12px;
  display:grid;
  gap:10px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
#tmColorUVisualizer .tmU-listBottomTight .tmU-tile{
  grid-template-columns: 58px 1fr;
}
#tmColorUVisualizer .tmU-listBottomTight .tmU-thumb{
  width:58px; height:44px;
}

/* Tooltip */
#tmColorUVisualizer .tmU-tip{
  position:fixed;
  left:0; top:0;
  transform: translate(-9999px, -9999px);
  background: rgba(10,12,18,.92);
  border:1px solid rgba(255,255,255,.16);
  border-radius: 14px;
  padding: 10px 12px;
  box-shadow: 0 24px 60px rgba(0,0,0,.55);
  z-index:9999;
  pointer-events:none;
  min-width: 180px;
}
#tmColorUVisualizer .tmU-tipName{
  font-family:"Poppins",system-ui,sans-serif;
  font-weight:900;
  font-size: 13px;
  color: rgba(255,255,255,.96);
  margin-bottom:6px;
}
#tmColorUVisualizer .tmU-tipMeta{
  display:flex;
  gap:8px;
  color: rgba(255,255,255,.78);
  font-weight:800;
  font-size: 11px;
  letter-spacing:.06em;
}

/* Responsive */
@media (max-width: 1100px){
  #tmColorUVisualizer .tmU-wrap{ width: 92%; }
  #tmColorUVisualizer .tmU-gridU{ grid-template-columns: 1fr; }
  #tmColorUVisualizer .tmU-previewCard{ position: relative; top:auto; }
  #tmColorUVisualizer .tmU-list2Rows{ grid-template-columns: 1fr; }
  #tmColorUVisualizer .tmU-bottomRow{ grid-template-columns: 1fr; }
  #tmColorUVisualizer .tmU-previewFoot{ grid-template-columns: 1fr; }
}

@media (max-width: 520px){
  #tmColorUVisualizer .tmU-listBottom{ grid-template-columns: 1fr; }
}/* End custom CSS */