@charset "UTF-8";

:root {
	--basespacing:10px;
	--lineheightS:20px;
	--lineheightSM:26px;
	--baselineheight:34px;
	--lineheightL:45px;
	--basepadding:15px;
	--pagepadding:40px;
	--primarydarkcolor:#35444c; /* Cognitive dark blue */
	--primaryaccentcolor:#e8e638; /* Cognitive bright yellow */
	--secondarycolor:#708191; /* Cognitive light blue */
	--gray1:#333333;
	--gray2:#666666;
	--gray3:#999999;
	--gray4:#cccccc;
	--gray45:#c6c6c6;
	--gray5:#dddddd;
	--gray6:#f9f9f9;
	--gray7:#f2f2f2;
	--bodycolor:#f9f9f9;
	--green:#00ab00;
	--greenbrighter:#35d754;
	--yellow:#e8e638;
	--red:#ff0000;
	--normal-easing:cubic-bezier(0,.41,.58,1);
	--smooth-easing:cubic-bezier(0.075, 0.820, 0.165, 1);
	--sidebar-width:200px;
	--contentmaxwidth:1800px;
	--LbuttonFONTsize:16px;
	--buttonFONTsize:16px;
	--MSbuttonFONTsize:14px;
	--MXSbuttonFONTsize:13px;
	--SbuttonFONTsize:12px;
	--XSbuttonFONTsize:11px;
	--XXSbuttonFONTsize:10px;
	--rounded: 5000px;
	--roundcorner: 8px;
	--Sroundcornder: 4px;
	--coloredelementshadow:0px 5px 15px rgba(230,230,55,0.5);
	--elementshadow:0px 2px 6px rgba(0,0,0,0.1);
	--elementshadowhover:0px 5px 15px rgba(0,0,0,0.05);
	--modalshadow:0px 5px 20px rgba(0,0,0,0.1);
}

.white-text {color:white;}
.paragraph-text {color:#222222;}
.mediumgray-text {color:#777777;}
.lightgray-text {color:#cccccc;}
.lightmediumgray-text {color:#999999;}
.darkgray-text {color:#666666;}
.primarycolor-text {color:var(--primarydarkcolor);}
.secondarycolor-text {color:var(--secondarycolor);}

html {
	height:100%;
	width:100%;
	background:var(--bodycolor);
}

body {
	width:100%;
	height:100vh;
	overflow-x:hidden;
}

* { /* This sets the baseline for all elements */
	box-sizing:border-box;
	font-size: 99%;
	font-weight: normal;
	font-style: normal;
	-webkit-font-smoothing: antialiased!important;
	-moz-osx-font-smoothing: grayscale!important;
	text-shadow: 1px 1px 1px rgba(255,255,255,0.004)!important;
	text-rendering: optimizeLegibility;
}

@-ms-viewport { width: device-width; inicial-scale: 1.0; }
@-o-viewport { width: 430px; inicial-scale=1.0; }
@viewport { width: device-width; inicial-scale=1.0; }

/* Normalizer */

html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}
body{margin:0;}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary{display:block;}
audio,
canvas,
progress,
video{display:inline-block;vertical-align:baseline;}
audio:not([controls]){display:none;height:0;}
[hidden],
template{display:none;}
a{background-color:transparent;}
a:active,
a:hover{outline:0;}
abbr[title]{border-bottom:1px dotted;}
b,
strong{font-weight:bold;}
dfn{font-style:italic;}
mark{background:#ff0;color:#000;}
small{font-size:75%;line-height:1;display:inline-block;}
sub,
sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sup{top:-0.5em;}
sub{bottom:-0.25em;}
img{border:0;vertical-align:top;}
svg:not(:root){overflow:hidden;}
figure{margin:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0;}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}
pre{overflow:auto;}
code,
kbd,
pre,
samp{font-family:monospace, monospace;font-size:1em;}
button,
optgroup,
select{color:inherit;font:inherit;margin:0;}
button{overflow:visible;-webkit-appearance:none;border:none;background:none;}
button:hover, button:focus {outline:none;}
button,
select{text-transform:none;}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"]{-webkit-appearance:none;cursor:pointer;}
button[disabled],
html input[disabled]{cursor:default;}
button::-moz-focus-inner,
input::-moz-focus-inner{border:0;padding:0;}
input{line-height:normal;}
input[type="checkbox"],
input[type="radio"]{box-sizing:border-box;padding:0;}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button{height:auto;}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}
fieldset{border:none;margin:0;padding:0;}
legend{border:0;padding:0;}
textarea{overflow:auto;}
optgroup{font-weight:bold;}
table{border-collapse:collapse;border-spacing:0;}
td,
th{padding:0;}
*::-webkit-media-controls-start-playback-button {display: none!important;-webkit-appearance: none;}
ul {list-style:none;padding:0;margin:0;}
nav ul {list-style:none;padding:0;}
nav ul li {padding:0;}
nav a {height:auto;text-align:left;padding:0;}
/* Form style remover */
form {width: auto;padding:0;position:relative;}
label {display:block;}
input, textarea {-webkit-appearance: none;-webkit-border-radius: 0;width: 100%;display:block;background-image: none;border:none;padding: 1rem;}
textarea {height: 3rem;}
input:focus, textarea:focus {outline:none;}

input::-webkit-calendar-picker-indicator{display: none;}
input[type="date"]::-webkit-input-placeholder{ visibility: hidden !important;}
input[type="date"]::-webkit-inner-spin-button, 
input[type="date"]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

/* //Normalizer */

/* ///////////////////////// */
/* 
/* 		Fonts
/* 
/* ///////////////////////// */

@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	src: url("../fonts/googleFonts.woff2") format('woff2');
  }
  
  .material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
  }

.material-icons, [class^="icon-"] {
	font-size: 20px;
	line-height: 1;
	vertical-align:middle;
	color:inherit;
	margin-top:-2px;
}

.material-icons.bigger, [class^="icon-"].bigger {
	font-size:30px;
}

.material-icons.small , [class^="icon-"].small {
	font-size:var(--buttonFONTsize);
	vertical-align:middle;
}

.material-icons.smallest, [class^="icon-"].smallest {
	font-size:var(--SbuttonFONTsize);
}

[class^="icon-"] {
	font-size:var(--buttonFONTsize);
	vertical-align:middle;
	position:relative;
}

[class^="icon-"]:before, [class*=" icon-"]:before {
	vertical-align:middle;
}

/* ///////////////////////// */
/* 
/* 		//Fonts
/* 
/* ///////////////////////// */

/* ///////////////////////// */
/* 
/* 		Form Structure
/* 
/* ///////////////////////// */

label {
	font-size: 100%;
	vertical-align:middle;
}

.input-wrapper {position:relative;}

input, textarea, .custom-select {
	box-sizing:border-box;
	border:1px solid rgba(255,255,255,0);
	padding:0;
	font-size: 100%;
	background-color: transparent;
	vertical-align:middle;
	max-width:100%;
	transition:all 0.25s var(--normal-easing);
	-webkit-transition:all 0.25s var(--normal-easing);
	-moz-transition:all 0.25s var(--normal-easing);
	-ms-transition:all 0.25s var(--normal-easing);
	-o-transition:all 0.25s var(--normal-easing);
}

input, textarea {
	cursor:text!important;
}

.custom-select, select {
	cursor:pointer;
}

input[type="search"] {
	border:1px solid rgba(255,255,255,0);
	display:inline-block;
	width:100%;
}

input[type="search"].btn-s {
	padding-right:calc(var(--basespacing)*0.8);
}

select {
	width:100%;
}

input:hover, input:focus, textarea:hover, textarea:focus, .custom-select:hover, .custom-select:focus {
	transition:all 0.25s var(--normal-easing);
	-webkit-transition:all 0.25s var(--normal-easing);
	-moz-transition:all 0.25s var(--normal-easing);
	-ms-transition:all 0.25s var(--normal-easing);
	-o-transition:all 0.25s var(--normal-easing);
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

.custom-select {
	position:relative;
	z-index:1;
	display:inline-block;
	padding-top:0!important;
	border-radius:0;
	overflow: hidden;
	padding:0;
}

.custom-select:before {
	content:"";
	position:absolute;
	z-index:-1;
	display:block;
	right:0;
	transition: all .2s ease;
        -webkit-transition: all .2s ease;
        -moz-transition: all .2s ease;
        -ms-transition: all .2s ease;
        -o-transition: all .2s ease;
}

.custom-select:after {
	content:"";
	position:absolute;
	z-index:-1;
	display:block;
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
	transition: all .2s ease;
        -webkit-transition: all .2s ease;
        -moz-transition: all .2s ease;
        -ms-transition: all .2s ease;
        -o-transition: all .2s ease;
		line-height:1;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

.custom-select select {
	width:100%;
	position:relative;
	border: none;
	box-shadow: none;
	background-color: transparent;
	background-image: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius:0;
	-webkit-border-radius:0;
}

.custom-select:hover:after {
	transition: all .2s ease;
        -webkit-transition: all .2s ease;
        -moz-transition: all .2s ease;
        -ms-transition: all .2s ease;
        -o-transition: all .2s ease;
}

.custom-select:hover:before {
	transition: all .2s ease;
        -webkit-transition: all .2s ease;
        -moz-transition: all .2s ease;
        -ms-transition: all .2s ease;
        -o-transition: all .2s ease;
}

.custom-select select:focus {
	outline: none;
}

/* Base for label styling */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
	position: absolute;
	left: -9999px;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
	position: relative;
	display:inline-block;
	padding-left: 35px;
	cursor: pointer;
}

/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
	content: '';
	position: absolute;
	left: 0; top: 50%;
	border-radius: none;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
	display:inline-block;
	position:absolute;
	top:50%;
	left:0;
	z-index:1;
	font-size:24px;
	line-height:1;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}
/* checked mark aspect changes */
[type="checkbox"]:not(:checked) + label:after {
	opacity: 0;
	transform:translateY(-55%) scale(0);
	-webkit-transform:translateY(-55%) scale(0);
	-moz-transform:translateY(-55%) scale(0);
	-ms-transform:translateY(-55%) scale(0);
	-o-transform:translateY(-55%) scale(0);
}
[type="checkbox"]:checked + label:after {
	opacity: 1;
	transform:translateY(-55%) scale(1);
	-webkit-transform:translateY(-55%) scale(1);
	-moz-transform:translateY(-55%) scale(1);
	-ms-transform:translateY(-55%) scale(1);
	-o-transform:translateY(-5%) scale(1);
}
/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
	border:2px solid #eeeeee;
}
[type="checkbox"]:disabled:checked + label:after {
	color: #eeeeee;
}
[type="checkbox"]:disabled + label {
	color: #eeeeee;
}
/* accessibility */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
	border: 2px solid #eeeeee;
}






/* Base for checkbox styling */





/* //Custom Checkboxes Structure */


/* Custom Radio Button Structure */

[type="radio"]:not(:checked),
[type="radio"]:checked {
	position: absolute;
	left: -9999px;
}
[type="radio"]:not(:checked) + label,
[type="radio"]:checked + label {
	position: relative;
	display:inline-block;
	padding-left: 35px;
	cursor: pointer;
}

/* checkbox aspect */
[type="radio"]:not(:checked) + label:before,
[type="radio"]:checked + label:before {
	content: '';
	position: absolute;
	left: 0; top: 50%;
	border-radius: none;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
}
/* checked mark aspect */
[type="radio"]:not(:checked) + label:after,
[type="radio"]:checked + label:after {
	display:inline-block;
	position:absolute;
	top:50%;
	left:0;
	z-index:1;
	font-size:24px;
	line-height:1;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}
/* checked mark aspect changes */
[type="radio"]:not(:checked) + label:after {
	opacity: 0;
	transform:translateY(-55%) scale(0);
	-webkit-transform:translateY(-55%) scale(0);
	-moz-transform:translateY(-55%) scale(0);
	-ms-transform:translateY(-55%) scale(0);
	-o-transform:translateY(-55%) scale(0);
}
[type="radio"]:checked + label:after {
	opacity: 1;
	transform:translateY(-55%) scale(1);
	-webkit-transform:translateY(-55%) scale(1);
	-moz-transform:translateY(-55%) scale(1);
	-ms-transform:translateY(-55%) scale(1);
	-o-transform:translateY(-5%) scale(1);
}
/* disabled checkbox */
[type="radio"]:disabled:not(:checked) + label:before,
[type="radio"]:disabled:checked + label:before {
	border:2px solid #eeeeee;
}
[type="radio"]:disabled:checked + label:after {
	color: #eeeeee;
}
[type="radio"]:disabled + label {
	color: #eeeeee;
}
/* accessibility */
[type="radio"]:checked:focus + label:before,
[type="radio"]:not(:checked):focus + label:before {
	border: 2px solid #eeeeee;
}

/* //Custom Radio Button Structure */

textarea {
	opacity:1;
	cursor:text;
	resize:none;
}

input:focus, textarea:focus {
	background-color: transparent;
}

span.error {
	display:inline-block;
	margin-bottom:5px;
}

/* ///////////////////////// */
/* 
/* 		//Form Structure
/* 
/* ///////////////////////// */

a {
	text-decoration:none;
	color:inherit;
	cursor:pointer;
	transition:all 0.15s ease;
		-webkit-transition:all 0.15s ease;
		-moz-transition:all 0.15s ease;
		-ms-transition:all 0.15s ease;
		-o-transition:all 0.15s ease;
}

a.block {display:block;}

a:hover {
	transition:all 0.15s ease;
		-webkit-transition:all 0.15s ease;
		-moz-transition:all 0.15s ease;
		-ms-transition:all 0.15s ease;
		-o-transition:all 0.15s ease;
}

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }
.initially-hidden {display:none;opacity:0;}
.empty {display:none;}
.inline-empty {display:none;}

/* #PlaylistContentCard .box-body .empty[data-type="no-selection"] {display:block}
#ScheduleContentCard .box-body .empty[data-type="no-selection"] {display:block}
#TerminalContentCard .box-body .empty[data-type="no-selection"] {display:block}
#ScheduleContentCard .box-body .empty[data-type="no-content"] {
	width:calc(100% - calc(230px + calc(var(--basepadding)*2)));
	left:calc(230px + var(--basepadding)*2);
	transform:translate(0,-50%);
	-webkit-transform:translate(0,-50%);
	-moz-transform:translate(0,-50%);
	-ms-transform:translate(0,-50%);
	-o-transform:translate(0,-50%);
} */

#PlaylistContentCard .box-body .empty[data-type="no-selection"] {display:block}
#ScheduleContentCard .box-body .empty[data-type="no-selection"] {display:block}
#TerminalContentCard .box-body .empty[data-type="no-selection"] {display:block}
#ScheduleContentCard .box-body .empty[data-type="no-content"] {
	width:calc(100% - calc(var(--basepadding)*2)));
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
}

#empty-formats {
	width:100%;
	max-width:800px;
	margin:0 auto;
	color:var(--gray3);
	margin-top:20px;
}

#empty-formats .empty-thumbnail {
	width:90%;
	max-width:300px;
	/*fill:var(--gray5);*/
	margin-bottom:var(--basespacing);

	fill:transparent;
	stroke:var(--gray5);
	stroke-width:2;
	stroke-linecap:round;
	stroke-miterlimit:2;
}

.empty h3 {
	font-size:19px;
}

.hide {
	opacity:0;
	transform:scale(0);
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	-ms-transform:scale(0);
	-o-transform:scale(0);
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.fullwidth {width:100%;}

hr {
	border: 0;
	height: 0;
}

.button, button {
	position:relative;
	display:inline-block;
	width:auto;
	margin:0 1px 0 1px;
	border:1px solid rgba(0,0,0,0);
	vertical-align:middle;
		transition:all 0.15s ease;
		-webkit-transition:all 0.15s ease;
		-moz-transition:all 0.15s ease;
		-ms-transition:all 0.15s ease;
		-o-transition:all 0.15s ease;
}

.checkbox-label, input[type="checkbox"] {
	transition:all 0.15s ease;
	-webkit-transition:all 0.15s ease;
	-moz-transition:all 0.15s ease;
	-ms-transition:all 0.15s ease;
	-o-transition:all 0.15s ease;
}

button:hover, .button:hover {
	transition:all 0.15s ease;
	-webkit-transition:all 0.15s ease;
	-moz-transition:all 0.15s ease;
	-ms-transition:all 0.15s ease;
	-o-transition:all 0.15s ease;
}

.button.btn-square > i, button.btn-square > i {
	display:block;
	margin-top:0;
}

i.inline {
	display:inline-block;
}

.button.btn-center {
	margin:0 auto;
}

.btn-block {
	display:block;
}

.modal {display:none;}

.standard-modal-box-holder {
	position:fixed;
	display:none;
	z-index:999999;
	width:100%;
	height:100vh;
	top:0;right:0;left:0;
	transition:all 0.5s ease 0.15s;
		-webkit-transition:all 0.5s ease 0.15s;
		-moz-transition:all 0.5s ease 0.15s;
		-ms-transition:all 0.5s ease 0.15s;
		-o-transition:all 0.5s ease 0.15s;
}

.standard-modal-box {
	background:white;
	padding:0;
	position:fixed;
	top:50%;
	left:50%;
	z-index:99;
	opacity:0;
	transform:translate(-50%,-50%) scale(0.9);
	-webkit-transform:translate(-50%,-50%) scale(0.9);
	-moz-transform:translate(-50%,-50%) scale(0.9);
	-ms-transform:translate(-50%,-50%) scale(0.9);
	-o-transform:translate(-50%,-50%) scale(0.9);
		transition:all 0.15s ease-out;
		-webkit-transition:all 0.15s ease-out;
		-moz-transition:all 0.15s ease-out;
		-ms-transition:all 0.15s ease-out;
		-o-transition:all 0.15s ease-out;
}

.standard-modal-box.scrollable {
	overflow-y:auto;
	height:auto;
	max-height:90vh;
}

.standard-modal-header {
	position:relative;
	display:grid;
	grid-template-columns: 1fr max-content;
	align-items: center;
	justify-content:center;
	overflow:hidden;
}

.standard-modal-box .standard-modal-title {max-width:400px;}
.standard-modal-box.wide .standard-modal-title {
	text-align:center;
	max-width:600px;
}

.standard-modal-title h1 {
	line-height:1;
	display:inline;
}

.standard-modal-title .modal-subtitle {
	color:var(--gray3);
	margin-top:calc(var(--basespacing)*0.3);
	display:block;
	white-space:normal;
	max-width:calc(100% - calc(var(--basespacing)*3.5)*2);
	margin-left:auto;
	margin-right:auto;
	text-align:center;

	overflow:hidden;
	text-overflow:ellipsis;
}

.standard-modal-title.align-left .modal-subtitle {
	max-width:unset;
	text-align:left;
}

.standard-modal-title.align-left .modal-subtitle {margin-left:unset; margin-right:unset}

.standard-modal-title .modal-subtitle-container .modal-subtitle {text-overflow:ellipsis}

.standard-modal-box-holder.active {
	background-color:rgba(0,0,0,0.35);
		transition:all 0.1s ease-out;
		-webkit-transition:all 0.1s ease-out;
		-moz-transition:all 0.1s ease-out;
		-ms-transition:all 0.1s ease-out;
		-o-transition:all 0.1s ease-out;
}

.standard-modal-box-holder.active .standard-modal-box {
	opacity:1;
	transform:translate(-50%,-50%) scale(1);
	-webkit-transform:translate(-50%,-50%) scale(1);
	-moz-transform:translate(-50%,-50%) scale(1);
	-ms-transform:translate(-50%,-50%) scale(1);
	-o-transform:translate(-50%,-50%) scale(1);
		transition:all 0.15s ease 0.15s;
		-webkit-transition:all 0.15s ease 0.15s;
		-moz-transition:all 0.15s ease 0.15s;
		-ms-transition:all 0.15s ease 0.15s;
		-o-transition:all 0.15s ease 0.15s;
}

.standard-modal-content ul.standard-list li {
	padding-left:0;
	padding-right:0;
}

.standard-modal-footer {
	display:grid;
	grid-template-columns:max-content max-content;
	justify-content:end;
	align-items:center;
}

#fullpage-dimmer {
	position:fixed;
	display:block;
	top:0;right:0;bottom:0;left:0;
	z-index:9999999; /* Above any modal */
		transition:all 0.5s ease;
		-webkit-transition:all 0.5s ease;
		-moz-transition:all 0.5s ease;
		-ms-transition:all 0.5s ease;
		-o-transition:all 0.5s ease;
}

#fullpage-dimmer.active {
		transition:all 0.1s ease-out;
		-webkit-transition:all 0.1s ease-out;
		-moz-transition:all 0.1s ease-out;
		-ms-transition:all 0.1s ease-out;
		-o-transition:all 0.1s ease-out;
}

.alert-box {
	position:fixed;
	z-index:10000002; /* above page dimmer */
	width:auto;
	margin:0 var(--basepadding);
	display:none;
	opacity:0;
	top:var(--basepadding);
	left:50%;
	transform:translateX(-50%) scale(0.9);
	-webkit-transform:translateX(-50%) scale(0.9);
	-moz-transform:translateX(-50%) scale(0.9);
	-ms-transform:translateX(-50%) scale(0.9);
	-o-transform:translateX(-50%) scale(0.9);
		transition:all 0.5s ease;
		-webkit-transition:all 0.5s ease;
		-moz-transition:all 0.5s ease;
		-ms-transition:all 0.5s ease;
		-o-transition:all 0.5s ease;
}

#warning-alert, #error-alert, #success-alert {
	bottom:auto;
	right:auto;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%) scale(0.9);
	-webkit-transform:translate(-50%,-50%) scale(0.9);
	-moz-transform:translate(-50%,-50%) scale(0.9);
	-ms-transform:translate(-50%,-50%) scale(0.9);
	-o-transform:translate(-50%,-50%) scale(0.9);
		width:calc(100% - var(--basepadding));
		max-width:400px;
		padding:calc(var(--basespacing)*3.5) calc(var(--basespacing)*3.5);
		background:white;
		color:var(--primarydarkcolor);
		border-radius:var(--roundcorner);
		box-shadow:var(--elementshadow);
		text-align:center;
}

#warning-alert .alert-icon, #error-alert .alert-icon, #success-alert .alert-icon {
	display:inline-block;
	margin:0 auto;
	margin-bottom:var(--basepadding);
	width:70px;
	height:70px;
	border:1px solid var(--gray4);
	border-radius:var(--rounded);
}

.alert-box p strong {
	font-size:18px;
}

#error-alert .alert-icon {color:red;border-color:red;}
#success-alert .alert-icon {color:#4ed164;}
#warning-alert .alert-icon {border:none;}

.alert-icon i {
	margin:0;
	padding:0;
	font-size:60px!important;
}

#warning-alert .alert-icon i {
	transform:translateY(0%);
	-webkit-transform:translateY(0%);
	-moz-transform:translateY(0%);
	-ms-transform:translateY(0%);
	-o-transform:translateY(0%);
}

#error-alert .alert-icon i {
	transform:translateY(9.5%);
	-webkit-transform:translateY(9.5%);
	-moz-transform:translateY(9.5%);
	-ms-transform:translateY(9.5%);
	-o-transform:translateY(9.5%);
}

#success-alert .alert-icon i {
	transform:translateY(7%);
	-webkit-transform:translateY(7%);
	-moz-transform:translateY(7%);
	-ms-transform:translateY(7%);
	-o-transform:translateY(7%);
}



.notification-wrapper {
	position:fixed;
	z-index:10000001; /* above page dimmer */
	width:auto;
	height:auto;
	margin:0;
	top:var(--basepadding);
	left:50%;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;

	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:5px;
	opacity:1;
}

.notification-wrapper .notification-box {
	opacity:0;
	display:none;

	grid-template-columns:1fr max-content;
	align-items:center;
	grid-gap:var(--basepadding);
		width:auto;
		max-width:600px;
		margin:0 auto;
		padding:calc(var(--basespacing)*1.5) calc(var(--basepadding)*2) calc(var(--basespacing)*1.5) calc(var(--basepadding)*2);
		background:var(--primarydarkcolor);
		color:white;
		border-radius:var(--roundcorner);
		box-shadow:var(--elementshadow);
}

.notification-wrapper .notification-box.active {
	opacity:1;
	transition:all 0.15s ease;
	-webkit-transition:all 0.15s ease;
	-moz-transition:all 0.15s ease;
	-ms-transition:all 0.15s ease;
	-o-transition:all 0.15s ease;
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
}

/* #notification, #warning-notification {
	display:grid;
	grid-template-columns:1fr max-content;
	align-items:center;
	grid-gap:var(--basepadding);
		width:auto;
		max-width:600px;
		padding:calc(var(--basespacing)*1.5) calc(var(--basepadding)*2) calc(var(--basespacing)*1.5) calc(var(--basepadding)*2);
		background:var(--primarydarkcolor);
		color:white;
		border-radius:var(--roundcorner);
		box-shadow:var(--elementshadow);
} */

#warning-notification {
	background:var(--primaryaccentcolor);
	color:var(--primarydarkcolor);
}

#notification .close-box {
	width:auto;
	height:auto;
	justify-self:end;
}

.alert-box.active { /* Same for all */
	opacity:1;
		transition:all 0.15s ease;
		-webkit-transition:all 0.15s ease;
		-moz-transition:all 0.15s ease;
		-ms-transition:all 0.15s ease;
		-o-transition:all 0.15s ease;
}

#notification.active {
	/* transform:translateX(-50%) scale(1);
	-webkit-transform:translateX(-50%) scale(1);
	-moz-transform:translateX(-50%) scale(1);
	-ms-transform:translateX(-50%) scale(1);
	-o-transform:translateX(-50%) scale(1); */
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
}

#warning-alert.active, #error-alert.active, #success-alert.active {
	transform:translate(-50%,-50%) scale(1);
	-webkit-transform:translate(-50%,-50%) scale(1);
	-moz-transform:translate(-50%,-50%) scale(1);
	-ms-transform:translate(-50%,-50%) scale(1);
	-o-transform:translate(-50%,-50%) scale(1);
}

.error-wrapper {
	position:fixed;
	z-index:10000002;
	width:100vw;
	height:100vh;
	top:0;right:0;bottom:0;left:0;
		-webkit-animation: error 0.25s linear;
		-moz-animation: error 0.25s linear;
		-o-animation: error 0.25s linear;
		animation: error 0.25s linear;
		animation-delay: 0.35s;
		animation-iteration-count: 1;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
}

@-webkit-keyframes error {
    0% {-webkit-transform: translateX(-1%) scale(1);}
    20% {-webkit-transform: translateX(1%) scale(1);}
    40% {-webkit-transform: translateX(-0.5%) scale(1);}
    60% {-webkit-transform: translateX(0.5%) scale(1);}
    80% {-webkit-transform: translateX(-0.25%) scale(1);}
    100% {-webkit-transform: translateX(0) scale(1);}
}
@-moz-keyframes error {
    0% {-moz-transform: translateX(-1%) scale(1);}
    20% {-moz-transform: translateX(1%) scale(1);}
    40% {-moz-transform: translateX(-0.5%) scale(1);}
    60% {-moz-transform: translateX(0.5%) scale(1);}
    80% {-moz-transform: translateX(-0.25%) scale(1);}
    100% {-moz-transform: translateX(0) scale(1);}
}
@keyframes error {
    0% {transform: translateX(-1%) scale(1);}
    20% {transform: translateX(1%) scale(1);}
    40% {transform: translateX(-0.5%) scale(1);}
    60% {transform: translateX(0.5%) scale(1);}
    80% {transform: translateX(-0.25%) scale(1);}
    100% {transform: translateX(0) scale(1);}
}

.default-action {
	opacity:1;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.loading-action {display:none;margin-top:-2px;opacity:0;}

.loading-icon {
	margin:0!important;
	padding:0!important;
	transform:rotate(0deg);
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
}

@keyframes rotateloop {
  0% {
    transform:rotate(0deg);
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
  }
  100% {
    transform:rotate(360deg);
	-webkit-transform:rotate(360deg);
	-moz-transform:rotate(360deg);
	-ms-transform:rotate(360deg);
	-o-transform:rotate(360deg);
  }

}

@-webkit-keyframes rotateloop {
  0% {
    transform:rotate(0deg);
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
  }
  100% {
    transform:rotate(360deg);
	-webkit-transform:rotate(360deg);
	-moz-transform:rotate(360deg);
	-ms-transform:rotate(360deg);
	-o-transform:rotate(360deg);
  }

}

/* ///////////////////////// */
/* 
/* 		Overall Customizable UI Styles
/* 
/* ///////////////////////// */

@font-face {
    font-family: 'Abel';
    src: url('../fonts/abel.woff2') format('woff2'),
         url('../fonts/abel.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'newjunebookitalic';
    src: url('../fonts/newjune_book_italic.woff2') format('woff2'),
    	 url('../fonts/newjune_book_italic.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

* { /* This sets the baseline for all elements */
	font-family: 'Abel', sans-serif;
}

a.link {
	color:#2da4ff;
}

a.link:hover {
	color:#000000;
}

::selection {
	background-color:var(--secondarycolor);
	color:white;
}

::-moz-selection {
	background-color:#2da4ff;
	color:white;
}

hr {
	border: 0;
	height: 0;
	margin:var(--basespacing) 0;
}

hr.smallspace {
	margin:calc(var(--basepadding)*0.5) 0;
}

hr.smallestspace {
	margin:calc(var(--basepadding)*0.25) 0;
}

hr.gray-line {
	border: 0;
	height: 0;
	border-bottom: 1px solid var(--gray7);
}

hr.gray4-line {
	border: 0;
	height: 0;
	border-bottom: 1px solid var(--gray4);
}

hr.gray-line.smallspace {
	margin:var(--basepadding) 0;
}

hr.centered-breaker {
	width:20%;
	margin-left:auto;
	margin-right:auto;
}

hr.smallest-top-space {
	margin-top:calc(var(--basepadding)*0.3)!important;
}

hr.card-header-line {
	margin:var(--basepadding) 0;
	border-bottom: 1px solid var(--gray5);
}

hr.content-header-line {
	margin:calc(var(--basespacing)*1.6) 0 var(--basespacing) 0;
	border-bottom:1px solid var(--gray4);
}

.button, button {
	padding:0 var(--basepadding) 0 var(--basepadding);
	margin:0 1px 0 1px;
	line-height:var(--baselineheight);
	border:1px solid rgba(0,0,0,0);
	border-radius:var(--baselineheight);
	vertical-align:middle;
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

button.wider, .button.wider {
	padding:0 calc(var(--basepadding)*2) 0 calc(var(--basepadding)*2);
}

.standard-modal-box-holder {
	background-color:rgba(255,255,255,0);
}

.standard-modal-box {
	width:calc(100% - var(--basepadding));
	max-width:400px;
}

.standard-modal-box.wide {
	max-width:600px;
}

.standard-modal-box {
	background:white;
	border-radius:var(--roundcorner);
	box-shadow: var(--modalshadow);
}
.standard-modal-header {
	padding:calc(var(--basespacing)*3.5) calc(var(--basespacing)*3.5);
	border-bottom:1px solid (var(--gray4));
}

.standard-modal-content {
	padding:calc(var(--basepadding)*2) calc(var(--basespacing)*3.5);
	padding-top:0;
	margin-bottom:calc(var(--basepadding)*1);
}

.standard-modal-footer {
	grid-gap:var(--basespacing);
	padding:calc(var(--basepadding)*2) 0 calc(var(--basespacing)*3.5) 0;
	margin:0 calc(var(--basespacing)*3.5);
	border-top:1px solid var(--gray4);
}

.standard-modal-footer.no-line {border-top:none;padding-top:0;}

.standard-modal-box .close-box, #warning-alert .close-box, #error-alert .close-box, #success-alert .close-box {
	cursor:pointer;
	position:absolute;
	z-index:2;
	right:calc(var(--basespacing)*1.5);
	top:calc(var(--basespacing)*1.5);
	border-radius:var(--rounded);
	background:var(--gray6);
	color:var(--secondarycolor);
}

.standard-modal-box .close-box:hover, #warning-alert .close-box:hover, #error-alert .close-box:hover, #success-alert .close-box:hover {
	background:var(--primaryaccentcolor);
	color:var(--primarydarkcolor);
}

/* Custom Swal specifics */

.swal2-modal.standard-modal-box {
	max-width:450px;
}

.swal2-modal.standard-modal-box.wide {
	max-width:600px;
}

.swal2-modal .standard-modal-header {
	padding-bottom:calc(var(--basespacing)*2);
	padding-top:calc(var(--basespacing)*7);
}

.swal2-modal .standard-modal-title {
	font-family: 'newjunebookitalic';
	font-weight: normal;
    	font-style: normal;
	color:inherit;
	line-height:0.85;
	font-size:30px;
	line-height:1;
	display:inline;
	text-align:center;
}

.swal2-modal .standard-modal-content {
	padding-bottom:calc(var(--basespacing)*2.5);
	font-size:100%;
	line-height:1.25;
	text-align:center;
	margin:0 auto;
}

.swal2-modal .standard-modal-footer {
	border-top:none;
}

.swal2-modal .close-box, .swal2-modal .close-box:hover {
	color:rgba(255,255,255,0);
	text-indent:100px;
}

.swal2-modal .close-box:after {
	content:"close";
	text-align:center;
	font-size:var(--buttonFONTsize);
	color:var(--secondarycolor);
	text-indent:0;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

.swal2-modal .close-box:hover:after {
	color:var(--primarydarkcolor);
}

/* // Custom Swal specifics */

#fullpage-dimmer {
	background-color:rgba(0,0,0,0);
}

#fullpage-dimmer.active {
	background-color:rgba(0,0,0,0.35);
}


input.error, textarea.error, .custom-select.error, .errorhighlight {
	border: 1px solid rgba(255,0,50,1)!important;
}

.input-icon {
	color:var(--gray3);
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
	right:var(--basepadding);
}

.input-wrapper.icon-on-left .input-icon {
	right:auto;
	left:var(--basepadding);
}

.btn-s.input-icon {
	right:calc(var(--basepadding)*0.8);
}

.input-wrapper.icon-on-left.btn-s .input-icon {
	right:auto;
	left:calc(var(--basepadding)*0.6);
}

.input-wrapper.btn-s {
	padding:0;
}

.grid-2 {
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:var(--basespacing);
}
.grid-3 {
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:var(--basespacing);
}
.grid-4 {
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:var(--basespacing);
}

.input-wrapper2 {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}

.input-wrapper2 .input-wrapper, .input-wrapper2 .dropdown, .input-wrapper2 button {
	width:calc(50% - calc(var(--basespacing)*0.5));
}

input.bordered {
	border:1px solid var(--gray5);
}

.input-wrapper {position:relative}
.input-wrapper:after {
	content:'';
	position:absolute;
	bottom:0;left:0;
	width:100%;
	height:1px;
	background:var(--primaryaccentcolor);
	transform:scaleX(0);
	transition:all 0.25s var(--normal-easing);
	-webkit-transition:all 0.25s var(--normal-easing);
	-moz-transition:all 0.25s var(--normal-easing);
	-ms-transition:all 0.25s var(--normal-easing);
	-o-transition:all 0.25s var(--normal-easing);
}

input, textarea, .custom-select {
		padding-left:calc(var(--basepadding)*1.1);
		padding-right:var(--basepadding);
		border:1px solid var(--gray5);
		color:var(--gray3);
		background-color:var(--gray7);
		/* border-radius:var(--baselineheight); */
		border-radius:var(--rounded);
}

textarea {
	/* border-radius:var(--baselineheight); */
	border-radius:15px;
}

input, .custom-select {
	line-height:var(--baselineheight);
}

select {
	padding:0 calc(var(--basepadding)*2) 0 var(--basepadding);
}

input:hover, input:focus, textarea:hover, textarea:focus {
	background:transparent;
}

input:focus {
	background:transparent!important;
	border:1px solid rgba(255,255,255,0);
	border-radius:0;
}

textarea:focus {
	background:transparent!important;
}

.input-wrapper:focus-within:after {
	transform:scaleX(1);
}

input.bordered:focus {
	border:1px solid var(--gray5);
	border-radius:var(--rounded);
}

/* select:hover option, select:focus option, .custom-select:hover option, .custom-select:focus option {
	
} */

@-webkit-keyframes autofill {
    to {
        color:var(--primarydarkcolor);
        background-color:var(--gray7);
		/* Handle Safari */
		-webkit-text-fill-color: var(--primarydarkcolor);
    }
}

@-webkit-keyframes autofillfocus {
    to {
        background-color:transparent;
		border:1px solid rgba(255,255,255,0);
		border-bottom:1px solid var(--primaryaccentcolor);
		border-radius:0;
		/* Handle Safari */
		-webkit-text-fill-color: var(--primarydarkcolor);
    }
}

::-webkit-credentials-auto-fill-button {
    visibility: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
}

input::-webkit-caps-lock-indicator {
	color:var(--gray3);
	position:absolute;
	top:50%;
	transform:translateY(-55%);
	-webkit-transform:translateY(-55%);
	-moz-transform:translateY(-55%);
	-ms-transform:translateY(-55%);
	-o-transform:translateY(-55%);
	right:calc(var(--basepadding)*2 + 7px);
}

input::-ms-clear {display:none;}
input::-ms-reveal {display:none;}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
    /* Handle Safari */
	-webkit-box-shadow: 0 0 0 1000px var(--gray7) inset!important;
	background-clip: content-box !important;
}
 
input:-webkit-autofill:focus,
textarea:-webkit-autofill:focus,
select:-webkit-autofill:focus {
	-webkit-animation-name: autofillfocus;
	-webkit-animation-fill-mode: both;
	-webkit-animation-duration:0.25s;
	-webkit-animation-timing-function: var(--normal-easing);
	/* Handle Safari */
	-webkit-box-shadow: 0 0 0 1000px white inset!important;
	background-clip: content-box !important;
}

/* Custom Select */

.custom-select:before {
	width:30px;
	height:30px;
	background-color:white;
	border-left:1px solid #dddddd;
}

.custom-select:after {
	content:"keyboard_arrow_down";
	right:7px;
}

.custom-select select {
	color:rgb(150,150,150);
}

.custom-select:hover select {
	color:#2da4ff;
}

.custom-select:hover:after {
	color:white;
}

.custom-select:hover:before {
	background-color:#2da4ff;
	color:white;
}

/* //Custom Select */

/* Custom Checkboxes */

[type="checkbox"] + label {
	font-size:var(--XSbuttonFONTsize);
	border-radius:var(--rounded);
	border:1px solid ;
}

[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
	padding:calc(var(--basespacing)*0.3) calc(var(--basespacing)*1) calc(var(--basespacing)*0.3) calc(var(--basespacing)*2.5);
	border-radius:var(--rounded);
}

[type="checkbox"]:not(:checked) + label {
	border:1px solid var(--gray4);
	background:transparent;
	color:var(--gray3);
}

[type="checkbox"]:checked + label {
	border:1px solid var(--secondarycolor);
	background:transparent;
}

/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
	left:8px;
	width: 8px; height: 8px; border-radius:var(--rounded);
	background: var(--gray5);
}

