/* =================================================================================================================== *


RRRRRRRRRRRRRRRRR IIIIIIIIII DDDDDDDDDDDDD AAA
R::::::::::::::::R I::::::::I D::::::::::::DDD A:::A
R::::::RRRRRR:::::R I::::::::I D:::::::::::::::DD A:::::A
RR:::::R R:::::R II::::::II DDD:::::DDDDD:::::D A:::::::A
R::::R R:::::R I::::I D:::::D D:::::D A:::::::::A
R::::R R:::::R I::::I D:::::D D:::::D A:::::A:::::A
R::::RRRRRR:::::R I::::I D:::::D D:::::D A:::::A A:::::A
R:::::::::::::RR I::::I D:::::D D:::::D A:::::A A:::::A
R::::RRRRRR:::::R I::::I D:::::D D:::::D A:::::A A:::::A
R::::R R:::::R I::::I D:::::D D:::::D A:::::AAAAAAAAA:::::A
R::::R R:::::R I::::I D:::::D D:::::D A:::::::::::::::::::::A
R::::R R:::::R I::::I D:::::D D:::::D A:::::AAAAAAAAAAAAA:::::A
RR:::::R R:::::R II::::::II DDD:::::DDDDD:::::D A:::::A A:::::A
R::::::R R:::::R ...... I::::::::I ...... D:::::::::::::::DD ...... A:::::A A:::::A ......
R::::::R R:::::R .::::. I::::::::I .::::. D::::::::::::DDD .::::. A:::::A A:::::A .::::.
RRRRRRRR RRRRRRR ...... IIIIIIIIII ...... DDDDDDDDDDDDD ...... AAAAAAA AAAAAAA ......


* =================================================================================================================== */

:root {

/* --tree-color: #1B885E;
--yellow: #FFFC5E; */
}


.box-canvas{
position: relative;
margin: auto;
display: block;
margin-top: 10vmin;
margin-bottom: 10vmin;
width: 80vmin;
height: 80vmin;
}




