/* ----------------------------------------------------------- */
/* ---------------- START PARENT STYLES ---------------- */
/* ----------------------------------------------------------- */

:root {
	
	/* ----------------------------------------------------------- */
	/* ------------- INDIVIDUAL GROUP COLOR -------------- */
	/* ----------------------------------------------------------- */
	
--staffcolor: rgb(30 30 30);
	
--codercolor: rgb(255 255 255);
	
--ooccolor: rgb(113 113 113);
	
--auditioningcolor: rgb(113 113 113);
	
--vagabondcolor: rgb(255 209 102);
	
--apollyonscolor: rgb(239 71 111);
	
--solkarionscolor: rgb(239 71 111);
	
--sorascolor: rgb(131 137 218);
	
--mothermagdalenescolor: rgb(239 71 111);
	
--hjaalmarscolor: rgb(0 255 111);
	
--godseedscolor: rgb(150 71 239);

	
	
	/* ----------------------------------------------------------- */
	/* ---------------- USERNAME GRADIENTS --------------- */
	/* ----------------------------------------------------------- */
	
--staff: rgb(30 30 30 / 80%);
	
--coder: linear-gradient(90deg,rgb(138 37 161 / 80%) 0%, rgb(37 169 184 / 50%) 50%, rgb(62 184 53 / 80%) 100%);
	
--ooc: rgb(113 113 113 / 80%);
	
--auditioning: rgb(113 113 113 / 80%);
	
--vagabond: linear-gradient(90deg, rgb(72 70 93 / 80%) 0%, rgb(122 135 167 / 80%) 100%);
	
--apollyons: linear-gradient(90deg, rgb(173 92 24 / 80%) 0%, rgb(244 198 4 / 80%) 100%);
	
--solkarions: linear-gradient(90deg, rgb(255 50 50 / 80%) 0%, rgb(214 142 38 / 80%) 100%);
	
--soras: linear-gradient(90deg, rgb(96 104 220 / 80%) 0%, rgb(112 216 226 / 80%) 100%);
	
--mothermagdalenes: linear-gradient(90deg, rgb(168 200 64 / 80%) 0%, rgb(112 94 18 / 80%) 100%);
	
--hjaalmars: linear-gradient(90deg,rgb(0 255 111 / 80%) 0%, rgb(0 220 245 / 80%) 100%);
	
--godseeds: linear-gradient(90deg,rgb(150 71 239 / 80%) 0%, rgb(217 71 239 / 80%) 100%);
	
	
	/* ----------------------------------------------------------- */
	/* --------------- PROFILE BG GRADIENTS --------------- */
	/* ----------------------------------------------------------- */
	
--staffbg: linear-gradient(0deg,rgb(0 0 0 / 80%) 0%, rgb(30 30 30 / 80%) 100%);
	
--coderbg: linear-gradient(0deg,rgb(138 37 161 / 80%) 0%, rgb(37 169 184 / 50%) 50%, rgb(62 184 53 / 80%) 100%);
	
--oocbg: linear-gradient(0deg,rgb(0 0 0 / 80%) 0%, rgb(113 113 113 / 80%) 100%);
	
--auditioningbg: linear-gradient(0deg,rgb(0 0 0 / 80%) 0%, rgb(113 113 113 / 80%) 100%);
	
--vagabondbg: linear-gradient(0deg,rgb(255 209 102 / 80%) 0%, rgb(255 138 102 / 80%) 100%);
	
--apollyonsbg: linear-gradient(0deg,rgb(186 136 38 / 80%) 0%, rgb(251 182 62 / 80%) 100%)
	
--solkarionsbg: linear-gradient(0deg, rgb(255 50 50 / 80%) 0%, rgb(214 142 38 / 80%) 100%);
	
--sorasbg: linear-gradient(0deg, rgb(96 104 220 / 80%) 0%, rgb(112 164 226 / 80%) 100%);
	
--mothermagdalenesbg: linear-gradient(0deg, rgb(159 192 51 / 80%) 0%, rgb(106 131 27 / 80%) 100%);
	
--hjaalmarsbg: linear-gradient(0deg,rgb(0 255 111 / 80%) 0%, rgb(0 220 245 / 80%) 100%);
	
--godseedsbg: linear-gradient(0deg,rgb(150 71 239 / 80%) 0%, rgb(217 71 239 / 80%) 100%);
}