/* Remove border from checkbox box on check */
[type="checkbox"]:checked + label:before {
	border:1px solid rgba(255,255,255,0);
	background:transparent;
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
	left:8px;
	content:"\e5ca";
	font-size:14px;
	color: var(--secondarycolor);
}
/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
	background: var(--gray5);
}
[type="checkbox"]:disabled:checked + label:after {
	color: var(--gray4);
}
[type="checkbox"]:disabled + label {
	color: var(--gray4);
}
/* accessibility */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
	border: none;
}

/* //Custom Checkboxes */

/* Custom Radio Button */

[type="radio"] + label {
	font-size:var(--XSbuttonFONTsize);
	border-radius:var(--rounded);
	border:1px solid ;
}

[type="radio"]:not(:checked) + label,
[type="radio"]:checked + label {
	padding:calc(var(--basespacing)*0.3) calc(var(--basespacing)*1) calc(var(--basespacing)*0.3) calc(var(--basespacing)*2.5);
	border-radius:var(--rounded);
}

[type="radio"]:not(:checked) + label {
	border:1px solid var(--gray4);
	background:transparent;
	color:var(--gray3);
}

[type="radio"]:checked + label {
	border:1px solid var(--secondarycolor);
	background:transparent;
}

/* checkbox aspect */
[type="radio"]:not(:checked) + label:before,
[type="radio"]:checked + label:before {
	left:8px;
	width: 8px; height: 8px; border-radius:var(--rounded);
	background: var(--gray5);
}

/* Remove border from checkbox box on check */
[type="radio"]:checked + label:before {
	border:1px solid rgba(255,255,255,0);
	background:transparent;
}
/* checked mark aspect */
[type="radio"]:not(:checked) + label:after,
[type="radio"]:checked + label:after {
	left:8px;
	content:"check";
	font-size:14px;
	color: var(--secondarycolor);
}
/* disabled checkbox */
[type="radio"]:disabled:not(:checked) + label:before,
[type="radio"]:disabled:checked + label:before {
	background: var(--gray5);
}
[type="radio"]:disabled:checked + label:after {
	color: var(--gray4);
}
[type="radio"]:disabled + label {
	color: var(--gray4);
}
/* accessibility */
[type="radio"]:checked:focus + label:before,
[type="radio"]:not(:checked):focus + label:before {
	border: none;
}

/* hover style just for information */
/*
label:hover:before {
	border: 2px solid var(--primarydarkcolor)!important;
}
label:hover {
	color:var(--primarydarkcolor);
}
*/



.dropdown-item {
	display:grid;
	grid-template-columns:1fr;
	grid-gap:calc(var(--basespacing)*0.75);
	align-items:center;
}

.dropdown-btn {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	gap:calc(var(--basespacing)*0.75);
	font-size:var(--buttonFONTsize);
}

.dropdown-item.new:after {
	content:"";
	position:absolute;
	z-index:2;
	left:0;
	top:9px;
	width:7px;height:7px;
	border-radius:var(--rounded);
	background:var(--primaryaccentcolor);
	transform:translate(-95%,-50%);
	-webkit-transform:translate(-95%,-50%);
	-moz-transform:translate(-95%,-50%);
	-ms-transform:translate(-95%,-50%);
	-o-transform:translate(-95%,-50%);
}

.dropdown-item label {
	width:100%;
	padding:0!important;
	margin:0;
	border:none!important;
	padding-right:calc(var(--basespacing)*3);
	font-size:var(--buttonFONTsize);
}

.dropdown-item:first-child {border-top:1px solid var(--gray3);}

.dropdown-item [type="checkbox"]:not(:checked) + label:after,
.dropdown-item [type="checkbox"]:checked + label:after,
.dropdown-item [type="radio"]:not(:checked) + label:after,
 .dropdown-item [type="radio"]:checked + label:after{
	right:calc(var(--basepadding)*0.5);
	left:auto;
}

.dropdown-item [type="checkbox"]:checked + label:after,
.dropdown-item [type="radio"]:checked + label:after {
	left:auto;
	right:calc(var(--basepadding)*0.5);
	font-size:14px;
	color: var(--primaryaccentcolor);
}

.dropdown-item [type="checkbox"]:not(:checked) + label:before,
.dropdown-item [type="checkbox"]:checked + label:before,
.dropdown-item [type="radio"]:not(:checked) + label:before,
.dropdown-item [type="radio"]:checked + label:before {
	width:12px;height:12px;border-radius:var(--rounded);
	right:calc(var(--basepadding)*0.5);
	left:auto;
	border:none;
	background:rgba(0,0,0,0.5);
}

.dropdown-item [type="checkbox"]:checked + label:before,
.dropdown-item [type="radio"]:checked + label:before {
	background:transparent;
}




/* //Custom Radio Button */

/* Group Toggle Button */

.toggle-btn-group {
	display:flex;
}

.toggle-btn-group button {margin:0;}
.toggle-btn-group button:not(:first-child) {transform:translateX(-1px)}

.toggle-btn-group button:not(:first-child):not(:last-child)) {
	border-radius:0;
}

.toggle-btn-group button:first-child {
	border-top-right-radius:0;
	border-bottom-right-radius:0;
}

.toggle-btn-group button:last-child {
	border-top-left-radius:0;
	border-bottom-left-radius:0;
}

/* //Group Toggle Button */

input[placeholder] {color:var(--gray3);}
input::-webkit-input-placeholder {color:var(--gray3);}
input:-moz-placeholder {color:var(--gray3);}
input:-ms-input-placeholder {color:var(--gray3);}

textarea[placeholder] {color:var(--gray3);}
textarea::-webkit-input-placeholder {color:var(--gray3);}
textarea:-moz-placeholder {color:var(--gray3);}
textarea:-ms-input-placeholder {color:var(--gray3);}

input.empty:valid{
	color:var(--primarydarkcolor);
}

input:invalid,
input:required,
textarea:invalid,
textarea:required {
	color:red;
}

input:valid, select.selected {
	color:var(--primarydarkcolor);
}

textarea {
	color:var(--primarydarkcolor);
	padding:15px;
	height:300px;
}

textarea.small {
	height:150px;
}

input:focus {
	background-color: transparent;
	/* border-bottom:1px solid var(--primaryaccentcolor); */
	padding-left:0;padding-right:0;
}

input.bordered:focus {
	padding-left:calc(var(--basepadding)*1.1);
	padding-right:calc(var(--basepadding)*1.1);
}

input.error, textarea.error, .custom-select.error, .errorhighlight {
	border: 1px solid rgba(255,0,50,1)!important;
}

span.error {
	margin-bottom:5px;
}

.error-label {
	color:red;
	display:none;
}

.line-height-1 {
	line-height:1;
}


/* ///////////////////////// */
/* 
/* 		// Overall Customizable UI Styles
/* 
/* ///////////////////////// */

/* ///////////////////////// */
/* 
/* 		Button Styles
/* 
/* ///////////////////////// */

.btn-primary-cta, .btn-secondary-cta, .btn-terciary-cta {
	position:relative;
	z-index:1;
}

.btn-primary-cta {
	color:var(--primarydarkcolor);
	background-color:var(--primaryaccentcolor);
}

.btn-primary-cta:hover {
	border:1px solid var(--primaryaccentcolor);
	background:white;
	transition:all 0.15s ease;
	-webkit-transition:all 0.15s ease;
	-moz-transition:all 0.15s ease;
	-ms-transition:all 0.15s ease;
	-o-transition:all 0.15s ease;
}

.special-cta {
	box-shadow:var(--coloredelementshadow);
}


@keyframes buttonfeedback {
    0% { width:0;height:0;border-radius:0; }
    50% { width:100px;height:100px;border-radius:100px; }
    99% { width:200px;height:200px;border-radius:200px;background-color:rgba(0,0,0,0); }
    100% { width:0;height:0;border-radius:0;background-color:rgba(0,0,0,0.15); }
}
@-webkit-keyframes buttonfeedback {
    0% { width:0;height:0;border-radius:0; }
    50% { width:100px;height:100px;border-radius:100px; }
    99% { width:200px;height:200px;border-radius:200px;background-color:rgba(0,0,0,0); }
    100% { width:0;height:0;border-radius:0;background-color:rgba(0,0,0,0.15); }
}
@-moz-keyframes buttonfeedback {
    0% { width:0;height:0;border-radius:0; }
    50% { width:100px;height:100px;border-radius:100px; }
    99% { width:200px;height:200px;border-radius:200px;background-color:rgba(0,0,0,0); }
    100% { width:0;height:0;border-radius:0;background-color:rgba(0,0,0,0.15); }
}

.btn-secondary-cta {
	color:var(--primarydarkcolor);
	border:1px solid var(--gray3);
}

.btn-secondary-cta:hover, .btn-secondary-cta.active {
	text-shadow:1px 1px 3px rgba(0,0,0,0.25);
	color:white!important;
	background:var(--secondarycolor);
}

.btn-terciary-cta {
	color:var(--secondarycolor);
	background:var(--gray6);
}

button.btn-terciary-cta:hover, button.btn-terciary-cta.active, .button.btn-terciary-cta:hover, .button.btn-terciary-cta.active {
	background:var(--primaryaccentcolor);
	color:var(--primarydarkcolor);
}

.btn-quarterly-cta {
	color:var(--primarycolor);
	background:var(--gray6);
}

button.btn-terciary-cta:hover, button.btn-terciary-cta.active, .button.btn-terciary-cta:hover, .button.btn-terciary-cta.active {
	background:var(--secondarycolor);
	color:white;
}

button.align-content, .button.align-content {
	display:grid;
	align-items:center;
	padding:0 calc(var(--basespacing)*1.2) 0 calc(var(--basespacing)*1.2);
}

.btn-simple-underline {
	line-height:1;
	color:var(--primarydarkcolor);
}

.btn-simple-underline:hover {
	color:var(--primarydarkcolor);
	text-decoration:underline!important;
}

.btn-simple-underline.underlined {
	text-decoration:underline!important;
}

.btn-simple-underline.underlined:hover {
	color:#222222;
	text-decoration:underline!important;
}

.btn-simple-underline.has-icon i {
	text-decoration:none;
	padding:calc(var(--basepadding)*0.5);
	background:var(--primaryaccentcolor);
	border-radius:var(--rounded);
}

.btn-simple-underline.has-icon i:first-child {margin-right:var(--basespacing);}
.btn-simple-underline.has-icon i:last-child {margin-left:var(--basespacing);}
.btn-simple-underline.has-icon i:not(:last-child):not(:first-child) {margin-left:var(--basespacing);margin-right:var(--basespacing)}

.btn-s {
	font-size:var(--SbuttonFONTsize);
	line-height:1;
	height:var(--lineheightSM);
	padding:0 calc(var(--basespacing)*1.2) 0 calc(var(--basespacing)*0.8);
}

.btn-s span {vertical-align:middle;}

.btn-s .material-icons {margin-top:0;}

.btn-s .button-icon {
	font-size:18px!important;
	margin-right:calc(var(--basespacing)*0.5);
}

.btn-has-icon-right.btn-s i {
	margin-right:calc(var(--basespacing)*0.5);
}

input.btn-s {
	padding: 0 calc(var(--basespacing)*1.2) 0 calc(var(--basespacing)*1.2);
}

input.btn-s:focus {
	padding-left:0;padding-right:0;
}

.input-wrapper.icon-on-left input.btn-s {
	padding: 0 calc(var(--basespacing)*1.2) 0 calc(var(--basepadding)*2);
}

.input-wrapper.icon-on-left input.btn-s:focus {
	padding-left:calc(var(--basepadding)*2);padding-right:0;
}

.input-wrapper.icon-on-left input.btn-s:focus .btn-s.input-icon {
	left:0;
}

.btn-s.input-icon {
	font-size:18px!important;
	line-height:1;
	height:auto;
	padding:0;
}

.btn-xs {
	font-size:var(--XSbuttonFONTsize);
	line-height:var(--lineheightS);
}

.btn-xs i {font-size:var(--buttonFONTsize)!important;}
.btn-xs.btn-square i {font-size:var(--SbuttonFONTsize)!important;}

.btn-simple {
	color:var(--gray3);
}

.btn-inline {
	height:auto;
	line-height:1;
}

.btn-inline i {
	margin-right:calc(var(--basespacing)*0.25);
}

.searchbar {display:grid;}

.btn-search {
	box-sizing:border-box;
	position:relative;
	display:inline-block;
	width:var(--baselineheight);
	height:var(--baselineheight);
	line-height:var(--baselineheight);
	padding:0;
}

.btn-search {
	padding-right:calc(var(--basepadding)*0.5);
}

.btn-search-x {
	opacity:0;
	font-size:18px!important;
	font-size:var(--SbuttonFONTsize);
	line-height:1;
	height:var(--lineheightSM);
	padding: 0;	
	color:var(--gray3);
	position:absolute;
	top:50%;
	right:calc(var(--basepadding)*0.5);
	transform:translateY(-54%);
	-webkit-transform:translateY(-54%);
	-moz-transform:translateY(-54%);
	-ms-transform:translateY(-54%);
	-o-transform:translateY(-54%);
	display:block;
	z-index:1;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.searchbar input {
	width:0;
	opacity:0;
	justify-self: end;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.btn-search-open {
	padding:0;
	position:absolute;
	z-index:2;
	top:50%;
	transform:translateY(-50%) scale(1.25);
	-webkit-transform:translateY(-50%) scale(1.25);
	-moz-transform:translateY(-50%) scale(1.25);
	-ms-transform:translateY(-50%) scale(1.25);
	-o-transform:translateY(-50%) scale(1.25);
	right:0;
	line-height:1;
	height:var(--lineheightSM);
	width:var(--lineheightSM);
	background:var(--primaryaccentcolor);
	color:var(--primarydarkcolor);
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.btn-search-x i {
	font-size:18px!important;
}

.btn-search-open i {
	font-size:14px!important;
}



.searchbar.open input {
	width:100%;
	opacity:1;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

#playlistControls .searchbar.expanded {
	grid-column:span 2;
}

#filemanager-actions .searchbar.expanded {
	grid-column:span 2;
}

#terminalControls .searchbar.expanded {
	grid-column:span 2;
}

.searchbar.open .btn-search-x {
	opacity:1;
}


.hidden-input {
	display:grid;
	position:relative;
}

.hidden-input input {
	width:0;
	opacity:0;
	justify-self: start;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.hidden-input .btn-input-actions {
	position:absolute;
	top:50%;
	right:0;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);

	font-size:var(--SbuttonFONTsize);
	height:var(--lineheightSM);
	padding: 0;
	padding-right:calc(var(--basepadding)*0.5);
	color:var(--gray3);
	
	display:grid;
	grid-template-columns: max-content max-content;
	align-items: center;
	justify-items: end;

	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.hidden-input .btn-input-open {
	position:absolute;
	left:0;
	top:0;
	width:auto;
}

.hidden-input .btn-input-actions button {
	opacity:0;
	transform:scale(0);
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	-ms-transform:scale(0);
	-o-transform:scale(0);
}

.hidden-input .btn-input-actions .btn-input-action {
	padding:0;
}

.hidden-input .btn-input-actions .btn-input-action i {
	font-size:18px!important;
}

.hidden-input.open .btn-input-actions button {
	opacity:1;
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
}

.hidden-input.open input {
	width:100%;
	opacity:1;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

#playlistControls .hidden-input.expanded {
	grid-column:span 2;
}


.inline-link {
	padding:0;
	line-height:1.35;
	margin:0;
	vertical-align:top;
}

.underline {
	text-decoration:underline!important;
}

.btn-rounded {
	border-radius:1000px;
}

.btn-square {
	width:var(--baselineheight);
	height:var(--baselineheight);
	line-height:var(--baselineheight);
	padding:0;
}

.btn-s.btn-square {
	width:var(--lineheightSM);
	height:var(--lineheightSM);
	line-height:var(--lineheightSM);
}

.btn-xs.btn-square {
	width:var(--lineheightS);
	height:var(--lineheightS);
	line-height:var(--lineheightS);
}

a.button[download] {
	display:flex;
	align-items:center;
}

button[disabled], button.inactive, .button.inactive, .inactive {
	/*filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
	/*filter: gray;
	/*-webkit-filter: grayscale(100%); */
	opacity:0.35;
	cursor:pointer;
}

button[disabled] {
	pointer-events:none;
}

button.small.btn-square, .button.small.btn-square {
	width:15px;
	height:15px;
	padding:0;
	line-height:15px;
}

button.small, .button.small {
	line-height:15px;
}

input.small {
	font-size:14px;
	padding:0 10px 0 10px;
}

[class^="btn-"], button, .button {
	cursor:pointer;
}

.button-icon {
	margin-right:var(--basespacing);
}

.btn-has-icon-right {
	padding-left:calc(var(--basespacing)*2);
}

.btn-has-icon-right i {
	margin-left:calc(var(--basespacing)*0.5);
}

.btn-s.btn-has-icon-right {
	padding-left:calc(var(--basespacing)*1.25);
	padding-right:calc(var(--basespacing)*0.5);
}

.btn-s.btn-has-icon-right i {
	margin-left:calc(var(--basespacing)*0.5);
}

.btn-xs.btn-has-icon-right {
	padding-left:calc(var(--basespacing)*1.2);
	padding-right:calc(var(--basespacing)*1);
}

.btn-xs.btn-has-icon-right i {
	margin-left:calc(var(--basespacing)*0.5);
	margin-right:0;
}

.btn-has-icon {
	display:grid;
	grid-template-columns:max-content max-content;
	align-items:center;
}


/* ///////////////////////// */
/* 
/* 		//Button Styles
/* 
/* ///////////////////////// */

/* ///////////////////////// */
/* 
/* 		Basic styles
/* 
/* ///////////////////////// */

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

p {
	font-size:100%;
	line-height:1.25;
	margin:0;
	padding:0;
}

p.smaller {
	font-size:80%;
}

.italic {
	font-style:italic;
}

h1, h2, h3, h4, h5, h6 {
	margin:0;
	padding:0;
	font-family: inherit;
	font-weight: normal;
    	font-style: normal;
    	line-height:1.45;
}

h1 { /* Inspiring Titles */
	font-family: 'newjunebookitalic';
	font-weight: normal;
    	font-style: normal;
	color:inherit;
	line-height:0.85;
	font-size:30px;
}

h1.bigger {
	font-size:34px;
}

h1.smaller {
	font-size:24px;
}

h2 {
	display:inline;
	line-height:1;
	font-size:27px;
}

h2.bigger {
	font-size:38px;
}

h3 {
	font-size:21px;
	line-height:1.15;
}

h3.bigger {
	font-size:23px;
}

h4 {
	line-height:1;
	display:inline;
	font-size:18px;
}

h4.bigger {
	font-size:20px;
}

h5 {
	font-size:20px;
}

h6 {
	display:inline;
	font-size:16px;
}

h6.smaller {
	font-size:var(--XSbuttonFONTsize);
}

h6.bigger {
	font-size:15px;
	letter-spacing:3px;
}

.uncaps {
	text-transform:none;
	letter-spacing:normal;
}

.no-pointer {
	cursor:default;
}

.notransition {
	transition:none;
	-webkit-transition:none;
	-moz-transition:none;
	-ms-transition:none;
	-o-transition:none;
}

.no-border {
	border:none;
}

.no-sideborder {
	border-right:0;
	border-left:0;
}

.no-margin {margin:0;}
.no-padding {padding:0;}
.no-verticalpadding {padding-top:0;padding-bottom:0;}
.no-horizontalpadding {padding-left:0;padding-right:0;}
.no-horizontalmargin {margin-left:0;margin-right:0;}

.leftfloat {float:left;}
.rightfloat {float:right;}
.nofloat {float:none;clear:both;}

[class*="flex-"] {display:flex}
.flex-start {justify-content:flex-start}
.flex-end {justify-content:flex-end}
.flex-space-between {justify-content:space-between}

.block {display:block}

.mt0 {margin-top:0;}
.mr0 {margin-right:0;}
.ml0 {margin-left:0;}
.mb0 {margin-bottom:0;}
.mt1 {margin-top:1px;}
.mr1 {margin-right:1px;}
.ml1 {margin-left:1px;}
.mb1 {margin-bottom:1px;}
.mt2 {margin-top:2px;}
.mr2 {margin-right:2px;}
.ml2 {margin-left:2px;}
.mb2 {margin-bottom:2px;}
.mt5 {margin-top:5px;}
.mr5 {margin-right:5px;}
.ml5 {margin-left:5px;}
.mb5 {margin-bottom:5px;}
.mt10 {margin-top:10px;}
.ml10 {margin-left:10px;}
.mr10 {margin-right:10px;}
.mb10 {margin-bottom:10px;}
.mt15 {margin-top:15px;}
.ml15 {margin-left:15px;}
.mr15 {margin-right:15px;}
.mb15 {margin-bottom:15px;}
.mt20 {margin-top:20px;}
.ml20 {margin-left:20px;}
.mr20 {margin-right:20px; }
.mb20 {margin-bottom:20px;}
.mt25 {margin-top:25px;}
.ml25 {margin-left:25px;}
.mr25 {margin-right:25px; }
.mb25 {margin-bottom:25px;}
.mt30 {margin-top:30px;}
.ml30 {margin-left:30px;}
.mr30 {margin-right:30px; }
.mb30 {margin-bottom:30px;}
.mt40 {margin-top:40px;}
.ml40 {margin-left:40px;}
.mr40 {margin-right:40px; }
.mb40 {margin-bottom:40px;}
.mt45 {margin-top:45px;}
.ml45 {margin-left:45px;}
.mr45 {margin-right:45px; }
.mb45 {margin-bottom:45px;}
.mt50 {margin-top:50px;}
.ml50 {margin-left:50px;}
.mr50 {margin-right:50px; }
.mb50 {margin-bottom:50px;}
.mt55 {margin-top:55px;}
.ml55 {margin-left:55px;}
.mr55 {margin-right:55px; }
.mb55 {margin-bottom:55px;}
.mt80 {margin-top:80px;}
.ml80 {margin-left:80px;}
.mr80 {margin-right:80px; }
.mb80 {margin-bottom:80px;}

.pt0 {padding-top:0px;}
.pr0 {padding-right:0px;}
.pl0 {padding-left:0px;}
.pb0 {padding-bottom:0px;}
.pt5 {padding-top:5px;}
.pr5 {padding-right:5px;}
.pl5 {padding-left:5px;}
.pb5 {padding-bottom:5px;}
.pt10 {padding-top:10px;}
.pl10 {padding-left:10px;}
.pr10 {padding-right:10px;}
.pb10 {padding-bottom:10px;}
.pt15 {padding-top:15px;}
.pl15 {padding-left:15px;}
.pr15 {padding-right:15px;}
.pb15 {padding-bottom:15px;}
.pt20 {padding-top:20px;}
.pl20 {padding-left:20px;}
.pr20 {padding-right:20px; }
.pb20 {padding-bottom:20px;}
.pt25 {padding-top:25px;}
.pl25 {padding-left:25px;}
.pr25 {padding-right:25px; }
.pb25 {padding-bottom:25px;}
.pt30 {padding-top:30px;}
.pl30 {padding-left:30px;}
.pr30 {padding-right:30px; }
.pb30 {padding-bottom:30px;}
.pt50 {padding-top:50px;}
.pl50 {padding-left:50px;}
.pr50 {padding-right:50px; }
.pb50 {padding-bottom:50px;}
.pt70 {padding-top:70px;}
.pl70 {padding-left:70px;}
.pr70 {padding-right:70px; }
.pb70 {padding-bottom:70px;}
.pt50 {padding-top:50px;}
.pt70 {padding-top:50px;}
.pt100 {padding-top:100px;}
.pl100 {padding-left:100px;}
.pr100 {padding-right:100px;}
.pb100 {padding-bottom:100px;}

.left-text {text-align:left;}
.right-text {text-align:right;}
.center-text {text-align:center;}

.top-align {vertical-align:top;}
.vertical-align {vertical-align:middle;}
.inline-block {display:inline-block;}
.inline {display:inline;}

.vertical-center {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
}
.horizontal-center {
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
    -moz-transform:translateX(-50%);
    -ms-transform:translateX(-50%);
    -o-transform:translateX(-50%);
}
.absolute-center {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);
}
.absolute-left {left:0;}
.absolute-right {right:0;}
.absolute-top {top:0;}
.absolute-bottom {bottom:0;}

.transition {
	transition: all .25s ease;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
}

.faster-transition {
	transition: all .15s ease;
	-webkit-transition: all .15s ease;
	-moz-transition: all .15s ease;
	-ms-transition: all .15s ease;
	-o-transition: all .15s ease;
}

.slower-transition {
	transition: all .35s ease;
	-webkit-transition: all .35s ease;
	-moz-transition: all .35s ease;
	-ms-transition: all .35s ease;
	-o-transition: all .35s ease;
}

/* ///////////////////////// */
/* 
/* 		// Basic styles
/* 
/* ///////////////////////// */

/* ///////////////////////// */
/* 
/* 		Text styles + BG styles
/* 
/* ///////////////////////// */

.white-text {color:white;}
.paragraph-text {color:#222222;}
.mediumgray-text {color:#777777;}
.lightgray-text {color:#cccccc;}
.lightmediumgray-text {color:#999999;}
.darkgray-text {color:#666666;}
.primarycolor-text {color:var(--primarydarkcolor);}

.white-bg {background-color:white;}
.light-bg {background-color:#fbfbfb;}
.lightgray-bg{background-color:#fbfbfb;}
.lightmediumgray-bg{background-color:#cccccc;}
.black-bg{background-color:#000000;}
.blacktranslucid-bg{background-color:rgba(0,0,0,0.5);}

circle.primaryaccent-bg {fill:var(--primaryaccentcolor);stroke:none}

button.mediumgray-text:hover, button.lightgray-text:hover, button.lightmediumgray-text:hover,
.mediumgray-text > a:hover, .lightgray-text > a:hover, .lightmediumgray-text > a:hover,
a.mediumgray-text:hover, a.lightgray-text:hover, a.lightmediumgray-text:hover,
button:hover > .mediumgray-text, button:hover > .lightgray-text, button:hover > .lightmediumgray-text,
.button:hover > .mediumgray-text, .button:hover > .lightgray-text, .button:hover > .lightmediumgray-text
 {
	color:white;
	transition:all 0.15s ease;
	-webkit-transition:all 0.15s ease;
	-moz-transition:all 0.15s ease;
	-ms-transition:all 0.15s ease;
	-o-transition:all 0.15s ease;
}

button.white-text:hover,
.white-text > a:hover,
a.white-text:hover,
button:hover > .white-text,
.button:hover > .white-text,
 {
	color:#000000;
	transition:all 0.15s ease;
	-webkit-transition:all 0.15s ease;
	-moz-transition:all 0.15s ease;
	-ms-transition:all 0.15s ease;
	-o-transition:all 0.15s ease;
}

/* ///////////////////////// */
/* 
/* 		end of /Text styles + BG Styles
/* 
/* ///////////////////////// */

/* ///////////////////////// */
/* 
/* 		Page Structure Styles
/* 
/* ///////////////////////// */

.fullheight {
	position:relative;
	width:100%;
	height:auto;
	min-height:100vh;
	padding:0;
}

.wrapper-max-width, content {
	position:relative;
	width:100%;
	max-width: 1000px;
	margin:0 auto;
}

.tight-wrapper {
	position:relative;
	width:100%;
	max-width:900px;
	margin-left:auto;
	margin-right:auto;
}

.tightest-wrapper {
	position:relative;
	width:100%;
	max-width:750px;
	margin-left:auto;
	margin-right:auto;
}

content {position:relative;display:block;padding:0;overflow:hidden;}
section {position:relative;display:block;padding:0;}
content.has-parallax {overflow:visible;}

ol {
	list-style-type: none;
}

ul.bullet-list {
	list-style:disc;
	margin-left:45px;
}

ul.paragraph-list {
	width:auto;
	padding:5px 0 5px 0;
	font-size:115%;
	color:#555555;
}

ul.paragraph-list li {
	line-height:1.45;
}

ul.long-text-list {
	width:auto;
	padding:5px 0 5px 0;
	font-size:125%;
	line-height:1.45;
	color:#555555;
}


ul.standard-list {
	width:auto;
	padding:5px 0 5px 0;
}

ul.standard-list.no-padding {
	padding:0;
}

ul.standard-list li {
	line-height:1.5;
	padding:9px 25px 9px 25px;
}

ul.standard-list li.no-verticalpadding {padding-top:0;padding-bottom:0;}

ul.standard-list li i {margin-left:-4px;}

ul.standard-list.gray-line-break li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

ul.standard-list.gray-line-break li:last-child {
	border-bottom:none;
}



ul.standard-list.gray-line li {
	border-bottom: 1px solid #dddddd;
}

ul.standard-list.gray-line li:last-child {
	border-bottom:none;
}

ul.no-side-padding-li li {
	padding-left:0;
	padding-right:0;
}

ul.smaller-padding-li li {
	padding-top:2px;
	padding-bottom:2px;
}


ul.wide-list {
	min-width:300px;
	right:auto;
	max-height:300px;
	overflow-y:scroll;
}

ul.inline-list {
	width:auto;
	padding:0 var(--base-padding);
	line-height:var(--base-lineheight);
}

ul.inline-list li {
	display:inline-block;
}

.cardbox {box-shadow: 0px 1px 3px rgba(0,0,0,0.15);}
.cardbox.nohover:hover {box-shadow: 0px 1px 3px rgba(0,0,0,0.15);}
.cardbox:hover {box-shadow: 0px 4px 15px rgba(0,0,0,0.15);}

/* ///////////////////////// */
/* 
/* 		end of /Page Structure Styles
/* 
/* ///////////////////////// */












/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */
/*                                                */
/*                CONTENT STUFF                   */
/*                                                */
/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

#small-screen-warning,
#session-expired-warning {
	position:fixed;
	z-index:9999;
	width:100%;
	height:100%;
	left:0;right:0;margin:0 auto;
	max-width:600px;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	display:none;
}

#small-screen-warning:before,
#session-expired-warning:before {
	content:"";
	position:fixed;
	z-index:-1;
	width:100%;
	height:100%;
	top:0;right:0;bottom:0;left:0;
	background:black;
	text-align:center;
}

#small-screen-warning p,
#session-expired-warning p {
	color:white;
}

#small-screen-icon {
	position:relative;
	width:116px;
	height:90px;
	display:block;
	margin:0 auto calc(var(--basepadding)*2) auto;
	animation:expandloop 4s var(--normal-easing) infinite;
}

@keyframes expandloop {
	0% {
	  	width:116px;
	}
	40% {
	  	width:180px;
	}
	60% {
		width:180px;
	}
	100% {
	  	width:116px;
	}
}

#small-screen-icon:before {
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	top:0;right:0;bottom:0;left:0;
	border:2px solid var(--gray4);
	border-radius:8px;
}

#small-screen-icon:after {
	content:"";
	position:absolute;
	width:100%;
	height:16%;
	top:0;right:0;left:0;
	border-bottom:2px solid var(--gray4);
}

#small-screen-warning svg {
	stroke:var(--gray4);
}

#small-screen-icon .dot {
	width:6px;
	height:6px;
	border-radius:var(--rounded);
	background:transparent;
	border:2px solid var(--gray4);
	position:absolute;
	left:10px;
	top:6%;
}

#small-screen-icon .dot:nth-of-type(2) {transform:translateX(200%);}
#small-screen-icon .dot:nth-of-type(3) {transform:translateX(400%);}
#small-screen-icon .bar {
	width:calc(85% - 40px);
	height:6px;
	border-radius:var(--rounded);
	background:transparent;
	border:2px solid var(--gray4);
	position:absolute;
	right:10px;
	top:6%;
}

#small-screen-icon .expanding-arrow-wrapper {
	width:35%;
	height:50%;
	position:absolute;
	top:50%;
	transform:translateY(-35%);
	transform-origin:center;
}

#small-screen-icon .expanding-arrow-wrapper:nth-of-type(5) {left:12px;}
#small-screen-icon .expanding-arrow-wrapper:nth-of-type(6) {right:10px;}

#small-screen-icon .expanding-arrow-wrapper span {
	width:40%;
	height:2px;
	background:var(--gray4);
		position:absolute;
		top:50%;
}

