/* 1. Layout */

html {
  width: 100%;
  height: 100%;
}
body { 
  margin: 0; 
  overflow-y: scroll; 
  overflow-x: hidden;
  height: 100dvh;
  width: 100dvw;
  background: rgb(26,56,64);
  background: linear-gradient(141deg, rgba(26,56,64,1) 0%, rgba(93,75,155,1) 100%); 
  background-size: cover;
  background-repeat: no-repeat;
  line-height: 1.5em; 
  font-family: 'Roboto', sans-serif;
}

#root {
  height: 100%;
  background: rgb(26,56,64);
  background: linear-gradient(141deg, rgba(26,56,64,1) 0%, rgba(93,75,155,1) 100%); 
  background-size: cover;
  background-repeat: no-repeat;
}

h1, h2, h3, h4, h5, h6 { text-align: center; color: #fff; word-wrap: break-word; }

error { display: inline-block; box-sizing: border-box; width: 100%; max-width: 650px; position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: 0; text-align: center;  color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
error p { color: #721c24; }
error .pagination {
  color: #eee;
  font-weight: bolder;
  background-color: #1a3840;
  font-size: large;
}
error#sidebar-error {
  padding: 2px;
}

.react-expand-collapse__content {
    position: relative;
    overflow: hidden;
}

.react-expand-collapse__body {
    display: inline;
}

ul#pagination {
  display: flex;
  justify-content: center;
  padding-left: 15px;
  padding-right: 15px;
  color: #eee;
}

.side_column ul#pagination {
  display: flex;
  flex-wrap: wrap;
}

#pagination li {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
  color: #eee;
}

.side_column #pagination span {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

#pagination a {
  color: #eee
}

.deletedPrompt {
  margin: -20px;
}

.react-expand-collapse__button {
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: #fff;
    cursor:pointer;
    -webkit-rap-highlight-color: transparent;
}

.react-expand-collapse__button:before {
    content: '';
    position: absolute;
    top:0;
    left: -20px;
    width: 20px;
    height: 100%;
    background: linear-gradient(to right, transparent 0, #fff 100%);
}

img {
    max-width: 100%;
    width: auto;
    
}


.colourCover {
    position: fixed;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
}

.colourPopover {
    position: absolute;
    z-index: 2;
}

.colourPicker {
    width: 36px;
    height: 14px;
    border-radius: 2px;
}

pre {
    border: 1px solid #aaa;
    background-color: #ccc;

}

blockquote {
    border-left: 3px solid; 
}
.message {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.blockquote p {
    padding: 1rem;
}

.colourSwatch {
    padding: 5px;
    background: #ffffff;
    border-radius: 1px;
    box-shadow: 0 0 0 1px rgba(0,0,0,.1);
    display: inline-block;
    cursor: pointer;
}

.bg-info {
    background-color: #17a2b8 !important;
}

.progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #ddd;

    transition: width .6s ease;
  }

.progress {
    display: flex;
    overflow: hidden;
    background-color: #ddd;

}

/* 1.0 Fonts */
.font-balsamiq {
  font-family: 'Balsamiq Sans', cursive;
}

.font-londrina {
  font-family: 'Londrina Solid', cursive;
}

.font-dohyeon {
  font-family: 'Do Hyeon', sans-serif;
}

.font-firasans {
  font-family: 'Fira Sans', sans-serif;
}

.font-russo {
  font-family: 'Russo One', sans-serif;
}

.font-serrat {
  font-family: 'Montserrat', sans-serif;
}

/* 1.1. Header */

header { 
  background: rgb(78,168,192);
  background: linear-gradient(141deg, rgba(78,168,192,1) 0%, rgba(160,136,210,1) 100%);
  color: #fff;
}
header h1 { margin: 0; padding: 10px; width: 100%; }
header a, header img { display: block; margin: 0 auto; }
header a { 
  max-width: 565px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 16px;
}
header .vertical-arrow {
  display: none;
  rotate: 90deg;
}
header .horizontal-arrow {
  display: inline-block;
}
header img { max-width: 100%; max-height: 51px; }

footer { display: relative; left: 0; bottom: 0; width: 100%; height:50px; text-align: center;
}
/* 1.2. Navigation */

#nav { 
  background: rgb(52,112,128);
  background: linear-gradient(141deg, rgba(52,112,128,1) 0%, rgba(186,170,238,1) 100%);
  color: #fff; 
  text-align: center; 
  position: -webkit-sticky; 
  position: sticky; 
  top: 0; 
  right: 0; 
  left: 0; 
  z-index: 4; 
  border-radius: 0px 0px 10px 10px; 
  padding: 5px 0px; 
}
#nav ul { margin: 0; padding: 0; list-style-type: none; }
#nav li { display: inline-block; }
@media (min-width: 641px) {
  #nav li:not(:last-child):after { content: " · "; }
}
@media (max-width: 640px) {
  #nav li:not(:last-child):after { content: " "; }
}
#nav a { display: inline-block; line-height: 30px; color: #fff; border-radius: 10px; padding: 0px 5px; text-decoration: none; background-color: #1a3840; }
#nav a:hover { background-color: #448090;  text-shadow: 0 1px 1px rgba(255,255,255,0.3), 0 -1px 1px rgba(255,255,255,0.3), 1px 0 1px rgba(255,255,255,0.3), -1px 0 1px rgba(255,255,255,0.3) }
#nav button { text-decoration: none; display: inline-block; margin: 0; padding: 0; border: 0; background: none; height: 30px; font: inherit; color: #fff; cursor: pointer; }

