/*
		---------------------------------------
		## Nirvana's Lair - CSS
        - Structure
        - NAV
		- Page
		- Footer
		- ADM table
		- ADM forms
		- HOME
		- KDO
		- OUTILS
		- PLAYER

*/
/*
		---------------------------------------
		//	Structure
*/
html {
	background: #FFF;
	animation: pagecrossfade 1s;
	-webkit-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}
@keyframe pagecrossfade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@-webkit-keyframes pagecrossfade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
body {
	padding: 0;
	margin: 0;
    overflow: hidden;
	background: var(--bs-warning);
	background: linear-gradient(45deg, rgb(32, 201, 151), rgb(20, 48, 120));
    background-attachment: fixed;
	transition: all .5s ease-in-out;
}
.app-main,
.app-nav {
    height: 100vh;
    overflow: auto;
}
.btn svg { margin: -6px 0 -2px 0; }

.shape-color-foot {
	fill: #020202;
}
.shape-inv svg {
	transform: scaleX(-1);
}
.shape-bottom {
	bottom: -1px;
}
.shape-rocks svg {
	height: 100px;
}
.shape-ballon svg,
.shape-lines svg,
.shape-peaks svg {
	height: 75px;
}
.shape-exagon svg {
	width: 100%;
}
.unistrap footer {
	background-color: #020202;
}
h1 {
	margin-top: 0;
	padding-left: 2rem;
	border-left: 20px solid var(--unistrap-color-main);
	font-weight: bold;
}
h1 ~ h1 {
	margin-top: 3rem;
}
h2 {
	margin-bottom: 1rem;
	padding-left: 2rem;
	border-left: 20px dotted var(--bs-dark);
	font-style: italic;
}
a:hover { color: #000; }
.pointer {
	cursor: pointer;
}
.do-blink {
	animation: usurblink 4s;
	animation-iteration-count: infinite;
	-webkit-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}
@keyframe usurblink {
	0% { opacity: 1; }
	80% { opacity: 1; }
	85% { opacity: 0; }
	90% { opacity: 1; }
	100% { opacity: 1; }
}
@-webkit-keyframes usurblink {
	0% { opacity: 1; }
	80% { opacity: 1; }
	85% { opacity: 0; }
	90% { opacity: 1; }
	100% { opacity: 1; }
}
.debug-bar {
	z-index: 1337;
	position: fixed;
	bottom: 0;
	left: 0;
	width: auto;
	cursor: pointer;
}
.debug-bar.debug-bar-show {
	width: 100%;
}
.debug-bar:not(.debug-bar-show) .debug-cas,
.debug-bar:not(.debug-bar-show) .debug-session {
	display: none;
}
a.js-lightbox {
	cursor: zoom-in;
}
.op-clic img {
	opacity: .75;
	transition: all .2s ease-in-out;
}
.op-clic:hover img {
	opacity: 1;
}
::placeholder {
	color: #CCC !important;
  }
/*
		---------------------------------------
		//	NAV
*/
.unistrap-sidebar .dropdown-toggle { outline: 0; }

.unistrap-sidebar .btn-toggle {
  padding: .25rem .5rem;
  font-weight: 600;
  color: rgba(0, 0, 0, .65);
  background-color: transparent;
}
.unistrap-sidebar .btn-toggle:hover,
.unistrap-sidebar .btn-toggle:focus {
  color: rgba(0, 0, 0, .85);
  background-color: var(--unistrap-color-light);
}

.unistrap-sidebar .btn-toggle::before {
  width: 1.25em;
  line-height: 0;
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
  transition: transform .35s ease;
  transform-origin: .5em 50%;
}

.unistrap-sidebar .btn-toggle[aria-expanded="true"] {
  color: rgba(0, 0, 0, .85);
}
.unistrap-sidebar .btn-toggle[aria-expanded="true"]::before {
  transform: rotate(90deg);
}

.unistrap-sidebar .btn-toggle-nav a {
  padding: .1875rem .5rem;
  margin-top: .125rem;
  margin-left: 1.25rem;
}
.unistrap-sidebar .btn-toggle-nav a:hover,
.unistrap-sidebar .btn-toggle-nav a:focus {
  background-color: var(--unistrap-color-light);
}
.unistrap-sidebar .btn-toggle-nav a:hover,
.unistrap-sidebar .btn-toggle-nav a:focus,
.unistrap-sidebar .btn-toggle-nav a.sel {
    color:rgba(0,0,0,0.85);
    background-color:rgba(112,44,249, 0.1)
}
.unistrap-sidebar .btn-toggle-nav a.sel {
    font-weight: bold;
}
.unistrap-sidebar .bt-menu {
	display: none;
}
@media handheld, only screen and (max-width: 991px), only screen and (max-device-width: 991px) {
	.container-dev,
	.unistrap-main-content {
		padding: 1rem !important;
		max-width: 100%;
	}
	.unistrap-sidebar {
		max-width: none !important;
		flex: 100%;
		text-align: center;
	}
	.unistrap-sidebar .unistrap-sidebar-list.d-none-lg {
		display: none;
	}
	.unistrap-sidebar .bt-menu {
		display: inline-block;
	}
	.bt-fs {
		display: none;
	}
}

.dropdown-menu.show {
	display: block;
	padding: .5em;
	border-radius: 0;
}

/*
		---------------------------------------
		// Page
*/
.container-page {
	border-left: 20px solid #EEE;
	background-color: #F8F8F8;
}
.page-admin.do-profil .container-page .col-1 hr {
	display: none;
}
@media handheld, only screen and (max-width: 700px), only screen and (max-device-width: 700px) {
	.container-page {
		border: none;
		padding: 20px !important;
		margin: 0 -1.5rem;
	}
	.page-admin.do-profil .container-page .col,
	.page-admin.do-profil .container-page .col-1 {
		min-width: 100%;
		margin-bottom: 1rem;
	}
	.page-admin.do-profil .container-page .col-1 hr {
		display: block;
	}
}
.container-page a.undlnk,
.container-page a.undlnk:visited {
	z-index: 0;
	position: relative;
	display: inline-block;
	padding: 1px;
	margin: 0 1px;
	text-decoration: none;
	font-weight: bold;
	color: var(--bs-dark);
    text-shadow: rgb(255, 255, 255) 1px 0px 0px, rgb(255, 255, 255) 0.540302px 0.841471px 0px, rgb(255, 255, 255) -0.416147px 0.909297px 0px, rgb(255, 255, 255) -0.989993px 0.14112px 0px, rgb(255, 255, 255) -0.653644px -0.756803px 0px, rgb(255, 255, 255) 0.283662px -0.958924px 0px, rgb(255, 255, 255) 0.96017px -0.279416px 0px;
}
.container-page a.undlnk::before {
	z-index: -1;
	content: '';
	background-color: var(--unistrap-color-main);
	position: absolute;
	left: 0.25em;
	bottom: .05em;
	width: 100%;
	height: 8px;
	transition: all .1s ease-in-out;
}
.container-page a.undlnk:hover::before {
	left: -0.2em;
	bottom: 0;
	height: 100%;
	width: calc(100% + 6px);
    border-radius: 5px;
}
.page-sommaire {
	display: inline-block;
	float: right;
	padding: 10px 10px 10px 35px;
	margin: 0 0 10px 10px;
	font-size: .8em;
	border: 3px dotted #AAA;
	background-color: #EEE;
}
.page-sommaire ul {
	font-size: .9em;
	list-style: initial;
}
.page-sommaire a,
.page-sommaire a:visited {
	color: #333;
	text-decoration: none;
}
.page-sommaire a:hover {
	text-decoration: underline;
}
@media handheld, only screen and (max-width: 500px), only screen and (max-device-width: 500px) {
	.page-sommaire {
		display: block;
		float: none;
		margin: 0 0 30px 0;
	}
}

/*
		---------------------------------------
		// Footer
*/
.unistrap .footer-unistrap img { max-width: 100%; }
.unistrap .footer-unistrap.footer-dark a.undlnk,
.unistrap .footer-unistrap.footer-dark a.undlnk:visited {
	z-index: 0;
	position: relative;
	display: inline-block;
	padding: 1px;
	margin: 0 1px;
	text-decoration: none;
	font-weight: bold;
	color: var(white);
    text-shadow: #020202 1px 0px 0px, #020202 0.540302px 0.841471px 0px, #020202 -0.416147px 0.909297px 0px, #020202 -0.989993px 0.14112px 0px, #020202 -0.653644px -0.756803px 0px, #020202 0.283662px -0.958924px 0px, #020202 0.96017px -0.279416px 0px;
}
.unistrap .footer-unistrap.footer-dark a.undlnk::before {
	z-index: -1;
	content: '';
	background-color: #FDDB00;
	position: absolute;
	left: 0.25em;
	bottom: .05em;
	width: 100%;
	height: 8px;
	transition: all .1s ease-in-out;
}
.unistrap .footer-unistrap.footer-dark a.undlnk:hover::before {
	left: -0.2em;
	bottom: 0;
	height: 100%;
	width: calc(100% + 6px);
    border-radius: 5px;
}
@media handheld, only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
	.footer-unistrap .col-md-4 {
		min-width: 100%;
		padding-bottom: 30px;
	}
}