#small-screen-icon .expanding-arrow-wrapper:nth-of-type(5) span {left:6%;transform-origin:bottom left;}
#small-screen-icon .expanding-arrow-wrapper:nth-of-type(6) span {right:6%;transform-origin:bottom right;}

#small-screen-icon .expanding-arrow-wrapper span:nth-of-type(1) {
	width:20px;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}

#small-screen-icon .expanding-arrow-wrapper span:nth-of-type(2) {
	width:20px;
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}

#small-screen-icon .expanding-arrow-wrapper span:nth-of-type(3) {
	width:70%;
	transform:translate(0%,-25%);
	-webkit-transform:translate(0%,-25%);
	-moz-transform:translate(0%,-25%);
	-ms-transform:translate(0%,-25%);
	-o-transform:translate(0%,-25%);
	animation:expandarrowloop 4s var(--normal-easing) infinite;
}

@keyframes expandarrowloop {
	0% {
	  	width:80%;
	}
	40% {
	  	width:100%;
	}
	60% {
		width:100%;
	}
	100% {
	  	width:80%;
	}
}


.wrapper {
	position:relative;
	height:100vh;
}

.wrapper {
	display:grid;
	grid-template-columns: 1fr;
	grid-auto-columns: auto;
	grid-row: 1;
	grid-gap: 0;
	grid-template-areas: "sidebar wrapper";
}

.main-sidebar {grid-area: sidebar;}
.content-wrapper {
	grid-area: wrapper;
	justify-self:center;
	max-width:var(--contentmaxwidth);
}


.card-style {
	background:white;
	padding:calc(var(--basespacing)*3.5) calc(var(--basespacing)*2);
	border-radius:var(--roundcorner);
	box-shadow: 0px 5px 20px rgba(0,0,0,0.1);
}

.card-style-hoverable {
	cursor:pointer;
	box-shadow: 0px 5px 20px rgba(0,0,0,0.1);
	transition:all 0.75s var(--smooth-easing);
	-webkit-transition:all 0.75s var(--smooth-easing);
	-moz-transition:all 0.75s var(--smooth-easing);
	-ms-transition:all 0.75s var(--smooth-easing);
	-o-transition:all 0.75s var(--smooth-easing);
}

.card-style-hoverable:hover {
	transform:scale(1.03);
	-webkit-transform:scale(1.03);
	-moz-transform:scale(1.03);
	-ms-transform:scale(1.03);
	-o-transform:scale(1.03);
	box-shadow: 0px 20px 40px rgba(0,0,0,0.02);
}

.login-bg {
	position:fixed;
	width:100%;
	height:100%;
	background:rgba(0,0,0,1);
}

.login-bg img {
	opacity:0.6;
	position:absolute;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}

.login-logo {
	fill:var(--primarydarkcolor);
	width:43.3%; /* 130px */
	height:auto;
	margin-bottom:calc(var(--basespacing)*2);
	padding-top:calc(var(--basespacing)*3.5);
}

.login-box-msg {
	margin-bottom:25px;
}

.login-box-wrapper {
	position:relative;
	width:100%;
	max-width:360px;
	/* max-width:399px; /* to fit recaptcha stuff */
	height:auto;
	min-height:100vh;
	padding:calc(var(--basespacing)*6) calc(var(--basespacing)*3);	
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0;
	margin-left:calc(var(--basespacing)*7);
}

.login-box {
	position:relative;
	display:block;
	margin:0 auto;
	padding:0;
	overflow:hidden; /* For the action bar on top */
	-webkit-transform: translate3d(0, 0, 0); /* to allow overflow hidden on safari */

	/* padding-bottom:calc(var(--basespacing)*2); */
}

.login-box-body,
.code-box-body {
	transition:all 0.35s var(--normal-easing);
	padding:calc(var(--basespacing)*3.5) calc(var(--basespacing)*2);
	padding-top:0;
}

.code-box-body {
	position:absolute;
	right:0;bottom:0;left:0;
}

.login-box[view="login"] .code-box-body {opacity:0;transform:translateX(100%)}
.login-box[view="login"] .login-box-body {opacity:1;transform:translateX(0)}

.login-box[view="code"] .code-box-body {opacity:1;transform:translateX(0)}
.login-box[view="code"] .login-box-body {opacity:0;transform:translateX(-100%)}

/* .login-box-body {display:none}
.code-box-body {display:block} */
/* .code-box-body {display:none} */


button[type="submit"].validating .default-action {
	opacity:0;
}

button[type="submit"].validating .loading-action {
	opacity:1;
}

button[type="submit"].validating .loading-action .loading-icon {
	animation:rotateloop 0.4s linear infinite;
}

.content-initialloading, .content-loading, .content-initialcomplete, .content-complete {
	display:none;
	color:var(--gray3);
	font-size:var(--buttonFONTsize);
}

.content-initialloading {display:block;}

.content-initialloading:after, .content-loading:after {
	content:"";
	margin-left:calc(var(--basespacing)*0.2);
	animation:threedotloading 3s linear infinite;
}

.content-loading, .content-complete {
	margin-top:var(--basepadding);
}

@keyframes threedotloading {
  0% { content:""; }
  25% { content:"."; }
  50% { content:".."; }
  75% { content:"..."; }
}

.login-bottom-spacing {
	margin-top:40px;
}

.twoFactorCode-bottom-spacing {
	margin-top:20px;
}

#login-messages, #code-messages {
	position:relative;
}

#twoFactorCode {
	text-align:center;
	font-size:63px;
	padding-top:5px;
	padding-bottom:5px;
}

#code-info {
	margin-bottom:3px;
	text-align:center;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:0;
}

#code-info span {line-height:1}

#empty-fields, #code-empty-fields, #code-expired-error {
	position:absolute;
	top:0;
	opacity:0;
	margin-top:var(--basespacing);
	color:red;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

#empty-fields {
	padding-left:var(--basepadding);
	left:0;
}

#code-expired-error, #code-empty-fields {
	text-align:center;
	left:50%;
	transform:translate(-50%,-4px);
	margin-top:0;
}

#empty-fields.visible, #code-empty-fields.visible, #code-expired-error.visible {
	opacity:1;
}

#nomatch-error, #code-nomatch-error {
	opacity:0;
	margin-top:var(--basespacing);
	display:grid;
	grid-template-columns: repeat(2,max-content);
	grid-template-rows: repeat(2,max-content);
	align-items:center;
	color:red;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

#nomatch-error {
	padding-left:var(--basepadding);
	justify-content:start;
}

#code-nomatch-error {
	justify-content:center;
}

#nomatch-error.visible, #code-nomatch-error.visible, #code-expired-error.visible {
	opacity:1;
}

#nomatch-error:before, #code-nomatch-error:before, #code-expired-error:before {
	content:"\e888";
	display:inline-block;
	margin-right:5px;
	position:relative;
	z-index:1;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

#attempts-warning {
	opacity:0;
	line-height:1;
	grid-column-start: 2;
  	color:var(--gray3);
}

#attempts-warning.visible {
	opacity:1;
}

#blocked-account {
	margin-top:var(--basespacing);
	display:grid;
	grid-template-columns: repeat(2,max-content);
	grid-template-rows: repeat(2,max-content);
	justify-content:start;
	align-items:center;
	padding-left:var(--basepadding);
	color:red;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
	display:none;
	opacity:0;
}

#blocked-account:before {
	content:"error";
	display:inline-block;
	margin-right:5px;
	position:relative;
	z-index:1;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

#blocked-account a {
	line-height:1;
	grid-column-start: 2;
  	color:var(--gray3);
  	font-size:var(--XSbuttonFONTsize);
}

#blocked-account.visible {
	opacity:1;
}

.login-box.validating:before {
	content:"";
	position:absolute;
	width:100%;
	height:6px;
	top:0;
	left:0;
	background:var(--primaryaccentcolor);
	transform:scale(0,1) translateX(-5px);
	transform-origin:left center;
	animation:cardloadingloop 1s var(--normal-easing) infinite;
	-webkit-animation:cardloadingloop 1s var(--normal-easing) infinite;
}

@keyframes cardloadingloop {
	0% {transform:scale(0,1) translateX(-5px); transform-origin:left center; opacity:0}
	5% {transform:scale(0,1) translateX(-5px); transform-origin:left center; opacity:1}
	45% {transform:scale(1,1) translateX(0); transform-origin:left center; opacity:1}
	55% {transform:scale(1,1) translateX(0); transform-origin:right center; opacity:1}
	90% {transform:scale(0,1) translateX(5px); transform-origin:right center; opacity:1}
	100% {transform:scale(0,1) translateX(5px); transform-origin:right center; opacity:0}
}

@-webkit-keyframes cardloadingloop {
	0% {transform:scale(0,1) translateX(-5px); transform-origin:left center; opacity:0}
	5% {transform:scale(0,1) translateX(-5px); transform-origin:left center; opacity:1}
	45% {transform:scale(1,1) translateX(0); transform-origin:left center; opacity:1}
	55% {transform:scale(1,1) translateX(0); transform-origin:right center; opacity:1}
	90% {transform:scale(0,1) translateX(5px); transform-origin:right center; opacity:1}
	100% {transform:scale(0,1) translateX(5px); transform-origin:right center; opacity:0}
}

.captcha-policy-text {
	color:var(--gray3);
	margin-top:15px;
}

#g-recaptchaChallenge {
	transform:scale(0.85);
	-webkit-transform:scale(0.85);
	-moz-transform:scale(0.85);
	-ms-transform:scale(0.85);
	-o-transform:scale(0.85);
	transform-origin:0 0;
	-webkit-transform-origin:0 0;
}







aside.side-menu {
	position:fixed;
	width:var(--sidebar-width);
	height:100%;
	top:0;
	bottom:0;
	left:0;
	background:var(--primarydarkcolor);
  	z-index:999;
  	overflow-y:auto;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	gap:var(--base-padding);
}

aside.side-menu::-webkit-scrollbar { display: none; } aside.side-menu { -webkit-overflow-scrolling: touch; overflow: -moz-scrollbars-none; }

.main-logo {
	fill:var(--primaryaccentcolor);
	width:50%;
	height:auto;
	margin-bottom:calc(var(--basespacing)*3);
}

.mobile-logo {
	display:none;
	fill:var(--primaryaccentcolor);
	width:80%;
	height:auto;
	margin-bottom:calc(var(--basespacing)*1.5);
}

nav#main-nav {
	display:block;
	position:relative;
	width:auto;
	height:auto;
	margin:calc(var(--basespacing)*4) auto;
}

nav#main-nav ul {
	position:relative;
	display:block;
	width:auto;
	height:auto;
	text-align:left;
	list-style:none;
	margin:0 auto;
	padding:0;
	color:white;
}

nav#main-nav ul#manage-submenu {
	display:none;
	/* re-enable if formats page exists or disable if it does exist */
}

nav#main-nav ul.sidebar-submenu.visible {
	display:block;
}

nav#main-nav ul li {
	position:relative;
}

nav#main-nav #management-submenu {
	padding-top:calc(var(--basespacing)*2.4);
	margin-top:calc(var(--basespacing)*2);
	border-top:1px solid grey;
}

nav#secondary-nav {
	margin-top:auto;
	padding-bottom:var(--basespacing);
}

nav#secondary-nav button {
	font-size:var(--MSbuttonFONTsize);
	color:var(--gray4);
	display:flex;
	align-items:center;
	gap:var(--basepadding);
}

nav#secondary-nav button:hover span {
	color:white;
	text-shadow:0px 0px 2px rgba(255,255,255,0.25),
		    0px 1px 1px rgba(255,255,255,0.25),
		    0px 4px 3px rgba(255,255,255,0.25),
		    0px 7px 6px rgba(255,255,255,0.25)!important;
}

.menu-item {
	position:relative;
	display:grid;
	grid-template-columns: max-content 1fr;
	grid-column-gap: var(--basepadding);
	align-items:center;

	width:100%;
	height:auto;
	min-height:var(--baselineheight);
	padding:0 var(--basepadding);
	
}

.menu-item.descriptive i {align-self:start;}

.menu-item-description {
	display:block;
	margin-top:calc(var(--basespacing)*0.2);
	color:var(--primaryaccentcolor);
	opacity:0.75;
}

button.menu-item {
	display:inline-block;
	text-align:left;
}

button.menu-item i {
	margin-right:calc(var(--basepadding)*0.5);
}

.menu-item:after {
	content:"";
	position:absolute;
	top:50%;
	right:0;
	transform:translate(50%,-50%) rotate(45deg);
	-webkit-transform:translate(50%,-50%) rotate(45deg);
	-moz-transform:translate(50%,-50%) rotate(45deg);
	-ms-transform:translate(50%,-50%) rotate(45deg);
	-o-transform:translate(50%,-50%) rotate(45deg);

	opacity:0;
	width:12px;
	height:12px;
	background:var(--bodycolor);
}

.menu-item.active:after {
	opacity:1;
}

.menu-item .menu-text {
	font-size:var(--MSbuttonFONTsize);
}

.menu-item:hover .menu-text {
	text-shadow:0px 0px 2px rgba(255,255,255,0.25),
		    0px 1px 1px rgba(255,255,255,0.25),
		    0px 4px 3px rgba(255,255,255,0.25),
		    0px 7px 6px rgba(255,255,255,0.25)!important;
}

nav#main-nav li.inactive {
	opacity:1;
	color:var(--gray2);
}

nav#main-nav li.inactive .menu-item:before {
	content: attr(data-smalltext);
	font-size:9px;
	text-transform:uppercase;
	color:var(--primaryaccentcolor);
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
	right:calc(var(--basepadding)*1.5);
}

nav#main-nav li.inactive .menu-item:hover .menu-text {
	cursor:default;
	text-shadow:none!important;
}

nav#main-nav ul.sidebar-submenu {
	margin:var(--basespacing);
	margin-right:0;
	margin-left:calc(var(--basepadding)*0.9);
	padding:calc(var(--basepadding)*0.25) 0;
}

nav#main-nav ul.sidebar-submenu .menu-item {
	grid-column-gap: calc(var(--basepadding)*0.75);
	padding:0 calc(var(--basespacing)*1.5);
	line-height:1;
	min-height:calc(var(--baselineheight)*0.9);
	border-top-right-radius:0;
	border-bottom-right-radius:0;
	border-top-left-radius:var(--rounded);
	border-bottom-left-radius:var(--rounded);
	margin-bottom:2px;
	background:rgba(0,0,0,0.25);
}

nav#main-nav .btn-user {
	background:var(--secondarycolor);
	margin-bottom:calc(var(--basespacing)*4);
}

nav#main-nav .btn-user {
	background:var(--secondarycolor);
	margin-bottom:calc(var(--basespacing)*4);
}

nav#main-nav .btn-user .menu-item {
	line-height:var(--lineheightL);
}

nav#main-nav .btn-user .menu-item:hover {
	cursor:default;
}

nav#main-nav .btn-user .menu-item:hover .menu-text {
	text-shadow:none!important;
}

nav#main-nav .btn-user .menu-item .menu-text {
	text-decoration:underline;
}

nav#main-nav .btn-user .menu-text {
	line-height:1;
	padding-top:var(--basepadding);
	padding-bottom:var(--basepadding);
}

#btn-logout {
	height:var(--lineheightL);
	line-height:var(--lineheightL);
	position:absolute;
	top:0;bottom:0;right:0;
}



/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */
/*                                                */
/*                INNER PAGES                     */
/*                                                */
/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */

/* ////////////////////////////////////////////// */



/* All Pages */

.content-header nav.breadcrumb-wrapper {
	margin-bottom:var(--basespacing);
}

ul.breadcrumb {
	display:flex;
	align-items:center;
	font-size:var(--buttonFONTsize);
	line-height:1;
}

ul.breadcrumb li {
	color:var(--gray4);
	line-height:var(--lineheightS);
	transition:all 0.05s var(--normal-easing);
	-webkit-transition:all 0.05s var(--normal-easing);
	-moz-transition:all 0.05s var(--normal-easing);
	-ms-transition:all 0.05s var(--normal-easing);
	-o-transition:all 0.05s var(--normal-easing);
}

ul.breadcrumb li:hover {
	color:var(--primarydarkcolor);
}

ul.breadcrumb li:hover:after {
	color:var(--gray4);
}

ul.breadcrumb li a {
	vertical-align:middle;
}

ul.breadcrumb li:after {
	font-family: 'Material Icons';
	content:"chevron_right";
	vertical-align:middle;
	line-height:var(--lineheightS);
	padding:0 calc(var(--basepadding)*0.5);
	transition:all 0.05s var(--normal-easing);
	-webkit-transition:all 0.05s var(--normal-easing);
	-moz-transition:all 0.05s var(--normal-easing);
	-ms-transition:all 0.05s var(--normal-easing);
	-o-transition:all 0.05s var(--normal-easing);
}

ul.breadcrumb li:last-child {
	color:var(--primarydarkcolor);
}

ul.breadcrumb li:last-child:after {
	display:none;
}

.content-wrapper {
	width:calc(100% - var(--sidebar-width));
	margin-left:var(--sidebar-width);
	height:100vh;
}

.content-wrapper[data-page="dashboard"] {
	height:auto;
	min-height:100vh;
}

.content-wrapper.standard-page {
	height:auto;
}

.content-wrapper {
	display:grid;
	grid-column: 1;
	grid-template-rows: max-content 1fr;
	grid-template-areas:
	"contentheader"
	"content";
	grid-row-gap: calc(var(--pagepadding)*0.5);
	padding:calc(var(--pagepadding)*0.75) var(--pagepadding);
}

.content-header {
	grid-area: contentheader;
}

.content {
	grid-area: content;
}

.save-mainbtn.unsaved {
	/*box-shadow:0px 0px 10px red;*/
}

.save-mainbtn.unsaved:after {
	font-size:15px;
	font-family: 'Material Icons';
	content:"error";
	position:absolute;
	right:-4px;
	top:0;
	color:red;
	transform:translate(25%,-50%);
	-webkit-transform:translate(25%,-50%);
	-moz-transform:translate(25%,-50%);
	-ms-transform:translate(25%,-50%);
	-o-transform:translate(25%,-50%);
}

#modal-unsavedchanges .standard-modal-header {
	padding-bottom:0;
	padding-top:calc(var(--basespacing)*7);
}

#modal-unsavedchanges .standard-modal-header .standard-modal-title {
	display:grid;
	grid-template-columns:max-content max-content max-content;
	grid-gap:calc(var(--basespacing)*2);
	align-items:center;
	justify-content:center;
}

#modal-unsavedchanges .standard-modal-header .standard-modal-title i {
	margin:0;
	padding:0;
	color:red;
}

#modal-unsavedchanges .standard-modal-content {
	text-align:center;
	margin:0;
	padding:0 0 calc(var(--basespacing)*2.5) 0;
}

#modal-unsavedchanges .standard-modal-footer {
	display:grid;
	grid-template-columns:1fr max-content max-content;
	justify-content:end;
	align-items:center;
	border-top:none;
}

#modal-unsavedchanges .standard-modal-footer .cancel-wrapper {
	width:100%;
	display:grid;
	grid-template-columns:max-content 1fr;
	grid-gap:calc(var(--basespacing)*2);
	padding-right:var(--basespacing);
}

#modal-unsavedchanges .standard-modal-footer .cancel {
	padding:0;
}

.custom-icon {
	fill:transparent;
	stroke:var(--secondarycolor);
	stroke-width:4;
	stroke-linecap:round;
	stroke-miterlimit:10;
}

/* // All Pages */


/* Format Page */

.format-container {
	display:grid;
	grid-template-columns: repeat(auto-fill, minmax(289px, 1fr)); /* As many 335px wide columns as possible */
	grid-template-rows: auto;
	grid-column-gap: calc(var(--basepadding)*2);
	grid-row-gap: calc(var(--basepadding)*2);
}

.item-format {
	padding:0;
}

.format-icon-container {
	position:relative;
	display:block;
	width:100%;
	height:0;
	padding-bottom:100%;
	overflow:hidden;
	background:var(--bodycolor);
}

.format-icon-container:after {
	content:"";
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
	left:0;right:0;
	top:100%;
	background:white;
	transition:all 0.75s var(--smooth-easing);
	-webkit-transition:all 0.75s var(--smooth-easing);
	-moz-transition:all 0.75s var(--smooth-easing);
	-ms-transition:all 0.75s var(--smooth-easing);
	-o-transition:all 0.75s var(--smooth-easing);
}

.format-icon {
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	display:block;
	border-radius:3px;
	width:68%;
	height:0;
	/*padding-bottom:35%;*/
	padding-bottom:calc(var(--format-height) / var(--format-width) * 68%);
	border:1px solid var(--gray3);
}

.format-icon:before {
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	display:block;
	width:calc(100% - 7px);
	height:calc(100% - 7px);
	border:1px solid var(--gray3);
}

.format-icon-container.vertical .format-icon {
	transform:translate(-50%,-50%) rotate(90deg);
	-webkit-transform:translate(-50%,-50%) rotate(90deg);
	-moz-transform:translate(-50%,-50%) rotate(90deg);
	-ms-transform:translate(-50%,-50%) rotate(90deg);
	-o-transform:translate(-50%,-50%) rotate(90deg);
}

.format-associated-terminals {
	width:auto;
	display:inline-block;
	color:var(--primarydarkcolor);
	transform:translateY(-3px);
	/*padding:0 var(--basepadding);
	border-radius:200px;
	/*border:1px solid var(--gray3);*/
}


.format-associated-terminals-icon {
	width:auto;
	display:flex;
	align-items:center;
	color:var(--primarydarkcolor);
	border-top-right-radius:200px;
	border-top-left-radius:200px;
	position:absolute;
	right:8%;
	bottom:0;
	background:white;
	padding:calc(var(--basespacing)*2) var(--basepadding);
}

.format-associated-terminals-icon h6 {
	line-height:1;
}

.ui-spinner a {
	display:block;
	width:20px;
	height:20px;
	margin-bottom:20px;
	background:red;
}

/*
.format-associated-terminals-icon {
	width:auto;
	display:inline-block;
	color:var(--gray3);
	border-radius:200px;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	border:1px solid var(--gray3);
	padding:var(--basepadding);
	padding-bottom:calc(var(--basespacing)*2);
}*/

.format-clicktoselecthelper {
	width:auto;
	display:inline-block;
	color:var(--gray3);
	border-radius:200px;
	position:absolute;
	z-index:3;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	border:1px dashed var(--gray3);
	padding:0 var(--basepadding);
	opacity:0;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.format-description {
	position:relative;
	padding:calc(var(--basepadding)*1.75) calc(var(--basepadding)*1.9) calc(var(--basepadding)*2) calc(var(--basepadding)*1.9);
}

.format-description:before {
	content:"";
	position:absolute;
	top:0;
	width:calc(100% - calc(var(--basepadding)*4));
	height:1px;
	background:var(--gray4);
	transform:scaleX(0);
	-webkit-transform:scaleX(0);
	-moz-transform:scaleX(0);
	-ms-transform:scaleX(0);
	-o-transform:scaleX(0);
	transition:all 0.75s var(--smooth-easing);
	-webkit-transition:all 0.75s var(--smooth-easing);
	-moz-transition:all 0.75s var(--smooth-easing);
	-ms-transition:all 0.75s var(--smooth-easing);
	-o-transition:all 0.75s var(--smooth-easing);
}

.format-description .filename {

} 

.format-description ul {
	
	color:var(--secondarycolor);
}


.item-format:hover .format-icon-container:after {
	top:0;
}

.item-format:hover .format-description:before {
	transform:scaleX(1);
	-webkit-transform:scaleX(1);
	-moz-transform:scaleX(1);
	-ms-transform:scaleX(1);
	-o-transform:scaleX(1);
}

.item-format:hover .format-clicktoselecthelper {
	opacity:1;
}


/* //Format Page */

/* Card General Content */

.box-primary {
	width:100%;
	background:white;
	border-radius:var(--roundcorner);
	box-shadow: 0px 5px 20px rgba(0,0,0,0.1);
	display:grid;
	grid-template-rows:max-content 1fr;
	max-height: 100%;
	overflow:hidden;
	/* don't set overflow hidden to allow dropdowns to go out */
}

.box-primary.disabled {
	background:var(--bodycolor);
}

.box-header {
	padding:calc(var(--basepadding)*2);
	padding-bottom:calc(var(--basespacing)*2);
	padding-top:calc(var(--basespacing)*3);
}

.box-primary.disabled .box-header {
	color:var(--gray2);
	opacity:0.5;
}

.box-primary.disabled .box-body {
	opacity:0.5;
}

.box.collapsed:after, .box.collapsed:before {
	opacity:0;
	transition:all 0.25s var(--normal-easing);
	-webkit-transition:all 0.25s var(--normal-easing);
	-moz-transition:all 0.25s var(--normal-easing);
	-ms-transition:all 0.25s var(--normal-easing);
	-o-transition:all 0.25s var(--normal-easing);
}

.box-body {
	padding:0 calc(var(--basepadding)*2) calc(var(--basepadding)*2) calc(var(--basepadding)*2);
}

.box-body {
	position:relative;
	max-height:100%;
	overflow-x:hidden;
	overflow-y:auto;
}

.box-primary, .box-body, .box-header, #seePlaylist {
	opacity:1;
	transition:all 0.3s var(--normal-easing);
	-webkit-transition:all 0.3s var(--normal-easing);
	-moz-transition:all 0.3s var(--normal-easing);
	-ms-transition:all 0.3s var(--normal-easing);
	-o-transition:all 0.3s var(--normal-easing);
}

.box-body.hidden, .box-header.hidden, #seePlaylist.hidden {
	opacity:0!important;
}

.box-body .empty center hr {margin-top:calc(var(--basespacing)*0.6);margin-bottom:calc(var(--basespacing)*0.6);}

.box-body .empty,
.schedule-to-terminal-action .empty {
	width:100%;
	padding:0 calc(var(--basepadding)*2);
	position:absolute;
	z-index:1;
	top:50%;
	left:50%;
	transform:translate(-50%,-70%);
	-webkit-transform:translate(-50%,-70%);
	-moz-transform:translate(-50%,-70%);
	-ms-transform:translate(-50%,-70%);
	-o-transform:translate(-50%,-70%);
	color:var(--gray3);
}

.schedule-to-terminal-action .empty {
	position:relative;
	padding-bottom:calc(var(--basepadding)*2);
}

.box-body .empty .empty-thumbnail,
.schedule-to-terminal-action .empty .empty-thumbnail {
	width:90%;
	max-width:100px;
	/*fill:var(--gray5);*/
	margin-bottom:var(--basespacing);

	fill:transparent;
	stroke:var(--gray5);
	stroke-width:8;
	stroke-linecap:round;
	stroke-miterlimit:10;
}

.schedule-to-terminal-action .empty .empty-thumbnail {
	opacity:0.2;
}

.schedule-to-terminal-action .special-dropdown-footer {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:var(--basespacing);
}

.schedule-to-terminal-action .special-dropdown-footer fieldset {
	display:flex;
	align-items:center;
	gap:0;
}

.schedule-to-terminal-action .special-dropdown-footer fieldset label[for="forceUpdate"] {padding-right:6px}
.schedule-to-terminal-action .special-dropdown-footer fieldset [data-toggle="tooltip"] {display:flex}
.schedule-to-terminal-action .special-dropdown-footer fieldset i,
.schedule-to-terminal-action .special-dropdown-footer fieldset i:last-child,
.schedule-to-terminal-action .special-dropdown-footer fieldset i:first-child {
	margin:0;
}

.box-body .empty[data-type="no-selection"] {
	color:var(--gray2);
}

.box-body .empty[data-type="no-selection"] .empty-thumbnail {
	stroke:var(--gray4);
}

.dashed {stroke-dasharray:11,25;}
.thin {stroke-width:4;}

#PlaylistContentCard .box-body .empty .empty-thumbnail {max-width:140px;}
#FilesCard .box-body .empty[data-type="no-content"] .empty-thumbnail {max-width:175px;}
#FilesCard .box-body .empty[data-type="empty-folder"] .empty-thumbnail {max-width:100px;margin-bottom:calc(var(--basespacing)*2);transform:translateX(10%);}
#FilesCard .box-body .empty[data-type="no-match"] .empty-thumbnail {max-width:70px;margin-bottom:calc(var(--basespacing)*2);}
#TerminalCard .box-body .empty[data-type="no-match"] .empty-thumbnail, .schedule-to-terminal-action .empty[data-type="no-match"] .empty-thumbnail {max-width:70px;margin-bottom:calc(var(--basespacing)*2);}
#TerminalCard .box-body .empty[data-type="no-content"] .empty-thumbnail, .schedule-to-terminal-action .empty[data-type="no-content"] .empty-thumbnail {max-width:250px;margin-bottom:calc(var(--basespacing)*2);}
#TerminalContentCard .box-body .empty[data-type="no-selection"] .empty-thumbnail {max-width:250px;margin-bottom:calc(var(--basespacing)*2);}

.illustration {
	fill:transparent;
	stroke:var(--gray7);
	stroke-width:4;
	stroke-linecap:round;
	stroke-miterlimit:10;
}

.box-body .ui-droppable {height:100%;}
#PlaylistContentCard .box-body {padding:0}
#PlaylistContentCard .box-body #playlistContentDiv {padding:0 calc(var(--basepadding)*2) calc(var(--basepadding)*2) calc(var(--basepadding)*2);}

.box-body .ui-droppable#playlistContentDiv {min-height:100%;height:auto;}
.box-body .ui-droppable#seeSchedule {min-height:calc(100vh - 345px);height:auto}
.ui-draggable {z-index:99;}

#card-breadcrumbs {
	display:grid;
	grid-template-columns:max-content 1fr max-content;
	grid-gap: var(--basepadding);
}

#card-breadcrumbs.root {
	grid-template-columns:1fr max-content;
}

#card-breadcrumbs button.prev-folder {
	display:grid;
	padding:0 calc(var(--basespacing)*0.5)
}

#card-breadcrumbs.root button.prev-folder {
	display:none;
}

#card-breadcrumbs button.prev-folder i {
	margin:0;
}

#card-breadcrumbs ul.breadcrumb {
	background:var(--gray6);
	border-radius:var(--rounded);
	padding-left:var(--basepadding);
	padding-right:var(--basepadding);
	overflow:hidden;
	white-space:nowrap;
}

#card-breadcrumbs ul.breadcrumb li {
	cursor:pointer;
	color:var(--gray45);
	font-size:var(--XSbuttonFONTsize);
	overflow:hidden;
	text-overflow:ellipsis;
}

#card-breadcrumbs ul.breadcrumb li:last-child {
	color:var(--gray2);
}

#card-breadcrumbs ul.breadcrumb.allfiles li {
	color:var(--gray2);
}

#card-breadcrumbs ul.breadcrumb.allfiles li:last-child, #card-breadcrumbs ul.breadcrumb.allfiles li:after {
	color:var(--gray45);
}

#card-breadcrumbs ul.breadcrumb li:first-child:before {
	font-family: 'Material Icons';
	vertical-align:middle;
	content:"home";
	margin-right:calc(var(--basespacing)*0.5);
	line-height:1;
}

#card-breadcrumbs ul.breadcrumb li:after {
	font-family: 'Abel';
	content:"/";
}

#card-breadcrumbs ul.breadcrumb li:hover {
	color:var(--secondarycolor);
}

#card-breadcrumbs ul.breadcrumb li:hover:after {
	color:var(--gray45);
}


#channelForm {position:absolute;z-index:99;} /* Get the element out of the grid flow */

.steps {
	width: 100%;
	height: 100%;
	position: absolute;
	display:grid;
	grid-gap: calc(var(--basepadding)*2);
	transition:all 0.5s var(--smooth-easing);
	-webkit-transition:all 0.5s var(--smooth-easing);
	-moz-transition:all 0.5s var(--smooth-easing);
	-ms-transition:all 0.5s var(--smooth-easing);
	-o-transition:all 0.5s var(--smooth-easing);
}

.step-1 {grid-template-columns: 250px 3fr 4fr;}
.step-2 {grid-template-columns: 250px 1fr 300px;display:none;}
.step-3 {grid-template-columns: 600px 1fr;}

.steps.hide {opacity:0;}
.steps.show {opacity:1;transform:translateX(0)}

.step-1.hide {transform:translateX(-100%)}
.step-2.hide {transform:translateX(100%)}


.card-actions {
	grid-gap: var(--basespacing);
}

.filters {
	display:flex;
	justify-content:flex-end;
}

#FilesCard .filters {
	flex-wrap:wrap;
}

.filters .dropdown, .filters button {
	margin-right: calc(var(--basespacing)*1);
}

.filters .dropdown:last-child,
.filters button:last-child {
	margin-right:0;
}


.sort-order {
	padding:0;
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.sort-order[data-value='dsc'] {
	transform: scaleY(-1);
	-webkit-transform: scaleY(-1);
	-moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
}

.sort-order[data-value='asc'] {
	transform: scaleY(1);
	-webkit-transform: scaleY(1);
	-moz-transform: scaleY(1);
    -o-transform: scaleY(1);
}

.dropdown {
	position:relative;
	display:grid;
	grid-template-columns:max-content max-content;
	grid-gap:calc(var(--basespacing)*0.5);
	align-items:center;
}

.dropdown.alt-label {
	display:block;
}

.dropdown-toggle {
	position:relative;
	z-index:1;
	overflow:hidden;

	display:grid;
	align-items:center;
	padding:0 calc(calc(var(--basepadding)*1.25) + var(--baselineheight)) 0 calc(var(--basepadding)*1.1);
	margin:0 1px 0 1px;
	border:1px solid rgba(0,0,0,0);
	border-radius:var(--baselineheight);
	vertical-align:middle;
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);

	color:var(--primarydarkcolor);
	border:1px solid var(--gray3);
}

.dropdown-toggle.new:before {
	/* content:"";
	position:absolute;
	z-index:-1;
	display:block;
	right:0; */
	content:"";
	position:absolute;
	z-index:2;
	right:0;
	top:9px;
	width:7px;height:7px;
	border-radius:var(--rounded);
	background:var(--primaryaccentcolor);
	transform:translate(-5px,-50%);
	-webkit-transform:translate(-5px,-50%);
	-moz-transform:translate(-5px,-50%);
	-ms-transform:translate(-5px,-50%);
	-o-transform:translate(-5px,-50%);
}

