/* Font Families */
.arial, .arial-text { font-family: arial, sans-serif; }
.arial-black, .arial-black-text { font-family: 'Arial Black', Gadget, sans-serif; }
.comic, .comic-sans, .comic-sans-text { font-family: 'Comic Sans MS', sans-serif; }
.tahoma, .tahoma-text { font-family: tahoma, sans-serif; }
.helvetica, .helvetica-text { font-family: Helvetica, sans-serif; }
.impact, .impact-text { font-family: Impact, Charcoal, sans-serif; }
.verdana, .verdana-text { font-family: Verdana, Geneva, sans-serif; }
.courier, .courier-new, .courier-new-text { font-family: 'Courier New', Courier, monospace; }
.lucida, .lucida-text { font-family: 'Lucida Console', Monaco, monospace; }
.georgia, .georgia-text { font-family: Georgia, serif; }
.times-new-roman, .times, .times-text { font-family: 'Times New Roman', Times, serif; }
.palatino, .palatino-text { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; }
/* Font Sizes */
.fs-q{font-size:1.25rem;}
.fs-h{font-size:1.5rem;}
.fineprint {font-size:65%;}
.smaller {font-size: 80%;}
.larger, .bigger {font-size: 160%;}
.huge {font-size: 240%;}
/* Alignments & Floats */
.justify-t, .justify {text-align: justify;}
.left-t, .left-align {text-align: left !important;}
.right-t, .right-align {text-align: right !important;}
.center-t {text-align: center !important;}
.left{float:left;}
.right{float:right;}
/* Whitespace */
.nowrap {white-space: nowrap;}
/* Word Wrapping & Spacing */
.break{word-wrap:break-word; word-break: break-word;}
.break-all{word-break: break-all;}
.keep-all{word-break: keep-all;}
.indent {text-indent: 1cm !important;}
.wordspace{word-spacing: var(--wordspace);}
.tal-l, .tal-left {text-align-last: left;}
.tal-r, .tal-right {text-align-last: right;}
.tal-c, .tal-center {text-align-last: center;}
.tal-j, .tal-justify {text-align-last: justify;}
/* Marks (highlighting) */
mark{background-color: yellow; color: black;}
mark.important{background-color: red; color: yellow;}
mark.noted{background-color: green; color: yellow;}
mark.remember{background-color: DeepSkyBlue; color: black;}
/* Text Direction */
.rtl {direction: rtl;}
.wm-lr {writing-mode: vertical-lr;}
.wm-rl {writing-mode: vertical-rl;}
/* Font Styles & Formatting */
.oblique {font-style: oblique;}
.spaced-2x {line-height: 200% !important;}
.spaced-3x {line-height: 300% !important;}
.spaced-4x {line-height: 400% !important;}
.allcaps {text-transform: uppercase !important;}
.lowercase, .alllower {text-transform: lowercase !important;}
.capitalize, .capitals {text-transform: capitalize !important;}
.smallcaps {font-variant: small-caps !important;}
.guard-text, .guard { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
/* badges */
span.badge {border-radius: 4px; -webkit-border-radius: 4px; padding: 4px; font-weight: 600; margin-left: 6px; margin-right: 6px;}
/* Ordered Lists */
ol, ol.roman, ol.alpha, ol.none {padding: 0;}
ol.roman {list-style-type: upper-roman;}
ol.alpha {list-style-type: upper-alpha;}
ol.none, ul.none {list-style-type: none;}
.ccm-faq-entry-content ol{list-style-position: inside;}
.ccm-faq-entry-content ol li {padding: 0 0 0.75rem 0 ;}
.ccm-faq-entry-content ol li::marker{font-weight:900; font-size: 2.2rem;}

/* FLUID TEXT */
.fluid-text {font-size: calc(12px + (32 - 12) * ((100vw - 300px) / (1920 - 300))); line-height: 100%;}
h1.fluid-text, .fluid-text-h1 {font-size: calc(28px + (128 - 28) * ((100vw - 300px) / (1920 - 300)));} 
h2.fluid-text, .fluid-text-h2 {font-size: calc(22px + (96 - 22) * ((100vw - 300px) / (1920 - 300)));}
h3.fluid-text, .fluid-text-h3 {font-size: calc(18px + (76 - 18) * ((100vw - 300px) / (1920 - 300)));}
h4.fluid-text, .fluid-text-h4 {font-size: calc(16px + (64 - 16) * ((100vw - 300px) / (1920 - 300)));}
h5.fluid-text, .fluid-text-h5 {font-size: calc(14px + (54 - 14) * ((100vw - 300px) / (1920 - 300)));}
h6.fluid-text, .fluid-text-h6 {font-size: calc(14px + (44 - 14) * ((100vw - 300px) / (1920 - 300)));}
/* FLOW TEXT */
@media only screen and (min-width: 361px) {.flow-text {font-size: 1.2rem;}}
@media only screen and (min-width: 390px) {.flow-text {font-size: 1.224rem;}}
@media only screen and (min-width: 420px) {.flow-text {font-size: 1.248rem;}}
@media only screen and (min-width: 450px) {.flow-text {font-size: 1.272rem;}}
@media only screen and (min-width: 480px) {.flow-text {font-size: 1.296rem;}}
@media only screen and (min-width: 510px) {.flow-text {font-size: 1.32rem;}}
@media only screen and (min-width: 540px) {.flow-text {font-size: 1.344rem;}}
@media only screen and (min-width: 570px) {.flow-text {font-size: 1.368rem;}}
@media only screen and (min-width: 600px) {.flow-text {font-size: 1.392rem;}}
@media only screen and (min-width: 630px) {.flow-text {font-size: 1.416rem;}}
@media only screen and (min-width: 660px) {.flow-text {font-size: 1.44rem;}}
@media only screen and (min-width: 690px) {.flow-text {font-size: 1.464rem;}}
@media only screen and (min-width: 720px) {.flow-text {font-size: 1.488rem;}}
@media only screen and (min-width: 750px) {.flow-text {font-size: 1.512rem;}}
@media only screen and (min-width: 780px) {.flow-text {font-size: 1.536rem;}}
@media only screen and (min-width: 810px) {.flow-text {font-size: 1.56rem;}}
@media only screen and (min-width: 840px) {.flow-text {font-size: 1.584rem;}}
@media only screen and (min-width: 870px) {.flow-text {font-size: 1.608rem;}}
@media only screen and (min-width: 900px) {.flow-text {font-size: 1.632rem;}}
@media only screen and (min-width: 930px) {.flow-text {font-size: 1.656rem;}}
@media only screen and (min-width: 960px) {.flow-text {font-size: 1.68rem;}}
@media only screen and (max-width: 360px) {.flow-text {font-size: 1.2rem;}}

/* Unordered Lists */
ul.check, ul.checklist{list-style:none;}
ul.check li, ul.checklist li{padding-left:1.3em;}
ul.check li:before, ul.checklist li:before{content:"\2714";display:inline-block;margin-left:-1.3em;width:1.3em;}
ul.disc {list-style-type: disc;}
ul.square{list-style-type: square;}
ul.circle {list-style-type: circle;}
ul.disc, ul.square, ul.circle {padding:0;}
ul.diamond, ul.diamond ul, ul.triangle, ul.triangle ul, ul.brutal, ul.brutal ul, ul.check, ul.xmark, ul.xmark ul,
ul.heart, ul.heart ul, ul.sparkle, ul.sparkle ul, ul.burst, ul.burst ul,
ul.arrow, ul.fisheye, ul.fisheye ul, ul.bullseye, ul.bullseye ul, ul.lozenge, ul.lozenge ul { 
	list-style-type: none; padding: 0;
}
ul.diamond li, ul.triangle li {list-style-position: outside;}
ul.diamond li:before, ul.triangle li:before, ul.brutal li:before, ul.check li:before, ul.arrow li:before,
ul.heart li:before, ul.sparkle li:before, ul.burst li:before,
ul.fisheye li:before, ul.bullseye li:before, ul.lozenge li:before, ul.xmark li:before { 
	margin-right: 0.5em; 
}
ul.diamond li:before {content: '\25C6';}
ul.heart li:before {content:'\2764';}
ul.lozenge li:before {content: '\25C8';}
ul.sparkle li:before {content:'\2748';}
ul.triangle li:before {content: '\25B6';}
ul.brutal li {list-style-position: outside;}
ul.brutal li:before {content: '\25B0';}
ul.bullseye li:before {content: '\25CE';}
ul.burst li:before {content:'\2738';}
ul.fisheye li:before {content: '\25C9';}
ul.arrow li:before {content: '\27A4';}

.levelslist {list-style: none; margin:0; padding:0;}
.levelslist>li{margin: 0 0 1.25rem 0; padding: 0.5rem; border: 3px solid #d6b75a;
	width: 100%; background: #FFE874;
}
.levelslist>li>a{display:flex; flex-direction: row;}
.levelslist>li>a:link,.levelslist>li>a:visited{color: #3d2b1f;}
.levelslist>li>a:hover{color: #c29200;}
.level-thumb {width: 25%; max-width: 200px; margin-right: 1.15rem; position:relative;
	background-size: cover; background-position: center center; background-repeat: no-repeat;
	border: 2px solid #d6b75a; padding: 8px;
	-webkit-border-radius: 10% 33% 33% 0; border-radius: 10% 33% 33% 0;
}
.level-thumb>.lid {line-height: 140%; display:inline-block; margin-left:-2px;
	position:absolute; bottom: 0; left: 0; padding: 8px; text-align:left;
	font-size: 14px; text-align: center; font-weight: 700; 
	background: rgba(0,0,0,0.5); color: #fff; border: 2px solid #d6b75a;
	-webkit-border-radius: 4px 8px 8px 0px; border-radius: 4px 8px 8px 0px;
}
.level-thumb>.lid>span{font-size: 28px; font-weight: 900;}
.levelslist .attributes {list-style:none; padding:0; margin:0;}
.levelslist .attributes>li{display:inline-block; float:left; }
.levelslist .attributes>li.sector,.levelslist .attributes>li.sclass{
	width:80px; max-width: 80px; text-align:center; font-size: 16px; font-weight: 600; line-height: 130%;
	padding:0; margin: 0 8px 0 0; border-right: 1px solid #d6b75a;
}
.levelslist .attributes>li.sector>span,.levelslist .attributes>li.sclass>span{
	font-size: 32px; font-weight: 900;
}
.levelslist .tethered, .levelslist .secret {-webkit-border-radius: 999em; border-radius: 999em;
	font-size: 16px; line-height: 26px; padding: 6px 12px; color: #ffff00;
}
.levelslist .details .attributes .tethered{background-color: green;}
.levelslist .details h4 .secret{background-color: #ff0000;}
.levelslist .details h4 { 
	padding: 0 1em 0.25em 0.5em; border-left: 6px double #d6b75a; border-bottom: 2px solid #d6b74a;
	-webkit-border-radius: 0 0 0 0.5em; border-radius: 0 0 0 0.5em; flex-basis: 50%; min-width: 260px;
}
.levelslist .details .attributes .summary{font-weight:600;}

.level-headed { margin: 0; width: 100%; padding: 10vh 0 10vh 0; color:#000;
	background-size: cover; background-position: center center; background-repeat: no-repeat;
	display:flex; align-items: start; flex-direction: column; text-shadow: 2px 2px #fff;
}
.level-headed>.lid{font-size: 44px; line-height: 90%;
	width: 180px; flex-basis: 180px; text-align:center;
	border: 3px solid #a5782b; font-weight: 900; justify-content:space-around;
}
.level-headed>.lid span{ font-size: 22px; font-weight: 600;}
.level-headed>h1{padding:22px; border: 3px solid #a5782b;}
.level-headed>.glassmorph{padding: 1.5rem; text-align:center;}
.topsecret {
	background: #000; color: #ff0000; font-weight: 900; font-size: 1.25rem; line-height: 150%;
	border: 4px solid #ff0000; padding: 1.5rem; 
}
.topsecret>h4 {background: #ff0000; color: #000; margin:0; padding: 0;}
.level-info, .level-content h3>.fa{
	-webkit-border-radius: 8px; border-radius: 8px; border: 3px solid #d6b75a; 
}
.level-info {padding: 1.25rem;}
.level-info>ul{display: flex; flex-direction:column; list-style:none; margin:0; padding:0;}
.level-info>ul>li{padding: 8px 8px 4px 8px; margin:0; border-bottom: 2px solid #a5782b;
	font-weight: 900; font-size: 1.5rem; line-height: 90%;
}
.level-info .stable{background: #99edc3;}
.level-info .enviro{background: #fda50f;}
.level-info .xtreme{background: #e3242b; color: #ffff00;}
.level-info .beyond{background: #4252b4; color: #f7f9e0;}
.level-info .si, #seci, .si {background: #008ecc; color: #aae8fb;}
.level-info .st, #sect {background: #663399; color: #E3CEF6;}
.level-info .se, #sece {background: #01615f; color: #00ffcc;}
.level-info .sb, #secb {background: #6F4E37; color: #c2b280;}
.level-info .sa, #seca {background: #ad1457; color: #fda4ba;}
.level-info .ss, #secs {background: #5c4451; color: #D0A9F5;}
.level-info .sl, #secl {background: #151e3d; color: #ADD8E6;}
.level-info .sp, #secp {background: #808080; color: #e6e6e6;}
.level-info .sd, #secd {background: #544c4a; color: #d9dddc;}
.level-info .sn, #secn {background: #2C4F29; color: #afdaaf;}
.level-info .sr, #secr {background: #B43104; color: #F69A52;}
.level-info .so, #seco {background: #c29200; color: #ffdb58;}
.level-info .sg, #secg {background: #5a140c; color: #fda50f;}
.level-info .sh, #sech {background: #800000; color: #ff0000;}
.level-info .sc, #secc {background: #e3242b; color: #5e1914;}
.level-info .sy, #secy {background: #262223; color: #C0C0C0;}
.level-info .su {background: #FFF8E7; color: #68707d;}

.level-info>ul>li span{font-size: 2.5rem;}
.level-info>ul>li small{font-weight: 600; font-size: 1.15rem;}
.level-info>ul>li>i{display:inline-block; float:left; font-size: 40px; width: 54px; text-align:center; min-height: 60px; margin-right:6px;}
.level-content{font-size: 1.25rem; line-height: 150%;}
.level-content>h3,.ccm-faq-entry-content>h3, h3.headline{
	padding: 8px; -webkit-border-radius: 8px; border-radius: 8px;
	background: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 10px, rgba(0, 0, 0, 0.3) 10px, rgba(0, 0, 0, 0.3) 20px), url('imgs/olde-map.png');
}

.level-content>h3>.fa{display:inline-block; min-width: 66px; font-size: 44px !important;
	padding:8px; text-align:center; margin: 8px 12px 0 0; background: #d6b75a; border-color: #333;
}
.level-content>.summary{border: 8px double #d6b75a; color: #a5782b; 
	-webkit-border-radius: 8px; border-radius:8px; padding: 1rem;
}

#outer-sectors{background-size:cover; background-position: center center; background-repeat: no-repeat; transition:250ms;}
.secu {background-color: #68707d; background-image: url('https://backroomsframework.com/application/files/1717/5467/2433/endless-wastelands.jpg');}
.seci {background-color: #aae8fb; background-image: url('https://backroomsframework.com/application/files/3017/5466/7257/intertwined-heaven.jpg');}
.sect {background-color: #E3CEF6; background-image: url('https://backroomsframework.com/application/files/8417/5466/2801/twofold-space.jpg');}
.sece {background-color: #00ffcc; background-image: url('https://backroomsframework.com/application/files/2817/5459/4715/enigmatic-path.jpg');}
.secb {background-color: #c2b280; background-image: url('https://backroomsframework.com/application/files/3517/5458/8748/enchanted-stream.jpg');}
.seca {background-color: #fda4ba; background-image: url('https://backroomsframework.com/application/files/9617/5457/4153/pinktime-arboretum.jpg');}
.secs {background-color: #D0A9F5; background-image: url('https://backroomsframework.com/application/files/4717/5450/7948/spectral-room.jpg');}
.secl {background-color: #ADD8E6; background-image: url('https://backroomsframework.com/application/files/6617/5450/4830/liminal-mood.jpg');}
.secp {background-color: #262223; background-image: url('https://backroomsframework.com/application/files/6117/5449/0248/pandemonium-balance.jpg');}
.secd {background-color: #d9dddc; background-image: url('https://backroomsframework.com/application/files/7317/5449/3352/arcadiade.jpg');}
.secn {background-color: #afdaaf; background-image: url('https://backroomsframework.com/application/files/2217/5450/2363/natural-waterpark.jpg');}
.secr {background-color: #F69A52; background-image: url('https://backroomsframework.com/application/files/5417/5457/7626/rigid-realm-rusty.jpg');}
.seco {background-color: #ffdb58; background-image: url('https://backroomsframework.com/application/files/5717/5458/6749/ordered-cityscape.jpg');}
.secg {background-color: #fda50f; background-image: url('https://backroomsframework.com/application/files/1517/5459/0387/grounded-grounds.jpg');}
.sech {background-color: #ff0000; background-image: url('https://backroomsframework.com/application/files/2617/5459/5746/hades-horror.jpg');}
.secc {background-color: #800000; background-image: url('https://backroomsframework.com/application/files/5017/5466/3594/chaotic-sea-hellscape.jpg');}
.secy {background-color: #C0C0C0; background-image: url('https://backroomsframework.com/application/files/1817/5466/6891/abysmal-valley.jpg');}

/* PIE NAV */
#outer-sectors {display:block; width: 100vw; padding: 15vh 0 15vh 0;}
.pie-outer a, .pie-outer a:active, .pie-outer a:visited { color:#c30; }
.pie-outer a:hover, .pie-outer a:focus { color:#666; text-decoration:none; }
.pie-outer *, .pie-outer { padding:0; margin:0 }
.pie-outer { position:relative; padding-top:100%; margin:auto; }
.pie8, .pie4 {
	pointer-events:none; position:absolute; top:50%; left:50%; overflow:hidden; border:2px solid #000;
	-webkit-border-radius: 50%; border-radius:50%; font-weight: 900;
	/* angle = (360 / num of segments), rotate = (90 - (angle / 2)) */
	-webkit-transform:translate(-50%,-50%) rotate(72deg); -ms-transform:translate(-50%,-50%) rotate(72deg); transform:translate(-50%,-50%) rotate(72deg); 
	}
.pie8 ul, .pie4 ul { list-style-type:none; }
.pie4 ul:after, .pie8 ul:after { content:" "; display:block; width:100%; padding-top:100%; }
.pie8 li, .pie4 li {
	position:absolute; top:-50%; left:-50%;
	width:100%; height:100%; margin-left:-2px; margin-top:-2px;
	overflow:hidden; border:1px solid #000;
	-webkit-transform-origin:100% 100%; -ms-transform-origin:100% 100%; transform-origin:100% 100%;
} 
.pie4.gray ul {
	animation-iteration-count: infinite;
	animation-timing-function: linear; 
	animation-name: spin; animation-duration: 11000ms;
}
@keyframes spin { 
	from { transform:rotate(0deg);-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);}
	to { transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg);}
}
.pie4.gray li {border:none;}
.pie8 li:nth-child(1) { -webkit-transform:rotate(0deg) skew(45deg); -ms-transform:rotate(0deg) skew(45deg); transform:rotate(0deg) skew(45deg); }
.pie8 li:nth-child(2) { -webkit-transform:rotate(45deg) skew(45deg); -ms-transform:rotate(45deg) skew(45deg); transform:rotate(45deg) skew(45deg); } 
.pie8 li:nth-child(3) { -webkit-transform:rotate(90deg) skew(45deg); -ms-transform:rotate(90deg) skew(45deg); transform:rotate(90deg) skew(45deg); } 
.pie8 li:nth-child(4) { -webkit-transform:rotate(135deg) skew(45deg); -ms-transform:rotate(135deg) skew(45deg); transform:rotate(135deg) skew(45deg); } 
.pie8 li:nth-child(5) { -webkit-transform:rotate(180deg) skew(45deg); -ms-transform:rotate(180deg) skew(45deg); transform:rotate(180deg) skew(45deg); } 
.pie8 li:nth-child(6) { -webkit-transform:rotate(225deg) skew(45deg); -ms-transform:rotate(225deg) skew(45deg); transform:rotate(225deg) skew(45deg); } 
.pie8 li:nth-child(7) { -webkit-transform:rotate(270deg) skew(45deg); -ms-transform:rotate(270deg) skew(45deg); transform:rotate(270deg) skew(45deg); } 
.pie8 li:nth-child(8) { -webkit-transform:rotate(315deg) skew(45deg); -ms-transform:rotate(315deg) skew(45deg); transform:rotate(315deg) skew(45deg); } 
.pie8 li:nth-child(9) { -webkit-transform:rotate(360deg) skew(45deg); -ms-transform:rotate(360deg) skew(45deg); transform:rotate(360deg) skew(45deg); }
.pie4 li:nth-child(1) { -webkit-transform:rotate(0deg) skew(0deg); -ms-transform:rotate(0deg) skew(0deg); transform:rotate(0deg) skew(0deg); }
.pie4 li:nth-child(2) { -webkit-transform:rotate(90deg) skew(0deg); -ms-transform:rotate(90deg) skew(0deg); transform:rotate(90deg) skew(0deg); } 
.pie4 li:nth-child(3) { -webkit-transform:rotate(180deg) skew(0deg); -ms-transform:rotate(180deg) skew(0deg); transform:rotate(180deg) skew(0deg); } 
.pie4 li:nth-child(4) { -webkit-transform:rotate(270deg) skew(0deg); -ms-transform:rotate(270deg) skew(0deg); transform:rotate(270deg) skew(0deg); } 
.pie8 a, .pie4 a{
	pointer-events:auto; font-size:2.125vw; line-height:4.35;
	display:block; position:absolute; top:50%; left:50%; width:100%; height:100%;
}
.pie8 a { 
	text-decoration:none; text-align:center; color:#fff; -webkit-tap-highlight-color:rgba(0,0,0,0); 
	/* angle = (360 / num of segments), skew = (angle - 90), rotate = (angle / 2 - 90) */
	-webkit-transform:skew(-45deg) rotate(-67deg); -ms-transform:skew(-45deg) rotate(-67deg); transform:skew(-45deg) rotate(-67deg);
}
.pie4 a { 
	text-decoration:none; text-align:center; color:#fff; -webkit-tap-highlight-color:rgba(0,0,0,0); 
	/* angle = (360 / num of segments), skew = (angle - 90), rotate = (angle / 2 - 90) */
	-webkit-transform:skew(0deg) rotate(-45deg); -ms-transform:skew(0deg) rotate(-45deg); transform:skew(0deg) rotate(-45deg);
}
.pie8 a:hover, .pie4 a:hover { background:rgba(255,255,255,0.25); }
.pie8.black,.pie4.black { width:100%; background:#333; }
.pie8.teal,.pie4.teal { width:80%; background:teal; }
.pie8.gray,.pie4.gray { width:60%;
background-color: hsla(220.9090909090909, 30%, 14%, 1);
    background-image: radial-gradient(circle at 0% 5%, hsla(225.00000000000003, 56%, 60%, 0.7) 3.1210986267166043%, transparent 40%), radial-gradient(circle at 23% 3%, hsla(210.4411764705882, 96%, 48%, 0.37) 3.1210986267166043%, transparent 76.4190383017679%), radial-gradient(circle at 100% 93%, hsla(186.61764705882354, 70%, 55%, 0.21) 3.1210986267166043%, transparent 45.38487571252063%), radial-gradient(circle at 96% 103%, hsla(120.44117647058823, 76%, 39%, 0.1) 3.1210986267166043%, transparent 50.0047517726123%), radial-gradient(circle at 80% 0%, hsla(158.82352941176472, 80%, 48%, 0.23) 3.1210986267166043%, transparent 24.819747276612727%);
    background-blend-mode: normal, normal, normal, normal, normal;
}
@media ( min-width:42em ) { /* #### - > 672px - #### */
	.pie-outer { padding-top:0; width:40em; height:40em; }
	.pie8 a, .pie4 a { font-size:1em; }
}
@media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) { /* IE10+ only */
	.pie-outer { padding-top:0; width:auto; height:auto; border:2px solid #000; border-right-width:1px; border-bottom-width:0 }
	.pie, .pie8, .pie4 { top:auto; left:auto; border:0; border-radius:0; width:auto }
	.pie, .pie li, .pie a, .pie8, .pie8 li, .pie8 a, .pie4 li, .pie4 a { position:relative; -webkit-transform:none !important; -ms-transform:none !important; transform:none !important }
	.pie ul, .pie8 ul, .pie4 ul { border:0 }
	.pie ul:after, .pie8 ul:after, .pie4 ul:after { display:none }
	.pie li, .pie8 li, .pie4 li { float:left; display:inline; top:auto; left:auto; width:10%; border-bottom-width:2px }
	.pie a, .pie8 a, .pie4 a { left:auto; font-size:1em }
}

/* MODALS */
.modal { display: none; }
.vanilla-modal .modal {
  display: block; position: fixed;
  content: ""; top: 0; left: 0;
  right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: -1; opacity: 0;
  transition: opacity 0.2s, z-index 0s 0.2s;
  text-align: center;
  overflow: hidden; overflow-y: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}
.vanilla-modal .modal > * {
  display: inline-block; white-space: normal;
  vertical-align: middle; text-align: left;
}
.vanilla-modal .modal:before {
  display: inline-block; overflow: hidden;
  width: 0; height: 100%;
  vertical-align: middle; content: "";
}
.vanilla-modal.modal-visible .modal { z-index: 9999; opacity: 1; transition: opacity 0.2s; }
.modal-inner {
  position: relative; overflow: hidden;
  max-width: 90%; max-height: 90%;
  overflow-x: hidden; overflow-y: auto;
  background: rgba(0,0,0,0);
  z-index: -1; opacity: 0; transform: scale(0);
  transition: opacity 0.2s, transform 0.2s, z-index 0s 0.2s;
}
.modal-visible .modal-inner {
  z-index: 10000; opacity: 1; transform: scale(1);
  transition: opacity 0.2s, transform 0.2s;
}
.modal-inner::-webkit-scrollbar {width: 16px;}
.modal-inner::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #333; background: #e6e6e6;
}
.modal-inner::-webkit-scrollbar-thumb {background: #6e6e6e;  border-radius: 8px;}
.modal-inner::-webkit-scrollbar-thumb:hover { background: #424242; }
[data-modal-close] {
  position: sticky; position: -webkit-sticky;
  z-index: 10003; right: 0; top: 0; display: inline-block;
  width: 32px; height: 32px; line-height: 32px;
  font-size: 22px; font-weight: 600; float:right;
  cursor: pointer; text-align: center;
  background: #fff; color: #000;
  box-shadow: -1px 1px 2px rgba(0,0,0,0.2);
}
[data-modal-close]:hover { color: #fff; background: #000; }

/* SECTORS MODALS */
.sector-info{width: 100%; text-align:center; padding: 15px; font-family: 'Lucida Console', Monaco, monospace;}
.sector-info>h4 {font-weight: 900; font-size: 34px; display:block; width: 100%; line-height:90%;
	border: 2px solid #d6b75a; -webkit-border-radius: 6px; border-radius: 6px; padding: 8px 8px 14px 8px;
}
.sector-info>h4 span{font-size: 24px; font-weight: 600;}
.sector-info>p {display:block; width: 100%; font-size: 16px; line-height: 160%; font-weight: 600; margin: -8px 0 14px 0;}
.sector-info>p.energy span{font-size: 22px; font-weight: 900; font-family: arial, sans-serif; 
	padding: 4px 8px; -webkit-border-radius: 50%; border-radius: 50%; 
	border: 2px solid #d6b75a; color: #d6b75a; background: #2e2e2e;
}
.sector-info>a{display:block; width: 100%; 
	-webkit-border-radius: 8px; border-radius:8px; font-size: 20px;
	background: #2e2e2e; color: #ffbbff;
}

/* Liminal Headings */
.lp-r-monoyellow {
  color: #a5782b; border-bottom: 16px double #a5782b;
  background: repeating-radial-gradient(circle, #FFFCA1, #FFFCA1 10px, #fcf888 8px, #fcf888 16px);
}
.glassmorph { background: linear-gradient(107.18deg, rgba(255, 255, 255, 0.5) 1.84%, rgba(255, 255, 255, 0.2) 100%); 
	backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}

/* FAQs Block */
.ccm-faq-block-links{font-weight:600; font-size: 1.15rem; }
.ccm-faq-block-links a{ border-bottom: 2px solid #a5782b; transition: 0.3s ease-in-out;}
.ccm-faq-block-links a:link, .ccm-faq-block-links a:visited{}
.ccm-faq-block-links a:hover {border-left: 6px double #a5782b; padding-left: 1rem; background: #e6e6e6; color: #a5782b;}
.ccm-faq-entry-content{font-size: 1.25rem; line-height: 150%;}