pinned-topics.css

.titlebox blockquote p:nth-of-type(1) {
  background-position: 0 -130px;
}

.res-nightmode .titlebox blockquote p:nth-of-type(1) {
  background-position: -60px -130px;
}

.titlebox blockquote p:nth-of-type(2) {
  background-position: 0 -10px;
}

.res-nightmode .titlebox blockquote p:nth-of-type(2) {
  background-position: -60px -10px;
}

.titlebox blockquote p:nth-of-type(3) {
  background-position: -60px -70px;
}

.res-nightmode .titlebox blockquote p:nth-of-type(3) {
  background-position: -120px -70px;
}

.titlebox blockquote ul:nth-of-type(1) {
  background-position: -180px -70px;
}

.res-nightmode .titlebox blockquote ul:nth-of-type(1) {
  background-position: -180px -130px;
}

.titlebox blockquote ul:nth-of-type(2) {
  background-position: 0 -190px;
}

.res-nightmode .titlebox blockquote ul:nth-of-type(2) {
  background-position: -60px -190px;
}

.res-nightmode .titlebox blockquote p {
  background-color: #303030;
}

.res-nightmode .titlebox blockquote p a {
  color: rgba(255, 255, 255, 0.7);
  background-color: #303030;
}

.res-nightmode .titlebox blockquote ul:first-of-type {
  background-color: #303030;
}

.res-nightmode .titlebox blockquote ul:first-of-type li:first-of-type {
  color: rgba(255, 255, 255, 0.7);
  background-color: #303030;
}

.res-nightmode .titlebox blockquote ul:first-of-type li:not(:first-of-type) {
  color: rgba(255, 255, 255, 0.7);
  background-color: #303030;
}

.res-nightmode .titlebox blockquote ul:first-of-type li:not(:first-of-type):hover {
  color: #4dd0e1;
}

.res-nightmode .titlebox blockquote ul:first-of-type li:not(:first-of-type) a {
  color: rgba(255, 255, 255, 0.7);
}

.res-nightmode .titlebox blockquote ul:nth-of-type(2) {
  background-color: #303030;
}

.res-nightmode .titlebox blockquote ul:nth-of-type(2) li:first-of-type {
  color: rgba(255, 255, 255, 0.7);
  background-color: #303030;
}

.titlebox blockquote {
  border: 0;
  margin: 0 !important;
  padding: 0;
}

.titlebox blockquote p,
.titlebox blockquote ul,
.titlebox blockquote a {
  -webkit-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px;
}

.titlebox blockquote p,
.titlebox blockquote ul {
  background: url(%%stickies%%) no-repeat;
}

.titlebox blockquote p {
  width: 100%;
  height: 40px;
  background-color: #f1f1f1;
}

.titlebox blockquote p:hover {
  background-color: #4dd0e1;
}

.titlebox blockquote p a {
  display: block;
  height: 40px;
  border-color: transparent;
  border-style: solid;
  border-width: 0 0 0 60px;
  padding: 0;
  line-height: 40px;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.54);
  font-weight: bold;
  background-color: #f1f1f1;
  background-clip: padding-box;
}

.titlebox blockquote p a:hover {
  background-color: #4dd0e1;
  color: #fff;
}

.titlebox blockquote ul {
  padding-left: 0;
}

.titlebox blockquote ul li {
  list-style-type: none;
}

.titlebox blockquote ul li:first-of-type {
  height: 40px;
  margin-left: 60px;
  font-size: 14px;
  font-weight: bold;
  color: rgba(0, 0, 0, 0.54);
  line-height: 40px;
  background-color: #f1f1f1;
}

.titlebox blockquote ul:first-of-type {
  padding: 0 0 8px;
  background-color: #f1f1f1;
}

.titlebox blockquote ul:first-of-type li:not(:first-of-type) {
  padding: 5px 0 5px 30px;
  line-height: 20px;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.54);
  background-color: #f1f1f1;
  -webkit-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.titlebox blockquote ul:first-of-type li:not(:first-of-type):hover {
  background-color: rgba(97, 97, 97, 0.9);
}

.titlebox blockquote ul:first-of-type li:not(:first-of-type):hover a {
  font-weight: bold;
  color: #4dd0e1;
}

.titlebox blockquote ul:first-of-type li:not(:first-of-type) a {
  display: block;
  color: rgba(0, 0, 0, 0.54);
}

.titlebox blockquote ul:nth-of-type(2) {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: center;
  align-items: flex-start;
  margin-top: 5px;
  background-color: #f1f1f1;
}

.titlebox blockquote ul:nth-of-type(2) li:first-of-type {
  width: 100%;
}

.titlebox blockquote ul:nth-of-type(2) li:not(:first-of-type) {
  position: relative;
  display: block;
  height: 100px;
  width: 104px;
  margin-bottom: 5px;
  overflow: hidden;
}

.titlebox blockquote ul:nth-of-type(2) li:not(:first-of-type):hover::before {
  -webkit-transform: scale(1.25);
  -moz-transform: scale(1.25);
  -ms-transform: scale(1.25);
  -o-transform: scale(1.25);
  transform: scale(1.25);
}

.titlebox blockquote ul:nth-of-type(2) li:not(:first-of-type)::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  content: '';
  background: url(%%spritesheet-musicshows%%);
  -webkit-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.titlebox blockquote ul:nth-of-type(2) li:not(:first-of-type) a {
  display: block;
  height: 100%;
  width: 100%;
  font-size: 10px;
  font-weight: bold;
  line-height: 180px;
  text-align: center;
  color: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
  background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.57) 80%);
}

.titlebox blockquote ul:nth-of-type(2) li:not(:first-of-type) a:hover {
  color: #ff007e;
}

.titlebox blockquote ul:nth-of-type(2) li:nth-of-type(2)::before {
  background-position: 0 -100px;
}

.titlebox blockquote ul:nth-of-type(2) li:nth-of-type(3)::before {
  background-position: -104px -100px;
}

.titlebox blockquote ul:nth-of-type(2) li:nth-of-type(4)::before {
  background-position: -208px 0;
}

.titlebox blockquote ul:nth-of-type(2) li:nth-of-type(5)::before {
  background-position: -208px -100px;
}

.titlebox blockquote ul:nth-of-type(2) li:nth-of-type(6)::before {
  background-position: -104px 0;
}

.titlebox blockquote ul:nth-of-type(2) li:nth-of-type(7)::before {
  background-position: 0 -200px;
}