.dropdown-toggle:after {
	content:"keyboard_arrow_down";
	position:absolute;
	height:100%;width:auto;
	right:0;
	z-index:-1;
	display:block;
	padding-right:var(--basepadding);
	padding-left:calc(var(--basepadding)*0.6);
	border-left:1px solid var(--gray5);
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

.dropdown-toggle:hover {
	color:white;
	background:var(--secondarycolor);
}

.dropdown-maintext {
	margin-top:1px;
	width:100%;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}

.dropdown-toggle.btn-s {
	padding:0 calc(calc(var(--basepadding)*0.1) + var(--baselineheight)) 0 calc(var(--basepadding)*0.8);
}

.dropdown-toggle.btn-s:after {
	font-size:18px;
	line-height:var(--lineheightSM);
	height:var(--lineheightSM);
	padding:0 calc(var(--basespacing)*0.6) 0 calc(var(--basespacing)*0.3);
}

.dropdown-icon {
	display:none;
}

.dropdown-menu {
	cursor:default;
	position:absolute;
	z-index:99;
	top:calc(100% + 5px);
	width:auto;min-width:200px;max-width:none;
	height:auto;max-height:none;
	overflow-y:auto;
	transform:translateY(20px);
	-webkit-transform:translateY(20px);
	-moz-transform:translateY(20px);
	-ms-transform:translateY(20px);
	-o-transform:translateY(20px);
		transition: all .2s var(--normal-easing);
	        -webkit-transition: all .2s var(--normal-easing);
	        -moz-transition: all .2s var(--normal-easing);
	        -ms-transition: all .2s var(--normal-easing);
	        -o-transition: all .2s var(--normal-easing);
	
	background:var(--primarydarkcolor);
	color:white;
	border-radius:var(--roundcorner);
	padding:0;
	box-shadow:var(--elementshadow);

	display:none;
	opacity:0;

	overflow:hidden;
}

.dropdown-content {
	box-sizing:border-box;
	width:100%;
	max-width:220px;
	max-height:246px;
	overflow-y:auto;
	padding:calc(var(--basepadding)*4) calc(var(--basepadding)*1.75) calc(var(--basepadding)*1.75) calc(var(--basepadding)*1.75);
}

.dropdown-content:after {
	content:"";
	position:absolute;
	bottom:0;
	left:0;right:0;
	height:var(--basepadding);
	background: -moz-linear-gradient(top, rgba(53,68,76,0) 0%, rgba(53,68,76,0) 2%, rgba(53,68,76,1) 90%, rgba(53,68,76,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(53,68,76,0) 0%,rgba(53,68,76,0) 2%,rgba(53,68,76,1) 90%,rgba(53,68,76,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(53,68,76,0) 0%,rgba(53,68,76,0) 2%,rgba(53,68,76,1) 90%,rgba(53,68,76,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0035444c', endColorstr='#35444c',GradientType=0 ); /* IE6-9 */
}

.dropdown-content::-webkit-scrollbar { width: 0 !important;height:0!important }
.dropdown-content { overflow: -moz-scrollbars-none; }
.dropdown-content { -ms-overflow-style: none; }

.dropdown-menu[data-aligntoggle="left"] {left:0;right:auto;border-top-left-radius:0;}
.dropdown-menu[data-aligntoggle="right"] {right:0;left:auto;border-top-right-radius:0;}

.close-dropdown {
	cursor:pointer;
	color:var(--gray4);
	position:absolute;
	padding:3px;
	border-radius:var(--rounded);
	top:10px;
	right:10px;
	background:rgba(0,0,0,0.5);
}

.close-dropdown:hover {
	background:var(--primaryaccentcolor);
	color:var(--primarydarkcolor);
}

.dropdown-title {
	font-size:var(--buttonFONTsize);
	color:var(--secondarycolor);
	text-align:left;
	margin-top:var(--basespacing);
	margin-bottom:calc(var(--basespacing)*2.5);
	opacity:0;
	transform:translateY(10px);
	-webkit-transform:translateY(10px);
	-moz-transform:translateY(10px);
	-ms-transform:translateY(10px);
	-o-transform:translateY(10px);
		transition: all .2s var(--normal-easing);
	        -webkit-transition: all .2s var(--normal-easing);
	        -moz-transition: all .2s var(--normal-easing);
	        -ms-transition: all .2s var(--normal-easing);
	        -o-transition: all .2s var(--normal-easing);
}

.dropdown-item {
	cursor:pointer;
	width:auto;min-width:150px;
	text-align:left;
	line-height:var(--lineheightSM);
	height:auto;
	border-bottom:1px solid var(--gray3);
	opacity:0;
	transform:translateY(10px);
	-webkit-transform:translateY(10px);
	-moz-transform:translateY(10px);
	-ms-transform:translateY(10px);
	-o-transform:translateY(10px);
		transition: all .2s var(--normal-easing);
	        -webkit-transition: all .2s var(--normal-easing);
	        -moz-transition: all .2s var(--normal-easing);
	        -ms-transition: all .2s var(--normal-easing);
	        -o-transition: all .2s var(--normal-easing);
}

[data-toggle="dropdown"].ready {overflow:visible;z-index:99;}
[data-toggle="dropdown"].ready .dropdown-menu {display:grid;}

[data-toggle="dropdown"].active .dropdown-menu {
	opacity:1;
	transform:translateY(0);
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
}

[data-toggle="dropdown"].active .dropdown-menu .dropdown-title {
	opacity:1;
	transform:translateY(0);
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
}

[data-toggle="dropdown"].active .dropdown-menu .dropdown-item {
	opacity:1;
	transform:translateY(0);
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
}

[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(1) {transition-delay: 0.05s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(2) {transition-delay: 0.1s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(3) {transition-delay: 0.15s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(4) {transition-delay: 0.2s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(5) {transition-delay: 0.25s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(6) {transition-delay: 0.3s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(7) {transition-delay: 0.35s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(8) {transition-delay: 0.4s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(9) {transition-delay: 0.45s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(10) {transition-delay: 0.5s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(11) {transition-delay: 0.55s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item:nth-child(12) {transition-delay: 0.6s; }
[data-toggle="dropdown"].active .dropdown-menu .dropdown-item::nth-child(n+12) {transition-delay: 0.6s; }



.small-label {
	font-size:var(--SbuttonFONTsize);
	color:var(--gray3);
}

.label-above {
	padding-left:var(--basepadding);
}

.ruled-list {
	padding:0;
	margin:0;
}

.ruled-list li.list-item, .ruled-list li.item-playlist, .ruled-list li.item-schedule {
	line-height:1;
	padding:calc(var(--basespacing)*0.7) 0;
	border-bottom:1px solid var(--gray5);
}

.ruled-list li.list-item:first-of-type, .ruled-list li.item-playlist:first-of-type, .ruled-list li.item-schedule:first-of-type {border-top:1px solid var(--gray5);}

.ruled-list.checklist li.list-item {
	padding-left:var(--basespacing);
}

.ruled-list.checklist li.list-item label {
	width:100%;
	padding:0;
	border:none;
	padding-right:calc(var(--basespacing)*2.5);
	font-size:var(--MSbuttonFONTsize);
	color:var(--primarydarkcolor);
}

.ruled-list.checklist li.list-item label:before {
	left:auto;
	right:8px;
}

.ruled-list.checklist li.list-item label:after {
	left:auto;
	right:6px;
}

li.tag {
	display:inline-block;
	margin-right:2px;
}


/* This is the core CSS of Tooltipster */

/* GENERAL STRUCTURE RULES (do not edit this section) */

.tooltipster-base {
	/* this ensures that a constrained height set by functionPosition,
	if greater that the natural height of the tooltip, will be enforced
	in browsers that support display:flex */
	display: flex;
	pointer-events: none;
	/* this may be overriden in JS for fixed position origins */
	position: absolute;
}

.tooltipster-box {
	/* see .tooltipster-base. flex-shrink 1 is only necessary for IE10-
	and flex-basis auto for IE11- (at least) */
	flex: 1 1 auto;
}

.tooltipster-content {
	/* prevents an overflow if the user adds padding to the div */
	box-sizing: border-box;
	/* these make sure we'll be able to detect any overflow */
	max-height: 100%;
	max-width: 100%;
	overflow: auto;
}

.tooltipster-ruler {
	/* these let us test the size of the tooltip without overflowing the window */
	bottom: 0;
	left: 0;
	overflow: hidden;
	position: fixed;
	right: 0;
	top: 0;
	visibility: hidden;
}

/* ANIMATIONS */

/* Open/close animations */

/* fade */

.tooltipster-fade {
	opacity: 0;
	-webkit-transition-property: opacity;
	-moz-transition-property: opacity;
	-o-transition-property: opacity;
	-ms-transition-property: opacity;
	transition-property: opacity;
}
.tooltipster-fade.tooltipster-show {
	opacity: 1;
}

/* grow */

.tooltipster-grow {
	-webkit-transform: scale(0,0);
	-moz-transform: scale(0,0);
	-o-transform: scale(0,0);
	-ms-transform: scale(0,0);
	transform: scale(0,0);
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;
	-webkit-backface-visibility: hidden;
}
.tooltipster-grow.tooltipster-show {
	-webkit-transform: scale(1,1);
	-moz-transform: scale(1,1);
	-o-transform: scale(1,1);
	-ms-transform: scale(1,1);
	transform: scale(1,1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}

/* swing */

.tooltipster-swing {
	opacity: 0;
	-webkit-transform: rotateZ(4deg);
	-moz-transform: rotateZ(4deg);
	-o-transform: rotateZ(4deg);
	-ms-transform: rotateZ(4deg);
	transform: rotateZ(4deg);
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;
}
.tooltipster-swing.tooltipster-show {
	opacity: 1;
	-webkit-transform: rotateZ(0deg);
	-moz-transform: rotateZ(0deg);
	-o-transform: rotateZ(0deg);
	-ms-transform: rotateZ(0deg);
	transform: rotateZ(0deg);
	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1);
	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	-moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	-ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	-o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
}

/* fall */

.tooltipster-fall {
	-webkit-transition-property: top;
	-moz-transition-property: top;
	-o-transition-property: top;
	-ms-transition-property: top;
	transition-property: top;
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-fall.tooltipster-initial {
	top: 0 !important;
}
.tooltipster-fall.tooltipster-show {
}
.tooltipster-fall.tooltipster-dying {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-property: all;
	top: 0 !important;
	opacity: 0;
}

/* slide */

.tooltipster-slide {
	-webkit-transition-property: left;
	-moz-transition-property: left;
	-o-transition-property: left;
	-ms-transition-property: left;
	transition-property: left;
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-slide.tooltipster-initial {
	left: -40px !important;
}
.tooltipster-slide.tooltipster-show {
}
.tooltipster-slide.tooltipster-dying {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-property: all;
	left: 0 !important;
	opacity: 0;
}

/* Update animations */

/* We use animations rather than transitions here because
 transition durations may be specified in the style tag due to
 animationDuration, and we try to avoid collisions and the use
 of !important */

/* fade */

@keyframes tooltipster-fading {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.tooltipster-update-fade {
	animation: tooltipster-fading 400ms;
}

/* scale */

@keyframes tooltipster-scaling {
	50% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);
	}
}

.tooltipster-update-scale {
	animation: tooltipster-scaling 600ms;
}

/**
 * DEFAULT STYLE OF THE SIDETIP PLUGIN
 * 
 * All styles are "namespaced" with .tooltipster-sidetip to prevent
 * conflicts between plugins.
 */

/* .tooltipster-box */

.tooltipster-sidetip .tooltipster-box {
	background: black;
	border: 2px solid black;
	border-radius: 4px;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
	margin-top: 8px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-box {
	margin-right: 8px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-box {
	margin-left: 8px;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-box {
	margin-bottom: 8px;
}

/* .tooltipster-content */

.tooltipster-sidetip .tooltipster-content {
	color: white;
	line-height: 18px;
	padding: 6px 14px;
}

/* .tooltipster-arrow : will keep only the zone of .tooltipster-arrow-uncropped that
corresponds to the arrow we want to display */

.tooltipster-sidetip .tooltipster-arrow {
	overflow: hidden;
	position: absolute;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
	height: 10px;
	/* half the width, for centering */
	margin-left: -10px;
	top: 0;
	width: 20px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
	height: 20px;
	margin-top: -10px;
	right: 0;
	/* top 0 to keep the arrow from overflowing .tooltipster-base when it has not
	been positioned yet */
	top: 0;
	width: 10px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
	height: 20px;
	margin-top: -10px;
	left: 0;
	/* same as .tooltipster-left .tooltipster-arrow */
	top: 0;
	width: 10px;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
	bottom: 0;
	height: 10px;
	margin-left: -10px;
	width: 20px;
}

/* common rules between .tooltipster-arrow-background and .tooltipster-arrow-border */

.tooltipster-sidetip .tooltipster-arrow-background, .tooltipster-sidetip .tooltipster-arrow-border {
	height: 0;
	position: absolute;
	width: 0;
}

/* .tooltipster-arrow-background */

.tooltipster-sidetip .tooltipster-arrow-background {
	border: 10px solid transparent;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
	border-bottom-color: black;
	left: 0;
	top: 3px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
	border-left-color: black;
	left: -3px;
	top: 0;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
	border-right-color: black;
	left: 3px;
	top: 0;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
	border-top-color: black;
	left: 0;
	top: -3px;
}

/* .tooltipster-arrow-border */

.tooltipster-sidetip .tooltipster-arrow-border {
	border: 10px solid transparent;
	left: 0;
	top: 0;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
	border-bottom-color: black;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
	border-left-color: black;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
	border-right-color: black;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
	border-top-color: black;
}

/* tooltipster-arrow-uncropped */

.tooltipster-sidetip .tooltipster-arrow-uncropped {
	position: relative;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
	top: -10px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
	left: -10px;
}











.box-title {
	font-size:27px;
	white-space:nowrap;
}

.box-title-wrapper {
	justify-self: start;
	width:calc(100% - var(--basepadding));
	max-width:100%;
	overflow:hidden;
	text-overflow:ellipsis;
}

.item-playlist .elementName,
.item-schedule .elementName,
.group-content,
.item-schedule-playlist .schedule-playlist-name,
.dropdown-item label,
.terminal-content,
.schedule-terminal-label span {
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.item-playlist .elementName,
.item-schedule .elementName,
.group-content,
.item-schedule-playlist .schedule-playlist-name,
.schedule-terminal-label span {
	max-width:calc(100% - calc(var(--basepadding)*1.5));
}

.ui-draggable {
	cursor: move;
	cursor: grab;
	cursor: -moz-grab;
	cursor: -webkit-grab;
}

.ui-draggable:active, .ui-draggable-dragging, .ui-sortable-helper, .item-playlist-file:active {
	cursor: grabbing!important;
	cursor: -moz-grabbing;
	cursor: -webkit-grabbing;
}

input.renamable, .box-title {
	text-overflow:ellipsis;
	line-height:1;
	color:inherit;
	background-color:transparent;
	padding:0;
	border-radius:0;
	border:1px solid rgba(0,0,0,0);
	border-bottom:1px solid var(--primaryaccentcolor);
}

input.renamable-db {
	cursor:pointer!important;
}

input.renamable:read-only,
.box-title:read-only {
	border:1px solid rgba(0,0,0,0);
}

input.renamable:-moz-read-only,
.box-title:-moz-read-only {
	border:1px solid rgba(0,0,0,0);
}

.rename-helper {position:relative;}

.rename-helper:before {
	content:"edit";
	font-family: 'Material Icons';
	font-size:20px;
	text-align:center;
	color:var(--gray4);
		position:absolute;
		left:0;
		top:50%;
		transform:translateY(-50%);
		-webkit-transform:translateY(-50%);
		-moz-transform:translateY(-50%);
		-ms-transform:translateY(-50%);
		-o-transform:translateY(-50%);
		opacity:0;
}

.rename-helper.smaller-icon:before {
	font-size:15px;
}

.rename-helper.unselected:hover:before {opacity:1;}
.rename-helper.unselected:hover .renamable:read-only {padding-left:25px;}
.rename-helper.unselected:hover .renamable:-moz-read-only {padding-left:25px;}

.rename-helper.smaller-icon.unselected:hover .renamable:read-only {padding-left:20px;}
.rename-helper.smaller-icon.unselected:hover .renamable:-moz-read-only {padding-left:20px;}

.box.disabled .rename-helper.unselected:hover .renamable:read-only {padding-left:0;}
.box.disabled .rename-helper.unselected:hover .renamable:-moz-read-only {padding-left:0;}
.box.disabled .rename-helper.unselected:hover:before {opacity:0;}


input.unfocusable, input.unfocusable:focus, input.unfocusable:hover {
	color:var(--primarydarkcolor);
        background-color:var(--gray7)!important;
        padding-left:calc(var(--basepadding)*1.1);
	padding-right:calc(var(--basepadding)*1.1);
	border:1px solid var(--gray5);
	border-radius:var(--rounded);
}

/* // Card General Content */

/* File Manager */

#filemanager-actions {
	display:grid;
	grid-template-columns: max-content max-content 1fr;
	grid-auto-rows: auto;
}

#filemanager-actions[data-type="subuser"] {
	grid-template-columns: max-content 1fr;
}

.card-actions#filemanager-actions.open-search {grid-template-columns: 1fr}
.card-actions#filemanager-actions:not(.has-selected-files) #actions-for-selected-files {display:none}

.card-actions#filemanager-actions.has-selected-files {grid-template-columns: max-content max-content 85px 1fr}
.card-actions#filemanager-actions.has-selected-files.open-search {grid-template-columns: 85px max-content 1fr}

#listFiles {
	position:relative;z-index:1; /* Allow filter dropdowns to appear on top */
	display:grid;
	grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); /* As many 60px wide columns as possible */
	grid-template-rows: auto;
	grid-column-gap: var(--basepadding);
	grid-row-gap: var(--basepadding);
	padding-top:5px; /* To allow "new" circle to be visible */
}

#listFiles li {
	/*overflow:hidden;*/
	white-space: nowrap; 
	text-overflow: ellipsis;
	text-align:center;
	cursor: grab;
}

.file-checkbox {display:none;}

#draggingContainer > .item-file,
#draggingContainer > .item-folder,
.item-file.ui-draggable-dragging,
.item-folder.ui-draggable-dragging {
	width:65px;
	height:65px;
	list-style:none!important;
}

#draggingContainer > * .file-thumbnail-wrapper {
	outline:none;
	box-shadow:none;
}

#draggingContainer {
	position:relative;
	z-index:99;
}
#draggingContainer > *:not(:first-child) {
	position:absolute;
	right:0;
	bottom:0;
}

#draggingContainer > *:nth-child(1) {z-index:1; opacity:1;}
#draggingContainer > *:nth-child(2) {z-index:-1; transform:translate(-6px,-6px);opacity:0.8}
#draggingContainer > *:nth-child(3) {z-index:-2; transform:translate(-12px,-12px);opacity:0.6}
#draggingContainer > *:nth-child(4) {z-index:-3; transform:translate(-18px,-18px);opacity:0.4}
#draggingContainer > *:nth-child(5) {z-index:-4; transform:translate(-24px,-24px);opacity:0.2}
#draggingContainer > *:nth-child(6) {z-index:-5; transform:translate(-30px,-30px);opacity:0.1}
#draggingContainer > *:nth-child(n+6) {z-index:-6; transform:translate(-36px,-36px);opacity:0}

#draggingContainer > *:first-child:last-child {opacity:0.35}

.item-folder.ui-draggable-dragging .folder-thumbnail-wrapper {
	background:var(--gray5);
}

#draggingContainer .filename,
#draggingContainer .item-folder .foldername,
#draggingContainer .item-file .file-thumbnail-wrapper label[for^="select-file"],
#draggingContainer .item-file label[for^="list-select-file"],
#draggingContainer .item-file [content-for="list-view"],
#draggingContainer .item-folder [content-for="list-view"]
.item-file.ui-draggable-dragging .filename,
.item-folder.ui-draggable-dragging .foldername,
.item-file.ui-draggable-dragging .file-thumbnail-wrapper label[for^="select-file"],
.item-file.ui-draggable-dragging label[for^="list-select-file"],
.item-file.ui-draggable-dragging [content-for="list-view"],
.item-folder.ui-draggable-dragging [content-for="list-view"] {
	display:none;
}

.item-file.checked .file-thumbnail-wrapper {
	outline:3px solid var(--primaryaccentcolor);
	box-shadow:0 0 5px var(--primaryaccentcolor);
}

.file-thumbnail-wrapper, .folder-thumbnail-wrapper {
	position:relative;
	width:100%;
	height:0;
	padding-bottom:100%;
}

.file-thumbnail-wrapper {
	background:black;
	/*border:1px solid var(--gray5);*/
	border:none;
}

.folder-thumbnail-wrapper {
	background:white;
	cursor:pointer;
}

.item-file[data-type="url"] .file-thumbnail-wrapper {
	background:white;
	/*border:1px solid rgba(255,255,255,0);*/
	border:none;
}

.item-file.new .file-thumbnail-wrapper:after, .item-folder.new .folder-thumbnail-wrapper:after {
	content:"";
	position:absolute;
	z-index:2;
	right:0;
	top:0;
	width:10px;height:10px;
	border-radius:var(--rounded);
	background:var(--primaryaccentcolor);
	transform:translate(50%,-50%);
	-webkit-transform:translate(50%,-50%);
	-moz-transform:translate(50%,-50%);
	-ms-transform:translate(50%,-50%);
	-o-transform:translate(50%,-50%);
}

.thumbnail-folder-icon, .thumbnail-url-icon, .thumbnail-folder-up-icon  {
	width:100%;
	height:100%;
	object-fit:contain;
	object-position:center;
	position:absolute;
	left:50%;top:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
}

.img-thumbnail  {
	width:100%;
	height:100%;
	object-fit:contain;
	object-position:center;
	position:absolute;
	top:0;right:0;bottom:0;left:0;
}

.thumbnail-folder-icon, .thumbnail-url-icon, .thumbnail-folder-up-icon {
	fill:none;
	stroke-linecap:round;
	stroke-linejoin:round;
	stroke-miterlimit:10;
	stroke-width: 6px;
	transition:all 0.2s var(--normal-easing);
	-webkit-transition:all 0.2s var(--normal-easing);
	-moz-transition:all 0.2s var(--normal-easing);
	-ms-transition:all 0.2s var(--normal-easing);
	-o-transition:all 0.2s var(--normal-easing);
}

.thumbnail-folder-icon, .thumbnail-url-icon {stroke:var(--secondarycolor);}
.thumbnail-folder-up-icon, .thumbnail-upload-file {stroke:var(--gray5);stroke-width: 1.75px;}

.thumbnail-folder-icon {width:70%;}
.thumbnail-url-icon {width:50%;}

.item-folder:not(.ui-droppable-active):hover .thumbnail-folder-icon, .item-folder.ui-droppable-hover .thumbnail-folder-icon {
	fill:var(--gray5);
	stroke:white;
}

.upload-file-thumbnail .file-thumbnail-wrapper,
.item-move-file-up .folder-thumbnail-wrapper {
	background:transparent;
	cursor:pointer;
	border:1px solid var(--gray5);
		transition:all 0.2s var(--normal-easing);
		-webkit-transition:all 0.2s var(--normal-easing);
		-moz-transition:all 0.2s var(--normal-easing);
		-ms-transition:all 0.2s var(--normal-easing);
		-o-transition:all 0.2s var(--normal-easing);
}

.item-move-file-up .folder-thumbnail-wrapper {
	border-style:dashed;
}

.upload-file-thumbnail .file-thumbnail-wrapper span {
	position:absolute;
	left:50%;
	top:50%;
	width:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	height:1px;
	background:var(--gray5);
		transition:all 0.2s var(--normal-easing);
		-webkit-transition:all 0.2s var(--normal-easing);
		-moz-transition:all 0.2s var(--normal-easing);
		-ms-transition:all 0.2s var(--normal-easing);
		-o-transition:all 0.2s var(--normal-easing);
}

.upload-file-thumbnail .file-thumbnail-wrapper span:nth-child(2) {
	transform:translate(-50%,-50%) rotate(90deg);
	-webkit-transform:translate(-50%,-50%) rotate(90deg);
	-moz-transform:translate(-50%,-50%) rotate(90deg);
	-ms-transform:translate(-50%,-50%) rotate(90deg);
	-o-transform:translate(-50%,-50%) rotate(90deg);
}

.upload-file-thumbnail .filename,
.item-move-file-up .filename {
	color:var(--gray3);
}

.upload-file-thumbnail:hover .file-thumbnail-wrapper,
.item-move-file-up.ui-droppable-hover .folder-thumbnail-wrapper {
	border-color:transparent;
	background:var(--gray6);
}

.upload-file-thumbnail:hover .file-thumbnail-wrapper svg,
.item-move-file-up.ui-droppable-hover .folder-thumbnail-wrapper svg {
	stroke:var(--primarydarkcolor);
}

#listFiles li .filename, #listFiles li .foldername {
	display:block;
	font-size:var(--XSbuttonFONTsize);
	margin-top:calc(var(--basespacing)*0.3);
	text-align:center;
	line-height:16px;
}



.file-mask {
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	transition:all 0.2s var(--normal-easing);
	-webkit-transition:all 0.2s var(--normal-easing);
	-moz-transition:all 0.2s var(--normal-easing);
	-ms-transition:all 0.2s var(--normal-easing);
	-o-transition:all 0.2s var(--normal-easing);
	opacity:0;
}

.item-folder .folder-thumbnail-wrapper .file-mask {background:rgba(255,255,255,0);}
.item-file[data-type="url"] .file-thumbnail-wrapper .file-mask {background:rgba(255,255,255,0.8);}

/* Preview Text */
/* .file-mask .file-info {
	position:absolute;
	width:100%;
	height:auto;
	z-index:2;
	left:50%;
	bottom:4px;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	font-size:13px;
	color:white;
} */

/* Preview icon */
.file-mask .file-info {
	position:absolute;
	width:100%;
	height:auto;
	z-index:2;
	left:50%;
	top:50%;
	/* bottom:4px; */
	transform:translate(-50%,-75%);
	-webkit-transform:translate(-50%,-75%);
	-moz-transform:translate(-50%,-75%);
	-ms-transform:translate(-50%,-75%);
	-o-transform:translate(-50%,-75%);
	color:white;
}

.file-mask .file-info i {
	font-size:24px;
}

.file-thumbnail-wrapper button, .folder-thumbnail-wrapper button {
	opacity:0;
	position:absolute;
	z-index:2;
	width:20px;
	height:20px;
	background:var(--secondarycolor);
	border-radius:var(--rounded);
	color:white;
}

.file-thumbnail-wrapper button.delete-file, .folder-thumbnail-wrapper button.delete-file {
	top:3px;right:3px;
	/* top:-4px;right:-4px; */
}

.file-thumbnail-wrapper button.folder-info, .folder-thumbnail-wrapper button.folder-info {
	top:3px;left:3px;
	/* top:-4px;left:-4px; */
	opacity:1;
}

.file-thumbnail-wrapper button i, .folder-thumbnail-wrapper button i {
	font-size:12px!important;
}

#listFiles li:hover .file-mask {
	opacity:1;
}

#listFiles li:hover .file-thumbnail-wrapper button, #listFiles li:hover .folder-thumbnail-wrapper button,
#listFiles li:hover .file-thumbnail-wrapper label, #listFiles li:hover .folder-thumbnail-wrapper label {
	opacity:1;
}






#files-list-view-header {
	width:100%;
	display:grid;
	grid-template-columns:35px 2.5fr 0.7fr 1fr 0.5fr 0.7fr 30px;
	align-items:center;
	gap:10px;
	font-size:var(--XSbuttonFONTsize);
	border-bottom:1px solid var(--gray7);
	margin-bottom:12px;

	display:none;
}

#files-list-view-header span {cursor:pointer;padding-bottom:6px;}
#files-list-view-header span:not(:last-child):not(:first-child):not(:nth-last-child(2)) {border-right:1px solid var(--gray7)}
#files-list-view-header span:nth-child(1) {width:35px;}



#listFiles[view-as="list"] {
	display:flex;
	flex-direction:column;
	gap:0;
}

#listFiles[view-as="list"] li {
	height:35px;
	display:grid;
	flex-direction:row;
	align-items:center;
	grid-template-columns:35px 2.5fr 0.7fr 1fr 0.5fr 0.7fr 30px;
	gap:10px;
	border-bottom:1px solid var(--gray5);
}

#listFiles[view-as="list"] li [content-for="list-view"] {
	display:flex;
	font-size: var(--XSbuttonFONTsize);
}

#listFiles[view-as="list"] li > .filename,
#listFiles[view-as="list"] li > .foldername {
	text-align:left;
}

#listFiles[view-as="list"] .item-upload {display:none}

#listFiles:not([view-as="list"]) li [content-for="list-view"],
#listFiles[view-as="list"] li .overlay {
	display:none
}

#listFiles[view-as="list"] li .file-thumbnail-wrapper, #listFiles[view-as="list"] li .folder-thumbnail-wrapper {
	position:relative;
	height:28px;
	width:28px;
	padding:unset;
}

#listFiles[view-as="list"] li .file-thumbnail-wrapper .delete-file,
#listFiles[view-as="list"] li .folder-thumbnail-wrapper .delete-folder {
	display:none;
}

#listFiles[view-as="list"] li:hover .file-thumbnail-wrapper .file-mask {
	opacity:0;
}

#listFiles[view-as="list"] li [content-for="list-view"].delete-file {
	opacity:0;
	z-index:2;
	width:20px;
	height:20px;
	background:var(--secondarycolor);
	border-radius:var(--rounded);
	color:white;
	display:flex;
	align-items:center;
	justify-content:center;
}

#listFiles[view-as="list"] li:hover [content-for="list-view"].delete-file {
	opacity:1;
}

#listFiles[view-as="list"] li [content-for="list-view"].delete-file i {
	font-size:12px!important;
}






.file-thumbnail-wrapper label[for^="select-file"] {
	position:absolute;
	z-index:2;
	bottom:6px;
	left:50%;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	
	text-transform:uppercase;
	font-size:var(--XXSbuttonFONTsize);
	padding:calc(var(--basespacing)*0.3) calc(var(--basespacing)*0.75) calc(var(--basespacing)*0.3) calc(var(--basespacing)*1.75);

	opacity:0;
}

.file-thumbnail-wrapper label[for^="select-file"]:after,
.file-thumbnail-wrapper label[for^="select-file"]:before {
	text-transform: lowercase;
	font-size:var(--XXSbuttonFONTsize);
	left:5px;
}

.file-thumbnail-wrapper label[for^="select-file"]:before {
	left:7px;
	width:6px;
	height:6px;
}

.file-thumbnail-wrapper [type="checkbox"]:not(:checked) + label[for^="select-file"] {
	/* background:var(--secondarycolor);
	border:none;
	color:var(--primarycolor); */
	color:var(--gray4);
}

.file-thumbnail-wrapper [type="checkbox"]:checked + label[for^="select-file"] {
	/* background:var(--secondarycolor);
	border:none;
	color:var(--primarycolor); */
	background:var(--secondarycolor);
	color:var(--gray4);
	/* opacity:1; */
}

.file-thumbnail-wrapper [type="checkbox"]:checked + label[for^="select-file"]:after {
	color:white;
}

#listFiles[view-as="grid"] .file-thumbnail-wrapper label[for^="select-file"] span[text-for="checked"],
#listFiles[view-as="grid"] .file-thumbnail-wrapper [type="checkbox"]:checked + label[for^="select-file"] span[text-for="unchecked"] {display:none}
#listFiles[view-as="grid"] .file-thumbnail-wrapper [type="checkbox"]:checked + label[for^="select-file"] span[text-for="checked"] {display:flex}








#listFiles[view-as="grid"] li .file-thumbnail-wrapper label[for^="select-file"] {display:flex}
#listFiles[view-as="list"] li .file-thumbnail-wrapper label[for^="select-file"] {display:none}

#listFiles[view-as="grid"] li label[for^="list-select-file"] {display:none}
#listFiles[view-as="list"] li label[for^="list-select-file"] {display:flex}

#listFiles[view-as="list"] li {position:relative}
#listFiles[view-as="list"] li:not(.notransition) {
	position:relative;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}
#listFiles[view-as="list"] li.item-file.checked .file-thumbnail-wrapper {
	outline:none;
	box-shadow:none;
}

#listFiles li label[for^="list-select-file"] {
	position:absolute;
	left:0;
	height:100%;
	border:none;
	opacity:0;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

#listFiles li label[for^="list-select-file"]:before {
	content:"";
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	width:18px;
	height:18px;
	padding:0;
	border:1px solid var(--gray5);
}

#listFiles li input[type="checkbox"][id^="list-select-file"]:checked + label:after {
	left:1px;
	font-size:20px;
}

#listFiles li:hover label[for^="list-select-file"],
#listFiles li.checked label[for^="list-select-file"] {
	opacity:1;
}

#listFiles li:hover label[for^="select-file"] {
	opacity:1;
}

#listFiles[view-as="list"] li:not(.item-folder):hover,
#listFiles[view-as="list"] li:not(.item-folder).checked {
	padding-left:calc(var(--basespacing)*3.5);
}

.button-row {
	display:flex;
	flex-direction:row;
	align-items:center;
	padding:0;
	border-radius:var(--rounded);
}

.button-row:hover {
	background:white;
	color:var(--primarydarkcolor);
}

.view-type-group button {
	padding:0;
	margin:0;
	line-height:1;
	border:none;
	height:100%;
	padding-left:5px;
	padding-right:5px;
	border-radius:0;
	color:var(--primarydarkcolor);
}

.view-type-group button:first-child {padding-left:10px;border-top-left-radius:var(--rounded);border-bottom-left-radius:var(--rounded);}
.view-type-group button:last-child {padding-right:10px;border-top-right-radius:var(--rounded);border-bottom-right-radius:var(--rounded);}

.view-type-group button:not(:first-child) {
	border-left:1px solid var(--gray5);
}

.view-type-group button i {
	font-size:var(--buttonFONTsize);
}


/* Upload Modal */

#modal-upload .standard-modal-header {
	grid-template-columns: 1fr;
	grid-auto-columns: auto;
	grid-row: 2;
	grid-gap: calc(var(--basepadding)*1);
	align-items: center;
	justify-content:center;
	padding-bottom:0;
	padding-top:calc(var(--basepadding)*3);
	padding-bottom:calc(var(--basespacing)*1);
}

#modal-upload .standard-modal-footer {
	padding:0 0 calc(var(--basespacing)*3.5) 0;
	margin:0 calc(var(--basespacing)*3.5);
	/*border-top:1px solid var(--gray4);*/
	border:none;

	display:grid;
	grid-template-columns:1fr max-content max-content;
	justify-content:end;
	align-items:center;

	display:none;
}

#modal-upload .standard-modal-footer .fileinput-button {
	justify-self:start;
}

#modal-upload.has-files .standard-modal-header {
	grid-gap: calc(var(--basepadding)*2);
	padding-bottom:calc(var(--basepadding)*2);
	padding-top:calc(var(--basepadding)*2.5);
}

#modal-upload.has-files .standard-modal-content {
	display:none;
}

#modal-upload.has-files .standard-modal-footer {
	display:grid;
	padding-bottom:calc(var(--basespacing)*3);
}

#filemanagerdropzone {
	cursor:default;
	opacity:0;
	min-height:0;
	position:fixed;
	z-index:1;
	width:100%;
	height:100%;
	top:0;right:0;bottom:0;left:0;
}

.upload-drop-area {
	position:relative;
	border:none;
	padding:calc(var(--basespacing)*2);
	margin-bottom:calc(var(--basespacing)*2);
	border:1px solid rgba(255,255,255,0);
}

.upload-drop-area h3 {
	opacity:0;
	position:absolute;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
}

.upload-drop-area.hover {
	border:1px dashed var(--gray4);
}

.upload-drop-area.hover h3 {
	opacity:1;
}

#modal-upload .illustration {
	display:block;
	margin:0 auto;
	width:90%;
	max-width:300px;
	max-height:140px;
}

#modal-upload .upload-action {
	text-align:center;
}

#modal-upload .upload-action p {
	margin-bottom:var(--basespacing);
}

#modal-upload .standard-modal-content {
	padding-top:0;
}


.dz-default.dz-message {display:none;}

#previews {
	display:grid;
	grid-gap: calc(var(--basespacing)*0.5);
	/*
	max-height:250px;
	overflow-y:auto;
	*/
}

.file-row {
	width:100%;
	display:grid;
	align-items:center;
	grid-template-columns: 80px 1fr max-content;
	grid-template-rows: max-content max-content 1fr;
	grid-column-gap:var(--basepadding);
	grid-row-gap:calc(var(--basespacing)*0.5);
	grid-template-areas:
	"upload-file-preview upload-file-name upload-file-action"
	"upload-file-preview upload-file-size upload-file-action"
	"upload-file-preview upload-file-progress upload-file-action";
}

.file-row div {padding:0;line-height:1;}

/* File thumbnail wrapper */
.file-row div:nth-child(1) {grid-area:upload-file-preview;justify-self:center;grid-row: span 3;position:relative;width:100%;height:0;padding-bottom:56.25%;background:black;overflow:hidden;}

