/* archive.css — skin for the archived Discourse crawler pages.
 *
 * Discourse's own stylesheets ship with these pages but target the Ember app's DOM, which the
 * crawler view never emits — so almost none of it lands and the pages render as bare serif. This
 * styles the markup the crawler view DOES produce (header, .category-list, .topic-list,
 * #topic-title, .crawler-post, .crawler-post-infos, .creator) and nothing else.
 *
 * DIRECTION — taken from the logo, not from a theme.
 * The Europe Comedy mark is a laughing microphone drawn as pop-art: a halftone dot field for the
 * mic head, heavy black keylines, flat greys, white teeth, one hot red tongue. So the archive is
 * built as cheap comic printing: dot screens, hard rules, and a red plate that sits very slightly
 * out of register with the black. Every colour below is lifted from that image. The misregistered
 * red is the signature and it appears in exactly three places — the wordmark, the logo tile, and
 * the focus ring — so it stays a decision rather than a texture.
 *
 * The masthead has two states, keyed off real structure rather than a body class: Discourse only
 * prints the tagline <p> on the front page, so `header:has(p)` is the front page and gets the full
 * treatment, while every topic and category page gets the compact bar. A reader arriving from a
 * search result came for one gig listing, not for our logo.
 */

@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 800;font-display:swap;src:url('/fonts/bricolage-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 800;font-display:swap;src:url('/fonts/bricolage-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('/fonts/instrument-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('/fonts/instrument-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/spacemono-latin-ext-400.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/spacemono-latin-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/spacemono-latin-ext-700.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/spacemono-latin-700.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{
  /* straight off the mark: its black ground, its halftone grey, its teeth, its tongue */
  --ink:#0B0B0B;
  --panel:#141414;
  --panel-lift:#1A1A1A;
  --rule:#282828;
  --keyline:#000;
  --halftone:#8C8C8C;
  --paper:#F2F0EC;
  --dim:#918C86;
  --red:#CF1F27;
  --red-lift:#E8323A;

  --display:'Bricolage Grotesque',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --body:'Instrument Sans',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:'Space Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* the mic head, as a tileable screen */
  --dots:radial-gradient(circle at center,rgba(255,255,255,.17) 1.05px,transparent 1.15px);
  --dots-size:9px 9px;

  --measure:40rem;   /* ~72 characters at the body size — set in rem, not ch, because three
                        different faces are in play and ch would mean three different measures */
  --gutter:1.5rem;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--ink) !important;
  color:var(--paper) !important;
  font-family:var(--body) !important;
  font-size:1.0625rem;
  line-height:1.65;
  font-synthesis-weight:none;
  -webkit-font-smoothing:antialiased;
}

/* ─── masthead ────────────────────────────────────────────────────────────────────────────────
   The logo tile is the crawled site icon, reused rather than redrawn. Its own background is
   already black, so it sits on the page ground with no cutout needed — a keyline and an offset
   red plate behind it do the rest. */
/* body.crawler qualifies these: Discourse's own stylesheets are still linked on every archived
   page and reach header with .crawler-level specificity, which a bare `header` loses to. */
body.crawler header{
  position:relative;
  border-bottom:1px solid var(--rule);
  background:var(--keyline);
  /* Align the masthead to the same column as the content. Full-bleed ground, but the wordmark
     starts exactly where the board below it starts, or the two read as unrelated pages. */
  padding-inline:max(var(--gutter),calc((100% - 56rem) / 2));
}
header > a[href="/"]{
  position:relative;
  z-index:1;
  display:inline-block;
  font-family:var(--display);
  color:var(--paper) !important;
  text-decoration:none !important;
  text-transform:uppercase;
}
header > a[href="/"]::before{
  content:"";
  background:url('/uploads/default/optimized/1X/aed5c16c88db24564828bd2e56066d61623dadd8_2_180x180.jpeg') center/cover no-repeat;
  /* No keyline, no offset plate. The mark already carries its own black ground, and giving it a
     red shadow too put the signature in two places at once — which made it read as a rendering
     fault rather than a decision. The wordmark keeps it; the mark sits clean. */
}

/* front page — the only page that prints a tagline */
header:has(p){ padding-block:clamp(2.75rem,7vw,4.5rem) clamp(2rem,4vw,3rem); overflow:hidden; }
header:has(p)::before{                       /* the dot screen, fading into the dark */
  content:"";
  position:absolute; inset:0;
  background-image:var(--dots);
  background-size:var(--dots-size);
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,transparent 82%);
  mask-image:linear-gradient(to bottom,#000 0%,transparent 82%);
  animation:screen-in .9s ease-out both;
}
header:has(p) > a[href="/"]{
  font-size:clamp(2.4rem,8.5vw,5rem);
  font-weight:800;
  letter-spacing:-.045em;
  line-height:.9;
  /* The red plate, a hair out of register. Small on purpose — push it further and it stops
     reading as a printing fault and starts reading as a drop shadow. */
  text-shadow:.018em .022em 0 var(--red);
}
header:has(p) > a[href="/"]::before{
  display:block;
  width:clamp(56px,9vw,78px);
  height:clamp(56px,9vw,78px);
  margin-bottom:1.15rem;
}
header:has(p) p{
  position:relative; z-index:1;
  max-width:44ch;
  margin:1.1rem 0 0;
  color:var(--dim);
  font-size:1.0625rem;
  line-height:1.5;
  text-wrap:pretty;
}

/* every other page — a bar, deliberately quiet */
header:not(:has(p)){ padding-block:.85rem; }
header:not(:has(p)) > a[href="/"]{
  font-size:1.0625rem;
  font-weight:700;
  letter-spacing:-.01em;
}
header:not(:has(p)) > a[href="/"]::before{
  display:inline-block;
  width:30px; height:30px;
  vertical-align:-.62em;
  margin-right:.6rem;
}
header:not(:has(p)) > a[href="/"]:hover{ color:var(--red-lift) !important; }

/* ─── shell ──────────────────────────────────────────────────────────────────────────────── */
#main-outlet,.container.wrap{
  max-width:56rem;
  margin:0 auto;
  padding:2.5rem var(--gutter) 4rem;
}

