:root {
	--blue: #2b3aff;
	--blue-dark: #2634f7;
	--blue-light: #3040ff;
	--blue-disabled: #6578df;
	--blue-rgb: 43, 58, 255;
}

/* Colors from palets */

.navLinkActive {
	background-color: #e2e3ff;
	border-radius: 16px;
	color: #2b3aff !important;
}

.navLinkActive i {
	font-size: 16px !important;
	color: #2b3aff !important;
}

.icon-bg {
	color: #172b4d !important;
}

.dot-danger {
	height: 10px;
	width: 10px;
	background-color: #dd4b39;
	border-radius: 50%;
	display: inline-block;
}

.dot-success {
	height: 10px;
	width: 10px;
	background-color: #72cca4;
	border-radius: 50%;
	display: inline-block;
}

.hideElement {
	display: none !important;
}

.cardHeightPlayer {
	min-height: 200px;
}

.noBorderTable {
	border-top: 0px !important;
}

@media (min-width: 991px) {
	.hideBig {
		display: none !important;
	}
}

@media (max-width: 991px) {
	.hideSmall {
		display: none !important;
	}
}

.overCardHeader {
	font-size: 1.5rem;
}

.card-title-user {
	font-size: 1rem;
	margin-bottom: 0px;
}

.zindex {
	z-index: 9;
	text-align: center;
	position: absolute;
}

.feedbackBTN {
	min-width: 140px !important;
}

@media (max-width: 991px) {
	.mt-sm-5 {
		margin-top: 3rem !important;
	}
}

@media (max-width: 991px) {
	.mt-sm-10 {
		padding-top: 50px !important;
		padding-bottom: 50px !important;
	}
}

@media (max-width: 768px) {
	.mt-sm-10-border {
		border-bottom: 1px solid #dee2e5;
	}
}

.cardPlayer {
	margin-bottom: 15px !important;
	margin-top: 15px !important;
}

.modal-button {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	padding: 0px !important;
	margin-right: 10px !important;
	width: 30px !important;
	height: 30px !important;
}

td.audioContainer {
	max-width: 175px !important;
}

audio {
	max-width: 200px;
	height: 30px;
}

audio::-webkit-media-controls-enclosure {
	flex-shrink: 0;
	bottom: 0;
	text-indent: 0;
	padding: 0;
	box-sizing: border-box;
	background-color: transparent;
}

audio::-webkit-media-controls-current-time-display {
	display: none;
}

audio::-webkit-media-controls-time-remaining-display {
	display: none;
}

audio::-webkit-media-controls-toggle-closed-captions-button {
	display: none;
}

audio::-webkit-media-controls-volume-slider-container {
	display: none;
}

audio::-webkit-media-controls-volume-slider-container:hover {
	display: none;
}

audio::-webkit-media-controls-volume-slider {
	display: none;
}

audio::-webkit-media-controls-mute-button {
	display: none;
}
audio::-webkit-media-controls-mute-button {
	display: none;
}

/* ClientPlayer */

.modal-button-volume {
	background-color: #f4623a !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	padding: 0px !important;
	margin-right: 10px !important;
	width: 40px !important;
	height: 40px !important;
	margin-left: 2rem;
	margin-right: 2rem;
	border-radius: 50%;
}

hr.divider {
	max-width: 8.25rem;
	border-width: 0.2rem;
	border-color: #212529;
}

hr.clientDivider {
	max-width: 8.25rem;
	border-width: 0.2rem;
	border-color: #212529;
}

.songNavigate {
	min-height: 8rem;
	min-width: 8rem;
	color: #f4623a;
	background-color: transparent !important;
	border: 3px;
	border-color: #f4623a;
	border-style: solid;
	border-radius: 50%;
}

@media (max-width: 768px) {
	.songNavigate {
		padding: 0px;
		min-height: 50px;
		min-width: 50px;
	}
	.colSongLeft {
		text-align: right !important;
	}
	.colSongRight {
		text-align: left !important;
	}
}

.songNavigate:hover {
	background-color: transparent !important;
	color: #f4623a;
}
.songNavigate:focus-within {
	background-color: transparent !important;
	color: #f4623a;
}
.songNavigate:focus {
	background-color: transparent !important;
	color: #f4623a;
}
.songNavigate:visited {
	background-color: transparent !important;
	color: #f4623a;
}
.songNavigate:active {
	background-color: transparent !important;
	color: #f4623a;
}

#seek-bar {
	width: 40rem;
	height: 5px;
	background-color: rgb(179, 179, 179);
	display: flex;
	border-radius: 50px;
	margin-left: 25px;
	cursor: pointer;
}

@media (max-width: 768px) {
	#seek-bar {
		width: 20rem;
	}
}

#fill {
	height: 5px;
	background-color: #f4623a;
	border-radius: 20px;
}
#handle {
	width: 8px;
	height: 8px;
	background-color: rgb(84, 84, 84);
	border-radius: 50%;
	margin-top: -1px;
	margin-left: -5px;
	transform: scale(2);
}

.clientPlayerBackground {
	height: 88vh;
	width: 95vw;
	display: flex !important;
	justify-content: center !important;
}

.stickyElement {
	position: sticky;
	bottom: 1rem;
	pointer-events: none;
}

.disclaimerFooter {
	position: fixed;
	bottom: 0;
	width: 80%;
}

@font-face {
	font-family: "leageSpartaReg";
	src: url("../fonts/LeagueSpartan-Regular.ttf") format("truetype");
}

.leageSparta {
	font-family: "leageSpartaReg";
}
.underLiner {
font-family: "leageSpartaReg";
font-style: normal;
font-weight: 300;
font-size: 21.8462px;
line-height: 20px;
display: flex;
align-items: center;

/* BLACK TXT ICON */
color: #344767;


}

.btn-blue {
	color: white !important;
	background-color: var(--blue) !important;
	border-color: var(--blue) !important;
}
.btn-blue:hover {
	color: white !important;
	background-color: var(--blue-light) !important;
	border-color: var(--blue-dark) !important;
}
.btn-check:focus + .btn-blue,
.btn-blue:focus {
	color: white !important;
	background-color: var(--blue-light) !important;
	border-color: var(--blue-dark) !important;
	box-shadow: 0 0 0 0.2rem rgba(80, 97, 194, 0.5) !important;
}
.btn-check:checked + .btn-blue,
.btn-check:active + .btn-blue,
.btn-blue:active,
.btn-blue.active,
.show > .btn-blue.dropdown-toggle {
	color: white !important;
	background-color: var(--blue-light) !important;
	border-color: var(--blue-dark) !important;
}
.btn-check:checked + .btn-blue:focus,
.btn-check:active + .btn-blue:focus,
.btn-blue:active:focus,
.btn-blue.active:focus,
.show > .btn-blue.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(80, 97, 194, 0.5) !important;
}
.btn-blue:disabled,
.btn-blue.disabled {
	color: white !important;
	background-color: var(--blue-disabled) !important;
	border-color: var(--blue-disabled) !important;
}

@media (max-width: 600px) {
  .displayMobileHide {
    display: none !important;
  }
  .mobileHeadliner {
    font-size: 1.2rem !important;
  }
}