/* File name */
.file-row div:nth-child(2) {grid-area:upload-file-name;align-self:end;justify-self:start;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* File size */
.file-row div:nth-child(3) {grid-area:upload-file-size;align-self:start;justify-self:start;}

/* File progress */
.file-row div:nth-child(4) {grid-area:upload-file-progress;justify-self:left;align-self:end;}

/* File actions */
.file-row div:nth-child(5) {grid-area:upload-file-action;justify-self:center;grid-row: span 3;position:relative;}

.name {font-size:90%;}
.size {color:var(--gray3);text-transform:uppercase;letter-spacing:1px;font-size:var(--XSbuttonFONTsize);display:inline;}

/* Actual thumbnail image */
.preview img {
	object-fit:contain;
	width:100%;
	height:100%;
	position:absolute;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
}

.progress.progress-striped.active {
	width:100%;
	height:2px;
	border-radius:var(--rounded);
	background:var(--gray6);
}

.file-row .progress .progress-bar {
	padding:0;
	height:100%;
	background:var(--primaryaccentcolor);
	transition:all 0.3s var(--normal-easing);
	-webkit-transition:all 0.3s var(--normal-easing);
	-moz-transition:all 0.3s var(--normal-easing);
	-ms-transition:all 0.3s var(--normal-easing);
	-o-transition:all 0.3s var(--normal-easing);
}

.file-row button i {margin-top:0;}

.file-row button {
	z-index:1;
	border-radius:var(--rounded);
	background:var(--gray6);
	color:var(--secondarycolor);
}

.file-row button:hover {
	background:var(--secondarycolor);
	color:white;
}

.file-row button.cancel {display:none;}

/*
.file-row button.success, .file-row button.cancel {
	display:none;
	position:absolute;
	left:0;right:0;
}*/

.file-row button.success, .file-row button.cancel {display:none;}

.file-row button.success {
	background:white;
	border:1px solid var(--gray7);
}

.standard-modal-footer button {z-index:1;}

.file-row span.error {
	font-size:11px;
	margin-left:var(--basespacing);
	display:none;
	color:red;
}

.file-row.dz-error span.error {
	display:inline;
}

.file-row.dz-processing button.success {display:none;}
.file-row.dz-processing button.delete {display:none;}
.file-row.dz-processing button.cancel {display:block;}

.file-row.dz-success.dz-complete button.success {display:block;}
.file-row.dz-success.dz-complete button.delete {display:none;}
.file-row.dz-success.dz-complete button.cancel {display:none;}

.file-row.dz-processing.dz-error.dz-complete button.success {display:none;}
.file-row.dz-processing.dz-error.dz-complete button.delete {display:block;}
.file-row.dz-processing.dz-error.dz-complete button.cancel {display:none;}

.file-row.dz-processing.dz-error.dz-complete div:nth-child(1) {opacity:0.3;}
.file-row.dz-processing.dz-error.dz-complete div:nth-child(2) {opacity:0.3;}
.file-row.dz-processing.dz-error.dz-complete div:nth-child(3) .size {opacity:0.3;}

/* // Upload Modal */


/* Preview file Modal */

#modal-previewfile .standard-modal-header {
	padding-bottom:calc(var(--basepadding)*2);
}

#modal-previewfile .standard-modal-header {
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

#modal-previewfile .standard-modal-title {
	overflow:hidden;
	max-width:98%;
	text-overflow:ellipsis;
}

#modal-previewfile .standard-modal-content {
	padding-top:0;
}

.preview-fullsize-container {
	position:relative;
	display:block;
	width:100%;
	height:0;
	padding-bottom:70%;
	overflow:hidden;
	background:var(--bodycolor);
}

.preview-file-box {
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	display:block;
	width:75%;
	height:auto;
	border-radius:3px;
	padding:7px;
	border:1px solid var(--gray3);
	-webkit-box-shadow: 0px 10px 25px -10px rgba(0,0,0,0.4); 
	box-shadow: 0px 10px 25px -10px rgba(0,0,0,0.4);
}

.preview-file-box.vertical {
	width:auto;
	height:75%;
}

.preview-file-box:before {content:""}

.preview-file, .preview-file-box:before {
	display:block;
	position:absolute;
	width:calc(100% - 14px);
	height:calc(100% - 14px);
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	object-fit:cover;
	object-position:center;
	border:1px solid var(--gray3);
	background:black;
}

iframe.preview-file {
	object-fit:unset;
	object-position:unset;
}

.preview-file-box.vertical .preview-file {
	width:auto;
	height:100%;
}

#previewFile .preview-file-box {
	border-radius:unset;
	padding:unset;
	border:unset;
	-webkit-box-shadow: unset; 
	box-shadow: unset;
	background:unset;
}

#previewFile .preview-file-box:before {
	display:none;
}

#previewFile .preview-file-box {
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	display:flex;
	align-items:center;
	justify-content:center;
	width:75%;
	height:75%;
}

#previewFile iframe.preview-file {object-fit:unset;object-position:unset;height:100%}
#previewFile[data-type="url"] .preview-file-box {height:62%}
#previewFile[data-type="url"] .preview-file-box.vertical {width:25.7%}

#previewFile .preview-file {
	display:block;
	width:100%;
	height:auto;
	border-radius:3px;
	padding:7px;
	border:1px solid var(--gray3);
	-webkit-box-shadow: 0px 10px 25px -10px rgba(0,0,0,0.4); 
	box-shadow: 0px 10px 25px -10px rgba(0,0,0,0.4);
	object-fit:contain;
	object-position:center;
	border:1px solid var(--gray3);
}

#previewFile .preview-file.vertical {
	width:auto;
	height:100%;
	padding:7px 2px;
}

#previewFile[data-type="url"] .preview-file.vertical {
	padding:0;
	width:100%;
}

.preview-actions {
	display:flex;
	align-items:center;
	gap:calc(var(--basespacing)*0.5);
}

.preview-fullsize-breadcrumb {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:var(--basespacing);
	font-size:var(--SbuttonFONTsize);
	color:var(--gray4);
	margin-top:calc(var(--basespacing)*0.75);
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
}

.preview-fullsize-info {
	display:grid;
	grid-template-columns:1fr 1fr;
	grid-template-rows:1fr;
	grid-gap:calc(var(--basespacing)*0.25);
	align-items:center;
	margin:calc(var(--basespacing)*2) 0;
	color:var(--primarydarkcolor);
	font-size:var(--MSbuttonFONTsize);
		border-top:1px solid var(--gray7);
		border-bottom:1px solid var(--gray7);
}

.preview-info-wrapper {
	border-bottom:1px solid var(--gray7);
	padding:calc(var(--basespacing)*0.25) 0;
	color:var(--gray3);
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
}

.preview-info-wrapper:last-child, .preview-info-wrapper:nth-last-child(2) {
	border-bottom:none;
}

.preview-name-wrapper {
	display:grid;
	grid-template-columns:max-content 1fr;
	grid-gap:0;
	align-items:end;
}

.preview-name-wrapper .renamable {
	display:inline-block;
	transform:translateY(1px);
	-webkit-transform:translateY(1px);
	-moz-transform:translateY(1px);
	-ms-transform:translateY(1px);
	-o-transform:translateY(1px);
}

.preview-info, input.renamable.preview-info {
	color:var(--primarydarkcolor);
}

li.preview-fullsize-associated-playlist-name {border-color:var(--gray7);font-size:12px;}

.preview-fullsize-associated-playlists {margin-top:11px;}

/* // Preview file Modal */



/* // File Manager */

/* List Playlists */

.card-actions#playlistControls {
	display:grid;
	grid-template-columns: 1fr max-content;
	grid-auto-rows: auto;
}

.ruled-list li.item-playlist {
	padding:0;
}

.item-playlist {
	list-style-type:none;
	position:relative;
	z-index:1;
	cursor:pointer;
	font-size:var(--SbuttonFONTsize);
	color:var(--primarydarkcolor);
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.item-playlist input.renamable-db {
	line-height:16px;
	padding:calc(var(--basespacing)*0.4) 0;
	color:var(--primarydarkcolor);
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

/* .item-playlist[data-type="subuser"] input {
	padding-left:15px;
} */

.item-playlist .playlist-content > span {
	line-height:16px;
	padding:calc(var(--basespacing)*0.4) 0;
}

.item-playlist[data-type="subuser"] .playlist-content > i {
	position:absolute;
	right:20px;
	top:50%;
	transform:translateY(-50%);
	font-size:12px;
	margin-top:0;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

.item-playlist[disabled] {opacity:1;}

.item-playlist:after {
	content:"keyboard_arrow_right";
	position:absolute;
	height:auto;width:auto;
	right:0;
	display:block;
	top:50%;
	opacity:1;
	transform:translate(0,-50%);
	-webkit-transform:translate(0,-50%);
	-moz-transform:translate(0,-50%);
	-ms-transform:translate(0,-50%);
	-o-transform:translate(0,-50%);
        	font-size:18px;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

.item-playlist:before {
	content:"";
	position:absolute;
	z-index:-1;
	width:calc(100% + calc(var(--basepadding)*4));
	height:100%;
	left:50%;top:0;bottom:0;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	background:var(--gray6);
	opacity:0;
}

.item-playlist:hover:before {
	opacity:1;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

.item-playlist[data-type="subuser"]:hover .playlist-content > i {
	opacity:0;
}

.item-playlist.pre-selected:after {
	animation: preSelected 0.5s linear;
	-webkit-animation: preSelected 0.5s linear;
}

@keyframes preSelected {
    0% { color:inherit; transform:translate(0%,-50%); opacity:1; }
    49% { color:white; transform:translate(50%,-50%); opacity:0; }
    50% { color:white; transform:translate(-50%,-50%); opacity:0; }
    100% { color:white; transform:translate(0%,-50%); opacity:1; }
}

.item-playlist.selected, .item-playlist.selected input.renamable-db {
	color:white;
}

.item-playlist.selected:before {
	opacity:1;
	background:var(--secondarycolor);
}

.item-playlist .actions button {
	background:var(--secondarycolor);
	color:white;
	opacity:0;
	transform:scale(0);
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	-ms-transform:scale(0);
	-o-transform:scale(0);
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.item-playlist:hover .actions button {
	opacity:1;
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
}

/* // List Playlists */

/* Playlist Content */

#seePlaylist, #seeSchedule {
	position:relative;
	padding:0;
	margin:0;
	padding-bottom:calc(var(--basepadding)*2);
}

.configurePlaylist {
	display:grid;
	grid-template-columns: 1fr max-content max-content;
	justify-items: end;
	align-items: center;
}

#playlist-actions {
	display:grid;
	grid-template-columns: max-content max-content 1fr;
	align-items:center;
}

#playlist-actions button:last-child {
	justify-self:end;
}

#PlaylistContentCard[data-employee] #playlist-actions .delete-mainbtn {
	display:none;
}

#PlaylistContentCard[data-employee] #playlist-name {
	font-size:27px;
	line-height:36px;
	overflow:hidden;
	text-overflow:ellipsis;
}

#PlaylistContentCard #playlist-name {display:none;}
#PlaylistContentCard[data-employee] #playlist-name {display:block;}
#PlaylistContentCard[data-employee] .box-title-helper {display:none;}

.playlist-totalduration.alert {
	color:red;
}

#over-max-message {
	display:none;
	align-items:center;justify-content:flex-end;
	gap:4px;
	margin-left:10px;
	color:red;
}

.item-playlist-file {
	cursor:grab;
	position:relative;
	width:100%;
	height:auto;
	display:grid;
	grid-template-columns: max-content max-content 1fr;
	align-items: center;
	border-bottom:1px solid var(--gray5);
	background:white;
}

.playlist-content {
	margin-left:var(--basespacing);
	display:grid;
	grid-template-columns: 1fr max-content;
	align-items: center;
	padding-right:25px;
}

.playlist-specifications {
	overflow:hidden;
	text-overflow:ellipsis;
}

.playlist-specifications .elementName {
	white-space:nowrap;
}

.playlist-specifications .playlistfile-extras {
	margin-top:3px;
	display:flex;
	flex-direction:row;
	align-items:center;
}

.playlist-specifications .playlistfile-extras .edited-info {
	margin-left:var(--basespacing);
	color:var(--gray3);
	font-size:var(--XSbuttonFONTsize);
}

.playlist-specifications .playlistfile-extras .edited-info i {
	font-size:var(--XSbuttonFONTsize);
	margin-right:calc(var(--basespacing)*0.3);
}

.playlist-content .actions {
	justify-self: end;
	z-index:2; /* Above expired layer */
}

.playlist-content .actions button {
	background:var(--secondarycolor);
	color:white;
	opacity:0;
	transform:scale(0);
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	-ms-transform:scale(0);
	-o-transform:scale(0);
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.playlist-content .actions button:last-child {
	background:white;
	color:var(--secondarycolor);
	border:1px solid var(--secondarycolor);
}

.item-playlist-file.ui-sortable-helper {
	opacity:0.5;
}

.ui-sortable-placeholder {
	background:var(--gray6);
}

.item-playlist-file:first-child {
	border-top:1px solid var(--gray5);
}

.item-playlist-file .playlist-span {
	position:relative;
	display:inline-block;
	width:var(--lineheightL);
	height:var(--lineheightL);
	margin-top:calc(var(--basespacing)*0.5);
	margin-bottom:calc(var(--basespacing)*0.5);
	background:black;
}

.item-playlist-file[data-type="url"] .playlist-span {
	background:white;
	border:1px solid rgba(255,255,255,0);
}

.drag-indicator {
	height:auto;
	color:var(--gray5);
	margin-right:var(--basespacing);
}

.item-playlist-file:hover .playlist-content .actions button {
	opacity:1;
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
}

.drop-area {
	display:none;
	opacity:0;
}

.drop-area {
	position:relative;
	z-index:2;

	align-items: center;
	width:100%;
	height:calc(var(--lineheightL)*1.5);
	margin-top:var(--basespacing);
	border:1px dotted var(--gray4);
	color:var(--gray4);
	text-align:center;
}

.ui-droppable-active .drop-area {
	display:grid;
	opacity:1;
}

.ui-droppable-hover .drop-area {
	border:none;
	background:var(--gray6);
	color:black;
}

.ui-droppable-hover .scheduled_playlists, .ui-droppable-hover #seePlaylist {
	opacity:0.5;
}



/* Config time modal */

#modal-playlistfile-config-time .standard-modal-content {
	padding-bottom:0;
	margin-bottom:0;
}

#modal-playlistfile-config-time .modal-subtitle {
	opacity:1;
		transition:all 0.25s var(--normal-easing);
		-webkit-transition:all 0.25s var(--normal-easing);
		-moz-transition:all 0.25s var(--normal-easing);
		-ms-transition:all 0.25s var(--normal-easing);
		-o-transition:all 0.25s var(--normal-easing);
}

#modal-playlistfile-config-time .modal-subtitle.inactive {
	opacity:0;
}

#modal-playlistfile-config-time .standard-modal-footer {
	border:none;
}

#modal-playlistfile-config-time .standard-modal-header {
	padding-bottom:0;
}

#modal-playlistfile-config-time .standard-modal-footer {
	grid-template-columns:1fr max-content max-content;
}

.config-time-subtitle,
.original-time {
	font-size:20px;
	color:var(--primarydarkcolor);
	/* margin-top:-20px; */
	/* margin-top:calc(var(--basespacing)*0.5); */
	margin-bottom:var(--basespacing);
}

.config-time-subtitle small,
.original-time small {
	color:var(--gray4);
	/* text-transform:uppercase; */
	/* letter-spacing:1px; */
}

.config-time-subtitle:not(.edited) {
	opacity:0;
}

#config-file-time {
	font-size:90px;
	line-height:1;
	/* height:75px; */
	height:auto;
	background:transparent;
	border:none;
	border-radius:none;
	padding:0;
	text-align:center;
		transition:all 0.25s var(--normal-easing);
		-webkit-transition:all 0.25s var(--normal-easing);
		-moz-transition:all 0.25s var(--normal-easing);
		-ms-transition:all 0.25s var(--normal-easing);
		-o-transition:all 0.25s var(--normal-easing);
}

input[type=time]::-webkit-inner-spin-button, 
input[type=time]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

input[type="time"]::-webkit-clear-button {
    -webkit-appearance: none;
}

input#config-file-time:invalid {
	color:var(--gray4);
}

input#config-file-time.inactive, {
	opacity:1;
	color:var(--gray4);
}

/* // Config time modal */

/* Playlist Preview Specifics */

#modal-playlistpreview .modal-subtitle {
	opacity:1;
		transition:all 0.25s var(--normal-easing);
		-webkit-transition:all 0.25s var(--normal-easing);
		-moz-transition:all 0.25s var(--normal-easing);
		-ms-transition:all 0.25s var(--normal-easing);
		-o-transition:all 0.25s var(--normal-easing);
}

#modal-playlistpreview .modal-subtitle.inactive {
	opacity:0;
}

.preview-bar-content-holder {
	display:grid;
	grid-template-columns:1fr;
	grid-template-rows:max-content max-content;
	grid-gap:calc(var(--basespacing)*0.3);
	align-items:center;
	justify-items:center;
	justify-content:center;
	width:75%;
	margin:0 auto;
}

.preview-progress-holder {
	position:relative;
	width:100%;
	height:4px;
	border-radius:var(--rounded);
	background:var(--gray7);
	overflow:hidden;
	grid-column:span 2/2;
}

.preview-progress {
	width:0;
	position:absolute;
	z-index:1;
	height:100%;
	top:0;bottom:0;
	left:0;
	background:var(--primaryaccentcolor);
}

@keyframes preview {
    0% {width:0;}
    100% {width:100%;}
}

.bar-marker {
	position:absolute;
	z-index:2;
	width:0;
	height:100%;
	top:0;bottom:0;
	left:0;
	display:none;
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.bar-marker:after {
	content:"";
	position:absolute;
	top:0;bottom:0;
	right:0;
	height:100%;
	width:1px;
	background:var(--secondarycolor);
}

.bar-marker:last-of-type:after {
	display:none;
}

.bar-marker:hover {
	background:rgba(0,0,0,0.1);
}

.marker-tooltip {
	display:none;
}

.marker-file-container {
	position:absolute;
	bottom:100%;left:50%;
	transform:translate(-50%,-10%);
	width:100px;height:100px;
	display:block;
	margin:0 auto;
	padding:5px;
	/* background:var(--bodycolor); */
}

.marker-file-box {
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	display:block;
	width:100%;
	height:100%;
	border-radius:3px;
	padding:7px;
	/* -webkit-box-shadow: 0px 10px 25px -10px rgba(0,0,0,0.4); 
	box-shadow: 0px 10px 25px -10px rgba(0,0,0,0.4); */
}

.marker-preview-file {
	display:block;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	border:none;
	width:100%;
	height:100%;
	object-fit:contain;
	object-position:bottom center;
}

.marker-text {
	width:200px;
}

.marker-time, .marker-time span {
	text-align:center;
	font-size:13px;
	font-weight:800;
}

.marker-name {
	display:block;
	text-align:center;
}

.play-icon, .pause-icon, .stop-icon {
	position:absolute;
	width:auto;
	height:auto;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	opacity:0;
}

.preview-action {
	margin-top:var(--basespacing);
}

.preview-action[data-state="playing"] .stop-icon,
.preview-action[data-state="stopped"] .play-icon {
	opacity:1;
}

.preview-action[data-state="playing"] .play-icon,
.preview-action[data-state="stopped"] .stop-icon {
	opacity:0;
}

.playlist-stopped {
	display:none;
}

.content-showing, .playlist-stopped {
	font-size:var(--SbuttonFONTsize);
	justify-self:start;
}

.content-showing span:first-child, .playlist-stopped span {
	color:var(--gray2);
}

.content-showing-name {
	color:black;
}

.preview-timer {
	line-height:1;
	font-size:var(--SbuttonFONTsize);
	color:var(--gray1);
	justify-self:end;
}

#countDown {
	line-height:1;
}

/* // Playlist Preview specifics */


/* // Playlist Content */

/* List Schedules */

.card-actions#scheduleControls {
	display:grid;
	grid-template-columns: 1fr max-content;
	grid-auto-rows: auto;
}

.ruled-list li.item-schedule {
	padding:0;
}

.item-schedule {
	position:relative;
	z-index:1;
	cursor:pointer;
	font-size:var(--SbuttonFONTsize);
	color:var(--primarydarkcolor);
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.item-schedule input.renamable-db {
	line-height:16px;
	padding:calc(var(--basespacing)*0.4) 0;
	color:var(--primarydarkcolor);
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.item-schedule[disabled] {opacity:1;}

.item-schedule:after {
	content:"keyboard_arrow_right";
	position:absolute;
	height:auto;width:auto;
	right:0;
	display:block;
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
        	font-size:18px;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

.item-schedule:before {
	content:"";
	position:absolute;
	z-index:-1;
	width:calc(100% + calc(var(--basepadding)*4));
	height:100%;
	left:50%;top:0;bottom:0;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	background:var(--gray6);
	opacity:0;
}

.item-schedule:hover:before {
	opacity:1;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

.item-schedule.pre-selected:after {
	animation: preSelected 0.5s linear;
	-webkit-animation: preSelected 0.5s linear;
}

@keyframes preSelected {
    0% { color:inherit; transform:translate(0%,-50%); opacity:1; }
    49% { color:white; transform:translate(50%,-50%); opacity:0; }
    50% { color:white; transform:translate(-50%,-50%); opacity:0; }
    100% { color:white; transform:translate(0%,-50%); opacity:1; }
}

.item-schedule.selected, .item-schedule.selected input.renamable-db {
	color:white;
}

.item-schedule.selected:before {
	opacity:1;
	background:var(--secondarycolor);
}

.item-schedule .actions button {
	background:var(--secondarycolor);
	color:white;
	opacity:0;
	transform:scale(0);
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	-ms-transform:scale(0);
	-o-transform:scale(0);
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.item-schedule:hover .actions button {
	opacity:1;
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
}


/* // List Schedules */

/* Schedule Content */

.schedule-to-terminal-action {
	position:relative;
}

.schedule-to-terminal-action .inline-empty, .schedule-to-terminal-action .associated-schedule-number-wrapper {
	display:none;	
}

.schedule-to-terminal-action[data-toggle="dropdown"] .dropdown-menu {
	/* overflow:hidden;
	width:auto;
	min-width:250px;
	max-width:none;
	max-height:none;
	padding-bottom:0;
	padding-top:0; */

	/* min-width:250px; */
	/* min-width:480px; */
	min-width:800px;
}

.schedule-to-terminal-action[data-toggle="dropdown"] .dropdown-menu #scheduleTerminals {
	/* box-sizing:content-box;
	width:100%;
	max-width:220px;
	max-height:200px;
	overflow-y:auto;
	padding-top:calc(var(--basepadding)*4); */
	/* max-width:480px;
	max-height:315px; */
	max-width:800px;
	max-height:min(800px, 65vh);
	padding-bottom:calc(var(--basepadding)*5);
	padding-top:88px;
}


/* #scheduleTerminals::-webkit-scrollbar { width: 0 !important }
#scheduleTerminals { overflow: -moz-scrollbars-none; }
#scheduleTerminals { -ms-overflow-style: none; } */

.special-dropdown-footer, .special-dropdown-title {
	display:grid;
	width:100%;
	line-height:1;
	position:absolute;
	right:0;left:0;
	margin:0;
}

.special-dropdown-title {
	top:0;
	justify-content:start;
	padding:calc(var(--basespacing)*2) calc(var(--basepadding)*1.75) calc(var(--basespacing)*3) calc(var(--basepadding)*1.75);/* Same as padding-right from box */
	background: -moz-linear-gradient(top, rgba(53,68,76,1) 0%, rgba(53,68,76,1) 75%, rgba(53,68,76,0) 98%, rgba(53,68,76,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(53,68,76,1) 0%,rgba(53,68,76,1) 75%,rgba(53,68,76,0) 98%,rgba(53,68,76,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(53,68,76,1) 0%,rgba(53,68,76,1) 75%,rgba(53,68,76,0) 98%,rgba(53,68,76,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#35444c', endColorstr='#0035444c',GradientType=0 ); /* IE6-9 */
}
.special-dropdown-footer {
	bottom:0;
	justify-content:end;
	padding:calc(var(--basespacing)*3) calc(var(--basepadding)*1.75) calc(var(--basespacing)*2) calc(var(--basepadding)*1.75);/* Same as padding-right from box */
	background: -moz-linear-gradient(top, rgba(53,68,76,0) 0%, rgba(53,68,76,0) 2%, rgba(53,68,76,1) 55%, rgba(53,68,76,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(53,68,76,0) 0%,rgba(53,68,76,0) 2%,rgba(53,68,76,1) 55%,rgba(53,68,76,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(53,68,76,0) 0%,rgba(53,68,76,0) 2%,rgba(53,68,76,1) 55%,rgba(53,68,76,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0035444c', endColorstr='#35444c',GradientType=0 ); /* IE6-9 */
}

#schedule-to-terminal-submit {
	margin-left:auto;
	/*
	margin-top:calc(var(--basespacing)*2);
	justify-self:end;
	*/
}


#ScheduleContentCard #scheduleContentDiv { /* Calendar and playlists wrappers layout */
	/*display:grid;
	grid-column: 2;
	grid-template-rows: max-content 1fr;
	grid-template-areas:
	"contentheader"
	"content";
	grid-row-gap: var(--pagepadding);*/

	/* display:grid;
	grid-template-columns: 230px 1fr;
	grid-column-gap: calc(var(--basepadding)*2); */
	position:relative;
	width:100%;
	height:100%;
}

.schedule-to-terminal-action .special-dropdown-title {
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:10px;
}
.schedule-to-terminal-action .special-dropdown-title button {
	align-self:flex-end;
}

.schedule-to-terminal-action .special-dropdown-title button {
	color:white;
}




#calendar-view, #editing-view {
	position:absolute;
	display:none;
	width:100%;
	min-height:100%;
	height:auto;
	opacity:0;
}

#editing-view {
	padding-bottom: calc(var(--basepadding)*2); /* Allow same spacing as box-body for dropzone */
}

#calendar-view.active, #editing-view.active {
	opacity:1;
	display:block;
}


#calendar {display:block;}
#calendar.hide {display:none;}
.fc-time-grid .fc-slats .fc-minor td {border:none}
/* .fc-time-grid .fc-slats .fc-minor td {border:none;display:none} */
.fc td.fc-today {border:none;}
.fc-time-grid-container {overflow:visible!important;transform:translateY(-7px);border-top:1px solid var(--gray7);}
.fc-day-grid .fc-axis  {display:none}
.fc-event .fc-bg {display:none;}

.configureSchedule {
	display:grid;
	grid-template-columns: 1fr max-content max-content max-content;
	grid-gap:calc(var(--basespacing)*0.5);
	justify-items: end;
	align-items: center;
}

#schedule-actions {
	display:grid;
	grid-template-columns: max-content 1fr;
	align-items:center;
}

#schedule-actions button:last-child {
	justify-self:end;
}

/* Calendar header -- Day/Month/Wekk/Agenda/Title/Prev/Next */

.fc-basic-view .fc-body .fc-row {
	height:0;
	min-height:0;
	padding-bottom:16.66%
}

.fc-toolbar.fc-header-toolbar { /* calendar header */
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-items: center;

	padding:var(--basepadding);
	border-radius:var(--rounded);
	background:var(--gray6);
}

.fc-toolbar .fc-left { /* Today + Month/Week/Dat wrapper */
	/* display:grid;
	grid-template-columns:1fr max-content;
	width:100%; */
	display:flex;
	float:none;
}

.fc-toolbar .fc-center { /* Today + Month/Week/Dat wrapper */
	/* display:grid;
	grid-template-columns:1fr max-content;
	width:100%; */
	display:flex;
	justify-content:center;
}

.fc-toolbar .fc-right { /* Month/Week/Dat wrapper */
	display:flex;
	justify-content:flex-end;
	float:none;
	order:3;
}

.fc-toolbar .fc-right .btn-group { /* Month/Week/Dat wrapper */
	display:flex;
	flex-direction:row;
	justify-content:center;
	align-items:flex-end;
	border:1px solid var(--gray7);
	padding:0;
	margin:0;
	border-radius:var(--rounded);
}

.fc-toolbar .fc-left .btn-group { /* Month/Week/Dat group style */
	display:none;
	/* border:1px solid var(--gray7);
	padding:0;
	margin:0;
	border-radius:var(--rounded); */
}

.fc-toolbar .fc-left .btn-group button, .fc-toolbar .fc-right .btn-group button { /* Month/Week/Dat single button style */
	border-left:1px solid var(--gray7);
	padding:calc(var(--basespacing)*0.5) calc(var(--basespacing)*1);
	line-height:1;
	border-radius:0;
	font-size:var(--XSbuttonFONTsize);
}

.fc button.fc-today-button {
	justify-self:start;
	/* border:1px solid var(--gray4); */
	padding:0 calc(var(--basespacing)*2);
	/* line-height:1; */
	border-radius:var(--rounded);
	font-size:var(--XSbuttonFONTsize);
}

.fc-toolbar .fc-left .btn-group button:first-child,
.fc-toolbar .fc-right .btn-group button:first-child { /* Month/Week/Dat single button style */
	border-left:none;
	padding-left:calc(var(--basespacing)*1.5);
	border-top-left-radius:var(--rounded);
	border-bottom-left-radius:var(--rounded);
}

.fc-toolbar .fc-left .btn-group button:last-child,
.fc-toolbar .fc-right .btn-group button:last-child { /* Month/Week/Dat single button style */
	border-right:none;
	padding-right:calc(var(--basespacing)*1.5);
	border-top-right-radius:var(--rounded);
	border-bottom-right-radius:var(--rounded);
}

.fc-toolbar .fc-left .btn-group button.active, .fc-toolbar .fc-left .btn-group button:hover,
.fc-toolbar .fc-right .btn-group button.active, .fc-toolbar .fc-right .btn-group button:hover {background:var(--gray6);}

.fc button {height:auto;padding:0;}

.fc-clear {display:none;} /* hide elements that do not matter or are not needed */
.fc-prev-button span {display:none;} /* hide the default prev btn */

.fc-toolbar .fc-center {width:100%;}

.fc-toolbar .fc-center div { /* Title + Prev & Next */
	/* width:100%; */
	display:grid;
	grid-template-columns:max-content max-content max-content;
	grid-gap: calc(var(--basespacing)*1.5);
	align-items:center;
	justify-items: center;
}

.fc button {line-height:1;height:auto;padding:0;}
.fc-toolbar button {
	height:var(--lineheightSM);
	background:white;
	box-shadow:var(--elementshadow);
}

button.fc-prev-button, button.fc-next-button {
	padding:0;
	width:var(--lineheightSM);
	height:var(--lineheightSM);
	border-radius:var(--lineheightSM);
	/* background:var(--gray6); */
	line-height:1;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

button.fc-prev-button {justify-self:start;}
button.fc-next-button {justify-self:end;}
.fc-prev-button:after {content:"keyboard_arrow_left";}
.fc-next-button:after {content:"keyboard_arrow_right";}

.fc-toolbar.fc-header-toolbar .fc-center h2 {
	font-size:16px;
	text-transform:uppercase;
}

/* // Calendar header */

.fc td, .fc th {border:none;}

.fc-view-container {
	display:grid;
	padding:calc(var(--basespacing)*2) calc(var(--basespacing)*0.5) calc(var(--basespacing)*1.5) calc(var(--basespacing)*0.5);
	/* border-radius:var(--roundcorner);
	box-shadow:0px 8px 30px rgba(0,0,0,0.1); */
}

table { border-collapse:collapse }
a {outline: 0;}
.fc-divider {display:none;}
.fc-row.table-bordered {margin:0;}

.fc button, .fc table, body .fc {
	font-size:10px;
}

.fc-day-header {text-transform:uppercase}

.custom-week-day-display {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	position:relative;
}

.custom-week-day-display:after {
	content:"";
	position:absolute;
	top:0;
	right:0;
	height:2050%;
	border-right:1px solid var(--gray7);
}

.custom-week-day-display span:nth-child(1) { /* Name of week day */
	font-size:10px;
	letter-spacing:1px;
	color:var(--gray2);
}

.custom-week-day-display span:nth-child(2) { /* Day */
	font-size:21px;
	margin-top:calc(var(--basespacing)*0.5);
}

.fc-ltr .fc-basic-view .fc-day-top .fc-day-number {float:none;}
.fc-row.fc-week .fc-content-skeleton {text-align:center;} /* Horizontally center day numbers on month view */
/*.fc-head-container .fc-row {margin-bottom:calc(var(--basespacing)*1.5)}  Space between days of the week and grid on month view */

.fc-day-top.fc-today.alert.alert-info {
	position:relative;
	display:inline-block;
	z-index:1;
}

.fc-day-top.fc-today.alert.alert-info:before { /* "Today" number look */
	content:"";
	position:absolute;
	right:50%;
	top:50%;
	z-index:-1;
	width:100%;
	height:0;
	padding-bottom:100%;
	transform:translate(49%,-56%) scale(1.5);
	-webkit-transform:translate(49%,-56%) scale(1.5);
	-moz-transform:translate(49%,-56%) scale(1.5);
	-ms-transform:translate(49%,-56%) scale(1.5);
	-o-transform:translate(49%,-56%) scale(1.5);
	background:var(--primaryaccentcolor);
	border-radius:var(--rounded);
}



.fc-slats tr { /* Week list look */
	border:none;
	border-bottom:1px solid var(--gray7);
}

.fc-time-grid .fc-slats td {
	height:auto;
}

.fc-time-grid .fc-slats td.fc-axis.fc-time {
	width:auto;
	height:17px; /* Match height for half an hour and full hour */
	text-align:center;
	font-size:12px;
	padding-top:0;
	padding-bottom:0;
	padding-right:0;
	padding-left:0;
	text-align:left;
	background:white;
	transform:translateY(-50%);
	position:relative;
}

.fc-time-grid .fc-slats td.fc-axis.fc-time:after {
	content:"";
	position:absolute;
	height:180%;
	right:0;
	top:0;bottom:0;
	border-right:1px solid var(--gray7);
	transform:translateX(10px);
}

/*
.fc-event-container {
	display:grid;
	justify-content:center;
	width:auto;
}
*/

.fc-event-container {position:relative;}

.fc-event-container .fc-day-grid-event.fc-h-event { /* Playlist on month list look */
	width:2px;
	height:4px;
	border-radius:4px;
	margin:0 auto;

}

.fc-content-skeleton tbody tr {
	transform:translateY(50%);
	-webkit-transform:translateY(50%);
	-moz-transform:translateY(50%);
	-ms-transform:translateY(50%);
	-o-transform:translateY(50%);
}

.fc-content-skeleton tbody tr:first-child {
	transform:translateY(100%);
	-webkit-transform:translateY(100%);
	-moz-transform:translateY(100%);
	-ms-transform:translateY(100%);
	-o-transform:translateY(100%);
}
/*
.fc-content-skeleton tbody tr:nth-child(2) .fc-day-grid-event.fc-h-event {left:20%;}
*/

.fc-event-container .fc-day-grid-event.fc-h-event .fc-content { /* Playlist name on month list look */
	display:none;
}

/* .fc-event {
	cursor:default;
} */

.fc-time-grid-event .fc-content { /* Playlist Content in Calendar */
	font-size:13px;
	color:black;
	padding:var(--basespacing);
	display:flex;
	flex-direction:column-reverse;
}

.fc-time-grid-event .fc-content button {
	border:1px solid black;
	margin-bottom:calc(var(--basespacing)*0.5);
}

.fc-time-grid-event:hover button {
	background:white;
}

.fc-time-grid-event .fc-content i {
	position:relative;
	z-index:1;
}

/* .fc-time-grid-event .fc-content i:before {
	content:"";
	position:absolute;
	z-index:-1;
	top:50%;
	transform:translateY(-50%);
	left:7px;
	width:6px;
	height:12px;
	background:white;
} */

.fc-time-grid-event .fc-content .fc-time { /* Playlist Content in Calendar */
	white-space:normal;
}

.fc-time-grid-event .fc-content .fc-title { /* Playlist Content in Calendar */
	font-weight:bold;
}

/* Scheduled Playlists */

.item-schedule-playlist {
	border:none!important;
	padding:var(--basespacing) 0 calc(var(--basespacing)*2) var(--basespacing);
	margin-bottom:calc(var(--basespacing)*0.5);
	border-bottom:1px solid var(--gray5)!important;
}

.item-schedule-playlist:first-child {
	border-top:1px solid var(--gray5)!important;
}

.item-schedule-playlist div {padding:0;}

.schedule-playlist-name .name {
 	font-size:18px;
 	line-height:1;
 }

.schedule-playlist-name {
	display:flex;
	align-items:center;
}

.schedule-playlist-name button {
	line-height:1;
	padding:0;
	border:none;
	border-radius:0;
	margin-left:3px;
	margin-top:0;
}

.schedule-playlist-name button i {
	margin-top:0;
	font-size:14px;
	color:var(--secondarycolor);
}

.schedule-playlist-color {
	width:12px;
	height:12px;
	border-radius:var(--rounded);
	opacity:0;
		transition:all 0.3s var(--normal-easing);
		-webkit-transition:all 0.3s var(--normal-easing);
		-moz-transition:all 0.3s var(--normal-easing);
		-ms-transition:all 0.3s var(--normal-easing);
		-o-transition:all 0.3s var(--normal-easing);
}

.item-schedule-playlist .actions button {
	background:var(--secondarycolor);
	color:white;
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.item-schedule-playlist .actions button:last-child {
	background:white;
	color:var(--secondarycolor);
	border:1px solid var(--secondarycolor);
}

.item-schedule-playlist {
	position:relative;
	display:grid;
	grid-template-columns:16px 1fr;
	grid-template-rows: max-content max-content;
	grid-template-areas:
	"color maininfo"
	". propertiesinfo";
	grid-row-gap: calc(var(--basespacing)*1.5);
	grid-column-gap: calc(var(--basespacing)*1);
	align-items:center;
	justify-content:left;
}

.schedule-playlist-maininfo {
	grid-area:maininfo;
	display:grid;
	grid-template-columns:max-content 1fr max-content;
	grid-column-gap: calc(var(--basespacing)*1);
	align-items:center;
}

.schedule-playlist-propertiesinfo {
	z-index:1;
	grid-area:propertiesinfo;
	display:grid;
	grid-template-columns:max-content max-content 1fr;
	grid-column-gap: calc(var(--basespacing)*1);
	align-items:center;
}

.schedule-playlist-color {grid-area:color;justify-self:center;}
.schedule-playlist-name {min-width:237px}
.schedule-playlist-propertiesinfo > div:nth-child(1) {min-width:237px}

.item-schedule-playlist .actions {z-index:2; /* Above expired layer */}
.item-schedule-playlist:hover .expired-overlay {
	display:none;
}












.item-schedule-playlist .fieldset-complex input {
	font-size:14px;
	font-weight:400;
	opacity:1;
	color:black!important;
}

.item-schedule-playlist .confwrapper .confdetails label {
	font-size:var(--XXSbuttonFONTsize);
	color:var(--gray3);
	opacity:1;
}

.item-schedule-playlist .fieldset-complex:before {display:none}

.item-schedule-playlist .fieldset-complex input[name="datepicker"] {
	width:90px;
}

.schedule-playlist-days {
	margin-left:auto;
}




.item-schedule-playlist .conftitle,
.item-schedule-playlist .confdetails label {
	font-size:var(--XXSbuttonFONTsize);
	color:var(--gray3);
	letter-spacing:1px;
	text-transform:uppercase;
}

.item-schedule-playlist .confDate,
.item-schedule-playlist .confHours {
	grid-template-rows:max-content;
	position:relative;
}

.item-schedule-playlist .confDate,
.item-schedule-playlist .confHours {grid-template-columns:repeat(2,max-content);}

.item-schedule-playlist .confHours input[name="timepicker"] {
	display:block;
}

.item-schedule-playlist .confHours .conf-content[data-expiration="true"] .fieldset-complex:first-child {margin-right:calc(var(--basespacing)*1);}
.item-schedule-playlist .confDate .conf-content[data-expiration="true"] .fieldset-complex:first-child {margin-right:calc(var(--basespacing)*0.5);}

.item-schedule-playlist .confHours .conf-content {
	width:125px; /* So they align when others are showing "Playing all day" */
}

.item-schedule-playlist .conf-content-container {
	display:flex;
	align-items:center;
}

.item-schedule-playlist .confwrapper[data-expiration="false"] .conf-content[data-expiration="true"],
.item-schedule-playlist .confwrapper[data-expiration="true"] .conf-content[data-expiration="false"],
.item-schedule-playlist .confwrapper[data-expiration="true"] svg[data-expiration="false"],
.item-schedule-playlist .confwrapper[data-expiration="false"] svg[data-expiration="true"] {display:none}

.item-schedule-playlist .confwrapper[data-expiration="true"] .conf-content[data-expiration="true"],
.item-schedule-playlist .confwrapper[data-expiration="false"] .conf-content[data-expiration="false"],
.item-schedule-playlist .confwrapper[data-expiration="true"] svg[data-expiration="true"],
.item-schedule-playlist .confwrapper[data-expiration="false"] svg[data-expiration="false"] {display:flex}

.item-schedule-playlist .confwrapper[data-expiration="false"] .conf-content-container:hover .conf-content[data-expiration="false"] {display:none}
.item-schedule-playlist .confwrapper[data-expiration="false"] .conf-content-container:hover .conf-content[data-expiration="true"] {display:flex}


.item-schedule-playlist .confHours .conf-content input[name="timepickerplaceholder"] {
	width:57px;
	font-size:0.72rem;
	opacity:1;
}
.item-schedule-playlist .confHours[data-expiration="true"] .conf-content input[name="timepickerplaceholder"] {display:none}

.item-schedule-playlist .confHours[data-expiration="false"]:not(.active) .conf-content-container:hover .conf-content input:not([name="timepickerplaceholder"]) {display:none}
.item-schedule-playlist .confHours[data-expiration="false"]:not(.active) .conf-content-container:hover .conf-content input[name="timepickerplaceholder"] {display:block}


/* .item-schedule-playlist .confHours[data-expiration="true"] input[name="timepicker"] {display:block}
.item-schedule-playlist .confHours[data-expiration="false"] .confHours-timebar-container:first-child {display:none}
.item-schedule-playlist .confHours[data-expiration="false"] .fieldset-inline {margin-left:10px;}
.item-schedule-playlist .confHours[data-expiration="false"] .fieldset-inline .confHours-timebar-container {width:116px;} */

/* .conftitle .custom-icon {margin-right:var(--basespacing)} */

.item-schedule-playlist .conf-icon-container svg {height:33px}
.item-schedule-playlist .conf-icon-container .custom-icon[data-expiration="false"] {
	stroke:var(--gray4);
}

.item-schedule-playlist .conf-icon-container .custom-icon[data-expiration="true"] {
	stroke:var(--primarydarkcolor);
}

.item-schedule-playlist .conf-icon-container {position:relative}
.item-schedule-playlist .conf-icon-container button {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:18px;
	height:18px;
	display:none;
	background:var(--primaryaccentcolor);
	color:var(--primarydarkcolor);
}

.item-schedule-playlist .confwrapper[data-expiration="true"] .conf-icon-container {cursor:pointer}
.item-schedule-playlist .confwrapper[data-expiration="true"] .conf-icon-container:hover button {display:block;}
.item-schedule-playlist .confwrapper[data-expiration="true"] .conf-icon-container:hover svg {opacity:0.5}


.item-schedule-playlist .conf-content[data-expiration="false"] label {
	text-transform:initial;
	letter-spacing:0;
	font-size:15px;
	color:var(--gray4);
}

.item-schedule-playlist .confHours.active input[name="timepickerplaceholder"] {display:none;}
.item-schedule-playlist .confHours.active input[name="timepicker"] {display:block;}

.item-schedule-playlist .confHours.active .conf-content[data-expiration="false"] {display:none}
.item-schedule-playlist .confHours.active .conf-content[data-expiration="true"] {display:flex}






.item-schedule-playlist .confHours-timebar-container {
	content:"";
	position:absolute;
	top:100%;
	width:100%;
	height:6px;
	background:#eeeeee;
	border-radius:var(--rounded);
	overflow:hidden;
	grid-column:2/4;
}

.item-schedule-playlist .confHours-timebar {
	position:absolute;
	height:100%;
	width:0;
	top:0;bottom:0;
	background:var(--primaryaccentcolor);
}

.item-schedule-playlist .confHours[data-expiration="false"] .confHours-timebar {
	width:100%;
	left:0;right:0;
}


.item-schedule-playlist .confWeekRepeat {
	justify-self:end;
}

.item-schedule-playlist .confWeekRepeat .conftitle {
	text-align:left;
	margin-bottom:calc(var(--basespacing)*0.3);
}

















/* Terminals dropdown in Send Schedule to Screen Dropdown */

.schedule-to-terminal-info {
	color:var(--gray3);
}

.item-schedule-terminal.dropdown-item {
	display:grid;
	grid-template-columns:15px 1fr;
	grid-gap:calc(var(--basespacing)*0.75);
	align-items:center;
	/* min-width:200px; */
}

.schedule-to-terminal-action .dropdown-title,
.schedule-to-terminal-action .close-dropdown {
	z-index:2;
}

.schedule-to-terminal-action .dropdown-title .input-wrapper {
	flex:1;
}

.schedule-to-terminal-action .dropdown-title button {align-self:unset}

.send-to-screen-actions {
	width:100%;
	display:flex;
	flex-direction:row;
	align-items:center;
	gap:10px;
}

#searchTerminalInModal {
	background:rgba(0,0,0,0.2);
	color:white;
}

#scheduleTerminals .ungroupped-terminals {
	margin-top:0;
}

#scheduleTerminals .terminal-group li.item-group {
	border-bottom:1px solid var(--gray3);
	color:white;
	display:grid;
	grid-template-columns:max-content 1fr max-content max-content;
	align-items:center;
}

#scheduleTerminals .terminal-group li.item-group .group-content,
#scheduleTerminals .terminal-group li.item-group .terminalgroupname {
	height:auto;
}

#scheduleTerminals .terminal-group li.item-group .group-content {
	max-width:none;
}

#scheduleTerminals .terminal-group li.item-group button {
	border:none;
}

#scheduleTerminals .terminal-group li.item-group button i {
	margin:0;
}

