@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');



@import url('https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

:root {
	scroll-behavior: smooth;

	--mcds-alert-danger-bg: #b02a37;
	--mcds-alert-danger-text: #f8d7da;
	--mcds-alert-danger-border: hsl(354, 61%, 27%);

	--mcds-alert-success-bg: #146c43;
	--mcds-alert-success-text: #d1e7dd;
	--mcds-alert-success-border: hsl(152, 69%, 35%);

	--mcds-connected-color: #0cd316;
	--mcds-disconnected-color: #ff3939;

	--bootstrap-rgb: rgb(113,44,249);
	--bootstrap-rgba: rgb(113,44,249, 1);

	--theme1: rgb(88, 101, 242);
	--theme2: rgb(50,50,50);

	--theme-primary: var(--theme2);

	--theme-primary-numbers: 113,44,249;

}




@-webkit-keyframes rainbowborder {
	0% {border-color: hsl(0, 100%, 50%);}
	14% {border-color: hsl(30,100%,50%);}
	28% {border-color: hsl(60,100%,50%);}
	42% {border-color: hsl(120,100%,50%);}
	56% {border-color:  hsl(240,100%,50%);}
	70% {border-color: hsl(280,100%,50%);}
	84% {border-color: hsl(320,100%,50%);}
	100% {border-color: hsl(255, 100%, 50%);}
  }

  .border-rainbow {
  border: 2px solid hsl(0, 100%, 50%);
  -webkit-animation: rainbowborder 3.3s infinite alternate; }

body {
	
	/*font-family: 'Ubuntu', sans-serif;*/
	font-family: 'Noto Sans', sans-serif;
	user-select: none;
	height: 100%;
	width: 100%;
	background-color: var(--bs-body-bg);
	/*background-color: #eee; was 121212  */
	background-color: #eee;
	background-image: url("../images/backgrounds/diamond_light.png");
	background-repeat: repeat;
	background-attachment: fixed;
}

[data-bs-theme=dark] body {
	background-color: #181a1d;
	background-image: url("../images/backgrounds/diamond_dark.png");
}


[data-bs-theme=light] body {
	background-color: #eee;
	background-image: url("../images/backgrounds/diamond_light.png");
  }


.font-mono {
	
}

.font-emojii {
	font-family: "Noto Color Emoji", sans-serif;
	font-weight: 400;
	font-style: normal;
}


.hidden {
	display: none !important;
  }

  
  /*
  [data-bs-theme=dark] .alert-danger {
	--bs-alert-bg: var(--mcds-alert-danger-bg);
	--bs-alert-color: var(--mcds-alert-danger-text);
    --bs-alert-border-color: var(--mcds-alert-danger-border);
    --bs-alert-link-color: var(--mcds-alert-danger-text);
}

[data-bs-theme=dark] .alert-success {
	--bs-alert-bg: var(--mcds-alert-success-bg);
	--bs-alert-color: var(--mcds-alert-success-text);
    --bs-alert-border-color: var(--mcds-alert-success-border);
    --bs-alert-link-color: var(--mcds-alert-success-text);
}
*/


[data-bs-theme=dark] {
	color-scheme: dark;
}

[data-bs-theme=light] {
	color-scheme: light;
}

#bd-theme {
	color: var(--bs-warning);
}


@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
     }
}

.card-bodywerwefe {
	animation: fadeInAnimation ease 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: backwards;
}



/* Revert container size from Bootstrap 4 */
@media (min-width: 1400px) {
    .container {
        max-width: 1140px;
    }
}

li:nth-child(odd)#liUser {
  background-color: #f7f7f7;
}
li#liUser {
	color: #4d4d4d;
}

li:hover#liUser {
	filter: invert(0.03);
	color: #000;
}

.text-shadow {
	text-shadow: 4px 4px 8px #000;
}


.bg-rainbowww {
	background-image: 
	  linear-gradient(to right, red,orange,yellow,rgb(0, 255, 0),rgb(0, 140, 255),rgb(111, 0, 190),violet, red); 
	-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;  
	animation: rainbow-animation 400s linear infinite;
  }
  
  @keyframes rainbow-animation {
	  to {
		  background-position: 4500vh;
	  }
  }