/* =================================*
* *
* !GLOBAL COLORS *
* *
*================================= */
:root {

--light-blue : #37b8d2;
--teal : #016481;
--dark-blue : #3556c2;
--red : #c23535;
--orange : #EF8F35;
--purple : #7D3BB4;
--green : #3C9035;
--light-grey : #f1f1f1;
--yellow : #ffeb3b;
--grey : #aaaaaa;
--black : #000000;
--dark-grey : #818181;
--dark-red : #990000;
--dark-yellow : #ffd700;
--fuschia : #e91e8e;
--blue : #4C7BDD;
--dark-green : #286123;
--wine : #913269;
--dark-purple : #491c6f;
--light-black : #393938;
--pink : #ce5e61;
--alpha-blue : rgba(76,123,221,0.1);
--alpha-green : rgba(60, 144, 53, 0.1);
--alpha-red : rgba(194, 53, 53, 0.1);
--alpha-orange : rgba(239, 143, 53, 0.1);
--alpha-purple : rgba(125, 59, 180, 0.1);
--alpha-teal : rgba(1, 100, 129, 0.1);
--alpha-blue-old : rgba(237,241,252);
--white: #ffffff;
--offwhite: #f9f9f9;

--new : #37b8d2;
--requested : #37b8d2;
--new : #37b8d2;
--reset : #016481;
--booked : #3556c2;
--canceled : #c23535;
--rescheduled : #EF8F35;
--completed : #7D3BB4;
--sold : #3C9035;
--archived : #000000;
--moved : #818181;
--disqualified : #990000;
--disqualified : #990000;
--onhold : #ffd700;
--remorse : #e91e8e;
--turndown : #913269;
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after {
display: none !important;
}
th.sorting .svg-inline--fa,
th.sorting_desc .svg-inline--fa,
th.sorting_asc .svg-inline--fa {
margin: 0 3px;
}

/* =================================*
* *
* !FILLED BUTTON COLORS *
* *
*================================= */

.btn.fill {
border-color: transparent !important;
}
.fill.new { 
background-color: var(--new);
color: #ffffff;
}
.fill.requested { 
background-color: var(--requested);
color: #ffffff;
}
.fill.new { 
background-color: var(--new);
color: #ffffff;
}
.fill.reset { 
background-color: var(--reset);
color: #ffffff;
}
.fill.booked { 
background-color: var(--booked);
color: #ffffff;
}
.fill.canceled { 
background-color: var(--canceled);
color: #ffffff;
}
.fill.rescheduled { 
background-color: var(--rescheduled);
color: #ffffff;
}
.fill.completed { 
background-color: var(--completed);
color: #ffffff;
}
.fill.sold { 
background-color: var(--sold);
color: #ffffff;
}
.fill.archived { 
background-color: var(--archived);
color: #ffffff;
}
.fill.moved { 
background-color: var(--moved);
color: #ffffff;
}
.fill.disqualified { 
background-color: var(--disqualified);
color: #ffffff;
}
.fill.disqualified { 
background-color: var(--disqualified);
color: #ffffff;
}
.fill.onhold { 
background-color: var(--onhold);
color: #000000;
}
.fill.remorse { 
background-color: var(--remorse);
color: #ffffff;
}
.fill.turndown { 
background-color: var(--turndown);
color: #ffffff;
}


.fill.priority {
background-color: var(--yellow);
color: var(--black);
}

/* =================================*
* *
* !GHOST BUTTON COLORS *
* *
*================================= */
.ghost {
border: 1px solid transparent;
background-color: transparent !important;
}
.ghost.new { 
border-color: var(--new);
color: #37b8d2;
}
.ghost.requested { 
border-color: var(--requested);
color: #37b8d2;
}
.ghost.new { 
border-color: var(--new);
color: #37b8d2;
}
.ghost.reset { 
border-color: var(--reset);
color: #016481;
}
.ghost.booked { 
border-color: var(--booked);
color: #3556c2;
}
.ghost.canceled { 
border-color: var(--canceled);
color: #c23535;
}
.ghost.rescheduled { 
border-color: var(--rescheduled);
color: #EF8F35;
}
.ghost.completed { 
border-color: var(--completed);
color: #7D3BB4;
}
.ghost.sold { 
border-color: var(--sold);
color: #3C9035;
}
.ghost.archived { 
border-color: var(--archived);
color: #000000;
}
.ghost.moved { 
border-color: var(--moved);
color: #818181;
}
.ghost.disqualified { 
border-color: var(--disqualified);
color: #990000;
}
.ghost.disqualified { 
border-color: var(--disqualified);
color: #990000;
}
.ghost.onhold { 
border-color: var(--onhold);
color: #ffd700;
}
.ghost.remorse { 
border-color: var(--remorse);
color: #e91e8e;
}
.ghost.turndown { 
border-color: var(--turndown);
color: #913269;
}


/* =================================*
* *
* !DTSP COLORS *
* *
*================================= */

.dtsp-name .new {
background-color: var(--light-blue);
}
.dtsp-name .requested {
background-color: var(--light-blue);
}
.dtsp-name .reset {
background-color: var(--teal);
}
.dtsp-name .onhold {
background-color: var(--dark-yellow);
}
.dtsp-name .booked {
background-color: var(--dark-blue);
}
.dtsp-name .disqualified {
background-color: var(--dark-red);
}
.dtsp-name .canceled {
background-color: var(--red);
}
.dtsp-name .rescheduled {
background-color: var(--orange);
}
.dtsp-name .completed {
background-color: var(--purple);
}
.dtsp-name .remorse {
background-color: var(--fuschia);
}
.dtsp-name .turndown {
background-color: var(--purple);
}
.dtsp-name .sold {
background-color: var(--green);
}
.dtsp-name .archived {
background-color: var(--black);
}
.dtsp-name .priority {
background-color: var(--yellow);
}

/* =================================*
* *
* !SHIFT COLORS *
* *
*================================= */
.shift.morning {
background-color: var(--green);
color: var(--white);
}

.shift.noon {
background-color: var(--teal);
color: var(--white);
}

.shift.evening {
background-color: var(--dark-blue);
color: var(--white);
}

.shift.afternoon {
background-color: var(--purple);
color: var(--white);
}


/* =================================*
* *
* !TEXT COLORS *
* *
*================================= */

.text.new { 
color: var(--new);
}
.text.requested { 
color: var(--requested);
}
.text.new { 
color: var(--new);
}
.text.reset { 
color: var(--reset);
}
.text.booked { 
color: var(--booked);
}
.text.canceled { 
color: var(--canceled);
}
.text.rescheduled { 
color: var(--rescheduled);
}
.text.completed { 
color: var(--completed);
}
.text.sold { 
color: var(--sold);
}
.text.archived { 
color: var(--archived);
}
.text.moved { 
color: var(--moved);
}
.text.disqualified { 
color: var(--disqualified);
}
.text.disqualified { 
color: var(--disqualified);
}
.text.onhold { 
color: var(--onhold);
}
.text.remorse { 
color: var(--remorse);
}
.text.turndown { 
color: var(--turndown);
}



/* =================================*
* *
* !TABLE COLUMNS *
* *
*================================= */
.column-dark-blue {
background-color: #3556c233;
color: #ffffff;
}
.column-light-blue {
background-color: #37b8d233;
}
.column-teal {
background-color: #01648133;
}
.column-dark-red {
background-color: #99000033;
}
.column-red {
background-color: #c2353533;
}
.column-orange {
background-color: #EF8F3533;
}
.column-purple {
background-color: #7D3BB433;
}
table.dataTable.fixedHeader-floating {
border-bottom: 1px solid var(--light-grey);
}

/* =================================*
* *
* !ACTION ICONS :: BASE *
* *
*================================= */
.action {
font: normal normal 400 13px/0px 'Font Awesome 6 Pro' !important;
padding: 3px !important;
border: none;
}
.action::before {
font: var(--fa-font-solid);
}
/* =================================*
* *
*. !ACTION ICONS :: GENERAL *
* *
*================================= */
.action.user-edit {
color: var(--orange);
content: "\f4ff";
}

.action.user-remove {
color: var(--red);
content: "\f235";
}

.action.mrp-remove {
color: var(--purple);
content: "\f235";
}

.action.mrp-add {
color: var(--purple);
content: "\f234";
}

.action.external {
color: var(--orange);
content: "\f08e";
}

.action.cancel {
color: var(--red);
content: "\f273";
}

.row-remove {
font-size: 24px;
margin-top: 15px;
line-height: 24px;
}
.row-remove {
font-family: 'Font Awesome 6 Pro' !important;
color: var(--red);
content: "\f146";

}

.row-remove.disabled {
color: var(--light-grey);
}

.action.availability {
color: var(--green);
content: "\f4fd";
}

.action.calls {
color: var(--green);
content: "\f590";
}

.action.programs {
color: var(--light-blue);
content: "\f625";
}

.action.demos {
color: var(--dark-blue);
content: "\f274";
}

.action.reschedule {
color: var(--light-blue);
content: "\f073";
}

.action.active {
color: var(--light-blue);
content: "\f06e";
}

.action.inactive {
color: var(--grey);
content: "\f070";
}

.action.edit {
color: var(--orange);
content: "\f044";
}

.action.remove {
color: var(--red);
content: "\f2ed";
}

.action.history {
color: var(--light-blue);
content: "\f1da";
}

.action.configure {
color: var(--light-blue);
content: "\f085";
}

.action.qrcode {
color: var(--light-blue);
content: "\f029";
}

.action.customize {
color: var(--green);
content: "\f12e";
}

.action.scan {
color: var(--white);
content: "\f488";
}

.action.archive {
color: var(--dark-grey);
content: "\f187";
}

.action.unarchive {
color: var(--grey);
content: "\f187";
}

.action.export {
color: var(--dark-red);
content: "\f56e";
}

.action.import {
color: var(--blue);
content: "\f56f";
}

.action.search {
color: var(--white);
content: "\f002";
}

.action.notes {
color: var(--orange);
content: "\f732";
}

.action.view {
color: var(--light-blue);
content: "\f1e5";
}

.action.profile {
color: var(--green);
content: "\f007";
}

.action.leads {
color: var(--purple);
content: "\f6ff";
}

.action.complete {
color: var(--green);
content: "\f164";
}

.action.funded {
color: var(--green);
content: "\f3d1";
}

.action.revoke {
color: var(--red);
content: "\f05e";
}

.action.check {
color: var(--green);
content: "\f058";
}

.action.book {
color: var(--dark-blue);
content: "\f02d";
}

.action.priority {
color: var(--dark-yellow);
content: "\f521";
font-weight: 900;
text-shadow: 0 0 1px var(--black);
}

.action.training {
color: var(--light-blue);
content: "\f008";
position: relative;
top: 1px;
font-size: 25px;
font-weight: 300;
}

.action.extend {
color: var(--purple);
content: "\f343";
}

.action.switch {
background-color: transparent;
border: none;
color: var(--white);
}

.action.transfer {
color: var(--fuschia);
content: "\e4d1";
}

.action.move {
color: var(--light-blue);
content: "\f079";
}

.action.urllink {
color: var(--dark-blue);
content: "\f0c1";
margin: 0 0;
display: inline;
}

.action.disqualify {
color: var(--dark-red);
content: "\f57a";
}

.action.quicklook {
color: var(--dark-blue);
content: "\f06e";
}

.action.service {
color: var(--yellow);
content: "\f552";
}

.action.service-note {
color: var(--orange);
content: "\f328";
}

.action.service-return {
color: var(--red);
content: "\f33e";
}

.action.accept {
color: var(--green);
content: "\f46c";
}

.action.optional {
color: var(--dark-grey);
content: "\f070";
}

.action.required {
color: var(--green);
content: "\f06e";
}

.action.print {
color: var(--orange);
content: "\f02f";
}

.action.clone {
color: var(--green);
content: "\f24d";
}

.action.delete {
color: var(--red);
content: "\f2ed";
}

.action.reboot {
color: var(--green);
content: "\f2f1";
}

.action.reset {
color: var(--dark-blue);
content: "\f1eb";
}

.action.user-edit::before {
color: var(--orange);
content: "\f4ff";
}

.action.user-remove::before {
color: var(--red);
content: "\f235";
}

.action.hints:before {
color: var(--dark-yellow);
content: "\f672";
}

.action.mrp-remove::before {
color: var(--purple);
content: "\f235";
}

.action.mrp-add::before {
color: var(--purple);
content: "\f234";
}

.action.external::before {
color: var(--orange);
content: "\f08e";
}

.action.cancel::before {
color: var(--red);
content: "\f273";
}
.action.verify::before {
color: var(--orange);
content: "\f0ae";
}
.action.answers:before {
color: var(--blue);
content: '\e1d1';
}

.row-remove {
font-size: 24px;
margin-top: 15px;
line-height: 24px;
}
.row-remove::before {
font-family: 'Font Awesome 6 Pro' !important;
color: var(--red);
content: "\f146";
}

.row-remove.disabled::before {
color: var(--light-grey);
}

.action.availability::before {
color: var(--green);
content: "\f4fd";
}

.action.calls::before {
color: var(--green);
content: "\f590";
}

.action.programs::before {
color: var(--light-blue);
content: "\f625";
}

.action.demos::before {
color: var(--dark-blue);
content: "\f274";
}

.action.reschedule::before {
color: var(--light-blue);
content: "\f073";
}

.action.active::before {
color: var(--light-blue);
content: "\f06e";
}

.action.inactive::before {
color: var(--grey);
content: "\f070";
}

.action.edit::before {
color: var(--orange);
content: "\f044";
}

.action.remove::before {
color: var(--red);
content: "\f2ed";
}

.action.history::before {
color: var(--light-blue);
content: "\f1da";
}

.action.configure::before {
color: var(--light-blue);
content: "\f085";
}

.action.qrcode::before {
color: var(--light-blue);
content: "\f029";
}

.action.customize::before {
color: var(--green);
content: "\f12e";
}

.action.scan::before {
color: var(--white);
content: "\f488";
}

.action.archive::before {
color: var(--dark-grey);
content: "\f187";
}

.action.unarchive::before {
color: var(--grey);
content: "\f187";
}

.action.export::before {
color: var(--dark-red);
content: "\f56e";
}

.action.import::before {
color: var(--blue);
content: "\f56f";
}


.action.search::before {
color: var(--white);
content: "\f002";
}

.action.notes::before {
color: var(--orange);
content: "\f732";
}

.action.view::before {
color: var(--light-blue);
content: "\f1e5";
}

.action.profile::before {
color: var(--green);
content: "\f007";
}

.action.leads::before {
color: var(--purple);
content: "\f6ff";
}

.action.complete::before {
color: var(--green);
content: "\f164";
}

.action.funded::before {
color: var(--green);
content: "\f3d1";
}

.action.revoke::before {
color: var(--red);
content: "\f05e";
}

.action.check::before {
color: var(--green);
content: "\f058";
}

.action.book::before {
color: var(--dark-blue);
content: "\f02d";
}

.action.priority::before {
color: var(--yellow);
content: "\f521";
font-weight: 900;
text-shadow: 0 0 1px var(--black);
}

.action.training::before {
color: var(--light-blue);
content: "\f008";
position: relative;
top: 1px;
font-size: 25px;
font-weight: 300;
}

.action.extend::before {
color: var(--purple);
content: "\f343";
}

.action.switch {
background-color: transparent;
border: none;
color: var(--white);
}

.action.transfer::before {
color: var(--fuschia);
content: "\e4d1";
}

.action.move::before {
color: var(--light-blue);
content: "\f079";
}

.action.urllink::before {
color: var(--dark-blue);
content: "\f0c1";
}

.action.picture::before {
color: var(--dark-blue);
content: "\f03e";
}

.action.disqualify::before {
color: var(--dark-red);
content: "\f57a";
}

.action.quicklook::before {
color: var(--dark-blue);
content: "\f06e";
}

.action.service::before {
color: var(--yellow);
content: "\f552";
}

.action.service-note::before {
color: var(--orange);
content: "\f328";
}

.action.service-return::before {
color: var(--red);
content: "\f33e";
}

.action.accept::before {
color: var(--green);
content: "\f46c";
}

.action.optional::before {
color: var(--dark-grey);
content: "\f070";
}

.action.required::before {
color: var(--green);
content: "\f06e";
}

.action.print::before {
color: var(--orange);
content: "\f02f";
}

.action.clone::before {
color: var(--green);
content: "\f24d";
}

.action.delete::before {
color: var(--red);
content: "\f2ed";
}

.action.reboot::before {
color: var(--green);
content: "\f2f1";
}

.action.reset::before {
color: var(--dark-blue);
content: "\f1eb";
}

/* =================================*
* *
* !PAGE TABS :: BASE *
* *
*================================= */
.tab {
font: normal normal 300 25px/0px 'Font Awesome 6 Pro' !important;
border: none;
}


/* =================================*
* *
* !PAGE TABS :: INVENTORY *
* *
*================================= */

.tab.onhand::before {
color: inherit;
content: "\f468";
}
.tab.holding::before {
color: inherit;
content: "\f47b";
}
.tab.delivered::before {
color: inherit;
content: "\f47c";
}


/* =================================*
* *
* !BOOTSTRAP :: OVERRIDES *
* *
*================================= */
.btn-success { border: 1px solid var(--green);
color: var(--green);
}
.btn-warning { border: 1px solid var(--orange);
color: var(--orange);
}
.btn-danger { border: 1px solid var(--dark-red);
color: var(--dark-red);
}
.btn-default { border: 1px solid var(--dark-grey);
color: var(--dark-grey);
}
.btn-primary { border: 1px solid var(--blue);
color: var(--blue);
}
.btn-info { border: 1px solid var(--light-blue);
color: var(--blue);
}
.btn-black { border: 1px solid var(--black);
color: var(--black);
}

.btn-warning.btn-fill { background-color: var(--orange);
color: var(--white);
}
.btn-success.btn-fill { background-color: var(--green);
color: var(--white);
}
.btn-danger.btn-fill { background-color: var(--dark-red);
color: var(--white);
}
.btn-info.btn-fill { background-color: var(--light-blue);
color: var(--white);
}
.btn-primary.btn-fill { background-color: var(--blue);
color: var(--white);
}
.btn-black.btn-fill { background-color: var(--black);
color: var(--white);
}
.btn-default.btn-fill { background-color: var(--dark-grey);
color: var(--white);
}

.buttons-colvis {
font-size: 12px;
border-radius: 3px;
padding: 8px 10px;
height: 35px;
}

a { color: var(--blue); }
.alert-info a {
color: #23527c;
}
.add {
margin-top: -15px;
margin-right: 10px;
}


/* =================================*
* *
* !CALENDAR FILTERS :: BASE *
* *
*================================= */
.status-filter {
font-size: 13px;
height: 27px;
padding: 7px 12px;
line-height: 5px;
margin: 2.5px !important;
flex-grow: 1;
flex-shrink: 0 !important;
opacity: 1 !important;
color: var(--white);
border-radius: 4px;
border-color: transparent;
outline: none;
}


/* =================================*
* *
* !INLINE :: LABELS *
* *
*================================= */
.status-pill, .label {
display: inline;
padding: 2px 6px;
font-size: 9px !important;
font-weight: 700;
line-height: 1;
color: var(--white);
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25em;
}

.label-service {
background-color: var(--yellow);
color: var(--dark-grey) !important;
}

.label-transfer {
background-color: var(--orange);
color: var(--white) !important;
}

.lead_score_pill {
font-size: 0.7rem;
font-weight: 900;
padding: 3px 14px 2px;
border-radius: 3px;
width: fit-content;
}


/* =================================*
* *
* !OTHER *
* *
*================================= */

.request-card {
font-size: 12px;
line-height: 17px;
color: #888888;
}
.request-card label {
color: #000000;
font-size: 13px;
text-transform: uppercase;
font-weight: 400;
border-bottom: 1px solid #c3c3c3;
width: 70%;
margin-bottom: 10px;
padding-bottom: 5px;
}

.voice {
font-size: 13px;
font-weight: 900;
height: 27px;
padding: 7px 12px;
flex-grow: 1 !important;
flex-shrink: 0 !important;
opacity: 1 !important;
border-radius: 4px;
border-color: transparent;
outline: none;
float: right;
}

.dmc-demo-time {
font-size: 12px;
}

.dmc-list-item-marker {
width: 10px;
height: 10px;
margin: 5px;
border-radius: 2px;
display: inline-block;
background-color: #fafafa;
}

.dmc-demo-content {
display: inline-block;
margin-left: 10px;
}

.instructions {
font-size: 12px;
font-weight: 300;
}

.demo-locked {
color: var(--light-blue);
}

.demo-unlocked {
color: var(--grey);
}

.dropdown-toggle {
padding: 6px 25px 6px 7px;
border-radius: 4px;
}

.avail-header {
display: flex;
justify-content: space-between;
align-items: center;
}

.logo-new-vect {
border-radius: 18%;
width: 25%;
}

.add-level-btn {
text-align: center;
font-size: 25px;
color: #a7a7a7;
width: 30px;
background-color: #dfdfdf;
padding-right: 8px !important;
cursor: pointer;
}

.add-level-btn:hover {
background-color: #d6d6d6;
}

.delete-level {
cursor: pointer;
}

.delete-level:hover {
color: var(--red);
}

.tags {
margin-top: 5px;
}

.tags .tag {
margin-right: 3px;
margin-left: 3px;
padding: 3px 10px;
border-radius: 3px;
background-color: #ededed;
font-size: 10px;
font-weight: 400;
display: inline-block;
color: #818181;
}

.card-wizard .tab-pane {
margin-bottom: 30px;
}

.flexbuttons {
text-align: center;
justify-content: space-between;
flex-direction: row;
display: flex;
flex-wrap: wrap;
}

.flexbuttons button {
flex-grow: 1;
flex-shrink: 0;
margin: 0 3px;
}

.flexbuttons button:first-of-type {
margin-left: 0;
}

.flexbuttons button:last-child {
margin-right: 0;
}



#add_templates .row {
padding: 10px;
margin: 0 10px 10px;
border-bottom: 1px solid #c3c3c3;
}