a{ color:var(--paper); text-decoration-color:var(--red); text-underline-offset:3px; }
a:hover{ color:var(--red-lift); }
a:focus-visible{ outline:2px solid var(--red); outline-offset:3px; border-radius:1px; }

/* Discourse's static pages (/faq, /guidelines, /tos, /privacy) wrap each heading in an anchor, so
   without this every heading arrives underlined and reads as a link to somewhere else. */
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{ text-decoration:none; }

/* Those same pages put their prose straight into #main-outlet rather than into .post, so nothing
   was holding the line length — they ran the full 56rem. */
#main-outlet > p,#main-outlet > ul,#main-outlet > ol,
#main-outlet > div:not([class]) > p,#main-outlet > div:not([class]) > ul{ max-width:var(--measure); }

/* ─── the bill: front-page category board ─────────────────────────────────────────────────────
   Kept as a table on purpose. "Category | Topics" is genuinely tabular, a club bill is a table,
   and switching display to grid would strip the row/cell semantics assistive tech relies on. */
table.category-list,table.topic-list{
  width:100%;
  border-collapse:collapse;
  margin:0;
}
table.category-list thead th,table.topic-list thead th{
  font-family:var(--mono);
  font-size:.66rem;
  font-weight:400;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--dim);
  text-align:left;
  padding:0 .55rem .7rem;
  border-bottom:1px solid var(--rule);
}
table.category-list thead th.topics,table.topic-list thead th:not(:first-child){ text-align:right; }