#scheduleTerminals .empty-terminal-group, .empty-ungroupped-terminals {
	border-bottom:1px solid var(--gray3);
}

#scheduleTerminals .item-group:before,
#scheduleTerminals .item-terminal:before,
#scheduleTerminals .empty-terminal-group:before,
#scheduleTerminals .empty-ungroupped-terminals:before {
	background:rgba(0,0,0,0.3);
}

.ungroupped-terminals .ungroupped-text {
	display:block;
	margin-bottom:calc(var(--basespacing)*0.5);
}

.ungroupped-terminals .item-terminal .btn-ungroup {
	display:none
}

.ungroupped-terminals .item-schedule-terminal.dropdown-item:first-of-type {
	border-top:1px solid var(--gray3);
}

#scheduleTerminals:not(.ungroupped-only) .terminal-group:first-child {
	border-top:1px solid var(--gray3);
}

#scheduleTerminals:not(.ungroupped-only) .ungroupped-terminals {
	margin-top:calc(var(--basespacing)*4);
}

#scheduleTerminals .empty-terminal-group, #scheduleTerminals .empty-ungroupped-terminals {
	display:none;
	border-bottom:1px solid var(--gray3);
}

#scheduleTerminals .empty-ungroupped-terminals {
	border-top:1px solid var(--gray3);
}

.item-schedule-terminal .terminal-status, .terminal-info.terminal-status {
	width:auto;height:auto;
	border-radius:var(--rounded);
	justify-self:center;
}

.item-schedule-terminal[data-status="on"] .terminal-status, .terminal-info[data-status="on"] .terminal-status {width:6px;height:6px;background:var(--green);}
/* .item-schedule-terminal[data-status="pend"] .terminal-status {color:var(--gray4);} */
.item-schedule-terminal[data-status="pend"] .terminal-status, .terminal-info[data-status="pend"] .terminal-status {color:var(--yellow);}
.item-schedule-terminal[data-status="off"] .terminal-status, .terminal-info[data-status="off"] .terminal-status {color:var(--red);}

.item-schedule-terminal[data-status="off"] .terminal-status i, .item-schedule-terminal[data-status="pend"] .terminal-status i, .terminal-info .terminal-status i {font-size:15px;}

.item-schedule-terminal .terminal-status {
	justify-self:center;
}

.terminal-info-wrapper.terminal-status-container {
	display:flex;
	flex-direction:row;
}

.terminal-info-wrapper.terminal-status-container .terminal-info {
	display:flex;
	flex-direction:row;
	align-items:center;
}

.terminal-info .terminal-status {
	margin-left:calc(var(--basespacing)*0.5);
	margin-right:calc(var(--basespacing)*0.5);
}

.terminal-info[data-status="on"] .terminal-status {
	transform:translateY(1px);
}

.schedule-terminal-label {
	max-width:100%;
}

.dropdown-item label.schedule-terminal-label {
	font-size:var(--MXSbuttonFONTsize); /* 13px */
}

.schedule-terminal-label span {
	display:block;
}

.btn-select-group {
	justify-self:flex-end;
	margin-left:calc(var(--basepadding)*1.5);
	padding:0 calc(var(--basespacing)*0.8) 0 calc(var(--basespacing)*0.8)
}





.item-playlist-file-overlay, .expired-overlay {
	position:absolute;
	z-index:2;
	width:100%;
	height:100%;
	top:0;right:0;bottom:0;left:0;
	background:rgba(255,255,255,0.85);
}

.expired-content, .scheduledfuture-content {
	position:absolute;
	width:100%;
	height:auto;
	left:0;right:0;
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
	display:grid;
	grid-template-columns:1fr;
	grid-gap:calc(var(--basespacing)*0.5);
	align-items:center;
	justify-items:center;
	justify-content:center;
}

.expired-content {grid-template-rows:repeat(2,max-content);}
.scheduledfuture-content {
	display:flex;
	flex-direction:row;
}

.scheduledfuture-content i {
	margin-right:calc(var(--basespacing)*0.5);
}

.expired-content i {
	margin:0;
	color:var(--gray2);
}

.scheduledfuture-content i {
	font-size:var(--XSbuttonFONTsize);
}

.expired-content span, .scheduledfuture-content span {
	font-size:var(--SbuttonFONTsize);
	text-transform:uppercase;
	letter-spacing:1px;
	color:black;
}

.scheduledfuture-content span span {
	color:var(--secondarycolor);
}

.expired-content span {font-size:var(--SbuttonFONTsize);}
.scheduledfuture-content span {font-size:var(--XXSbuttonFONTsize);}

.item-playlist-file .expired-content {
	grid-gap:calc(var(--basespacing)*0.1);
}

.item-playlist-file .expired-content i {
	font-size:var(--buttonFONTsize);
}

.item-playlist-file .expired-content span {
	font-size:10px;
}


/* Scheduled Playlists */



/* // Schedule Content */

/* Playlist Library Card */

.card-actions#playlistLibraryControls {
	display:grid;
	grid-template-columns: 1fr;
	grid-auto-rows: auto;
}

#PlaylistsLibraryCard #playlistListDiv #loadPlaylists {
	padding-top:3px;
}

.ui-draggable.item-playlist {
	border:none!important;
	cursor:grab;
	padding:var(--basespacing) var(--basespacing);
	margin-bottom:calc(var(--basespacing)*0.5);
	box-shadow:var(--elementshadow);
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

.ui-draggable.item-playlist .playlist-content {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	margin-right:var(--basespacing);
	padding-right:0;
}

.ui-draggable.item-playlist.selected {color:var(--primarydarkcolor);} /* Make sure in case it is somehow selected, style maintains */

.ui-draggable.item-playlist:hover {
	box-shadow:var(--elementshadowhover);
	transform:scale(1.02);
	-webkit-transform:scale(1.02);
	-moz-transform:scale(1.0.2);
	-ms-transform:scale(1.02);
	-o-transform:scale(1.02);
}

.ui-draggable.item-playlist:after {
	content:"";
	display:none;
}

.ui-draggable.item-playlist:before {
	display:none;
}

.ui-draggable.item-playlist .elementName {
	padding:calc(var(--basespacing)*0.85) 0;
	color:var(--primarydarkcolor);
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

.ui-draggable.item-playlist[data-type="subuser"] .playlist-content > i {
	position:relative;
	right:0;
	transform:unset;
	font-size:12px;
	margin-top:0;
}

/* Playlist File Expiration Modal */

#modal-playlistfileproperties .modal-subtitle, #modal-playlistproperties .modal-subtitle {
	opacity:1;
		transition:all 0.25s var(--normal-easing);
		-webkit-transition:all 0.25s var(--normal-easing);
		-moz-transition:all 0.25s var(--normal-easing);
		-ms-transition:all 0.25s var(--normal-easing);
		-o-transition:all 0.25s var(--normal-easing);
}

#modal-playlistfileproperties .modal-subtitle.inactive,
#modal-playlistfileproperties .standard-modal-content.inactive,
#modal-playlistproperties .modal-subtitle.inactive,
#modal-playlistproperties .standard-modal-content.inactive {
	opacity:0;
}

#modal-playlistfileproperties .standard-modal-content .confWeekRepeat,
#modal-playlistproperties .standard-modal-content .confWeekRepeat {
	margin-top:calc(var(--basepadding)*3);
}

#modal-playlistfileproperties .timedetails,
#modal-playlistproperties .timedetails {width:150px} /* So no snaps happen */
#modal-playlistfileproperties input[name="timepicker"],
#modal-playlistproperties input[name="timepicker"] {height:22px;}

.file-advanced-settings .confcontainer {
	margin-top:calc(var(--basepadding)*2);
}

.confcontainer {
	display:grid;
	grid-template-columns:1fr max-content;
	grid-gap:var(--basespacing);
}

.confHours, .confDate {
	display:grid;
	grid-template-rows:repeat(3, max-content);
	grid-gap:var(--basespacing);
}

.confHours {justify-self:flex-end}
.confDate {justify-self:flex-start}

.fieldset-inline {
	display:grid;
	grid-template-columns:75px 1fr;
	align-items:center;
}

.fieldset-inline.disabled {
	opacity:0.5;
}

.fieldset-complex {
	position:relative;
	padding:calc(var(--basepadding)*0.7) calc(var(--basepadding)*1.7) calc(var(--basepadding)*0.6) calc(var(--basepadding)*1.7);
	display:flex;
	flex-direction:column;
	cursor:pointer;
	background:transparent;
}

.fieldset-complex.has-icon {
	display:grid;
	grid-template-columns:max-content 1fr;
	grid-template-rows: max-content max-content;
	grid-gap:0;
	padding-bottom:calc(var(--basepadding)*0.7);
}

.fieldset-complex.has-icon svg {
	grid-row:span 2;
	align-self:center;
	height:35px;
	width:auto;
	margin-right:var(--basepadding);
}

.fieldset-complex:before {
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	top:0;right:0;bottom:0;left:0;
	border-radius:var(--rounded);
	background:var(--gray6);
	z-index:-1;
}

.fieldset-complex label {
	font-size:var(--XXSbuttonFONTsize);
	color:var(--gray3);
	letter-spacing:1px;
	text-transform:uppercase;
	cursor:pointer;
}

.fieldset-complex input {
	line-height:1;
	width:auto;
	font-size:17px;
	border:none;
	background:transparent;
	padding:0;
	margin:0;
	cursor:pointer!important;
}

.fieldset-complex input[placeholder] {color:var(--gray5);}
.fieldset-complex input::-webkit-input-placeholder {color:var(--gray5);}
.fieldset-complex input:-moz-placeholder {color:var(--gray5);}
.fieldset-complex input:-ms-input-placeholder {color:var(--gray5);}

.fieldset-complex input[name="datepicker"] {width:100px}
.fieldset-complex input[name="timepickerplaceholder"] {width:100px}

.file-basic-settings .fieldset-complex input {
	font-size:20px;
	width:100%;
	/* margin-top:calc(var(--basespacing)*0.2); */
}

.file-basic-settings .fieldset-complex button:last-child {
	opacity:0;
	position:absolute;
	top:50%;
	right:calc(var(--basespacing)*2);
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
}

.file-basic-settings .fieldset-complex button:last-child:hover {
	background:var(--primaryaccentcolor);
}

.file-basic-settings .fieldset-complex[data-expiration="true"] button:last-child {
	opacity:1;
}

.file-basic-settings .fieldset-complex[data-expiration="true"] svg[data-expiration="true"],
.file-basic-settings .fieldset-complex[data-expiration="false"] svg[data-expiration="false"] {display:block}
.file-basic-settings .fieldset-complex[data-expiration="true"] svg[data-expiration="false"],
.file-basic-settings .fieldset-complex[data-expiration="false"] svg[data-expiration="true"] {display:none}

.file-advanced-settings, .file-basic-settings {opacity:0;}
.file-advanced-settings.active, .file-basic-settings.active {opacity:1}

.file-advanced-settings {display:none}

/* // Playlist File Expiration Modal */



.flatpickr-calendar.open {
	z-index:999999;
}






.daterangepicker {
	z-index:999999;
}

.daterangepicker td.disabled, .daterangepicker option.disabled {
	color:hsl(0, 0%, 90%);
	text-decoration:none;
	cursor:default;
}

.daterangepicker .drp-buttons .btn {
	padding:0 calc(var(--basespacing)*1.2) 0 calc(var(--basespacing)*1.2);
	font-size:inherit;
	font-weight:inherit;
}

.daterangepicker .drp-buttons {
	position:relative;
	padding:var(--basepadding);
	margin-top:var(--basepadding);
	border-top:none;
}

.daterangepicker .drp-buttons:before {
	content:"";
	position:absolute;
	left:50%;
	transform:translate(-50%,-15px);
	width:calc(100% - calc(var(--basepadding)*2));
	border-top:1px solid var(--gray7);
}

.daterangepicker .drp-calendar.left {padding:var(--basepadding);padding-right:0;}
.daterangepicker .drp-calendar.right {padding:var(--basepadding);}

.daterangepicker td.in-range {
	background:var(--gray7);
}

.daterangepicker td.off:not(.disabled),
.daterangepicker td.off.ends {
	opacity:1;
	cursor:default;
	visibility:hidden;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
	background:var(--primaryaccentcolor);
	color:#000000;
}

.daterangepicker td.start-date {border-radius:var(--rounded) 0 0 var(--rounded);}
.daterangepicker td.end-date {border-radius:0 var(--rounded) var(--rounded) 0;}
.daterangepicker td.start-date.end-date {border-radius:var(--rounded);}

.daterangepicker .btn.hidden {display:none}







input[name="datepicker"], input[name="timepicker"] {
	color:var(--primarydarkcolor)!important; /* Override placheolder for read-only */
}


.ui-spinner a {display:none}

.timepicker-dialog {
	display:none;
	position:absolute;
	z-index:1;
	top:100%;
	left:calc(var(--basepadding)*1.7);
	background:white;
	border-radius:var(--Sroundcornder);
	padding:var(--basepadding);
	border:1px solid #ddd;
}

.timepicker-dialog:before,
.timepicker-dialog:after {
	content:"";
	position:absolute;
	display:inline-block;
	border-bottom-color:rgba(0, 0, 0, 0.2);
}

.timepicker-dialog:after {
	top:-6px;
	left:10px;
	border-right:6px solid transparent;
	border-bottom:6px solid #fff;
	border-left:6px solid transparent;
}

.timepicker-dialog:before {
	top:-7px;
	left:9px;
	border-right:7px solid transparent;
	border-left:7px solid transparent;
	border-bottom:7px solid #ccc;
}

.fieldset-complex .timepicker-dialog input[name="timepicker"] {
	opacity:1!important;
	width:81px;
}



/* Scheduled Playlist Modal */


/* Being used while the modal is not editable */
#modal-playlistproperties .fieldset-complex {cursor:default}
#modal-playlistproperties .fieldset-complex label {cursor:default}
#modal-playlistproperties .fieldset-complex input {cursor:default!important}
#modal-playlistproperties [type="checkbox"]:not(:checked) + label, #modal-playlistproperties [type="checkbox"]:checked + label {cursor:default}
#modal-playlistproperties [type="checkbox"]:checked + label {border:1px solid var(--gray5)}
#modal-playlistproperties .confwrapper.active .fieldset-complex:before {background:transparent;border:1px solid var(--gray5)}
/* */

#modal-playlistproperties .confWeekRepeat {grid-column:span 2}
#modal-playlistproperties .confHours,
#modal-playlistproperties .confDate {
	width:100%;
}


#modal-playlistfileproperties .datedetails,
#modal-playlistproperties .datedetails {
	text-transform:uppercase;
}

.conftitle {
	line-height:1;
	display:grid;
	grid-template-columns:max-content 1fr;
	align-items:center;
	grid-gap:calc(var(--basepadding)*0.5);
}

.confwrapper[data-expiration="true"] .conftitle[data-expiration="true"],
.confwrapper[data-expiration="false"] .conftitle[data-expiration="false"] {display:grid;}

.confwrapper[data-expiration="false"] .conftitle[data-expiration="true"],
.confwrapper[data-expiration="true"] .conftitle[data-expiration="false"] {display:none;}

.confwrapper .confdetails:before,
.confwrapper .confdetails label,
.confwrapper .confdetails input {
	opacity:0.5;
}

.confwrapper.active .confdetails:before,
.confwrapper.active .confdetails label,
.confwrapper.active .confdetails input {
	opacity:1;
}

.confHours input[name="timepicker"],
.confHours.active input[name="timepickerplaceholder"] {
	display:none;
}

.confHours.active input[name="timepicker"],
.confHours input[name="timepickerplaceholder"] {
	display:block;
}

/* .timedetails #startTime,
.timedetails #endTime,
.timedetails.active #startTimePlaceholder,
.timedetails.active #endTimePlaceholder {
	display:none;
}

.timedetails.active #startTime,
.timedetails.active #endTime,
.timedetails #startTimePlaceholder,
.timedetails #endTimePlaceholder {
	display:block;
} */

.conftitle .conftitle-text {
	display:grid;
	grid-template-columns:max-content max-content;
	align-items:center;
	grid-gap:calc(var(--basespacing)*0.7);
}

.conftitle .conftitle-text i {
	color:var(--gray4);
}

.conftitle svg {
	width:auto;
	height:40px;
}

.conftitle-container {
	position:relative;
	margin-bottom:calc(var(--basepadding)*1);
}

.conftitle-container .toggle-conftitle {
	position:absolute;
	top:0;right:0;bottom:0;left:0;
	width:100%;
	height:100%;
	background:rgba(255,255,255,0.5);
	display:flex;
	justify-content:center;
	align-items:center;
	opacity:0;
}

.confwrapper[data-expiration="false"] .conftitle-container .toggle-conftitle button {
	cursor:default;
}

.confwrapper[data-expiration="true"] .conftitle-container:hover .toggle-conftitle {
	opacity:1;
}

.conftitle-container .toggle-conftitle .btn-primary-cta:hover {
	background:var(--secondarycolor);
	border-color:var(--secondarycolor);
	color:#ffffff;
}

.conftitle .fieldset-inline {
	width:auto;
	justify-self:start;
	margin:0;
}

.conftitle .fieldset-inline {
	display:block;
}

.fieldset-inline label {
	display:inline-block;
	line-height:1;
	margin-right:calc(var(--basespacing)*0.5);
}


.toggle-checkbox[type="checkbox"]:not(:checked), .toggle-checkbox[type="checkbox"]:checked {
	position:relative;left:auto;margin:0;
}

.toggle-checkbox[type="checkbox"]:not(:checked), .toggle-checkbox[type="checkbox"]:checked {
	cursor:pointer!important;
	display:inline-block;
	height:var(--lineheightSM);
	width:calc(var(--lineheightSM)*2 - 6px);
	border-radius:var(--rounded);
	border:1px solid var(--gray4);
}

.toggle-checkbox:after {
	cursor:pointer;
	content:"";
	position:absolute;
	border-radius:var(--rounded);
	background:white;
	top:50%;
	left:0;
	transform:translate(0,-50%);
	-webkit-transform:translate(0,-50%);
	-moz-transform:translate(0,-50%);
	-ms-transform:translate(0,-50%);
	-o-transform:translate(0,-50%);
	box-shadow:1px 1px 6px rgba(0,0,0,0.1);
		height:calc(var(--lineheightSM) - 4px);
		width:calc(var(--lineheightSM) - 4px);
	transition:all 0.25s var(--normal-easing);
	-webkit-transition:all 0.25s var(--normal-easing);
	-moz-transition:all 0.25s var(--normal-easing);
	-ms-transition:all 0.25s var(--normal-easing);
	-o-transition:all 0.25s var(--normal-easing);
}

.toggle-checkbox[type="checkbox"]:not(:checked) {background:var(--gray7)!important;}
.toggle-checkbox[type="checkbox"]:checked {background:#4ed164!important;}

.toggle-checkbox[type="checkbox"]:checked:after {
	transform:translate(100%,-50%);
	-webkit-transform:translate(100%,-50%);
	-moz-transform:translate(100%,-50%);
	-ms-transform:translate(100%,-50%);
	-o-transform:translate(100%,-50%);
}
.toggle-checkbox[type="checkbox"]:not(:checked):after {
	transform:translate(0,-50%);
	-webkit-transform:translate(0,-50%);
	-moz-transform:translate(0,-50%);
	-ms-transform:translate(0,-50%);
	-o-transform:translate(0,-50%);
}

.toggle-checkbox.s[type="checkbox"]:not(:checked), .toggle-checkbox.s[type="checkbox"]:checked {
	height:var(--lineheightS);
	width:calc(var(--lineheightS)*2 - 6px);
	border:1px solid var(--gray4);
}

.toggle-checkbox.s:after {
	height:calc(var(--lineheightS) - 4px);
	width:calc(var(--lineheightS) - 4px);
}





[type="checkbox"].square-checkbox:not(:checked) + label,
[type="checkbox"].square-checkbox:checked + label {
	font-size:var(--XSbuttonFONTsize);
	border-radius:0;
	border:none;
	padding-left:calc(var(--basespacing)*1.75);
	color:var(--gray4);
}


/* checkbox aspect */
[type="checkbox"].square-checkbox:not(:checked) + label:before,
[type="checkbox"].square-checkbox:checked + label:before {
	left:0;
	width: 8px; height: 8px; border-radius:0;
	background: transparent;
	border:1px solid var(--gray4);
}

/* Remove border from checkbox box on check */
[type="checkbox"].square-checkbox:checked + label:before {
	border:1px solid var(--gray2);
	background:transparent;
}
/* checked mark aspect */
[type="checkbox"].square-checkbox:not(:checked) + label:after,
[type="checkbox"].square-checkbox:checked + label:after {
	left:0;
	content:"\e5ca";
	font-size:14px;
	color: var(--primaryaccentcolor);
}
/* disabled checkbox */
[type="checkbox"].square-checkboxdisabled:not(:checked) + label:before,
[type="checkbox"].square-checkbox:disabled:checked + label:before {
	background: var(--gray5);
}
[type="checkbox"].square-checkbox:disabled:checked + label:after {
	color: var(--gray4);
}
[type="checkbox"].square-checkbox:disabled + label {
	color: var(--gray4);
}
/* accessibility */
/* [type="checkbox"].square-checkbox:checked:focus + label:before,
[type="checkbox"].square-checkbox:not(:checked):focus + label:before {
	border: none;
} */


input.ruled-input {
	background:transparent;
	border-radius:0;
	border-left:none;border-right:none;
	padding:0;
	border-color:var(--gray5);
}


.confWeekRepeat .conftitle {
	display:block;
	text-align:center;
	margin-bottom:var(--basepadding);
}

.weekrepeatdetails {
	display:grid;
	grid-template-columns:repeat(7, max-content);
	grid-gap:calc(var(--basespacing)*0.5);
	justify-content:center;
}

.weekrepeatdetails.smaller label {
	text-transform:uppercase;
	font-size:var(--XXSbuttonFONTsize);
	padding:calc(var(--basespacing)*0.3) calc(var(--basespacing)*0.75) calc(var(--basespacing)*0.3) calc(var(--basespacing)*1.75);
}

.weekrepeatdetails.smaller label:after,
.weekrepeatdetails.smaller label:before {
	text-transform: lowercase;
	font-size:var(--XXSbuttonFONTsize);
	left:5px;
}

.weekrepeatdetails.smaller label:before {
	left:7px;
	width:6px;
	height:6px;
}

#modal-playlistfileproperties .conftitle h6,
#modal-playlistproperties .conftitle h6 {
	font-size:var(--XXSbuttonFONTsize);
	color:var(--gray3);
	text-transform:uppercase;
	letter-spacing:1px;
}

/*
label[data-type="tag"] {
	font-size:var(--SbuttonFONTsize);
	border:1px solid var(--primaryaccentcolor);
	color:var(--primarysecondarycolor);
	height:auto;
	line-height:1;
	padding:calc(var(--basespacing)*0.7) calc(var(--basespacing)*1.2) calc(var(--basespacing)*0.7) calc(var(--basespacing)*2);
}

label[data-type="tag"] input[type=checkbox] {
	border:none;
	color:var(--primarysecondarycolor);
	width:10px;height:10px;
	line-height:1;
}

label[data-type="tag"] input[type=checkbox]:after {
	content:"check";
	color:var(--primarydarkcolor);
}
*/



/* // Playlist File Expiration Settings Modal and Scheduled Playlist Modal --- Reorganize this shit */


/* Scheduled Playlist Info Modal */

.scheduleplaylistinfo-rowgroup {
	display:grid;
	grid-gap:var(--basepadding);
	grid-template-columns:6fr 10fr;
	align-items:center;
}

.scheduleplaylistinfo-rowgroup .icon-wrapper {
	width:80px;
	height:auto;
	justify-self:end;
}

.scheduleplaylistinfo-rowgroup svg.custom-icon {
	width:100%;
}

.scheduleplaylistinfo-inner-wrapper {
	display:flex;
	flex-direction:column;
}

.scheduleplaylistinfo-maininfo-row {
	display:flex;
	align-items:center;
}

.scheduleplaylistinfo-maininfo-label-wrapper {
	display:flex;
	flex-direction:column;
}

.scheduleplaylistinfo-maininfo-label {
	font-size:var(--XXSbuttonFONTsize);
	color:var(--gray3);
	text-transform:uppercase;
	letter-spacing:1px;
	margin-left:var(--basespacing);
}

.scheduleplaylistinfo-maininfo-label span:first-child {
	margin-right:5px;
}

.scheduleplaylistinfo-inner-wrapper h6 {
	font-size:var(--XXSbuttonFONTsize);
	text-transform:uppercase;
	letter-spacing:1px;
}

.scheduleplaylistinfo-maininfo {
	font-size:31px;
}

/* // Scheduled Playlist Info Modal */



/* // Playlist Library Card */



/* Terminal Card */

.card-actions#terminalControls {
	display:grid;
	grid-template-columns: 96px 1fr;
	grid-auto-rows: auto;
}