#add_templates .row:last-child {
border-bottom: none;
}

#add_templates label {
padding-left: 20px;
margin-top: 10px;
}

#add_templates .templateTitle {
text-align: left;
display: inline;
font-size: 11px;
}

#add_templates .templateBox {
border: 1px solid #dedede;
margin-bottom: 10px;
-webkit-border-radius: 5px;
border-radius: 5px;
}

#add_templates .templateBox.selected {
border: 5px solid var(--light-blue);
}

#add_templates .templateIcons {
text-align: right;
float: right;
display: inline;
}

/**************************
* *
* Quick View Container *
* *
**************************/
.quicklook-container {
font-size: 14px;
padding: 0 5px;
}

.quicklook-container .header {
margin-top: 0px;
margin-bottom: 0px;
color: #0ba3ef;
font-weight: 400;
}

.quicklook-container .header.smaller {
color: #818181;
font-size: 14px;
}

.quicklook-container .horizontal-rule {
height: 1px;
margin-top: 25px;
margin-bottom: 25px;
background-color: #ccc;
}

.quicklook-container .content-block {
padding: 3px 0;
}

.quicklook-container .has-program,
.quicklook-container .has-show {
//display: none !important;
}

.quicklook-container .content-block.split {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}

.quicklook-container .content-block i {
display: inline-block;
width: 20px;
margin-right: 10px;
padding: 3px;
color: #6b6b6b;
font-size: 15px;
font-weight: 400;
}