@media (max-width: 640px) {
    #nav a, #nav button { position: relative; width: 40px; background-position: center; background-repeat: no-repeat; background-size: 30px; text-indent: -9000px; }
    #nav a { line-height: 40px; padding: 0px;}
    #nav button { height: 40px; }

    a#nav_home { background-size: 32px; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xNDcyIDk5MnY0ODBxMCAyNi0xOSA0NXQtNDUgMTloLTM4NHYtMzg0aC0yNTZ2Mzg0aC0zODRxLTI2IDAtNDUtMTl0LTE5LTQ1di00ODBxMC0xIC41LTN0LjUtM2w1NzUtNDc0IDU3NSA0NzRxMSAyIDEgNnptMjIzLTY5bC02MiA3NHEtOCA5LTIxIDExaC0zcS0xMyAwLTIxLTdsLTY5Mi01NzctNjkyIDU3N3EtMTIgOC0yNCA3LTEzLTItMjEtMTFsLTYyLTc0cS04LTEwLTctMjMuNXQxMS0yMS41bDcxOS01OTlxMzItMjYgNzYtMjZ0NzYgMjZsMjQ0IDIwNHYtMTk1cTAtMTQgOS0yM3QyMy05aDE5MnExNCAwIDIzIDl0OSAyM3Y0MDhsMjE5IDE4MnExMCA4IDExIDIxLjV0LTcgMjMuNXoiIGZpbGw9IiNmZmYiLz48L3N2Zz4='); }
    a#nav_prompt_list { background-position: 8px 6px; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik04ODggMTE4NGwxMTYtMTE2LTE1Mi0xNTItMTE2IDExNnY1Nmg5NnY5Nmg1NnptNDQwLTcyMHEtMTYtMTYtMzMgMWwtMzUwIDM1MHEtMTcgMTctMSAzM3QzMy0xbDM1MC0zNTBxMTctMTcgMS0zM3ptODAgNTk0djE5MHEwIDExOS04NC41IDIwMy41dC0yMDMuNSA4NC41aC04MzJxLTExOSAwLTIwMy41LTg0LjV0LTg0LjUtMjAzLjV2LTgzMnEwLTExOSA4NC41LTIwMy41dDIwMy41LTg0LjVoODMycTYzIDAgMTE3IDI1IDE1IDcgMTggMjMgMyAxNy05IDI5bC00OSA0OXEtMTQgMTQtMzIgOC0yMy02LTQ1LTZoLTgzMnEtNjYgMC0xMTMgNDd0LTQ3IDExM3Y4MzJxMCA2NiA0NyAxMTN0MTEzIDQ3aDgzMnE2NiAwIDExMy00N3Q0Ny0xMTN2LTEyNnEwLTEzIDktMjJsNjQtNjRxMTUtMTUgMzUtN3QyMCAyOXptLTk2LTczOGwyODggMjg4LTY3MiA2NzJoLTI4OHYtMjg4em00NDQgMTMybC05MiA5Mi0yODgtMjg4IDkyLTkycTI4LTI4IDY4LTI4dDY4IDI4bDE1MiAxNTJxMjggMjggMjggNjh0LTI4IDY4eiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg=='); }
    a#nav_directory { background-size: 24px; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik04OTYgNzY4cTIzNyAwIDQ0My00M3QzMjUtMTI3djE3MHEwIDY5LTEwMyAxMjh0LTI4MCA5My41LTM4NSAzNC41LTM4NS0zNC41LTI4MC05My41LTEwMy0xMjh2LTE3MHExMTkgODQgMzI1IDEyN3Q0NDMgNDN6bTAgNzY4cTIzNyAwIDQ0My00M3QzMjUtMTI3djE3MHEwIDY5LTEwMyAxMjh0LTI4MCA5My41LTM4NSAzNC41LTM4NS0zNC41LTI4MC05My41LTEwMy0xMjh2LTE3MHExMTkgODQgMzI1IDEyN3Q0NDMgNDN6bTAtMzg0cTIzNyAwIDQ0My00M3QzMjUtMTI3djE3MHEwIDY5LTEwMyAxMjh0LTI4MCA5My41LTM4NSAzNC41LTM4NS0zNC41LTI4MC05My41LTEwMy0xMjh2LTE3MHExMTkgODQgMzI1IDEyN3Q0NDMgNDN6bTAtMTE1MnEyMDggMCAzODUgMzQuNXQyODAgOTMuNSAxMDMgMTI4djEyOHEwIDY5LTEwMyAxMjh0LTI4MCA5My41LTM4NSAzNC41LTM4NS0zNC41LTI4MC05My41LTEwMy0xMjh2LTEyOHEwLTY5IDEwMy0xMjh0MjgwLTkzLjUgMzg1LTM0LjV6IiBmaWxsPSIjZmZmIi8+PC9zdmc+'); }
    a#nav_chat_list { background-position: center 3px; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik02NDAgODk2cTAtNTMtMzcuNS05MC41dC05MC41LTM3LjUtOTAuNSAzNy41LTM3LjUgOTAuNSAzNy41IDkwLjUgOTAuNSAzNy41IDkwLjUtMzcuNSAzNy41LTkwLjV6bTM4NCAwcTAtNTMtMzcuNS05MC41dC05MC41LTM3LjUtOTAuNSAzNy41LTM3LjUgOTAuNSAzNy41IDkwLjUgOTAuNSAzNy41IDkwLjUtMzcuNSAzNy41LTkwLjV6bTM4NCAwcTAtNTMtMzcuNS05MC41dC05MC41LTM3LjUtOTAuNSAzNy41LTM3LjUgOTAuNSAzNy41IDkwLjUgOTAuNSAzNy41IDkwLjUtMzcuNSAzNy41LTkwLjV6bTM4NCAwcTAgMTc0LTEyMCAzMjEuNXQtMzI2IDIzMy00NTAgODUuNXEtMTEwIDAtMjExLTE4LTE3MyAxNzMtNDM1IDIyOS01MiAxMC04NiAxMy0xMiAxLTIyLTZ0LTEzLTE4cS00LTE1IDIwLTM3IDUtNSAyMy41LTIxLjV0MjUuNS0yMy41IDIzLjUtMjUuNSAyNC0zMS41IDIwLjUtMzcgMjAtNDggMTQuNS01Ny41IDEyLjUtNzIuNXEtMTQ2LTkwLTIyOS41LTIxNi41dC04My41LTI2OS41cTAtMTc0IDEyMC0zMjEuNXQzMjYtMjMzIDQ1MC04NS41IDQ1MCA4NS41IDMyNiAyMzMgMTIwIDMyMS41eiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg=='); }
    a#nav_account { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xMTUyIDg5NnEwLTEwNi03NS0xODF0LTE4MS03NS0xODEgNzUtNzUgMTgxIDc1IDE4MSAxODEgNzUgMTgxLTc1IDc1LTE4MXptNTEyLTEwOXYyMjJxMCAxMi04IDIzdC0yMCAxM2wtMTg1IDI4cS0xOSA1NC0zOSA5MSAzNSA1MCAxMDcgMTM4IDEwIDEyIDEwIDI1dC05IDIzcS0yNyAzNy05OSAxMDh0LTk0IDcxcS0xMiAwLTI2LTlsLTEzOC0xMDhxLTQ0IDIzLTkxIDM4LTE2IDEzNi0yOSAxODYtNyAyOC0zNiAyOGgtMjIycS0xNCAwLTI0LjUtOC41dC0xMS41LTIxLjVsLTI4LTE4NHEtNDktMTYtOTAtMzdsLTE0MSAxMDdxLTEwIDktMjUgOS0xNCAwLTI1LTExLTEyNi0xMTQtMTY1LTE2OC03LTEwLTctMjMgMC0xMiA4LTIzIDE1LTIxIDUxLTY2LjV0NTQtNzAuNXEtMjctNTAtNDEtOTlsLTE4My0yN3EtMTMtMi0yMS0xMi41dC04LTIzLjV2LTIyMnEwLTEyIDgtMjN0MTktMTNsMTg2LTI4cTE0LTQ2IDM5LTkyLTQwLTU3LTEwNy0xMzgtMTAtMTItMTAtMjQgMC0xMCA5LTIzIDI2LTM2IDk4LjUtMTA3LjV0OTQuNS03MS41cTEzIDAgMjYgMTBsMTM4IDEwN3E0NC0yMyA5MS0zOCAxNi0xMzYgMjktMTg2IDctMjggMzYtMjhoMjIycTE0IDAgMjQuNSA4LjV0MTEuNSAyMS41bDI4IDE4NHE0OSAxNiA5MCAzN2wxNDItMTA3cTktOSAyNC05IDEzIDAgMjUgMTAgMTI5IDExOSAxNjUgMTcwIDcgOCA3IDIyIDAgMTItOCAyMy0xNSAyMS01MSA2Ni41dC01NCA3MC41cTI2IDUwIDQxIDk4bDE4MyAyOHExMyAyIDIxIDEyLjV0OCAyMy41eiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg=='); }
    a#nav_donate { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgoKIDxnPgogIDx0aXRsZT5iYWNrZ3JvdW5kPC90aXRsZT4KICA8cmVjdCBmaWxsPSJub25lIiBpZD0iY2FudmFzX2JhY2tncm91bmQiIGhlaWdodD0iNjAyIiB3aWR0aD0iODAyIiB5PSItMSIgeD0iLTEiLz4KIDwvZz4KIDxnPgogIDx0aXRsZT5MYXllciAxPC90aXRsZT4KICA8cGF0aCBpZD0ic3ZnXzEiIGQ9Im0zLjUwNSwwbDAsMWwtMC43NSwwYy0wLjY4LDAgLTEuMjUsMC41NyAtMS4yNSwxLjI1bDAsMC41YzAsMC42OCAwLjQ0LDEuMjQgMS4wOSwxLjQxbDIuNTYsMC42NmMwLjE0LDAuMDQgMC4zNCwwLjI5IDAuMzQsMC40NGwwLDAuNWMwLDAuMTQgLTAuMTEsMC4yNSAtMC4yNSwwLjI1bC0yLjUsMGEwLjU2LDAuNTYgMCAwIDEgLTAuMjUsLTAuMDZsMCwtMC45NGwtMSwwbDAsMWMwLDAuMzQgMC4yLDAuNjMgMC40NCwwLjc4YzAuMjMsMC4xNiAwLjUyLDAuMjIgMC44MSwwLjIybDAuNzUsMGwwLDFsMSwwbDAsLTFsMC43NSwwYzAuNjksMCAxLjI1LC0wLjU2IDEuMjUsLTEuMjVsMCwtMC41YzAsLTAuNjggLTAuNDQsLTEuMjQgLTEuMDksLTEuNDFsLTIuNTYsLTAuNjZjLTAuMTQsLTAuMDQgLTAuMzQsLTAuMjkgLTAuMzQsLTAuNDRsMCwtMC41YzAsLTAuMTQgMC4xMSwtMC4yNSAwLjI1LC0wLjI1bDIuNSwwYzAuMTEsMCAwLjIxLDAuMDQgMC4yNSwwLjA2bDAsMC45NGwxLDBsMCwtMWMwLC0wLjM0IC0wLjIsLTAuNjMgLTAuNDQsLTAuNzhjLTAuMjMsLTAuMTYgLTAuNTIsLTAuMjIgLTAuODEsLTAuMjJsLTAuNzUsMGwwLC0xbC0xLDB6IiBmaWxsPSIjZmZmIi8+CiA8L2c+Cjwvc3ZnPg==');}
    a#nav_log_out { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik03MDQgMTQ0MHEwIDQgMSAyMHQuNSAyNi41LTMgMjMuNS0xMCAxOS41LTIwLjUgNi41aC0zMjBxLTExOSAwLTIwMy41LTg0LjV0LTg0LjUtMjAzLjV2LTcwNHEwLTExOSA4NC41LTIwMy41dDIwMy41LTg0LjVoMzIwcTEzIDAgMjIuNSA5LjV0OS41IDIyLjVxMCA0IDEgMjB0LjUgMjYuNS0zIDIzLjUtMTAgMTkuNS0yMC41IDYuNWgtMzIwcS02NiAwLTExMyA0N3QtNDcgMTEzdjcwNHEwIDY2IDQ3IDExM3QxMTMgNDdoMzEybDExLjUgMSAxMS41IDMgOCA1LjUgNyA5IDIgMTMuNXptOTI4LTU0NHEwIDI2LTE5IDQ1bC01NDQgNTQ0cS0xOSAxOS00NSAxOXQtNDUtMTktMTktNDV2LTI4OGgtNDQ4cS0yNiAwLTQ1LTE5dC0xOS00NXYtMzg0cTAtMjYgMTktNDV0NDUtMTloNDQ4di0yODhxMC0yNiAxOS00NXQ0NS0xOSA0NSAxOWw1NDQgNTQ0cTE5IDE5IDE5IDQ1eiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg=='); }
    a#nav_use { background-image: url('data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmYWxzZSIgZGF0YS1wcmVmaXg9ImZhcyIgZGF0YS1pY29uPSJzY3JvbGwiIGNsYXNzPSJzdmctaW5saW5lLS1mYSBmYS1zY3JvbGwgZmEtdy0yMCIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgNTEyIj48cGF0aCBmaWxsPSJ3aGl0ZSIgZD0iTTQ4IDBDMjEuNTMgMCAwIDIxLjUzIDAgNDh2NjRjMCA4Ljg0IDcuMTYgMTYgMTYgMTZoODBWNDhDOTYgMjEuNTMgNzQuNDcgMCA0OCAwem0yMDggNDEyLjU3VjM1MmgyODhWOTZjMC01Mi45NC00My4wNi05Ni05Ni05NkgxMTEuNTlDMTIxLjc0IDEzLjQxIDEyOCAyOS45MiAxMjggNDh2MzY4YzAgMzguODcgMzQuNjUgNjkuNjUgNzQuNzUgNjMuMTJDMjM0LjIyIDQ3NCAyNTYgNDQ0LjQ2IDI1NiA0MTIuNTd6TTI4OCAzODR2MzJjMCA1Mi45My00My4wNiA5Ni05NiA5NmgzMzZjNjEuODYgMCAxMTItNTAuMTQgMTEyLTExMiAwLTguODQtNy4xNi0xNi0xNi0xNkgyODh6Ij48L3BhdGg+PC9zdmc+'); }
    a#nav_discord { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiA8Zz4KICA8dGl0bGU+YmFja2dyb3VuZDwvdGl0bGU+CiAgPHJlY3QgeD0iLTEiIHk9Ii0xIiB3aWR0aD0iNTIiIGhlaWdodD0iNDIiIGlkPSJjYW52YXNfYmFja2dyb3VuZCIgZmlsbD0ibm9uZSIvPgogPC9nPgoKIDxnPgogIDx0aXRsZT5MYXllciAxPC90aXRsZT4KICA8cGF0aCBkPSJtNDIuMTI2LDYuNzY4MzVjLTMuOTgyLC0zLjIwMSAtMTAuMjc5LC0zLjc0MyAtMTAuNTQ2LC0zLjc2NWMtMC40MiwtMC4wMzYgLTAuODE5LDAuMjAyIC0wLjk5MiwwLjU4N2MtMC4wMTIsMC4wMjUgLTAuMTUsMC4zNCAtMC4zMDMsMC44MzNjMi42MzMsMC40NDMgNS44NjcsMS4zMzkgOC43OTQsMy4xNTVjMC40NjksMC4yOTEgMC42MTMsMC45MDcgMC4zMjIsMS4zNzdjLTAuMTg5LDAuMzA1IC0wLjUxNiwwLjQ3MyAtMC44NTEsMC40NzNjLTAuMTgsMCAtMC4zNjIsLTAuMDQ4IC0wLjUyNiwtMC4xNWMtNS4wMywtMy4xMiAtMTEuMzE1LC0zLjI3OCAtMTIuNTI0LC0zLjI3OHMtNy40OTUsMC4xNTggLTEyLjUyMywzLjI3OGMtMC40NywwLjI5MiAtMS4wODYsMC4xNDcgLTEuMzc3LC0wLjMyMmMtMC4yOTIsLTAuNDcgLTAuMTQ3LC0xLjA4NiAwLjMyMiwtMS4zNzdjMi45MjcsLTEuODE1IDYuMTYsLTIuNzEyIDguNzk0LC0zLjE1NWMtMC4xNTQsLTAuNDkzIC0wLjI5MiwtMC44MDggLTAuMzAzLC0wLjgzM2MtMC4xNzMsLTAuMzg2IC0wLjU3MSwtMC42MjkgLTAuOTkzLC0wLjU4N2MtMC4yNjYsMC4wMjEgLTYuNTYzLDAuNTYzIC0xMC41OTgsMy44MDljLTIuMTA5LDEuOTQ3IC02LjMyMiwxMy4zMzkgLTYuMzIyLDIzLjE4N2MwLDAuMTc0IDAuMDQ1LDAuMzQ0IDAuMTMxLDAuNDk1YzIuOTA5LDUuMTA5IDEwLjg0Miw2LjQ0NyAxMi42NDksNi41MDRjMC4wMTEsMC4wMDEgMC4wMjEsMC4wMDEgMC4wMzIsMC4wMDFjMC4zMTksMCAwLjYyLC0wLjE1MiAwLjgwOSwtMC40MTFsMS44MjksLTIuNTEzYy00LjkzMywtMS4yNzYgLTcuNDUzLC0zLjQzOSAtNy41OTgsLTMuNTY4Yy0wLjQxNCwtMC4zNjUgLTAuNDUzLC0wLjk5NyAtMC4wODcsLTEuNDExYzAuMzY1LC0wLjQxNCAwLjk5NSwtMC40NTMgMS40MSwtMC4wODljMC4wNjEsMC4wNTQgNC43LDMuOTkyIDEzLjgyNSwzLjk5MmM5LjE0MSwwIDEzLjc4MiwtMy45NTMgMTMuODI4LC0zLjk5M2MwLjQxNCwtMC4zNTkgMS4wNDUsLTAuMzIzIDEuNDA5LDAuMDk0YzAuMzY0LDAuNDE0IDAuMzI1LDEuMDQzIC0wLjA4OCwxLjQwN2MtMC4xNDYsMC4xMjkgLTIuNjY2LDIuMjkyIC03LjU5OSwzLjU2OGwxLjgyOSwyLjUxM2MwLjE4OSwwLjI1OSAwLjQ5LDAuNDExIDAuODA5LDAuNDExYzAuMDExLDAgMC4wMjEsMCAwLjAzMSwtMC4wMDFjMS44MDksLTAuMDU3IDkuNzQxLC0xLjM5NSAxMi42NDksLTYuNTA0YzAuMDg3LC0wLjE1MSAwLjEzMiwtMC4zMjEgMC4xMzIsLTAuNDk1YzAsLTkuODQ4IC00LjIxMywtMjEuMjQgLTYuMzc0LC0yMy4yMzJ6bS0yMy4xMjYsMTkuMjMyYy0xLjkzMywwIC0zLjUsLTEuNzkxIC0zLjUsLTRjMCwtMi4yMDkgMS41NjcsLTQgMy41LC00czMuNSwxLjc5MSAzLjUsNGMwLDIuMjA5IC0xLjU2Nyw0IC0zLjUsNHptMTMsMGMtMS45MzMsMCAtMy41LC0xLjc5MSAtMy41LC00YzAsLTIuMjA5IDEuNTY3LC00IDMuNSwtNHMzLjUsMS43OTEgMy41LDRjMCwyLjIwOSAtMS41NjcsNCAtMy41LDR6IiBpZD0ic3ZnXzEiIGZpbGw9IiNmZmZmZmYiLz4KIDwvZz4KPC9zdmc+"); }
    #nav_chat_list:after { display: block; position: absolute; top: 10px; right: 7px; left: 7px; background-color: #fff; border-radius: 10px; text-indent: 0; line-height: normal; text-align: center; font-size: 10pt; font-weight: bold; color: #347079; content: attr(data-unread); }
}
@media(max-width: 584px) {
  header a { 
    max-width: 565px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }
  header .vertical-arrow {
    display: inline-block;
  }
  header .horizontal-arrow {
    display: none;
  }
}