#TerminalCard[data-type="alternative-layout"] .card-actions#terminalControls {
	grid-template-columns: max-content 1fr;
}

.card-actions#terminalControls.open-search,
.card-actions#terminalControls.open-input {grid-template-columns: 1fr}
.card-actions#terminalControls:not(.has-btn-move-checked-terminals) #btn-move-checked-terminals {display:none}

.card-actions#terminalControls.has-btn-move-checked-terminals {grid-template-columns: 96px max-content 1fr}
.card-actions#terminalControls.has-btn-move-checked-terminals.open-search {grid-template-columns: 112px max-content 1fr}

#terminalListDiv {
	padding-top:2px; /* for the outline of the draggable to look normal */
}

#draggingContainer > .item-terminal {
	background:var(--bodycolor);
	box-shadow:0 0 8px rgba(0,0,0,0.15);
	padding-left:calc(var(--basespacing)*2);
}

#draggingContainer > .item-terminal:after {right:calc(var(--basespacing)*2)}
#draggingContainer > .item-terminal .item-terminal-checkbox-label {display:none}

#draggingContainer > .item-terminal:last-child {
	box-shadow:0 0 20px rgba(0,0,0,0.05);
}

li.item-group, li.item-terminal {
	list-style-type:none;
	position:relative;
	z-index:1;
	cursor:pointer;
	width:100%;
	font-size:var(--SbuttonFONTsize);
	color:var(--primarydarkcolor);
	padding:calc(var(--basespacing)*1) 0;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

li.item-terminal {
	padding-right:25px;
	display:flex;
	align-items:center;
}

li.item-terminal .item-terminal-checkbox-label {
	position:absolute;
	left:0;
	height:100%;
	border:none;
	opacity:0;
	transition:all 0.35s var(--normal-easing);
	-webkit-transition:all 0.35s var(--normal-easing);
	-moz-transition:all 0.35s var(--normal-easing);
	-ms-transition:all 0.35s var(--normal-easing);
	-o-transition:all 0.35s var(--normal-easing);
}

li.item-terminal .item-terminal-checkbox-label:before {
	content:"";
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	width:18px;
	height:18px;
	padding:0;
	border:1px solid var(--gray5);
}
li.item-terminal .item-terminal-checkbox:checked + label:after {
	left:1px;
	font-size:20px;
}

/* li.item-terminal .item-terminal-checkbox-label:before {
	display:none
} */

li.item-terminal:hover .item-terminal-checkbox-label,
li.item-terminal.checked .item-terminal-checkbox-label {
	opacity:1;
}

li.item-terminal .actions {
	margin-left:auto;
	display:flex;
	align-items:center;
}

.item-terminal .actions button {
	background:var(--secondarycolor);
	color:white;
	opacity:0;
	transform:scale(0);
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	-ms-transform:scale(0);
	-o-transform:scale(0);
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
}

.item-terminal:hover .actions button {
	opacity:1;
	transform:scale(1);
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
}

.terminal-group li.item-group {
	border-bottom:1px solid var(--gray5);
}

#listTerminals {
	border-top:1px solid var(--gray5);
}

#listTerminals.ungroupped-only {
	border-top:none;
}

.empty-terminal-group, .empty-ungroupped-terminals {
	display:none;
	border-bottom:1px solid var(--gray5);
}

.empty-ungroupped-terminals {
	border-top:1px solid var(--gray5);
}

.item-group-terminals li.item-terminal {
	border-bottom:1px solid var(--gray5);
}

.terminal-group {
	position:relative;
}

.terminal-group.ui-droppable-hover:after, .ungroupped-terminals.ui-droppable-hover:after {
	content:"";
	position:absolute;
	z-index:1;
	top:0;left:50%;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	width:calc(100% - 4px + calc(var(--basepadding)*4));
	height:calc(100% - 2px);
	outline:2px solid var(--primaryaccentcolor);
}

.ungroupped-terminals {
	position:relative;
	margin-top:calc(var(--basespacing)*4);
}

#listTerminals.ungroupped-only .ungroupped-terminals {
	margin-top:0;
}

.ungroupped-terminals .item-terminal {
	border-bottom:1px solid var(--gray5);
}

.ungroupped-terminals .item-terminal:first-of-type {
	border-top:1px solid var(--gray5);
}

.ungroupped-terminals .item-terminal .btn-ungroup {
	display:none;
}

li.item-group {
	display:grid;
	grid-template-columns:max-content 1fr max-content max-content;
	align-items:center;
	padding-top:0;
	padding-bottom:0;
}

li.item-group .group-content, li.item-group .group-content, .terminalgroupname {
	height:100%;
}

li.item-group .group-content span.terminalgroupname {
	line-height:26px;
}

li.item-group .terminalgroupname {
	padding-top:calc(var(--basespacing)*0.6);
	padding-bottom:calc(var(--basespacing)*0.6);
}

li.item-group .btn-delete-group {
	justify-self:end;
	background:var(--gray6);
	color:var(--gray2);
}

li.item-group .btn-delete-group:hover {
	color:white;
	background:var(--secondarycolor);
}

.item-terminal:after {
	content:"keyboard_arrow_right";
	position:absolute;
	height:auto;width:auto;
	right:0;
	display:block;
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
        	font-size:18px;
		text-align:center;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

.toggle-group i {
        font-size:18px;
}

.item-group:before, .item-terminal:before, .empty-terminal-group:before, .empty-ungroupped-terminals:before, .item-schedule-terminal:before {
	content:"";
	position:absolute;
	z-index:-1;
	width:calc(100% + calc(var(--basepadding)*4));
	height:100%;
	left:50%;top:0;bottom:0;
	transform:translateX(-50%);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	background:var(--gray6);
	opacity:0;
}

.item-group:hover:before, .item-terminal:hover:before {
	opacity:1;
	transition:all 0.15s var(--normal-easing);
	-webkit-transition:all 0.15s var(--normal-easing);
	-moz-transition:all 0.15s var(--normal-easing);
	-ms-transition:all 0.15s var(--normal-easing);
	-o-transition:all 0.15s var(--normal-easing);
}

.item-terminal.selected {
	color:white;
}

.item-terminal.selected:before {
	opacity:1;
	background:var(--secondarycolor);
}

.terminal-group.selected .toggle-group {
	transform:rotate(90deg);
	-webkit-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-ms-transform:rotate(90deg);
	-o-transform:rotate(90deg);
}

.item-group-terminals .item-terminal:before, .empty-terminal-group:before, .empty-ungroupped-terminals:before {
	opacity:0.5;
}

.item-group-terminals .item-terminal:hover:before, .item-terminal.selected:before {
	opacity:1;
}

/* .item-group-terminals .item-terminal:not(:last-child) {
	width:calc(100% - calc(var(--basespacing)*2.5));
	margin-left:calc(var(--basespacing)*2.5);
} */

/* .item-group-terminals .item-terminal:last-child {
	padding-left:calc(var(--basespacing)*2.5);
	margin-left:0;
} */
.item-group-terminals .item-terminal {
	width:calc(100% - calc(var(--basespacing)*2.5));
	margin-left:calc(var(--basespacing)*2.5);
}

.item-group-terminals .item-terminal:before {
	width:calc(100% + calc(var(--basepadding)*4) + calc(var(--basespacing)*2.5));
	left:calc(50% - calc(var(--basespacing)*1.25));
}

.item-group-terminals .empty-terminal-group, .ungroupped-terminals .empty-ungroupped-terminals {
	position:relative;
	z-index:1;
	font-size:var(--SbuttonFONTsize);
	font-style:italic;
	text-align:center;
	color:var(--gray3);
	padding:calc(var(--basespacing)*1.4) 0;
}

.item-terminal {
	display:grid;
	grid-template-columns:15px 1fr;
	grid-gap:calc(var(--basespacing)*0.75);
	align-items:center;
}

.item-terminal:hover,
.item-terminal.checked {
	padding-left:calc(var(--basespacing)*3.5);
}

.terminal-status {
	width:auto;height:auto;
	border-radius:var(--rounded);
	justify-self:center;
}

.item-terminal[data-status="on"] .terminal-status {width:4px;height:4px;background:var(--green);}
.item-terminal[data-status="pend"] .terminal-status {color:var(--gray4);}
.item-terminal[data-status="pend"] .terminal-status {color:var(--yellow);}
.item-terminal[data-status="off"] .terminal-status {color:var(--red);}

.item-terminal[data-status="off"] .terminal-status i, .item-terminal[data-status="pend"] .terminal-status i {font-size:15px;}

.item-terminal .terminalname {
	color:black;
}

.item-terminal .scheduled-terminal-action {
	margin:0;
	padding:0;
	border:none;
	margin-top:calc(var(--basespacing)*0.3);
	color:var(--gray3);
	line-height:1;
}

.item-terminal .scheduled-terminal-name {
	padding:0 calc(var(--basespacing)*0.3);
	text-decoration:underline;
	padding-left:0;
}

.item-terminal.selected .terminalname {
	color:white;
}

.item-terminal.selected .scheduled-terminal-action {
	color:var(--gray5);
}

.item-terminal[disabled] {opacity:1;}

.ungrouped-terminals {
	border-top:1px solid var(--gray5);
}

.ungroupped-text {
	font-size:var(--SbuttonFONTsize);
	font-style:italic;
	color:var(--gray3);
}

/* #TerminalCard[data-type="alternative-layout"] .ungroupped-text {
	display:none;
} */



#TerminalCard[data-type="alternative-layout"] .item-terminal .item-terminal-checkbox,
#TerminalCard[data-type="alternative-layout"] .item-terminal .item-terminal-checkbox-label,
#TerminalCard[data-type="alternative-layout"] .item-terminal .actions button {display:none}

#TerminalCard[data-type="alternative-layout"] .item-terminal:hover,
#TerminalCard[data-type="alternative-layout"] .item-terminal.checked {
	padding-left:unset;
}


/* // Terminal Card */


/* Terminal Content Card */

#TerminalContentCard .box-header {
	padding-bottom:0;
}

.configureTerminal {
	display:grid;
	grid-template-columns: 1fr max-content max-content;
	justify-items: end;
	align-items: center;
}

#terminal-actions {
	/* display:grid;
	grid-template-columns: max-content 1fr; */
	display:flex;
	align-items:center;
	padding-bottom:calc(var(--basespacing)*2);
}

#terminal-actions .terminal-extra-info {
	margin-left:auto;
}

#terminal-actions .terminal-extra-info > div {
	display:flex;
	align-items:center;
	gap:var(--basespacing);
}

#terminal-actions button:last-child {
	justify-self:end;
}

.terminal-content-schedule-update-status {
	border-radius:var(--rounded);
	font-size:var(--SbuttonFONTsize);
	margin-left:auto;

	display:flex;
	flex-direction:row;
	align-items:center;
	padding:calc(var(--basespacing)*0.7) calc(var(--basespacing) * 1.75) calc(var(--basespacing)*0.7) calc(var(--basespacing) * 1.5);
	display:flex;
	flex-direction:column;
	align-items:flex-start;
}

.terminal-updated-container {display:flex;align-items:center}

.terminal-content-schedule-update-status:not([data-content-update-status='updating']) {background:var(--bodycolor);}
.terminal-content-schedule-update-status[data-content-update-status='updating'] {background:var(--primaryaccentcolor);}

.terminal-content-schedule-update-status:not([data-content-update-status='updating']) .terminal-updating-container {display:none;}
.terminal-content-schedule-update-status[data-content-update-status='updating'] .terminal-updated-container {display:none;}

.terminal-content-schedule-update-status[data-content-update-status='hold'] .terminal-updated-container #set-to-update {display:flex}
.terminal-content-schedule-update-status:not([data-content-update-status='hold']) .terminal-updated-container #set-to-update {display:none}

.terminal-updated-container span {margin-left:calc(var(--basespacing)*0.5);}
.terminal-updated-container i {color:var(--green);}



.terminal-updating-container {
	display:flex;
	flex-direction:row;
	align-items:center;
}

.terminal-updated-container i,
.terminal-updating-container i {
	font-size:16px;
}

.terminal-updating-container span {
	margin-left:calc(var(--basespacing)*0.5);
}

.terminal-updating-icon {
	font-size:unset;
	-webkit-animation: updating 0.75s linear;
	-moz-animation: updating 0.75s linear;
	-o-animation: updating 0.75s linear;
	animation: updating 0.75s linear;
	animation-iteration-count: infinite;
}

.terminal-updating-icon i.material-icons {
	margin:0;
}

@-webkit-keyframes updating {
    0% {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes updating {
    0% {-moz-transform: rotate(0deg);}
    100% {-moz-transform: rotate(360deg);}
}
@keyframes updating {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}

.terminal-content-schedule-update-status.terminal-not-installed-warning,
.terminal-content-schedule-update-status.terminal-not-ready-warning {
	flex-direction:row;
	align-items:center;
	gap:5px;
}

.terminal-content-schedule-update-status.terminal-not-installed-warning span {
	font-weight:bold;
}

.terminal-content-schedule-update-status.terminal-not-installed-warning {
	background:var(--red);
	color:white;
}

.terminal-content-schedule-update-status.terminal-not-ready-warning {
	background:var(--bodycolor);
}

#terminalContentDiv .preview-outer-wrapper {
	background:var(--bodycolor);
	display:grid;
}

#terminalContentDiv .preview-inner-wrapper {
	width:100%;
	max-width:400px;
	max-height:280px;
	margin:0 auto;
}

#terminalContentDiv .preview-fullsize-container {
	background:transparent;
}

.terminal-info-outer-wrapper {
	display:grid;
	grid-template-columns:1fr 1fr;
	grid-template-rows:1fr;
	grid-gap:calc(var(--basespacing)*0.25);
	align-items:center;
	margin:calc(var(--basespacing)*2) 0;
	color:var(--primarydarkcolor);
	font-size:var(--MSbuttonFONTsize);
		border-top:1px solid var(--gray7);
		border-bottom:1px solid var(--gray7);
}

.terminal-info-wrapper {
	border-bottom:1px solid var(--gray7);
	padding:calc(var(--basespacing)*0.25) 0;
	color:var(--gray3);
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
}

.terminal-info-wrapper:last-child, .terminal-info-wrapper:nth-last-child(2) {
	border-bottom:none;
}

.terminal-info-outer-wrapper.fullwidth {
	grid-template-columns:1fr;
	border:none;
}

.terminal-info-outer-wrapper.fullwidth .terminal-info-wrapper {
	border-bottom:1px solid var(--gray7);
}

.terminal-info-outer-wrapper.fullwidth .terminal-info-wrapper:first-child {
	border-top:1px solid var(--gray7);
}

.terminal-info-outer-wrapper.mt-0 {margin-top:0}
.terminal-info-outer-wrapper.mb-0 {margin-bottom:0;border-bottom:none}

.terminal-info {
	color:var(--primarydarkcolor);
}

/*
li.preview-fullsize-associated-playlist-name {border-color:var(--gray7);font-size:12px;}

.preview-fullsize-associated-playlists {margin-top:11px;}
*/

/*
#terminalContentDiv .preview-fullsize-container {
	width:100%;
	height:300px;
	padding-bottom:0;
}

#terminalContentDiv .preview-file-box {
	width:auto;
	height:75%;
}
*/

/* // Terminal Content Card */





/* Administration Page */

.admin-page {
	grid-template-columns: 500px 1fr;
}

#AdminCard .box-body {
	padding-top:6px;
}

.content-section-title {
	display:block;
	font-size:13px;
	color:var(--primarydarkcolor);
}

.storage-wrapper {
	position:relative;
	display:grid;
	grid-template-columns:1fr max-content;
	grid-gap:var(--basespacing);
	align-items:center;
	overflow:visible;
}

.storage-bar-holder, .cpu-bar-holder {
	position:relative;
	width:100%;
	height:10px;
	border-radius:var(--rounded);
	background:var(--gray7);
	overflow:hidden;
}

.cpu-bar-holder {
	position:absolute;
	left:0;
	bottom:0;
	height:2px;
	width:10%;
}

.storage-bar, .cpu-bar {
	position:absolute;
	height:100%;
	top:0;bottom:1px;
	left:0;
	background:var(--primaryaccentcolor);
}

.cpu-bar {
	background:red;
}

.cpu-description {
	color:var(--gray3);
	position:absolute;
	left:calc(10% + calc(var(--basespacing)*0.5));
	bottom:0;
	font-size:7px;
	text-transform:uppercase;
	letter-spacing:1px;
	transform:translateY(38%);
}

.storage-content-wrapper .content-section-title {
	position:absolute;
	transform:translateY(-100%);
	-webkit-transform:translateY(-100%);
	-moz-transform:translateY(-100%);
	-ms-transform:translateY(-100%);
	-o-transform:translateY(-100%);
}

.content-section {
	display:grid;
	padding:0 var(--basepadding);
	grid-gap:var(--basespacing);
	align-items:center;
	justify-content:left;
}

.admin-terminal-status-wrapper {
	grid-template-columns:max-content 1fr max-content 1fr;
}

.stat-number {
	color:var(--gray2);
	font-size:80px;
}

.admin-terminal-status-description {
	font-size:12px;
	color:var(--gray3);
}

.registered-users-wrapper {
	grid-template-columns:max-content 1fr;
}

#Admin-SecondaryCard {
	position:relative;
	overflow:hidden;
}

.absolute-img-cover {
	position:absolute;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	width:100%;
	height:100%;
	object-fit:cover;
}

/* // Administration Page */




/* Management Page */

.box-card {
	width:100%;
	height:auto;
	background:white;
	border-radius:var(--roundcorner);
	box-shadow: 0px 5px 20px rgba(0,0,0,0.1);
	display:grid;
	grid-template-rows:max-content max-content;
}

.box-card-header {
	padding:calc(var(--basepadding)*2);
	padding-bottom:calc(var(--basespacing)*2);
	padding-top:calc(var(--basespacing)*3);
}

.box-card-body {
	padding:0 calc(var(--basepadding)*2) calc(var(--basepadding)*2) calc(var(--basepadding)*2);
}

.storage-wrapper.su-specific {
	height:26px;
	grid-template-columns:1fr;
}



.content-header-wrapper {
	display:grid;
	grid-template-columns:1fr max-content;
	grid-gap:var(--pagepadding);
}

.content-header-secondary-card {
	background:white;
	border-radius:var(--roundcorner);
	box-shadow: 0px 5px 20px rgba(0,0,0,0.1);
	display:grid;
	grid-template-columns:max-content max-content;
	padding:var(--basepadding);
}

.content-header-secondary-card .content-section {
	grid-template-columns:max-content 1fr;
}

.content-header-secondary-description {
	font-size:12px;
	color:var(--gray3);
	line-height:1;
}

.content-header-secondary-card .stat-number {
	font-family: 'newjunebookitalic';
	color:var(--gray2);
	font-size:29px;
	font-weight:bold;
}

.content-header-secondary-card .stat-number.stat-breaker {
	font-weight:normal;
	padding-left:calc(var(--basespacing)*0.5);
}

.dataTables_wrapper {
	margin-top:calc(var(--basepadding)*2);
}

.dataTables_wrapper .row-fluid:first-of-type {
	display:none; /* Hide default controls */
}

.dataTables_wrapper table {
	margin-bottom:calc(var(--basepadding)*2); /* Add space between table and footer */
}

.dataTables_wrapper table.dataTable thead th {
	/* Head styling */
	text-align:left;
	font-weight:normal;
	font-size:var(--SbuttonFONTsize);
	color:var(--gray2);
	padding:0 calc(var(--basespacing)*2) var(--basespacing) var(--basespacing);
	border:none;
	border-bottom:1px solid var(--gray7);
}

.dataTables_wrapper table.dataTable tr td:last-child a {
	width:var(--lineheightSM);
	height:var(--lineheightSM);
	line-height:var(--lineheightSM);
	margin-left:calc(var(--basespacing)*0.2);
}

.sorting, .sorting_desc, .sorting_asc {cursor:pointer;}

.sorting:before, .sorting_desc:before, .sorting_asc:before {
	font-size:15px;
	line-height:1;
	margin-left:-4px;
	margin-right:4px;
		font-family: 'Material Icons';
		font-style: normal;
		direction: ltr;
		vertical-align:middle;
}

.sorting:before {content:"unfold_more";}
.sorting_desc:before {content:"expand_more";}
.sorting_asc:before {content:"expand_less";}

.dataTables_wrapper table.dataTable tr.even, .dataTables_wrapper table.dataTable tr.odd {
	background:none;
	border-bottom:1px solid var(--gray7);
}

.dataTables_wrapper table.dataTable tr.even td.sorting_1, .dataTables_wrapper table.dataTable tr.odd td.sorting_1, .dataTables_wrapper table.dataTable tbody tr:hover {
	/* Active sort filter styling */
	background:var(--bodycolor);
}

.dataTables_wrapper table.dataTable td {
	font-size:var(--MXSbuttonFONTsize);
	padding:2px var(--basespacing);
	height:28px;
}

/* Footer */

.dataTables_wrapper .row-fluid:last-of-type {
	display:grid;
	grid-template-columns:max-content 1fr;
	grid-gap:var(--basepadding);
	align-items:center;
}

.dataTables_wrapper .row-fluid:last-of-type div:last-of-type {
	justify-self:end;
}

.dataTables_info {
	font-size:var(--SbuttonFONTsize);
	color:var(--gray2);
	padding-left:var(--basespacing);
}

.dataTables_paginate {float:right;}

.paginate_button i {
	width:var(--baselineheight);
	height:var(--baselineheight);
	line-height:var(--baselineheight);
	text-align:center;
	border-radius:var(--rounded);
	background:var(--gray6);
	color:var(--primarydarkcolor);
	padding:0;
		transition:all 0.15s ease;
		-webkit-transition:all 0.15s ease;
		-moz-transition:all 0.15s ease;
		-ms-transition:all 0.15s ease;
		-o-transition:all 0.15s ease;
}

.paginate_button.previous {margin-right:var(--basepadding);margin-left:calc(var(--basepadding)*0.4);}
.paginate_button.next {margin-left:var(--basepadding);margin-right:calc(var(--basepadding)*0.4);}

.paginate_button.first:hover i, .paginate_button.last:hover i {
	background:var(--secondarycolor);
	color:white;
}

.paginate_button.previous:hover i, .paginate_button.next:hover i {
	color:var(--primarydarkcolor);
	background:var(--primaryaccentcolor);
}

.paginate_button.disabled i {
	opacity:0.35;
}

.paginate_button.disabled:hover i {
	background:var(--gray6);
	color:var(--primarydarkcolor);
}

span .paginate_button {
	padding-left:calc(var(--basespacing)*0.5);
	padding-right:calc(var(--basespacing)*0.5);
	text-align:center;
	height:var(--baselineheight);
	color:var(--gray4);
}

span .paginate_button:hover, span .paginate_button.current {
	color:var(--primarydarkcolor);
}


/* Accounts Page Specific */

#modal-addLic {overflow:visible}

.card-actions#manageaccounts-actions {
	display:grid;
	grid-template-columns:max-content max-content 1fr max-content max-content;
	align-items:center;
}

.card-actions#manageaccounts-actions .input-wrapper {
	justify-self:end;
	min-width:500px;
}

#accounts-table thead th[aria-label="Actions"] {text-align:right;}
#accounts-table tr td:last-child {
	text-align:right;
}

/* // Accounts Page Specific */

/* Users in Account Page Specifics */

.card-actions#manageusers-actions {
	display:grid;
	grid-template-columns:max-content 1fr max-content max-content;
	align-items:center;
}

.card-actions#manageusers-actions .input-wrapper {
	justify-self:end;
	min-width:500px;
}

#users-table thead th[aria-label="Actions"] {text-align:right;}
#users-table tr td:last-child {
	text-align:right;
}

ul[data-tasklist] {display:none;}

/* // Users in Account Page Specifics */

/* Terminals in Account Page Specifics */

.card-actions#manageaccountterminals-actions {
	display:grid;
	/* grid-template-columns:max-content 1fr max-content max-content; */
	grid-template-columns:max-content max-content 1fr max-content max-content;
	align-items:center;
}

.card-actions#manageaccountterminals-actions .input-wrapper {
	justify-self:end;
	/* min-width:500px; */
	min-width:238px;
}

#accountterminals-table thead th[aria-label="Actions"] {text-align:right;}
#accountterminals-table tr td:last-child {
	text-align:right;
}


.account-terminal-content-update-time-content {
	display:flex;
	flex-direction:row;
}

.account-terminal-content-update-time-content .conf-content-container {
	position:relative;
}

.btn-edit-content-update-time {
	display:flex;
	align-items:center;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	opacity:0;
}

.account-terminal-content-update-time-content:hover .conf-content-container .btn-edit-content-update-time {
	opacity:1;
}

.account-terminal-content-update-time-content:hover .conf-content-container > *:not(.btn-edit-content-update-time) {
	opacity:0.2;
}

.account-terminal-content-update-time-content div {padding:0; padding-top:1px}
.account-terminal-content-update-time-content .fieldset-complex:first-child {
	margin-right:calc(var(--basespacing)*1);
}

.account-terminal-content-update-time-content .fieldset-complex input {
	font-size:var(--MXSbuttonFONTsize);
	font-weight:400;
	color:black!important;
}

.account-terminal-content-update-time-content .conf-label {
	/* font-size:var(--XXSbuttonFONTsize); */
	font-size:var(--SbuttonFONTsize);
	color:var(--gray3);
}

.account-terminal-content-update-time-content .conf-content-container {
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-start;
}

.account-terminal-content-update-time-content .conf-content {
	display:flex;
	flex-direction:row;
	align-items:center;
}

.account-terminal-content-update-time-content .conf-auto {
	display:flex;
	height:20px;
}

.account-terminal-content-update-time-content[data-time-window="false"] .confdetails {display:none}

/* .account-terminal-content-update-time-content:hover .conf-auto,
.account-terminal-content-update-time-content[data-time-window="true"] .conf-auto,
.account-terminal-content-update-time-content.active .conf-auto {display:none}
.account-terminal-content-update-time-content:hover .confdetails,
.account-terminal-content-update-time-content[data-time-window="true"] .confdetails,
.account-terminal-content-update-time-content.active .confdetails {display:flex}
.account-terminal-content-update-time-content:hover .conf-separator,
.account-terminal-content-update-time-content[data-time-window="true"] .conf-separator,
.account-terminal-content-update-time-content.active .conf-separator {display:flex} */

.account-terminal-content-update-time-content[data-time-window="true"] .conf-auto,
.account-terminal-content-update-time-content.active .conf-auto {display:none}
.account-terminal-content-update-time-content[data-time-window="true"] .confdetails,
.account-terminal-content-update-time-content.active .confdetails {display:flex}
.account-terminal-content-update-time-content[data-time-window="true"] .conf-separator,
.account-terminal-content-update-time-content.active .conf-separator {display:flex}

.account-terminal-content-update-time-content .fieldset-complex:before {display:none}

.account-terminal-content-update-time-content .fieldset-complex input {
	cursor:default!important;
}

.account-terminal-content-update-time-content .confdetails label {
	font-size:var(--XXSbuttonFONTsize);
	color:var(--gray3);
	letter-spacing:1px;
	text-transform:uppercase;
}

.account-terminal-content-update-time-content .conf-separator {
	margin-left:calc(var(--basespacing)*0.5);
	margin-right:calc(var(--basespacing)*0.5);
	color:var(--gray3);
	display:none;
}

.account-terminal-content-update-time-content .confHours {
	grid-template-rows:max-content;
	position:relative;
}

.account-terminal-content-update-time-content .confHours {grid-template-columns:repeat(2,max-content);}

.account-terminal-content-update-time-content .confHours input[name="timepicker"] {
	display:block;
}

.account-terminal-content-update-time-content .conf-icon-container svg {height:33px}
.account-terminal-content-update-time-content .conf-icon-container .custom-icon {
	stroke:var(--primarydarkcolor);
}

.account-terminal-content-update-time-content .conf-icon-container {position:relative;display:flex;align-items:center;justify-content:center}
.account-terminal-content-update-time-content .conf-icon-container button {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:18px;
	height:18px;
	display:none;
	background:var(--primaryaccentcolor);
	color:var(--primarydarkcolor);
}

/* .account-terminal-content-update-time-content .confwrapper .conf-icon-container {cursor:pointer} */
.account-terminal-content-update-time-content .confwrapper .conf-icon-container:hover button {display:block;}
.account-terminal-content-update-time-content .confwrapper .conf-icon-container:hover svg {opacity:0.5}

.account-terminal-content-update-time-content .confHours.active input[name="timepicker"] {display:block;}

.account-terminal-content-update-time-content .confHours.active .conf-content {display:flex}


/* Edit Terminals Time Window Modal */

#modal-terminal-config-time .confwrapper {
	display:flex;
	align-items:center;
}

#modal-terminal-config-time .confdetails {
	flex:1;
}

#modal-terminal-config-time .standard-modal-content {
	padding-bottom:0;
	margin-bottom:0;
}

#modal-terminal-config-time .modal-subtitle {
	opacity:1;
		transition:all 0.25s var(--normal-easing);
		-webkit-transition:all 0.25s var(--normal-easing);
		-moz-transition:all 0.25s var(--normal-easing);
		-ms-transition:all 0.25s var(--normal-easing);
		-o-transition:all 0.25s var(--normal-easing);
}

#modal-terminal-config-time .modal-subtitle.inactive {
	opacity:0;
}

#modal-terminal-config-time .standard-modal-footer {
	border:none;
}

#modal-terminal-config-time .standard-modal-header {
	padding-bottom:0;
}

#modal-terminal-config-time .standard-modal-content {
	padding-top:calc(var(--basepadding)*2);
}

#modal-terminal-config-time .standard-modal-footer {
	grid-template-columns:1fr max-content max-content;
}

#modal-terminal-config-time .standard-modal-footer .reset-time-setting {
	border-radius:0;
	text-align:left;
}

#modal-terminal-config-time .original-settings {
	margin-top:var(--basepadding);
	display:flex;
	align-items:center;
	font-size:15px;
	/* color:var(--primarydarkcolor); */
	color:var(--gray4);
	margin-top:var(--basepadding);
	margin-bottom:var(--basespacing);
}

#modal-terminal-config-time .original-settings > span:first-child {margin-right:5px}
#modal-terminal-config-time .original-settings [content-for] {display:none}

#modal-terminal-config-time .original-settings[data-window='true'] [content-for='true'] {display:flex}
#modal-terminal-config-time .original-settings[data-window='true'] [content-for='false'] {display:none}

#modal-terminal-config-time .original-settings[data-window='false'] [content-for='false'] {display:flex}
#modal-terminal-config-time .original-settings[data-window='false'] [content-for='true'] {display:none}

#modal-terminal-config-time .original-settings [content-for='true'] {
	align-items:center;
	gap:calc(var(--basespacing)*0.5);
}

#modal-terminal-config-time .original-settings.unedited .immediate-label {display:flex}
#modal-terminal-config-time .original-settings:not(.unedited) .immediate-label {display:none}

#modal-terminal-config-time .original-settings.unedited .original-label {display:none}
#modal-terminal-config-time .original-settings:not(.unedited) .original-label {display:flex}

#modal-terminal-config-time .original-settings[data-window='true'].unedited {opacity:0} /* To hide the "set to" label in case the time window is defined */


/* // Terminals in Account Page Specifics */

/* Licenses Page Specific */

.Lic-wrapper {
	display:grid;
	/* grid-template-columns:max-content 1fr; */
	grid-template-columns:1fr 75px;
	grid-gap:var(--basepadding);
}

.card-actions#managelicenses-actions {
	display:grid;
	grid-template-columns:1fr max-content max-content;
	align-items:center;
}

.card-actions#managelicenses-actions .input-wrapper {
	justify-self:end;
	min-width:500px;
}

/* // Licenses Page Specific */

.dataTables_wrapper table.dataTable td.dataTables_empty {
	text-align:center!important;
	padding-top:var(--basespacing);
	padding-bottom:var(--basespacing);
}

/* // Management Page */

#console-wrapper {
	background:#000000;
}

#console-wrapper iframe {
	width:100%;
	height:100%;
	border:none;
}

.terminalbackground-group .input-wrapper:first-of-type {
	justify-self:end;
}

.terminalbackgroundpreview-wrapper {
	position:relative;
	width:100%;
	height:0;
	padding-bottom:100%;
	margin-bottom:var(--basespacing);
}

.terminalbackgroundpreview-wrapper img {
	position:absolute;
	object-fit:cover;
	width:100%;
	height:100%;
	position:absolute;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
}

.custom-file-input-original {display:none;}

.custom-file-input {
	overflow:hidden;
	text-overflow:ellipsis;
}

.custom-file-input span {display:inline-block;}

.custom-file-input button {
	width:100%;
	display:flex;
	flex-direction:row;
	align-items:center;
	margin-top:calc(var(--basespacing)*0.3);
}

.chosen-file-name {
	white-space:nowrap;
}


.logs-page {
	/*grid-template-columns: repeat(2, minmax(0, 1fr));*/
	width: 100%;
	height: 100%;
	position: relative;
	/*display:grid;
	grid-gap: calc(var(--basepadding)*2);*/
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items:flex-start;
	align-content:flex-start;
		transition:0.5s all var(--smooth-easing);
}

.logs-page .box-primary {
	overflow:visible;
}

.logs-page .box-primary:last-of-type {
	margin-left:calc(var(--basepadding)*2);;
}

#modal-DetailTerminal .standard-modal-footer {
	display:flex;
	flex-direction: row;
	justify-content:flex-end;
	align-items:center;
}

#modal-DetailTerminal #terminal-info-status {
	display:grid;
	grid-template-columns:max-content 15px 1fr;
	grid-gap:calc(var(--basespacing)*0.2);
	align-items:center;
}

#modal-DetailTerminal #terminal-info-status .terminal-status {
	width:auto;height:auto;
	border-radius:var(--rounded);
	justify-self:center;
}

#terminal-info-status[data-status="on"] .terminal-status {width:6px;height:6px;background:var(--green);}
#terminal-info-status[data-status="waiting"] .terminal-status,
#terminal-info-status[data-status="suspended"] .terminal-status {
	color:var(--gray4);
}
#terminal-info-status[data-status="pending"] .terminal-status {color:var(--yellow);}
#terminal-info-status[data-status="off"] .terminal-status {color:var(--red);}

#terminal-info-status[data-status="off"] .terminal-status i,
#terminal-info-status[data-status="waiting"] .terminal-status i,
#terminal-info-status[data-status="suspended"] .terminal-status i {
	font-size:15px;
}

.noPreview-available {
	position:absolute;
	width:calc(100% - 14px);
	height:calc(100% - 14px);
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	object-fit:cover;
	object-position:center;
	border:1px solid var(--gray3);
	background:black;
		display:none;
}

.noPreview-available .brokenURL {
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	display:block;
		width:90%;
		max-width:210px;
		height:auto;

		fill:transparent;
		stroke:var(--gray1);
		stroke-width:8;
		stroke-linecap:round;
		stroke-miterlimit:10;
}

#terminal-info-license-status {
	display:grid;
	grid-template-columns:max-content 15px 1fr;
	grid-gap:calc(var(--basespacing)*0.2);
	align-items:center;
}

#terminal-info-license-status .license-status {
	justify-self:center;
}

#terminal-info-license-status .license-status i {
	font-size:15px;
	color:#29d629;
}

#terminal-info-license-status[data-status="0"] .license-status i {
	color:var(--red);
}




/* Dashboard */

/* Pie Chart Graph Specific */

.graph-container {
	position:relative;
	width:var(--w);
	height:var(--w);
}

.graph-container .percentage-text {
	font-size:30px;
}