.quicklook-container .program-pills > div {
margin-right: 10px;
margin-left: 10px;
padding: 5px 10px;
float: right;
border-radius: 3px;
font-weight: 600;
}

.quicklook-container .numbers-sub-text {
color: #f2f2f2;
font-size: 12px;
font-weight: 400;
}

.quicklook-container .card-side {
width: 80px;
margin-top: 0px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 3px;
-webkit-box-flex: 0;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
border-style: solid;
border-width: 1px;
border-color: hsla(0, 0%, 51%, .3);
border-radius: 3px;
box-shadow: 0 0 5px 0 rgba(0, 0, 0, .1);
text-align: center;
}

.quicklook-container .card-top {
margin-top: 0px;
margin-bottom: 0px;
font-weight: 400;
}

.quicklook-container .card-middle {
margin-top: 0px;
margin-bottom: 0px;
}

.quicklook-container .card-bottom {
margin-top: 0px;
margin-bottom: 0px;
font-size: 11px;
font-style: italic;
font-weight: 300;
}


.crisp-kquevr {
visibility: hidden!;
}

/**************************
* *
* Video Drawers *
* *
**************************/
#videoDrawer {
display: none;
}


/**************************
* *
* Payroll Styles *
* *
**************************/
.payroll-widget {
position:relative;
background-color: #fff;
margin-bottom: 30px;
}
.payroll-widget-loading {
width: 100%;
height: 150px;
text-align: center;
background-color: rgba(255,255,255,.9);
top: 0;
left: 0;
z-index: 3;
font-size: 40px;
font-weight: bold;
position: absolute;
padding-top: 55px;
color: #757575;
}
.payroll-body {
box-shadow: 0 8px 32px rgba(77,101,117,0.35);
border: 1px solid #f0f4fa;
border-radius: 8px;
}