/*
		---------------------------------------
		//	ADM table
*/
table.table-adm {
	width: 100%;
	color:#444;
	border: 1px solid #AAA;
}
table.table-adm thead tr th {
	padding: 10px;
	text-align: center;
	font-size: smaller;
	letter-spacing: .1em;
	background-color: var(--unistrap-color-light);
	color: #000;
	border: 1px solid  #AAA;
}
table.table-adm tbody tr td {
	padding: 2px 5px;
	vertical-align: middle;
	background-color: #fff;
	border: 1px solid #EEE;
	border-bottom: 1px solid #AAA;
}
table.table-adm tbody tr td:first-of-type {
	border-left: 1px solid #AAA;  
}
table.table-adm tbody tr td:last-of-type {
	border-right: 1px solid #AAA;  
}
table.table-adm tbody:hover tr td { background-color: #f0f8ff; }
table.table-adm tbody:hover tr:first-child td.highlight,
table.table-adm tbody:hover tr:first-child td.highlight a {
	background-color: var(--unistrap-color-main) !important;
	color: #fff
}
table.table-adm .logs-type-1 svg { fill: var(--bs-success); }
table.table-adm .logs-type-0 svg { fill: var(--bs-danger); }
table.table-adm .logs-type-2 svg { fill: var(--bs-info); }

.admin-users-form input {
	padding-right: 30px;
}
.admin-users-form span {
	cursor: pointer;
	position: absolute;
	right: 10px;
	top: calc( ( 100% - 24px ) / 2 );
}
.admin-users-form span svg {
	fill: #000;
}
table.table-adm mark {
	padding: 0;
	background-color: var(--unistrap-color-light);
	border-bottom: 2px dotted var(--unistrap-color-main);
	box-shadow: 0px 0px 5px var(--unistrap-color-light);
}

/*
		---------------------------------------
		//	ADM forms
*/
.form-add {
	border: 10px solid var(--bs-success);
}
.form-mod {
	border: 10px solid var(--bs-primary);
}

/*
		---------------------------------------
		//	HOME
*/

/*
		---------------------------------------
		//	KDO
*/
.header-kdo h3 {
	color: #333;
	letter-spacing: .1em;
	font-size: 1.2em;
	font-weight: bold;
	text-shadow: 1px 1px 1px rgba(0,0,0,.7);
}
.header-kdo h3 span {
	display: block;
	font-size: 2em;
	color: var(--unistrap-color-main);
}
@media handheld, only screen and (max-width: 700px), only screen and (max-device-width: 700px) {
	.header-kdo h3 span {
		font-size: 1.5em;
	}
}
@media handheld, only screen and (max-width: 500px), only screen and (max-device-width: 500px) {
	.row.kdo-stats .col {
		min-width: 100%;
		text-align: center !important;
	}
	.accordion-body .col {
		min-width: 100%;
	}
	.accordion-body .col-3 {
		display: none;
	}
	.accordion-body .input-group span,
	.accordion-body .input-group input {
		display: block;
		width: 100%;
		border-radius: 0;
	}
	.modal-footer {
		text-align: center;
	}
	.modal-footer .btn {
		margin-bottom: 1rem;
	}
}
input::-webkit-input-placeholder,
input:-moz-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder {
	font-size: .7em;
}
.progress {
	border-radius: 4px !important;
}
.progress-bar {
	background: var(--bs-warning);
    background: linear-gradient( 0deg,rgba(255, 255, 255, .25),rgba(0,0,0,.2));
    background: linear-gradient( 90deg, var(--bs-primary), var(--bs-success));
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
.unistrap .nav-tabs > button a,
.unistrap .nav-tabs > button a:visited {
	color: #8f8f8f;
	text-decoration: none;
}
.unistrap .nav-tabs > button:hover a,
.unistrap .nav-tabs > button:focus a,
.unistrap .nav-tabs > button:active a {
	color: #000;
	font-weight: bold;
}
.accordion-header svg,
.unistrap .nav-tabs > button svg { margin: -4px 0 -2px 0; }
.unistrap .accordion-button:not(.collapsed) em,
.unistrap .accordion-button:hover {
	text-shadow: 0px 0px 10px rgba(0,0,0,.35);
	background-color: var(--unistrap-color-light);
}
.kdo-img-uploaded,
.jeu-img-uploaded {
	cursor: pointer;
	max-height: 200px;
	border: 1px dashed #333;
}
.modal-kdo-cropper .modal-body img,
.modal-jeu-cropper .modal-body img {
	max-height: 50vh;
}
.handle:hover {
	color: var(--bs-dark) !important;
}

/*
		---------------------------------------
		// OUTILS
*/
/* éditeur photo */
.photo-editor *,
.SfxModal-Wrapper * {
	font-family: inherit !important;
}
button.FIE_topbar-close-button {
	display: none !important;
}
button.sc-lxwit0-2.sc-m9ezm7-1 {
	background-color: var(--bs-success);
}
/* conversions */
@media handheld, only screen and (max-width: 1000px), only screen and (max-device-width: 1000px) {
	.conv-hexargba .col {
		min-width: 100%;
		margin-top: 1rem;
	}
}
/* email jetable */
.unistrap .eml-html table tbody tr:hover th, .unistrap table tbody tr:hover td {
	background-color: inherit !important;
}


/*
		---------------------------------------
		// PLAYER
*/
.nwk-player label { cursor: pointer; }
.nwk-player-bg {
    padding: 100px 0;
    text-align: center;
    background-image: url('img/player-bg.webp');
    background-position: center center;
    background-size: cover;
}
.player-show-me.player-hide-me { display: none; }
.nwk-player-wrapper .player-m {
    display: inline-block;
    padding: 10px 20px;
    background: #222;
	color: #FFF;
    box-shadow: 2px 2px 15px #AA6715;
    transition: all .2s ease-in-out;
}
.nwk-player .plyr {
    display: inline-block;
	min-width: 75%;
    padding: 10px 20px;
    background: #FFF;
    box-shadow: 2px 2px 15px #AA6715;
    transition: all .2s ease-in-out;
}
.nwk-player .plyr.plyr--audio .plyr__controls {
	background-color: transparent;
	padding: 0;
}
.nwk-player .player-g {
    color: var(--unistrap-color-main);
    font-size: 1em;
    font-weight: bold;
    text-transform: uppercase;
}
.nwk-player .player-t {
	margin-left: 25px;
    font-size: 1em;
    font-style: italic;
    font-weight: bold;
    text-transform: uppercase;
}
.nwk-player .player-bt-prev,
.nwk-player .player-bt-next {
	display: inline-block;
    margin: 0 25px -10px 0;
    padding: 7px;
	border-radius: 4px;
    cursor: pointer;
    transition: all .2s ease-in-out;
}
.nwk-player .player-bt-next {
    margin: 0 0 -10px 25px;
}
.nwk-player .player-bt-prev svg,
.nwk-player .player-bt-next svg {
	display: block;
	fill: currentColor;
    width: 18px;
	height: 18px;
	pointer-events: none;
}
.nwk-player .player-bt-prev:hover,
.nwk-player .player-bt-next:hover {
	background-color: #FFF;
    color: #222;
}
.nwk-player .player-info {
    font-size: .9em;
    font-style: italic;
    text-align: center;
}
.nwk-player .player-bt {
    display: inline-block;
    margin: 15px 0;
    padding: 10px 20px;
    border-radius: 4px;
    background-color: #F7F7F7;
    font-size: .8em;
    font-weight: bold;
    font-style: normal;
    letter-spacing: .15em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all .2s ease-in-out;
}
.nwk-player a.player-bt {
	background-color: #EEE;
	color: inherit;
    text-decoration: none;
	margin: 0;
}
.nwk-player .player-bt:hover {
    background-color: var(--unistrap-color-main);
    color: #FFF;
}
.nwk-player.nwk-player-groupe img {
	max-width: 100%;
	box-shadow: 0px 0px 15px #DBDBDB;
}
.nwk-player.nwk-player-groupe h3 {
	font-weight: bold;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.nwk-player .player-list ol {
	display: inline-block;
    margin: 0;
    column-count: 9;
    font-size: .8em;
    list-style: none;
}
.nwk-player.nwk-player-groupe .player-list ol { column-count: 1; }
.nwk-player .player-list ol {
	list-style: none;
	counter-reset: my-awesome-counter;
}
.nwk-player .player-list ol li {
	counter-increment: my-awesome-counter;
}
.nwk-player .player-list ol li::before {
	content: counter(my-awesome-counter) ". ";
    font-size: .7em;
	opacity: .75;
}
@media handheld, only screen and (max-width: 2900px), only screen and (max-device-width: 2900px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 8; }
    .container-dev.container .nwk-player .player-list ol { column-count: 4; }
}
@media handheld, only screen and (max-width: 2600px), only screen and (max-device-width: 2600px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 7; }
    .container-dev.container .nwk-player .player-list ol { column-count: 4; }
}
@media handheld, only screen and (max-width: 2300px), only screen and (max-device-width: 2300px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 6; }
    .container-dev.container .nwk-player .player-list ol { column-count: 4; }
}
@media handheld, only screen and (max-width: 2000px), only screen and (max-device-width: 2000px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 5; }
    .container-dev.container .nwk-player .player-list ol { column-count: 4; }
}
@media handheld, only screen and (max-width: 1700px), only screen and (max-device-width: 1700px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 4; }
    .container-dev.container .nwk-player .player-list ol { column-count: 4; }
}
@media handheld, only screen and (max-width: 1400px), only screen and (max-device-width: 1400px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 3; }
    .container-dev.container .nwk-player .player-list ol { column-count: 3; }
}
@media handheld, only screen and (max-width: 991px), only screen and (max-device-width: 991px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 3; }
    .container-dev.container .nwk-player .player-list ol { column-count: 3; }
}
@media handheld, only screen and (max-width: 700px), only screen and (max-device-width: 700px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 2; }
    .container-dev.container .nwk-player .player-list ol { column-count: 2; }
}
@media handheld, only screen and (max-width: 500px), only screen and (max-device-width: 500px) {
    .container-dev.container-fluid .nwk-player .player-list ol { column-count: 1; }
    .container-dev.container .nwk-player .player-list ol { column-count: 1; }
}
.nwk-player .player-gp-nom {
	font-weight: bold;
	font-size: 3em;
	text-shadow: 2px 2px 5px rgba(0,0,0,.7);
}
.nwk-player .player-list ol li {
    display: inline-block;
    width: 100%;
    padding: 3px 8px 4px 8px;
	line-height: 1;
}
.nwk-player .player-list ol li.sel,
.nwk-player .player-list ol li:hover.sel {
	border-radius: 5px;
    background: #282828;
	color: #FFF;
}
.nwk-player .player-list ol li:hover {
    background: #FFF;
	color: var(--unistrap-color-main);
}
.nwk-player .player-list .this-groupe {
    font-weight: bold;
	margin: 0 5px;
}
.nwk-player .player-list .this-titre {
    font-size: .8em;
}
.nwk-player .player-list .player-pl-this { cursor: pointer; }
.nwk-player .player-list .player-pl-this:hover { background: #FFF; }


.plyr--audio .plyr__control.plyr__tab-focus, .plyr--audio .plyr__control:hover, .plyr--audio .plyr__control[aria-expanded="true"] {
	background: var(--unistrap-color-main);
	color: #fff;
}
.plyr__control.plyr__tab-focus {
	box-shadow: 0 0 0 5px rgba(32,201,151,0.25);
}
.plyr--full-ui input[type="range"] {
	color: var(--unistrap-color-main);
}

body.do-player.player-scroll .nwk-player-bg {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1030;
	padding: 0;
}
body.do-player.player-scroll .nwk-player .plyr {
	width: 100%;
	height: auto;
}
body.do-player.player-scroll .player-gp-filtres,
body.do-player.player-scroll .player-list {
	margin-top: 275px !important;
}
body.do-player.player-scroll .player-list {
	margin-top: 275px !important;
}