/* onionring.js is made up of four files - onionring-widget.js, onionring-index.js, onionring-variables.js and onionring.css (this one!)
// it's licensed under the cooperative non-violent license (CNPL) v4+ (https://thufie.lain.haus/NPL.html)
// it was originally made by joey + mord of allium (è’œ) house, last updated 2020-10-24 */

/* === ONIONRING.CSS === */
/* this file affects the style of the widget. remember to replace all instances of #webringid with whatever value you have for ringID in the onionring-widget.js file. make sure it still has the # at the front, though! probably easiest to use find+replace to do it */
@font-face {
  font-family: "mixed";
  src: url("https://confettiguts.gay/fonts/mixed.tff");
}
#xenicRing ::-moz-selection {
  color: #4f214e;
  background: #ffffff00;
}

#xenicRing ::selection {
  color: #4f214e;
  background: #ffffff00;
}

#xenicRing {
  font-family: mixed !important;
  color: #4f214e !important;
  margin: 0 auto 0 auto !important;
  display: inline-block !important;
  text-align: center !important;
}

#xenicRing table {
  text-align: center !important;
}

#xenicRing #xenicMain {
  font-size: 0.9em !important;
  text-align: center !important;
  display: inline-block !important;
}

#xenicRing #xenicHead {
  font-size: 0.9em !important;
  background: white !important;
  border: 2px solid #4f214e !important;
  border-radius: 1em !important;
  padding: 0.2em 0.3em 0.2em 0.3em !important;
  line-height: 0.8em !important;
  margin: 0 auto 0.25em auto !important;
  text-align: center !important;
  display: inline-block;
  font-weight: bold !important;
  color: #4f214e !important;
  cursor: default !important;
}

#xenicRing #xenicFlag {
  display: block !important;
  border: 2px solid #4f214e !important;
  border-radius: 0.5em !important;
  width: 4em;
  height: 3.3em;
  margin: 0 auto !important;
  background: url("https://xenics.neocities.org/flagModified.png");
  background-size: 100% 100%;
}

#xenicRing a:link,
#xenicRing a:hover,
#xenicRing a:active,
#xenicRing a:visited {
  text-decoration: none !important;
  color: #4f214e !important;
}

#xenicRing .webring-main {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#xenicRing .webring-main a {
  display: inline-block !important;
  transition: 0.35s ease !important;
}

#xenicRing .webring-main a:hover {
  transform: translateY(-4%) !important;
}

#xenicRing .webring-links {
  transition: 0.35s ease !important;
}

#xenicRing .webring-links:hover {
  transform: translateY(-4%) !important;
}

#xenicRing .webring-head {
  display: block !important;
}

#xenicRing .webring-links {
  text-align: center !important;
  margin: 0 auto !important;
  font-weight: bold !important;
  font-size: 0.9em !important;
  line-height: 1em !important;
  border: 2px solid #4f214e !important;
  background: white !important;
  border-radius: 1em !important;
  padding: 0.1em 0.3em 0.1em 0.3em !important;
  line-height: 0.8em !important;
  display: inline-block;
}

#xenicRing #next-arrow,
#xenicRing #prev-arrow {
  margin: 0 0.5em 0 0.5em !important;
  vertical-align: 0.75em !important;
  width: 1.5em;
  height: 1.2em;
  display: inline-block !important;
}

#xenicRing #next-arrow {
  background: url("https://xenics.neocities.org/arrowRight.png");
  background-size: 100% 100% !important;
}

#xenicRing #prev-arrow {
  background: url("https://xenics.neocities.org/arrowLeft.png");
  background-size: 100% 100% !important;
}