.payroll-widget .payroll-calendar {
padding: 16px 10px;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-align-content: flex-start;
-ms-flex-line-pack: start;
align-content: flex-start;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
font-size: 10px;
color: #cecece;
}

.payroll-widget .start .date-header, .payroll-widget .end .date-header {
background-color: #2cb5e2;
}

.payroll-widget .payday .date-header {
background-color: #23c770;
}

.payroll-widget .date-header {
color: white;
text-transform: uppercase;
font-family: Averta, sans-serif;
font-size: 11px;
font-weight: 600;
line-height: 24px;
text-align: center;
-webkit-border-radius: 4px 4px 0 0;
-moz-border-radius: 4px 4px 0 0;
border-radius: 4px 4px 0 0;
}

.payroll-widget .date-box {
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-align-self: auto;
-ms-flex-item-align: auto;
align-self: auto;
width: 90px;
}

.payroll-widget .date-body {
height: 86px;
color: #333;
position: relative;
background-color: #fff;
border-left: 1px solid #b2c2cd;
border-right: 1px solid #b2c2cd;
border-bottom: 1px solid #b2c2cd;
-webkit-border-radius: 0 0 4px 4px;
-moz-border-radius: 0 0 4px 4px;
border-radius: 0 0 4px 4px;
-moz-transition: all 0.25s linear;
-o-transition: all 0.25s linear;
-webkit-transition: all 0.25s linear;
transition: all 0.25s linear;
padding: 3px 15px;
text-align: center;
}