.bg-rainbow {
	color: #fff;
    background: linear-gradient(270deg, #c500ff, #00a3ff, #00d311, #f9ff05, #f38e00, #e11111);
    background-size: 1200% 1200%;

    -webkit-animation: rainbow 7s ease infinite;
    -moz-animation: rainbow 7s ease infinite;
    animation: rainbow 7s ease infinite;
}

@-webkit-keyframes rainbow {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes rainbow {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes rainbow {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}


.bg-brown-gradient {
    background: linear-gradient(270deg, #ac7e60, #a67556, #956a4e, #805b43, #704f3a, #604432, #50382a, #3a291e);
    background-size: 1200% 1200%;

    -webkit-animation: bg-brown-animated 7s ease infinite;
    -moz-animation: bg-brown-animated 7s ease infinite;
    animation: bg-brown-animated 7s ease infinite;
}

@-webkit-keyframes bg-brown-animated {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes bg-brown-animated {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes bg-brown-animated {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

  
.shiftBox {
	/* background-color: #fbfbfb;
	border-radius: 6px;
	border: 1px solid #dfdfdf;
	cursor: pointer;
	text-align: center;
	color: #4d4d4d;*/
	background-color: var(--bs-light-bg-subtle);
	cursor: pointer;
}

.displayBox {
	/*background-color: #fcfcfc;
	border: 1px solid rgba(0,0,0,0.1);
	color: #4f4f4f; was 4d4d4d */
	background-color: var(--bs-light-bg-subtle);
	cursor: pointer;
}

.displayBox2 {
	/*background-color: #fcfcfc;
	border: 1px solid rgba(0,0,0,0.1);
	color: #4f4f4f; was 4d4d4d */
	background-color: var(--bs-light-bg-subtle);
}

.displayBox:hover {
	/*background-color: rgba(0,0,0,0.05);*/
	filter: invert(0.03);
}

.displayBox:active {
	/*background-color: rgba(0,0,0,0.1);*/
	filter: invert(0.08);
}

.shiftBox a { all: unset;  }
.displayBox a { all: unset;  }

.isWorking {
	background-image: url("../images/green_circle.png");
	background-size: auto 10%;
	background-position: bottom 12px right 12px;
	background-repeat: no-repeat;
}

.isMe {
	background-color: #28a745;
	color: #fff;
}

.shiftBox:hover {
	/*background-color: rgba(0,0,0,0.05);*/
	filter: invert(0.03);
}

.shiftBox:active {
	/*background-color: rgba(0,0,0,0.1);*/
	filter: invert(0.08);
}
  
.bg-rainbow a {
	color: #fff; 
}

.text-cw {
	color: #A1A1A1;
}

/*
.shiftBox {
	background-color: #fafafa;
	color: #4d4d4d;
	cursor: pointer;
}

.shiftBox:hover {
	background-color: rgba(255,255,255.35);
}
*/
  
/*input[type=text]:focus, input[type=password]:focus {
  background-color: #000;
}
*/

.bg-day {
	background-color: #e0ffe7;
}

.abg-green {
    background: linear-gradient(270deg, #e0ffe7, #caffd6, #b1ffc3, #9cffb4);
    background-size: 800% 800%;

    -webkit-animation: abg-green 4s ease infinite;
    -moz-animation: abg-green 4s ease infinite;
    animation: abg-green 4s ease infinite;
}

@-webkit-keyframes abg-green {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes abg-green {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes abg-green {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

.nav-link-mcds {
	color: var(--bs-nav-link-color);
}

#footer-links {
		font-size: 0.8em;
		font-weight: bold;
}

#footer-links a:hover, .btn-mystuff:hover, .btn-myschedule:hover, .btn-sage:hover, .btn-ourlounge:hover {
	filter: invert(0.1);
}

img.emoji {
	width:1.2em;
	pointer-events: none;
	/*display: inline !important;
         border: none !important;
         box-shadow: none !important;
         height: 1em !important;
         width: 1em !important;
         margin: 0 .07em !important;
         vertical-align: -0.1em !important;
         background: none !important;
         padding: 0 !important;
         pointer-events: none*/
}

.bg-poo {
	background-color: #967969;
}

.bg-transfer {
	background-color: #65416F;
}

.bg-alert {
	background-image: url('../images/emoji_warning_01.png');
	background-color: #CA0000;
	background-size: 10%;
	background-repeat: no-repeat;
	background-position: 95%;
	color: #fff;
}




.nav__weeks {
    width: 100%;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    background-color: rgba(255, 255, 255, 0.35);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
    display: flex;
    overflow-x: auto;
}

.navm {
    position: fixed;
    bottom: 0;
    width: 100%;
    display: flex;
    overflow-x: auto;
	z-index: 9999;

	background-color: rgba(255, 255, 255, 0.3);
	
}

.nav__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	padding: 12px 5px 12px 5px;
    flex-grow: 1;
    width: 20%;
    overflow: hidden;
    white-space: nowrap;
    font-family: sans-serif;
    font-size: 0.7rem;
    color: rgb(150, 150, 150); /*was 333*/
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    transition: background-color 0.1s ease-in-out;
}

/* .nav__link:hover {
    background-color: var(--theme1);
	color: #FFFFFF;
} */

.nav__link:hover {
    color: inherit;
}

.nav__link--active, .nav__link--active:hover {
    color: var(--theme1);
	font-weight: bold;
}


.nav__icon {
    font-size: 1.4rem;
} 










.nav2__parent {
	display: flex;
	align-items: center;
	justify-content: center;
  }

.nav2 {
    position: fixed;
    bottom: 1.6em;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    background-color: rgba(255, 255, 255, 1); /* 0.35 */
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
    display: flex;
    overflow-x: auto;
	z-index: 999;

	
}

.nav2__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
    width: 20%;
	padding: 8px 16px 8px 16px;
    overflow: hidden;
    white-space: nowrap;
    font-family: sans-serif;
    font-size: 0.7rem;
    color: #555;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    transition: background-color 0.1s ease-in-out;
}

.nav2__link:hover {
    background-color: var(--theme1);
	color: #FFFFFF;
}

.nav2__link--active {
    color: var(--theme1);
	font-weight: bold;
}

.nav2__icon {
    font-size: 1.4rem;
} 

.nav2__text {
	margin-top: 0.2em;
}


.nav2__shadow {
	-webkit-box-shadow: 0px 0px 6px 1px rgba(88,101,242,0.4);
-moz-box-shadow: 0px 0px 6px 1px rgba(88,101,242,0.4);
box-shadow: 0px 0px 6px 1px rgba(88,101,242,0.4);
}






#header__container {
  display: none;
}

#nav__mobile, #nav2__mobile, #navbarLogoMiddle, #topBarMobile {
	display: none;
}

@media (min-width: 992px) {
	/*#header__container {
		display: block;
	}*/

	#navbarDesktopTop {
		display: block;
	}
	#navbarMobileTop {
		display: none;
	}

	#liveStatusCard {
		display: block;
	}

	#topBarMobile {
		display: none;
	}

	#topBar {
		display: flex;
	}
	
	
	#footer {
		margin-bottom: 60px;
	}
	
	#nav__brand {
	display: none;
	}
	
	#displayBoxColumnUsername, #displayBoxColumnShift, #displayBoxColumnShiftCw {
		text-align: center;
	}
	
	#displayBoxColumnShift {
		font-size: 0.94em;
	}
	
	#navbar-tinted {
		background: rgba(0,0,0,0.14);
	}
	
 }
 
 @media (max-width: 992px) {

	#navbarDesktopTop {
		display: none;
	}
	#navbarMobileTop {
		display: flex;
	}

	#liveStatusCard {
		display: none;
	}

	#nav__mobile {
		display: flex;
		
	}

	#nav2__mobile {
		display: flex;
		
	}

	#containerProfileLinks {
		width: 25%;
	}

	#navbarSupportedContent {
		display: none;
	}

	#navbarLogoMiddle {
		display: flex;
	}

	#topBarMobile {
		display: flex;
	}

	#topBar {
		display: none;
	}
	
	#navbar-tinted {
		background-color: var(--theme1);
	}
	
	.col#displayBoxColumn {
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
	}
	
	#footer {
		margin-bottom: 80px;
	}
	
	#displayBoxColumnContainer {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	#navbarstufftop {
		width: 100%;
		
	}

 }
 
 #displayBoxColumnDateShort {
		font-size: 0.9em;
	}
	