.verifiedCheck {
  margin-left:10px;
}
/* 1.3. News banner */

#news { padding: 3px 5px; background-color: #f8f8f8; color: #1D9CAF; text-align: center; }

/* 1.4. Main */

h2 { margin: 50px 50px 20px; font-size: 2em; line-height: normal; text-transform: uppercase; }

main { display: block; margin: 50px; }
h2 + main { margin-top: 0; }

.side_column { color: #fff }
.side_column nav > :first-child { margin-top: 0; }
.side_column h3 { font-size: 14pt; }
.side_column ul { margin: 10px 0; padding: 0; list-style-type: none; text-align: center; }

#content { max-width: 650px; }
#content > :first-child { margin-top: 0; }
#content > :last-child { margin-bottom: 0; }
#content .tile2 { background-color: #eee; border-radius: 10px; }
#content .tile2 a { color: #009 }
#content .tile2 :is(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#content .tile2 :-webkit-any(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#content .tile2 :-moz-any(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#content .tile2 :matches(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }


.admin-interface {
  background-color: #eee !important;
  color: #000 !important;
  max-width: 95% !important;
}
.admin-interface * {
  color: #000;
  word-wrap: break-word;
}

.admin-ad-container {
  display: flex;
  box-sizing: border-box;
  border-radius: 10px;
  flex-wrap: wrap;
  background: #ddd;
  color: #222;
}

.ad-detail {
  min-height: 380px;
}

.admin-ad-container.ad-detail-small {
  margin: 10px;
  padding: 10px;
  margin: auto;
  position: absolute;
  left: 10px;
  bottom: 0;
}
.admin-ad-container.ad-detail-large {
  margin: 10px;
  padding: 10px;
  margin: auto;
  position: absolute;
  left: 10px;
  bottom: 0;
}
.admin-ad-container.ad-detail-banner {
  margin: 10px;
  padding: 10px;
  margin: auto;
  position: absolute;
  left: 10px;
  bottom: 0;
}
.admin-ad-container.ad-detail-footer {
  margin: 10px;
  padding: 10px;
  margin: auto;
  position: absolute;
  left: 10px;
  bottom: 0;
}

.admin-ad-container .ad-detail-small p, a {
  text-align: left;
  margin: 0;
  color: #222;
}
.admin-ad-container .ad-detail-large p, a {
  text-align: left;
  margin: 0;
  color: #222;
}
.admin-ad-container .ad-detail-banner p, a {
  text-align: left;
  margin: 0;
  color: #222;
}
.admin-ad-container .ad-detail-footer p, a {
  text-align: left;
  margin: 0;
  color: #222;
}

.admin-ad-container .ad-detail-small img {
  height: 100px !important;
  width: 300px !important;
  border-style: solid;
  border-color: #444;
  border-width: 6px;
}

.admin-ad-container .ad-detail-large img {
  height: 200px !important;
  width: 300px !important;
  border-style: solid;
  border-color: #444;
  border-width: 6px;
}

.admin-ad-container .ad-detail-banner img {
  height: 100px !important;
  width: 710px !important;
  border-style: solid;
  border-color: #444;
  border-width: 6px;
}

.admin-ad-container .ad-detail-footer img {
  height: 100px !important;
  width: 710px !important;
  border-style: solid;
  border-color: #444;
  border-width: 6px;
}

.wrangler_parent_tags {
  display: flex;
  list-style-type: none;
  margin-top: 0px;
}

.wrangler_parent_tags li:not(:last-child)::after {
  content: "->";
  margin-right: 4px;
  margin-left: 4px;
}

@media (max-width: 640px) {
    h2 { margin-top: 30px; margin-left: 15px; margin-right: 15px; }
    main { margin: 15px; }
}

.ad_holder {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.ad_holder .footer:first-of-type { margin-top: 20px;}

/* NOTE: The 'advertisement' class divs must be a direct descendant of an 'ad_holder' div */
.advertisement {
  position: relative;
  text-align: center; 
  flex: 0 1; 
}
.advertisement img.unfocused { filter: grayscale(100%) brightness(50%);}
.advertisement.small { flex-basis: 300px; }
.advertisement.large { flex-basis: 300px; }
.advertisement.header { flex-basis: 600px; }
.advertisement.footer { flex-basis: 600px; }

.ad_text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  width: 100%;
  overflow-x: hidden;
}

.ad_link {
  color: #fff;
}

.dropdown-toggle { 
  color: #ccc; 
  outline: none; 
  border: solid #347080; 
  border-radius: 0 10px 10px 10px; 
  background-color: #347080; 
  min-width: 200px;
  margin-bottom: 5px;
}
.dropdown-toggle:hover {
  filter: grayscale(50%) hue-rotate(10deg) brightness(250%) sepia(20%);
  color: #000 !important;
}
.dropdown-toggle::after {
  content: " ▼";
  float: right;
}
.dropdown-menu { 
  background-color: #1a3840; 
  z-index: 3; 
  border-color: #cccccc; 
  border-style: solid solid hidden;
}
.dropdown-item { 
  display: block; 
  padding: 5px;
  min-width: 200px;
  text-align: center;
}
.dropdown-item:hover {
  background-color: #347080;
}

@media (max-width: 1024px) {
    .side_column { max-width: 650px; margin: 20px auto; text-align: center; }
    .side_column li { display: inline; }
    .side_column :not(#pagination) > li:not(:last-child):after { content: " · "; }
    #content { margin: 0 auto; }
}

@media (min-width: 1025px) {
    main.flex { display: flex; justify-content: center; }
    .side_column { flex: 0 1 300px; font-size: 10pt; }
    .side_column + .side_column { order: 1; }
    .side_column nav { position: -webkit-sticky; position: sticky; top: 45px; max-width: 300px; }
    .side_column:first-child nav { margin-left: auto; }
    .side_column ul { text-align: left; }
    .side_column li { padding: 1px 5px; }
    .side_column :not(#pagination) > li:not(:last-child), .dropdown-item { border-bottom: 1px solid #d4d4d4; }
    .side_column li a { display: inline; margin: -1px -5px; padding: 1px 5px; }
    .dropdown-toggle { width: 100%; text-align: left;}
    .dropdown-menu { width: 100%; }
    .dropdown-item { padding-left: 5px; text-align: left;}
    main.flex #content { flex: 0 1 650px; padding: 0 30px; }
}

/* 2. General content */

h3 { margin-bottom: 0; }

h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0; }

p { max-width: 650px; margin: 15px auto; line-height: 1.5em; word-wrap: break-word; color: #eee;}
ol, ul { color: #000; }

hr { margin: 15px 0; border: 0; border-top: 1px solid #ddd; }

@media (max-width: 640px) {
    p { margin: 10px auto; }
    hr { margin: 10px 0; }
}

ul { padding-left: 1em; }

a { color: #ccc; }
a:hover { text-decoration: none; }

.danger h1, .danger h2, .danger h3, .danger h4, .danger h5, .danger h6, .danger a, .error { color: #f33; }

/* 2.1. Forms */

input { vertical-align: middle; }
input[type="checkbox"], input[type="radio"] { margin: 0; }
input.full, textarea { margin: 0; padding: 0; border: 0; width: 100%; background-color: #fff; font: inherit; color: inherit; }
label input.full { font-size: 1rem; color: #000; }
textarea { resize: vertical; }

.tile2 > form:last-child > p:last-child { margin-bottom: 0; }

/* 2.2. Tile */

.tile2 {
    position: relative;
    z-index: 2;
    box-sizing: border-box;
    max-width: 650px;
    margin: 20px auto;
    padding: 20px 25px;
    background-color: #347080;
    box-shadow: 0 1px 2px #bbb;
    border-radius: 10px;
}
@media (max-width: 640px) {
    .tile2 { margin: 15px auto; padding: 10px 15px; }
}

.tile2 > :first-child { margin-top: 0; }
.tile2 > :last-child { margin-bottom: 0; }
.tile2 p, .tile2 code { white-space: pre-line; }
.tile2 a { color: #333 }
#use_content > .tile2 ul, #use_content > .tile2 ol { color: #eee; }
.tile2 code { color: black;}

.tile2.pager { z-index: 1; margin: 0; padding-top: 10px; padding-bottom: 10px; background-color: #f6f6f6; box-shadow: 0 1px 2px #ccc; text-align: center; }
img.tile2 { display: block; padding: 0; }

.subtitle, .help, label, #prompt_dropdowns { font-size: 10pt; color: #333; }
.subtitle { text-align: center; }
h3 + .subtitle, h3 + .help { margin-top: 5px; }

/* 2.3. Expandable */

.expandable .toggle { float: right; margin-left: 5px; outline: none; }
.expandable .expanded_content, .expandable.expanded .collapsed_content { display: none; }
.expandable.expanded .expanded_content { display: block; }
.expandable:last-child > p { margin-bottom: 0; }

/* 2.4. Actions */

.actions { overflow: auto; }
.actions > .left { float: left; }
.actions > .right { float: right; }
.middle_actions { text-align: center; }
.actions form { display: inline; }
.cherp-modal { 
  display: flex; 
  flex-direction: row; 
  flex-wrap: wrap; 
  z-index: 1; 
  position: absolute; 
  background-color: #eee;
  border: solid dimgray; 
  height:auto; 
  right: 5px; 
  bottom: 5px;
}
.cherp-modal textarea { max-height: 300px; flex: 0 1 400px}
.cherp-modal.group-modal { flex-direction: column; }
/* 3. Pages */

/* 3.1. Sign up and log in */

#account_forms { text-align: center; }

@media (min-width: 641px) {
    #account_forms { display: flex; justify-content: center; margin: 30px 0; }
    #account_forms form { margin: 0 15px; }
}

/* 3.2. Home */

.answer_mode #connecting, .prompt_mode #connecting, .wait_mode #connecting, .connection_error #connecting, #answer_mode, #prompt_mode, #wait_mode, #connection_error { display: none; }
.answer_mode #answer_mode, .prompt_mode #prompt_mode, .wait_mode #wait_mode, .connection_error #connection_error  { display: block; }

#categories, #categories textarea { background-color: #f8f8f8; }
#categories ul { padding: 0; text-align: center; }
#answer_categories { margin-bottom: 10px; }
#answer_starters, #answer_levels { margin: 10px 0; }
#categories li { display: inline-block; }
#categories li:not(:last-child):after { content: " ·"; }

#filter_toggle { display: none; }
#filter_toggle + p { margin-bottom: 0; text-align: center; font-size: 10pt; }
label[for="filter_toggle"] { color: #009; text-decoration: underline; cursor: pointer; }
label[for="filter_toggle"]:hover { text-decoration: none; }
#filter_toggle + p + form, #filter_toggle:checked + p { display: none; }
#filter_toggle:checked + p + form { display: block; }

#prompt_list { margin: 15px 0; padding: 0; list-style-type: none; }
#prompt_list li { max-height: 190px; overflow: hidden; cursor: pointer; }
@media (min-width: 1121px) {
    #prompt_list { display: flex; margin: 20px -10px -20px; flex-wrap: wrap; justify-content: center; }
    #prompt_list li { min-width: 500px; margin: 0 10px 20px; flex: 1 1; }
}
#prompt_list li p { margin: 0; }
.fade { display: block; position: absolute; top: 140px; left: 0; right: 0; height: 50px; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); }
#prompt_text { height: 150px; }

#overlay, #report_overlay { display: none; }
.show_overlay, .show_report_overlay { overflow: hidden; }
.show_overlay #overlay, .show_report_overlay #report_overlay { display: block; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 4; overflow-y: scroll; padding: 0 30px; background-color: rgba(238, 238, 238, 0.75); }

#prompt_list li p.subtitle, #overlay_subtitle { margin-bottom: 7px; }

#overlay_report_and_close { position: -webkit-sticky; position: sticky; top: 0; z-index: 3; max-width: 650px; margin: 0 auto; }
#overlay_report_and_close.fallback .tile2 { position: fixed; z-index: 3; width: 100%; }

#overlay_images { max-width: 650px; margin: 0 auto; }
#overlay_images img { max-width: 100%; }

#overlay_answer { display: block; width: 100%; max-width: 650px; margin: 20px auto; padding: 10px; font: inherit; }
@media (max-width: 640px) {
    #overlay_answer { margin: 15px auto; }
}

@media (max-width: 640px) {
    #prompt_list li { max-height: 170px; }
    .fade { top: 120px; }
    .show_overlay #overlay, .show_overlay #report_overlay { padding: 0 15px; }
}

#prompt_info :first-child { margin-top: 0; }

.banner {
    margin: 50px auto;
    text-align: center;
}

.announcement .status {
  float: right;
  color: #eee;
}
.announcement > .timestamp, .announcement ul { color: #eee; }
.announcement.draft > .timestamp { opacity: 0.5; }

#announcement_form_container { margin-top: 1rem; margin-bottom: 0; padding-top: 10px; padding-bottom: 10px; }
#announcement_form_container p { margin: 5px 0px; }
#announcement_form { position: relative; }
#announcement_form p:first-child { margin: 0; }

button.announcement_action { 
  color: #333; 
  margin-left: 4px; 
  padding: 1 0 1; 
  font-size: 8pt}
button.announcement_action:active {
  background: #e5e5e5;
  outline: none;
  -webkit-box-shadow: inset 0px 0px 5px #c1c1c1;
     -moz-box-shadow: inset 0px 0px 5px #c1c1c1;
          box-shadow: inset 0px 0px 5px #c1c1c1;
}

/* 3.3. Directory */

.request.draft, .request.removed { background-color: #f8f8f8; }
.request .status { float: right; color: #666; }
.request.removed .status { color: #f33; }
.request p:first-child, .request .status + p { margin: 0 0 10px; }
.request h3, .request_tag_label { margin: 0 0 2px 0; text-align: left; font-size: 10pt; font-weight: normal; color: #000; }
.request_tags { margin: 0 0 10px; padding: 0; }
.request_tags.related { margin-top: 0; font-size: 10pt; }
.request_tags li { display: inline; word-wrap: break-word; }
.request_tags li:not(:last-child)::after { content: " "; }

.request_slots { display: inline }
.request_slots li { display: block; word-wrap: break-word; }
.request_slots li > * { margin-left: 2px; }
.request_slots li:not(:last-child)::after { content: " "; }
.request_slots { margin: 0 0 0px; padding: 0; }
.request .slot_description { margin-top: 0; white-space: unset; }
.request .slot_description.taken * { text-decoration: line-through; }
.slot_description .slot_status { float: right; }

#new_request_form .tile2 { position: static; /* prevent tiles from appearing in front of the autocomplete list */ }
#new_request_form .tile2:first-child { margin-top: 0; }
#new_request_form .tag_checkboxes { margin: 0 0 5px; white-space: unset; }
#new_request_form .tag_checkboxes label { display: inline-block; margin-right: 10px; font-size: 12pt; color: #000; }
#new_request_form .tile2 :is(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#new_request_form .tile2 :-webkit-any(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#new_request_form .tile2 :-moz-any(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#new_request_form .tile2 :matches(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }

.tag_list { padding: 0; list-style-type: none; }
.tag_list li { overflow: hidden; }
.tag_list li:not(:first-child) { padding-top: 15px; border-top: 1px solid #ddd; }
.tag_list li:not(:last-child) { padding-bottom: 15px; }
@media (max-width: 640px) {
    .tag_list li:not(:first-child) { padding-top: 10px; }
    .tag_list li:not(:last-child) { padding-bottom: 10px; }
}
.tag_list .remove_form { float: right; }

select[name=maturity_name], select[name=type_name] { display: none; }

table.tile2 { table-layout: fixed; max-width: 100%; padding: 0; border-collapse: collapse; }
table.tile2 thead { background-color: #f8f8f8; border-bottom: 1px solid #eee; }
table.tile2 tbody { font-size: 10pt; }
table.tile2 td, table.tile2 th { padding: 2px 5px; word-wrap: break-word; }
table.tile2 tr:not(:first-child) td { border-top: 1px solid #eee; }
table.tile2 tr:not(:last-child) td { border-bottom: 1px solid #eee; }
table.tile2 td:not(:first-child), table.tile2 th:not(:first-child) { border-left: 1px solid #eee; }
table.tile2 td:not(:last-child), table.tile2 th:not(:last-child) { border-right: 1px solid #eee; }
table.tile2 a:only-child { display: block; margin: -2px -5px; padding: 2px 5px; }

table.tile2 .unapproved a { color: #f33; }
table.tile2 .synonym a { color: #ccc; }

.tag_input { margin: 0 0 10px; padding: 4px 8px; background-color: #f6f6f6; box-shadow: 0 1px 2px #ddd inset; border-radius: 10px; }
.tag_input .request_tags { margin: 0 0 2px; }
.tag_input .request_tags:empty { margin: 0; }
.tag_input .request_tags a { word-wrap: break-word; }
.tag_input .request_tags a:hover { text-decoration: line-through; }
.tag_input input { background-color: #f6f6f6; background-image: none; }

.side_column .tag_input, .side_column .tag_input input { background-color: #fff; color: black; }
.side_column .tag_input { box-shadow: 0 1px 2px #eee inset; }
.side_column ul { color: #eee; }

.autocomplete_list { position: absolute; max-width: calc(100% - 52px); margin: -10px 0 0 1px; padding: 0; list-style-type: none; background-color: #fff; box-shadow: 0 1px 2px #bbb; cursor: pointer; }

.directory_search_form { position: relative; margin-top: 10px; }
.side_column .autocomplete_list { z-index: 3; width: calc(100% - 2px); margin: -10px 0 0 1px; }
.search_type { margin-top: 6px; font-size: 8pt; line-height: normal; color: #333; }

@media (max-width: 1024px) {
    .side_column .autocomplete_list { max-width: unset; text-align: left; }
    .side_column .autocomplete_list li { display: block; }
    .side_column .autocomplete_list li:after { content: ""; }
}
@media (min-width: 1025px) {
    .side_column .autocomplete_list { max-width: 178px; }
}

.autocomplete_list:empty { display: none; }
.autocomplete_list li { padding: 4px 8px 4px 7px; word-wrap: break-word; }
.autocomplete_list li.current { background-color: #f8f8f8; }
.autocomplete_list li a { display: block; margin: -4px -8px -4px -7px; padding: 4px 8px 4px 7px; text-decoration: none; color: #000; }

.tile2.timer.bumpable {
  border-right: 6px solid cornflowerblue;
  background: linear-gradient(to top right,transparent 50%,cornflowerblue 0) top right/40px 40px no-repeat, #eee;
  background-clip: border-box;
  background-position-x: calc(100% + 6px);
}

.timer .time.bumpable {
  color:cornflowerblue
}

.tile2.timer.waiting {
  border-right: 6px solid firebrick;
  background: linear-gradient(to top right,transparent 50%,firebrick 0) top right/40px 40px no-repeat, #eee;
  background-clip: border-box;
  background-position-x: calc(100% + 6px);
}

.timer .time.waiting {
  color:firebrick
}

.warning-panel {
  padding: 0.01em 16px;
}

.yellow {
  color:#000!important;
  background-color:#ffffcc!important
}

.border {
  border:1px solid #ccc!important
}

/* ADDED 6/5/2021 NEW TAG CSS */
#content .tile2 ul.request_tags li.maturity.bubble-active a { background: #1a3840; }
#content .tile2 ul.request_tags li.fandom.bubble-active a { background: #1a3840; }
#content .tile2 ul.request_tags li.fandom_wanted.bubble-active a { background: #1a3840; }
#content .tile2 ul.request_tags li.warning.bubble-active a { background: #C23232; }
#content .tile2 ul.request_tags li.warning.bubble-inactive a { color: #C23232; }
#content .tile2 ul.request_tags li.character.bubble-active a { background: #347080; }
#content .tile2 ul.request_tags li.character_wanted.bubble-active a { background: #347080; }
#content .tile2 ul.request_tags .bubble-active a {
  color: #EEE;
  background-color: #888;
  padding: 2px 3px;
  border-radius: 5px;
  text-decoration: none;
  border: 1px solid #eee;
  transition: filter 0.2s, color 0.2s, border 0.2s, box-shadow 0.2s;
  box-shadow: 0.6px 0.6px 1px #333;
}
.request_tags li.bubble-active {
  display: inline-block;
  white-space: pre;
  word-break: keep-all;
  padding-top: 4px;
}
@media (max-width: 640px) {
  .request_tags li.bubble-active {
    display: inline-block;
    white-space: normal;
    word-break: break-all;
    padding-top: 6px;
  }
}
#content .tile2 ul li.bubble-active a:hover {
  transition: filter 0.4s, color 0.4s, border 0.4s, box-shadow 0.4s;
  filter: grayscale(50%) hue-rotate(10deg) brightness(250%) sepia(20%);
  color: #000 !important;
  border: 1px solid black !important;
  box-shadow: 1px 1px 1px #444;
}
.request_tags li.bubble-inactive:not(:last-child)::after {
  content: ", ";
}
.bubble-toggle {
  margin-top: 10px;
  margin-bottom: 10px;
}

/* 3.4. Chat list */

#chat_list { margin: 0; padding: 0; list-style-type: none; }
#chat_list:first-child li:first-child { margin-top: 0; }
#chat_list:last-child li:last-child { margin-bottom: 0; }

#chat_list .tile2 { 
  border-radius: 10px; background-color: #eee; 
  border-left: 6px solid #eee;
}
#chat_list .tile2 :is(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#chat_list .tile2 :-webkit-any(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#chat_list .tile2 :-moz-any(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }
#chat_list .tile2 :matches(h1, h2, h3, h4, h5, h6, p, ol, ul) { color: unset; }

#chat_list .tile2.chat { 
  background: linear-gradient(to top right,transparent 50%,rgb(155, 155, 155) 0) top right/40px 40px no-repeat, #eee;
}
#chat_list .tile2.answered {
  border-right: 6px solid grey; 
  background: linear-gradient(to top right,transparent 50%,grey 0) top right/40px 40px no-repeat, #eee;
  background-clip: border-box;
  background-position-x: calc(100% + 6px);
}
#chat_list .tile2.unread {
  border-right: 6px solid cornflowerblue;
  background: linear-gradient(to top right,transparent 50%,cornflowerblue 0) top right/40px 40px no-repeat, #eee;
  background-clip: border-box;
  background-position-x: calc(100% + 6px);
}
#chat_list .tile2.unanswered {
  border-right: 6px solid #9acd32 ;
  border-left: #eee;
  background: linear-gradient(to top right,transparent 50%,#9acd32 0) 100% 0/40px 40px no-repeat, #eee;
  background-clip: border-box;
  background-position-x: calc(100% + 6px);
}
#chat_list .tile2.ended {
  border-right: 6px solid firebrick;
  background: linear-gradient(to top right,transparent 50%,firebrick 0) top right/40px 40px no-repeat, #eee;
  background-clip: border-box;
  background-position-x: calc(100% + 6px);
}

.unread { box-shadow: 0 1px 4px #009; }

.notes { margin: 5px 0 0; max-width: none; font-size: 10pt; }

/* 3.5. Chat window */

body.ongoing main { margin-bottom: 0; }

#messages { margin: 0; padding: 0 25px; list-style-type: none; }
#messages li { position: relative; padding: 20px 0; }
#messages li:not(:first-child) { border-top: 1px solid #ddd; }
#messages li > p, #messages li > blockquote p, .delete_preview > p, .delete_preview > blockquote p { margin: 0; }
#messages li > p:not(:last-of-type),
#messages li > blockquote:not(:last-of-type) p:not(:last-of-type),
.delete_preview > p:not(:last-of-type),
.delete_preview > blockquote:not(:last-of-type) p:not(:last-of-type) { margin-bottom: 15px; }
#messages .editing p { text-decoration: line-through; }
button.message_action { 
  color: #333; 
  margin-left: 4px; 
  padding: 1 0 1; 
  font-size: 8pt}
button.message_action:active {
  background: #e5e5e5;
  outline: none;
  -webkit-box-shadow: inset 0px 0px 5px #c1c1c1;
     -moz-box-shadow: inset 0px 0px 5px #c1c1c1;
          box-shadow: inset 0px 0px 5px #c1c1c1;
}
.message hr { margin: 5px 0; border: none; text-align: center; line-height: 5px; }
.message hr:after { content: "●  ●  ●"; }
.message blockquote { margin: 0; padding-left: 5px; border-left: 3px solid #ccc; }

.message_ooc { opacity: 0.5; }
.message_ooc:hover { opacity: 1; }
.message_draft { font-style: italic; }
.message_system { text-align: center; }

.symbol { position: absolute; width: 50px; left: -50px; text-align: center; font-size: 1.5em; }
#message_form .symbol { margin-top: 15px; }

.timestamp { font-size: 10pt; color: #888; }
.edited .timestamp::after { content: " · Edited"; }

#status_bar { max-width: 70ex; margin: -5px auto; color: #666; text-align: center; font-size: 10pt; }
#status_bar { max-width: none; margin: 0; }

#message_form_container { margin-top: 1rem; margin-bottom: 0; padding-top: 10px; padding-bottom: 10px; }
#message_form_container p { margin: 5px 0px; }
#message_form { position: relative; }
#message_form p:first-child { margin: 0; }
#message_form textarea { height: 100px; }

#chat_user_list.connected .user_list_bullet::before { content: "○"; }
#chat_user_list.connected .user_list_bullet.online::before { content: "●"; }
#chat_user_list .deleted { text-decoration: line-through; }

.tile.continue { text-align: center; }

.delete_preview { position: relative; }

@media (max-width: 640px) {
    #messages { padding: 0 15px; }
    #messages li { padding: 10px 0; }
    .symbol { width: 30px; left: -30px; font-size: 1em; }
    #message_form .symbol { margin-top: 10px; }
}

#notification { display: none; }
@media (min-width: 1025px) {
    #notification { position: fixed; right: 50px; bottom: 30px; width: calc(50% - 405px); min-width: calc(17.82% - 30px); }
    #notification_inner { position: relative; }
    #notification_close { float: right; }
}

/* 3.6. Chat info */

#chat_notes_notes, #chat_notes_labels { font-size: 10pt; }

/* 3.7. Account */

#confirmation:empty { display: none; }
#confirmation:empty + .tile2 { margin-top: 0; }

#push_notifications_disabled, #push_notifications_denied, #push_notifications_enabled { display: none; }


.color-text-flow span,
.color-text-flow-hover:hover span {
  -webkit-animation-name: color-text-flow-keys;
          animation-name: color-text-flow-keys;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes color-text-flow-keys {
  0% {
    color: #d65c97;
  }
  5% {
    color: #5cd666;
  }
  10% {
    color: #a55cd6;
  }
  15.0% {
    color: #5c7cd6;
  }
  20% {
    color: #d65c7a;
  }
  25% {
    color: #81d65c;
  }
  30.0% {
    color: #835cd6;
  }
  35% {
    color: #685cd6;
  }
  40% {
    color: #5c9dd6;
  }
  45% {
    color: #5cd670;
  }
  50% {
    color: #d6625c;
  }
  55.0% {
    color: #d6835c;
  }
  60.0% {
    color: #d6605c;
  }
  65% {
    color: #be5cd6;
  }
  70% {
    color: #5c8dd6;
  }
  75% {
    color: #95d65c;
  }
  80% {
    color: #d69d5c;
  }
  85.0% {
    color: #d65c81;
  }
  90% {
    color: #5cd666;
  }
  95% {
    color: #d67e5c;
  }
  100% {
    color: #64d65c;
  }
}
@keyframes color-text-flow-keys {
  0% {
    color: #d65c97;
  }
  5% {
    color: #5cd666;
  }
  10% {
    color: #a55cd6;
  }
  15.0% {
    color: #5c7cd6;
  }
  20% {
    color: #d65c7a;
  }
  25% {
    color: #81d65c;
  }
  30.0% {
    color: #835cd6;
  }
  35% {
    color: #685cd6;
  }
  40% {
    color: #5c9dd6;
  }
  45% {
    color: #5cd670;
  }
  50% {
    color: #d6625c;
  }
  55.0% {
    color: #d6835c;
  }
  60.0% {
    color: #d6605c;
  }
  65% {
    color: #be5cd6;
  }
  70% {
    color: #5c8dd6;
  }
  75% {
    color: #95d65c;
  }
  80% {
    color: #d69d5c;
  }
  85.0% {
    color: #d65c81;
  }
  90% {
    color: #5cd666;
  }
  95% {
    color: #d67e5c;
  }
  100% {
    color: #64d65c;
  }
}
.color-text-flow span:nth-of-type(1),
.color-text-flow-hover:hover span:nth-of-type(1) {
  -webkit-animation-delay: -19.8s;
          animation-delay: -19.8s;
}
.color-text-flow span:nth-of-type(2),
.color-text-flow-hover:hover span:nth-of-type(2) {
  -webkit-animation-delay: -19.6s;
          animation-delay: -19.6s;
}
.color-text-flow span:nth-of-type(3),
.color-text-flow-hover:hover span:nth-of-type(3) {
  -webkit-animation-delay: -19.4s;
          animation-delay: -19.4s;
}
.color-text-flow span:nth-of-type(4),
.color-text-flow-hover:hover span:nth-of-type(4) {
  -webkit-animation-delay: -19.2s;
          animation-delay: -19.2s;
}
.color-text-flow span:nth-of-type(5),
.color-text-flow-hover:hover span:nth-of-type(5) {
  -webkit-animation-delay: -19s;
          animation-delay: -19s;
}
.color-text-flow span:nth-of-type(6),
.color-text-flow-hover:hover span:nth-of-type(6) {
  -webkit-animation-delay: -18.8s;
          animation-delay: -18.8s;
}
.color-text-flow span:nth-of-type(7),
.color-text-flow-hover:hover span:nth-of-type(7) {
  -webkit-animation-delay: -18.6s;
          animation-delay: -18.6s;
}
.color-text-flow span:nth-of-type(8),
.color-text-flow-hover:hover span:nth-of-type(8) {
  -webkit-animation-delay: -18.4s;
          animation-delay: -18.4s;
}
.color-text-flow span:nth-of-type(9),
.color-text-flow-hover:hover span:nth-of-type(9) {
  -webkit-animation-delay: -18.2s;
          animation-delay: -18.2s;
}
.color-text-flow span:nth-of-type(10),
.color-text-flow-hover:hover span:nth-of-type(10) {
  -webkit-animation-delay: -18s;
          animation-delay: -18s;
}
.color-text-flow span:nth-of-type(11),
.color-text-flow-hover:hover span:nth-of-type(11) {
  -webkit-animation-delay: -17.8s;
          animation-delay: -17.8s;
}
.color-text-flow span:nth-of-type(12),
.color-text-flow-hover:hover span:nth-of-type(12) {
  -webkit-animation-delay: -17.6s;
          animation-delay: -17.6s;
}
.color-text-flow span:nth-of-type(13),
.color-text-flow-hover:hover span:nth-of-type(13) {
  -webkit-animation-delay: -17.4s;
          animation-delay: -17.4s;
}
.color-text-flow span:nth-of-type(14),
.color-text-flow-hover:hover span:nth-of-type(14) {
  -webkit-animation-delay: -17.2s;
          animation-delay: -17.2s;
}
.color-text-flow span:nth-of-type(15),
.color-text-flow-hover:hover span:nth-of-type(15) {
  -webkit-animation-delay: -17s;
          animation-delay: -17s;
}
.color-text-flow span:nth-of-type(16),
.color-text-flow-hover:hover span:nth-of-type(16) {
  -webkit-animation-delay: -16.8s;
          animation-delay: -16.8s;
}
.color-text-flow span:nth-of-type(17),
.color-text-flow-hover:hover span:nth-of-type(17) {
  -webkit-animation-delay: -16.6s;
          animation-delay: -16.6s;
}
.color-text-flow span:nth-of-type(18),
.color-text-flow-hover:hover span:nth-of-type(18) {
  -webkit-animation-delay: -16.4s;
          animation-delay: -16.4s;
}
.color-text-flow span:nth-of-type(19),
.color-text-flow-hover:hover span:nth-of-type(19) {
  -webkit-animation-delay: -16.2s;
          animation-delay: -16.2s;
}
.color-text-flow span:nth-of-type(20),
.color-text-flow-hover:hover span:nth-of-type(20) {
  -webkit-animation-delay: -16s;
          animation-delay: -16s;
}
.color-text-flow span:nth-of-type(21),
.color-text-flow-hover:hover span:nth-of-type(21) {
  -webkit-animation-delay: -15.8s;
          animation-delay: -15.8s;
}
.color-text-flow span:nth-of-type(22),
.color-text-flow-hover:hover span:nth-of-type(22) {
  -webkit-animation-delay: -15.6s;
          animation-delay: -15.6s;
}
.color-text-flow span:nth-of-type(23),
.color-text-flow-hover:hover span:nth-of-type(23) {
  -webkit-animation-delay: -15.4s;
          animation-delay: -15.4s;
}
.color-text-flow span:nth-of-type(24),
.color-text-flow-hover:hover span:nth-of-type(24) {
  -webkit-animation-delay: -15.2s;
          animation-delay: -15.2s;
}
.color-text-flow span:nth-of-type(25),
.color-text-flow-hover:hover span:nth-of-type(25) {
  -webkit-animation-delay: -15s;
          animation-delay: -15s;
}
.color-text-flow span:nth-of-type(26),
.color-text-flow-hover:hover span:nth-of-type(26) {
  -webkit-animation-delay: -14.8s;
          animation-delay: -14.8s;
}
.color-text-flow span:nth-of-type(27),
.color-text-flow-hover:hover span:nth-of-type(27) {
  -webkit-animation-delay: -14.6s;
          animation-delay: -14.6s;
}
.color-text-flow span:nth-of-type(28),
.color-text-flow-hover:hover span:nth-of-type(28) {
  -webkit-animation-delay: -14.4s;
          animation-delay: -14.4s;
}
.color-text-flow span:nth-of-type(29),
.color-text-flow-hover:hover span:nth-of-type(29) {
  -webkit-animation-delay: -14.2s;
          animation-delay: -14.2s;
}
.color-text-flow span:nth-of-type(30),
.color-text-flow-hover:hover span:nth-of-type(30) {
  -webkit-animation-delay: -14s;
          animation-delay: -14s;
}
.color-text-flow span:nth-of-type(31),
.color-text-flow-hover:hover span:nth-of-type(31) {
  -webkit-animation-delay: -13.8s;
          animation-delay: -13.8s;
}
.color-text-flow span:nth-of-type(32),
.color-text-flow-hover:hover span:nth-of-type(32) {
  -webkit-animation-delay: -13.6s;
          animation-delay: -13.6s;
}
.color-text-flow span:nth-of-type(33),
.color-text-flow-hover:hover span:nth-of-type(33) {
  -webkit-animation-delay: -13.4s;
          animation-delay: -13.4s;
}
.color-text-flow span:nth-of-type(34),
.color-text-flow-hover:hover span:nth-of-type(34) {
  -webkit-animation-delay: -13.2s;
          animation-delay: -13.2s;
}
.color-text-flow span:nth-of-type(35),
.color-text-flow-hover:hover span:nth-of-type(35) {
  -webkit-animation-delay: -13s;
          animation-delay: -13s;
}
.color-text-flow span:nth-of-type(36),
.color-text-flow-hover:hover span:nth-of-type(36) {
  -webkit-animation-delay: -12.8s;
          animation-delay: -12.8s;
}
.color-text-flow span:nth-of-type(37),
.color-text-flow-hover:hover span:nth-of-type(37) {
  -webkit-animation-delay: -12.6s;
          animation-delay: -12.6s;
}
.color-text-flow span:nth-of-type(38),
.color-text-flow-hover:hover span:nth-of-type(38) {
  -webkit-animation-delay: -12.4s;
          animation-delay: -12.4s;
}
.color-text-flow span:nth-of-type(39),
.color-text-flow-hover:hover span:nth-of-type(39) {
  -webkit-animation-delay: -12.2s;
          animation-delay: -12.2s;
}
.color-text-flow span:nth-of-type(40),
.color-text-flow-hover:hover span:nth-of-type(40) {
  -webkit-animation-delay: -12s;
          animation-delay: -12s;
}
.color-text-flow span:nth-of-type(41),
.color-text-flow-hover:hover span:nth-of-type(41) {
  -webkit-animation-delay: -11.8s;
          animation-delay: -11.8s;
}
.color-text-flow span:nth-of-type(42),
.color-text-flow-hover:hover span:nth-of-type(42) {
  -webkit-animation-delay: -11.6s;
          animation-delay: -11.6s;
}
.color-text-flow span:nth-of-type(43),
.color-text-flow-hover:hover span:nth-of-type(43) {
  -webkit-animation-delay: -11.4s;
          animation-delay: -11.4s;
}
.color-text-flow span:nth-of-type(44),
.color-text-flow-hover:hover span:nth-of-type(44) {
  -webkit-animation-delay: -11.2s;
          animation-delay: -11.2s;
}
.color-text-flow span:nth-of-type(45),
.color-text-flow-hover:hover span:nth-of-type(45) {
  -webkit-animation-delay: -11s;
          animation-delay: -11s;
}
.color-text-flow span:nth-of-type(46),
.color-text-flow-hover:hover span:nth-of-type(46) {
  -webkit-animation-delay: -10.8s;
          animation-delay: -10.8s;
}
.color-text-flow span:nth-of-type(47),
.color-text-flow-hover:hover span:nth-of-type(47) {
  -webkit-animation-delay: -10.6s;
          animation-delay: -10.6s;
}
.color-text-flow span:nth-of-type(48),
.color-text-flow-hover:hover span:nth-of-type(48) {
  -webkit-animation-delay: -10.4s;
          animation-delay: -10.4s;
}
.color-text-flow span:nth-of-type(49),
.color-text-flow-hover:hover span:nth-of-type(49) {
  -webkit-animation-delay: -10.2s;
          animation-delay: -10.2s;
}
.color-text-flow span:nth-of-type(50),
.color-text-flow-hover:hover span:nth-of-type(50) {
  -webkit-animation-delay: -10s;
          animation-delay: -10s;
}
.color-text-flow span:nth-of-type(51),
.color-text-flow-hover:hover span:nth-of-type(51) {
  -webkit-animation-delay: -9.8s;
          animation-delay: -9.8s;
}
.color-text-flow span:nth-of-type(52),
.color-text-flow-hover:hover span:nth-of-type(52) {
  -webkit-animation-delay: -9.6s;
          animation-delay: -9.6s;
}
.color-text-flow span:nth-of-type(53),
.color-text-flow-hover:hover span:nth-of-type(53) {
  -webkit-animation-delay: -9.4s;
          animation-delay: -9.4s;
}
.color-text-flow span:nth-of-type(54),
.color-text-flow-hover:hover span:nth-of-type(54) {
  -webkit-animation-delay: -9.2s;
          animation-delay: -9.2s;
}
.color-text-flow span:nth-of-type(55),
.color-text-flow-hover:hover span:nth-of-type(55) {
  -webkit-animation-delay: -9s;
          animation-delay: -9s;
}
.color-text-flow span:nth-of-type(56),
.color-text-flow-hover:hover span:nth-of-type(56) {
  -webkit-animation-delay: -8.8s;
          animation-delay: -8.8s;
}
.color-text-flow span:nth-of-type(57),
.color-text-flow-hover:hover span:nth-of-type(57) {
  -webkit-animation-delay: -8.6s;
          animation-delay: -8.6s;
}
.color-text-flow span:nth-of-type(58),
.color-text-flow-hover:hover span:nth-of-type(58) {
  -webkit-animation-delay: -8.4s;
          animation-delay: -8.4s;
}
.color-text-flow span:nth-of-type(59),
.color-text-flow-hover:hover span:nth-of-type(59) {
  -webkit-animation-delay: -8.2s;
          animation-delay: -8.2s;
}
.color-text-flow span:nth-of-type(60),
.color-text-flow-hover:hover span:nth-of-type(60) {
  -webkit-animation-delay: -8s;
          animation-delay: -8s;
}
.color-text-flow span:nth-of-type(61),
.color-text-flow-hover:hover span:nth-of-type(61) {
  -webkit-animation-delay: -7.8s;
          animation-delay: -7.8s;
}
.color-text-flow span:nth-of-type(62),
.color-text-flow-hover:hover span:nth-of-type(62) {
  -webkit-animation-delay: -7.6s;
          animation-delay: -7.6s;
}
.color-text-flow span:nth-of-type(63),
.color-text-flow-hover:hover span:nth-of-type(63) {
  -webkit-animation-delay: -7.4s;
          animation-delay: -7.4s;
}
.color-text-flow span:nth-of-type(64),
.color-text-flow-hover:hover span:nth-of-type(64) {
  -webkit-animation-delay: -7.2s;
          animation-delay: -7.2s;
}
.color-text-flow span:nth-of-type(65),
.color-text-flow-hover:hover span:nth-of-type(65) {
  -webkit-animation-delay: -7s;
          animation-delay: -7s;
}
.color-text-flow span:nth-of-type(66),
.color-text-flow-hover:hover span:nth-of-type(66) {
  -webkit-animation-delay: -6.8s;
          animation-delay: -6.8s;
}
.color-text-flow span:nth-of-type(67),
.color-text-flow-hover:hover span:nth-of-type(67) {
  -webkit-animation-delay: -6.6s;
          animation-delay: -6.6s;
}
.color-text-flow span:nth-of-type(68),
.color-text-flow-hover:hover span:nth-of-type(68) {
  -webkit-animation-delay: -6.4s;
          animation-delay: -6.4s;
}
.color-text-flow span:nth-of-type(69),
.color-text-flow-hover:hover span:nth-of-type(69) {
  -webkit-animation-delay: -6.2s;
          animation-delay: -6.2s;
}
.color-text-flow span:nth-of-type(70),
.color-text-flow-hover:hover span:nth-of-type(70) {
  -webkit-animation-delay: -6s;
          animation-delay: -6s;
}
.color-text-flow span:nth-of-type(71),
.color-text-flow-hover:hover span:nth-of-type(71) {
  -webkit-animation-delay: -5.8s;
          animation-delay: -5.8s;
}
.color-text-flow span:nth-of-type(72),
.color-text-flow-hover:hover span:nth-of-type(72) {
  -webkit-animation-delay: -5.6s;
          animation-delay: -5.6s;
}
.color-text-flow span:nth-of-type(73),
.color-text-flow-hover:hover span:nth-of-type(73) {
  -webkit-animation-delay: -5.4s;
          animation-delay: -5.4s;
}
.color-text-flow span:nth-of-type(74),
.color-text-flow-hover:hover span:nth-of-type(74) {
  -webkit-animation-delay: -5.2s;
          animation-delay: -5.2s;
}
.color-text-flow span:nth-of-type(75),
.color-text-flow-hover:hover span:nth-of-type(75) {
  -webkit-animation-delay: -5s;
          animation-delay: -5s;
}
.color-text-flow span:nth-of-type(76),
.color-text-flow-hover:hover span:nth-of-type(76) {
  -webkit-animation-delay: -4.8s;
          animation-delay: -4.8s;
}
.color-text-flow span:nth-of-type(77),
.color-text-flow-hover:hover span:nth-of-type(77) {
  -webkit-animation-delay: -4.6s;
          animation-delay: -4.6s;
}
.color-text-flow span:nth-of-type(78),
.color-text-flow-hover:hover span:nth-of-type(78) {
  -webkit-animation-delay: -4.4s;
          animation-delay: -4.4s;
}
.color-text-flow span:nth-of-type(79),
.color-text-flow-hover:hover span:nth-of-type(79) {
  -webkit-animation-delay: -4.2s;
          animation-delay: -4.2s;
}
.color-text-flow span:nth-of-type(80),
.color-text-flow-hover:hover span:nth-of-type(80) {
  -webkit-animation-delay: -4s;
          animation-delay: -4s;
}
.color-text-flow span:nth-of-type(81),
.color-text-flow-hover:hover span:nth-of-type(81) {
  -webkit-animation-delay: -3.8s;
          animation-delay: -3.8s;
}
.color-text-flow span:nth-of-type(82),
.color-text-flow-hover:hover span:nth-of-type(82) {
  -webkit-animation-delay: -3.6s;
          animation-delay: -3.6s;
}
.color-text-flow span:nth-of-type(83),
.color-text-flow-hover:hover span:nth-of-type(83) {
  -webkit-animation-delay: -3.4s;
          animation-delay: -3.4s;
}
.color-text-flow span:nth-of-type(84),
.color-text-flow-hover:hover span:nth-of-type(84) {
  -webkit-animation-delay: -3.2s;
          animation-delay: -3.2s;
}
.color-text-flow span:nth-of-type(85),
.color-text-flow-hover:hover span:nth-of-type(85) {
  -webkit-animation-delay: -3s;
          animation-delay: -3s;
}
.color-text-flow span:nth-of-type(86),
.color-text-flow-hover:hover span:nth-of-type(86) {
  -webkit-animation-delay: -2.8s;
          animation-delay: -2.8s;
}
.color-text-flow span:nth-of-type(87),
.color-text-flow-hover:hover span:nth-of-type(87) {
  -webkit-animation-delay: -2.6s;
          animation-delay: -2.6s;
}
.color-text-flow span:nth-of-type(88),
.color-text-flow-hover:hover span:nth-of-type(88) {
  -webkit-animation-delay: -2.4s;
          animation-delay: -2.4s;
}
.color-text-flow span:nth-of-type(89),
.color-text-flow-hover:hover span:nth-of-type(89) {
  -webkit-animation-delay: -2.2s;
          animation-delay: -2.2s;
}
.color-text-flow span:nth-of-type(90),
.color-text-flow-hover:hover span:nth-of-type(90) {
  -webkit-animation-delay: -2s;
          animation-delay: -2s;
}
.color-text-flow span:nth-of-type(91),
.color-text-flow-hover:hover span:nth-of-type(91) {
  -webkit-animation-delay: -1.8s;
          animation-delay: -1.8s;
}
.color-text-flow span:nth-of-type(92),
.color-text-flow-hover:hover span:nth-of-type(92) {
  -webkit-animation-delay: -1.6s;
          animation-delay: -1.6s;
}
.color-text-flow span:nth-of-type(93),
.color-text-flow-hover:hover span:nth-of-type(93) {
  -webkit-animation-delay: -1.4s;
          animation-delay: -1.4s;
}
.color-text-flow span:nth-of-type(94),
.color-text-flow-hover:hover span:nth-of-type(94) {
  -webkit-animation-delay: -1.2s;
          animation-delay: -1.2s;
}
.color-text-flow span:nth-of-type(95),
.color-text-flow-hover:hover span:nth-of-type(95) {
  -webkit-animation-delay: -1s;
          animation-delay: -1s;
}
.color-text-flow span:nth-of-type(96),
.color-text-flow-hover:hover span:nth-of-type(96) {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s;
}
.color-text-flow span:nth-of-type(97),
.color-text-flow-hover:hover span:nth-of-type(97) {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s;
}
.color-text-flow span:nth-of-type(98),
.color-text-flow-hover:hover span:nth-of-type(98) {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
}
.color-text-flow span:nth-of-type(99),
.color-text-flow-hover:hover span:nth-of-type(99) {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
}
.color-text-flow span:nth-of-type(100),
.color-text-flow-hover:hover span:nth-of-type(100) {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}