.payroll-widget .date-weekday {
font-family: Averta, sans-serif;
font-size: 12px;
font-weight: normal;
line-height: 22px;
}

.payroll-widget .date-numeral {
font-family: Averta, sans-serif;
font-size: 36px;
font-weight: 300;
line-height: 26px;
}

.payroll-widget .date-year {
font-family: Averta, sans-serif;
font-size: 12px;
font-weight: normal;
line-height: 22px;
}

.payroll-widget .date-edit {
margin-top: -3px;
font-size: 10px;
color: #447DF7;
cursor: pointer;
}

.payroll-widget .payroll-money {
display: flex;
height: 150px;
align-items: center;
justify-content: center;
flex-direction: column;
font-size: 14px;
text-align: center;
color: #4d6575;
border-left: 1px solid #d4dde3;
border-right: 1px solid #d4dde3;
}

.payroll-widget .payroll-money .total-amount {
font-size: 40px;
font-weight: 700;
line-height: 44px;
color: #444;
margin-top: 8px;
display: block;
}

.payroll-widget .payroll-action {
padding: 30px 0;
color: #4d6575;
font-family: Averta, sans-serif;
font-size: 14px;
font-weight: normal;
line-height: 22px;
text-align: center;
font-weight: 200;
display: flex;
height: 150px;
align-items: center;
justify-content: center;
flex-direction: column;
}


/* =================================*
* *
* !Template Designer *
* *
*================================= */
.template-container.questions,
.template-container.elements {
width: 100% !important;
min-height: 0px !important;
border-radius: 5px;
}

.template-action-wrapper {
height: 35px !important;
}

.template-action-wrapper.action-show {
background-color: var(--dark-grey) !important;
border-color: var(--dark-grey) !important;
flex-grow: 1;
}

.template-action-wrapper.action-show span::before {
font-family: "Font Awesome 6 Pro";
font-weight: 400;
content: "\f070";

}

.template-action-wrapper.action-show span::after {
content: " Optional";
}

.template-action-wrapper.action-show > div::before {
font-family: "Font Awesome 6 Pro";
font-weight: 400;
content: "\f070";

}

.template-action-wrapper.action-show > div::after {
content: " HIDDEN";
}

.template-action-wrapper.action-show.on {
background-color: var(--green) !important;
border-color: var(--green) !important;
flex-grow: 1;
}

.template-action-wrapper.action-show.on span::before {
font-family: "Font Awesome 6 Pro";
font-weight: 400;
content: "\f06e";

}

.template-action-wrapper.action-show.on span::after {
content: " Required";
}

.template-action-wrapper.action-show.on > div::before {
font-family: "Font Awesome 6 Pro";
font-weight: 400;
content: "\f06e";

}

.template-action-wrapper.action-show.on > div::after {
content: " SHOW";
}

.template-action-wrapper.action-edit {
background-color: var(--orange) !important;
border-color: var(--orange) !important;
flex-grow: 1;
}

.template-action-wrapper.action-delete {
background-color: var(--red) !important;
border-color: var(--red) !important;
flex-grow: 1;
}

.question-selected {
border: 3px solid #ff0000;
border-radius: 5px;
box-shadow:inset 0 0 7px 7px rgba(255,0,0,0.5);
}

.dimension-setting {
float: left;
width: 20%;
}

.dimension-label {
font-size: 10px;
text-transform: uppercase;
text-align: center;
color: var(--light-grey);
}

.setting-header {
display: block;
}

/* ghostClass */
.sortable-ghost {
opacity: .1;
border: 3px dashed #000;
}

.blank {
width: 99%;
background-color: rgba(160, 160, 160, 0.30);
border: none;
height: 80px;
align-items: center;
padding: 0px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
margin-top: -30px;
cursor: pointer;
}

.btn-circle {
width: 15%;
}

h3.form-header {
background-color: #86d3e4;
padding: 20px 10px;
color: white;
font-weight: 900;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

.mbsc-color-input[readonly] {
cursor: pointer !important;
background-color: #ffffff !important;
}

/* =================================*
* *
* !Stats Bar *
* *
*================================= */
.metric-wrapper {
display: flex;
width: 100%;
min-height: 50px;
margin-right: auto;
margin-left: auto;
justify-content: space-between;
}

.metric-container {
display: flex;
width: auto;
height: auto;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 5px;
background-color: var(--light-blue);
cursor: pointer;
flex-grow: 1;
margin: 0px 25px;
position: relative;
flex-wrap: wrap;
padding: 5px;
}

.metric-container.blank {
background-color: #eeeeee !important;
}

.metric-heading {
color: white;
font-size: 16px;
font-weight: 600;
margin: 0px;
padding: 0px;
width: 100%;
text-align: center;
line-height: 1.5em;
}

.metric-subheading {
color: white;
font-size: 13px;
font-style: italic;
text-align: center;
line-height: 12px;
}

.metric-subheading > sup {
top: 0px;
}

.metric-container.blank .metric-heading {
font-size: 30px;
margin-top: -5px;
}

.metric-select {
position: absolute;
background-color: var(--light-grey);
border-radius: 10px;
padding: 10px;
width: 160px;
top: 10px;
z-index: 1;
display: none;
}

.metric-select > ul {
list-style: none;
padding-left: 0px;
line-height: 2;
}

.metric-select > ul > li {
color: #fff;
padding: 0px 10px;
}

.metric-select > ul > li:hover {
background-color: var(--grey);
border-radius: 5px;
}

.mbsc-color-input-item {
align-self: center !important;
}

/* =================================*
* *
* !Inventory *
* *
*================================= */

#item-container .row {
border-bottom: 1px solid #f3f3f3;
padding: 10px;
}