.shadow__nav {
  box-shadow: 0 0 6px 4px rgba(0, 0, 0, 0.3);
}
.shadow-top {
  clip-path: polygon(0% -20%, 100% -20%, 100% 100%, 0% 100%);
}
.shadow-right {
  clip-path: polygon(0% 0%, 120% 0%, 120% 100%, 0% 100%);
}
.shadow__bottom {
  clip-path: polygon(0% 0%, 100% 0%, 100% 120%, 0% 120%);
}
.shadow-left {
  clip-path: polygon(-20% 0%, 100% 0%, 100% 100%, -20% 100%);
}

.shadow-bottom-right {
  clip-path: polygon(0% 0%, 120% 0%, 120% 120%, 0% 120%);
}


.nav__username {
color: #FFFFFF;
text-shadow: 0 0 10px #FFFFFF;
color: #FFFFFF;
}

#container__center {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}


.bg-male {
	background-color: #005AFF;
}

.bg-female {
	background-color: #FF35E5;
}

.bg-nonbinary {
	background-color: #676767;
}

.bg-blue {
	background-color: #007EFF;
}

.bg-pink {
	background-color: #D923D3;
}

.bg-orange {
	background-color: #FF9000;
}

.bg-sick {
	background-color: #469F46;
}




.container-login {
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.card-login {
	width: 100%;
	max-width: 400px;
}


.container-cntr {
	height: calc(100vh - 250px);
	display: flex;
	align-items: center;
	justify-content: center;
}

.card-cntr {
	width: 100%;
	max-width: 400px;
}

.bg-rainbow-gradient {
	background: rgb(255,158,0);
	background: linear-gradient(90deg, rgba(255,158,0,1) 0%, rgb(255, 0, 0) 100%);
}


.bg-today-heading {
	background: #f7f7f7;
}

.bg-black {
	background-color: #222222;
}

/* */
.rainbow_text {
    background: linear-gradient(to right, #ff1a1a, #ff1a1a, #ff9900, #06c716, #00aeff, #b55bff, #b55bff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow_text_animation 8s ease-in-out infinite;
    background-size: 400% 100%;
	background-color: var(--bs-light-bg-subtle);
}

@keyframes rainbow_text_animation {
    0%,100% {
        background-position: 0 0;
    }

    50% {
        background-position: 100% 0;
    }
}



.rainbow_text_2 {
	background-image: 
	  linear-gradient(to right, #ff1a1a, #ff1a1a, #ff9900, #06c716, #00aeff, #b55bff, #b55bff); 
	-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;  
	animation: moveText 100s linear infinite;
  }
  
  @keyframes moveText {
	  to {
		  background-position: 4500vh;
	  }
  }
  

  .bg-gradient-yellow-pink {
	background-color: #FBAB7E;
	background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);
	
  }


  .rainbow_ai {
    animation: rainbowai 10s linear infinite alternate;
  }

  @keyframes rainbowai {
    0% { color: #f22; }
    10% { color: #f2f; }
    20% { color: #22f; }
    30% { color: #2ff; }
    40% { color: #2f2; }
    50% { color: #ff2; }
    60% { color: #f22; }
    70% { color: #f2f; }
    80% { color: #22f; }
    90% { color: #2ff; }
    100% { color: #2f2; }
  }


  .bg-rainbow-static {
	background: linear-gradient(
        90deg,
        rgba(255, 0, 0, 1) 0%,
        rgba(255, 154, 0, 1) 10%,
        rgba(208, 222, 33, 1) 20%,
        rgba(79, 220, 74, 1) 30%,
        rgba(63, 218, 216, 1) 40%,
        rgba(47, 201, 226, 1) 50%,
        rgba(28, 127, 238, 1) 60%,
        rgba(95, 21, 242, 1) 70%,
        rgba(186, 12, 248, 1) 80%,
        rgba(251, 7, 217, 1) 90%,
        rgba(255, 0, 0, 1) 100%
    );
  }

  .bg-gradient-blues {
	background: rgb(59,191,255);
	background: linear-gradient(90deg, rgba(59,191,255,1) 0%, rgba(0,168,255,1) 60%, rgba(0,116,255,1) 100%);
  }

  .text-gradient-blues {
	background-image: linear-gradient(90deg, rgba(59,191,255,1) 0%, rgba(0,168,255,1) 60%, rgba(0,116,255,1) 100%);
	background-clip: text;
	color: transparent;
  }

  .bg-gradient-discord {
	background: rgb(89, 102, 243);
	background: linear-gradient(90deg, rgb(124, 134, 241) 0%, rgba(89, 102, 243,1) 50%);
  }

  .bg-gradient-bootstrap {
	background: var(--bootstrap-rgb);
	background: linear-gradient(90deg, rgb(179, 141, 255) 0%, var(--bootstrap-rgba) 70%);
  }


.bg-age{
	background: rgb(255,126,218);
	background: linear-gradient(90deg, rgba(255,126,218,1) 0%, rgba(202,86,255,1) 60%, rgba(128,86,255,1) 100%);
}

.bg-banned {
	background: rgb(207,0,0);
	background: linear-gradient(90deg, rgba(207,0,0,1) 0%, rgba(172,0,0,1) 50%);
}








  .search-box {
	position: relative;
	display: block;
	overflow: hidden;
  }
  
  .search-box input[type="text"] {
	border: none;
	padding: 10px 40px 10px 20px;
  }
  
  .search-box .search-icon {
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	font-size: 20px;
  }
  
  



  .connected {
	height:0.8em;
	width:0.8em;
	display:block;
	border-radius:50%;
	background-color: var(--mcds-connected-color);
	animation:pulse-connected 1500ms infinite;
  }

  .disconnected {
	height:0.8em;
	width:0.8em;
	display:block;
	border-radius:50%;
	background-color: var(--mcds-disconnected-color);
  }

@keyframes pulse-connected{
  0%{
    box-shadow: var(--mcds-connected-color) 0 0 0 0;
  }
  75%{
    box-shadow:#ff69b400 0 0 0 0.6em;
  }
}


#overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 9999;
	display: none;
}



.hr-surrounding {
  display: inline-block;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  padding: 0 10px;
}

/*
.bg-nonhome-gradient {
	background: rgb(255,102,228);
	background: linear-gradient(90deg, rgba(255,102,228,1) 0%, rgba(88,101,242,1) 70%);
}*/

  
  #loading-screen {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #eee;
	background-image: url("../images/bg_main_01.png");
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
}

[data-bs-theme=dark] #loading-screen {
	background-color: #181a1d;
	background-image: url("../images/bg_main_08.png");
}


[data-bs-theme=light] #loading-screen {
	background-color: #eee;
	background-image: url("../images/bg_main_01.png");
  }

/* Add CSS styles to hide the loading screen */
.hide {
	display: none;
}














.circle-image-container {
	width: 5em; /* Adjust the size of your circular image container */
	height: 5em; /* Make sure the width and height are equal for a perfect circle */
	position: relative; /* Position relative to this container */
  }
  
  .circle-image {
	width: 100%;
	height: 100%;
	border-radius: 50%; /* Make it circular */
	overflow: hidden; /* Hide anything that overflows the circular container */
  }
  
  .circle-image img {
	width: 100%;
	height: 100%;
	object-fit: cover; /* Maintain image aspect ratio while covering the circle */
  }
  
  .status-indicator {
	position: absolute; /* Position absolute relative to the circle-image container */
	bottom: 5px; /* Adjust the distance from the bottom of the circle-image container */
	right: 5px; /* Adjust the distance from the right of the circle-image container */
	border-radius: 50%; /* Make it circular */
	z-index: 1; /* Ensure the dot is above the circular image */
  }
  

.bg-storetitle {
	background: rgb(255,255,255);
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.2) 90%);
}



.bg-topbar {
	background-color: rgba(248, 249, 250, 0.3);
}

.navbar-nav .nav-link.active {
	color: var(--theme-primary);
}

.dropdown-item.active, .dropdown-item:focus, .dropdown-item-span.active, .dropdown-item-span:focus {
	background-color: var(--theme-primary);
	color: #fff;
	font-weight: bold;
}

[data-bs-theme=dark] .topbar-icon {
	color: #fff;
  }

  [data-bs-theme=light] .topbar-icon {
	color: var(--theme-primary);
  }


  [data-bs-theme=dark] .bg-topbar {
    background-color: rgba(33, 37, 41, 0.6);
  }

[data-bs-theme=light] .bg-topbar {
    background-color: rgba(248, 249, 250, 0.6);
}

[data-bs-theme=light] .nav-link .active {
	color: var(--theme-primary);
}

[data-bs-theme=dark] .navm_colour {
    background-color: rgba(33, 37, 41, 0.6);
}

[data-bs-theme=light] .navm_colour {
    background-color: rgba(248, 249, 250, 0.6);

}

.bg-blur {
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}




.nav-pills > .nav-item > .nav-link.active {
	font-weight: bold;
  }

  .nav-pills > .nav-item > #cwtabmg.nav-link {
	color: rgba(var(--bs-brp-blue-rgb));
  }

  .nav-pills > .nav-item > #cwtabmg.nav-link.active {
	background-color: rgba(var(--bs-brp-blue-rgb));
	color: rgba(var(--bs-tertiary-bg-rgb));
  }

  .nav-pills > .nav-item > #cwtabcm.nav-link {
	color: rgba(var(--bs-brp-pink-rgb));
  }

  .nav-pills > .nav-item > #cwtabcm.nav-link.active {
	background-color: rgba(var(--bs-brp-pink-rgb));
	color: rgba(var(--bs-tertiary-bg-rgb));
  }

  .nav-pills > .nav-item > #cwtabda.nav-link {
	color: rgba(var(--bs-brp-orange-rgb));
  }

  .nav-pills > .nav-item > #cwtabda.nav-link.active {
	background-color: rgba(var(--bs-brp-orange-rgb));
	color: rgba(var(--bs-tertiary-bg-rgb));
  }
  
  


  .nav-tabs > .nav-item > .nav-link.active {
	font-weight: bold;
  }
  




.bg-glass {
	backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(209, 213, 219, 0.3);
}

[data-bs-theme=dark] .bg-glass {
	backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(33, 37, 41, 0.75);
    border: 1px solid rgba(255, 255, 255, 0.125);
}

[data-bs-theme=light] .bg-glass {
	backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(209, 213, 219, 0.3);
}


.nav-pills > .nav-item > .clockWeek.nav-link {
	color: rgba(var(--bs-mcds-blue-rgb));
  }

  .nav-pills > .nav-item > .clockWeek.nav-link.active {
	background-color: rgba(var(--bs-mcds-blue-rgb));
	color: rgba(var(--bs-light-rgb));
  }






  .hr-text {
	display: flex;
	align-items: center;
	text-align: center;
	color: #333;
  }

  .hr-text::before,
  .hr-text::after {
	content: '';
	flex: 1;
	border-bottom: 1px solid #333;
  }

  .hr-text::before {
	margin-right: 10px;
  }

  .hr-text::after {
	margin-left: 10px;
  }



  [data-bs-theme=dark] .badge-bg-roygbiv-r {
	background-color: #FF5F5F;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=light] .badge-bg-roygbiv-r {
	background-color: #E57373;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=dark] .badge-bg-roygbiv-o {
	background-color: #FFA34D;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=light] .badge-bg-roygbiv-o {
	background-color: #FFB74D;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=dark] .badge-bg-roygbiv-y {
	background-color: #FFD24D;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=light] .badge-bg-roygbiv-y {
	background-color: #FFD54F;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=dark] .badge-bg-roygbiv-g {
	background-color: #4DFF88;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=light] .badge-bg-roygbiv-g {
	background-color: #81C784;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=dark] .badge-bg-roygbiv-b {
	background-color: #4D8FFF;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=light] .badge-bg-roygbiv-b {
	background-color: #64B5F6;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=dark] .badge-bg-roygbiv-i {
	background-color: #7D4DFF;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=light] .badge-bg-roygbiv-i {
	background-color: #7986CB;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=dark] .badge-bg-roygbiv-v {
	background-color: #C14DFF;
	color: var(--bs-body-bg);
  }

  [data-bs-theme=light] .badge-bg-roygbiv-v {
	background-color: #BA68C8;
	color: var(--bs-body-bg);
  }