table.category-list td{
  padding:1.05rem .55rem;
  vertical-align:baseline;
  border-bottom:1px solid var(--rule);
  /* Discourse prints border-color inline on these cells and its own stylesheet hangs a fat
     border-left off it, so the board grew a blue stripe down one side. The colour is real data
     but it is the Discourse default on 35 of 43 categories — nearly no information, all noise. */
  border-left:0 !important;
  border-bottom-color:var(--rule) !important;
  transition:background-color .15s ease;
}
table.category-list td.category h3{
  margin:0;
  font-family:var(--display);
  font-size:clamp(1.15rem,2.6vw,1.55rem);
  font-weight:700;
  letter-spacing:-.022em;
  line-height:1.15;
}
table.category-list td.category h3 a{ color:var(--paper) !important; text-decoration:none !important; }
table.category-list td.category div[itemprop='description']{
  margin-top:.35rem;
  max-width:54ch;
  font-size:.9375rem;
  line-height:1.5;
  color:var(--dim);
}
table.category-list td.category div[itemprop='description']:empty{ display:none; }

table.category-list td.topics{
  width:1%;
  white-space:nowrap;
  text-align:right;
  font-family:var(--mono);
  font-size:1.15rem;
  color:var(--paper);
  font-variant-numeric:tabular-nums;
}
table.category-list tbody tr:hover td{ background:rgba(255,255,255,.04); }
table.category-list tbody tr:hover td.category h3 a{ color:var(--red-lift) !important; }

/* A category with nothing in it says so by receding. Most of this board is empty, and pretending
   otherwise would make the reader hunt through 40 rows for the nine that have anything. */
table.category-list tbody tr:has(td.topics div[title^='0 ']) td{ opacity:.4; }
table.category-list tbody tr:has(td.topics div[title^='0 ']):hover td{ opacity:.72; }

/* ─── topic listings (category pages, /latest, /top) ─────────────────────────────────────── */
table.topic-list td{
  padding:.85rem .55rem;
  border-bottom:1px solid var(--rule);
  vertical-align:baseline;
}
table.topic-list td:not(:first-child){
  text-align:right;
  font-family:var(--mono);
  font-size:.86rem;
  color:var(--dim);
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
table.topic-list td.main-link a.title{
  font-family:var(--display);
  font-size:1.0625rem;
  font-weight:600;
  letter-spacing:-.012em;
  color:var(--paper) !important;
  text-decoration:none !important;
}
table.topic-list tbody tr:hover td{ background:rgba(255,255,255,.04); }
table.topic-list tbody tr:hover td.main-link a.title{ color:var(--red-lift) !important; }

/* Poster avatars. Comedy Podcasts is 1,284 rows posted by one account, so at full size this
   column was 1,284 copies of the same picture. Small enough to answer "who", quiet enough to
   stop competing with the titles. */
table.topic-list td.posters{ width:1%; padding-right:1.25rem; }
table.topic-list td.posters img.avatar{
  width:20px; height:20px;
  border:0; border-radius:50%;
  display:block;
  opacity:.75;
}
table.topic-list tbody tr:hover td.posters img.avatar{ opacity:1; }

/* Tags. These must out-specify the title rule above, which was claiming them and setting them in
   the display face at title size — louder than the titles they hang under. */
table.topic-list .link-bottom-line{ margin-top:.25rem; }
table.topic-list td .discourse-tags a{
  font-family:var(--mono) !important;
  font-size:.65rem !important;
  font-weight:400 !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6E6A66 !important;
  text-decoration:none !important;
}
table.topic-list td .discourse-tags a:hover{ color:var(--red-lift) !important; }
/* an empty tag div still occupies a line, which staggers every untagged row */
table.topic-list .discourse-tags:not(:has(a)){ display:none; }
table.topic-list td.replies,table.topic-list td.views{ width:1%; }

/* ─── headings ───────────────────────────────────────────────────────────────────────────── */
h1,#topic-title h1{
  font-family:var(--display);
  font-size:clamp(1.75rem,4.2vw,2.6rem);
  font-weight:800;
  letter-spacing:-.032em;
  line-height:1.1;
  margin:0 0 .5rem;
  text-wrap:balance;
}
h1 a,#topic-title h1 a{ color:var(--paper) !important; text-decoration:none !important; }
h1 a:hover,#topic-title h1 a:hover{ color:var(--red-lift) !important; }
#topic-title{ margin-bottom:.9rem; }