/* =================================*
* *
* !Login Page *
* *
*================================= */

#loginForm {
width: 280px;
}

.login-page .card {
padding: 0px;
padding-bottom: 10px;
overflow: hidden;
}

.login-page .card > header {
padding: 20px 0px 10px;
}

/* =================================*
* *
* !Tables *
* *
*================================= */



/* =================================*
* *
* !New Layout 2021 *
* *
*================================= */
.main-full-panel {
background: #f5f5f5;
position: relative;
min-height: 100%;

}

.main-full-panel > .content {
padding-bottom: 65px;
}

.navbar-primary {
background-color: #4c7bdd;
color: #fff;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 10px;
position: relative;
}

.navbar-primary a {
color: #fff;
}
.navbar-primary .logo {
margin-right: 20px;
}

.navbar-primary .logo-text {
font-size: 17px;
font-weight: bold;
background-color: rgba(0,0,0,0.15);
padding: 5px 10px 5px 15px;
border-radius: 5px;
}

.navbar-primary .logo .logo-text {
padding: 5px 10px 5px 10px;
}

.navbar-primary .logo-text:hover {
background-color: rgba(0,0,0,0.1);
}

div#profile-wrapper {
flex-grow: 1;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0;
}

.profile-wrapper ul.nav {
display: flex;
margin: 0;
}

.profile-wrapper > ul.nav > li {
display: inline;
padding: 15px 5px;
border-radius: 10px;
}
.right-nav > li {
display: inline;
padding: 5px;
border-radius: 10px;
}

.profile-wrapper > ul.nav > li .collapse ul.nav > li {
padding: 5px;
}

.profile-wrapper > ul.nav > li .collapse ul.nav > li > a {
padding: 5px 10px;
border-radius: 5px;
}

.profile-wrapper ul.nav li:hover > a,
.profile-wrapper .collapse ul li:hover > a
{
border-radius: 10px;
background-color: rgba(0,0,0,0.1);
}

.profile-wrapper .collapse ul li:hover > a {
display: block;
}

.profile-wrapper ul.nav li:hover .collapse,
ul.right-nav li:hover .collapse {
display: block;
}

.profile-wrapper > ul.nav > li > a {
display: inline;
padding: 10px 15px;
}
.profile-wrapper > ul.nav p {
font-size: 1em;
display: inline;
}

ul.right-nav {
display: flex;
align-items: center;
justify-content: space-around;
margin-bottom: 0;
list-style: none;
}

.right-nav a.logo-text.nav-link {
font-weight: 400;
}

.help-icon {
font-size: 20px;
text-align: center;
margin: 0 5px;
}

ul.right-nav > li {
position: relative;
padding: 10px 5px;
}

.right-nav .collapse ul li:hover > a {
border-radius: 5px;
}

.right-nav .collapse ul li > a {
padding: 5px 10px;
border-radius: 5px;
}

div#profileLinks {
margin-top: 10px;
width: 100px;
left: inherit;
right: 0px;
font-size: 14px;
}

div#officeLinks {
margin-top: 10px;
width: max-content;
left: inherit;
right: 5px;
font-size: 14px;
}

div#menu_officeAdmin {
margin-top: 10px;
width: max-content;
left: 0;
font-size: 14px;
text-align: left;
}

.right-nav > li .collapse > ul.nav p {
font-size: 1em;
display: inline;
}

.profile-wrapper ul li div,
.right-nav li div {
position: absolute;
background: #779ce9;
z-index: 20;
margin-top: 15px;
left: 10px;
width: max-content;
border-radius: 0 0 5px 5px;
z-index: 111;
}

.profile-wrapper ul li .collapse ul.nav,
.right-nav li .collapse ul.nav {
display: flex;
flex-direction: column;
}

.profile-wrapper ul li .collapse ul.nav li,
.right-nav li .collapse ul.nav li, {
padding: 5px 5px;
}

.profile-wrapper ul li .collapse ul.nav li:hover,
.right-nav li .collapse ul.nav li:hover, {
border-radius: 0;
}

.footer-sticky {
height: 60px;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
box-shadow: 0 -4px 2px rgb(0 0 0 / 5%), 0 0 0 1px rgb(63 63 68 / 10%);
z-index: 997;
color: #797979;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20px 0 20px;
font-size: 14px;
}

.footer-sticky .office-selector {
font-size: 17px;
font-weight: bold;
background-color: rgba(0,0,0,0.15);
padding: 5px 10px 5px 15px;
border-radius: 5px;
}

.footer-sticky .quickLinks {
display: none;
}

body.authorized .footer-sticky .quickLinks {
display: flex;
justify-content: space-around;
flex-basis: 30%;
}

body.authorized .footer-sticky .quickLinks .qlink {
color: var(--dark-grey);
padding: 10px;
text-align: center;
font-size: 1.5em;
flex-grow: 1;
}

body.authorized .footer-sticky .quickLinks .qlink:hover {
background-color: rgba(0,0,0,0.03);
}


/* =================================*
* *
* !Reports *
* *
*================================= */

.buttons-print {
background-color: var(--orange) !important;
}

.buttons-subscribe {
background-color: var(--dark-blue) !important;
}

.buttons-excel {
background-color: var(--green) !important;
}


/* =================================*
* *
* !Chadders *
* *
*================================= */


#chadders-count {
background-color: #fb404b;
text-align: center;
border-radius: 5px;
min-width: 15px;
padding: 0px 3px;
height: 15px;
color: #ffffff;
font-weight: 700;
line-height: 15px;
position: absolute;
top: 3px;
left: 20px;
font-size: 10px;
}

