/* This file content is generated automatically from SettingsStyles. Do not update it manually. */
:root {
    --color-primary: #e3182c;
    --color-secondary: #28282f;
    --color-body-background: #ffffff;
    --color-button-default: #2b3e50;
    --color-button-default-text: #fff;
    --color-button-primary: #2b3e50;
    --color-button-primary-text: #fff;
    --color-button-secondary: #2b3e50;
    --color-button-secondary-text: #fff;
    --color-loginpage: #28282f;
    --color-button-loginpage: #e3182c;
    --color-button-loginpage-text: #fff;
    --loginpage-img: url("/storage/app/media/loga/eLearningTFS-Reports.png");
}

/* Custom CSS */
@charset "UTF-8";
 /* CSS Document */
 @import "fonts.css";
 @import "bootstrap-icons.css";

 /*----------- VARIABLES ------------*/
 :root {
     --color-button-pridanizaznamu: #76A544;
     --color-button-pridanizaznamu-text: #ffffff;
     --color-button-odebranizaznamu: #e05656;
     --color-button-odebranizaznamu-text: #ffffff;
     --font-headers: "Montserrat Local", sans-serif;
     --font-texts: "Montserrat Local", sans-serif;
 }

 /*end of variables*/
 .bi::before,
 [class^="bi-"]::before,
 [class*=" bi-"]::before {
     font-weight: bold !important;
 }

 a {
     color: #282828;
 }

 body {
     background: var(--color-body-background);
 }

 html,
 body,
 p {
     font-family: var(--font-texts);
     color: #282828;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 .title,
 .heading,
 .control-breadcrumb,
 .nav-label {
     font-family: var(--font-headers);
     font-weight: 500;
 }

 table.table.data tbody td,
 table.table.data tbody th,
 .title-value p,
 .title-value h4 {
     color: #282828;
 }

 table.table.data tbody td,
 table.table.data tbody th {
     border-top: 0px solid white;
 }

 table.table.data {
     border-bottom: 0px solid #fff;
 }

 table.table.data thead td.active > span:after,
 table.table.data thead th.active > span:after,
 table.table.data thead td.active > a:after,
 table.table.data thead th.active > a:after {
     color: #f02;
 }

 .control-pagination .page-iteration {
     margin-right: 0px;
     font-size: 13px;
     color: #282828;
     background-color: #f8f8f8;
     padding: 12px 36px;
 }

 .list-footer {
     padding: 30px 0px 0px 0px;
 }

 /*body background login page*/
 body.signin.outer {
     background: var(--color-loginpage);
 }

 body.signin.outer .oc-logo {
     background-image: url('/plugins/mdlplus/reports/assets/images/mdl_plus_logo_md.png');
     background-image: var(--loginpage-img);
     height: 310px !important;
 }

 body.outer.signin .layout > .layout-row > .layout-cell .outer-form-container .horizontal-form button {
     background-color: var(--color-button-loginpage);
     color: var(--color-button-loginpage-text);
 }

 body.outer.signin .layout > .layout-row > .layout-cell .outer-form-container .horizontal-form button:hover {
     background-color: var(--color-button-loginpage);
     color: var(--color-button-loginpage-text);
 }

 /*pro postranní bloky mimo mdlplus*/
 .control-scrollpanel {
     background: transparent;
     margin-left: 15px;
     box-shadow: none;
     border: 1px solid #dfdfdf;
     padding: 15px 5px 5px 5px;
 }

 /*--------------------- BUTTONS --------------------*/
 .btn-default {
     background: #282828;
     color: var(--color-button-default-text);
     border: 1px solid #282828;
 }

 .btn-primary {
     background: #282828;
     color: var(--color-button-primary-text);
 }

 .btn-primary:hover,
 .btn-primary:focus,
 .btn-primary:active,
 .btn-primary.active,
 .open .dropdown-toggle.btn-primary {
     background: #f02;
     border-color: #f02;
 }

 .btn-secondary {
     background: #f02;
     color: var(--color-button-secondary-text);
 }

 .btn.oc-icon-plus {
     background: #f02;
     color: #fff;
     border: 1px solid #f02;
 }

 .btn.oc-icon-plus:hover {
     background: #34d3f1;
     color: #fff;
     border: 1px solid #34d3f1;
 }

 .btn.oc-icon-minus {
     background: var(--color-button-odebranizaznamu);
     color: var(--color-button-odebranizaznamu-text);
 }

 .btn {
     padding: 6px 18px;
     border-radius: 18px;
     -webkit-box-shadow: none;
     box-shadow: none;
     text-transform: uppercase;
     font-size: 12px;
     line-height: 14px;
 }

 .btn-default:hover,
 .btn-default:focus,
 .btn-default:active,
 .btn-default.active,
 .open .dropdown-toggle.btn-default {
     color: #fff;
     background: #34d3f1;
     border-color: #34d3f1;
 }

 .btn-default.disabled,
 .btn-default[disabled],
 .btn-default.disabled:hover,
 .btn-default[disabled]:hover,
 .btn-default.disabled:focus,
 .btn-default[disabled]:focus,
 .btn-default.disabled:active,
 .btn-default[disabled]:active,
 .btn-default.disabled.active,
 .btn-default[disabled].active {
     background: #fff;
     border: 1px solid #dfdfdf;
 }

 /*--------------------- MAIN MENU --------------------*/
 nav#layout-mainmenu {
     background-color: #28282f;
     margin-bottom: 0px;
 }

 nav#layout-mainmenu ul {
     margin-right: 0px;
 }

 nav#layout-mainmenu ul.mainmenu-toolbar li.mainmenu-account img.account-avatar {
     border-radius: 100%;
     width: 35px;
     height: 35px;
     margin-right: 15px;
     border: 2px solid #f02;
 }

 nav#layout-mainmenu.navbar ul li.active a,
 .mainmenu-collapsed li.active a,
 nav#layout-mainmenu.navbar ul li a:hover,
 .mainmenu-collapsed li:hover {
     color: #f02 !important;
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-nav li a,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-nav li a {
     color: #f02;
     text-transform: uppercase;
     padding: 0 0 0 20px;
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-nav li a .nav-icon,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-nav li a .nav-icon {
     top: 0px;
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-nav li,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-nav li {
     margin: 21px;
 }

 nav#layout-mainmenu .menu-toggle {
     height: 75px;
     line-height: 75px;
 }

 nav#layout-mainmenu .menu-toggle .menu-toggle-icon i {
     background: #28282f !important;
     display: inline-block;
     height: 75px !important;
     line-height: 75px !important;
     width: 55px !important;
     font-size: 16px;
 }

 nav#layout-mainmenu .menu-toggle .menu-toggle-icon {
     background: #28282f !important;
     display: inline-block;
     height: 75px !important;
     line-height: 75px !important;
     width: 55px !important;
     font-size: 16px;
 }

 nav#layout-mainmenu .menu-toggle .menu-toggle-title {
     margin-left: 0px;
 }

 .mainmenu-collapsed > div ul.mainmenu-nav li {
     padding: 20px;
     margin: 5px 0 0;
 }

 div.control-popover.placement-bottom > div::before {
     border-bottom: 9px solid #fff;
     left: 0px;
     top: -19px;
 }

 .tooltip-inner {
     max-width: 200px;
     padding: 3px 8px;
     color: #fff;
     text-align: center;
     text-decoration: none;
     background-color: #f02;
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     border-radius: 3px;
     -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 4px rgba(0, 0, 0, 0.23);
     box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 4px rgba(0, 0, 0, 0.23)
 }

 /*--------------------- BREADCRUMBS --------------------*/
 .control-breadcrumb {
     background-color: #fff;
     overflow: hidden;
     margin: 0px 0px 40px 0px;
     border-bottom: 1px dashed #dfdfdf;
     padding-bottom: 20px;
     box-shadow: none;
 }

 .control-breadcrumb li:before {
     border-left: 12px solid #fff;
 }

 .control-breadcrumb li {
     background-color: #fff;
     font-size: 12px;
     text-transform: uppercase;
     padding: 3px 20px 3px 40px;
     color: #282828;
 }

 .control-breadcrumb li:after {
     content: '';
     display: block;
     width: 0;
     height: 0;
     border-top: 6px solid transparent;
     border-bottom: 6px solid transparent;
     border-left: 12px solid #f02;
     top: 6px;
 }

 .control-breadcrumb li::before {
     right: -14px;
     z-index: 9;
     content: '';
     display: block;
     width: 0;
     height: 0;
     border-top: 6px solid transparent;
     border-bottom: 6px solid transparent;
     border-left: 12px solid #fff;
     top: 6px;
 }

 .control-breadcrumb li:last-child {
     background-color: transparent;
     color: #282828;
 }

 .control-breadcrumb li a {
     color: #f02;
     font-weight: bold;
 }

 .control-breadcrumb li a:hover {
     color: #282828;
 }

 /*--------------------- LAYOUT --------------------*/
 .layout > .layout-cell.layout-container,
 .layout > .layout-cell .layout-container,
 .layout > .layout-cell.padded-container,
 .layout > .layout-cell .padded-container {
     padding: 0px 20px 0 20px;
 }

 .layout-sidenav-container {
     min-width: 160px;
     width: 160px;
 }

 #layout-sidenav {
     background-color: #28282f;
     overflow: hidden;
     text-transform: uppercase;
     box-shadow: none;
     border-radius: 0;
     height: 100%;
 }

 #layout-sidenav ul li.active a i,
 #layout-sidenav ul li a:hover i,
 #layout-sidenav ul li.active a,
 #layout-sidenav ul li a:hover {
     color: #ffffff;
 }

 #layout-sidenav ul li.active,
 #layout-sidenav ul li:hover {
     background: #f02;
     box-shadow: none;
 }

 #layout-body {
     padding: 45px !important;
 }

 .form-preview {
     border: 0px solid #eee;
     border-radius: 0px;
     box-shadow: none;
 }

 .form-m-rapped {
     margin: 20px -20px;
 }

 .form-control {
     padding: 10px 20px 10px;
     border-radius: 18px !important;
     border: 1px solid #dfdfdf;
     color: #282828 !important;
     background-color: #fff;
     -webkit-box-shadow: none;
     box-shadow: none;
     font-size: 13px;
 }

 .control-scrollpanel {
     background: transparent;
 }

 #layout-sidenav ul li a {
     padding: 1.429em .714em;
     display: block;
     font-size: 12px;
     font-weight: normal;
     position: relative;
     padding-left: 20px;
     text-align: left;
     color: #fff;
 }

 #layout-sidenav ul li a i {
     margin-bottom: -2px;
     display: inline-table;
     font-size: 14px;
     padding-right: 10px;
     color: #f02;
 }

 #layout-sidenav ul li:first-child a {
     padding-top: 1.5em;
 }

 #layout-sidenav ul li:last-child a {
     padding-bottom: 2em;
 }

 /*--------------------- WIDGETY --------------------*/
 .title-value p {
     font-weight: bold;
     font-size: 22px;
     line-height: 28px;
     margin-top: 6px;
     margin-bottom: 3px;
 }

 div.scoreboard div.scoreboard-item {
     margin-bottom: 30px !important;
     margin-left: 20px !important;
     margin-top: 10px;
     width: auto !important;
 }

 div.scoreboard div.scoreboard-item-2 {
     background-color: #f8f8f8;
     padding: 35px;
     display: inline-block;
     margin-right: 40px;
     margin-bottom: 20px;
     vertical-align: top;
     margin-left: 15px;
     margin-top: -10px;
     width: auto !important;
 }

 /*--------------------- Update #2 --------------------*/
 div.scoreboard div.scoreboard-item.infobox {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 118px !important;
     background-color: #fff;
     border-top: 0px solid #fff;
     border-right: 0px solid #fff;
     border-left: 0px solid #fff;
     border-bottom: 0px solid #fff;
     margin-left: 0px !important;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 div.scoreboard div.scoreboard-item.infobox:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 118px !important;
     background-color: #fff;
     border-top: 0px solid #fff;
     border-right: 0px solid #fff;
     border-left: 0px solid #fff;
     border-bottom: 0px solid #34d3f1;
     margin-left: 0px !important;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.companies {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.companies:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.departments {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.departments:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.control-chart.infobox {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8 !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.control-chart.infobox:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.students-all {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8 !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.students-all:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.students-enrolled {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8 !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.students-enrolled:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.students-completed {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8 !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.students-completed:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.students-certificates {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8 !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.students-certificates:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.students-active {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8 !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.students-active:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .scoreboard-item.title-value.infobox.students-suspended {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #f8f8f8 !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     transition: 0.2s linear;
     box-shadow: 0 0 0px #e6e6e6;
 }

 .scoreboard-item.title-value.infobox.students-suspended:hover {
     display: inline-block;
     margin-right: 10px;
     margin-bottom: 10px;
     vertical-align: top;
     border-radius: 20px;
     padding: 27px 30px;
     min-height: 112px;
     background-color: #fff !important;
     border: 0px dashed #f8f8f8;
     margin-left: 0px;
     min-width: 300px;
     box-shadow: 0 0 20px #f8f8f8;
     transform: scale(1.03);
     transform-origin: center center 0;
     cursor: pointer;
     transition: 0.2s linear;
 }

 .w-300.scoreboard-item.title-value.user-meta {
     background-color: #f8f8f8 !important;
     padding: 35px !important;
     display: inline-block !important;
     margin-right: 40px !important;
     vertical-align: top !important;
     margin-left: 15px !important;
     margin-top: -10px !important;
 }

 .scoreboard div.scoreboard-item.infobox svg circle {
     stroke: #C5C5C5;
 }

 .scoreboard div.scoreboard-item.infobox svg path:nth-of-type(1) {
     fill: #35D3F1;
 }

 .scoreboard-item .chart-legend tr:nth-of-type(1) .indicator i {
     background-color: #35D3F1 !important;
 }

 .legend table tbody tr td:nth-child(3) div div {
     border-color: #35D3F1 !important;
 }

 .scoreboard div.scoreboard-item.infobox svg path:nth-of-type(2) {
     fill: #FF0021;
 }

 .scoreboard-item .chart-legend tr:nth-of-type(2) .indicator i {
     background-color: #FF0021 !important;
 }

 .legend table tbody tr td:nth-child(1) div div {
     border-color: #FF0021 !important;
 }

 /*--------------------- End of New widgets --------------------*/

 .infobox.companies .icon,
 .infobox.departments .icon {
     vertical-align: top;
     padding-top: 0px;
 }

 .scoreboard-item.title-value.infobox.departments {
     max-height: 132px;
 }

 .scoreboard-item.title-value.infobox.departments {
     overflow-y: scroll;
 }

 .scoreboard-item-student-meta {
     background-color: #f8f8f8 !important;
     padding: 35px !important;
     display: inline-block !important;
     margin-right: 40px !important;
     margin-bottom: 20px !important;
     vertical-align: top !important;
     margin-left: 15px !important;
     margin-top: -10px !important;
     width: auto !important;
 }

 .scoreboard-item-course-meta {
     background-color: #f8f8f8 !important;
     padding: 35px !important;
     display: inline-block !important;
     margin-right: 40px !important;
     margin-bottom: 20px !important;
     vertical-align: top !important;
     margin-left: 15px !important;
     margin-top: -10px !important;
     width: auto !important;
 }

 .title-value p.success {
     color: #34d3f1;
 }

 .infobox .nav {
     margin-top: 5px;
 }

 .infobox .meta,
 .infobox .icon {
     display: inline-block;
     vertical-align: middle;
 }

 .infobox .meta {
     padding-top: 7px;
 }

 .infobox .icon i {
     font-size: 18px;
     margin-right: 20px;
     border-radius: 100%;
     padding: 16px 20px;
     color: #808080;
     width: 58px;
     height: 58px;
     display: block;
     background-color: #fff;
     border: 1px solid #fdfdfd;
 }

 .students-all .icon i {
     color: #34d3f1;
 }

 .students-enrolled .icon i {
     color: #f02;
 }

 .students-completed .icon i,
 .students-active .icon i {
     color: #f02;
 }

 .students-certificates .icon i {
     color: #34d3f1;
 }

 .students-suspended .icon i {
     color: #808080;
 }

 div.scoreboard div.scoreboard-item.user-image {
     margin-right: 25px;
     margin-left: 0px;
 }

 .list-widget {
     background: #fff;
     box-shadow: none;
 }

 .list-header {
     padding: 0px 0px 10px 0px;
 }

 table.table.data thead td > a,
 table.table.data thead th > a,
 table.table.data thead td > span,
 table.table.data thead th > span {
     font-weight: 700;
 }

 table.table.data tbody tr.rowlink:not(.nolink):active td,
 table.table.data tbody tr.rowlink:not(.nolink):hover td,
 table.table.data tbody tr:not(.no-data).selected td {
     background: #f02 !important;
 }

 table.table.data tbody tr:nth-child(even) td,
 table.table.data tbody tr:nth-child(even) th {
     background-color: rgb(244, 248, 252);
 }

 table.table.data tbody td.list-cell-type-mdl_status {
     padding: 7px 0px 4px 25px;
     text-align: left;
 }

 table.table.data .list-badge {
     margin: 0 5px 0 0;
     padding: 3px 0 0 0;
     width: 18px;
     height: 18px;
     border-radius: 50%;
 }

 table.table.data .list-badge.badge-danger {
     background: #f02;
 }

 table.table.data .list-badge.badge-success {
     background: #34d3f1;
 }

 table.table.data tbody tr.active td:first-child {
     border-left: 0px solid #f02 !important;
     padding-left: 20px;
 }

 table.table.data tbody tr:nth-child(2n) td,
 table.table.data tbody tr:nth-child(2n) th {
     background-color: #f9f9f9;
     border-top: 0px solid #fff;
     border-bottom: 0px solid #fff;
 }

 table.table.data thead td > a,
 table.table.data thead th > a,
 table.table.data thead td > span,
 table.table.data thead th > span {
     color: #282828;
     background-color: #fff !important;
 }

 i.status {
     font-size: 18px;
 }

 i.status.bi.bi-exclamation-circle-fill {
     color: #f02;
     line-height: 29px;
 }

 i.status.bi.bi-check-circle-fill {
     color: #34d3f1;
     line-height: 31px;
 }

 i.status.bi.bi-check-circle-fill.konci {
     color: #f02;
     line-height: 31px;
 }

 i.status.bi.bi-exclamation-circle-fill.grey {
     color: #505050;
     line-height: 31px;
 }

 /* záložky */
 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title {
     padding: 8px 30px 0 30px;
 }

 .control-tabs > ul.nav-tabs > li a > span.title > span,
 .control-tabs > div > ul.nav-tabs > li a > span.title > span,
 .control-tabs > div > div > ul.nav-tabs > li a > span.title > span {
     margin-top: -8px;
     padding-top: 10px;
     max-width: 160px;
     line-height: 30px;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title:before,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title:before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title:before,
 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title:after,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title:after,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title:after {
     background: #ECF8FF;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li.active a:before,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a:before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a:before {
     background-color: #ECF8FF;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li.active a > span.title span,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a > span.title span,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a > span.title span,
 .control-tabs > ul.nav-tabs > li a > span.title > span,
 .control-tabs > div > ul.nav-tabs > li a > span.title > span,
 .control-tabs > div > div > ul.nav-tabs > li a > span.title > span {
     text-overflow: initial;
 }

 label {
     display: inline-block;
     margin-bottom: 5px;
     font-weight: normal;
     font-size: 12px;
     color: #666;
     text-transform: uppercase;
     padding-left: 20px;
 }

 /*--------------------- GRAFY --------------------*/
 .legendColorBox {
     padding-left: 12px;
     padding-right: 4px;
 }

 .legendLabel {
     color: rgb(102, 102, 102);
 }

 /*--------------------- FILTRY --------------------*/
 .control-filter {
     background: #fff;
     color: #282828;
     border-top: 1px solid #dfdfdf;
     border-bottom: 1px solid #dfdfdf;
     padding: 20px 6px;
     margin-top: 0px !important;
     box-shadow: none;
     border-radius: 0px !important;
 }

 .control-filter .custom-checkbox label,
 .control-filter label {
     font-size: 13px;
     color: #34d3f1;
     text-transform: uppercase;
     font-weight: bold
 }

 .control-filter a {
     color: #999;
     text-transform: uppercase;
     font-weight: bold;
     font-size: 13px !important;
     background-color: #fff;
     margin-bottom: 3px;
     padding: 6px 15px !important;
 }

 .control-filter > .filter-scope .filter-setting {
     font-weight: normal;
 }

 .control-filter > .filter-scope:hover .filter-label,
 .control-filter > .filter-scope.active .filter-label {
     color: #fff;
 }

 .control-filter > .filter-scope:hover,
 .control-filter > .filter-scope.active,
 .control-filter > .filter-scope:hover.custom-checkbox label,
 .control-filter > .filter-scope.active.custom-checkbox label {
     color: #f02;
 }

 .control-toolbar {
     padding: 0px 20px 0px 20px !important;
 }

 .control-filter-popover .filter-active-items a:before {
     content: "\f00c";
     color: #f02;
 }

 .control-filter-popover .filter-active-items:hover a:before {
     content: "\f00c";
     color: #666;
 }

 table.table.data .list-checkbox {
     border-right: 0px solid #eee;
 }

 table.table.data tbody td div.progress,
 table.table.data tbody th div.progress {
     overflow: hidden;
     height: 9px;
     margin-bottom: 0px;
     margin-top: 3px;
     background-color: #d9dee0;
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     border-radius: 3px;
 }

 table.table.data thead td,
 table.table.data thead th {
     border-bottom: 1px solid #ddd !important;
     border-top: 1px solid #ddd !important;
     font-size: 12px;
     line-height: 40px;
 }

 .btn.btn-block.btn-secondary.oc-icon-eraser {
     background-color: #f02;
     color: #fff;
 }

 .control-filter-popover .filter-active-items {
     font-weight: 600;
 }

 .progress-bar {
     height: 100%;
     font-size: 10px;
     line-height: 14px;
     color: #fff;
     text-align: center;
     background-color: #34d3f1;
 }

 .custom-checkbox input[type="checkbox"]:checked + label::before,
 .custom-radio input[type="checkbox"]:checked + label::before {
     border-color: #282828;
     background-color: #282828;
     border-width: 1px;
 }

 .custom-checkbox input[type="checkbox"]:indeterminate + label:before,
 .custom-radio input[type="checkbox"]:indeterminate + label:before,
 .custom-checkbox input[type="checkbox"]:checked + label:before,
 .custom-radio input[type="checkbox"]:checked + label:before {
     border-color: #f02;
     background-color: #f02;
     border: 1px solid #f02 !important;
     font-size: 10px;
     line-height: 16px;
 }

 .custom-checkbox label:before {
     border-radius: 5px;
 }

 .custom-checkbox label:before,
 .custom-radio label:before {
     border: 1px solid #dfdfdf;
     top: 2px;
     width: 16px;
     height: 16px;
 }

 .custom-checkbox label:hover:before,
 .custom-radio label:hover:before {
     border: 1px solid #f02;
 }

 /*aby zustaval scrollbar viditelny i v safari*/
 .departments::-webkit-scrollbar {
     -webkit-appearance: none;
     width: 6px;
 }

 .departments::-webkit-scrollbar-thumb {
     border-radius: 5px;
     background-color: rgba(0, 0, 0, .5);
     box-shadow: 0 0 1px rgba(255, 255, 255, .5);
     -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
 }

 /*--------------------- STEJNE VYSOKE SLOUPCE --------------------*/
 .row.equal-cols {
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-flex-wrap: wrap;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
 }

 .row.equal-cols:before,
 .row.equal-cols:after {
     display: block;
 }

 .row.equal-cols > [class*='col-'] {
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-flex-direction: column;
     -ms-flex-direction: column;
     flex-direction: column;
 }

 .row.equal-cols > [class*='col-'] > * {
     -webkit-flex: 1 1 auto;
     -ms-flex: 1 1 auto;
     flex: 1 1 auto;
 }

 .control-tabs.primary-tabs > ul.nav-tabs:before,
 .control-tabs.primary-tabs > div > ul.nav-tabs:before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs:before {
     border-bottom: 1px solid #282828;
     margin-bottom: 2px;
 }

 .table > thead > tr > td.active,
 .table > tbody > tr > td.active,
 .table > tfoot > tr > td.active,
 .table > thead > tr > th.active,
 .table > tbody > tr > th.active,
 .table > tfoot > tr > th.active,
 .table > thead > tr.active > td,
 .table > tbody > tr.active > td,
 .table > tfoot > tr.active > td,
 .table > thead > tr.active > th,
 .table > tbody > tr.active > th,
 .table > tfoot > tr.active > th {
     background-color: #ffedef !important;
     border-top: 1px solid #fff;
     border-bottom: 1px solid #fff;
 }

 .control-filter > .filter-scope:hover .filter-label,
 .control-filter > .filter-scope.active .filter-label {
     color: #f02;
 }

 .control-filter > .filter-has-popover:hover .filter-label {
     color: #f02;
 }

 .control-filter-popover .filter-items a:hover,
 .control-filter-popover .filter-active-items a:hover {
     background-color: #f02;
 }

 .control-list {
     margin-bottom: 20px;
     margin-top: 0px !important;
 }

 .control-filter > .filter-scope:hover.active .filter-setting,
 .control-filter > .filter-scope.active.active .filter-setting {
     background-color: #f02;
     border-radius: 100%;
     width: 21px;
     height: 21px;
     line-height: 22px;
     text-align: center;
     padding: 0px;
     border: 0px solid #f5f5f5;
     color: #fff;
     font-weight: bold;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title {
     font-weight: bold;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li:first-child,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li:first-child,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li:first-child {
     margin-left: 0px !important;
     padding-left: 0px !important;
 }

 .control-tabs > ul.nav-tabs > li.active,
 .control-tabs > div > ul.nav-tabs > li.active,
 .control-tabs > div > div > ul.nav-tabs > li.active {
     border-bottom: 6px solid #f02;
 }

 .control-tabs.primary-tabs > ul.nav-tabs,
 .control-tabs.primary-tabs > div > ul.nav-tabs,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs {
     margin-left: 0px;
     margin-right: 0px;
     margin-top: 30px;
     text-align: right;
 }

 .control-tabs > ul.nav-tabs > li.active a,
 .control-tabs > div > ul.nav-tabs > li.active a,
 .control-tabs > div > div > ul.nav-tabs > li.active a {
     color: #f02;
 }

 .control-tabs > div.tab-content > div.tab-pane {
     padding: 37px 0 0 0;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li.active a > span.title,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a > span.title,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a > span.title {
     z-index: 12;
     border-top-color: #fff;
     text-transform: uppercase;
     font-weight: bold;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li a,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a {
     font-size: 13px;
     overflow: auto;
     padding-bottom: 5px;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li.active a > span.title span,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a > span.title span,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a > span.title span {
     border-top-color: #fff;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li.active a > span.title::before,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a > span.title::before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a > span.title::before,
 .control-tabs.primary-tabs > ul.nav-tabs > li.active a > span.title::after,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a > span.title::after,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a > span.title::after {
     border-color: #fff;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::after,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::after,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::after {
     border-right: 2px solid #fff;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::before,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::before,
 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::after,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::after,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::after {
     border-top: 2px solid #fff;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::before,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::before {
     border-left: 2px solid #fff;
 }

 .control-tabs.primary-tabs > ul.nav-tabs::before,
 .control-tabs.primary-tabs > div > ul.nav-tabs::before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs::before {
     border-bottom: 1px solid #dfdfdf;
 }

 .control-tabs > ul.nav-tabs > li a > span.title > span,
 .control-tabs > div > ul.nav-tabs > li a > span.title > span,
 .control-tabs > div > div > ul.nav-tabs > li a > span.title > span {
     border-top: 2px solid #fff;
     line-height: 30px;
 }

 .form-group.number-field > .form-control {
     text-align: left;
 }

 .title-value p.description {
     color: #282828;
     line-height: 15px;
     font-size: 13px;
     font-weight: bold;
 }

 relation-behavior .control-list {
     border: 0px solid #eeeeee;
 }

 .btn.oc-icon-minus {
     background: #f02;
 }

 body.slim-container div.scoreboard {
     padding: 15px 15px 15px 0 !important;
 }

 .title-value h1 {
     margin: 0px 0px 20px 0px !important;
     text-transform: uppercase;
     font-size: 26px !important;
     color: #28282f !important;
 }

 h1,
 .h1 {
     font-size: 32px;
 }

 .control-chart div.canvas {
     margin-top: -3px;
 }

 .control-chart div.chart-legend {
     padding-top: 6px;
 }

 .select2-container--default .select2-results__option--highlighted[aria-selected] {
     background-color: #f02;
 }

 .select2-container--default .select2-dropdown--above {
     box-shadow: none;
     border: 1px solid #dfdfdf;
     border-radius: 0px;
     -webkit-box-shadow: none;
 }

 .control-pagination a.page-next:hover:before,
 .control-pagination a.page-back:hover:before,
 .control-pagination a.page-last:hover:before,
 .control-pagination a.page-first:hover:before {
     color: #f02;
 }

 .select2-container--default .select2-selection--single .select2-selection__rendered {
     color: #282828;
 }

 .select2-container--default .select2-selection {
     color: #f02;
     -webkit-box-shadow: none;
     box-shadow: none;
 }

 .relation-behavior .control-list {
     border: 0px solid #eeeeee;
 }

 .field-recordfinder {
     border-radius: 18px;
     border: 1px solid #dfdfdf;
     height: 38px;
     font-size: 14px;
 }

 .custom-switch input:checked ~ span {
     background-color: #34d3f1;
 }

 .field-recordfinder .form-control {
     padding: 7px 20px 10px;
 }

 .switch-field .field-switch {
     padding-left: 60px;
     padding-top: 2px;
 }

 .field-recordfinder .btn {
     border: none;
 }

 .field-recordfinder .btn:hover {
     color: #fff;
 }

 .modal-content {
     -webkit-box-shadow: none;
     box-shadow: none;
     -webkit-border-radius: 0px;
     -moz-border-radius: 0px;
     border-radius: 0px;
     border: 20px solid #fff;
     background: #fff;
 }

 .modal-header {
     background: #fff;
     color: #282828;
     border-radius: 0px;
     padding: 20px 20px;
     border: none;
 }

 .recordfinder-search {
     border: 1px solid #dfdfdf !important;
     border-radius: 18px;
 }

 .form-buttons {
     padding: 20px;
 }

 .control-list table.table.data .list-setup a {
     color: #282828 !important;
 }

 .control-list table.table.data .list-setup a:hover:before {
     color: #f02 !important;
 }

 body .fr-toolbar.fr-bottom,
 body .fr-toolbar.fr-top {
     border-bottom: 0px solid #d4d8da !important;
     -webkit-box-shadow: none;
     -moz-box-shadow: none;
     box-shadow: none;
     border-radius: 18px;
 }

 .field-richeditor {
     border: 1px solid #dfdfdf;
     -webkit-box-shadow: none;
     -moz-box-shadow: none;
     box-shadow: none;
     border-radius: 18px !important;
     -moz-border-radius: 18px !important;
     -webkit-border-radius: 18px !important;
 }

 .fr-box.fr-basic.fr-top .fr-wrapper {
     border-radius: 18px;
     -moz-border-radius: 18px;
     -webkit-border-radius: 18px;
 }

 .btn-icon.danger:hover:before {
     color: #f02;
 }

 .btn-link {
     color: #f02;
 }

 .select2-container--default .select2-selection--single {
     border-radius: 18px;
     padding: 8px 20px 7px 20px;
 }

 .select2-results__option {
     padding: 6px 14px 6px 20px;
 }

 nav#layout-mainmenu.navbar-mode-inline,
 nav#layout-mainmenu.navbar-mode-inline_no_icons {
     height: 75px;
 }

 nav#layout-mainmenu ul li .mainmenu-accountmenu li a:hover,
 nav#layout-mainmenu ul li .mainmenu-accountmenu li a:focus {
     background: #f02;
     color: #fff !important;
 }

 nav#layout-mainmenu ul li .mainmenu-accountmenu li:first-child a:hover:after,
 nav#layout-mainmenu ul li .mainmenu-accountmenu li:first-child a:focus:after,
 nav#layout-mainmenu ul li .mainmenu-accountmenu li:first-child a:active:after {
     border-bottom: 7px solid #f02;
 }

 nav#layout-mainmenu.navbar-mode-inline ul li .mainmenu-accountmenu,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul li .mainmenu-accountmenu {
     top: 75px;
 }

 nav#layout-mainmenu ul li .mainmenu-accountmenu li a {
     color: #282828;
 }

 .control-filter-popover .filter-items {
     max-height: 135px;
     overflow: auto;
     background-color: #ffff;
     border: 0px solid #d7dbdd;
 }

 div.control-popover > div {
     position: relative;
     background: #fff;
     -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.12), 0 0px 25px rgba(0, 0, 0, 0.10);
     box-shadow: 0 0px 0px rgba(0, 0, 0, 0.12), 0 0px 25px rgba(0, 0, 0, 0.10);
     border-radius: 0px;
     border: 10px solid #fff;
 }

 .control-filter-popover .filter-search input {
     min-height: 36px;
     border: none;
     border-bottom: 0px solid #d7dbdd;
     box-shadow: none;
     background-color: #f8f8f8;
     border-radius: 0px !important;
 }

 body .fr-box.fr-basic.fr-top .fr-wrapper,
 body .fr-box.fr-basic.fr-bottom .fr-wrapper {
     border-radius: 18px;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title:before,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title:before,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title:before,
 .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title:after,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title:after,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title:after {
     background: #fff;
 }

 .bg-p {
     background-color: #28282f !important;
 }

 .sidenav-tree ul.top-level > li > ul li.active {
     border-color: #f02 !important;
 }

 .sidenav-tree ul.top-level > li > div.group:before {
     border-top-color: #f02 !important;
 }

 .sidenav-tree ul.top-level > li > div.group:before,
 .sidenav-tree ul.top-level > li > div.group:after {
     border-top: 8px solid #f02 !important;
 }

 .select2-container--default .select2-search--dropdown .select2-search__field {
     background-color: #fff;
     border: 1px solid #dfdfdf;
     border-radius: 18px;
     color: #282828;
     font-size: 13px;
     -webkit-box-shadow: none;
     box-shadow: none;
     padding: 8px 15px 8px 15px;
     font-weight: bold;
 }

 .select2-container--default .select2-dropdown {
     -webkit-box-shadow: none;
     box-shadow: none;
     border-color: #dfdfdf;
     overflow-x: hidden;
     border-radius: 18px 18px;
     padding-bottom: 20px;
     padding-top: 20px;
     margin-top: 1px;
     margin-bottom: 20px;
     background-color: #fff;
 }

 body.outer .layout > .layout-row.layout-head {
     background: #fff;
 }

 body.outer {
     background: #28282F !important;
 }

 body.outer .layout > .layout-row > .layout-cell .outer-form-container .horizontal-form button {
     background: #f02;
 }

 .btn-text a:hover {
     color: #f02;
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-nav li:first-child,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-nav li:first-child {
     margin-left: 0;
     display: inline-block;
     background-image: url("https://elearning.tfsonline.sk/pluginfile.php/1/theme_learnr/logocompact/300x300/1720080617/TFSSK.png");
     width: 170px;
     background-repeat: no-repeat;
     background-size: contain;
     padding-left: 212px;
     height: 27px;
     margin-top: 23px;
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-nav li a .nav-label,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-nav li a .nav-label {
     display: none;
 }

 nav#layout-mainmenu.navbar ul li.active a,
 .mainmenu-collapsed li.active a {
     display: none;
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-toolbar li.mainmenu-account > a,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-toolbar li.mainmenu-account > a {
     line-height: 72px;
 }

 nav#layout-mainmenu ul.mainmenu-toolbar li.mainmenu-preview i {
     color: #28282f;
 }

 nav#layout-mainmenu ul.mainmenu-toolbar li.mainmenu-preview {
     display: none;
 }

 nav#layout-mainmenu ul {
     overflow: visible;
 }

 nav#layout-mainmenu ul li a img.svg-icon {
     height: 32px;
     width: 20px;
 }

 .sidenav-tree .control-toolbar input.form-control {
     padding: 10px 20px 10px;
     padding-right: 20px;
     -webkit-box-shadow: none;
     box-shadow: none;
     border-radius: 0px !important;
 }

 .popup-backdrop {
     background-color: #282828eb;
 }

 .btn-danger {
     background: #282828;
 }

 .btn-danger:hover,
 .btn-danger:focus,
 .btn-danger:active,
 .btn-danger.active,
 .open .dropdown-toggle.btn-danger {
     background: #f02;
     border-color: #f02;
 }

 .field-fileupload.style-image-single .upload-button {
     border: 1px dashed #dfdfdf !important;
 }

 .field-fileupload.style-image-single .upload-button .upload-button-icon::before {
     color: #dfdfdf !important;
 }

 .field-fileupload.style-image-single .upload-button:hover .upload-button-icon::before {
     color: #f02 !important;
 }

 .field-fileupload.style-image-single .upload-button {
     border: 1px dashed #dfdfdf !important;
     background-color: #f8f8f8 !important;
 }

 .field-fileupload.style-image-single .upload-button:hover {
     border: 1px dashed #f02 !important;
 }

 .field-fileupload.style-image-single .upload-button:hover .upload-button-icon:before {
     color: #f02 !important;
 }

 .popup-backdrop .popup-loading-indicator {
     display: block;
     width: 100px;
     height: 100px;
     position: absolute;
     top: 130px;
     left: 50%;
     margin-left: -50px;
     -webkit-transition: all 0.3s, width 0s;
     transition: all 0.3s, width 0s;
     -webkit-transform: scale(0.7);
     -ms-transform: scale(0.7);
     transform: scale(0.7);
     opacity: 0;
     filter: alpha(opacity=0)
 }

 .popup-backdrop .popup-loading-indicator:after {
     content: ' ';
     display: block;
     background-size: 50px 50px;
     background-repeat: no-repeat;
     background-position: 50% 50%;
     -webkit-animation: spin 1s linear infinite;
     animation: spin 1s linear infinite;
     width: 50px;
     height: 50px;
     margin: 5px
 }

 .popup-backdrop.loading .popup-loading-indicator {
     opacity: 1;
     filter: alpha(opacity=100);
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1)
 }

 .lo.mac body.modal-open {
     margin-right: 0
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-toolbar li.mainmenu-preview a,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-toolbar li.mainmenu-preview a {
     height: 75px;
     line-height: 75px;
 }

 .fr-desktop .fr-command:hover,
 .fr-desktop .fr-command:focus,
 .fr-desktop .fr-command.fr-btn-hover,
 .fr-desktop .fr-command.fr-expanded {
     border-radius: 50% !important;
 }

 .clear-input-text {
     border-radius: 50%;
     padding: 0px 8px;
     font-size: 15px;
     color: #f02;
     background-color: #fff;
     height: 26px;
 }

 .form-buttons .btn {
     margin-right: 5px;
 }

 .control-tabs.primary-tabs > ul.nav-tabs > li,
 .control-tabs.primary-tabs > div > ul.nav-tabs > li,
 .control-tabs.primary-tabs > div > div > ul.nav-tabs > li {
     text-transform: uppercase;
 }

 nav#layout-mainmenu.navbar-mode-inline ul.mainmenu-nav li:last-child,
 nav#layout-mainmenu.navbar-mode-inline_no_icons ul.mainmenu-nav li:last-child {
     position: absolute;
     right: 5px;
 }

 /*----------- Update 17.12.2024 ------------*/
 .img-responsive.img-thumbnail {
     border-radius: 50% !important;
 }

 small,
 .small {
     font-size: 11px;
     color: #fff !important;
     background-color: #f02;
     padding: 2px 8px;
     border-radius: 18px;
     display: inline-block;
     margin-top: 4px;
     margin-left: -6px;
 }

 .control-toolbar input.form-control[type="text"] {
     padding: 5px 18px;
     font-size: 12px;
     text-transform: uppercase;
     min-width: 140px;
     line-height: 16px;
 }

 .control-toolbar .toolbar-item {
     text-align: left;
     padding-right: 10px;
     padding-bottom: 30px;
 }

 .form-control:focus {
     border: 1px solid #282828;
 }

 .list-flush table.table.data thead tr th {
     border-top: 1px solid #fff !important;
     background-color: #fff !important;
 }

 .clear-input-text > i {
     opacity: 1;
 }

 .control-tabs > ul.nav-tabs > li a,
 .control-tabs > div > ul.nav-tabs > li a,
 .control-tabs > div > div > ul.nav-tabs > li a {
     color: #282828;
 }

 .btn[class^="oc-icon-"]:before,
 .btn[class*=" oc-icon-"]:before {
     font-size: 11px;
     opacity: 0.4;
 }

 .control-toolbar .toolbar-item .btn,
 .control-toolbar .toolbar-item .btn-group,
 .control-toolbar .toolbar-item .dropdown {
     min-width: 140px;
     text-align: center;
 }

 .control-toolbar .toolbar-item .btn:last-child,
 .control-toolbar .toolbar-item .btn-group:last-child,
 .control-toolbar .toolbar-item .dropdown:last-child {
     min-width: 140px;
     text-align: center;
     background-color: #34d3f1;
     color: #fff;
     border: 1px solid #34d3f1;
     border-radius: 18px;
 }

 .control-toolbar .toolbar-item .btn:last-child:hover,
 .control-toolbar .toolbar-item .btn-group:last-child,
 .control-toolbar .toolbar-item .dropdown:last-child {
     background-color: #282828;
     color: #fff;
     border: 0px solid #282828;
     line-height: 16px;
 }

 .control-tabs > ul.nav-tabs > li,
 .control-tabs > div > ul.nav-tabs > li,
 .control-tabs > div > div > ul.nav-tabs > li {
     vertical-align: top;
 }

 .form-control.icon.search {
     background-position: right -87px;
 }

 table.table.data thead .list-checkbox .custom-checkbox {
     top: -10px;
 }

 .control-filter > .filter-has-popover .filter-setting {
     font-weight: normal;
 }

 .btn[disabled] {
     color: #999;
 }

 .btn.disabled,
 .btn[disabled],
 fieldset[disabled] .btn {
     opacity: 1;
 }

 .custom-checkbox label,
 .custom-radio label {
     line-height: 20px;
 }

 .list-scrollable-container:after,
 .list-scrollable-container:before {
     top: 11px;
 }

 .form-control.growable:focus,
 .form-control.growable:active {
     width: 300px !important;
 }

 .title-value h4 {
     color: #999 !important;
 }

 .callout.callout-info > .content {
     border: 1px solid #dfdfdf;
 }

 .import-behavior .import-db-columns > ul > li.is-required .column-icon {
     color: #f02;
 }

 .control-filter > .filter-has-popover.active .filter-setting {
     background-color: #f02;
     font-weight: bold;
     padding: 1px 15px;
 }

 .control-filter > .filter-has-popover:hover.active .filter-setting {
     background-color: #f02;
 }

 .pika-single .is-selected .pika-button {
     background: #f02;
 }

 .pika-single .is-today .pika-button {
     color: #f02;
 }

 .pika-single .pika-button:hover {
     color: #282828 !important;
 }

 .container-fluid {
     margin-bottom: 20px;
 }

 table.table.data thead tr th.list-checkbox {
     padding: 8px 0 0 20px;
 }

 .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
     border-bottom-right-radius: 18px;
     border-top-right-radius: 18px;
 }

 .control-filter > .filter-scope.text {
     padding: 3px 10px;
 }

 .sidenav-tree .control-toolbar input.form-control.search {
     background-position: right -85px;
 }

 .sidenav-tree ul.top-level > li > ul li a i {
     position: absolute;
     left: 14px;
     top: 16px;
     font-size: 19px;
     color: #f02;
 }

 .sidenav-tree ul.top-level > li > ul li a span.description {
     color: #fff;
 }

 div.scoreboard div.scoreboard-item:last-child {
     margin-right: 0;
     margin-left: 0px;
 }

 .form-group.is-required > label:not(.custom-switch):after,
 .form-group.is-required > .field-switch > label:after {
     background-color: #f02;
 }

 .control-chart div.chart-legend table tr td i {
     border-radius: 10px;
 }

 .select2-container--default .select2-results__option[aria-selected="true"] {
     background-color: #282828;
     color: #fff;
 }

 .select2-container--default.select2-container--open.select2-container--below .select2-selection:not(.select-no-dropdown) {
     border-bottom-right-radius: 18px;
     border-bottom-left-radius: 18px;
     border-bottom-color: #d1d6d9;
 }

 .select2-container--default.select2-container--open.select2-container--above .select2-selection:not(.select-no-dropdown) {
     border-top-right-radius: 18px;
     border-top-left-radius: 18px;
     border-top-color: #d1d6d9;
 }

 .select2-container--open .select2-dropdown--below {
     border-top: 1px solid #dfdfdf;
 }

 .btn-success:hover,
 .btn-success:focus,
 .btn-success:active,
 .btn-success.active,
 .open .dropdown-toggle.btn-success {
     color: #fff;
     background: #f02;
     border-color: #f02;
 }

 /*----------- Update 14.07.2025 ------------*/
 .filter-scope.checkbox.custom-checkbox.is-indeterminate[data-scope-name="course_is_valid"] {
     padding-right: calc(100% - 400px);
 }

 .control-toolbar .toolbar-item::after {
     margin-top: -21px;
     color: #f02;
 }

 html.cssanimations .loading-indicator.is-opaque > span,
 html.cssanimations .loading-indicator-container.is-opaque .loading-indicator > span {
     top: 3px;
 }

 .flash-message.success {
     background: #f02;
 }