/* breadcrumb chips — the category path, set as a run of small caps rather than a pill */
.topic-category{ margin:0; font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }
.topic-category a{ color:var(--dim) !important; text-decoration:none !important; }
.topic-category a:hover{ color:var(--red-lift) !important; }
/* Separator between crumbs. Each .badge-wrapper lives in its own itemListElement span, so they
   are never adjacent siblings — the separator has to hang off the spans, not the badges. */
.topic-category span[itemprop='itemListElement'] + span[itemprop='itemListElement']::before{
  content:"/";
  margin:0 .45em;
  color:#4A4A4A;
}
.badge-wrapper.bullet .badge-category-bg,.badge-wrapper .badge-category-parent-bg{ display:none; }

/* tags, folded up under the breadcrumb rather than left floating on their own line */
.discourse-tags{
  margin:.5rem 0 0;
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.discourse-tags a{ color:#6E6A66 !important; text-decoration:none !important; }
.discourse-tags a::before{ content:"#"; opacity:.55; }
.discourse-tags a:hover{ color:var(--red-lift) !important; }

/* ─── posts ───────────────────────────────────────────────────────────────────────────────────
   Reply order is real information — it is the thread — so posts carry their number. Discourse
   already prints it as <span itemprop='position'>, so that is what gets styled. An earlier pass
   generated the number with a CSS counter instead and put two of them on every post: one real and
   in the schema, one invented and invisible to anything but a browser. */
.crawler-post{
  background:var(--panel);
  border:1px solid var(--rule);
  padding:1.4rem 1.5rem;
  margin:0 0 .85rem;
}
.crawler-post:first-of-type{ margin-top:2rem; }
.crawler-post:first-of-type{ background:var(--panel-lift); border-color:#333; }

/* the byline row: who, then when and which reply, pushed to the far edge */
.crawler-post-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:.5rem .9rem;
  padding-bottom:.8rem;
  margin-bottom:1.1rem;
  border-bottom:1px solid var(--rule);
}
.creator{ margin-right:auto; }
.crawler-post-infos{
  display:flex;
  flex-wrap:wrap;      /* without this the row cannot shrink and pushes the panel past the viewport */
  align-items:baseline;
  gap:.9rem;
  font-family:var(--mono);
  font-size:.74rem;
  letter-spacing:.03em;
  color:var(--dim);
}
.crawler-post-infos span[itemprop='position']{ color:#6E6A66; }
.crawler-post-infos span[itemprop='position']::before{ content:"#"; opacity:.55; }
.creator a,.creator b{
  font-family:var(--body);
  font-size:.9375rem;
  letter-spacing:0;
  font-weight:700;
  color:var(--paper) !important;
  text-decoration:none !important;
}
.creator a:hover{ color:var(--red-lift) !important; }
.crawler-post-infos time{ color:var(--dim); }

/* post body */
.post{ max-width:var(--measure); overflow-wrap:break-word; }
.post p,.post ul,.post ol{ margin:0 0 1rem; }
.post ul,.post ol{ padding-left:1.25rem; }
.post li{ margin:.35rem 0; }
.post a{ color:var(--paper); text-decoration:underline; text-decoration-color:var(--red); text-decoration-thickness:1px; }
.post a:hover{ color:var(--red-lift); text-decoration-thickness:2px; }
.post img{ max-width:100%; height:auto; border:1px solid var(--rule); }
.post img.emoji{ width:1.2em; height:1.2em; border:0; display:inline-block; vertical-align:-.2em; }
.post h1,.post h2,.post h3,.post h4{ font-family:var(--display); letter-spacing:-.02em; margin:1.6rem 0 .6rem; line-height:1.2; }
.post h1{ font-size:1.5rem; } .post h2{ font-size:1.3rem; } .post h3{ font-size:1.15rem; } .post h4{ font-size:1rem; }
.post blockquote{
  margin:0 0 1rem;
  padding:.7rem 1.1rem;
  border-left:3px solid var(--red);
  background:rgba(255,255,255,.03);
  color:#CDC9C4;
}
.post pre,.post code{ font-family:var(--mono); background:#070707; border:1px solid var(--rule); font-size:.86em; }
.post pre{ padding:1rem; overflow-x:auto; }
.post code{ padding:.12em .38em; }
.post pre code{ border:0; padding:0; background:none; }
.post table{ width:100%; border-collapse:collapse; margin:0 0 1rem; display:block; overflow-x:auto; }
.post th,.post td{ border:1px solid var(--rule); padding:.5rem .65rem; text-align:left; }
.post hr{ border:0; border-top:1px solid var(--rule); margin:1.5rem 0; }

/* Link previews Discourse expanded inline. These appear on 3,120 pages — 46% of the archive —
   so they are a main surface, not an edge case: most listings link out to a ticket page. */
aside.onebox{
  border:1px solid var(--rule);
  border-left:3px solid var(--red);
  background:var(--ink);
  padding:1rem 1.15rem;
  margin:0 0 1rem;
  font-size:.9375rem;
}
aside.onebox header.source{
  display:flex;
  align-items:center;
  gap:.5rem;
  background:none;
  border:0;
  padding:0;
  margin:0 0 .55rem;
}
aside.onebox header.source img.site-icon{ width:14px; height:14px; border:0; flex:none; }
aside.onebox header.source a{
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--dim) !important;
  text-decoration:none !important;
}
aside.onebox .onebox-body{ margin:0; }
aside.onebox .onebox-body h3{
  font-family:var(--display);
  font-size:1.05rem;
  font-weight:700;
  letter-spacing:-.015em;
  margin:0 0 .3rem;
  line-height:1.25;
}
aside.onebox .onebox-body h3 a{ color:var(--paper); text-decoration:none; }
aside.onebox .onebox-body h3 a:hover{ color:var(--red-lift); }
aside.onebox .onebox-body p{ margin:0; color:var(--dim); font-size:.9rem; line-height:1.5; }
aside.onebox .onebox-body img{ max-width:100%; height:auto; }
aside.onebox .onebox-metadata:empty{ display:none; }

/* ─── footer ─────────────────────────────────────────────────────────────────────────────── */
body > footer,.crawler footer{
  max-width:56rem;
  margin:0 auto;
  padding:2rem var(--gutter) 3.5rem;
  border-top:1px solid var(--rule);
  color:var(--dim);
  font-size:.875rem;
}
footer nav.crawler-nav ul{ display:flex; flex-wrap:wrap; gap:0 1.4rem; list-style:none; margin:0 0 1.1rem; padding:0; }
footer nav.crawler-nav a{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--dim) !important;
  text-decoration:none !important;
}
footer nav.crawler-nav a:hover{ color:var(--red-lift) !important; }
footer .powered-by-link{ font-size:.8125rem; color:#6E6A66; margin:0; }
footer .powered-by-link a{ color:#6E6A66; }

/* The archive notice. It was a warning strip across the top of all 6,790 pages; a reader who
   arrived for one gig listing does not need to be stopped at the door and told the building is
   shut. It says the same thing, once, at the end. */
.archive-note{
  margin:0 0 1.1rem;
  padding-left:.85rem;
  border-left:2px solid var(--red);
  font-size:.875rem;
  line-height:1.55;
  color:var(--dim);
  max-width:60ch;
}
.archive-note strong{ color:var(--paper); font-weight:600; }

@keyframes screen-in{ from{ opacity:0; } to{ opacity:1; } }

@media (max-width:640px){
  body{ font-size:1rem; }
  #main-outlet,.container.wrap{ padding:1.75rem 1.1rem 3rem; }
  .crawler-post{ padding:1.1rem; }
  /* stack the byline: at this width "who" and "when + which reply" will not sit on one line */
  .crawler-post-meta{ gap:.3rem .8rem; }
  .creator{ margin-right:0; flex-basis:100%; }
  .crawler-post::after{ top:1.05rem; right:1.05rem; }
  table.category-list td{ padding:.85rem .4rem; }
  table.category-list td.category div[itemprop='description']{ font-size:.875rem; }
  body.crawler header{ padding-inline:1.1rem; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}