.graph {
	width:100%;
	height:100%;
	border-radius:5000px;
	display:flex;
	align-items:center;
	justify-content:center;
	/* background:var(--primaryaccentcolor); */
}

.graph:before,
.graph:after {
  content:"";
  position:absolute;
  border-radius:50%;
}
.graph:before {
	z-index:1;
  inset:0;
  background:
    radial-gradient(farthest-side,var(--c) 98%,#0000) top/var(--b) var(--b) no-repeat,
    conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
	background-size:0 0,auto; /* no rounding */
  -webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
          mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}

.graph:after {
	inset:0;
  background:
    radial-gradient(farthest-side,var(--gray7) 98%,#0000) top/var(--b) var(--b) no-repeat,
    conic-gradient(var(--gray7) 100%,#0000 0);
	background-size:0 0,auto; /* no rounding */
  -webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
          mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}

/* For rounding */
/* .graph:after {
  inset:calc(50% - var(--b)/2);
  background:var(--primaryaccentcolor);
  transform:rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - 130px/2));
} */

/*********/


.dashboard-container .button {
	display:flex;
	align-items:center;
}

.dashboard-container .btn-s {
	padding:0 calc(var(--basespacing)*1.2) 0 calc(var(--basespacing)*1.2);
}

.dashboard-container {
	width:100%;
	display:flex;
	gap:calc(var(--basepadding)*2);
}

.dashboard-container .box-primary {
	min-height:163px;
	height:100%;
}

.dashboard-block {
	width:100%;
	display:flex;
	flex-direction:column;
	flex:1;
	gap:calc(var(--basepadding)*2);
}

.dashboard-block.info-group {
	display:grid;
	grid-template-rows:0.85fr 1fr 0.85fr;
	max-width:404px;
}

.dashboard-block.info-group .box-primary {
	min-height:unset;
}

.dashboard-screensreport {
	display:flex;
	gap:calc(var(--basepadding)*2);
}


/* Log Specific */

/* .dashboard-log-card[status="report"] .box-header {padding-bottom:0}
.dashboard-log-card[status="report"] .box-header .card-header-line {display:none}
#log-report {margin-top:var(--basepadding)} */

.dashboard-log-card[status="report"] .box-header {padding-bottom:var(--basepadding)}
.dashboard-log-card[status="report"] .box-header .card-header-line {display:none}

.dashboard-log-card[status="all-ok"] .empty[data-type="all-ok"] {display:block}
.dashboard-log-card[status="all-ok"] #activity-report {display:none}

.dashboard-log-card[status="report"] .empty[data-type="all-ok"] {display:none}
.dashboard-log-card[status="report"] #log-report {display:block}

.dashboard-log-card .header-content {
	display:flex;
	align-items:center;
	justify-content:space-between;
}

.dashboard-log-card .empty .empty-thumbnail {
	max-width:115px;
	stroke-width:4;
}

.dashboard-log-card .empty p {
	max-width:230px;
}

.dashboard-log-card .box-body {
	max-height:580px; /* To scroll on overflow */
}

.dashboard-log-item {
	position:relative;
	border-bottom:1px solid var(--gray5);
	font-size:var(--SbuttonFONTsize);
	color:var(--primarydarkcolor);
	padding:calc(var(--basespacing)*1) 0;
}

.dashboard-log-item:first-child {
	border-top:1px solid var(--gray5);
}

.dashboard-log-item-hover-actions {
	display:none;
	position:absolute;
	width:100%;
	height:100%;
	top:0;right:0;bottom:0;left:0;
	align-items:center;
	justify-content:flex-end;
	gap:calc(var(--basespacing)*0.5);
	background:rgba(255,255,255,0.8);
}

.dashboard-log-item-hover-actions button:not(:hover) {
	background:white;
}

.dashboard-log-item[has-notes="false"]:hover .dashboard-log-item-hover-actions {
	display:flex;
}

.dashboard-log-item-header {
	display:flex;
	align-items:center;
	gap:calc(var(--basespacing)*0.75);
}

.dashboard-log-item-header i {width:15px}
.dashboard-log-item-header .log-title,
.dashboard-log-item-header .log-date {
	color:var(--gray3);
}

.dashboard-log-item-header .log-date {
	margin-left:auto;
}

.dashboard-log-item-content {
	line-height:1;
	margin-top:calc(var(--basespacing)*0.3);
	color:black;
}

.dashboard-log-item-notes-container {
	margin-top:var(--basespacing);
	padding:calc(var(--basespacing)*2);
	background:var(--bodycolor);
}

.standard-modal-content .dashboard-log-item-notes-container {
	margin-top:0;
}

.dashboard-log-item-notes-header {
	display:flex;
	justify-content:space-between;
	gap:var(--basespacing);
}

.dashboard-log-item-notes {
	margin-top:calc(var(--basespacing)*0.5);
	display:flex;
	flex-direction:column;
	gap:var(--basespacing);
}

.dashboard-log-item-note-item {
	display:flex;
	flex-direction:column;
	gap:calc(var(--basespacing)*0.5);
}

.dashboard-log-item-note-item > span:first-child {
	color:var(--gray3);
}

.dashboard-log-item[type='warning'] .dashboard-log-item-header .log-title,
.dashboard-log-item[type='warning'] .dashboard-log-item-header > i {
	color:var(--red);
}

.dashboard-log-item[type='warning'] .dashboard-log-item-content {
	padding-left:calc(15px + var(--basespacing)*0.75);
}

.dashboard-log-item[ignore="0"] .dashboard-log-item-header .log-date i {
	display:none;
}

/* Total Screens Specific */

.dashboard-totalscreens-card {
	display:flex;
	background:var(--primaryaccentcolor);
}

.dashboard-totalscreens-card .box-body,
.dashboard-storage-card .box-body,
.dashboard-screensreport .box-body {
	display:flex;
	width:100%;
	padding:calc(var(--basepadding)*3);
}

.totalscreens-content {
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-left:5px;
}

.totalscreens-content .custom-icon {
	width:100%;
	max-width:100px;
	stroke:black;
	opacity:0.3;
}

.totalscreens-content-info {
	display:flex;
	align-items:center;
	gap:calc(var(--basespacing)*2);
	color:white;
}

.totalscreens-content-info .number {
	font-size:50px;
}

/* Account Storage Specific */

.storage-content {
	width:100%;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:calc(var(--basespacing)*3);
}

.storage-info-and-actions {
	display:flex;
	flex-direction:column;
	gap:calc(var(--basespacing)*0.5);
	margin-right:var(--basespacing);
}

.storage-info-container {
	display:flex;
	align-items:center;
	gap:calc(var(--basespacing)*0.65);
	color:var(--gray2);
	font-size:var(--SbuttonFONTsize);
}

.storage-info-and-actions button,
.storage-info-and-actions a {
	margin-top:calc(var(--basespacing)*1.5);
	width:auto;
}

/* Screens Report Specific */

.dashboard-screensreport[status="ok"] [for-status="ok"] {display:flex}
.dashboard-screensreport[status="ok"] [for-status="detail"] {display:none}
.dashboard-screensreport[status="ok"] [for-status="notok"] {display:none}

.dashboard-screensreport[status="notok"] [for-status="notok"] {display:flex}
.dashboard-screensreport[status="notok"] [for-status="detail"] {display:none}
.dashboard-screensreport[status="notok"] [for-status="ok"] {display:none}

.dashboard-screensreport[status="detail"] [for-status="detail"] {display:flex}
.dashboard-screensreport[status="detail"] [for-status="ok"] {display:none}
.dashboard-screensreport[status="detail"] [for-status="notok"] {display:none}

.screensreport-content {
	display:grid;
	grid-template-columns:58px 1fr;
	justify-content:space-between;
	align-items:center;
	gap:calc(var(--basespacing)*3);
	margin-left:5px;
}

.screens-icon-container {
	width:58px;
	height:58px;
	border-radius:5000px;

	display:flex;
	align-items:center;
	justify-content:center;
}

[for-status="ok"] .screens-icon-container {background:var(--greenbrighter)}
[for-status="notok"] .screens-icon-container {background:var(--red)}

.screens-icon-container i {
	color:white;
	font-size:30px;
}

.screensreport-info {
	display:flex;
	flex-direction:column;
	gap:calc(var(--basespacing)*0.65);
}

.screensreport-info span {
	color:var(--gray2);
}

/* Screens Report Detail */

.dashboard-screensreport .box-primary[for-status="detail"] .box-body {
	padding:calc(var(--basepadding)*2);
	padding-top:calc(var(--basepadding)*1.5);
}

.screensreport-detail-header {
	display:flex;
	align-items:center;
	gap:calc(var(--basespacing)*0.5);
}

.screensreport-detail-header span {
	color:var(--gray2);
}

.screensreport-detail-header i {
	margin-top:2px;
}

[report="offline"] .screensreport-detail-header i {color:var(--red)}
[report="online"] .screensreport-detail-header i {color:var(--greenbrighter)}

.screensreport-detail-content {
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	gap:calc(var(--basespacing)*2);
}

/* Map */

.dashboard-map-card {
	position:relative;
}

.dashboard-map-card .box-header {
	z-index:1;
	padding-left:calc(var(--basepadding)*2.5);
	padding-right:calc(var(--basepadding)*2.5);
}

.dashboard-map-card .box-header:before {
	content:"";
	position:absolute;
	z-index:1;
	left:0;
	right:0;
	top:0;
	height:80px;
	background:linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
}

.dashboard-map-card .header-content {
	position:relative;
	z-index:1;
	display:flex;
	justify-content:space-between;
	align-items:center;
	color:white;
}

#googlemaps {
	position:absolute;
	width:100%;
	height:100%;
	top:0;right:0;bottom:0;left:0;
}

/* #googlemaps:not([view-mode="fullscreen"]) div.gm-style button[title*="fullscreen"] {display: none}
#googlemaps:not([view-mode="fullscreen"]) div.gm-style button[title*="inteiro"] {display: none} */

#googlemaps:not([view-mode="fullscreen"]) div.gm-style > div:nth-child(9) button:first-child {display: none}


/* Marker Styles */

.right-side-graphics {
	position:absolute;
	right:-25px;
	bottom:0;
	width:15px;
	height:100%;
}

.mapbox-graphics span {
	position:absolute;
	bottom:0;
	left:0;
	background:#f0e400;
}

.right-side-graphics span:nth-child(1) {
	width:1px;
	height:50%;
}

.right-side-graphics span:nth-child(2) {
	width:0;
	height:1px;
	bottom:50%;
	margin-bottom:2px;
	-webkit-animation: widthflicker 0.75s linear infinite;
	-moz-animation: widthflicker 0.75s linear infinite;
	-o-animation: widthflicker 0.75s linear infinite;
	animation: widthflicker 0.75s linear infinite;
	animation-delay: 0s;
}

.right-side-graphics span:nth-child(3) {
	width:0;
	height:1px;
	bottom:50%;
	margin-bottom:5px;
	-webkit-animation: widthflicker 1s linear infinite;
	-moz-animation: widthflicker 1s linear infinite;
	-o-animation: widthflicker 1s linear infinite;
	animation: widthflicker 1s linear infinite;
	animation-delay: 0.15s;
}

.right-side-graphics span:nth-child(4) {
	width:0;
	height:1px;
	bottom:50%;
	margin-bottom:8px;
	-webkit-animation: widthflicker 2s linear infinite;
	-moz-animation: widthflicker 2s linear infinite;
	-o-animation: widthflicker 2s linear infinite;
	animation: widthflicker 2s linear infinite;
	animation-delay: 1s;
}

@-webkit-keyframes widthflicker {
    0% {width:0;}
    25% {width:100%;}
    75% {width:25%;}
    85% {width:100%;}
    100% {width:0;}
}

@keyframes widthflicker {
    0% {width:0;}
    25% {width:100%;}
    75% {width:25%;}
    85% {width:100%;}
    100% {width:0;}
}

.top-side-graphics {
	position:absolute;
	top:-15px;
	left:0;
	width:50%;
	height:3px;
}

.top-side-graphics span:nth-child(1) {
	width:3px;
	height:3px;
}

.top-side-graphics span:nth-child(2) {
	width:3px;
	height:3px;
	margin-left:9px;
}

.top-side-graphics span:nth-child(3) {
	width:3px;
	height:3px;
	margin-left:18px;
}

.top-side-graphics span:nth-child(4) {
	width:0;
	height:1px;
	bottom:1px;
	margin-left:30px;
	-webkit-animation: longwidthflicker 5s linear infinite;
	-moz-animation: longwidthflicker 5s linear infinite;
	-o-animation: longwidthflicker 5s linear infinite;
	animation: longwidthflicker 5s linear infinite;
}

@-webkit-keyframes longwidthflicker {
    0% {width:0;}
    15% {width:50%;}
    40% {width:45%;}
    65% {width:60%;}
    70% {width:50%;}
    100% {width:0;}
}

@keyframes longwidthflicker {
    0% {width:0;}
    15% {width:50%;}
    40% {width:45%;}
    65% {width:60%;}
    70% {width:50%;}
    100% {width:0;}
}

/* Marker box on click */

/* .gm-style .gm-style-iw-c {
	border-bottom-left-radius:0;
} */

.gm-style .gm-style-iw-tc:after {
	clip-path:polygon(0% 0%,50% 100%,100% 0%);
	left:0;
	width:20px;
}

.gm-ui-hover-effect {
	transform:translate(-50%,50%);
	position:absolute!important;
	right:-8px;
	top:-5px;
}

/*
.google-original-close-btn {
	opacity:0!important;
}

.mapbox-close-btn {
	display:none;
	position:absolute;
	right:17px;
} */

.gm-style-iw {
    /* width: 310px !important;
    top: 15px !important; */
    /* left: 100px !important; */
    background-color: #eeeeee;
    border: none;
    overflow:visible!important;
}
#mapbox {
    /* width: 310px !important; */
    color: #bfbfbf;
    /* padding: 20px 25px 20px 25px; */
	padding:15px 50px 15px 20px;
}
#mapbox p {
    cursor: text;
}
#mapbox p a {
    text-decoration: underline;
}
.mapbox-header {
    width: 100%;
    text-align: left;
    line-height: 1;
    padding: 0;
    margin: 0 0 10px 0;
    background:none;
}

.mapbox-items {font-size:0.9rem; display:block;border-bottom:1px solid #dddddd;line-height:1.65;}

h2.firstHeading {text-align:left;color: rgba(0,0,0,1);}
h2.secondHeading {text-align:left;}

.red-color {color:#ff0000;}
.yellow-color {color:#bca136;}
.green-color {color:#5db026;}

/* Terminal Monitoring Specific */

.terminal-monitoring {
	margin-top:calc(var(--basepadding)*4);
}

.terminal-monitoring > .terminal-monitoring-header > div {
	display:grid;
	align-items:center;
	justify-content:space-between;
	grid-template-columns:max-content 1fr;
	gap:var(--basespacing);
}

.terminal-monitoring-actions {
	width:100%;
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:calc(var(--basespacing)*2);
}

.terminal-monitoring-actions > .input-wrapper {
	width:min(100%,500px);
}

.terminal-monitoring > content {
	max-width:none;
	display:flex;
	flex-direction:column;
	overflow:visible;

	width:100%;
	height:auto;
}

.terminal-monitoring-item {
	display:grid;
	grid-template-columns:20px 1fr;
	gap:calc(var(--basespacing)*2);
	/* padding:calc(var(--basepadding)*1.5) 0; */
	padding:var(--basespacing) 0;
}

.terminal-monitoring-item:not(:last-child) {
	border-bottom:1px solid var(--gray5);
}

.terminal-monitoring-item-content {
	display:flex;
	flex-direction:column;
	gap:var(--basespacing);
}

.terminal-monitoring-item-row {
	display:flex;
	gap:15px;
}

.terminal-status[data-status="on"] {width:4px;height:4px;background:var(--green);align-self:center}
.terminal-status[data-status="waiting"] {color:var(--gray4)}
.terminal-status[data-status="suspended"] {color:var(--gray4)}
.terminal-status[data-status="pend"] {color:var(--yellow)}
.terminal-status[data-status="off"] {color:var(--red)}

/* .terminal-monitoring-item-row:not(:last-child) {border-bottom:1px solid var(--gray5)} */

.terminal-monitoring-item-row .h-detail span:first-child,
.terminal-monitoring-item-row .v-detail span:first-child {color:var(--gray3)}

.terminal-monitoring-item-row .h-detail {
	display:flex;
	align-items:center;
	gap:3px;
}
.terminal-monitoring-item-row .v-detail {
	display:flex;
	flex-direction:column;
}

.terminal-monitoring-item-actions {
	margin-left:auto;
	display:flex;
	align-items:center;
	gap:5px;
}

#monitoringterminals-table tbody tr > td:last-child {
	display:flex;
	align-items:center;
	justify-content:flex-end;
}

#monitoringterminals-table thead tr > th:last-child {
	text-align:right;
}

#monitoringterminals-table tbody tr > td:not(:last-child) {
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#monitoringterminals-table tbody tr > td:nth-child(4) {
	max-width:40px;
	padding:0;
	margin-left:19px;
	width:26px;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	background:transparent;
}

/* // Dashboard */

/* // Admin subusers */

.item-subuser {
	display:flex;
	align-items:center;
	justify-content:space-between;
	border-top:1px solid var(--gray5);
	border-bottom:1px solid var(--gray5);
	margin-bottom:-1px;
	padding:calc(var(--basespacing)*1) 0;
	font-size:var(--SbuttonFONTsize);
	color:var(--primarydarkcolor);
}

.item-subuser .item-subuser-content {
	display:flex;
	flex-direction:column;
	gap:calc(var(--basespacing)*0.3);
	white-space:nowrap;
	overflow:hidden;
	max-width:calc(100% - 70px);
}

.item-subuser .item-subuser-content > div {
	display:flex;
	align-items:center;
	gap:calc(var(--basespacing)*0.6);
}

.item-subuser .item-subuser-content > div > span:nth-child(2) {
	overflow:hidden;
	text-overflow:ellipsis;
}

.item-subuser .item-subuser-content > div:nth-child(1) span:nth-child(1) {
	color:black;
}

.item-subuser .item-subuser-content > div:nth-child(1) span:nth-child(2) {
	color:var(--gray3);
	line-height:1;
}

.item-subuser .item-subuser-content > div:nth-child(2) {
	display:flex;
	align-items:center;
	gap:calc(var(--basespacing)*0.3);
	color:black;
	line-height:1;
}

.item-subuser .item-subuser-content > div:nth-child(2) span {
	color:var(--secondarycolor);
}

.item-subuser .item-subuser-content > div:nth-child(2) span:nth-child(2) {
	text-decoration:underline;
}


#terminalSelect {
	width:100%;
}

#terminalSelect .dropdown-content {
	max-width:unset;
}

#terminalSelect .ungroupped-terminals {
	margin-top:0;
}

#terminalSelect .ungroupped-terminals {
	margin-top:0;
}

#terminalSelect .terminal-group li.item-group {
	border-bottom:1px solid var(--gray3);
	color:white;
	display:grid;
	grid-template-columns:max-content 1fr max-content max-content;
	align-items:center;
}

#terminalSelect .terminal-group li.item-group .group-content,
#terminalSelect .terminal-group li.item-group .terminalgroupname {
	height:auto;
}

#terminalSelect .terminal-group li.item-group .group-content {
	max-width:none;
}

#terminalSelect .terminal-group li.item-group button {
	border:none;
}

#terminalSelect .terminal-group li.item-group button i {
	margin:0;
}

#terminalSelect .empty-terminal-group, .empty-ungroupped-terminals {
	border-bottom:1px solid var(--gray5);
}

#terminalSelect .item-group:before,
#terminalSelect .item-terminal:before,
#terminalSelect .empty-terminal-group:before,
#terminalSelect .empty-ungroupped-terminals:before {
	background:rgba(0,0,0,0.3);
}

#terminalSelect:not(.ungroupped-only) .terminal-group:first-child {
	border-top:1px solid var(--gray3);
}

#terminalSelect:not(.ungroupped-only) .ungroupped-terminals {
	margin-top:calc(var(--basespacing)*2);
}

#terminalSelect .empty-terminal-group, #scheduleTerminals .empty-ungroupped-terminals {
	display:none;
	border-bottom:1px solid var(--gray3);
}

#terminalSelect .empty-ungroupped-terminals {
	border-top:1px solid var(--gray3);
}

/* .item-subuser .item-subuser-actions button {
	background:var(--secondarycolor);
	color:white;
		transition:all 0.15s var(--normal-easing);
		-webkit-transition:all 0.15s var(--normal-easing);
		-moz-transition:all 0.15s var(--normal-easing);
		-ms-transition:all 0.15s var(--normal-easing);
		-o-transition:all 0.15s var(--normal-easing);
} */

/* ///////////////////////// */
/* 
/* 		//Content Stuff
/* 
/* ///////////////////////// */

/* ///////////////////////// */
/* 
/* 		Media Queries that work only on specific resolution
/* 
/* ///////////////////////// */

@media screen and (max-width:1720px) and (min-width:1350px) { /* "Normal" Resolution -- As in same as no media queries */
	
}

@media screen and (max-width: 1350px) and (min-width:1250px) { /* Made specifically so it is possible to use list style of video in "m" resolution */

}

@media screen and (max-width: 1250px) and (min-width:1024px) { /* Made specifically so it is possible to use list style of video in "sm" resolution */

}

@media screen and (max-width: 1024px) and (min-width:800px) { /* Made specifically so it is possible to use list style of video in "smm" resolution */

}

@media screen and (max-width: 800px) and (min-width:650px) { /* Made specifically so it is possible to use list style of video in "s" resolution */

}

/* ///////////////////////// */
/* 
/* 		end of /Media Queries that work only on specific resolution
/* 
/* ///////////////////////// */

/* ///////////////////////// */
/* 
/* 		Standard Media Queries
/* 
/* ///////////////////////// */

@media screen and (min-width: 1600px) {

}

@media screen and (min-width: 1900px) {

	:root {
		--pagepadding:70px;
	}

	.box-body .ui-droppable#seeSchedule {min-height:calc(100vh - 405px);height:auto}

}

@media screen and (min-width: 2300px) {

}

@media screen and (max-width: 1720px) and (min-width:1550px) {

	.item-schedule-playlist .weekrepeatdetails.smaller label {
		padding-left:0;
		padding-right:0;
		width:21px;
		color:rgba(255,255,255,0);
	}

	.item-schedule-playlist .weekrepeatdetails.smaller label:after {
		font-family: 'Abel';
		text-transform:uppercase;
		top:50%;
		left:50%;
		transform:translate(-50%,-50%);
	}

	.item-schedule-playlist .weekrepeatdetails.smaller [type="checkbox"]:not(:checked) + label:after {
		opacity:1;
		background:transparent;
		color:var(--gray4);
	}

	.item-schedule-playlist .weekrepeatdetails.smaller [type="checkbox"]:not(:checked) + label:before,
	.item-schedule-playlist .weekrepeatdetails.smaller [type="checkbox"]:checked + label:before {
		background:transparent;
	}

	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Sun"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Sun"]:after {content:"S";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Mon"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Mon"]:after {content:"M";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Tue"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Tue"]:after {content:"T";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Wed"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Wed"]:after {content:"W";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Thu"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Thu"]:after {content:"T";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Fri"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Fri"]:after {content:"F";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Sat"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Sat"]:after {content:"S";}

	.schedule-to-terminal-action[data-toggle="dropdown"] .dropdown-menu {
		min-width:calc(100vw - 902px);
	}

	.schedule-to-terminal-action[data-toggle="dropdown"] .dropdown-menu #scheduleTerminals {
		min-width:calc(100vw - 902px);
		max-width:calc(100vw - 902px);
	}
}

@media screen and (max-width: 1475px) and (min-width:1320px) {

	.item-schedule-playlist .weekrepeatdetails.smaller label {
		padding-left:0;
		padding-right:0;
		width:21px;
		color:rgba(255,255,255,0);
	}

	.item-schedule-playlist .weekrepeatdetails.smaller label:before,
	.item-schedule-playlist .weekrepeatdetails.smaller label:after {
		font-family: 'Abel';
		text-transform:uppercase;
		top:50%;
		left:50%;
		transform:translate(-50%,-50%);
	}

	.item-schedule-playlist .weekrepeatdetails.smaller [type="checkbox"]:not(:checked) + label:after {
		opacity:1;
		background:transparent;
		color:var(--gray4);
	}

	.item-schedule-playlist .weekrepeatdetails.smaller [type="checkbox"]:not(:checked) + label:before,
	.item-schedule-playlist .weekrepeatdetails.smaller [type="checkbox"]:checked + label:before {
		background:transparent;
	}

	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Sun"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Sun"]:after {content:"S";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Mon"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Mon"]:after {content:"M";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Tue"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Tue"]:after {content:"T";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Wed"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Wed"]:after {content:"W";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Thu"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Thu"]:after {content:"T";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Fri"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Fri"]:after {content:"F";}
	.item-schedule-playlist .weekrepeatdetails.smaller label[for="Sat"]:before, .item-schedule-playlist .weekrepeatdetails.smaller label[for="Sat"]:after {content:"S";}
}

@media screen and (max-width: 1320px) and (min-width:900px) {
	.schedule-playlist-propertiesinfo {
		grid-template-columns:max-content 1fr;
		grid-template-rows:max-content max-content;
		grid-column-gap: calc(var(--basespacing)*1);
		grid-row-gap: calc(var(--basespacing)*3);
	}

	.item-schedule-playlist .confHours {
		justify-self:start;
	}

	.item-schedule-playlist .confWeekRepeat {
		grid-column:1/-1;
		grid-row:2;
		justify-self:center;
		width:100%;
	}

	.item-schedule-playlist .confWeekRepeat .weekrepeatdetails {
		justify-content:space-between;
		grid-template-columns:repeat(7, 1fr);
	}

	/* .weekrepeatdetails.smaller label {
		padding-left:0;
		padding-right:0;
		width:21px;
		color:rgba(255,255,255,0);
	}

	.weekrepeatdetails.smaller label:before, .weekrepeatdetails.smaller label:after {
		font-family: 'Abel';
		text-transform:uppercase;
		top:50%;
		left:50%;
		transform:translate(-50%,-50%);
	}

	.weekrepeatdetails.smaller [type="checkbox"]:not(:checked) + label:after {
		opacity:1;
		background:transparent;
		color:var(--gray4);
	}

	.weekrepeatdetails.smaller [type="checkbox"]:not(:checked) + label:before,
	.weekrepeatdetails.smaller [type="checkbox"]:checked + label:before {
		background:transparent;
	}

	.weekrepeatdetails.smaller label[for="Sun"]:before, .weekrepeatdetails.smaller label[for="Sun"]:after {content:"S";}
	.weekrepeatdetails.smaller label[for="Mon"]:before, .weekrepeatdetails.smaller label[for="Mon"]:after {content:"M";}
	.weekrepeatdetails.smaller label[for="Tue"]:before, .weekrepeatdetails.smaller label[for="Tue"]:after {content:"T";}
	.weekrepeatdetails.smaller label[for="Wed"]:before, .weekrepeatdetails.smaller label[for="Wed"]:after {content:"W";}
	.weekrepeatdetails.smaller label[for="Thu"]:before, .weekrepeatdetails.smaller label[for="Thu"]:after {content:"T";}
	.weekrepeatdetails.smaller label[for="Fri"]:before, .weekrepeatdetails.smaller label[for="Fri"]:after {content:"F";}
	.weekrepeatdetails.smaller label[for="Sat"]:before, .weekrepeatdetails.smaller label[for="Sat"]:after {content:"S";} */
}

@media screen and (max-width: 1550px) {

	.steps {
		grid-gap:calc(var(--basepadding)*1);
	}

	.step-1[data-mode="active-list"] {grid-template-columns:250px 40px 1fr;}
	.step-1[data-mode="active-content"] {grid-template-columns:40px 3fr 4fr;}

	.step-2[data-mode="active-list"] {grid-template-columns:250px 40px 1fr;}
	.step-2[data-mode="active-content"] {grid-template-columns:40px 1fr 250px;}

	.box.collapsed {position:relative;}
	.box.collapsed:after {
		opacity:1;
		content: attr(data-collapsed-text);
		padding:0 0 0 calc(var(--basespacing)*3.5);
		font-size:21px;
		color:var(--gray2);
		position:absolute;
		width:500%;
		left:50%;
		top:0;
		transform-origin:left center;
		transform:translate(0,-50%) rotate(90deg);
		-webkit-transform:translate(0,-50%) rotate(90deg);
		-moz-transform:translate(0,-50%) rotate(90deg);
		-ms-transform:translate(0,-50%) rotate(90deg);
		-o-transform:translate(0,-50%) rotate(90deg);
	}

	.box.collapsed:before {
		content:"add";
		opacity:1;
		font-size:20px;
		color:var(--gray2);
		position:absolute;
		width:100%;
		left:0;right:0;
		bottom:0;
		padding-bottom:var(--basespacing);
			line-height:1;
			text-align:center;
			font-family: 'Material Icons';
			font-style: normal;
			direction: ltr;
			vertical-align:middle;
	}

	.box.collapsed .box-header,
	.box.collapsed .box-body {
		display:none!important;
	}

	.box.collapsed {cursor:pointer;}

	.schedule-to-terminal-action[data-toggle="dropdown"] .dropdown-menu {
		min-width:calc(100vw - 662px);
	}

	.schedule-to-terminal-action[data-toggle="dropdown"] .dropdown-menu #scheduleTerminals {
		min-width:calc(100vw - 662px);
		max-width:calc(100vw - 662px);
	}

	/* Dashboard */

	.dashboard-totalscreens-card .box-body,
	.dashboard-storage-card .box-body,
	.dashboard-screensreport .box-body {
		padding:calc(var(--basepadding)*3) calc(var(--basepadding)*2)
	}

	.dashboard-log-card .box-body {
		max-height:526px; /* To scroll on overflow */
	}

	.storage-content {
		justify-content:center;
	}

	.graph-container {
		aspect-ratio:1/1;
		width:110px;
		height:110px;
	}
}


@media screen and (max-width: 1367px) {

	/*

	.dropdown-toggle, .dropdown-toggle.btn-s {
		padding:0 calc(var(--basespacing)*2.5) 0 var(--basespacing);
	}

	.dropdown .dropdown-label,
	.dropdown-toggle .dropdown-maintext {
		display:none;
	}

	.dropdown-toggle .dropdown-icon {
		display:block;
		color:var(--primarydarkcolor);
	}

	.sort-order {
		color:var(--primarydarkcolor);
	}

	.dropdown-toggle.btn-s:after {
		border:none;
		color:var(--gray5);
	}

	.filters {
		grid-gap:calc(var(--basespacing)*1);
	}

	.filters.btn-group {
		grid-gap:calc(var(--basespacing)*0);	
	}

	*/

	/* Dashboard */

	.dashboard-totalscreens-card .box-body,
	.dashboard-storage-card .box-body,
	.dashboard-screensreport .box-body {
		padding:calc(var(--basepadding)*3) calc(var(--basepadding)*2)
	}

	.storage-content {
		justify-content:center;
	}

	.graph-container {
		aspect-ratio:1/1;
		width:80px;
		height:80px;
	}

	.graph-container .percentage-text {
		font-size:22px;
	}

	.screensreport-content {
		grid-template-columns:50px 1fr;
		gap:calc(var(--basespacing)*2.2);
	}

	.screens-icon-container {
		width:50px;
		height:50px;
	}

	.screens-icon-container i {
		font-size:22px;
	}

	.dashboard-log-card .empty .empty-thumbnail {
		max-width:90px;
	}

}

@media screen and (max-width: 1280px) {
	/*.delete-mainbtn i, .delete-mainbtn i.button-icon {
		margin:0;
	}

	.delete-mainbtn *:not(i) {display:none;}
	:root {
		--sidebar-width:40px;
	}

	.main-logo {
		display:none;
	}

	.mobile-logo {
		display:block;
	}*/

	.item-schedule-playlist {
		grid-template-areas:
		"color name actions"
		"gap date date"
		"gap cycleduration cycleduration"
		"gap time time"
		"totalduration totalduration"
		"days days"
		"cycles cycles";
		grid-row-gap: calc(var(--basespacing)*0.5);
		grid-column-gap: calc(var(--basespacing)*1);
		align-items:center;
		justify-content:left;
	}

	.schedule-playlist-date {grid-area:date;grid-column-start: 2;grid-column-end: 4;grid-row:2;}
	.schedule-playlist-time {grid-area:time;grid-column-start: 2;grid-column-end: 4;grid-row:3;}
	.schedule-playlist-days {grid-area:days;grid-column-start: 2;grid-column-end: 4;grid-row:4;}
	.schedule-playlist-cycleduration {grid-area:cycleduration;grid-column-start: 2;grid-column-end: 4;grid-row:5;}
	.schedule-playlist-totalduration {grid-area:totalduration;grid-column-start: 2;grid-column-end: 4;grid-row:6;}
	.schedule-playlist-cycles {grid-area:cycles;grid-column-start: 2;grid-column-end: 4;grid-row:7;}

	#PlaylistContentCard .delete-mainbtn {
		width:var(--lineheightSM);
		padding:0;
		transform:scale(1.25);
		-webkit-transform:scale(1.25);
		-moz-transform:scale(1.25);
		-ms-transform:scale(1.25);
		-o-transform:scale(1.25);
	}
	#PlaylistContentCard .delete-mainbtn .btn-text {display:none}
	#PlaylistContentCard .delete-mainbtn .button-icon {margin-right:0;font-size:14px!important}

	/* Dashboard */

	.dashboard-totalscreens-card .box-body,
	.dashboard-storage-card .box-body,
	.dashboard-screensreport .box-body {
		padding:calc(var(--basepadding)*3) calc(var(--basepadding)*1.5)
	}

	.storage-content {
		gap:calc(var(--basespacing)*2);
	}

	.graph-container {
		aspect-ratio:1/1;
		width:72px;
		height:72px;
	}

	.graph-container .percentage-text {
		font-size:20px;
	}

	.screensreport-content {
		gap:calc(var(--basespacing)*1.8);
	}

	/* .screens-icon-container {
		width:50px;
		height:50px;
	}

	.screens-icon-container i {
		font-size:22px;
	} */

	.dashboard-container h4 {
		font-size:16px;
	}

	.dashboard-container h2.box-title {
		font-size:22px;
	}
}

@media screen and (max-width: 1180px) {

	#small-screen-warning {display:flex;}

}

@media screen and (max-width: 1024px) {



}

@media screen and (max-width: 800px) {


	
}

@media screen and (max-width: 650px) {
	


}

@media screen and (max-width: 500px) {

	.login-box-wrapper {
		margin:0 auto;
	}

}

@media screen and (max-height: 800px) {

}

@media screen and (max-height: 800px) and (max-width: 450px) {

}


#editGroupModal .item-schedule-terminal.dropdown-item {
	opacity:1;
	transform:none;
}

#editGroupModal .item-group-terminals {
	transform:none;
}

#editGroupModal li.item-group .group-content, #editGroupModal li.item-group .group-content, #editGroupModal .terminalgroupname {
	height:auto;
}

#editGroupModal .dropdown-item [type="checkbox"]:not(:checked) + label:before,
#editGroupModal .dropdown-item [type="radio"]:not(:checked) + label:before {
	background:rgba(0,0,0,0.1);
}

#editGroupModal .dropdown-item [type="checkbox"]:checked + label:before,
#editGroupModal .dropdown-item [type="radio"]:checked + label:before {
	background:rgba(0,0,0,0.02);
}

#editGroupModal .dropdown-item [type="checkbox"]:checked + label:after,
#editGroupModal .dropdown-item [type="radio"]:checked + label:after {
	color:var(--primarycolor);
}

.height-auto {height:auto}