/* ----------------------------------------------------------- */
/* ----------------- END PARENT STYLES ----------------- */
/* ----------------------------------------------------------- */

/* ----------------------------------------------------------- */
/* --------------------- GROUP ICONS -------------------- */
/* ----------------------------------------------------------- */

/* ---------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------- */

/* --- GLOBAL STYLING --- */
.coder::before, .staff::before, .ooc::before, .auditioning::before, 
.vagabond::before, .leader::before, .apollyons::before, 
.solkarions::before, .soras::before, .mother_magdalenes::before,
.hjaalmars::before, .godseeds::before {
    content: '';
    display: inline-block;
    width: 1.5em; 
    height: 1.5em;
    background-size: contain;
    background-repeat: no-repeat;
	margin-top: -.3em;
    margin-right: 0.5em;
    vertical-align: middle;
}

/* --- OOC GROUP ICONS --- */
.coder::before { background-image: url(https://concord-rp.com/forums/images/svg/eye.svg); }
.staff::before { background-image: url(https://concord-rp.com/forums/images/svg/staff_star.svg); }
.ooc::before, .auditioning::before  { background-image: url(https://concord-rp.com/forums/images/svg/ooc_star.svg); }

/* ----------------------------------------------------------- */

/* --- IC GROUP ICONS --- */
.leader::before { background-image: url(https://concord-rp.com/forums/images/svg/leader_star.svg); }
.vagabond::before, .apollyons::before, .solkarions::before, .soras::before, .mother_magdalenes::before, .hjaalmars::before, .godseeds::before  { background-image: url(https://concord-rp.com/forums/images/svg/ic_star.svg); }

/* ----------------------------------------------------------- */
/* ------------- GROUP USERNAME COLORS ------------- */
/* ----------------------------------------------------------- */

/* --- GLOBAL STYLING --- */

.staff, .coder, .ooc, .auditioning, 
.vagabond,  .apollyons, .solkarions, .soras, .mother_magdalenes, .hjaalmars, .godseeds{
	background:  rgb(97 97 97 / 99%);
	color: #ffffff;
	padding: .5em;
	font: bold 11px Jost;
	letter-spacing: 1px;
	text-transform: uppercase;
}

/* ----------------------------------------------------------- */

.staff { background: var(--staff);}

.coder { background: var(--coder);}

.ooc { background:  var(--ooc); }

.auditioning { background:  var(--auditioning); font-style: italic; }

.vagabond { background:  var(--vagabond); }

.apollyons { background:  var(--apollyons); }

.solkarions { background:  var(--solkarions);}

.soras { background:  var(--soras); }

.mother_magdalenes { background:  var(--mothermagdalenes); }

.hjaalmars { background:  var(--hjaalmars); }

.godseeds { background:  var(--godseeds); }

/* ----------------------------------------------------------- */

/* --- BACKGROUND STYLING --- */

.Administrators.flip-card-back,
.Super.Moderators.flip-card-back,
.Moderators.flip-card-back{
	background: var(--auditioningbg);
}

.Coder.flip-card-back{
	background: var(--auditioningbg);
}

.Coder.flip-card-back a {
	color: var(--godseedscolor);
}

.OOC.flip-card-back {
	background: var(--auditioningbg);
}

.Auditioning.flip-card-back {
	background: var(--auditioningbg);
}

.Vagabond.flip-card-back {
	background: var(--vagabondbg);
}

.Vagabond.flip-card-back a {
	color: var(--vagabondcolor);
}

.Apollyons.flip-card-back {
	background: var(--apollyonsbg);
}

.Apollyons.flip-card-back a {
	color: var(--apollyonscolor);
}

.Solkarions.flip-card-back {
	background: var(--solkarionsbg);
}

.Solkarions.flip-card-back a {
	color: var(--solkarionscolor);
}

.Soras.flip-card-back {
	background: var(--sorasbg);
}

.Soras.flip-card-back a {
	color: var(--sorascolor);
}

.Mother.Magdalenes.flip-card-back {
	background: var(--sorasbg);
}

.Mother.Magdalenes.flip-card-back a {
	color: var(--sorascolor);
}

.Godseeds.flip-card-back
{
	background: var(--godseedsbg);
}

.Godseeds.flip-card-back a {
	color: var(--godseedscolor);
}