.chadders-container {
display: none;
width: 320px;
position: absolute;
right: 10px;
top: 55px;
height: 70vh;
background-color: #fff;
z-index: 110;
box-shadow: -2px 4px 2px rgb(0 0 0 / 5%), 0 0 0 1px rgb(63 63 68 / 10%);
border-radius: 0 0 10px 10px;
}

.chadders-container.open {
display:inline-block;
}

.chadders-header {
background-color: #779ce9;
display: flex;
padding: 20px;
font-size: 20px;
justify-content: space-between;
}

.chadders-header .back-btn {
cursor: pointer;
}

.chadders-logo {
margin-right: 10px;
}

.chadders-content {
color: var(--dark-grey);
padding: 0;
font-size: 18px;
height: calc(70vh - 70px);
overflow-x: hidden;
overflow-y: scroll;
position: relative;
}

.chadders-page {
position: absolute;
width: 100%;
height: inherit;
top: 0;
left: 0;
transition:left 0.2s linear;
}

.chadders-page.closed {
left: -320px;
}

.chadders {
flex-grow: 1;
}

.chadder-title {
flex-grow: 1;
min-width: 0;
text-align: left;
}

.chadder-title h3 {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.chadder {
padding: 10px;
cursor: pointer;
border-bottom: 1px solid var(--light-grey);
display: flex;
align-items: center;
justify-content: space-between;
}

.chadder > i {
margin-right: 10px;
}

.chadder:hover {
background-color: rgba(0,0,0,0.03);
}

.chadder .chad-name {
flex-grow: 1;
}


.chad-count {
color: #fff;
font-weight: bold;
font-size: 0.8em;
padding: 4px;
text-align: center;
min-width: 25px;
border-radius: 5px;
}

[class*="chad-count-"]{
background-color: red;
}

div#chadders-main {
display: flex;
flex-direction: column;
justify-content: space-between;
height: inherit;
}

.add-chadders-btn {
padding: 5px;
}

div#chadders-chads {
display: flex;
flex-direction: column;
justify-content: space-between;
}

.add-chad-btns {
align-self: center;
display: flex;
justify-content: space-between;
width: 100%;
}

button.add-chad-btn {
width: 50%;
height: 50px;
border: 1px solid #cfcfcf;
border-collapse: collapse;
color: #959595;
font-size: 1em;
}

div#chads-container {
overflow-y: scroll;
}

button.add-chad-btn:first-child {
border-bottom-left-radius: 5px;
}

button.add-chad-btn:last-child {
border-bottom-right-radius: 5px;
}

button.add-chad-btn:hover {
background-color: rgba(0,0,0,0.03);
}
.chad-thumb-border {
margin-right: 10px;
}

.chad-thumb-border.current {
border: 2px solid var(--light-blue);
padding: 3px;
border-radius: 50px;
display: flex;
justify-content: center;
align-items: center;
}

.chad-thumb {
height: 50px;
width: 50px;
color: rgb(129 129 129);
display: flex;
justify-content: center;
align-items: center;
border-radius: 50px;
overflow: hidden;
background-size: cover;
background-position: center;
}

.chad-thumb-border.current .chad-thumb {
width: 40px;
height: 40px;
font-size: 0.9em;
}

.chad {
display: flex;
align-items: center;
padding: 10px;
border-bottom: 1px soild var(--dark-grey);
cursor: pointer;
}

.chad:hover {
background-color: rgba(0,0,0,0.05);
}

.chad-meta {
display: flex;
flex-direction: column;
}

.meta-timestamp {
font-size: .7em;
font-style: italic;
}

.meta-title {
font-weight: bold;
}

.meta-text {
font-size: 0.8em;
font-style: italic;
}

.chad-player {
position: absolute;
top: 0;
left: 0;
width: inherit;
height: inherit;
}

.chad-image {
height: inherit;
width: 100%;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
background-color: black;
position: relative;
}

.chad-image-timer {
position: absolute;
bottom: 0;
left: 0;
height: 4px;
background-color: var(--dark-red);
width: 100%;
-webkit-transition: width 1000ms linear;
-moz-transition: width 1000ms linear;
-ms-transition: width 1000ms linear;
-o-transition: width 1000ms linear;
transition: width 1000ms linear;
}

.vjs-name-overlay {
color: #fff;
position: absolute;
text-align: center;
display: flex;
justify-content: center;
margin: 30px auto;
align-items: flex-end;
font-size: 18px;
max-width: 100% !important;
text-shadow: 1px 2px 2px black;
}

.vjs-wavesurfer.vjs-fill wave {height:100%;max-width:100%;min-width:100%;position:absolute!important;top:0;width:100%}

.iziToast-color-light-blue {
background-color: var(--light-grey);
border: 1px solid var(--grey);
color: var(--dark-grey);
}

.iziToast-color-light-blue:after {
box-shadow: none;
}

.iziToast-color-light-blue .iziToast-body {
align-content: center;
}

.iziToast-color-light-blue .iziToast-texts {
display: flex !important;
flex-direction: column;
float: none !important;
margin: 5px 10px 5px 0 !important;
max-width: 640px;
}

.iziToast-color-light-blue .iziToast-message {
color: var(--gark-grey);
font-size: 0.9em !important;
}

.iziToast-color-light-blue .iziToast-title {
padding-bottom: 5px !important;
margin-bottom: 3px !important;
border-bottom: 1px dashed var(--grey);
display: block;
font-size: 0.9em !important;
}

.iziToast-color-light-blue .iziToast-title i {
margin-right: 5px;
}

.iziToast-color-light-blue button.iziToast-buttons-child {
background: var(--dark-grey) !important;
color: #fff !important;
border-radius: var(--corner);
outline: none;
}

.iziToast-color-light-blue .iziToast-body {
display: flex;
align-items: center;
}

.iziToast-color-light-blue .iziToast-buttons {
margin: 0 !important;
float: none !important;
}