/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
a {
  outline: 0;
  /*dodano*/

}
/* #region variables */
/* #endregion */

/* #region z-index legenda */

/* #endregion */

/* #region ikone */

@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 200;
  src: url(/statika/style/baseRes/materialsymbolsoutlined_v164_wght_200_opsz_24_fill_0_grad_0.woff2) format('woff2');
}
.fontIcon::before,
.fontIcon::after,
.iconBtn::after,
.iconBtn::before,
.datalane th.sorted::after,
.datalane th.configTable > div::after,
.datalane th.configTable .dlMenuItem::before,
.datalane td.expand > div::before,
.titleBack::before,
.icon.userBlank::before,
.footable th.footable-sorted::after,
.footable th.footable-sorted-desc::after,
.tileContent .tileNum span.completed::after,
.tileContent .tileNum span.uncompleted::after,
.tileContent::before,
.skupnost .tileName::before,
.tileNum::after,
.imglink.openMenu::before,
.moreBar .moreBtn::after,
.columnContent .linkGroup a::before,
#atomtree .atomThumb::before,
#atomtree .atomArrow::after,
#atomtreeBtns button::after,
.ucilnicaKomunikacija .colleaguesList .tileData::before,
.columnContent h2 a::after,
#aktivnosti a::after,
#aktivnosti .aktivnostVrsta::before,
#aktivnosti .aktivnostInfo::before,
#mainContent.listDetails #column1 .tileData::before,
#mainContent #column2 .detailsHeader h1 a::after,
#mainCentral.startPage .eCourseMentorProfileImage.generic::before,
#mainCentral.startPage .eCourseImage.generic::before,
.actIcon::after,
.atomArrow::after,
#mainCentral.startPage .messagesNumber::after,
.atomBtn::after,
.mqTitleLbl::before,
.alinejaPostopekNivo1::before,
.alinejaPostopekNivo2::before,
.searchBtnInner::before,
.commentTitle::before,
.toggleMenuChildren::before,
.menuItemIcon::before,
.additionalActions::before,
.moreActions::after,
.profileImgBox::before,
.forumPagerBtn::before,
.userImgCell .userBlank::before,
.themesGrid .postBtn::before,
.newAtomBckg::before,
.explanationTrigger::before,
.IEAccordion .panelActions .actionBtn::before,
.IELightBox:after,
.answerIcon::before,
.mq .stateIcon::before,
#euUprUdelDodaj table a:not(.uprRoot)::before,
.btnObrazlozitev::before,
.btnDeleteQuestion::before,
.postBtn::before,
.recipients span::after,
.moreValuesToggle::before,
#addUsersSettings::before,
.toggleUserGroup::before,
#userListSearchClear::before,
.userCheck::before,
#addUsersSettings .moreActionsMenuItem::before,
.pagerBtn::after,
.btnPodAktivnost::after,
#ckDropCloseBtn::before,
#atomImageDropCloseBtn::before,
#atomtreeDropCloseBtn::before,
.dndCancelBtn::before,
.dndSuccessfulIcon::before,
.IEAccordion.arrows .IEAccordionItem:not(.edit) .panelTitle::before,
.testBtn::before,
#seminarHistoryToggle::before,
.ui-resizable-se::before,
.cke_button_icon::before,
.tile.licence .icon::before,
.cke_dialog_close_button::after,
.search-choice-close::after,
.diamond::after,
.myProgressGraphIcon::after,
.podrocjeInfo::before {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
}
/* #endregion */

/* #region generic elements/classes */

body,
input,
button,
textarea,
select {
  font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
  color: #333333;
}
a:link,
a:visited,
a:hover,
a:active {
  text-decoration: none;
}
.link,
.link:link,
.link:visited {
  color: #00b0f0;
  cursor: pointer;
}
.link:hover,
.link:active {
  color: #0092c7;
}
h1 {
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
}
h2 {
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
  font-size: clamp(1.33rem, 1.7vw, 1.6rem);
}
h3 {
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
}
h4 {
  font-size: 14px;
  margin-bottom: 15px;
  text-transform: uppercase;
}
.tabs {
  margin-bottom: 20px;
}
.tabs:has(> .titleBtns) {
  display: flex;
  align-items: center;
}
.tabs:has(> .titleBtns) h1 {
  margin-bottom: 0 !important;
}
.tabs .titleBtns {
  display: inline-block;
  margin-right: 15px;
  vertical-align: middle;
}
.titleBack::before {
  content: "arrow_back_ios_new";
  display: block;
  text-align: center;
  padding: 7px 0;
  position: relative;
  right: 1px;
  top: 2px;
}
.tabs h1 {
  display: inline-block;
  vertical-align: middle;
  text-transform: uppercase;
}
.menuSeparator {
  display: none !important;
}
.right {
  text-align: right;
}
.left {
  text-align: left;
}
.center {
  text-align: center;
}
.desno {
  text-align: right;
}
.levo {
  text-align: left;
}
.sredina {
  text-align: center;
}
.bold,
.krepko,
.poudari,
b,
.required {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.podnapis {
  color: #8d8d8d;
}
.poudari {
  color: #00b0f0;
}
.lezece {
  font-style: italic;
}
.podcrtano {
  text-decoration: underline;
}
.error,
.errorMessages {
  color: red;
}
.infoTxt {
  margin-bottom: 20px;
}
.lowerCase {
  text-transform: lowercase;
}
.clr,
.clear {
  clear: both;
  font-size: 0;
  line-height: 0;
}
.clearfix::after {
  content: "";
  clear: both;
  display: block;
}
.predelanoLink,
.predelanoLink:link,
.predelanoLink:visited,
.predelanoLink:hover,
.predelanoLink:active {
  color: #4cbd6b !important;
}
.predelanoLink.failed,
.predelanoLink.failed:link,
.predelanoLink.failed:visited,
.predelanoLink.failed:hover,
.predelanoLink.failed:active {
  color: red !important;
}
.predelanoBox {
  width: 160px;
  margin: 0 auto;
}
.predelanoBox .predelanoout {
  float: left;
  margin: 3px 5px 0 0;
}
.predelanoout {
  background-color: white;
  border: solid 1px #4cbd6b;
  width: 100px;
  height: 8px;
  font-size: 0;
  border-radius: 5px;
}
.predelanoout.failed {
  border: solid 1px red;
}
.predelano {
  background-color: #4cbd6b;
  height: 8px;
  float: left;
}
.predelanoout.failed .predelano {
  background-color: red;
}
.floatL {
  float: left;
}
.floatR {
  float: right;
}
.sirina100 {
  width: 100px;
}
.cke {
  border-radius: 10px;
  overflow: hidden;
}
.page_certificateedit #header {
  z-index: 10;
}
.page_certificateedit .tabs {
  margin-bottom: 0;
}
.page_certificateedit #mainContent {
  background-color: transparent;
  border: 0 none;
  border-radius: 0;
  padding: 0;
  margin-top: 170px;
  padding-bottom: 50px;
}
.ui-resizable-se {
  bottom: 0;
  cursor: se-resize;
  height: 20px;
  right: 0;
  width: 20px;
  background-color: transparent;
}
.ui-resizable-se:hover {
  background-color: #cccccc;
}
.ui-resizable-se::before {
  content: "pan_zoom";
  transform: rotate(90deg);
}
.cke.cke_float {
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
}
.cke_float .cke_top {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
}
.csvLink {
  cursor: pointer;
}
.clearfix .analysisSubtitle {
  float: left;
}
.right:has(.csvLink:not(.csvTop)) {
  display: none;
}
.miniBtn {
  margin-left: 10px;
}
.colonAfter:after {
  content: ":";
  display: inline-block;
}
.fieldsHidden {
  cursor: pointer;
}
div.mainheading {
  margin: 2px;
}
.formSeparator2 hr {
  height: 1px;
  border: 0 none;
  background-color: #d2d2d2;
  margin: 0.5em 0;
}
.overflowAuto {
  overflow: auto;
}
/* #endregion */

/* #region main layout elements */

#B2SkinMetroMaster {
  width: 100%;
  height: 100vh;
  display: grid;
  grid-template-rows: 85px 1fr;
  grid-template-columns: 100px 1fr;
  grid-template-areas: "topbar topbar" "sidebar content";
}
#B2SkinMetroMaster.page_learning {
  grid-template-columns: 0 1fr;
}
#mainContentWrapper,
main {
  grid-area: content;
  padding: 50px;
  overflow-y: auto;
  background-color: #ededed;
  box-sizing: border-box;
}
#mainContent,
#mainCentral {
  height: fit-content;
  margin: 0 auto;
  max-width: 1420px;
  border: 1px solid #d2d2d2;
  background-color: white;
  border-radius: 10px;
  padding: 40px;
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
#mainContent.singleColumn {
  flex-direction: column;
}
#mainContent.singleColumn .column,
#mainContent.twoColumn .column.column3 {
  width: 100%;
}
#mainContent.singleColumn .column,
#mainContent.twoThirdsColumn .column {
  flex: 1;
}
#mainContent .column > h1:not(:empty) {
  margin-bottom: 20px;
}
#mainContent.twoColumn div:has(> .column) {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
}
.ajax__tab_body .ajax__tab_body {
  padding: 0;
  border-radius: 0;
  border: none;
}
.ajax__tab_container .ajax__tab_container .ajax__tab_header {
  gap: 10px 40px;
}
.ajax__tab_container .ajax__tab_container .ajax__tab_header a {
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
}
.ajax__tab_header,
#userlistTabs {
  display: flex;
  gap: 20px 70px;
  flex-wrap: wrap;
  margin-bottom: 35px;
}
.ajax__tab_header > span {
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  font-weight: lighter;
  cursor: pointer;
}
.ajax__tab_header > span:hover {
  color: #333333;
}
.ajax__tab_header a {
  color: #8d8d8d;
}
.ajax__tab_header > .ajax__tab_active .ajax__tab_tab span,
#userlistTabs .tab.active {
  border-bottom: 5px solid #ffdc40;
  padding-bottom: 5px;
}
.ajax__tab_header > .ajax__tab_active a {
  color: #333333;
}
.ajax__tab_default .ajax__tab_tab {
  overflow: visible !important;
}
.ajax__tab_hover a {
  color: #333333;
}
.ajax__scroll_none {
  overflow: visible !important;
}
/* #endregion */

/* #region navigation/sidebar */

#header {
  grid-area: topbar;
  border-top: 4px solid #00b0f0;
  border-bottom: 1px solid #d2d2d2;
  background-color: white;
  display: flex;
  align-items: center;
  padding: 15px 23px;
  gap: 20px;
  justify-content: space-between;
}
#navigation {
  border-right: 1px solid #d2d2d2;
  grid-area: sidebar;
  background-color: white;
  /*
    display: flex;
        flex-direction: column;
        gap: 10px;
        justify-content: space-between;
    */
  z-index: 3;
  width: 100%;
  position: relative;
}
footer {
  padding: 15px 10px;
  margin: 0 auto;
  text-align: center;
  font-size: clamp(0.66rem, 0.84vw, 0.79rem);
}
footer a {
  color: #8d8d8d;
}
footer a:hover {
  text-decoration: underline;
}
.headTopLogoTitle img {
  height: 100%;
}
#userMenuTrigger {
  color: #8d8d8d;
  position: relative;
  cursor: pointer;
  user-select: none;
  display: flex;
  align-items: center;
}
#userMenuTrigger:hover {
  color: #333333;
}
#userMenuTrigger .defaultAvatar::before {
  vertical-align: middle;
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  content: "person";
  position: relative;
  top: -3px;
  color: #8d8d8d;
}
#userMenuTrigger .userImg {
  display: inline-block;
  width: 30px;
  height: 30px;
  background-size: contain;
  border-radius: 15px;
}
#userMenuTrigger > span {
  margin-left: 10px;
}
#userMenuTrigger > span::after {
  vertical-align: middle;
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  content: "keyboard_arrow_down";
  transition: transform 0.15s;
}
#userMenuTrigger.opened > span::after {
  transform: rotate(180deg);
}
#userMenu {
  min-width: 200px;
  display: none;
  text-align: right;
  position: absolute;
  overflow: hidden;
  flex-direction: column;
  top: 40px;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  right: 0px;
  z-index: 3;
  cursor: pointer;
}
#userMenu a,
#userMenu div {
  display: block;
  padding: 8px 18px;
  text-decoration: none;
  color: black;
  background-color: #f6f6f6;
  white-space: nowrap;
}
#userMenu a:hover,
#userMenu div:hover {
  background-color: #eaeaea;
}
#userMenu a:hover,
#userMenu div:hover {
  background-color: #eaeaea;
}
#headerUserInfo {
  display: flex;
  align-items: center;
}
#headerUserInfo #help {
  display: none;
}
.imglink.openMenu {
  display: none;
  cursor: pointer;
}
.imglink.openMenu::before {
  display: block;
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  content: "menu";
  margin-right: 20px;
  color: #8d8d8d;
}
.imglink.openMenu:hover::before {
  color: #333333;
}
.page_learning .imglink.openMenu {
  display: none;
}
#navContent {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  max-height: 100%;
  overflow-y: auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
#navigationTabs {
  display: flex;
  flex-direction: column;
}
#navigationTabs a {
  text-decoration: none;
  color: #8d8d8d;
  padding: 15px 15px;
  text-align: center;
  cursor: pointer;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
}
#navigationTabs a:hover {
  background-color: #f6f6f6;
  color: #333333;
}
#navigationTabs a.active {
  background-color: #ffdc40;
  color: #333333;
}
#navigationTabs .txtlink::before,
#navigationTabs .imglink::before {
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  display: block;
}
#navigationTabs .home::before {
  content: "home";
}
#navigationTabs .econtents::before {
  content: "menu_book";
}
#navigationTabs .eclassrooms::before {
  content: "local_library";
}
#navigationTabs .community::before {
  content: "communities";
}
#navigationTabs .manager::before {
  content: "deployed_code_account";
}
#navigationTabs .hrm::before {
  content: "apartment";
}
#navigationTabs .admin::before {
  content: "shield_person";
}
#navigationTabs .catalog::before {
  content: "book_3";
}
#headerLogo,
#headerLogo a,
#headerLogo a img {
  height: 100%;
}
#headerLogo a {
  display: inline-block;
}
#headerSearchBox .searchBox {
  width: clamp(150px, 20vw, 500px);
}
#footer {
  display: none;
}
/* #endregion */

/* #region popup okna */

.dialogShadow {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 1999;
}
.dialogMain {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2000;
  width: 100%;
  background-color: white;
  padding: 30px 15px;
  color: #333333;
  max-height: 95%;
  overflow-y: auto;
  box-sizing: border-box;
}
.dialogMain #mainContent.content,
.dialogMain .content {
  margin: 0 auto;
  width: 80%;
  max-width: 1050px;
  min-width: 550px;
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: 0;
  display: flex;
  flex-direction: column;
}
.dialogMain .content h1,
.dialogMain .content h3,
.dialogMain .content p {
  margin-bottom: 20px;
}
.dialogMain .content h1 {
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
}
.dialogMain .content .sectionTitle {
  font-size: clamp(1.33rem, 1.7vw, 1.6rem);
  margin-bottom: 10px;
  font-weight: 300;
}
.dialogMain .content .form {
  /*
    width: 100%;
    margin: auto;
    */
  max-width: none;
}
#headProgressDataBox {
  position: absolute;
  z-index: 1000000;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
#headProgressData {
  display: flex;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  padding: 20px;
  background-color: white;
  align-items: center;
}
#progressShadow {
  position: fixed;
  width: 100vw;
  height: 100vh !important;
  z-index: 20;
}
.loading {
  position: relative;
  min-height: 110px;
}
.sk-loading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  z-index: 20;
}
#headProgressData .sk-loading {
  position: static;
  height: 20px;
  width: auto;
  margin-right: 20px;
}
#mainCentral > .sk-loading {
  top: 0;
}
.sk-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*ce odstranimo staro vsebino, ne rabimo background-color in opacity */
  background-color: white;
  opacity: 0.75;
  border-radius: 10px;
}
.sk-folding-cube {
  margin: 50px auto;
  width: 40px;
  height: 40px;
  position: relative;
  -webkit-transform: rotateZ(45deg);
  transform: rotateZ(45deg);
}
#headProgressData .sk-folding-cube {
  width: 20px;
  height: 20px;
  margin: 0;
}
.sk-folding-cube .sk-cube {
  float: left;
  width: 50%;
  height: 50%;
  position: relative;
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.sk-folding-cube .sk-cube:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #00b0f0;
  -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
  animation: sk-foldCubeAngle 2.4s infinite linear both;
  -webkit-transform-origin: 100% 100%;
  -ms-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}
.sk-folding-cube .sk-cube2 {
  -webkit-transform: scale(1.1) rotateZ(90deg);
  transform: scale(1.1) rotateZ(90deg);
}
.sk-folding-cube .sk-cube3 {
  -webkit-transform: scale(1.1) rotateZ(180deg);
  transform: scale(1.1) rotateZ(180deg);
}
.sk-folding-cube .sk-cube4 {
  -webkit-transform: scale(1.1) rotateZ(270deg);
  transform: scale(1.1) rotateZ(270deg);
}
.sk-folding-cube .sk-cube2:before {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.sk-folding-cube .sk-cube3:before {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}
.sk-folding-cube .sk-cube4:before {
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}
@-webkit-keyframes sk-foldCubeAngle {
  0%, 10% {
    -webkit-transform: perspective(140px) rotateX(-180deg);
    transform: perspective(140px) rotateX(-180deg);
    opacity: 0;
  }
  25%, 75% {
    -webkit-transform: perspective(140px) rotateX(0deg);
    transform: perspective(140px) rotateX(0deg);
    opacity: 1;
  }
  90%, 100% {
    -webkit-transform: perspective(140px) rotateY(180deg);
    transform: perspective(140px) rotateY(180deg);
    opacity: 0;
  }
}
@keyframes sk-foldCubeAngle {
  0%, 10% {
    -webkit-transform: perspective(140px) rotateX(-180deg);
    transform: perspective(140px) rotateX(-180deg);
    opacity: 0;
  }
  25%, 75% {
    -webkit-transform: perspective(140px) rotateX(0deg);
    transform: perspective(140px) rotateX(0deg);
    opacity: 1;
  }
  90%, 100% {
    -webkit-transform: perspective(140px) rotateY(180deg);
    transform: perspective(140px) rotateY(180deg);
    opacity: 0;
  }
}
#locProgressData {
  color: #333333;
}
#helpAccordion {
  margin-bottom: 20px;
}
#helpAccordion h3 {
  font-size: clamp(1.33rem, 1.7vw, 1.6rem);
  margin-bottom: 10px;
  cursor: pointer;
  display: flex;
}
#helpAccordion h3::before {
  content: "keyboard_arrow_down";
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  transition: transform 0.15s;
  margin-right: 10px;
}
#seminarHistoryToggle::before {
  content: "keyboard_arrow_down";
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  transition: transform 0.15s;
  vertical-align: sub;
}
#helpAccordion h3.ui-state-active::before,
#seminarHistoryToggle.ui-state-active::before {
  transform: rotate(180deg);
}
#helpAccordion .helpLink {
  color: #00b0f0;
}
.dialogMain:has(.changeLanguage) {
  overflow-y: unset;
}
/* #endregion */

/* #region forme */

.form {
  max-width: 950px;
}
.form:has(.dlFilters),
.form:has(.foofilters) {
  max-width: unset;
}
.form > p {
  margin-bottom: 16px;
}
.form.widthMax {
  width: auto;
}
.formContent {
  background-color: #f6f6f6;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 20px;
}
.formContent > .foofilters {
  border: none;
  padding: 0;
  border-radius: 0;
}
.formContent:has(.ckeditorClassroom) {
  padding: 0;
  border-radius: 0;
  border: none;
}
.formContent table,
.formView {
  width: 100%;
}
.formContent tr:only-child td {
  padding-bottom: 0;
}
.formContent td {
  vertical-align: top;
  padding-bottom: 14px;
}
.formContent .labelCell {
  width: 37%;
  text-align: right;
  padding-right: 3%;
  padding-top: 12px;
}
label,
.formContent .inputCell .lbl {
  margin-right: 20px;
}
.formContent .inputCell .txt {
  display: inline-block;
  padding-top: 12px;
}
.formContent .inpChk,
.formContent input[type="checkbox"] {
  position: relative;
  top: 1px;
}
.inputCell input[type="file"] {
  padding-top: 11px;
}
.formContent .tab3 input[type="checkbox"],
.formContent .tab3 input[type="radio"],
.inputCell input[type="checkbox"],
.inputCell input[type="radio"] {
  margin-top: 14px;
}
.input-validation-error {
  border: 1px solid red !important;
}
.inlineBtnBar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  margin-bottom: 20px;
  align-items: center;
}
.inlineBtnBar.afterForm {
  justify-content: flex-end;
}
.inlineBtn,
.qq-upload-button,
input[type="button"] {
  background-color: #00b0f0;
  color: white;
  padding: 10px 40px;
  border-radius: 20px;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  line-height: 20px;
  border: none;
  display: inline-block;
  width: fit-content;
  text-transform: lowercase;
  white-space: nowrap;
  height: 40px;
  box-sizing: border-box;
}
.inlineBtn:hover,
.qq-upload-button:hover,
input[type="button"]:hover {
  background-color: #0092c7;
}
.inlineBtn.secondaryBtn,
.inlineBtn.cancelBtn {
  background-color: white;
  color: #00b0f0;
  border: 1px solid #00b0f0;
  padding: 9px 39px;
}
.inlineBtn.secondaryBtn:hover,
.inlineBtn.cancelBtn:hover {
  background-color: #e3f8ff;
}
.inlineBtn[disabled],
.inlineBtn[disabled]:hover,
.disabledBtn,
.disabledBtn:hover,
.pagerBtn.disabled,
.pagerBtn.disabled:hover {
  background-color: #e8e8e8 !important;
  color: #b5b5b5 !important;
  border: 1px solid #e8e8e8 !important;
  cursor: default !important;
  pointer-events: none !important;
}
.iconBtn.disabledBtn,
.secondaryBtn.disabledBtn {
  border: 1px solid #d2d2d2 !important;
}
.disabledBtn .inlineBtn {
  color: #b5b5b5 !important;
  border-color: #b5b5b5 !important;
}
.btnAdditional {
  position: relative;
  color: white;
  border-radius: 20px;
  background-color: #00b0f0;
  display: flex;
  gap: 0px !important;
  align-items: center;
}
.btnAdditional:hover {
  background-color: #0092c7;
}
.btnAdditional .inlineBtn {
  background-color: transparent;
  color: white;
  border: none;
  padding: 0;
  border-radius: 0;
  padding-right: 10px;
  padding-left: 40px;
  padding-top: 10px;
  border-right: 1px solid white;
}
.btnAdditional input.inlineBtn {
  background-color: transparent !important;
  padding-top: 0;
}
.additionalActions,
.moreActions {
  position: relative;
  cursor: pointer;
}
.additionalActions {
  padding: 10px 20px 10px 10px;
}
.moreActions {
  padding: 10px 20px 10px 30px;
}
.additionalActions::before,
.moreActions::after {
  content: "keyboard_arrow_down";
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  line-height: 0.6;
  position: relative;
}
.additionalActions::before {
  top: 4px;
}
.moreActions::after {
  top: 6px;
}
.additionalActions.opened::before,
.moreActions.opened::after {
  content: "keyboard_arrow_up";
}
.additionalActions .moreActionsMenu,
.moreActions .moreActionsMenu {
  display: none;
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translateY(100%);
  background-color: #00b0f0;
  border-radius: 20px;
  overflow: hidden;
  text-align: right;
  font-weight: 500;
  user-select: none;
  z-index: 1;
}
#wizardcontent .moreActionsMenu {
  width: max-content;
}
.wizzardAdditionalInput {
  display: none;
}
.additionalActions .moreActionsMenu a,
.moreActions .moreActionsMenu a:link,
.moreActions .moreActionsMenu a:visited,
.moreActionsMenuItem {
  color: white;
  padding: 10px 20px;
  display: block;
  text-decoration: none;
}
.additionalActions .moreActionsMenu a:hover,
.moreActions .moreActionsMenu a,
.moreActionsMenuItem:hover,
.tablesort td .moreActions .moreActionsMenu a:hover,
.tablesort td .moreActions .moreActionsMenu a:active {
  color: white;
}
.additionalActions .moreActionsMenu a:hover,
.moreActions .moreActionsMenu a:hover,
.moreActionsMenuItem:hover {
  background-color: #0092c7;
}
.moreBar .moreBtn {
  color: #00b0f0;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.moreBar .moreBtn:hover {
  color: #0092c7;
}
.moreBar .moreBtn::after {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  margin-left: 5px;
}
.moreBar .moreBtn.add::after {
  content: "add_circle";
}
.moreBar .moreBtn.more::after {
  content: "expand_circle_right";
}
.moreBar .moreBtn.myCommentsAdd::after {
  content: "expand_circle_down";
}
.moreBar .moreBtn.myCommentsAdd.opened::after {
  content: "expand_circle_up";
}
.titleBack {
  display: inline-block;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  border: 1px solid #00b0f0;
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  color: #00b0f0;
  background-color: white;
  text-decoration: none;
  box-sizing: border-box;
}
.titleBack:hover {
  background-color: #e3f8ff;
}
.inpTxt,
input[type="text"],
input[type="number"],
select,
textarea {
  border: 1px solid #d2d2d2;
  border-radius: 20px;
  background-color: white;
  padding-inline: 15px;
  font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  line-height: 20px;
  box-sizing: border-box;
  height: 40px;
}
input[disabled],
select[disabled],
textarea[disabled] {
  background-color: #e8e8e8;
  color: #b5b5b5;
}
textarea {
  min-height: 100px;
  width: 100%;
  padding-block: 15px;
}
.content .qq-uploader ul.qq-upload-list {
  margin-left: 0;
  list-style-type: none;
  font-size: inherit;
  margin-bottom: 0;
}
.qq-upload-list li {
  padding: 10px 0;
}
.qq-upload-failed-text {
  display: none;
}
.qq-upload-file,
.qq-upload-size {
  display: block;
}
.qq-upload-fail .qq-upload-failed-text {
  display: block;
}
.qq-upload-success .qq-upload-file {
  padding-right: 20px;
}
.qq-upload-list .inlineBtn {
  margin-left: 10px;
}
.chosen-container {
  position: relative;
  display: inline-block;
  vertical-align: top;
  font-size: clamp(0.74rem, 0.94vw, 0.89rem);
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  min-width: fit-content;
}
.chosen-container * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
}
.chosen-container .chosen-drop {
  position: absolute;
  top: 100%;
  left: -9999px;
  z-index: 1010;
  width: 100%;
  border: 1px solid #cccccc;
  border-top: 0;
  background: white;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
  border-radius: 20px;
  overflow: hidden;
}
.chosen-container.chosen-with-drop .chosen-drop {
  left: 0;
}
.chosen-container a {
  cursor: pointer;
}
.chosen-container .search-choice .group-name,
.chosen-container .chosen-single .group-name {
  margin-right: 4px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: normal;
  color: #999999;
}
.chosen-container .search-choice .group-name:after,
.chosen-container .chosen-single .group-name:after {
  content: ":";
  padding-left: 2px;
  vertical-align: top;
}
.chosen-container-single .chosen-single {
  position: relative;
  display: block;
  overflow: hidden;
  height: 40px;
  border: 1px solid #d2d2d2;
  background-color: white;
  color: #444444;
  text-decoration: none;
  white-space: nowrap;
  line-height: 28px;
  border-radius: 20px;
  padding: 4px 12px;
}
.chosen-container-single.chosen-with-drop .chosen-single {
  border-radius: 20px 20px 0 0;
}
.chosen-container-single .chosen-default {
  color: #999999;
}
.chosen-container-single .chosen-single span {
  display: block;
  overflow: hidden;
  margin-right: 26px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chosen-container-single .chosen-single-with-deselect span {
  margin-right: 38px;
}
.chosen-container-single .chosen-single abbr {
  position: absolute;
  top: 6px;
  right: 26px;
  display: block;
  width: 12px;
  height: 12px;
  background: url(/statika/style/chosen-sprite.png) -42px 1px no-repeat;
  font-size: 1px;
}
.chosen-container-single .chosen-single abbr:hover {
  background-position: -42px -10px;
}
.chosen-container-single.chosen-disabled .chosen-single abbr:hover {
  background-position: -42px -10px;
}
.chosen-container-single .chosen-single div {
  position: absolute;
  top: 1px;
  right: 10px;
  display: block;
  width: 18px;
  height: 100%;
}
.chosen-container-single .chosen-single div b {
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  top: 50%;
  right: -2px;
  margin-top: -3px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid #333333;
}
.chosen-container-single .chosen-search {
  position: relative;
  z-index: 1010;
  margin: 0;
  padding: 3px 4px;
  white-space: nowrap;
}
.chosen-container-single .chosen-search input[type="text"] {
  margin: 1px 0;
  padding: 4px 20px 4px 5px;
  width: 100%;
  height: auto;
  outline: 0;
  border: 1px solid #cccccc;
  font-size: 1em;
  font-family: sans-serif;
  line-height: normal;
}
.chosen-container-single .chosen-drop {
  margin-top: -1px;
  background-clip: padding-box;
}
.chosen-container-single.chosen-container-single-nosearch .chosen-search {
  position: absolute;
  left: -9999px;
}
.chosen-container .chosen-results {
  color: #444444;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 240px;
  -webkit-overflow-scrolling: touch;
}
.chosen-container .chosen-results li {
  display: none;
  margin: 0;
  padding: 6px 12px;
  list-style: none;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  line-height: 15px;
  word-wrap: break-word;
  -webkit-touch-callout: none;
}
.chosen-container .chosen-results li.active-result {
  display: list-item;
  cursor: pointer;
}
.chosen-container .chosen-results li.disabled-result {
  display: list-item;
  color: #cccccc;
  cursor: default;
}
.chosen-container .chosen-results li.highlighted {
  background-color: #eaeaea;
  color: #333333;
}
.chosen-container .chosen-results li.no-results {
  color: #777777;
  display: list-item;
  background: #f4f4f4;
}
.chosen-container .chosen-results li.group-result {
  display: list-item;
  font-weight: bold;
  cursor: default;
}
.chosen-container .chosen-results li.group-option {
  padding-left: 15px;
}
.chosen-container .chosen-results li em {
  font-style: normal;
  text-decoration: underline;
}
.chosen-container-multi .chosen-choices {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 0 5px;
  width: 100%;
  height: auto;
  border: 1px solid #cccccc;
  background-color: white;
  cursor: text;
  border-radius: 20px;
  min-height: 40px;
  box-sizing: border-box;
}
.chosen-container-multi .chosen-choices li {
  float: left;
  list-style: none;
}
.chosen-container-multi .chosen-choices li.search-field {
  margin-top: 5px;
  margin-left: 7px;
  padding: 0;
  white-space: nowrap;
}
.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
  margin: 1px 0;
  padding: 5px 3px;
  height: 28px;
  outline: 0;
  border: 0 !important;
  background: transparent !important;
  color: #999999;
  font-size: 100%;
  font-family: sans-serif;
  line-height: normal;
}
.chosen-container-multi .chosen-choices li.search-choice {
  position: relative;
  margin: 3px 5px 3px 0;
  padding: 7px 30px 9px 5px;
  border: 1px solid #aaaaaa;
  max-width: 100%;
  background-color: white;
  color: #333333;
  line-height: 13px;
  cursor: default;
  border-radius: 20px;
}
.chosen-container-multi .chosen-choices li.search-choice:hover {
  background-color: #f7f7f7;
  border-color: #aaaaaa;
}
.chosen-container-multi .chosen-choices li.search-choice span {
  word-wrap: break-word;
}
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
  position: absolute;
  top: 3px;
  right: 15px;
  display: block;
  width: 12px;
  height: 12px;
}
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close::after {
  content: "close";
  font-weight: bold;
}
.chosen-container-multi .chosen-choices li.search-choice-disabled {
  padding-right: 5px;
  border: 1px solid #cccccc;
  background-color: #e4e4e4;
  color: #666666;
}
.chosen-container-multi .chosen-choices li.search-choice-focus {
  background: #d4d4d4;
}
.chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close {
  background-position: -42px -10px;
}
.chosen-container-multi .chosen-results {
  margin: 0;
  padding: 0;
}
.chosen-container-multi .chosen-drop .result-selected {
  display: list-item;
  color: #cccccc;
  cursor: default;
}
.chosen-container-active.chosen-with-drop .chosen-single div {
  border-left: none;
  background: transparent;
}
.chosen-container-active.chosen-with-drop .chosen-single div b {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 6px solid #333333;
  border-top: 0 none;
}
.chosen-container-active .chosen-choices li.search-field input[type="text"] {
  color: #222222 !important;
}
.chosen-disabled,
input[disabled="1"],
input[readonly="true"] {
  opacity: 0.5 !important;
  cursor: default;
}
.chosen-disabled .chosen-single {
  cursor: default;
}
.chosen-disabled .chosen-choices .search-choice .search-choice-close {
  cursor: default;
}
.checkBoxListContainer {
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  overflow-y: auto;
  background-color: white;
}
.checkBoxListContainer input[type="checkbox"] {
  margin-right: 10px;
  margin-top: 0;
}
.checkBoxListContainer .checkBoxList > span {
  box-sizing: border-box;
  width: 100%;
  padding: 6px 12px;
  display: flex;
}
.checkBoxListContainer .checkBoxList > span:hover {
  cursor: pointer;
  background-color: #eaeaea;
}
.checkBoxListContainer .checkBoxList > span label:hover {
  cursor: pointer;
}
.checkBoxListContainer .checkBoxList > span > label {
  flex-grow: 1;
  margin-right: 0;
}
.checkBoxListContainer .checkBoxList > br {
  display: none;
}
select.msdd {
  padding-inline: 9px;
}
.ajax__calendar .ajax__calendar_container {
  border: 1px solid #d2d2d2 !important;
  border-radius: 10px;
}
.ajax__calendar .ajax__calendar_container {
  padding: 10px !important;
}
/* #endregion */

/* #region tabele */

.dlFilters,
.objectType {
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  background-color: #f6f6f6;
  padding: 15px 40px;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: flex-start;
  align-items: center;
  width: fit-content;
}
.dlFilters .lbl,
.objectType .lbl {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  line-height: 20px;
}
.datalane,
.tblScroll {
  overflow-x: auto;
  margin-bottom: 20px;
}
.datalane:not(:last-of-type) {
  margin-bottom: 20px;
}
.datalane table {
  width: 100%;
  text-align: left;
  color: #333333;
}
.datalane th,
.datalane td {
  padding: 10px 15px;
  line-height: 20px;
}
.datalane td a {
  color: #00b0f0;
  text-decoration: underline;
}
.datalane td a:hover {
  color: #0092c7;
  text-decoration: none;
}
.datalane tbody tr {
  border-bottom: 1px solid #d2d2d2;
}
.datalane tbody tr {
  background-color: white;
}
.datalane tbody tr:hover {
  background-color: #eaeaea;
}
.datalane th:first-child {
  border-radius: 10px 0 0 0;
}
.datalane th {
  background-color: #00b0f0;
  color: white;
  vertical-align: bottom;
  cursor: pointer;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
  line-height: 20px;
  user-select: none;
}
.datalane th:last-child {
  border-radius: 0 10px 0 0;
}
.datalane th:hover {
  background-color: #0092c7;
}
.datalane th.sorted {
  background-color: #0092c7;
}
.datalane th.sorted::after {
  display: inline-block;
  vertical-align: middle;
  content: "keyboard_arrow_down";
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  line-height: 12px;
  height: 12px;
}
.datalane th.sorted.sortDesc::after {
  content: "keyboard_arrow_up";
}
.datalane td.sorted {
  background-color: #f6f6f6;
}
.datalane tr:hover td.sorted {
  background-color: #d2d2d2;
}
.datalane th.configTable,
.datalane td.expand {
  width: 35px;
  max-width: 35px;
  padding: 0;
}
.datalane th.configTable > div {
  position: relative;
  padding: 10px;
}
.datalane th.configTable > div::after {
  display: inline-block;
  vertical-align: middle;
  content: "settings";
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  line-height: 12px;
  height: 15px;
}
.datalane th.configTable .dlMenu {
  display: none;
  position: absolute;
  top: 40px;
  left: 0;
  z-index: 1000;
  background-color: #00b0f0;
  font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
  border-radius: 0 0 10px 10px;
}
.datalane th.configTable div.opened .dlMenu {
  display: block;
}
.datalane th.configTable .dlMenuItem {
  padding: 10px 25px 10px 10px;
  white-space: nowrap;
  line-height: 20px;
}
.datalane th.configTable .dlMenuItem:last-of-type {
  border-radius: 0 0 10px 10px;
}
.datalane th.configTable .dlMenuItem::before {
  display: inline-block;
  height: 15px;
  vertical-align: middle;
  line-height: 12px;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  padding-right: 5px;
}
.datalane th.configTable .dlSelectColumnItem::before {
  content: "check_box_outline_blank";
}
.datalane th.configTable .dlSelectColumnItem.visible::before {
  content: "check_box";
}
.datalane th.configTable .radioItem::before {
  content: "radio_button_unchecked";
}
.datalane th.configTable .radioItem.selected::before {
  content: "radio_button_checked";
}
.datalane th.configTable .dlMenuItem:hover {
  background-color: #0092c7;
}
.datalane th.configTable .dlMenu .dlMenuItem .dlSubmenu {
  display: none;
  position: absolute;
  top: 0;
  left: 100%;
  font-weight: normal;
  background-color: #00b0f0;
  border-radius: 0 0 10px 10px;
}
.datalane th.configTable .dlMenu .dlMenuItem.opened .dlSubmenu {
  display: block;
}
.datalane td.expand > div {
  padding: 0 6px;
}
.datalane td.expand > div::before {
  content: "keyboard_arrow_down";
  display: inline-block;
  height: 15px;
  line-height: 12px;
  vertical-align: middle;
  cursor: pointer;
}
.datalane td.expand.opened > div::before {
  content: "keyboard_arrow_up";
}
.datalane .dlDetailCell {
  padding: 5px 0;
}
.datalane .tblPager,
.datalane .pager {
  display: flex;
  gap: 10px;
}
.datalane .tblPager .pageItem {
  cursor: pointer;
}
.datalane .pager {
  padding: 10px;
  border-radius: 0 0 10px 10px;
  background-color: #00b0f0;
  justify-content: center;
  color: white;
  position: relative;
  min-height: 36px;
  box-sizing: border-box;
}
.datalane .pager .tblPagerInfo {
  position: absolute;
  left: 15px;
}
.datalane .pager .singlePage,
.datalane .pager .backToPagedView {
  position: absolute;
  right: 15px;
  cursor: pointer;
}
.datalane .pageNum.active {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.tablesort {
  width: 100%;
  text-align: left;
  margin-bottom: 1.33333em;
}
.tablesort th,
.tablesort td {
  padding: 10px 15px;
  line-height: 20px;
  vertical-align: top;
}
.tablesort th a:not(.inlineBtn) {
  color: white;
  text-decoration: none;
}
.tablesort td a:not(.inlineBtn) {
  color: #00b0f0;
  text-decoration: underline;
}
.tablesort td a:not(.inlineBtn):hover {
  color: #0092c7;
  text-decoration: none;
}
.tablesort tbody tr {
  border-bottom: 1px solid #d2d2d2;
  background-color: white;
}
.tablesort tbody tr:not(:has(th)):hover {
  background-color: #eaeaea;
}
.tablesort th:first-child {
  border-radius: 10px 0 0 0;
}
.tablesort th:last-child {
  border-radius: 0 10px 0 0;
}
.tablesort th {
  background-color: #00b0f0;
  color: white;
  vertical-align: bottom;
  cursor: pointer;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
  line-height: 20px;
  user-select: none;
}
.tablesort th:hover {
  background-color: #0092c7;
}
.tablesort th.right,
.tablesort td.right {
  text-align: right;
}
.tablesort td.right .inlineBtn {
  margin-left: auto;
}
.tablesort th.center,
.tablesort td.center {
  text-align: center;
}
.tablesort .gridPager {
  border-bottom: 0 none;
}
.tablesort .gridPager > td {
  border-bottom: none;
  padding: 10px 15px;
  background-color: #00b0f0;
  border-radius: 0 0 10px 10px;
}
.tablesort .gridPager table {
  width: auto;
  font-size: inherit;
  margin: 0 auto;
}
.tablesort .gridPager tr {
  background-color: transparent !important;
  border-bottom: 0 none;
}
.tablesort .gridPager table td {
  border-bottom: 0 none;
  padding: 0 10px;
}
.tablesort .gridPager table td span {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
  color: white;
}
.tablesort .gridPager table td a:link,
.tablesort .gridPager table td a:visited {
  color: white;
  text-decoration: none !important;
}
.tablesort .gridPager table td a:hover,
.tablesort .gridPager table td a:active {
  color: white;
  text-decoration: none !important;
}
.tablesort .btnGridMode {
  background-color: transparent;
  color: white;
  padding: 0;
  border-radius: 0;
  height: auto;
}
.potrdiloBtn {
  margin-bottom: 10px;
}
.foofilters {
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  background-color: #f6f6f6;
  padding: 15px 40px;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: flex-start;
  align-items: center;
}
.foofilters .lbl {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  line-height: 20px;
}
.footable {
  width: 100%;
  text-align: left;
  margin-bottom: 20px;
}
.footable th,
.footable td {
  padding: 10px 15px;
  line-height: 20px;
}
.footable td a {
  color: #00b0f0;
  text-decoration: underline;
}
.footable td a:hover {
  color: #0092c7;
  text-decoration: none;
}
.footable tbody tr {
  border-bottom: 1px solid #d2d2d2;
  background-color: white;
}
.footable tbody tr:hover {
  background-color: #eaeaea;
}
.footable th:first-child {
  border-radius: 10px 0 0 0;
}
.footable th:last-child {
  border-radius: 0 10px 0 0;
}
.footable th {
  background-color: #00b0f0;
  color: white;
  vertical-align: bottom;
  cursor: pointer;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
  line-height: 20px;
  user-select: none;
}
.footable th:hover,
.footable th.footable-sorted,
.footable th.footable-sorted-desc {
  background-color: #0092c7;
}
.footable th.footable-sorted::after,
.footable th.footable-sorted-desc::after {
  display: inline-block;
  vertical-align: middle;
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  line-height: 12px;
  height: 12px;
}
.footable th.footable-sorted::after {
  content: "keyboard_arrow_down";
}
.footable th.footable-sorted-desc::after {
  content: "keyboard_arrow_up";
}
.footable tfoot td {
  padding: 10px;
  border-radius: 0 0 10px 10px;
  background-color: #00b0f0;
  justify-content: center;
  color: white;
}
.footable.no-paging tfoot {
  display: none;
}
.footable > tfoot .pagination {
  text-align: center;
}
.footable > tfoot .pagination ul {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  padding: 0;
}
.footable > tfoot .pagination ul > li {
  display: inline;
}
.footable > tfoot .pagination ul > li > a,
.footable > tfoot .pagination ul > li > span {
  float: left;
  border: 2px solid transparent;
  margin: 0 3px;
  color: white;
  background: transparent;
  padding: 1px 5px;
  text-decoration: none;
}
.footable > tfoot .pagination ul > li.active > a {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.footable > tfoot .pagination ul > li.disabled > a {
  color: #b5b5b5;
}
.cssCounter tbody tr:not(.skipIncrement) {
  counter-increment: rowNumber;
}
.cssCounter tbody td:nth-child(2)::before {
  content: counter(rowNumber);
  display: inline-block;
  min-width: 2em;
  white-space: nowrap;
}
.cssCounter tbody .skipIncrement td:nth-child(2)::before {
  content: none;
}
/* #endregion */

/* #region jQuery datepicker */

.ui-datepicker {
  width: 17em;
  padding: 0.2em 0.2em 0;
  display: none;
  border: 1px solid #d2d2d2;
  background: white;
  border-radius: 10px;
}
.ui-datepicker.ui-corner-all,
.ui-datepicker .ui-corner-all {
  border-radius: 10px;
}
.ui-datepicker .ui-datepicker-header {
  position: relative;
  padding: 0.2em 0;
  border: 1px solid #d2d2d2;
  background: #f6f6f6;
  font-weight: bold;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  position: absolute;
  top: 8px;
  width: 1.8em;
  height: 1.8em;
  border: 1px solid transparent;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
  border: 1px solid #d2d2d2;
  background-color: #ededed;
}
.ui-datepicker .ui-datepicker-prev {
  left: 2px;
}
.ui-datepicker .ui-datepicker-next {
  right: 2px;
}
.ui-datepicker .ui-icon {
  display: block;
  width: 16px;
  height: 16px;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-image: url(/statika/style/baseImg/iconsBlack.png);
}
.ui-datepicker .ui-icon-circle-triangle-w {
  background-position: 3px -248px;
}
.ui-datepicker .ui-icon-circle-triangle-e {
  background-position: -26px -248px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  display: block;
  position: absolute;
  left: 50%;
  margin-left: -8px;
  top: 50%;
  margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
  margin: 0 2.3em;
  line-height: 1.8em;
  text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
  font-size: 1em;
  margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  width: 45%;
}
.ui-datepicker table {
  width: 100%;
  font-size: 0.9em;
  border-collapse: collapse;
  margin: 0 0 0.4em;
}
.ui-datepicker th {
  padding: 0.7em 0.3em;
  text-align: center;
  font-weight: bold;
  border: 0;
}
.ui-datepicker td {
  border: 0;
  padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
  display: block;
  line-height: 1;
  padding: 0.2em;
  text-align: right;
  text-decoration: none;
  border: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  font-weight: normal;
  color: #333333;
  border-radius: 5px;
}
.ui-datepicker td span:hover,
.ui-datepicker td a:hover {
  background-color: #eaeaea;
}
.ui-datepicker td .ui-state-highlight {
  border: 1px solid #dad55e !important;
  background-color: #fffa90 !important;
  color: #777620 !important;
}
.ui-datepicker td .ui-state-active {
  background: #00b0f0;
  color: white;
}
.ui-datepicker td .ui-state-active:hover {
  background: #0092c7;
}
.ui-datepicker .ui-datepicker-buttonpane {
  background-image: none;
  margin: 0.7em 0 0 0;
  padding: 0 0.2em;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
  float: right;
  margin: 0.5em 0.2em 0.4em;
  cursor: pointer;
  padding: 0.2em 0.6em 0.3em 0.6em;
  width: auto;
  overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
  float: left;
}
.ui-datepicker.ui-datepicker-multi {
  width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
  float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
  width: 95%;
  margin: 0 auto 0.4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
  width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
  width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
  width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
  border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
  clear: left;
}
.ui-datepicker-row-break {
  clear: both;
  width: 100%;
  font-size: 0;
}
.ui-datepicker-rtl {
  direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
  right: 2px;
  left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
  left: 2px;
  right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
  right: 1px;
  left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
  left: 1px;
  right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
  clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
  float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
  float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
  border-right-width: 0;
  border-left-width: 1px;
}
.ui-datepicker .ui-widget-content {
  border-bottom: 1px solid #dddddd;
}
/*jQuery UI timepicker*/

.ui-timepicker-div .ui-widget-header {
  margin-bottom: 8px;
}
.ui-timepicker-div dl {
  text-align: left;
}
.ui-timepicker-div dl dt {
  float: left;
  clear: left;
  padding: 0 0 0 5px;
}
.ui-timepicker-div dl dd {
  margin: 0 10px 10px 40%;
}
.ui-timepicker-div td {
  font-size: 90%;
}
.ui-tpicker-grid-label {
  background: none;
  border: none;
  margin: 0;
  padding: 0;
}
.ui-timepicker-div .ui_tpicker_unit_hide {
  display: none;
}
.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input {
  background: none;
  color: inherit;
  border: none;
  outline: none;
  border-bottom: solid 1px #d2d2d2;
  width: 95%;
}
.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus {
  border-bottom-color: #aaaaaa;
}
.ui-timepicker-rtl {
  direction: rtl;
}
.ui-timepicker-rtl dl {
  text-align: right;
  padding: 0 5px 0 0;
}
.ui-timepicker-rtl dl dt {
  float: right;
  clear: right;
}
.ui-timepicker-rtl dl dd {
  margin: 0 40% 10px 10px;
}
/* Shortened version style */

.ui-timepicker-div.ui-timepicker-oneLine {
  padding-right: 2px;
}
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time,
.ui-timepicker-div.ui-timepicker-oneLine dt {
  display: none;
}
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time_label {
  display: block;
  padding-top: 2px;
}
.ui-timepicker-div.ui-timepicker-oneLine dl {
  text-align: right;
}
.ui-timepicker-div.ui-timepicker-oneLine dl dd,
.ui-timepicker-div.ui-timepicker-oneLine dl dd > div {
  display: inline-block;
  margin: 0;
}
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_minute:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_second:before {
  content: ':';
  display: inline-block;
}
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_millisec:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_microsec:before {
  content: '.';
  display: inline-block;
}
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide,
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide:before {
  display: none;
}
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_hour select {
  width: 55px;
  margin-right: 5px;
}
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_minute select {
  width: 55px;
  margin-left: 5px;
}
.ui-timepicker-div .ui-state-default {
  border: 1px solid #d2d2d2;
  background: #f6f6f6;
  font-weight: normal;
  color: #333333;
}
/* #endregion */

/* #region login/register */

#loginBg {
  padding: 0;
  background-color: white;
  height: 100vh;
  width: 100vw;
}
#loginBg .footerInfo {
  display: none;
}
#loginBg .container {
  box-sizing: border-box;
  display: flex;
  height: 100%;
  width: 100%;
}
#loginBg .content {
  order: 2;
  flex: 1;
  padding: 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: none;
  text-align: center;
  box-sizing: border-box;
}
#loginBg .content .content {
  padding: 0;
  min-width: 400px;
}
#forgottenPasswordSetPassForm,
#loginBg .content .form4 {
  width: 100%;
}
.forgottenPassword {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.forgottenPassword .inlineBtnBar {
  margin-top: 20px;
}
#forgottenPasswordSetPassForm .labelCell {
  min-width: 160px;
}
#loginBg .logoWrapper {
  width: 100%;
  margin-bottom: 60px;
  max-width: 300px;
}
#loginBg .logoWrapper img {
  width: 100%;
}
#loginBg .banner {
  flex: 4;
  padding: 60px;
  background-image: url(/statika/style/baseImg/loginBanner.jpg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  background-color: #f7f6f4;
}
#loginBg #loginForm {
  width: 100%;
}
#loginBg .formContent {
  padding: 0;
  border-radius: 0;
  border: none;
  background-color: transparent;
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  margin: 0px auto 40px auto;
  max-width: 300px;
}
#loginBg .formContent:has(#forgottenPasswordSetPassForm) {
  max-width: none;
}
#loginBg .formTitle {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  margin-bottom: 20px;
}
#loginBg .formTitle.noMargin {
  margin-bottom: 0;
}
#loginBg .inputCell {
  width: 100%;
  margin-bottom: 20px;
  text-align: center;
}
.formText {
  margin-bottom: 20px;
}
#loginBg .formContent input[type=text],
#loginBg .formContent input[type=password],
#loginBg .formContent select {
  width: 100%;
  margin-bottom: 7px;
  border: 1px solid #d2d2d2;
  border-radius: 20px;
  color: #333333;
  background-color: white;
  box-sizing: border-box;
  height: 40px;
  padding-inline: 15px;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
}
#loginBg .errorMessages {
  margin-bottom: 20px;
}
#loginBg .inlineBtnBar {
  flex-direction: column;
  align-items: center;
}
#loginBg .pwLink {
  color: #00b0f0;
  text-decoration: underline;
  margin-bottom: 15px;
  display: block;
}
#loginBg .pwLink:hover {
  color: #0092c7;
}
#loginBg #forgottenPasswordForm {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#forgottenPasswordContent {
  width: 100%;
}
#ForgottenPasswordOk .forgottenPasswordOkText {
  text-align: center;
  margin-bottom: 40px;
}
#loginBg .welcomeText {
  text-align: center;
  margin-bottom: 20px;
}
#loginBg #accessDeniedMessage {
  text-align: center;
  margin-bottom: 40px;
}
#mainContent.changePasswordPage {
  flex-direction: column;
  gap: 0;
}
#mainContent.changePasswordPage h1,
#mainContent.changePasswordPage p {
  margin-bottom: 20px;
}
#B2SkinMetroMasterPublic.page_home form {
  padding: 0;
  position: fixed;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  background-color: #ededed;
  overflow-y: auto;
}
#B2SkinMetroMasterPublic.page_home form #head {
  display: none;
}
#B2SkinMetroMasterPublic.page_home #mainContent {
  width: auto;
  min-height: 0 !important;
  height: auto !important;
}
#B2SkinMetroMasterPublic.page_home h1,
#B2SkinMetroMasterPublic.page_home .userName {
  margin-bottom: 20px;
}
/* #endregion */

/* #region start stran */

#mainCentral.startPage {
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: 0;
  flex-direction: column;
  gap: 30px;
  width: auto;
  max-width: 1400px;
}
#mainCentral.startPage #startPageData {
  display: flex;
  flex-wrap: wrap;
  gap: 60px;
}
#mainCentral.startPage #eCoursesList {
  display: flex;
  flex-direction: column;
  flex: 3;
}
#mainCentral.startPage #communicationsList {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 250px;
}
#myCertificatesLink {
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: white;
  margin-bottom: 30px;
  overflow: hidden;
  color: #333333;
}
#myCertificatesLink:hover .listHeading {
  background-color: #f6f6f6;
}
#myCertificatesLink .myCertificatesIcon {
  border-top: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  display: flex;
  flex-direction: column;
  text-align: center;
  padding: 15px;
}
#myCertificatesLink:hover .myCertificatesIcon {
  background-color: #eaeaea;
}
#myCertificatesLink .myCertificatesIcon::after {
  font-size: 60px;
  content: "verified";
}
#mainCentral.startPage #messagesList,
#mainCentral.startPage #notificationsList,
#mainCentral.startPage #videoGuideBox {
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: white;
  margin-bottom: 30px;
  overflow: hidden;
  color: #333333;
}
#mainCentral.startPage #messagesList:hover .messagesText {
  background-color: #f6f6f6;
}
#mainCentral.startPage #messagesList:hover .messagesNumber {
  background-color: #eaeaea;
}
#mainCentral.startPage .eCourseTile {
  display: flex;
  margin-bottom: 30px;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: white;
  color: #333333;
  overflow: hidden;
  min-width: 300px;
}
#mainCentral.startPage .eCourseTile:hover {
  background-color: #f6f6f6;
}
#mainCentral.startPage .eCourseImage {
  flex: 1;
  box-sizing: border-box;
  min-width: 120px;
  min-height: 140px;
}
#mainCentral.startPage .eCourseImage.hasCourseImage {
  background-position: center;
  background-size: cover;
}
#mainCentral.startPage .eCourseImage.generic {
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  background-color: #00b0f0;
  padding-block: 20px;
}
#mainCentral.startPage .eCourseImage.generic::before {
  content: "local_library";
  font-size: 100px;
  display: block;
  text-align: center;
}
#mainCentral.startPage .eCourseData {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 2;
  padding: 20px 25px 15px 25px;
  border-bottom: 4px solid #8d8d8d;
  min-width: 250px;
  position: relative;
}
#mainCentral.startPage .eCourseInfo {
  display: flex;
  flex-direction: column;
}
#mainCentral.startPage .tileTitle {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  margin-bottom: 10px;
}
#mainCentral.startPage .eCourseMentors {
  font-size: clamp(0.74rem, 0.94vw, 0.89rem);
  display: flex;
  align-items: center;
}
#mainCentral.startPage .eCourseMentors.hasMentors {
  margin-bottom: 10px;
}
#mainCentral.startPage .eCourseMentor {
  margin-right: 30px;
  display: flex;
  align-items: center;
}
#mainCentral.startPage .eCourseMentorProfileImage.hasProfileImage,
#mainCentral.startPage .eCourseMentorProfileImage.generic::before {
  display: inline-block;
  height: 30px;
  width: 30px;
  border-radius: 50%;
  margin-right: 5px;
}
#mainCentral.startPage .eCourseMentorProfileImage.hasProfileImage {
  background-position: center;
  background-size: cover;
}
#mainCentral.startPage .eCourseMentorProfileImage.generic::before {
  content: "person";
  font-size: 24px;
  border: 1px solid #d2d2d2;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f6f6f6;
}
#mainCentral.startPage .tileDate {
  font-size: clamp(0.74rem, 0.94vw, 0.89rem);
  font-weight: 500;
  color: #8d8d8d;
  margin-bottom: 10px;
}
#mainCentral.startPage .tileDescription {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  line-height: 27px;
  margin-bottom: 15px;
}
#mainCentral.startPage .eCourseDescription {
  -webkit-mask-image: linear-gradient(180deg, white 90%, rgba(255, 255, 255, 0) 100%);
  mask-image: linear-gradient(180deg, white 90%, rgba(255, 255, 255, 0) 100%);
  height: 100px;
  overflow: hidden;
  line-height: 1.3;
}
#mainCentral.startPage .eCourseProgress {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  font-weight: 500;
  text-align: right;
}
#mainCentral.startPage .eCourseProgressData {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
#mainCentral.startPage .eCourseProgressBar {
  height: 4px;
  background-color: #00b0f0;
  position: absolute;
  bottom: -4px;
  left: 0;
}
#mainCentral.startPage .eCourseEmpty {
  text-align: center;
  padding: 60px 20px;
  color: #8d8d8d;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
}
#mainCentral.startPage .listHeading {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  text-align: center;
  padding: 15px;
}
#mainCentral.startPage .messagesNumber {
  border-top: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  display: flex;
  flex-direction: column;
  text-align: center;
  padding: 15px;
}
#mainCentral.startPage .messagesNumber::after {
  font-size: 60px;
  content: "mail";
}
#mainCentral.startPage .notificationTile,
#mainCentral.startPage .notificationsEmpty {
  padding: 20px 25px;
  border-top: 1px solid #d2d2d2;
  display: flex;
  flex-direction: column;
  background-color: #f6f6f6;
  color: #333333;
}
#mainCentral.startPage .notificationTile:hover {
  background-color: #eaeaea;
}
.startPage .notificationLink {
  color: #00b0f0;
  text-align: right;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  text-decoration: underline;
}
.startPage .notificationLink:hover {
  color: #0092c7;
  text-decoration: none;
}
#mainCentral.startPage .notificationsEmpty {
  text-align: center;
}
/* #endregion */

/* #region admin panel */

#mainContent.adminPanel h1,
#mainContent.analysis h1 {
  margin-bottom: 28px;
}
.columnContent {
  display: flex;
  flex-direction: column;
}
.columnContent h2 {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
  margin-bottom: 20px;
}
.columnContent h2 a {
  color: black;
  display: flex;
}
#mainContent:not(.atomEdit) .columnContent h2 a::after {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  content: "expand_circle_right";
  margin-left: 8px;
  position: relative;
  top: 2px;
}
.columnContent p {
  margin-bottom: 20px;
}
.columnContent .linkGroup {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 10px;
}
.columnContent .linkGroup a {
  color: white;
  padding: 16px 18px;
  border-radius: 10px;
  background-color: #00b0f0;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  display: flex;
  align-items: center;
}
.columnContent .linkGroup a:hover {
  background-color: #0092c7;
}
.columnContent .linkGroup a::before {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  margin-right: 10px;
}
.columnContent .linkGroup a.iconFindUsers::before {
  content: "search";
}
.columnContent .linkGroup a.iconGroupsOverview::before {
  content: "group";
}
.columnContent .linkGroup a.iconOverview1::before {
  content: "query_stats";
}
.columnContent .linkGroup a.iconOverview2::before {
  content: "pie_chart";
}
.columnContent .linkGroup a.iconUserAccess::before,
.columnContent .linkGroup a.iconPortalAnalysis::before {
  content: "planner_review";
}
.columnContent .linkGroup a.iconEcontentOverview::before,
.columnContent .linkGroup a.iconChildEcontents::before {
  content: "menu_book";
}
.columnContent .linkGroup a.iconCertificate::before {
  content: "verified";
}
.columnContent .linkGroup a.iconCommunication::before {
  content: "forum";
}
.columnContent .linkGroup a.iconNewsOverview::before,
.columnContent .linkGroup a.iconNewsCategories::before {
  content: "newsmode";
}
.columnContent .linkGroup a.iconMetaData::before,
.columnContent .linkGroup a.iconLicences::before,
.columnContent .linkGroup a.iconSettings::before {
  content: "settings";
}
.columnContent .linkGroup a.iconAdCampaigns::before {
  content: "campaign";
}
.columnContent .linkGroup a.iconOrders::before {
  content: "shopping_cart";
}
.columnContent .linkGroup a.iconEventLog::before {
  content: "emergency_home";
}
.columnContent .linkGroup a.iconOverview1::before {
  content: "monitoring";
}
#mainContent.adminPanel,
#mainContent.analysis {
  gap: 40px;
  flex-wrap: wrap;
  width: auto;
  max-width: 1400px;
}
.adminPanel .column,
.analysis .column {
  flex: 1;
  min-width: 275px;
}
#mainContent.adminPanel #column3 .columnContent .linkGroup,
#mainContent.analysis .columnContent .linkGroup {
  margin-bottom: 40px;
}
.moreBar {
  display: flex;
  justify-content: flex-end;
  gap: 0 20px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.moreBar:not(:has(.moreBtn)) {
  margin-bottom: 0;
}
.tileData {
  position: relative;
}
.graph .tileContent {
  height: 9.33333em;
  position: relative;
  padding: 1.33333em;
  z-index: 2;
  margin-bottom: 40px;
  background-color: #0092c7;
  border-radius: 10px;
}
#skupineOut {
  margin-bottom: 40px;
}
#mainContent.importUsers #column1 {
  min-width: 130px;
}
#mainContent.importUsers #UvozUser {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
}
#mainContent.importUsers #column2 {
  height: fit-content;
}
#mainContent.importUsers #column2 p {
  margin-bottom: 20px;
}
#mainContent.importUsers #column2 ul {
  margin-bottom: 20px;
  margin-left: 40px;
  list-style-type: disc;
}
#mainContent.importUsers #UvozUser .form {
  width: auto;
}
#mainContent.importUsers #UvozUser .ui-tabs-active .tileData {
  background-color: #00b0f0;
  color: white;
}
#mainContent.importUsers #UvozUser .ui-tabs-active .tileData:hover {
  background-color: #0092c7;
}
#mainContent.importUsers .error {
  margin-bottom: 20px;
}
#div_korak4 table th:nth-child(1) {
  width: 20px !important;
}
#div_korak4 table th:nth-child(2),
#div_korak4 table th:nth-child(3) {
  width: 80px !important;
}
#div_korak4 table th:nth-child(4),
#div_korak4 table th:nth-child(5),
#div_korak4 table th:nth-child(6) {
  width: 120px !important;
}
#div_korak4 table th:nth-child(7) {
  width: 140px !important;
}
#mainContent.userActivity .inlineBtnBar > div {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 20px;
  align-items: center;
}
.tablesort.gvAktivnostUdelezencev tr th:first-child,
.tablesort.gvAktivnostUdelezencev tr th:nth-child(2),
.tablesort.gvUcenjePregledSum tr th:first-child,
.tablesort.gvUcenjePregled tr th:first-child,
.tablesort.gvUcenjePregled tr th:nth-child(2),
.tablesort.gvTestiranjePregled tr th:first-child,
.tablesort.gvTestiranjePregled tr th:nth-child(2),
#mainContent.testingOverview .tablesort tr th:first-child,
.tablesort.gvReportAccessList tr th:first-child,
.tablesort.gvReportAccessList tr th:nth-child(2),
.tablesort.gvAktivnostPoDnevih tr th:first-child,
.tablesort.gvAktivnostPoDnevih tr th:nth-child(2),
.tablesort.gvDostopUdelezencev tr th:first-child,
.tablesort.gvDostopUdelezencev tr th:nth-child(2),
.tablesort.gvNalogaPregledRezultatov tr th:first-child,
.tablesort.gvNalogaPregledRezultatov tr th:nth-child(2),
.tablesort.gvAnketaPregledRezultatov tr th:first-child {
  width: 20px;
}
.pregledRezultatovNazivHeader {
  width: 100% !important;
}
.shrinkHeader {
  width: 0;
  white-space: nowrap;
}
.tablesort.gvUcenjePregledSum tr th:nth-child(2) {
  width: 0;
}
#econtentTbl th[data-index="0"] {
  width: 40px !important;
}
#econtentTbl th[data-index="1"],
#econtentTbl th[data-index="2"],
#econtentTbl th[data-index="5"],
#econtentTbl th[data-index="6"] {
  width: 150px !important;
}
#econtentTbl th[data-index="3"] {
  width: 75px !important;
}
#econtentTbl th[data-index="4"] {
  width: 70px !important;
}
#econtentTbl th[data-index="7"] {
  width: 195px !important;
}
#econtentTbl th[data-index="8"] {
  width: 80px !important;
}
#mainContent.myEcourses .chosen-container {
  width: auto !important;
}
#userlistTabContent p,
#userlistTabContent h2,
#userlistTabContent h3 {
  margin-bottom: 10px;
}
.newsEdit input[type=number] {
  margin-bottom: 0;
}
.userOverview .titleBtns {
  margin-right: 15px;
}
.userOverview #column1 > h1 {
  margin-top: 10px;
}
.moreValuesOtherValues {
  display: none;
}
.moreValuesFirstValue {
  cursor: pointer;
  color: #00b0f0;
  display: inline-block;
}
.moreValuesToggle::before {
  content: "add";
  margin-left: 5px;
}
.moreValuesToggle.opened::before {
  content: "remove";
}
.page_knjiznicaspletajev .foofilters .chosen-container:first-of-type {
  width: 250px !important;
}
#SpletajiChild h3,
#ForumiChild h3 {
  margin-bottom: 10px;
}
#mainContent.myEcourses .foofilters .chosen-container-single:first-of-type {
  width: 120px !important;
}
.userOverview a.txt.krepko:empty {
  display: none;
}
.userOverview a.krepko {
  color: #00b0f0;
}
.userOverview a.krepko:hover {
  color: #0092c7;
}
.userOverview a.postBtn {
  color: #00b0f0;
}
.userOverview a.postBtn:hover {
  color: #0092c7;
}
.userOverview input[value="Spremeni"] {
  margin-top: -15px;
  margin-bottom: 5px;
}
#SkupineChild .inputCell .clearfix span,
#OddelkiChild .inputCell .clearfix span {
  margin-bottom: 5px;
  display: inline-block;
}
#SkupineChild .inputCell .txt,
#OddelkiChild .inputCell .txt {
  padding-top: 5px;
}
.displayLimitLabel {
  margin-bottom: 10px;
  display: inline-block;
}
.page_pregledrezultatov a.potrdiloBtn {
  margin-bottom: 5px;
  text-decoration: none;
  color: white;
}
.page_pregledrezultatov a.potrdiloBtn:hover {
  color: white;
}
.tblScroll:has(.moreActionsMenu) {
  overflow-x: unset;
}
.gvUcenjePregledSum .predelanoBox {
  width: fit-content;
  margin: 0;
}
.tile.licence {
  display: block;
  margin-bottom: 40px;
  color: white;
  padding: 16px 18px;
  border-radius: 10px;
  background-color: #00b0f0;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
}
.tile.licence .icon::before {
  content: "license";
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  margin-right: 10px;
}
.tile.licence .tileContent {
  display: flex;
  align-items: center;
}
.tile.licence .tileText {
  display: flex;
  flex-direction: column;
}
.tile.licence .tileName {
  margin-bottom: 5px;
  text-transform: uppercase;
}
.form.vpisUporabnikaForm input[type=text],
.form.vpisUporabnikaForm input[type=email],
.form.vpisUporabnikaForm .chosen-container {
  display: block;
  width: 80%;
}
.form.vpisUporabnikaForm .inputSubtitle {
  margin-top: 5px;
  display: inline-block;
}
/* #endregion */

/* #region eContentEditor */

#mainCentral.eContentEditor {
  flex-direction: column;
  gap: 40px;
  background-color: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  min-width: 0 !important;
  max-width: 100%;
  width: fit-content !important;
}
#mainCentral.eContentEditor #econtentEditHeader {
  display: flex;
  justify-content: space-between;
}
#mainCentral.eContentEditor #editorContent {
  width: 1040px;
}
#mainCentral.eContentEditor > div {
  display: flex;
  gap: 60px;
}
#mainCentral.eContentEditor .clear {
  display: none;
}
#atomEditHead {
  display: flex;
  justify-content: space-between;
}
#atomEditHead .inlineBtnBar {
  margin-bottom: 10px;
  justify-content: flex-end;
}
#atomTitle {
  flex-grow: 1;
}
#linkCopyEcontent {
  display: none;
}
#atomEditContent {
  border-radius: 10px;
  margin-bottom: 30px;
  height: fit-content !important;
}
#mainCentral.eContentEditor .form {
  width: auto;
  max-width: none;
}
#mainCentral.eContentEditor .formContent {
  background-color: white;
}
.eContentEditor #atomTitle {
  min-width: 55%;
}
#atomTitle #txtNaziv {
  height: auto;
}
#mainCentral.eContentEditor #txtNaziv {
  width: 90%;
  box-sizing: border-box;
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
}
.inlineBtnBar.translateControls {
  flex-direction: column;
  margin-bottom: 10px;
  align-items: end;
}
.inlineBtnBar.translateControls .languageDropdown {
  display: flex;
  gap: 20px;
  justify-content: flex-end;
}
#mainCentral.eContentEditor .translateControls label {
  margin-right: 0;
}
.atomTree #column1 {
  width: 320px;
}
#atomLastChange,
#publishedDateContainer {
  text-align: right;
  margin-bottom: 10px;
  color: #8d8d8d;
}
#orgAtomContent {
  padding: 20px;
  background-color: white;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  margin-bottom: 20px;
}
#atomtreeStatus {
  min-height: 16px;
  margin-bottom: 9px;
}
#atomtreeBtns {
  display: flex;
  gap: 10px;
  position: relative;
  justify-content: space-between;
  margin-bottom: 11px;
}
#atomtreeBtns #newAtomSelect {
  position: absolute;
  top: 50px;
  z-index: 12;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f6f6f6;
  padding: 15px;
  width: 100%;
  box-sizing: border-box;
}
#atomTypesList,
#atomTemplatesList {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}
#atomtreeBtns .newAtomBtn {
  cursor: pointer;
  display: inline-block;
  width: 85px;
  color: #333333;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 16px;
}
#newAtomSelect .newAtomBckg {
  height: 58px;
  border: 1px solid #d2d2d2;
  margin-bottom: 7px;
  background-color: white;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #8d8d8d;
}
#atomtreeBtns .newAtomBtn:hover .newAtomBckg {
  background-color: #f6f6f6;
}
#atomTemplatesLbl {
  margin: 15px 0;
}
#atomtreeBtns #atomTemplatesLbl {
  font-weight: 500;
}
#newAtomBtnPair {
  background-color: #00b0f0;
  width: 100px;
  border-radius: 20px;
  cursor: pointer;
}
#newAtomBtnPair:hover {
  background-color: #0092c7;
}
#newAtomBtnPair.disabledBtn button {
  color: #b5b5b5;
  border-color: #b5b5b5;
}
#btnNewAtom {
  color: white;
  border: 0 none;
  padding: 7px 17px 3px 20px;
  border-right: 1px solid white;
  background-color: transparent;
  cursor: pointer;
}
#btnNewAtomOptions {
  color: white;
  padding: 7px 8px 3px 2px;
  border: 0 none;
  background-color: transparent;
  cursor: pointer;
}
.iconBtn,
.btnsGroup2 .atomBtn,
.pagerBtn {
  background-color: white;
  border: 1px solid #00b0f0;
  color: #00b0f0;
  border-radius: 50%;
  cursor: pointer;
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.iconBtn:hover,
.btnsGroup2 .atomBtn:hover,
.pagerBtn:hover {
  background-color: #e3f8ff;
}
.iconBtn::after {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  text-align: center;
}
#atomtreeBtns #btnToggleListView {
  display: none;
}
#btnNewAtom::after {
  content: "add";
}
#btnNewAtomOptions::after {
  content: "expand_more";
}
#btnNewAtomOptions.opened::after {
  content: "expand_less";
}
.generatedAtomContent .btnDeleteAtom {
  position: absolute;
  bottom: 1.5rem;
  right: 2rem;
}
#btnDeleteAtom::after,
.btnDeleteAtom::after {
  content: "delete";
}
.btnRegenerateAtom::after {
  content: "autorenew";
}
#btnToggleTree::after {
  content: "expand_content";
}
#atomtree {
  max-height: 1000px;
  overflow-y: auto;
  padding-left: 30px;
  margin-left: -30px;
  user-select: none;
}
#atomtree .atomContainer {
  position: relative;
}
#atomtree .atomContainer .atomContainer {
  margin-left: 15px;
}
#atomtree .atomTile .atomArrow::after {
  position: absolute;
  left: -37px;
  top: 52px;
  font-size: 30px;
  content: "keyboard_arrow_up";
  transition: transform 0.15s;
}
#atomtree .atomTile.closed .atomArrow::after {
  transform: rotate(180deg);
}
#atomtree .atomList {
  counter-reset: counter1;
  margin-right: 5px;
  position: relative;
}
#atomtree .closed + .atomList {
  display: none;
}
#atomtree .atomTile {
  position: relative;
  cursor: pointer;
}
#atomtree .atomTile.dragging {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
}
#atomtree .atomTitle {
  position: absolute;
  z-index: 11;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  border-radius: 0 0 10px 10px;
  padding: 5px 15px;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  background-color: #f6f6f6;
  color: #333333;
  border-top: 1px solid #d2d2d2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#atomtree .atomThumb {
  border-radius: 10px 10px 0 0;
}
#atomtree .atomTile:not(.selected):hover .atomThumb {
  background-color: #eaeaea;
}
#atomtree #dropZone,
#atomtree .atomTile {
  width: 200px;
  height: 120px;
  margin-bottom: 15px;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  background-color: white;
}
#atomtree .atomTile.selected {
  background-color: #ffdc40;
  color: #333333;
  border: 1px solid #d2d2d2;
}
#atomtree .atomTile.selected .atomThumb::before {
  color: #333333;
}
#atomtree .atomTile.selected .atomTitle {
  background-color: transparent;
  color: #333333;
}
#atomtree .atomThumb::before {
  font-size: 60px;
  display: block;
  text-align: center;
  padding-top: 36px;
  color: #8d8d8d;
  position: relative;
  top: -16px;
}
#newAtomSelect .newAtomBckg::before {
  font-size: 30px;
  content: "text_ad";
}
#atomtree .atomThumb.type1::before,
#newAtomSelect #newAtom1 .newAtomBckg::before {
  content: "text_ad";
}
#atomtree .atomThumb.type4::before,
#newAtomSelect #newAtom4 .newAtomBckg::before {
  content: "newsmode";
}
#atomtree .atomThumb.type7::before,
#newAtomSelect #newAtom7 .newAtomBckg::before {
  content: "quiz";
}
#atomtree .atomThumb.type20::before,
#newAtomSelect #newAtom20 .newAtomBckg::before {
  content: "movie";
}
#atomtree .atomThumb.type40::before {
  content: "perm_media";
}
.bodyDragActive * {
  pointer-events: none;
}
.genOverlay,
.genOverlay * {
  pointer-events: auto !important;
}
.genOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  height: 100%;
  background-color: white;
}
.genOverlay .overlayContent {
  padding: 1em;
}
#ckDropContent,
#atomImageDropContent,
#atomtreeDropContent {
  position: relative;
}
#ckDropContent h1,
#atomImageDropContent h1,
#atomtreeDropContent h1 {
  margin-bottom: 20px;
}
#ckDropCloseBtn,
#atomImageDropCloseBtn,
#atomtreeDropCloseBtn {
  position: absolute;
  top: 5px;
  right: 0;
  width: 30px;
  height: 30px;
  cursor: pointer;
}
#ckDropCloseBtn::before,
#atomImageDropCloseBtn::before,
#atomtreeDropCloseBtn::before {
  content: "close";
  font-size: 30px;
  font-weight: bold;
}
#ckDropZone,
#atomImageDropZone,
#atomtreeDropZone {
  border: 2px dashed #333333;
  border-radius: 5px;
  box-sizing: border-box;
  height: 500px;
  padding: 1em;
  max-height: 500px;
  overflow: auto;
  background-color: #f6f6f6 !important;
}
#ckDropZone h3,
#atomtreeDropZone h3,
#atomImageDropZone h3 {
  text-align: center;
  padding-top: 50px;
  font-size: 22px;
  margin-bottom: 15px;
  font-weight: lighter;
}
#ckDropContent table {
  width: auto;
}
#ckDropContent td {
  padding-right: 1em;
}
#ckDropContent label {
  vertical-align: top;
}
.dndProgress {
  position: relative;
  width: 150px;
  height: 16px;
  background-color: white;
}
.dndProgressBar {
  position: absolute;
  background-color: #2dac1c;
  height: 100%;
}
.dndCancelBtn,
.dndSuccessfulIcon {
  width: 16px;
  height: 14px;
  margin-top: 2px;
}
.dndCancelBtn::before {
  content: "close";
  font-weight: bold;
}
.dndSuccessfulIcon::before {
  content: "check";
  font-weight: bold;
  display: none;
}
#ckDropErrorActions .inlineBtn {
  margin-bottom: 0;
}
#atomEditImageBox {
  background: white;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  padding: 40px;
}
#mainContent.atomEdit.wholeCourse .tabContent > .columnContent {
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: 0;
}
#mainContent.wholeCourse .atom {
  padding: 20px 0;
  border-bottom: 1px solid #d2d2d2;
}
#mainContent.wholeCourse .atom:first-child {
  padding-top: 0;
}
#mainContent.wholeCourse .atom::after {
  content: "";
  display: block;
  clear: both;
}
#mainContent.wholeCourse .subcolumn1 {
  margin-bottom: 0;
}
.objectType {
  margin-bottom: 20px;
}
.objectType .moreActions {
  padding: 0;
}
#objectListMain .datalane {
  margin-bottom: 0px;
}
.objectInUseError {
  margin-bottom: 10px;
  display: block;
}
#objectListEditForm #objectListMain,
.eClassroom #objectListMain .objectList {
  max-height: 410px;
  overflow-y: auto;
  margin-bottom: 20px;
}
.eClassroom #objectListMain .btnLightbox {
  display: none;
}
.objectListBottom {
  display: flex;
  justify-content: space-between;
}
.objectListBottom .clear:empty {
  display: none;
}
.atomEditTbl .inputCell:has(.inlineBtn) {
  display: flex;
  gap: 20px;
}
#atomEditOptionsAdditional .atomEditTbl .inputCell:has(a) {
  display: flex;
}
#btnAddNewTest {
  margin-right: 10px;
}
#questionTypeChoose {
  min-width: 1025px;
}
.qTypeVec::after {
  background-position: center -100px !important;
}
.qTypeTekst::after {
  background-position: center -200px !important;
}
.qTypeUje::after {
  background-position: center -400px !important;
}
.qTypeRaz::after {
  background-position: center -500px !important;
}
.qTypeZap::after {
  background-position: center -600px !important;
}
.qTypeOtp::after {
  background-position: center -700px !important;
}
.qTypeOtn::after {
  background-position: center -800px !important;
}
.dialogMain .content:has(.questionEditForm) {
  width: 60%;
}
#questionEditForm .form {
  max-width: unset;
}
#questionEditForm .radioPravilenOdgovor,
#questionEditForm .chkPravilenOdgovor {
  margin-top: 10px;
}
.btnObrazlozitev,
.btnDeleteQuestion {
  cursor: pointer;
}
.btnObrazlozitev::before {
  content: "chat";
}
.btnDeleteQuestion::before {
  content: "delete";
}
td:has(.btnDeleteQuestion) {
  text-align: right;
}
.answerTr label {
  margin-right: 0;
}
textarea.obrazlozitevTxt {
  min-height: 80px !important;
}
#editQuestionForm.formContent .labelCell {
  width: 23%;
}
#mainContent.dictionary {
  padding: 1.6rem 2rem;
  max-width: 1250px;
  border: none;
}
#mainContent.dictionary .column {
  width: 100%;
}
#mainContent.dictionary .form {
  max-width: none;
}
#mainContent.dictionary input[type="text"].footable-filter {
  width: 50%;
}
.content:has(.tabsTbl) {
  width: 60%;
}
/* #endregion */

/* #region atomEdit */

#mainContent.atomEdit {
  flex-direction: column;
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: 0;
}
#mainContent.atomEdit .tabs .titleBtns {
  display: none;
}
#mainContent.atomEdit #mainTabs {
  display: flex;
  gap: 10px 40px;
  flex-wrap: wrap;
  margin-bottom: 35px;
}
#mainContent.atomEdit h2 {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  margin-bottom: 20px;
}
#mainContent.atomEdit #mainTabs a {
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  font-weight: lighter;
  cursor: pointer;
  color: #8d8d8d;
  line-height: 1.3;
  text-transform: lowercase;
}
#mainContent.atomEdit #mainTabs a:hover {
  color: #333333;
}
#mainContent.atomEdit #mainTabs a.active {
  border-bottom: 5px solid #ffdc40;
  color: #333333;
}
#mainContent.atomEdit .columnContent {
  padding: 40px;
  background-color: white;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
}
#mainContent.atomEdit .columnContent .form {
  margin-bottom: 40px;
  width: auto;
}
#mainContent.atomEdit .columnContent .chosen-container {
  width: 200px !important;
}
#mainContent.atomEdit .columnContent #multiScoOptions i {
  margin-top: 10px;
  display: block;
}
#mainContent.atomEdit .columnContent .objektiList .tabs {
  display: none;
}
#mainContent.atomEdit .columnContent .footable-sortable:first-child {
  padding-left: 15px !important;
}
#atomTreeStatus {
  display: none;
}
#tblStatistika {
  margin: 20px 0;
  color: #8d8d8d;
}
#tblStatistika td {
  padding: 10px;
}
#tblStatistika tr:first-child {
  font-weight: 500;
}
#mainContent.atomEdit .tablesort tbody tr {
  border-bottom: none;
}
#mainContent.atomEdit .tablesort {
  margin-bottom: 0;
}
.atomTreeEdit,
.atomTreeArrows,
div.atomTreeChkCell {
  float: right;
  padding: 8px;
  font-size: 16px;
}
.atomTreeArrows a,
.atomTreeEdit a {
  position: relative;
  top: 2px;
}
.atomTree .atomTreeChkCell {
  width: 20px;
  text-align: center;
  padding: 10px 8px;
}
.atomTreeName {
  float: left;
  padding: 10px 15px;
  width: 40%;
}
#atomtreeActionsTh {
  width: 202px;
}
.atomTreeItem {
  border-bottom: 1px solid #d2d2d2;
}
.atomTreeItem:hover {
  background-color: #eaeaea;
}
.atomTreeItem::after {
  content: "";
  display: block;
  clear: both;
}
.atomTreeEdit {
  width: 30px;
  margin-left: 30px;
}
.atomTreeArrows {
  width: 110px;
  margin-left: 30px;
}
.atomTreeEdit.disabled,
.atomTreeArrows.disabled {
  pointer-events: none;
  opacity: 0.6;
  filter: saturate(0);
}
.actIcon {
  cursor: pointer;
  width: 23px;
  height: 23px;
  display: inline-block;
  margin-right: 10px;
}
.actEdit::after {
  content: "edit";
  color: #00b0f0;
}
.actDel::after {
  content: "delete";
  color: #ff9900;
}
.actPreview::after {
  content: "visibility";
  color: #00b0f0;
}
.actArchive::after {
  content: "archive";
  color: #ff9900;
}
.actCopy::after {
  content: "content_copy";
  color: #00b0f0;
}
.atomArrow::after {
  display: inline-block;
  color: #333333;
}
.atomArrow.left::after {
  content: "keyboard_arrow_left";
}
.atomArrow.right::after {
  content: "keyboard_arrow_right";
}
.atomArrow.up::after {
  content: "keyboard_arrow_up";
}
.atomArrow.down::after {
  content: "keyboard_arrow_down";
}
#mainContent.atomEdit .atomtreeLink {
  display: inline-block;
}
#mainContent.atomEdit .atomtreeLink:link,
#mainContent.atomEdit .atomtreeLink:visited {
  color: #00b0f0;
  text-decoration: underline;
}
#mainContent.atomEdit .atomtreeLink:hover,
#mainContent.atomEdit .atomtreeLink:active {
  color: #0092c7;
  text-decoration: none;
}
#mainContent.atomEdit .tablesort th:has(> #izberiVse2) {
  border-radius: 0 0 10px 10px;
}
#mainContent.atomEdit #akcija_chosen .chosen-single {
  padding-block: 5px;
  height: 40px;
}
#mainContent.atomEdit #premakniatomi_chosen {
  display: none;
}
#mainContent.atomEdit #btnIzvedi {
  display: inline-block;
  margin-left: 20px;
}
#testSettingsTbl .inpTestName {
  width: 100%;
}
#testSettingsTbl .annotation {
  margin-left: 15px;
}
.questionLabel {
  min-width: 105px;
}
.formContent.tabsForm {
  padding: 0;
}
.tabsUpper {
  padding: 20px;
}
.tabsForm .formSeparator2 hr {
  margin: 0;
}
#tabsTbl td:last-child .iconBtn {
  margin-right: 0;
}
#tabsTbl td:has(.b2TabsTabTitle) {
  padding-right: 4rem;
  width: 100%;
}
#tabsTbl .b2TabsTabTitle {
  width: 100%;
}
#tabsTbl .iconBtn {
  margin-right: 1rem;
}
#tabsTbl tbody tr:first-child .b2tabsMoveTabUp,
#tabsTbl tbody tr:last-child .b2tabsMoveTabDown {
  border-color: #b5b5b5;
  cursor: default;
}
#tabsTbl tbody tr:first-child .b2tabsMoveTabUp:hover,
#tabsTbl tbody tr:last-child .b2tabsMoveTabDown:hover {
  background-color: white;
}
#tabsTbl tbody tr:first-child .b2tabsMoveTabUp::after,
#tabsTbl tbody tr:last-child .b2tabsMoveTabDown::after {
  color: #b5b5b5;
}
#tabsTbl .iconBtn.b2TabsRemoveTabContent {
  margin-right: 4rem;
}
.b2TabsRemoveTab::after {
  content: "delete";
}
.b2TabsRemoveTabContent::after {
  content: "playlist_remove";
}
.b2tabsMoveTabUp::after {
  content: "keyboard_arrow_up";
}
.b2tabsMoveTabDown::after {
  content: "keyboard_arrow_down";
}
#backgroundColorRadio {
  padding: 20px;
}
#atomCopyColumn1 {
  width: 45%;
  float: left;
}
#atomCopyColumn2 {
  width: 45%;
  float: right;
}
#atomList1,
#atomList2 {
  margin-left: 10px;
}
#atomCopyRightTop,
#atomCopySelectLbl {
  margin-bottom: 10px;
}
#mainContent.atomEdit .columnContent #atomCopySelect_chosen {
  width: 100% !important;
}
#mainContent.testEdit .form {
  max-width: none;
}
#mainContent.testEdit input[name="opravljanje_pogoj_vrednost"] {
  width: 65px;
  margin-right: 10px;
}
#mainContent.testEdit label[for="opravljenoVsaj"],
#inpConditionalShowValueSelectLabel {
  margin-right: 10px;
}
#inpConditionalShowValueSelect {
  display: inline;
}
#brezPogojaDiv {
  margin-bottom: 1rem;
}
#mainContent.testEdit .formContent .labelCell {
  width: auto;
}
#mainContent.testEdit td.inputCell.sirina155,
#mainContent.testEdit td:has(input.inpTxt.stVprasanjChk) {
  text-align: center;
}
#honorCodeDiv {
  margin-bottom: 8px;
}
input.inpTxt.stVprasanjChk {
  width: 65px;
}
/* #endregion */

/* #region eClassroom*/

#mainContent.eClassroom .column:only-of-type {
  flex-grow: 1;
}
#mainContent.eClassroom > div {
  flex-grow: 1;
  overflow-x: auto;
  width: 100%;
}
#mainContent.eClassroom .inlineBtnBar > div {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
.ajax__tab_panel .classroomHome {
  justify-content: stretch;
  flex-wrap: wrap;
}
.ajax__tab_panel .classroomHome .column1 {
  flex: 5;
}
.ajax__tab_panel .classroomHome .column2 {
  flex: 2;
  min-width: 240px;
}
.ajax__tab_panel .classroomHome .column2 h2 {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  width: 100%;
  color: #333333;
}
.ajax__tab_panel .eClassroomCurrent {
  margin-bottom: 30px;
}
.ajax__tab_panel .eClassroomCurrent ul {
  background-color: #f6f6f6;
  padding: 20px;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  color: #8d8d8d;
}
.ajax__tab_panel .eClassroomCurrent ul li {
  margin-bottom: 10px;
}
.ajax__tab_panel .eClassroomCurrent ul li span {
  font-weight: 500;
}
.eClassroomCurrent a:link,
.eClassroomCurrent a:visited {
  color: #00b0f0;
  text-decoration: underline;
}
.eClassroomCurrent a:hover,
.eClassroomCurrent a:active {
  color: #0092c7;
  text-decoration: none;
}
.ajax__tab_panel .classroomMentor > div {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 20px;
}
.ajax__tab_panel .classroomMentor > .error {
  align-items: flex-start;
  gap: 0;
}
.ajax__tab_panel .classroomMentor h2 {
  margin-bottom: 0;
}
.ajax__tab_panel .classroomMentor .mentorProfile {
  width: 100%;
}
.ajax__tab_panel .classroomMentor .mentorProfile .tileContent {
  display: flex;
  gap: 20px;
  justify-content: flex-start;
  padding: 20px;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  align-items: center;
  color: #333333;
}
#clasroomEditBtns {
  display: flex;
  justify-content: space-between;
}
.recipients span {
  display: inline-block;
  position: relative;
  white-space: nowrap;
  margin-right: 10px;
  margin-bottom: 10px;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  line-height: 20px;
  padding: 9px;
  background-color: #f6f6f6;
  border: 1px solid #d2d2d2;
  cursor: pointer;
  border-radius: 20px;
  box-sizing: border-box;
  height: 40px;
}
.recipients span::after {
  content: "close";
  vertical-align: text-top;
  font-weight: bold;
  padding-left: 5px;
}
.eClassroom .ucilnicaKomunikacija .icon,
.skupnost .icon {
  border-radius: 50%;
  height: 100px;
  width: 100px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.eClassroom .icon,
.skupnost .icon.userBlank {
  background-color: white;
  border: 1px solid #d2d2d2;
  color: #333333;
  height: 100px;
  width: 100px;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.icon.userBlank::before {
  padding: 15px;
  font-size: 70px;
  content: "person";
}
.classroomHome .column1 .activityList > div > div,
#mainContent.classrooms #column2 .activityList > div,
#mainContent.ecourses #column2 .eContentList > div,
#mainContent.forums #column2 .themes > div {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.activityList .tile,
.eContentList .tile,
.themes .tile {
  border-radius: 10px;
  color: white;
  background-color: #00b0f0;
  text-decoration: none;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
}
.activityList .tileContent,
.eContentList .tileContent,
#column2 .themes .tileContent {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 16px 12px;
  position: relative;
  z-index: 11;
}
.activityList .tile:hover,
.eContentList .tile:hover,
.themes .tile:hover {
  background-color: #2abcf1;
}
.activityList .tileData,
.eContentList .tileData {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}
.activityList .tileProgress,
.eContentList .tileProgress {
  position: absolute;
  height: 100%;
  background-color: #0092c7;
  z-index: 10;
}
.activityList .tile:has(span.uncompleted) .tileProgress,
.eContentList .tile:has(span.uncompleted) .tileProgress {
  width: 100% !important;
}
.subactivityList {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-left: 40px;
}
.activityList .tileContent .icon,
.eContentList .tileContent .icon,
.themes .tileContent .icon {
  display: none;
}
.activityList .tileContent .tileNum,
.eContentList .tileContent .tileNum {
  order: 4;
  flex: 1;
  text-align: right;
  min-width: 46px;
}
.activityList .tileContent .tileNumB,
.eContentList .tileContent .tileNumB {
  flex: 7;
  min-width: 160px;
}
.activityList .tileContent .tileName,
.eContentList .tileContent .tileName,
.themes .tileContent .tileName {
  min-width: 100px;
  word-wrap: break-word;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.eContentList .tileContent .tileName,
.themes .tileContent .tileName {
  max-width: 800px;
}
.activityList .tileContent .tileName {
  max-width: 490px;
}
.activityList .tileContent .tileText,
.eContentList .tileContent .tileText {
  flex: 11;
}
.activityList .tileContent .tileNum span.completed::after,
.eContentList .tileContent .tileNum span.completed::after,
.activityList .tileContent .tileNum span.uncompleted::after,
.eContentList .tileContent .tileNum span.uncompleted::after {
  font-size: 35px;
  display: block;
  font-weight: 900;
  line-height: 0.4;
}
.activityList .tileContent .tileNum span.completed::after,
.eContentList .tileContent .tileNum span.completed::after {
  content: "check";
}
.activityList .tileContent .tileNum span.uncompleted::after,
.eContentList .tileContent .tileNum span.uncompleted::after {
  content: "close";
}
.activityList .tileContent .tileNum,
.eContentList .tileContent .tileNum {
  font-weight: 500;
}
.activityList .tileContent::before,
.eContentList .tileContent::before,
.themes .tileContent::before {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  line-height: 0.8;
}
.tile.aGroup .tileContent::before,
#aktivnosti .aktivnostGrupa::before {
  content: "folder_open";
}
.tile.aTask .tileContent::before,
#aktivnosti .aktivnostNaloga::before {
  content: "task";
}
.tile.aTest .tileContent::before,
#aktivnosti .aktivnostTestiranje::before {
  content: "quiz";
}
.tile.aLearn .tileContent::before,
#column2 .tile.econtent .tileContent::before,
#aktivnosti .aktivnostUcenje::before {
  content: "library_books";
}
.tile.aUrl .tileContent::before,
#aktivnosti .aktivnostPovezava::before {
  content: "link";
}
.tile.aFile .tileContent::before,
#aktivnosti .aktivnostDatoteka::before {
  content: "description";
}
.tile.aConference .tileContent::before,
#aktivnosti .aktivnostKonferenca::before {
  content: "school";
}
.tile.aCommunicate .tileContent::before,
#aktivnosti .aktivnostKomunic::before {
  content: "forum";
}
.tile.aSeminar .tileContent::before,
#aktivnosti .aktivnostSeminarGrupa::before {
  content: "clinical_notes";
}
.tile.aSeminarClan .tileContent::before,
#aktivnosti .aktivnostSeminarClan::before {
  content: "upload_file";
}
.lblSeminarDateTo {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  color: #8d8d8d;
  text-transform: lowercase;
}
.pnlSeminarDesc {
  color: #333333;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  margin-bottom: 20px;
}
.pnlSeminarHistory {
  margin-bottom: 20px;
}
#seminarHistoryToggle {
  cursor: pointer;
}
#seminarHistoryContent {
  max-height: 150px;
  overflow: auto;
}
.historyComment {
  padding: 0.5em;
  border-bottom: 1px solid #d2d2d2;
}
.seminarHistoryItem > .historyComment:nth-of-type(odd) {
  background-color: #f6f6f6;
}
.seminarHistoryItemDate {
  color: #8d8d8d;
}
.seminarHistoryItemDetails {
  padding-left: 20px;
  padding-top: 5px;
}
.seminarHistoryItemDetails > div {
  padding-bottom: 5px;
}
.lblSeminarFileDate {
  color: #8d8d8d;
}
.seminarFileCell .inlineBtn {
  margin-top: 10px;
}
.seminarCorrect h3 {
  color: #4cbd6b;
}
.seminarInEval h3,
.seminarIncorrect h3 {
  color: #ff9900;
}
.seminarFinal {
  margin-bottom: 20px;
}
#messageForm input.inlineBtn {
  box-sizing: border-box;
}
#eClassroomDesc .eClassroomName {
  margin-bottom: 20px;
  color: #333333;
}
.eClassroomName a:link,
.eClassroomName a:visited {
  color: #00b0f0;
  text-decoration: underline;
}
.eClassroomName a:hover,
.eClassroomName a:active {
  color: #0092c7;
  text-decoration: none;
}
#eClassroomDesc {
  margin-bottom: 20px;
}
#eClassroomDesc img,
.introImg img {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}
#reportECourseActivity {
  margin-bottom: 20px;
}
#reportECourseActivity th[data-index="0"] {
  width: 10px !important;
}
#reportECourseActivity th[data-index="1"] {
  width: 20px !important;
}
#reportECourseActivity th[data-column="ime"] {
  width: 30px !important;
}
#reportECourseActivity th[data-column="priimek"] {
  width: 85px !important;
}
#reportECourseActivity th[data-column="stevilo_opravljenih_aktivnosti"] {
  width: 75px !important;
}
#reportECourseActivity th[data-column="ucilnica_zakljucena"] {
  width: 75px !important;
}
#reportECourseActivity th[data-column="uporabnik_aktiven_status"] {
  width: 85px !important;
}
#reportECourseActivity th[data-column="certifikat_naziv"] {
  width: 75px !important;
}
#reportECourseActivity th[data-column="certifikat_uporabnik_datum"] {
  width: 75px !important;
}
#reportECourseActivity th[data-index="9"] {
  width: 0 !important;
}
#mainContent.eClassroom #imgProfilnaSlikaFullPath {
  max-width: 100%;
  min-width: 10%;
  display: block;
  margin-bottom: 20px;
  max-height: 200px;
}
#mainContent.eClassroom #imgProfilnaSlikaFullPath[src=""],
#mainContent.eClassroom #imgProfilnaSlikaFullPath:not([src]) {
  display: none;
}
#mainContent.eClassroom #profilnaSlikaFileUploader {
  float: left;
  margin-right: 1em;
}
#mainContent.eClassroom #profilnaSlikaFileUploader .qq-upload-success {
  display: flex;
  gap: 5px;
  flex-direction: column;
}
#classroomCoverEditInfo {
  text-align: left;
}
.formUpdateStatus,
#classroomCoverEditInfo {
  text-align: right;
  font-weight: 500;
  line-height: 1.3;
  margin-top: 20px;
}
#SpremembaTock {
  margin-bottom: 20px;
}
.tilePrintCertificate .icon {
  display: none;
}
.widthMax {
  width: 100%;
}
#aktivnosti {
  color: #333333;
}
#aktivnosti .subactivityToggle a {
  color: #333333;
}
#aktivnosti .subactivityToggle a::after {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  display: inline-block;
  content: "keyboard_arrow_down";
}
#aktivnosti .subactivityToggle .iconBtnClose::after {
  content: "keyboard_arrow_up";
}
#aktivnosti .tablesort td div,
#aktivnosti .tablesort td span,
#aktivnosti .tablesort td input {
  display: inline-block;
  vertical-align: top;
}
#aktivnosti .subactivitiesCell > div {
  display: block;
  width: 100%;
}
#aktivnosti .aktivnostVrsta,
#aktivnosti .editAktivnost,
#aktivnosti .iconBtnEdit,
#aktivnosti .iconBtnDelete,
#aktivnosti .iconDown,
#aktivnosti .iconUp,
#aktivnosti .subactivityToggle,
#aktivnosti .btnPodAktivnostUredi {
  display: inline-block;
  height: 18px;
  position: relative;
  top: 5px;
}
#aktivnosti .podaktivnostiTable .btnPodAktivnostUredi::after,
#aktivnosti .podaktivnostiTable .aktivnostVrsta::before {
  line-height: unset;
}
#aktivnosti .podaktivnostiTable .btnPodAktivnostUredi,
#aktivnosti .podaktivnostiTable .aktivnostVrsta {
  top: 0;
}
#aktivnosti .aktivnostVrsta::before,
#aktivnosti .editAktivnost::after,
#aktivnosti .iconBtnEdit::after,
#aktivnosti .iconBtnDelete::after,
#aktivnosti .iconDown::after,
#aktivnosti .iconUp::after,
#aktivnosti .subactivityToggle a::after,
#aktivnosti .btnPodAktivnostUredi::after {
  line-height: 0.4;
}
#aktivnosti .iconBtnEdit::after,
#aktivnosti .editAktivnost::after,
.btnPodAktivnostUredi::after {
  content: "edit";
  color: #00b0f0;
}
#aktivnosti .iconBtnDelete::after,
.btnPodAktivnostBrisi::after {
  content: "delete";
  color: #ff9900;
}
#aktivnosti .iconDown::after,
.btnPodAktivnostDolDis::after {
  content: "keyboard_arrow_down";
  color: #333333;
}
#aktivnosti .iconUp::after,
.btnPodAktivnostGorDis::after {
  content: "keyboard_arrow_up";
  color: #333333;
}
#aktivnosti th.akcije,
#aktivnosti th.ikone {
  width: 110px;
}
#aktivnosti th.zacetek {
  width: 250px;
}
#aktivnosti .mentor,
#aktivnosti .lbl.mentor {
  font-size: clamp(0.66rem, 0.84vw, 0.79rem);
}
#aktivnosti td:not(> .subactivityToggle) {
  background-color: #cccccc;
}
#aktivnosti .lbl.mentor {
  color: #8d8d8d;
}
#aktivnosti .mentor:empty {
  display: none;
}
#aktivnosti tr:has(> .subactivitiesCell) {
  border-bottom: none;
}
#aktivnosti tr:has(> .subactivitiesCell):hover {
  background-color: unset;
}
#aktivnosti .subactivitiesCell {
  padding: 0;
}
#aktivnosti .subactivitiesLastCell {
  display: none;
}
#aktivnosti .aktivnostVrsta::before {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  margin-right: 10px;
}
#aktivnosti .aktivnostUra::before {
  content: "acute";
}
#aktivnosti .aktivnostZivo::before {
  content: "groups";
}
#aktivnosti td .subactivityToggle a {
  margin-left: -8px;
}
#aktivnosti.euPodzavihkiAjax .mentorLabel {
  display: flex;
  align-items: center;
}
#aktivnosti.euPodzavihkiAjax .mentorLabel .lbl {
  margin-right: 5px;
}
#aktivnosti .datumCell {
  color: #8d8d8d;
}
#aktivnosti .subactivitiesCell td {
  padding-left: 39px;
}
#aktivnosti .activityLegend {
  margin-top: 20px;
}
#aktivnosti .activityLegend th,
#aktivnosti .activityLegend td {
  padding: 7px 10px;
  color: #8d8d8d;
  vertical-align: middle;
}
#aktivnosti .activityLegend th {
  font-weight: 500;
}
.inpActivityName {
  width: 100%;
}
#aktivnostiUrediBox {
  position: relative;
  width: 950px;
  padding-bottom: 60px;
}
#aktivnostiUrediBox .inlineBtnBar.postavkaBtns {
  position: absolute;
  bottom: 0;
  right: 0;
}
#aktivnostiUrediBox td:empty {
  display: none;
}
#aktivnostiUrediBox .radioNorma label {
  margin-left: 5px;
}
.classroomActivityEditForm td:not(:has(*)) {
  display: none;
}
.classroomActivityEditForm .labelCell {
  display: table-cell;
}
.classroomActivityEditForm .inpNorma {
  margin-bottom: 0;
}
.classroomActivityEditForm .normaRowInsert .labelCell {
  padding-top: 20px;
}
.classroomActivityEditForm .normaRowInsert .inputCell {
  padding-top: 8px;
  padding-bottom: 8px;
}
.classroomActivityEditForm .chosen-container {
  width: 100% !important;
}
.leaderBoardLbl {
  padding-top: 15px;
  padding-bottom: 5px;
  margin-bottom: 5px;
  border-bottom: 3px solid #006271;
}
.lestvicaTbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
.lestvicaTbl td {
  vertical-align: middle;
  padding: 2px;
  border-bottom: 1px solid #e5e5e5;
}
.lestvicaTbl tr:last-child td {
  border-bottom: 0 none;
}
.lestvicaTbl .tockeAvatar {
  padding-right: 15px;
  width: 30px;
  height: 30px;
}
.tockeAvatar img {
  width: 30px;
  max-width: 30px;
  height: auto;
}
/*
.tockeAvatar .userBlank {
    width: 30px;
    height: 30px
}
*/

.tockeAvatar .defaultAvatar,
.tockeAvatar .userImg {
  height: 50px;
  width: 50px;
  background-color: #ffdc40;
  background-size: contain;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 25px;
}
.defaultAvatar.fontIcon::before {
  content: "person";
  color: white;
  font-size: 30px;
}
.diamond {
  vertical-align: middle;
  cursor: pointer;
  color: orange;
}
.diamond.found {
  cursor: default;
  color: #999999;
}
.diamond::after {
  content: "diamond";
}
.diamond-drag {
  position: absolute;
  top: 0;
  left: 0;
}
.diamond-drag.ui-draggable:hover {
  cursor: move;
}
.diamond-drag.selected {
  background-color: #4dafd6;
}
/*points and badges*/

.graphProgressSeparator {
  height: 1px;
  margin: 2.083em 0;
  opacity: 0.5;
  background-color: white;
}
#graphProgressLoaded,
#badgesLoaded {
  display: none;
}
#graphProgressLoaded .graphProgressBox {
  width: auto;
  display: block;
}
#myProgressGraphs {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.myProgressGraphSmall {
  width: 76px;
  height: 76px;
  position: relative;
  cursor: default;
}
#myProgress0 {
  margin-left: 20px;
}
#myProgress1 {
  margin-right: 20px;
}
.myProgressGraphIcon {
  height: 19px;
  width: 23px;
  position: absolute;
  top: 20px;
  left: 27px;
}
#myProgress0 .myProgressGraphIcon::after {
  content: "diamond";
}
#myProgress1 .myProgressGraphIcon::after {
  content: "playlist_add_check";
}
.myProgressGraphInfo {
  width: 40px;
  position: absolute;
  top: 40px;
  left: 18px;
  text-align: center;
}
.myProgressPoints {
  display: flex;
  justify-content: space-between;
}
.myProgressPoints1 .pointsNum {
  font-size: 32px;
  padding-top: 1em;
  line-height: 1em;
  font-weight: lighter;
}
.myProgressPoints2 {
  text-align: right;
}
.myProgressPoints2 .pointsNum {
  font-size: 64px;
  line-height: 1em;
  font-weight: lighter;
}
.myProgressLbl {
  opacity: 0.5;
  line-height: 18px;
  cursor: default;
}
#gamePoints {
  position: absolute;
  height: 19px;
  width: 60px;
  text-align: center;
  left: -14px;
  top: 0;
  font-size: 15px;
  font-weight: bold;
  display: none;
  opacity: 0;
}
#gamePoints.pointsNormal {
  left: -19px;
  color: #75e745;
}
/*lepsa poravnava zaradi + znaka*/

#gamePoints.pointsNormalSum {
  color: #75e745;
}
#gamePoints.pointsDiamond {
  left: -19px;
  color: #f9d249;
}
/*lepsa poravnava zaradi + znaka*/

#gamePoints.pointsDiamondSum {
  color: #f9d249;
}
.myBadge {
  float: right;
  margin-right: 10px;
  width: 21px;
  height: 25px;
  position: relative;
}
#myBadgeIcon {
  width: 20px;
  padding-left: 1px;
  height: 23px;
  padding-top: 2px;
  background-position: 0 -150px;
  color: white;
  text-align: center;
  cursor: pointer;
}
#myBadgeIcon.newBadge {
  background-position: 0 -150px;
}
.stdTooltip {
  position: absolute;
  display: none;
  z-index: 2000;
}
.type0 .stdTooltipArrow {
  height: 7px;
  width: 14px;
  margin-left: 20px;
  background-position: 0 -60px;
}
#badgesLoaded .type0 .stdTooltipArrow {
  margin-left: 38px;
}
.type1 .stdTooltipArrow {
  height: 7px;
  width: 14px;
  margin-left: 20px;
  background-position: 0 -75px;
}
.type2 .stdTooltipArrow {
  height: 7px;
  width: 14px;
  margin: 0 auto;
  background-position: 0 -75px;
}
.stdTooltipTxt {
  padding: 5px 10px;
  background: #f0f0f0;
  color: #333333;
  text-align: left;
}
.type1 .stdTooltipTxt {
  border: 1px solid #dddddd;
  border-style: none solid solid none;
}
/*stdTooltip in context*/

.myBadge .stdTooltip {
  top: 25px;
  left: -35px;
}
.myBadge .stdTooltipArrow {
  margin-left: 38px;
}
.myBadge .stdTooltipTxt {
  white-space: nowrap;
}
.newBadge .stdTooltip {
  display: block;
}
#myProgressLevel .stdTooltip {
  width: 175px;
  left: -19px;
}
#myProgressLevel1 .stdTooltip {
  bottom: 50px;
}
#myProgressLevel2 .stdTooltip {
  bottom: 60px;
}
#myProgressLevel3 .stdTooltip {
  bottom: 70px;
}
#myProgressLevel4 .stdTooltip {
  bottom: 80px;
}
#myProgressLevel5 .stdTooltip {
  bottom: 90px;
}
#myProgressLevel6 .stdTooltip {
  bottom: 100px;
}
#myProgressLevel7 .stdTooltip {
  bottom: 110px;
}
.myProgressLevelContainer:hover .stdTooltip {
  display: block;
}
#myProgress .stdTooltip {
  white-space: nowrap;
  bottom: -35px;
  left: -12px;
  display: block !important;
}
.myProgressGraphSmall .stdTooltip {
  top: -35px;
  left: 0;
  font-size: 12px;
}
#myProgress1 .stdTooltip {
  left: auto;
  right: 0;
}
.myProgressGraphSmall .stdTooltipTxt {
  white-space: nowrap;
}
.myProgressGraphSmall:hover .stdTooltip {
  display: block;
}
#myProgressPositionBox .stdTooltip {
  bottom: 55px;
  width: 200px;
}
#myProgressPositionBox:hover .stdTooltip {
  display: block;
}
#topScore .stdTooltip {
  bottom: 20px;
  right: -150px;
  width: 200px;
}
#topScore:hover .stdTooltip {
  display: block;
}
.badgesSectionName {
  color: white;
  text-transform: uppercase;
  clear: both;
  font-size: 1.25em;
  margin-bottom: 1.067em;
}
.badgesSection {
  padding: 7px 0 10px 0;
}
.allBadges {
  position: absolute;
  right: 0;
  top: 30px;
  width: 700px;
  z-index: 10000;
  display: none;
}
.badgesKnowledge {
  background-color: #1ba0e1;
  max-height: 560px;
  overflow-y: auto;
  padding: 30px 0 20px 23px;
}
.badgesSpecial {
  background-color: #1a9ad9;
  padding: 19px 23px 14px 23px;
}
.badgesSectionMore {
  width: 200px;
  cursor: pointer;
  opacity: 0.4;
  font-size: 1.083em;
  line-height: 1em;
}
#econtentBadges + .badgesSectionMore {
  margin-bottom: 1.231em;
}
.badgesSectionMore:before {
  content: '';
  display: inline-block;
  width: 15px;
  height: 12px;
  margin-right: 10px;
  vertical-align: bottom;
  background-position: 0 -295px;
}
.badgesSectionMore.opened:before {
  background-position: -20px -295px;
}
.badgesSection.hidden {
  display: none;
}
.badge {
  width: 98px;
  height: 113px;
  position: relative;
}
.badgesKnowledge .badge:last-child {
  margin-right: 0;
}
.badgesKnowledge .badge {
  float: left;
  margin: 0 11px 0 0;
}
.badgesKnowledge .stdTooltip {
  width: 120px;
  bottom: 120px;
  left: -10px;
}
.badgesKnowledge .badge:hover .stdTooltip {
  display: block;
}
#myProgressBadgeBox {
  margin-bottom: 2em;
}
#myProgressBadge,
.econtentBadges .badge {
  background-position: -35px 0;
  cursor: default;
}
.eclassroomBadges .badge {
  background-position: -35px -115px;
}
.badge.blank {
  background-position: -35px -230px;
  background-color: #3ab1eb;
}
.badge .noBadgesTxt {
  width: 60px;
  opacity: 0.4;
  text-align: center;
  margin: 20px auto 0 auto;
}
.badgeSmall {
  width: 72px;
  height: 83px;
  position: relative;
}
.badgeSmall .badgeImg {
  height: 100%;
}
#badge1 .badgeImg {
  background-position: -135px -170px;
}
/*vseckar*/

#badge2 .badgeImg {
  background-position: -135px -255px;
}
/*profilator*/

#badge3 .badgeImg {
  background-position: -210px 0;
}
/*prvi postar*/

#badge4 .badgeImg {
  background-position: -135px 0;
}
/*legenda testiranja*/

#badge5 .badgeImg {
  background-position: -210px -255px;
}
/*maratonec*/

#badge6 .badgeImg {
  background-position: -210px -170px;
}
/*redni gost*/

#badge7 .badgeImg {
  background-position: -210px -85px;
}
/*raziskovalec*/

#badge8 .badgeImg {
  background-position: -135px -85px;
}
/*ucenjak*/

.badgeSmall.blank .badgeImg {
  opacity: 0.25;
}
.badgesSpecial .badgeSmall {
  margin-right: 10px;
  float: left;
}
.badgesSpecial .badgeSmall:last-child {
  margin-right: 0;
}
.badgeSmall .stdTooltip {
  width: 150px;
  bottom: 90px;
  left: -10px;
}
.badgeSmall:hover .stdTooltip {
  display: block;
}
.badgeCol1 {
  background-color: #fbc820;
}
.badgeCol1 .levelNum {
  color: #fbc820;
}
.badgeCol2 {
  background-color: #fa8916;
}
.badgeCol2 .levelNum {
  color: #fa8916;
}
.badgeCol3 {
  background-color: #ff3370;
}
.badgeCol3 .levelNum {
  color: #ff3370;
}
.badgeCol4 {
  background-color: #d182f9;
}
.badgeCol4 .levelNum {
  color: #d182f9;
}
.badgeCol5 {
  background-color: #00c8d3;
}
.badgeCol5 .levelNum {
  color: #00c8d3;
}
.badgeCol6 {
  background-color: #8bc53e;
}
.badgeCol6 .levelNum {
  color: #8bc53e;
}
#dosezek_barva option {
  color: white;
}
#dosezek_barva option.badgeCol0 {
  color: inherit;
}
.badge .levelNum {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 32px;
  top: 12px;
}
.badge .levelIcon {
  width: 31px;
  height: 20px;
  position: absolute;
  left: 52px;
  top: 10px;
}
.levelIcon.level1 {
  background-position: -285px 0;
}
.levelIcon.level2 {
  background-position: -285px -25px;
}
.levelIcon.level3 {
  background-position: -285px -50px;
}
.levelIcon.level4 {
  background-position: -285px -75px;
}
.levelIcon.level5 {
  background-position: -285px -100px;
}
.levelIcon.level6 {
  background-position: -285px -125px;
}
.levelIcon.level7 {
  background-position: -285px -150px;
}
.badge .badgeName {
  color: white;
  position: absolute;
  text-align: center;
  left: 5px;
  top: 37px;
  width: 88px;
  height: 20px;
  font-size: 15px;
  font-weight: bold;
}
.eclassroomBadges .badge .badgeName {
  top: 42px;
}
.badge .badgeLevel {
  color: white;
  position: absolute;
  text-align: center;
  left: 5px;
  top: 61px;
  width: 88px;
  height: 20px;
  font-size: 11px;
  font-weight: bold;
}
.badge .badgeYear {
  color: white;
  position: absolute;
  text-align: center;
  left: 5px;
  top: 78px;
  width: 88px;
  height: 20px;
  font-size: 11px;
}
#headTop2 .myAvatar {
  float: right;
  margin-right: 10px;
  width: 25px;
  height: 25px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
#headTop2 .myAvatar.userBlank {
  background-position: center -3px;
}
.ucilnicaKomunikacija {
  color: #333333;
}
.ucilnicaKomunikacija .column1 {
  flex: 9;
  min-width: 290px;
}
.ucilnicaKomunikacija .column2 {
  flex: 4;
  min-width: 350px;
}
.ucilnicaKomunikacija .colleaguesList {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 20px;
}
#showMore:not(:has(.inlineBtn)) {
  display: none;
}
.ucilnicaKomunikacija .colleaguesList .tileData::before {
  position: absolute;
  top: 8px;
  right: 8px;
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  content: "check_box_outline_blank";
}
.ucilnicaKomunikacija .colleaguesList .tileData {
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  text-align: center;
  position: relative;
  z-index: 2;
  padding: 15px;
}
.ucilnicaKomunikacija .colleaguesList .tileData:hover {
  background-color: #eaeaea;
}
.ucilnicaKomunikacija .colleaguesList .selected .tileData::before {
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  content: "check_box";
}
.ucilnicaKomunikacija .colleaguesList .selected .tileData {
  background-color: #ffdc40;
  color: #333333;
}
.ucilnicaKomunikacija .colleaguesList .tileProgress {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  cursor: pointer;
}
.ucilnicaKomunikacija .colleaguesList .icon {
  margin-bottom: 8px;
}
.ucilnicaKomunikacija .ucilnicaKomunikacijaSelect {
  margin-bottom: 20px;
}
.ucilnicaKomunikacija .ucilnicaKomunikacijaSelect > .inlineBtnBar {
  margin-bottom: 40px;
}
.ucilnicaKomunikacija .euUporabnikIme {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 102px;
  display: block;
}
.ucilnicaKomunikacija .tileData.hasImage .icon {
  height: 102px;
  width: 102px;
  background-size: cover;
  background-position: center;
  border-radius: 50%;
}
.ucilnicaKomunikacija .tileData .tileText {
  line-height: 1.3;
}
.ucilnicaKomunikacija .inlineBtnBar {
  margin-bottom: 20px;
}
.classroomSearchBox {
  margin-right: 20px;
}
.ucilnicaKomunikacija .column2 .columnContent > div > div:first-of-type {
  margin-bottom: 40px;
}
.ucilnicaKomunikacija .column2 .asParagraph {
  display: inline-block;
  margin-bottom: 20px;
}
.addClassroomUsers td {
  width: 20px;
}
.addClassroomUsers .uprRoot,
.addClassroomUsers .uprUdelezenec {
  width: auto;
}
.upravUporabList {
  width: 100%;
  margin-bottom: 20px;
}
.tablesort.gvUcenjePregled tr th:last-child {
  width: 320px;
}
.tablesort.gvAnketaPregledRezultatov table {
  width: 100%;
}
.tablesort td:has( .predelanoBox) {
  line-height: unset;
}
#euUprUdelDodaj table img {
  display: none;
}
#euUprUdelDodaj table:has(.uprRoot) td > a:first-child::before {
  content: "add";
  color: #333333;
}
#euUprUdelDodaj table:has(.uprRoot) td > a:first-child:has(img[alt~="Zapri"])::before {
  content: "remove";
}
#euUprUdelDodaj table td {
  padding-block: 3px;
}
#euUprUdelDodaj table td input[type="checkbox"] {
  margin-right: 8px;
}
#euUprUdelDodaj .formContent {
  max-height: 465px;
  overflow-y: auto;
}
#euUprUdelDodaj .addClassroomUsers a {
  color: #00b0f0;
}
div:has(> #euUprUdelezList) .inlineBtnBar > div {
  flex-basis: 100%;
}
div:has(> #euUprUdelezList) .inlineBtnBar > div > span {
  width: 100%;
  text-align: right;
}
#euUprUdelezList input[type="checkbox"] {
  margin: 0;
}
.testAdditionalControls {
  display: inline-block;
}
.testBtn::before {
  color: #333333;
}
.sendTestData::before {
  content: "reply";
}
.sendTestDataGroup::before {
  content: "reply_all";
}
.restartTest::before {
  content: "replay";
}
.deleteTest::before {
  content: "delete";
}
.finishTest::before {
  content: "verified";
}
.overviewTest::before {
  content: "query_stats";
}
#ucilnicaUpravljanjeTbl textarea {
  width: 100%;
  resize: vertical;
  min-height: 135px;
}
#alertClassroomForm {
  max-width: none;
}
#ucilnicaUpravljanjeTbl .resetDateBtn {
  display: block;
  margin-top: 1rem;
}
#alertClassroomForm {
  max-width: none;
}
.dialogMain .content:has(#alertClassroomForm) {
  width: 60%;
}
.dialogMain .content #alertClassroomForm table tr:nth-child(2) .inpChk {
  margin-top: 0;
}
.charCount {
  margin-top: 5px;
  font-size: clamp(0.74rem, 0.94vw, 0.89rem);
  color: #8d8d8d;
}
#ucilnicaNaslovnicaForm .formContent {
  background-color: white;
}
#mentorGradivaTable .mCSB_container {
  max-height: 100%;
}
.popupCertPreview .inlineBtnBar {
  justify-content: center;
}
.certificateScroll {
  max-height: 710px;
  overflow-y: auto;
}
.dialogMain .content:has(.eClassroomCopyForm) {
  width: 50%;
}
/* #endregion */

.messageReply {
  background-color: #efefef;
  color: #999999;
  padding: 5px 5px 5px 20px;
  font-size: 14px;
  line-height: 18px;
}
#messageInfo {
  margin-bottom: 15px;
}
.avatarSmall {
  width: 50px;
  height: 50px;
  border-radius: 25px;
  min-width: 50px;
}
.avatarSmall.default {
  position: relative;
  background-color: #00b0f0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.avatarSmall.default::after {
  content: "person";
  color: white;
  font-size: 35px;
}
#messageInfo .avatarSmall {
  float: left;
  margin-right: 12px;
}
#messageInfo #posiljateljDiv {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
}
#messageInfo #prejemnikiDiv {
  font-size: 14px;
  color: #999999;
  float: left;
  max-width: 480px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 18px;
  margin-right: 8px;
  position: relative;
}
#messageMoreTrigger {
  width: 15px;
  height: 18px;
  float: left;
  position: relative;
  cursor: pointer;
}
#messageMoreTrigger:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  bottom: 3px;
  border-top: 8px solid green;
  border-bottom: 0 none;
  border-left: 5px solid white;
  border-right: 5px solid white;
}
#messageMoreTrigger.opened:after {
  border-bottom: 8px solid green;
  border-top: 0 none;
}
#messageMore {
  width: 300px;
  max-height: 300px;
  overflow: auto;
  position: absolute;
  left: 0;
  top: 17px;
  border: 1px solid #cccccc;
  background-color: white;
  padding: 15px;
  display: none;
  font-size: 14px;
  cursor: default;
  -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
}
#messageMoreTrigger.opened #messageMore {
  display: block;
}
#messageMore td {
  padding: 5px;
}
#messageMore .lblCell {
  color: #999999;
  text-align: right;
}
#messageTime {
  float: right;
  text-align: right;
  font-size: 14px;
  color: #999999;
  line-height: 18px;
}
#messageContent {
  border: 1px solid #d2d2d2;
  padding: 18px;
  margin-bottom: 18px;
  max-height: 500px;
  overflow: auto;
  border-radius: 20px;
}
#messageContent p {
  line-height: 1.4;
}
#messageContent p:last-child {
  margin-bottom: 0;
}
#messageContent p:empty {
  display: none;
}
/* #region pregled e-u�ilnic in e-gradiv */

#mainContent.listDetails {
  padding: 0;
  background-color: transparent;
  border-radius: 0;
  border: none;
  display: flex;
  flex-direction: column;
}
#classroomTabs.tabs > div:first-child,
#ecoursesTabs.tabs,
.forums .tabs > div:last-child {
  display: flex;
  gap: 20px 70px;
  flex-wrap: wrap;
}
#classroomTabs.tabs,
#ecoursesTabs.tabs {
  margin-bottom: 0px;
}
.tabs .tab {
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  font-weight: lighter;
  line-height: 1.5;
  cursor: pointer;
  color: #8d8d8d;
}
.tabs .tab:hover {
  color: #333333;
}
.tabs .tab.active span {
  border-bottom: 5px solid #ffdc40;
  color: #333333;
}
.disabledTab {
  pointer-events: none;
}
#tileRemoteControl,
#tileRemoteControl_ClassRoomsClosed {
  display: none !important;
}
.tabcontent {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}
#mainContent.listDetails #column1 {
  flex: 2;
}
#tiles_ClassRooms .footable,
#tiles_ClassRoomsClosed .footable {
  display: none;
}
.mCSB_container {
  max-height: 700px;
  overflow: auto;
  margin-bottom: 10px;
}
#mainContent.listDetails #column1 .tileData {
  padding: 20px;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: white;
  color: #333333;
  margin-bottom: 10px;
  display: flex;
}
#mainContent.listDetails #column1 .tileData:hover {
  background-color: #f6f6f6;
}
#column1 #tiles_ClassRooms .tile.hidden {
  display: none;
}
#mainContent.listDetails #column1 .tile.active .tileData {
  background-color: #ffdc40;
  color: #333333;
  border: 1px solid #d2d2d2;
}
#mainContent.listDetails #column1 .tile.active .tileData .tileAdditional {
  color: #8d8d8d;
}
#mainContent.listDetails #column1 .tileContent {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  flex-grow: 1;
}
#mainContent.listDetails #column1 .tileText {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-grow: 1;
}
#mainContent.listDetails #column1 .tileName {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  word-break: break-word;
}
#mainContent.listDetails #column1 .tileData::before {
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  margin-right: 10px;
}
.classrooms #column1 .tileData::before {
  content: "local_library";
}
#mainContent.listDetails #column1 .tileAdditional {
  color: #8d8d8d;
  font-size: clamp(0.74rem, 0.94vw, 0.89rem);
  text-transform: uppercase;
}
#mainContent.listDetails #column1 .tileAdditional,
#mainContent.listDetails #column1 .tileNum {
  font-weight: 500;
}
#mainContent.listDetails #column1 .moreBtn {
  background-color: transparent;
}
#mainContent.listDetails #column1 .footable th,
#mainContent.listDetails #column1 .footable tfoot {
  display: none;
}
#mainContent.listDetails #column2 {
  flex: 5;
  padding: 40px;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: white;
}
#mainContent.listDetails #column2 .detailsHeader h1,
#mainContent.listDetails #column2 .detailsHeader p,
#mainContent.listDetails #column2 .detailsDesc {
  margin-bottom: 10px;
}
#mainContent.listDetails #column2 .detailsHeader h1 a {
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
}
#mainContent #column2 .detailsHeader h1 a[href] {
  color: #00b0f0;
}
#mainContent #column2 .detailsHeader h1 a[href]:hover {
  color: #0092c7;
}
#mainContent #column2 .detailsHeader h1 a[href]::after {
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  content: "expand_circle_right";
  margin-left: 5px;
  position: relative;
  top: 5px;
}
#mainContent.listDetails #column2 .detailsHeader p {
  font-size: clamp(0.74rem, 0.94vw, 0.89rem);
  color: #8d8d8d;
  font-weight: 500;
}
#mainContent.listDetails #column2 .detailsDesc img {
  max-width: 100%;
}
#mainContent.listDetails .inpRadio {
  margin-right: 15px;
}
#mainContent.listDetails .inpRadio input {
  margin: 0 15px 0 0;
}
span.inpRadio {
  display: inline-block;
  margin-top: 10px;
}
.inpRadio input {
  vertical-align: middle;
  margin-top: 0 !important;
}
.inpRadio label {
  font-size: 15px;
  vertical-align: middle;
}
#ecoursesTabs .headerFilters {
  display: none;
}
.econtentEditBar {
  margin-bottom: 20px;
  min-width: 265px;
}
.eContentList {
  margin-bottom: 10px;
}
#mainContent.ecourses #column1 .tileProgress {
  display: none;
}
.ecourses #column1 .tileData::before {
  content: "folder";
}
.ecourses #column1 .tile.active .tileData::before {
  content: "folder_open";
}
.eContentList.editMode .tileContent {
  background-color: #00b0f0;
  color: white;
}
.eContentList.editMode .tileContent:hover {
  background-color: #0092c7;
}
.eContentList.editMode .tileNum .tileNum1,
.eContentList.editMode .tileNum .tileNum2 {
  display: none;
}
.eContentList.editMode .tileNum::after {
  content: "edit";
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  line-height: 0.5;
  vertical-align: sub;
}
#mainContent.ecourses h2 {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  margin-top: 20px;
}
/* #endregion */

/* #region katalog */

#mainCentral.catalogContent {
  display: block;
}
#mainCentral.catalogContent h1,
#mainCentral.catalogContent #catalogFiltersAndSort {
  margin-bottom: 20px;
}
#catalogFiltersAndSort {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
}
#catalogSort {
  margin-right: 1rem;
}
#katalogIskanje #iskanjeInp {
  min-width: 350px;
}
#eContentTileViewContainer {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 30px;
  grid-auto-rows: min-content;
}
.eContentTileGroup {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.eContentTilePreview {
  position: relative;
  width: 280px;
  height: 190px;
  border-radius: 10px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  cursor: pointer;
}
.eContentBackdrop {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 12px;
  box-sizing: border-box;
  background-color: rgba(0, 176, 240, 0.9);
  color: white;
  display: flex;
  gap: 5px;
  flex-direction: column;
  align-items: stretch;
  text-align: left;
}
.eContentBackdrop.closed .eContentContent {
  display: none !important;
}
.eContentBackdrop.closed .eContentContent {
  display: none !important;
}
.eContentTitle {
  font-weight: 600;
}
.eContentContent {
  display: none;
  flex-grow: 1;
  flex-direction: column;
  justify-content: space-between;
  opacity: 0;
  min-height: 0;
}
.eContentDescription {
  overflow: hidden;
  mask-image: linear-gradient(180deg, white 90%, rgba(255, 255, 255, 0) 100%);
  flex-grow: 1;
}
.eContentButton {
  background-color: white;
  font-weight: 600;
  color: white;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  border-radius: 20px;
  align-self: center;
}
#econtentTbl .actions .fontIcon,
#mainCentral.catalogContent .actions .fontIcon {
  margin-left: 5px;
  cursor: pointer;
  display: inline-block;
}
#econtentTbl .actions .fontIcon {
  position: relative;
  top: 2px;
  margin-left: 1rem;
}
#econtentTbl .actions .fontIcon::before #mainCentral.catalogContent .actions .fontIcon::before {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
}
#econtentTbl th.actions {
  text-align: left;
}
#econtentTbl .actions,
#mainCentral.catalogContent .actions {
  text-align: end;
  position: relative;
  width: 0.1%;
  white-space: nowrap;
}
#mainCentral.catalogContent .actions a.disabledBtn,
#mainCentral.catalogContent .actions a.disabledBtn::before {
  color: #b5b5b5 !important;
  pointer-events: none;
}
.shrinkCell {
  width: 0.1%;
  white-space: nowrap;
}
#econtentTbl td {
  vertical-align: middle;
}
.breadCrumbs {
  color: #8d8d8d;
}
#catalogBreadCrumbs {
  margin-bottom: 20px;
}
.breadCrumbs .drobtina:hover,
.breadCrumbs .drobtina:hover a {
  cursor: pointer;
  color: #0092c7;
}
.breadCrumbs .drobtina span,
.breadCrumbs .drobtina a {
  text-decoration: underline;
}
.breadCrumbs .drobtina {
  display: inline-flex;
  align-items: center;
}
.breadCrumbs .drobtina:not(:last-child)::after {
  content: 'chevron_right';
  margin-left: 6px;
  position: relative;
  top: 2px;
  text-decoration: none;
}
.breadCrumbs .drobtina:last-child,
.breadCrumbs .drobtina:last-child a {
  color: #333333;
}
.breadCrumbs:has(#rootDrobtina:only-child) {
  display: none;
}
.breadCrumbs .drobtina,
.breadCrumbs .drobtina a,
.drobtina.fontIcon::after {
  color: #00b0f0;
}
.formContent .inputCell .txt:has(#eContentBreadCrumbs) {
  padding-top: 10px;
}
.formContent td.breadCrumbCell {
  padding-bottom: 22px;
}
#catalogTable {
  overflow-x: visible;
}
#catalogSearchContainer {
  position: relative;
  flex: 1;
}
#catalogSearchContainer #inpIskanje {
  padding-right: 36px;
  width: 100%;
}
#catalogSearchContainer #inpIskanje::placeholder {
  color: #b5b5b5;
}
#catalogSearchContainer #cancelSearch {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(calc(-50% + 1px));
  cursor: pointer;
}
#catalogSearchContainer #cancelSearch::after {
  content: "close";
}
.finishedDivMessage {
  margin-bottom: 2rem;
}
.catalogFiltersActions {
  display: flex;
  gap: 60px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.catalogFiltersActions .dlFilters {
  flex: 1;
}
.catalogUserAccess h2 {
  margin-bottom: 1rem;
}
.catalogFiltersActions .inlineBtnBar {
  margin-bottom: 0;
}
.dialogMain:has(#changeParentForm),
.dialogMain:has(#copyForm) {
  overflow-y: initial;
}
#adminCatalogTable {
  width: 100%;
}
#adminCatalogTable th {
  text-align: left;
}
#adminCatalogTable tr td:last-child,
#adminCatalogTable tr td:first-child {
  width: 1%;
  white-space: nowrap;
  padding: 5px 15px;
}
#adminCatalogTable tr td.clickableCell {
  padding: 0;
  cursor: pointer;
}
#adminCatalogTable tr td.clickableCell .clickableCellItem {
  padding: 5px 15px;
  color: #333333;
  display: inline-block;
}
#adminCatalogTable td {
  vertical-align: middle;
}
#adminCatalogTable .folderNameData {
  cursor: pointer;
}
.actions .onRowHover {
  opacity: 0;
}
tr:hover .actions .onRowHover {
  opacity: 1;
}
.rowIcon .profileIcon {
  height: 30px;
  width: 30px;
  vertical-align: middle;
}
.rowIcon .folderIcon::before {
  content: "folder_open";
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  position: relative;
  top: 2px;
}
.rowIcon .eCourseIcon::before {
  content: "library_books";
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  position: relative;
  top: 2px;
}
.actions .btnEdit::before {
  content: "edit";
  color: #00b0f0;
}
.actions .btnDelete::before {
  content: "delete";
  color: #ff9900;
}
.actions .btnAccess::before {
  content: "group";
  color: #333333;
}
.actions .btnSettings::before {
  content: "settings";
  color: #333333;
}
.actions .btnCopy::before {
  content: "file_copy";
  color: #333333;
}
.actions .btnMove::before {
  content: "drive_file_move";
  color: #333333;
}
.actions .btnExport::before {
  content: "share_windows";
  color: #333333;
}
.actions .btnMore::before {
  content: "more_vert";
  color: #00b0f0;
  border: 1px solid #00b0f0;
  border-radius: 50%;
  margin-left: 5px;
}
.actions .btnMore:hover::before {
  background-color: #e3f8ff;
}
.actionsDropdown {
  display: none;
  width: max-content;
  position: absolute;
  right: 15px;
  background-color: white;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  z-index: 1;
  flex-direction: column;
  box-shadow: 0px 1px 1px rgba(3, 7, 18, 0.08), 0px 5px 4px rgba(3, 7, 18, 0.06), 0px 12px 9px rgba(3, 7, 18, 0.05), 0px 20px 15px rgba(3, 7, 18, 0.03), 0px 32px 24px rgba(3, 7, 18, 0.02);
}
.actionsDropdown .divider {
  width: 90%;
  margin: auto;
  border-top: 1px solid #d2d2d2;
}
.actionsDropdown .actionsOption:hover {
  background-color: #f6f6f6;
}
#mainCentral.catalogContent .actions .actionsDropdown a {
  display: flex;
  align-items: center;
  color: #333333;
  gap: 8px;
  padding: 6px 12px;
  text-decoration: none;
  margin-left: 0;
}
#mainCentral.catalogContent .actions .actionsDropdown a::before {
  position: relative;
  top: 2px;
}
#mainCentral.catalogContent .actions .actionsOption:first-child {
  border-radius: 10px 10px 0 0;
}
#mainCentral.catalogContent .actions .actionsOption:last-child {
  padding-bottom: 10px;
  border-radius: 0 0 10px 10px;
}
#mainCentral.catalogContent .actions a.beforeDivider {
  padding-bottom: 10px;
}
#catalogTable .iconsCell {
  padding: 9px 15px !important;
  vertical-align: middle;
  text-align: center;
}
#catalogTable.datalane td {
  padding: 14px 15px;
}
.wizzardSubtitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}
.statusActions {
  display: flex;
  gap: 20px;
  align-items: center;
}
input#eCourseDuration {
  width: 75px;
}
.kratekOpis {
  width: 90%;
  resize: none;
  min-height: 95px;
}
#eCourseImageRadios {
  margin-bottom: 20px;
}
#eCourseImageRadios .error:not(:empty) {
  display: inline-block;
  margin-top: 8px;
}
#eCourseImageRadios input {
  margin-right: 25px;
  vertical-align: middle;
}
#eCourseImageRadios fieldset {
  position: relative;
  top: 2px;
}
#eCourseImageRadios label {
  margin-right: 0;
  position: relative;
  vertical-align: middle;
  top: 5px;
}
#mainCentral.catalogContent .form {
  max-width: none;
}
#eCourseWizzardForm .eCourseProfileImageCell {
  padding-bottom: 0;
}
#eCourseWizzardForm .eCourseProfileImageWrapper {
  margin-bottom: 14px;
}
#fileUploaderForm {
  display: flex;
}
#fileUploaderForm #fileUploaderFormPreview {
  display: flex;
  width: 300px;
  height: 220px;
  box-sizing: border-box;
  margin-right: 20px;
}
#fileUploaderForm.iconMode .docsUploadActions {
  display: none;
}
#fileUploaderForm #fileDropAreaUploader {
  width: 100%;
  height: 100%;
  border: 1px dashed #d2d2d2;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  cursor: pointer;
  position: relative;
  text-align: center;
}
#DidacticAIForm.disabled #fileDropAreaUploader {
  pointer-events: none;
}
#DidacticAIForm.disabled #fileDropAreaUploader .qq-upload-drop-area {
  display: none !important;
}
#fileDropAreaUploader .qq-uploader {
  height: 100%;
}
#fileDropAreaUploader .qq-upload-drop-area {
  width: 100%;
  height: 100%;
  border: 3px dashed #d2d2d2;
  border-radius: 10px;
  box-sizing: border-box;
}
#fileDropAreaUploader .qq-upload-drop-area span {
  display: none;
}
#fileDropAreaUploader .qq-upload-list {
  display: none;
}
#fileDropArea {
  position: relative;
  width: 100%;
}
#fileDropArea .fileDropAreaText {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  text-align: center;
  width: 100%;
  padding: 20px 10px;
  box-sizing: border-box;
  pointer-events: none;
}
#fileDropArea .fileDropAreaText span {
  display: block;
}
#fileDropAreaUploader .qq-upload-button {
  height: 100%;
  width: 100%;
  padding: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  color: #333333;
  font-weight: 600;
}
#fileDropAreaUploader .qq-upload-button input {
  height: 100%;
}
#fileUploaderForm .fileDropAreaTitle {
  font-weight: 600;
}
#fileUploaderForm .fileDropAreaSubtitle {
  color: #8d8d8d;
}
.eContentTilePreview {
  display: flex;
  box-sizing: border-box;
  width: 100%;
  height: auto;
  aspect-ratio: 1.363636364;
  border-radius: 10px;
  background-color: #00b0f0;
  justify-content: center;
  align-items: center;
  position: relative;
  text-align: center;
  padding: 20px;
}
.hasIcon.eContentTilePreview::before {
  content: "menu_book";
  font-size: 120px;
  color: white;
}
.hasIcon.eContentTilePreview {
  background: #00b0f0 !important;
}
.fileDropArea span {
  font-weight: 600;
}
.fileDropArea .imageDropSubtitle {
  color: #b5b5b5;
  margin-top: 5px;
  margin-bottom: 20px;
}
#fileDropAreaUploader {
  background-color: white;
}
#DidacticAIForm #fileUploaderFormPreview {
  width: 100%;
  margin-right: 0;
}
#DidacticAIForm.disabled input {
  cursor: default !important;
}
#didacticAiMessages {
  text-align: right;
  font-weight: 500;
  margin-block: 1rem 1.3rem;
}
.eCourseCreationMethod h1 {
  margin-bottom: 1rem;
}
.form:has(#DidacticAIForm) {
  max-width: none;
}
#browseTriggerButton {
  margin-top: 30px;
}
#didacticAIHero {
  margin-bottom: 2rem;
  gap: 2rem;
  display: flex;
}
#didacticAIHero h1 {
  margin-bottom: 2rem;
  display: flex;
  align-items: center;
}
.titleBetaTag {
  color: white;
  font-weight: 600;
  background-color: #b5b5b5;
  border-radius: 5px;
  padding: 5px 6px;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  margin: 0 10px;
  position: relative;
  top: 1px;
  font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
}
#didacticAIHero .didacticAIInfo {
  margin-bottom: 2rem;
}
.creationMethodPPT p {
  margin-bottom: 1rem;
}
#imageUploadActions {
  display: flex;
  flex-direction: column;
}
#imageUploadActions button {
  margin-bottom: 1rem;
}
#previewButton::after {
  content: "visibility";
}
#previewButton.active::after {
  content: "visibility_off";
}
#wizardTabs.tabs,
#wizardTypeChooseTabs.tabs {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
#wizzardFormStatusUpper,
#wizzardFormStatusLower {
  display: none;
}
#wizzardFormStatusUpper {
  margin-bottom: 1rem;
  margin-top: 0;
}
#eContentTypeTilesContainer {
  display: flex;
  flex-direction: column;
  position: relative;
  max-width: 900px;
  width: 100%;
  align-items: flex-end;
}
#eContentTypeTiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 20px;
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 20px;
}
.eContentTypeTile {
  position: relative;
  width: 100%;
  height: 170px;
  border-radius: 10px;
  background-size: cover;
  background-position: center;
  background-color: #f6f6f6;
  border: 1px solid #d2d2d2;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.eContentTypeTile.disabledBtn {
  background-color: #e8e8e8;
  color: #b5b5b5;
  border: 1px solid #e8e8e8;
  pointer-events: none;
}
.eContentTypeTile.disabledBtn .eContentTypeIcon {
  filter: grayscale(1);
  opacity: 0.3;
}
.eContentTypeTile:not(.disabledBtn):hover {
  cursor: pointer;
  background-color: #eaeaea;
}
.eContentTypeIcon {
  margin-bottom: 1rem;
}
.tileBetaTag {
  color: white;
  font-weight: 500;
  background-color: #b5b5b5;
  border-radius: 5px;
  padding: 4px 6px;
  margin-left: 8px;
  display: block;
  width: fit-content;
  margin: 5px auto;
  position: absolute;
  bottom: 2px;
  right: 8px;
}
#generatedContentPreviewTitle,
#generatedContentPreview {
  margin-bottom: 1rem;
}
#generatedContentPreview {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
.generatedAtom {
  display: flex;
  flex-direction: row;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
}
.generatedAtomActions {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 300px;
  border-right: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  padding: 1.5rem 2rem;
  min-width: 150px;
}
.generatedAtomActions textarea {
  resize: none;
  height: 260px;
}
.generatedAtomContent {
  flex: 4;
  padding: 1.5rem 2rem;
  position: relative;
}
.generatedAtomContent h1 {
  margin-bottom: 1rem;
}
.generatedAtomContent > p {
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  line-height: 1.3;
  margin-bottom: 1rem;
}
.didacticAIAtomButtons {
  display: flex;
  justify-content: space-between;
}
/* #endregion */

/* #region skupnost*/

#mainContent.skupnost {
  gap: 0 40px;
}
#mainContent.skupnost .column {
  flex: 1;
  color: #333333;
  min-width: 250px;
}
#mainContent.skupnost .column a.tile {
  color: #333333;
}
#mainContent.skupnost .column h1 {
  margin-bottom: 25px;
}
#mainContent.skupnost #column1 .myProfile .tileContent {
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  padding: 20px;
  margin-bottom: 10px;
  display: flex;
  gap: 20px;
}
#mainContent.skupnost #column1 .myProfile .tileName {
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  margin-bottom: 10px;
}
#mainContent.skupnost #column1 .myProfile .tileAdditional {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  color: #8d8d8d;
}
#mainContent.skupnost #column1 .myProfile .tileNum {
  display: none;
}
#mainContent.skupnost #column1 .myProfile .tileNumB {
  display: none;
}
#mainContent.skupnost .modPm,
#mainContent.skupnost .modForum {
  display: none;
}
#mainContent.skupnost #column2 .columnContent .tile > div:hover,
#mainContent.skupnost #column3 .columnContent .tile > div:hover {
  background-color: #f6f6f6;
}
#mainContent.skupnost #column2 .tile > div,
#mainContent.skupnost #column3 .tile > div {
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  background-color: white;
  padding: 15px;
  margin-bottom: 10px;
  display: flex;
  flex-direction: column;
}
#mainContent.skupnost #column2 .tileContent,
#mainContent.skupnost #column3 .tileContent {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  display: flex;
  gap: 10px;
}
#mainContent.skupnost #column2 .icon,
#mainContent.skupnost #column3 .icon {
  display: none;
}
#mainContent.skupnost #column2 .tileName,
#mainContent.skupnost #column3 .tileName {
  margin-bottom: 5px;
}
#mainContent.skupnost #column2 .columnContent .tileName::before,
#mainContent.skupnost #column3 .columnContent .tileName::before {
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  line-height: 0.6;
  margin-right: 5px;
}
#mainContent.skupnost #column2 .columnContent .tileName::before {
  content: "mail";
}
#mainContent.skupnost #column3 .columnContent .tileName::before {
  content: "forum";
}
#mainContent.skupnost #column2 .tileNum,
#mainContent.skupnost #column3 .tileNum {
  color: #8d8d8d;
}
#mainContent.skupnost #column2 .columnContent .tileText span,
#mainContent.skupnost #column3 .columnContent .tileText span {
  font-weight: 500;
  position: relative;
  top: -8px;
}
#mainContent.skupnost #column2 .tileDesc,
#mainContent.skupnost #column3 .tileDesc {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
}
#mainContent.pm #PMTabs {
  display: flex;
  gap: 40px;
}
#mainContent.pm #PMTabs .ui-tabs-active .tileData {
  background-color: #ffdc40;
  color: #333333;
  border: 1px solid #d2d2d2;
}
#mainContent.pm .noOverflow {
  overflow: hidden;
}
.pmToolbar {
  display: flex;
  gap: 20px 0;
  justify-content: space-between;
  margin-bottom: 20px;
  align-items: center;
  flex-wrap: wrap;
}
.pmToolbar .inlineBtnBar {
  margin-bottom: 0;
}
.pmToolbar .navSprStran {
  margin-left: 20px;
}
.pmToolbar td:has(.navSprStran) {
  vertical-align: middle;
}
.sendMessageSearchTbl {
  margin-bottom: 20px;
}
#PMSendStep1 .atomtreeNaslov {
  margin-bottom: 10px;
}
#izbraniPrejemniki,
#izbraniPrejemniki1 {
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  padding: 10px;
  max-height: 100px;
  overflow: auto;
  background-color: white;
}
#izbraniPrejemniki:empty,
#izbraniPrejemniki1:empty {
  display: none;
}
/* #endregion */

/* #region star profil uporabnika */

#mainContent.profile {
  gap: 60px;
}
#mainContent.profile #column1 {
  flex-grow: 1;
  min-width: 65%;
}
#profileTabs {
  display: flex;
  gap: 20px 70px;
}
#mainContent.profile .profileRightSide {
  margin-bottom: 40px;
}
#mainContent.profile #column2 {
  flex-grow: 1;
  margin-top: 26px;
  max-width: 27%;
}
.profileFormContent {
  display: flex;
  gap: 20px 60px;
  flex-wrap: wrap;
}
.profileContent1 {
  flex-grow: 1;
}
.profileContent1 .inpTxt {
  width: 100%;
}
.profileContent2 {
  padding-right: 20px;
}
.profileImgBox {
  width: 190px;
  height: 190px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border: 1px solid #d2d2d2;
  background-color: white;
  margin-bottom: 10px;
  text-align: center;
  border-radius: 10%;
}
.profileImgBox.userBlank::before {
  content: "person";
  font-size: 150px;
  display: block;
  margin-top: 30px;
}
.profileImgBox.hasImage {
  background-color: transparent;
}
.profileImgBox.hasImage::before {
  content: "";
}
.profileImgBox img {
  max-width: 100%;
  max-height: 100%;
}
.profileImgBox.userBlank img {
  display: none;
}
.profileUploaderBox #fileUploader {
  margin-bottom: 10px;
}
#profileBottom {
  display: none;
}
#profileMoreData.moreBtn {
  margin-bottom: 0;
}
.profileMoreDataBtn {
  margin-bottom: 20px;
  justify-content: flex-start;
}
#mainContent.profile #column2 .group > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 10px;
}
#mainContent.profile #column2 .tile {
  color: white;
  padding: 16px 18px;
  border-radius: 10px;
  background-color: #00b0f0;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  display: flex;
  align-items: center;
}
#mainContent.profile #column2 .tile:hover {
  background-color: #0092c7;
}
#mainContent.profile #column2 .tile > div {
  flex-grow: 1;
}
#mainContent.profile #column2 .tileName .name {
  display: flex;
  justify-content: space-between;
}
#mainContent.profile #column2 .tileName .name .floatRabsolute {
  font-weight: 500;
}
#profileBottom .formContent td {
  padding-bottom: 14px !important;
}
/* #endregion */

/* #region certificate */

.page_certificateedit {
  background-color: #efefef;
}
#certificateMainBox {
  height: 1461px;
  width: 1033px;
  position: relative;
}
#certificateMain {
  position: absolute;
  width: 100%;
  max-width: 1033px;
  height: 1461px;
  padding: 10mm;
  line-height: 1 !important;
  background-color: white;
  background-repeat: no-repeat;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#certificateMain.landscape {
  height: 1033px;
  width: 1461px;
}
#certificateContent {
  position: relative;
  overflow: hidden;
  height: 100%;
  line-height: inherit !important;
  font-size: 12px;
}
#certificateContent p {
  font-size: inherit;
  line-height: inherit;
  margin-bottom: 0;
}
.preview #certificateContent {
  border: 1px solid transparent;
}
.popupCertPreview #certificateMain {
  position: relative;
  margin: -150px auto;
  transform: scale(0.65);
  border: 1px solid #dddddd;
}
.dialogMain:has(.popupCertPreview) {
  padding: 0;
}
.popupCertPreview .inlineBtnBar {
  margin-bottom: 0;
}
.popupCertPreview .cancelBtn {
  margin: 20px;
}
/*editor*/

.popupCertPreview .field {
  position: absolute;
  height: 100px;
  width: 100px;
  top: 0;
  left: 0;
  color: black;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
/* #endregion */

/* #region interaktivni elementi */

.megaBtn {
  width: 175px;
  font-size: 16px;
  cursor: pointer;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  line-height: 22px;
  position: relative;
}
.megaBtn:last-child {
  margin-right: 0;
}
.megaBtn::before {
  content: "";
  display: block;
  height: 127px;
  margin-bottom: 3px;
  background: #00b0f0;
  border-radius: 10px;
}
.megaBtn:hover::before {
  background: #0092c7;
}
.megaBtn::after {
  content: "";
  display: block;
  position: absolute;
  top: 16px;
  width: 100%;
  height: 95px;
  background: url(/statika/style/baseImg/megaBtns.png?v=1.4) no-repeat center top;
}
.aType10::after {
  background-position: center -1000px;
}
.aType20::after {
  background-position: center -1100px;
}
.aType30::after {
  background-position: center -1500px;
}
.aType50::after {
  background-position: center -1300px;
}
.aType60::after {
  background-position: center -1400px;
}
.aType80::after {
  background-position: center -1600px;
}
.aType90::after {
  background-position: center -1800px;
}
.aType100::after {
  background-position: center -2200px;
}
.section .megaBtn {
  float: left;
  margin-right: 30px;
  margin-bottom: 20px;
}
#elementTypeChoose .inlineBtnBar {
  display: flex;
  justify-content: flex-end;
}
.btnIEAccordion::after {
  background-position: center -2300px;
  height: 93px;
}
.btnIELightbox:after {
  background-position: center -2400px;
  height: 95px;
}
.btnIEHotspots:after {
  background-position: center -2500px;
  height: 76px;
  top: 25px;
  left: 3px;
}
.lightboxForm {
  display: flex;
  padding: 1rem;
  margin-bottom: 1rem;
  background-color: #f1f1f1;
  gap: 1rem;
}
.lightboxFormActions {
  font-size: 14px;
  display: grid;
  grid-template-columns: auto auto;
  row-gap: 1.3rem;
  column-gap: 1rem;
  grid-template-rows: auto auto auto 1fr;
  grid-template-areas: "fileLabel fileUploader" "thumbnailLabel thumbnailControls" "magnifyingLabel magnifyingControls" "fullImageLabel fullImageControls";
}
#lightBoxEditFormContent .lockIcon {
  margin-left: 0.8rem;
  cursor: pointer;
  width: 27px;
  height: 24px;
  background-image: url(/Statika/style/custom_templates/adria/img/icons16o.png?v=3.1.82);
  background-position: 0 -6005px;
}
#lightBoxEditFormContent .lockIcon.locked {
  background-position: 0 -5960px;
}
.fileLabel {
  grid-area: fileLabel;
}
#fileUploader {
  grid-area: fileUploader;
}
.dialogMain:has(.lightBoxEditFormContent) {
  max-height: 95vh;
  overflow-y: auto;
}
#lightBoxEditFormContent {
  min-width: 50%;
}
#lightBoxEditFormContent.IELightBox {
  width: fit-content !important;
}
#lightBoxEditFormContent.hotSpots {
  width: 916px;
}
#lightBoxEditFormContent input {
  margin-bottom: 0;
}
.thumbnailLabel {
  grid-area: thumbnailLabel;
}
.thumbnailControls {
  grid-area: thumbnailControls;
  margin-right: 0;
}
.fullImageLabel {
  grid-area: fullImageLabel;
}
.fullImageControls {
  grid-area: fullImageControls;
}
.lightboxLabel {
  font-family: 'Segoe UI';
  text-align: right;
  font-weight: bold;
  position: relative;
  top: 7px;
  font-size: 14px;
  padding-left: 2rem;
  padding-top: 5px;
}
.dimensionsControl {
  font-weight: bold;
  font-size: 13px;
}
.magnifyingLabel {
  grid-area: magnifyingLabel;
  position: relative;
  top: -2px;
}
.magnifyingControls {
  grid-area: magnifyingControls;
}
.magnifyingControls input {
  position: relative;
  top: 2px;
}
#ddlThumbDimension {
  margin-bottom: 0;
}
#thumbWidthDiv,
#thumbHeightDiv {
  margin-top: 1rem;
  margin-bottom: 0;
}
.lastInput {
  margin-bottom: 0 !important;
}
#thumbnailPreview {
  text-align: center;
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  align-items: center;
  font-size: 13px;
}
.thumbnailWrapper {
  margin-bottom: 0.5rem;
  width: auto;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
}
.thumbnailWrapper a {
  display: block;
}
.thumbnailWrapper img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.IELightBox.objImage img {
  opacity: 0.75;
}
.IELightBox.objImage:hover img {
  opacity: 1;
}
.IELightBox {
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  display: inline-block;
}
.IELightBox.objImage:not(.noIcon)::after {
  display: block;
  content: 'search';
  position: absolute;
  height: 40px;
  width: 40px;
  padding: 10px;
  color: white;
  text-align: center;
  font-size: 45px;
  background-color: #333333;
  opacity: 0.7;
  left: 50%;
  margin-left: -30px;
  top: 50%;
  margin-top: -30px;
  border-radius: 50%;
}
#markers:has(.active) img {
  cursor: crosshair;
}
.IEHotSpotItem {
  position: absolute;
  text-align: center;
  color: #00b0f0;
  font-weight: 500;
  font-size: 1.2rem;
  background-color: white;
  border: 1px solid #00b0f0;
  height: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 10px;
  padding: 6px 9px 11px 9px;
  border-radius: 100%;
  transition: all 0.1s ease;
  user-select: none;
}
.IEHotSpotItem:active,
.hotSpotsActive,
.IEHotSpotItem.active {
  background-color: #00b0f0;
  border: 1px solid white;
  color: white;
  z-index: 1;
}
.IEHotSpotItem.active:hover {
  cursor: move;
}
:not(.active):not(.hotSpotsActive).IEHotSpotItem:hover {
  cursor: pointer;
  background-color: #e3f8ff;
}
.hotSpotItemMarkers {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.stepInput {
  display: flex;
  align-items: center;
  margin-bottom: 1rem;
}
#lightBoxUploadForm .qq-upload-success {
  display: none;
}
#lightBoxUploadFormContent {
  background-color: #f1f1f1;
  padding: 1rem;
  padding-left: 6rem;
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
}
#eCourseActivityTypeSelect {
  max-width: 850px;
}
.inputCell.thumbnail {
  display: flex;
}
.thumbnailControls {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-right: 4rem;
}
.thumbnailControls select,
input[type=number] {
  border: 1px solid lightgray;
  width: 150px;
  padding: 0.3rem 0.6rem;
  margin-bottom: 1rem;
}
.stepInput label {
  margin-right: 1rem;
}
.stepInput input {
  width: 75px;
}
.thumbnailPreview {
  width: 250px;
}
.thumbnailPreview img {
  width: 100%;
}
.lightboxFormActions label {
  margin-right: 0.7rem;
}
.lightboxFormActions input[type=checkbox] {
  vertical-align: middle;
  margin: 0;
}
.thumbnailPreview {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.item {
  display: none;
}
#hotspotsEditFormContent {
  display: flex;
  flex-direction: column;
  min-width: 300px;
  padding: 2rem;
}
.hotspotsForm {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.controls {
  display: flex;
  align-items: center;
}
.controls .inlineBtn {
  margin-right: 1rem;
}
.top.controls .inlineBtnBar {
  margin-bottom: 0;
}
.bottom.controls {
  justify-content: flex-end;
}
.bottom.controls .cancelBtn {
  margin-right: 0;
}
.IEHotSpots {
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
.hotSpotsContainer {
  display: flex;
  background-color: #f6f6f6;
}
.hotSpotsContainer.reverse {
  flex-direction: row-reverse;
}
.hotSpotItem {
  flex: 1;
}
.hotSpotItemImage {
  position: relative;
}
.hotSpotItemImage img {
  -webkit-user-drag: none;
  max-width: 100%;
  width: 100%;
  vertical-align: middle;
}
.hotSpotInfo {
  position: relative;
}
.hotSpotItemText {
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 20px;
  max-height: 100%;
  overflow-y: auto;
}
#editorPositionSelect input {
  margin: 0 3px 0 5px;
  vertical-align: middle;
}
#editorPositionSelect {
  font-size: 14px;
}
#editorPositionSelect .settingTitle {
  margin-left: 0;
  margin-right: 7px;
}
#editorPositionSelect label {
  margin-top: 0px;
  margin-left: 5px;
}
.IEAccordion {
  margin-bottom: 20px;
  border-radius: 10px;
  overflow: hidden;
}
#interactiveEditPanelInputs .IEAccordion {
  overflow: visible;
}
.IEAccordionItem.edit .panelHeader {
  border-radius: 10px;
}
.IEAccordion .IEAccordionItem {
  border-bottom: 1px solid #f1f1f1;
}
.IEAccordion .panelHeader {
  background-color: #00b0f0;
  position: relative;
  padding: 12px 15px;
  color: white;
  font-size: 1rem;
  font-weight: bold;
  display: flex;
  align-items: center;
}
.IEAccordion .IEAccordionItem.opened .panelHeader {
  background-color: #0092c7;
}
.IEAccordion.arrows .IEAccordionItem:not(.edit) .panelTitle::before {
  content: 'keyboard_arrow_down';
  font-size: 32px;
  display: block;
  position: absolute;
  left: -6px;
  top: -7px;
  width: 32px;
  height: 30px;
  transition: 0.4s ease;
}
.IEAccordion.arrows .IEAccordionItem:not(.edit).opened .panelTitle::before {
  transform: rotate(-180deg);
}
.IEAccordion.plusMinus .IEAccordionItem:not(.edit) .panelTitle::before,
.IEAccordion.plusMinus .IEAccordionItem:not(.edit) .panelTitle::after {
  content: "";
  display: block;
  background-color: white;
  position: absolute;
  top: 50%;
  left: 0;
  transition: 0.4s;
  width: 15px;
  height: 2px;
  border-radius: 1px;
}
.IEAccordion.plusMinus .IEAccordionItem:not(.edit) .panelTitle::after {
  transform: rotate(90deg);
}
.IEAccordion.plusMinus .IEAccordionItem:not(.edit).opened .panelTitle::before {
  transform: rotate(90deg);
  opacity: 0;
}
.IEAccordion.plusMinus .IEAccordionItem:not(.edit).opened .panelTitle::after {
  transform: rotate(180deg);
}
.IEAccordion .panelContent {
  background-color: #f7f7f7;
  padding: 0;
  padding: 15px;
}
.IEAccordion .paddingWrapper {
  max-height: 0;
  box-sizing: border-box;
  transition: max-height 0.4s ease;
  overflow: hidden;
}
.IEAccordion .panelContent::after {
  content: '';
  display: block;
  clear: both;
}
.IEAccordion .panelContent p:last-child,
.IEAccordion .panelContent table:last-child,
.IEAccordion .panelContent ul:last-child,
.IEAccordion .panelContent ol:last-child,
.IEAccordion .panelContent .extVideoBox:last-of-type {
  margin-bottom: 0 !important;
}
.IEAccordion .panelContent .embeddedVideo,
.IEAccordion .panelContent .extVideoBox {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  width: 100% !important;
  height: 0 !important;
}
.IEAccordion .panelContent .embeddedVideo iframe,
.IEAccordion .panelContent .embeddedVideo object,
.IEAccordion .panelContent .embeddedVideo embed,
.IEAccordion .panelContent .extVideoBox iframe,
.IEAccordion .panelContent .extVideoBox object,
.IEAccordion .panelContent .extVideoBoxembed embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.IEAccordion .IEAccordionItem.opened .panelContent {
  display: block;
}
#accordionContentEdit {
  margin-bottom: 0;
}
.interactiveEditHeader {
  position: relative;
  padding-right: 30px;
}
.interactiveEditHeader .title input {
  width: 78%;
  box-sizing: border-box;
  font-size: inherit;
  color: inherit;
  text-transform: inherit;
  font-weight: inherit;
  line-height: 45px;
  padding: 0 5px;
  border: 1px solid #cccccc;
  background: white;
  border-radius: 5px;
}
#interactiveEditClose {
  position: absolute;
  cursor: pointer;
  width: 20px;
  height: 21px;
  top: 12px;
  right: 0;
}
.interactiveEditHeader .settingsRow {
  margin-bottom: 15px;
  font-size: 14px;
}
.interactiveEditHeader .settingTitle {
  padding-right: 7px;
}
.interactiveEditHeader .settingsRow input[type="radio"],
.interactiveEditHeader .settingsRow label {
  vertical-align: middle;
}
.IEAccordion .panelTitle {
  position: relative;
  padding-left: 30px;
  margin-right: 20px;
  cursor: pointer;
  user-select: none;
  flex-grow: 1;
}
.IEAccordion .IEAccordionItem:not(.edit) .panelTitle::before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  width: 18px;
  height: 18px;
}
.IEAccordion .panelActions {
  display: flex;
  gap: 10px;
}
.IEAccordion .panelActions .actionBtn {
  cursor: pointer;
}
.IEAccordion .panelActions .btnEditPanel::before {
  content: "edit";
}
.IEAccordion .panelActions .btnDeletePanel::before {
  content: "delete";
}
.IEAccordion .panelContent {
  background-color: #f7f7f7;
  padding: 15px;
  display: none;
}
.IEEditAccordion .inlineBtnBar {
  display: flex;
  justify-content: space-between;
}
.IEEditAccordion .inlineBtnBar .btns {
  display: flex;
  gap: 10px;
}
#accordionContentEdit .panelContent {
  max-height: 500px;
  overflow-y: auto;
}
.IEAccordion .IEAccordionItem img[align="left"] {
  float: left;
  margin: 0 1em 1em 0;
}
.IEAccordion .IEAccordionItem img[align="right"] {
  float: right;
  margin: 0 0 1em 1em;
}
.IEAccordion .IEAccordionItem.opened .panelContent img {
  max-width: 100%;
}
.IEAccordion .IEAccordionItem.opened .panelContent p:last-child {
  margin-bottom: 0;
}
.IEAccordion .IEAccordionItem.edit .panelTitle {
  padding-left: 0;
  padding-right: 0;
  font-weight: normal;
}
.IEAccordion .IEAccordionItem.edit .panelTitle input {
  width: 100%;
  box-sizing: border-box;
  font-size: inherit;
  color: inherit;
  text-transform: inherit;
  font-weight: inherit;
  padding: 5px 10px;
  border: 1px solid white;
  background: transparent;
}
.IEAccordion .IEAccordionItem.edit .panelContent {
  display: block;
}
.accordionHeader,
.userOverview h2 {
  cursor: pointer;
}
#panelEditContent {
  height: 395px;
}
/* #endregion */

/* #region atomshow */

.page_learning #mainContentWrapper {
  padding: 10px 0;
}
#mainContent.atomshow {
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  max-width: 1420px;
}
#mainContent.atomEdit .columnContent h2 a {
  display: inline;
}
.atomEdit .mq {
  margin-bottom: 0;
}
.allQuestions .mq {
  margin-top: 0 !important;
  margin-bottom: 40px;
}
.editQuestionButton,
.deleteQuestionButton {
  cursor: pointer;
}
.editQuestionButton::after {
  content: "edit";
  margin-left: 5px;
  position: relative;
  top: 4px;
  line-height: 0.5;
}
.deleteQuestionButton::after {
  content: "delete";
  margin-left: 5px;
  position: relative;
  top: 4px;
  line-height: 0.5;
}
.deleteQuestionButton.disabled {
  pointer-events: none;
  opacity: 0.6;
  filter: saturate(0);
}
.questionPreview .mq {
  margin-bottom: 20px;
}
.mq .mqTitle {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
  margin-bottom: 20px;
}
#econtentSearchBox {
  border-top: 1px solid #d2d2d2;
  padding: 10px 40px;
}
.atomshow h1 {
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
  font-size: clamp(1.69rem, 2.15vw, 2.03rem);
  margin-bottom: 20px;
  text-transform: uppercase;
}
.atomshow h2 {
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  margin-bottom: 20px;
}
.topBar h2 {
  margin: 5px 0;
}
.atomshow p,
.mq .mqTitle,
.activityText p {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  line-height: 27px;
  margin-bottom: 20px;
}
.atomshow p:last-child,
.activityText p:last-of-type {
  margin-bottom: 0;
}
.atomshow .naslov,
.activityText .naslov {
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  line-height: 36px;
  margin-bottom: 20px;
  font-weight: lighter;
}
.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}
.embed-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.FontVecji {
  font-size: 125%;
}
.FontManjsi {
  font-size: 80%;
}
.horline {
  border-top: 1px dashed #cccccc;
  padding-top: 20px;
}
.slideBox {
  position: relative;
}
.slideBox a {
  display: block;
  position: absolute;
}
#iframePdf {
  height: 800px;
  width: 100%;
}
.FontColor1BG {
  background-color: yellow;
}
.FontColor2BG {
  background-color: #f89748;
}
.FontColor3BG {
  background-color: red;
}
.FontColor4BG {
  background-color: #83adf7;
}
.FontColor5BG {
  background-color: #29b90d;
}
.FontColor6BG {
  background-color: #aaaaaa;
}
.dataTable {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  text-align: left;
  margin-bottom: 20px;
}
.dataTable th {
  background-color: #00b0f0;
  color: white;
  vertical-align: bottom;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
  line-height: 20px;
}
.dataTable th:first-child {
  border-radius: 10px 0 0 0;
}
.dataTable th:last-child {
  border-radius: 0 10px 0 0;
}
.dataTable tbody tr {
  border-bottom: 1px solid #d2d2d2;
}
.dataTable th,
.dataTable td {
  padding: 10px 15px;
  line-height: 20px;
}
.atomBtns {
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
}
.atomBtns.rightBar {
  display: none;
}
.btnsGroup1 {
  display: flex;
  gap: 30px;
  padding-left: 40px;
  align-items: center;
}
.atomshow .btnsGroup2 {
  width: 200px;
  margin-left: auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
}
.atomshow #column1 {
  width: 338px;
  float: left;
  background-color: white;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  display: block;
}
.atomshow #column1 .columnContent {
  position: relative;
}
.atomshow #column2,
.page_spletajshow .tabContent > .columnContent {
  width: 1040px;
}
.atomshow #column2 {
  float: right;
}
.atomshow .subcolumn1 {
  width: 780px;
  float: left;
  margin-bottom: 20px;
}
.atomshow.atomWide .subcolumn1,
#mainContent.wholeCourse .atomWide .subcolumn1 {
  float: none;
  width: auto;
}
.atomshow .subcolumn1 .atomContent {
  box-sizing: border-box;
  padding: 40px;
  min-height: 300px;
  background-color: white;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
}
.fullscreenPage {
  padding-top: 20px;
}
.fullscreenPage .atomContent iframe.editorObject {
  width: 100% !important;
}
.fullscreenPage .btnsGroup1 {
  padding-left: 0;
}
.fullscreenPage .btnsGroup1 #contents {
  display: inline-block;
}
#iframePdf {
  border-radius: 10px;
}
.mq {
  background-color: white;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  overflow: hidden;
}
.mqContent {
  padding: 20px 40px;
}
.atomshow .subcolumn1 .mq {
  margin-top: 40px;
}
.page_izpitopravljanje .atomshow .subcolumn1 .mq,
.atomshow .subcolumn1 .videoAdditionalContentBox .mq,
.questionReviewBox .mq {
  margin-top: 0;
  margin-bottom: 20px;
}
.atomshow .mqContent {
  padding: 20px 40px 30px 40px;
}
.atomEdit .mqContent {
  padding: 20px 40px 10px 40px;
}
.mq label {
  margin: 0 !important;
}
.atomshow .mqen img,
.atomshow .mquje img,
.atomshow .mqvec img,
.atomshow .mqtekst img,
.atomshow .mqzap img {
  max-width: 100%;
  height: auto;
}
.page_izpitopravljanje .mq:not(.mqtekst) .mqContent,
.questionReviewBox .mqContent {
  padding: 20px 40px 10px 40px;
}
.finishTestLblBox {
  margin-bottom: 20px;
}
table.answerOverview tr:not(:last-child) td {
  vertical-align: top;
  padding-bottom: 40px;
}
.questionDataCell {
  width: 160px;
}
.questionDataCell .answerIcon::before {
  font-size: 36px;
}
.mq .stateIcon {
  height: 16px;
  width: 16px;
  left: -30px;
  position: absolute;
  top: 5px;
}
.mqInputCell .answerIcon::before,
.mq .stateIcon::before,
.fontIcon.close::before,
.fontIcon.check::before {
  font-weight: bold;
  vertical-align: text-top;
}
.questionDataCell .answerIcon.correct::before {
  content: "check_circle";
  color: #4cbd6b;
}
.questionDataCell .answerIcon.incorrect::before {
  content: "cancel";
  color: red;
}
.mqInputCell .answerIcon.incorrect::before,
.mq .stateIcon::before,
.fontIcon.close::before {
  content: "close";
  color: red;
}
.mqInputCell .answerIcon.correct::before,
.mq .stateIcon.correctAnswer::before,
.fontIcon.check::before {
  content: "check";
  color: #4cbd6b;
}
.mqContent .inlineBtnBar,
.page_izpitopravljanje .inlineBtnBar:not(.finishTestBtnBox) {
  margin-bottom: 0;
}
.mqContent .inlineBtnBar,
.page_izpitopravljanje .inlineBtnBar:not(.finishTestBtnBox) .mq label {
  margin-right: 0;
}
.mqAnswer {
  padding: 15px 40px;
  color: white;
}
.mqAnswer.correct {
  background-color: #4cbd6b;
}
.mqAnswer.incorrect {
  background-color: red;
}
.mqAnswer.half {
  background-color: #ff9900;
}
.mqTitleLbl {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  margin-bottom: 10px;
}
.mqTitleLbl::before {
  content: "exercise";
  display: inline-block;
  margin-right: 10px;
  vertical-align: sub;
}
.mq .mqTitle {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.mq .mqTable {
  width: 100%;
}
.mqInputCell {
  width: 20px;
  padding-right: 5px;
  vertical-align: top;
  line-height: 27px;
}
.mqInputLabel,
.mqLabelCell {
  vertical-align: top;
  padding-bottom: 20px;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  line-height: 27px;
}
#mainContent.atomEdit .mqLabelCell p {
  margin-bottom: 0;
}
.mqAnswer {
  display: none;
}
.vprRazlaga {
  margin-top: -1.2rem;
  margin-bottom: 1.2rem;
}
.atomshow .subcolumn2 {
  width: 220px;
  float: right;
}
.atomshow .myComments {
  clear: both;
  display: block;
  margin-top: 10px;
}
.atomshow .commentTabs {
  float: left;
  margin-bottom: 10px;
}
.btnsGroup1 .atomBtn {
  padding: 5px;
  display: inline-block;
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
  color: #8d8d8d;
  cursor: pointer;
}
.btnsGroup1 .atomBtn:hover {
  color: #333333;
}
.btnsGroup1 #backToStart,
.btnsGroup1 #contents,
.btnsGroup1 #atomMore {
  display: none;
}
.btnsGroup1 #backToStart::after {
  content: "home";
}
.btnsGroup1 #contents::after {
  content: "toc";
}
.btnsGroup1 #atomMore::after {
  content: "more_vert";
}
.btnsGroup1 #favourite::after {
  content: "kid_star";
}
.btnsGroup1 #myProgress::after {
  content: "bar_chart";
}
#myProgress.gameProgressBtn {
  position: relative;
}
.btnsGroup1 #myProgress.gameProgressBtn::after {
  content: "trophy";
}
#gamePoints {
  position: absolute;
  height: 19px;
  width: 60px;
  text-align: center;
  left: -14px;
  top: 0;
  font-size: 15px;
  font-weight: bold;
  display: none;
  opacity: 0;
}
.btnsGroup1 #sendMessage::after {
  content: "mail";
}
.btnsGroup1 #files::after {
  content: "description";
}
.btnsGroup1 #files {
  position: relative;
}
.btnsGroup1 #files .objectsCount {
  position: absolute;
  top: -5px;
  right: -5px;
  padding: 5px;
  border-radius: 50%;
  font-size: 10px;
  width: 10px;
  height: 10px;
  text-align: center;
  font-weight: bold;
  background-color: #00b0f0;
  color: white;
}
.btnsGroup1 #textSize {
  display: none;
}
.btnsGroup2 .atomBtn,
.pagerBtn {
  padding: 8px 8px 4px 8px;
  display: inline-block;
  border-radius: 50%;
  cursor: pointer;
  text-align: center;
  font-size: clamp(1.19rem, 1.51vw, 1.42rem);
}
.pagerBtn {
  margin-left: 20px;
}
.atomBtn.next::after,
.pagerBtn.nextBtn::after {
  content: "arrow_forward_ios";
}
.atomBtn.nextNoAccess::after {
  content: "help";
  vertical-align: sub;
  margin-left: 5px;
}
.atomshow .btnsGroup2 .next,
.pagerBtn.nextBtn,
.pagerBtn.prevBtn,
#previewButton.active {
  background-color: #00b0f0;
  color: white;
  order: 1;
}
.atomshow .btnsGroup2 .next:hover,
.pagerBtn.nextBtn:hover,
.pagerBtn.prevBtn:hover {
  background-color: #0092c7;
  border: 1px solid #0092c7;
}
.atomshow .btnsGroup2 .key {
  background-color: #ff9900;
  border: 1px solid #ff9900;
}
.atomshow .btnsGroup2 .key:hover {
  background-color: #e68a00;
  border: 1px solid #e68a00;
}
.atomshow .btnsGroup2 .nextNoAccess {
  width: 200px;
  background-color: transparent;
  border: 0 none;
  color: red;
  padding-right: 0;
  text-align: right;
}
.atomshow .btnsGroup2 .nextNoAccess:hover {
  background-color: transparent;
  border: 0 none;
  color: #e60000;
}
#estLearningTime {
  order: 1;
  min-width: 200px;
  text-align: right;
}
#estLearningTime.timeIncomplete {
  color: red;
}
/*
#estLearningTimeTxt{}
*/

#estLearningTimeVal {
  font-weight: bold;
}
.atomshow .btnsGroup2 .prev {
  order: 2;
}
.atomshow .btnsGroup2 .next {
  order: 3;
}
.atomBtn.prev::after,
.pagerBtn.prevBtn::after {
  content: "arrow_back_ios_new";
  order: 0;
}
.atomBtn.lastRead::after,
.pagerBtn.endBtn::after {
  content: "last_page";
  order: 0;
}
.pagerBtn.startBtn::after {
  content: "first_page";
}
.atomshow .atomComment {
  background-color: white;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  margin-bottom: 40px;
  overflow: hidden;
  position: relative;
  padding: 20px;
}
.atomshow .atomComment::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 6px;
  background-color: #ffdc40;
}
.atomshow .commentTitle {
  margin: 5px 0 10px;
  text-transform: uppercase;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
}
.atomshow .commentTitle::before {
  vertical-align: middle;
  margin-right: 10px;
}
.atomshow .type1 .commentTitle::before {
  content: "reviews";
}
.atomshow .type2 .commentTitle::before {
  content: "menu_book";
}
.atomshow .type3 .commentTitle::before {
  content: "emergency_home";
  vertical-align: sub;
}
.atomshow .atomComment p {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  margin-left: 0;
}
.atomshow #atomToolbarMore {
  background-color: white;
  display: none;
}
.atomToolbarMoreBtn {
  padding: 15px 20px;
  cursor: pointer;
}
.atomToolbarMoreBtn:hover {
  background-color: #efefef;
}
.atomToolbarMoreBtn::before {
  vertical-align: middle;
  margin-right: 10px;
}
#atomMoreMyProgress {
  display: none;
}
#atomMoreMyProgress::before {
  content: "bar_chart";
}
#atomMoreFavourite::before {
  content: "kid_star";
}
#atomMoreSendMessage::before {
  content: "mail";
}
#atomMoreFiles::before {
  content: "description";
}
.atomshow #graphProgress {
  position: absolute;
  top: 0 !important;
  z-index: 1001;
  width: 100%;
  display: none;
  background-color: #00b0f0;
  color: white;
  border-radius: 10px;
}
.graphProgressContent {
  padding: 20px;
}
.graphProgressBox {
  display: flex;
}
.graphProgressText {
  padding-left: 20px;
}
.myProgressTitle {
  text-transform: uppercase;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
}
.graphProgressPercent1 {
  font-size: clamp(1.33rem, 1.7vw, 1.6rem);
}
.graphProgressPercent3 {
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
}
.graphProgressText3,
.graphProgressText4 {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
}
.graphProgressText3 {
  margin-top: 20px;
}
#mainContent.atomshow::after {
  content: "";
  display: block;
  clear: both;
}
.menuHeader {
  border-bottom: 1px solid #d2d2d2;
  padding: 20px 0;
}
.menuHeader .tileAdditional {
  font-size: clamp(0.74rem, 0.94vw, 0.89rem);
  padding: 0 40px 10px 40px;
  text-transform: uppercase;
}
.menuHeader .tileAdditional a:link,
.menuHeader .tileAdditional a:visited {
  color: #00b0f0;
}
.menuHeader .tileAdditional a:hover,
.menuHeader .tileAdditional aactive {
  color: #0092c7;
}
.menuHeader .tileName {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  text-transform: uppercase;
  padding: 0 40px;
}
.menuContent .menuItem {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  padding-left: 15px;
  display: flex;
  justify-content: space-between;
}
.menuContent .menuItem.completed {
  background-color: #eaeaea;
  color: #8d8d8d;
}
.menuContent .menuItem:hover {
  background-color: #d2d2d2;
}
.menuContent .menuItem.active {
  background-color: #ffdc40;
}
.menuContent .menuItem a:link,
.menuContent .menuItem a:visited,
.menuContent .menuItem a:hover,
.menuContent .menuItem a:active {
  color: #333333;
}
.menuContent .menuItem.active,
.menuContent .menuItem.active a:link,
.menuContent .menuItem.active a:visited,
.menuContent .menuItem.active a:hover,
.menuContent .menuItem.active a:active {
  color: #333333;
}
.menuContent .menuItem.completed:not(.active) a:link,
.menuContent .menuItem.completed:not(.active) a:visited,
.menuContent .menuItem.completed:not(.active) a:hover,
.menuContent .menuItem.completed:not(.active) a:active {
  color: #8d8d8d;
}
.menuGroup .toggleMenuChildren,
.menuGroup .menuSpacer {
  order: 0;
  width: 25px;
  min-width: 25px;
}
.menuGroup .toggleMenuChildren {
  cursor: pointer;
  padding-block: 8px;
  padding-right: 2px;
  position: relative;
  top: 2px;
}
.menuGroup .toggleMenuChildren::before {
  content: "keyboard_arrow_down";
}
.menuGroup .toggleMenuChildren.opened::before {
  content: "keyboard_arrow_up";
}
.menuGroup .atomName {
  order: 1;
  flex-grow: 1;
  padding-block: 11px;
  cursor: pointer;
}
.menuGroup .menuItemIcons {
  order: 2;
  width: 25px;
  padding-block: 8px;
  padding-right: 5px;
  position: relative;
  top: 2px;
}
.menuItemIcon.important::before {
  content: "kid_star";
}
.ui-effects-transfer {
  z-index: 10000;
  content: "kid_star";
}
.menuGroup .menuGroup .toggleMenuChildren,
.menuGroup .menuGroup .menuSpacer {
  padding-left: 10px;
}
.menuGroup .menuGroup .menuGroup .toggleMenuChildren,
.menuGroup .menuGroup .menuGroup .menuSpacer {
  padding-left: 20px;
}
.menuGroup .menuGroup .menuGroup .menuGroup .toggleMenuChildren,
.menuGroup .menuGroup .menuGroup .menuGroup .menuSpacer {
  padding-left: 30px;
}
.menuGroup .menuSubGroup {
  display: none;
}
.menuItem.active + .menuSubGroup {
  display: block;
}
.page_izpitopravljanje .menuContent .menuItem {
  cursor: default;
  background-color: #e8e8e8;
  color: #b5b5b5;
}
#econtentSearchBox {
  border-top: 1px solid #d2d2d2;
  padding: 20px 24px;
}
.searchBox {
  border: 1px solid #d2d2d2;
  border-radius: 20px;
  background-color: white;
  padding: 0 15px;
  line-height: 20px;
  box-sizing: border-box;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.searchBox input {
  border: 0 none;
  padding: 0;
  border-radius: 0;
  height: auto;
  width: 90%;
  outline: 0 none;
}
.searchBtnInner {
  display: inline-block;
  width: 20px;
  height: 20px;
  cursor: pointer;
  border: none;
  background-color: transparent;
  padding: 0;
  margin-left: auto;
}
.searchBox input::placeholder,
.searchBtnInner {
  color: #8d8d8d;
}
.searchBtnInner::before {
  content: "search";
}
.noteContainer .form {
  width: auto;
  max-width: none;
}
.noteContainer .formContent {
  display: flex;
  align-items: flex-start;
}
#userNoteBox1 {
  flex-grow: 1;
}
#userNoteBox1 textarea {
  width: 90%;
}
.atomshow #column2 img,
.atomEdit .tabContent > .columnContent img,
.page_clanek #column2 img,
.atomContent img {
  max-width: 100%;
  height: auto;
}
.atomType20 .wrap p {
  line-height: 0;
}
.atomshow #column2 img[align="left"],
#eClassroomDesc img[align="left"],
.atomshow #column2 .flLeft,
.classrooms .atomshow img[align="left"] {
  margin: 0 15px 15px 0;
  float: left;
}
.atomshow #column2 img[align="right"],
#eClassroomDesc img[align="right"],
.atomshow #column2 .flRight {
  margin: 0 0 15px 15px;
  float: right;
}
.atomContent a:not(.inlineBtn):link,
.atomContent a:not(.inlineBtn):visited {
  color: #00b0f0;
  text-decoration: underline;
}
.atomContent a:not(.inlineBtn):hover,
.atomContent a:not(.inlineBtn):active {
  color: #0092c7;
  text-decoration: none;
}
.atomshow ol,
.atomshow ul {
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  line-height: 27px;
  margin-left: 56px;
  margin-bottom: 20px;
}
.atomshow ul:not([class]) {
  list-style-type: square;
}
.atomshow ol {
  list-style-type: decimal;
}
.atomshow ol:not([class]) li,
.atomshow ul:not([class]) li {
  margin-bottom: 20px;
}
p.alinejaNavadnaNivo1,
p.alinejaNavadnaNivo2,
p.alinejaPostopekNivo1,
p.alinejaPostopekNivo2 {
  margin-bottom: 20px;
  display: flow-root;
  text-indent: -14px;
  word-break: break-word;
}
p.alinejaNavadnaNivo1,
p.alinejaPostopekNivo1 {
  padding-left: 56px;
}
p.alinejaNavadnaNivo2,
p.alinejaPostopekNivo2 {
  padding-left: 70px;
}
.atomComment p.alinejaNavadnaNivo1,
.atomComment p.alinejaPostopekNivo1 {
  padding-left: 15px;
}
.atomComment p.alinejaNavadnaNivo2,
.atomComment p.alinejaPostopekNivo2 {
  padding-left: 29px;
}
.atomshow p + .alinejaNavadnaNivo1,
.alinejaNavadnaNivo1 + .alinejaNavadnaNivo1,
.alinejaNavadnaNivo1 + .alinejaNavadnaNivo2,
.alinejaNavadnaNivo1 + .alinejaPostopekNivo2,
.atomshow p + .alinejaNavadnaNivo2,
.alinejaNavadnaNivo2 + .alinejaNavadnaNivo1,
.alinejaNavadnaNivo2 + .alinejaNavadnaNivo2,
.alinejaNavadnaNivo2 + .alinejaPostopekNivo1,
.atomshow p + .alinejaPostopekNivo1,
.alinejaPostopekNivo1 + .alinejaPostopekNivo1,
.alinejaPostopekNivo1 + .alinejaPostopekNivo2,
.alinejaPostopekNivo1 + .alinejaNavadnaNivo2,
.atomshow p + .alinejaPostopekNivo2,
.alinejaPostopekNivo2 + .alinejaNavadnaNivo1,
.alinejaPostopekNivo2 + .alinejaPostopekNivo1,
.alinejaPostopekNivo2 + .alinejaPostopekNivo2,
.atomshow p + ol,
.atomshow p + ul,
.atomshow ol:not([class]) li + li,
.atomshow ul:not([class]) li + li {
  margin-top: -12px !important;
}
.alinejaNavadnaNivo1::before,
.alinejaNavadnaNivo2::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 4px;
  vertical-align: top;
  margin-right: 10px;
  margin-top: 13px;
}
.alinejaNavadnaNivo1::before {
  background-color: #00b0f0;
}
.alinejaNavadnaNivo2::before {
  background-color: #8d8d8d;
}
.alinejaPostopekNivo1::before,
.alinejaPostopekNivo2::before {
  content: "keyboard_arrow_right";
  display: inline-block;
  width: 9px;
  height: 15px;
  font-weight: bold;
  font-size: 20px;
  vertical-align: top;
  margin-top: 5px;
  margin-left: 5px;
}
.alinejaPostopekNivo1::before {
  color: #00b0f0;
}
.alinejaPostopekNivo2::before {
  color: #8d8d8d;
}
.inlineObjIcon {
  display: inline-block;
  background-color: #666666;
  font-size: clamp(0.66rem, 0.84vw, 0.79rem);
  color: white !important;
  font-weight: bold;
  padding: 0 10px;
  text-decoration: none;
  border-radius: 2px;
  box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.25);
  text-indent: 0;
}
a.inlineObjIcon:hover {
  opacity: 0.75;
}
.inlineObjIcon.objTxt,
.inlineObjIcon.txt {
  background-color: #666666;
}
.inlineObjIcon.objPdf,
.inlineObjIcon.objAudio,
.inlineObjIcon.objImage,
.inlineObjIcon.objVideo,
.inlineObjIcon.objFlash,
.inlineObjIcon.objIframe,
.inlineObjIcon.objYoutube,
.inlineObjIcon.objVimeo,
.inlineObjIcon.pdf,
.inlineObjIcon.audio,
.inlineObjIcon.image,
.inlineObjIcon.video,
.inlineObjIcon.flash {
  background-color: red;
}
.inlineObjIcon.objWord,
.inlineObjIcon.objExcel,
.inlineObjIcon.objPpt,
.inlineObjIcon.objAccess,
.inlineObjIcon.objDbase,
.inlineObjIcon.word,
.inlineObjIcon.excel,
.inlineObjIcon.powerpoint,
.inlineObjIcon.access,
.inlineObjIcon.dbase {
  background-color: #1ba0e1;
}
.inlineObjIcon.objZip,
.inlineObjIcon.zip {
  background-color: orange;
}
.inlineObjIcon::before {
  display: inline-block;
}
.inlineObjIcon.objTxt::before,
.inlineObjIcon.txt::before {
  content: "TXT";
}
.inlineObjIcon.objWord::before,
.inlineObjIcon.word::before {
  content: "WORD";
}
.inlineObjIcon.objExcel::before,
.inlineObjIcon.excel::before {
  content: "EXCEL";
}
.inlineObjIcon.objPpt::before,
.inlineObjIcon.powerpoint::before {
  content: "POWERPOINT";
}
.inlineObjIcon.objDbase::before,
.inlineObjIcon.dbase::before {
  content: "DBASE";
}
.inlineObjIcon.objAccess::before,
.inlineObjIcon.access::before {
  content: "ACCESS";
}
.inlineObjIcon.objPdf::before,
.inlineObjIcon.pdf::before {
  content: "PDF";
}
.inlineObjIcon.objAudio::before,
.inlineObjIcon.audio::before {
  content: "AUDIO";
}
.inlineObjIcon.objImage::before,
.inlineObjIcon.image::before {
  content: "IMAGE";
}
.inlineObjIcon.objVideo:before,
.inlineObjIcon.video::before {
  content: "VIDEO";
}
.inlineObjIcon.objFlash::before,
.inlineObjIcon.flash::before {
  content: "FLASH";
}
.inlineObjIcon.objZip::before,
.inlineObjIcon.zip::before {
  content: "ZIP";
}
.inlineObjIcon.objFile::before,
.inlineObjIcon.file::before {
  content: "FILE";
}
.inlineObjIcon.objYoutube::before {
  content: "YOUTUBE";
}
.inlineObjIcon.objVimeo::before {
  content: "VIMEO";
}
.inlineObjIcon.objIframe::before {
  content: "IFRAME";
}
#objectVariations {
  display: none;
}
.atomContent .b2Tabs {
  margin-bottom: 20px;
  border-bottom: 1px solid #f0f0f0;
}
.atomContent ul.tabsUl {
  list-style-type: none;
  margin-left: 0;
  margin-bottom: 0;
  font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  line-height: 1em;
  display: flex;
}
.atomContent ul.tabsUl li {
  display: block;
  margin-right: 3%;
}
.atomContent ul.tabsUl a:link,
.atomContent ul.tabsUl a:visited {
  color: #00b0f0;
  text-decoration: none;
}
.atomContent ul.tabsUl a:hover,
.atomContent ul.tabsUl a:active {
  color: #0092c7;
  text-decoration: none;
}
.atomContent ul.tabsUl li.ui-tabs-active {
  border-bottom: 4px solid #333333;
}
.atomContent ul.tabsUl li.ui-tabs-active a {
  color: #333333;
}
.atomContent ul.tabsUl li:last-of-type {
  margin-right: 0;
}
.atomContent ul.tabsUl a {
  display: block;
  text-decoration: none;
  outline: 0 none;
}
.atomContent ul.tabsUl a span {
  display: block;
  padding-bottom: 0.5em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  outline: 0 none;
}
.b2Tabs .tabContent {
  padding-top: 20px;
  margin-bottom: 20px;
  margin-top: -4px;
  border-top: 4px solid #f0f0f0;
}
.b2Tabs.tabDefaultBckg .tabContent {
  background-color: #f6f6f6;
}
.tabsPager {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.tabsPagerLabel {
  padding-right: 5px;
}
.b2Tabs .tabsPagerItem {
  cursor: pointer;
  padding: 0 0.357em;
  color: #00b0f0;
}
.b2Tabs .tabsPagerItem:hover {
  color: #0092c7;
}
.b2Tabs .tabsPagerItem.active {
  color: #333333;
}
.jwplayer {
  font-size: inherit !important;
  font-family: inherit !important;
}
.jw-tab-focus:focus {
  outline: 0 none !important;
}
.jw-text {
  font-size: 1em !important;
}
.jw-display-icon-container .jw-icon-display {
  border: 1px solid transparent;
}
.videoAdditional {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 100;
  height: 100%;
  cursor: default !important;
}
.videoAdditionalBckg {
  position: absolute;
  width: 100%;
  background-color: black;
  top: 0;
  left: 0;
  z-index: 100;
  height: 100%;
  opacity: 0.75;
}
.videoAdditionalContentBox {
  position: absolute;
  background-color: white;
  top: 1em;
  bottom: 1em;
  left: 1em;
  right: 1em;
  z-index: 100;
}
.videoAdditionalContent {
  box-sizing: border-box;
  height: 86%;
  padding: 1em;
  overflow-y: auto;
}
.videoAdditionalHtml .mq {
  margin-bottom: 0;
}
.videoAdditionalContinue {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
.videoAdditionalContinueBtns {
  padding: 1.5em 1em;
}
.videoplayer {
  background-color: #efefef;
}
#interacitveVideoEdit .videoplayer {
  width: 700px;
  height: 400px;
  margin-bottom: 1em;
}
#interacitveVideoEdit .jwplayer {
  width: 700px !important;
  height: 400px !important;
  margin-bottom: 1em;
}
.extVideoBox {
  position: relative;
  margin-bottom: 20px;
  background-color: #efefef;
}
.extVideoBox iframe.ytVideo {
  width: 100%;
  height: 100%;
}
#interacitveVideoEdit .extVideoBox {
  width: 700px;
  height: 400px;
}
.ytOverlayBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.ytOverlayBckg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0.5;
  z-index: 100;
}
.ytOverlayContent {
  position: absolute;
  top: 2%;
  left: 2%;
  width: 96%;
  background-color: white;
  z-index: 101;
}
.ivMarker {
  width: 3px;
  top: 0px;
  position: absolute;
  background-color: #ffdc40;
  height: 100%;
}
/*razvrscanje*/

.questionSortContent {
  padding: 1.143em 0;
}
.answerBox {
  position: relative;
  padding: 0.4em;
  padding-left: 2em;
  font-weight: normal;
}
.answerBox p {
  font-size: 1em;
  line-height: 1.28571em;
  margin-bottom: 0;
}
.iconBox {
  display: block;
  width: 20px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #aaaaaa;
}
.iconBox:before {
  content: '';
  display: block;
  width: 20px;
  height: 22.5px;
  background: url(/statika/style/baseImg/razvrscanjeIcons.png) 0 0;
  background-size: 20px 45px;
}
.sortAnswers {
  list-style-type: none !important;
  margin: 0 !important;
  padding: 0;
}
.sortAnswers li {
  margin: 0;
  padding: 0;
  background-color: #dddddd;
  color: black;
  border-bottom: 1px solid white;
}
/*normal*/

.ui-sortable-handle {
  cursor: move;
}
.sortAnswers .ui-sortable-handle:hover {
  background-color: #cccccc;
}
/*drag*/

.sortAnswers .ui-sortable-helper,
.sortAnswers .ui-sortable-helper:hover {
  background-color: #c5d8f6;
  opacity: 0.95;
}
.ui-sortable-helper .iconBox {
  background-color: #90b4ee;
}
.ui-sortable-helper .iconBox:before {
  background-position: 0 -22.5px;
}
/*placeholder*/

.sortAnswers .ui-sortable-placeholder {
  background-color: #90b4ee;
  visibility: visible !important;
  background-color: #999999;
}
.sortAnswers li,
.ui-sortable-placeholder {
  font-size: 1em;
  min-height: 2.071em;
}
/*tole se mora ujemati*/

.sortAnswers li p {
  margin-bottom: 0;
  font-size: inherit;
}
/*pregled odgovorov*/

#pregledOdgovorov .sortAnswers {
  margin-left: 30px !important;
}
.editQuestion .form td.labelCell {
  width: 25%;
}
/*ujemanje*/

.questionMatchContent {
  padding: 1.143em 0;
  margin-bottom: 0;
}
.questionMatchContent:after {
  content: '';
  display: block;
  clear: both;
}
.dropArea {
  margin-bottom: 8px;
  position: relative;
  min-height: 36px;
}
/*visina mora tocno ustrezati visini .question in .answer polj, sicer pride do zamika pri snappingu*/

.dropArea::after {
  content: "";
  display: block;
  clear: both;
}
.dropArea .question,
.dropArea .answer {
  position: absolute;
  top: 0;
  min-height: 36px;
  width: 45%;
  color: black;
  cursor: default;
}
/*naj se lahko prilagaja po visini*/

.dropAreaBox {
  padding: 8px;
}
.dropArea .question .dropAreaBox {
  padding-right: 25px;
}
.dropAreaBox p:last-child {
  margin-bottom: 0;
}
.dropArea p img {
  margin-bottom: -4px;
}
.dropArea p img[align="left"] {
  margin: 5px 10px 5px 0;
}
.dropArea .question {
  background-color: #cccccc;
  border-radius: 4px 0 0 4px;
}
.dropArea .question::after {
  content: "";
  display: block;
  height: 20px;
  width: 16px;
  position: absolute;
  right: -1px/*ie*/;
  top: 8px;
  background-color: white;
  border-radius: 4px 0 0 4px;
}
.dropArea .answer {
  left: 50%;
  background-color: #cccccc;
  cursor: move;
  float: right;
  border-radius: 0 4px 4px 0;
}
.dropArea .answer::before {
  content: "";
  display: block;
  height: 20px;
  width: 16px;
  position: absolute;
  left: -15px/*ie*/;
  top: 8px;
  background-color: #cccccc;
  border-radius: 4px 0 0 4px;
}
.dropArea .docked {
  left: 45%;
}
.notDragging .answer:hover {
  background-color: #a7a7a7;
}
.notDragging .answer:hover::before {
  background-color: #a7a7a7;
}
.answer.ui-draggable-dragging {
  background-color: #a7a7a7;
  opacity: 0.95;
}
.answer.ui-draggable-dragging::before {
  background-color: #a7a7a7;
}
.dropArea.ui-state-hover {
  background-image: none;
  background-color: transparent;
  border: 0 none;
  font-weight: normal;
}
.dropArea.ui-state-hover .question {
  background-color: #a7a7a7;
}
#pregledOdgovorov .questionMatch {
  margin-left: 30px !important;
}
/*zapolnjevanje*/

.mqzap .mqTitle {
  font-weight: normal;
  line-height: 2.571em;
  padding-bottom: 0;
}
.mqzap .mqTitle div[id="vprasanje_id"] {
  font-weight: bold;
}
.mqzap .mqTitle p,
.mqzap .userAnswers p,
.mqzap .correctAnswers p {
  line-height: 1.75em;
}
.mqzap .mqTitle p:last-child,
.mqzap ul.correctAnswerList {
  margin-bottom: 0;
}
.mqzap .inlineBtnBar {
  margin-top: 1.28571em;
}
.answerDataCell .zapolnjevanjeVnosnoPoljeEditor,
.answerDataCell .zapolnjevanjeSpustniSeznamEditor,
.mqzap .mqTitle div[id="questionZapTxt"] .zapolnjevanjeVnosnoPoljeEditor,
.mqzap .mqTitle div[id="questionZapTxt"] .zapolnjevanjeSpustniSeznamEditor {
  font-weight: bold;
  border: 1px solid #999999;
  padding: 0 0.25em;
}
#pregledOdgovorov .mqzap .mqTitle {
  margin-bottom: 1.5em;
}
#tblZapolnjevanje {
  width: auto;
  margin-bottom: 1em;
}
#tblZapolnjevanje td {
  vertical-align: middle;
}
#tblZapolnjevanje .zapolnjevanjeTekst {
  width: 400px;
  margin-right: 1em;
}
#tblZapolnjevanje .btnDeleteSmall {
  margin-right: 1em;
}
/*maksimalna sirina MV na ozjem atomu; sama slika je lahko max 668px*/

#otp .imageQuestion,
#otn .imageQuestion {
  position: relative;
  background-repeat: no-repeat;
  background-size: contain;
  width: 634px;
}
#otEditFormContent {
  min-width: min-content;
}
#otn .imageQuestion {
  width: 500px;
  float: left;
}
#otn .fieldLables {
  width: 200px;
  float: left;
  margin-left: 10px;
}
.otError {
  float: left;
  width: 60%;
}
.otError p {
  display: none;
}
#otp .field,
#otn .field {
  position: absolute;
  height: 100px;
  width: 100px;
  top: 0;
  left: 0;
  background-color: green;
  border: 1px dashed white;
  opacity: 0.3;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
  color: white;
  cursor: move;
}
#otp .field.active,
#otn .field.active {
  opacity: 0.5;
}
#otp .fieldHandleA,
#otp .fieldHandleB,
#otn .fieldHandleA,
#otn .fieldHandleB {
  position: absolute;
  height: 10px;
  width: 10px;
  background-color: white;
  cursor: nw-resize;
  z-index: 10000;
}
.otnLabel {
  padding-bottom: 0.5em;
}
.otnLabel .otnPin {
  width: 30px;
  height: 30px;
  padding-top: 10px;
  background: url(/statika/style/baseImg/otpRetinaSprite.png) no-repeat;
  background-position: 0 -45px;
  background-size: 162.5px 90px;
  color: white;
  text-align: center;
  float: left;
  margin-right: 5px;
}
.otnLabel .otnInput {
  width: 130px;
  float: left;
  margin-right: 5px;
}
.otnLabel .inpTextarea {
  width: 100%;
  font-size: 1.16667em;
  height: 3em;
}
.otnLabel .otnDeleteField {
  float: right;
  width: 23px;
  height: 23px;
  cursor: pointer;
}
/*otp*/

.mqotp .mqContent table[name="w3"] tr td:first-child {
  padding-left: 1.33333em;
}
.mqotp .mqContent table[name="w3"] tr:last-child td:first-child {
  padding-bottom: 1.33333em;
  padding-left: 1.33333em;
}
.questionOtp.questionMain {
  width: auto;
  padding-bottom: 11px;
}
.questionOtp .questionContain {
  padding: 40px 0 4px;
}
.questionOtp .questionContain:after {
  content: '';
  display: block;
  clear: both;
}
.questionOtp .imageQuestion {
  position: relative;
  background-repeat: no-repeat;
  background-size: contain;
  width: 634px;
  border: 1px solid #d2d2d2;
}
.questionOtp .dragShadow,
.questionOtp .drag {
  width: 30px;
  height: 44px;
  background-position: top center;
  background: url(/statika/style/baseImg/otpRetinaSprite.png) no-repeat;
  background-size: 162.5px 90px;
  position: absolute;
}
/*orig retina sprite 325x180px*/

.questionOtp .dragShadow {
  background-position: -97.5px 0;
  z-index: 90/*900*/;
}
.questionOtp .drag {
  background-position: 0 0;
  z-index: 1000;
  cursor: move;
}
.answerDataCell .questionOtp .drag {
  background-position: 0 0;
  z-index: 91/*1000*/;
  cursor: default;
}
.questionOtp .drag.selected {
  background-position: -32.5px 0;
}
#pregledOdgovorov .questionOtp .drag {
  background-position: -130px 0;
  cursor: default;
}
/*default is incorrect*/

#pregledOdgovorov .questionOtp .drag.correct {
  background-position: 0 0;
}
.questionOtp .drag.ui-draggable-dragging {
  background-position: -65px 0;
}
.questionOtp .field,
.questionOtn .field {
  position: absolute;
  background-color: green;
  opacity: 0.3;
  border: 1px dashed white;
  color: white;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
}
/*otn*/

.mqotn .mqContent table[name="w3"] tr td:first-child {
  padding-left: 1.33333em;
}
.mqotn .mqContent table[name="w3"] tr:last-child td:first-child {
  padding-bottom: 1.33333em;
  padding-left: 1.33333em;
}
.mqotn .mqContent table[name="w4"] tr td:first-child {
  padding-left: 1.33333em;
}
.questionOtn.questionMain {
  width: auto;
  padding-bottom: 11px;
}
.questionOtn .questionContain {
  padding: 40px 0 4px;
}
.questionOtn .questionContain:after {
  content: '';
  display: block;
  clear: both;
}
.questionOtn .imageQuestion {
  position: relative;
  background-repeat: no-repeat;
  background-size: contain;
  width: 634px;
  border: 1px solid #d2d2d2;
}
.dragAnswerBox {
  min-height: 44px;
  margin-bottom: 10px;
}
.questionOtn .dragShadow,
.questionOtn .drag {
  width: 30px;
  height: 34px;
  padding-top: 10px;
  text-align: center;
  color: white;
  background: url(/statika/style/baseImg/otpRetinaSprite.png) no-repeat;
  background-size: 162.5px 90px;
  position: absolute;
}
/*orig retina sprite 325x180px*/

.questionOtn .dragShadow {
  z-index: 90/*900*/;
  background-position: -97.5px -45px;
}
.questionOtn .drag {
  z-index: 91/*1000*/;
  cursor: move;
  background-position: 0 -45px;
}
.questionOtn .drag.selected {
  background-position: -32.5px -45px;
}
#pregledOdgovorov .questionOtn .drag {
  background-position: -130px -45px;
  cursor: default;
}
/*default is incorrect*/

#pregledOdgovorov .questionOtn .drag.correct {
  background-position: 0 -45px;
}
.questionOtn .drag.ui-draggable-dragging {
  background-position: -65px -45px;
}
.mqotn .dragAnswerTxt {
  width: 125px;
  padding-left: 35px;
}
.mqotn .dragAnswerTxt p {
  margin-bottom: 0 !important;
}
/*cas ucenja in okno za neaktivnost*/

#inactivityDialog {
  text-align: center;
  min-width: auto !important;
}
#inactivityDialog::before {
  content: '';
  display: block;
  margin: 0 auto 10px auto;
  width: 342px;
  height: 229px;
  background: url(/statika/style/baseImg/sleeping_cat.png) no-repeat center center;
  max-width: 100%;
  background-size: contain;
}
#inactivityDialogBtns {
  display: flex;
  justify-content: center;
}
#honorCodeParent {
  background-color: #ff9900;
  color: white;
  padding: 20px;
  margin: 20px 0;
  border-radius: 10px;
}
.honorCodeHelp {
  margin-top: 20px;
}
.neweCampusFunctionality {
  display: none;
}
.testTopRight {
  margin-left: auto;
}
.finishTestBtnBox .inlineBtnBar {
  margin-bottom: 20px;
}
.testResultGraph {
  padding: 6px 0 25px 0;
}
.graphBox {
  width: 100%;
  max-width: 400px;
  height: 60px;
  float: left;
  position: relative;
  border: 1px solid transparent;
  margin: 0 1.5em 1.5em 0;
}
.graphBox.graphBoxWithOthers {
  height: 102px;
}
.graphBox.active {
  border: 1px solid #333333;
}
.graphValues {
  float: left;
  width: 40%;
}
.graphValue {
  float: left;
  font-size: 2.8em;
  line-height: 1em;
  padding-top: 12px;
  padding-right: 12px;
  font-weight: lighter;
}
.graphValue.positive,
.graphValueTxt.positive {
  color: #2dac1c;
}
.graphValue.negative,
.graphValueTxt.negative {
  color: red;
}
.graphValue.others {
  color: #fdba13;
  padding-top: 9px;
}
.graphValueTxt {
  width: 5.333em;
  float: left;
  padding-top: 14px;
  font-size: 1.25em;
  line-height: 1em;
  text-transform: uppercase;
}
#testDiamondBox {
  float: left;
  width: 25px;
  padding-top: 28px;
}
.graphAll {
  position: absolute;
  z-index: 10;
  width: 100%;
  height: 100%;
  background-color: #e6e6e6;
}
.graphTreshold {
  position: absolute;
  z-index: 20;
  height: 100%;
  background-color: silver;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.graphTreshold.active {
  border: 1px solid #333333;
}
.graphResult,
.graphResultOthers {
  position: absolute;
  z-index: 30;
  height: 24px;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.graphResult {
  top: 18px;
}
.graphResultOthers {
  top: 60px;
}
.graphResultOthers,
.colorOthers {
  background-color: #fdba13;
}
.graphResult.positive {
  background-color: #2dac1c;
}
.graphResult.negative {
  background-color: red;
}
.graphResult.active,
.graphResultOthers.active {
  border: 1px solid #333333;
}
.graphLegend {
  width: 400px;
}
.graphLegend .legendItem {
  padding-bottom: 5px;
  cursor: pointer;
  display: flex;
}
.legendBox {
  width: 18px;
  height: 18px;
  margin-right: 18px;
  box-sizing: border-box;
}
.graphLegend .legendItem.active .legendBox {
  border: 1px solid #333333;
}
.colorAll {
  background-color: #e6e6e6;
}
.colorTreshold {
  background-color: silver;
}
.colorResult.positive {
  background-color: #2dac1c;
}
.colorResult.negative {
  background-color: red;
}
.legendText {
  color: #999999;
  padding-top: 2px;
}
.graphLegend .legendItem.active .legendText {
  color: #333333;
}
.graphBox,
.graphTreshold,
.graphResult,
.legendBox {
  transition: border-color 300ms;
  -moz-transition: border-color 300ms;
  -webkit-transition: border-color 300ms;
  -o-transition: border-color 300ms;
}
.legendText {
  transition: color 300ms;
  -moz-transition: color 300ms;
  -webkit-transition: color 300ms;
  -o-transition: color 300ms;
}
#honorCodeAgree {
  margin-right: 10px;
  position: relative;
  top: 1px;
}
.testErrorInfo {
  margin-bottom: 20px;
}
/* #endregion */

/* #region AdGallery - TO DO nove font ikone */

.ad-gallery {
  width: 90%;
  margin: 0 auto;
}
.atomshow .ad-gallery ul,
#atomshowMain .ad-gallery ul {
  margin: 0;
  padding: 0;
  line-height: normal;
}
.atomshow .ad-gallery li,
#atomshowMain .ad-gallery li {
  margin: 0;
  line-height: 0;
  list-style-type: none;
  list-style-image: none;
}
.ad-gallery .ad-thumbs li a:link,
.ad-gallery .ad-thumbs li a:visited,
.ad-gallery .ad-thumbs li a:hover,
.ad-gallery .ad-thumbs li a:active {
  text-decoration: none;
}
.ad-image-wrapper-screen {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: #333333;
  opacity: 0.5;
  z-index: 1010;
}
.ad-gallery .ad-image-wrapper {
  height: 670px;
  width: 830px;
  margin-bottom: 10px;
  position: fixed;
  top: 100px;
  overflow: hidden;
  background-color: white;
  border: 1px solid #444444;
  z-index: 1015;
}
.ad-gallery .ad-image-wrapper .ad-loader {
  position: absolute;
  z-index: 1020;
  top: 48%;
  left: 48%;
  border: 1px solid #cccccc;
}
.ad-gallery .ad-image-wrapper .ad-next,
.ad-gallery .ad-image-wrapper .ad-prev {
  position: absolute;
  top: 0;
  width: 45%;
  height: 100%;
  cursor: pointer;
  display: block;
  z-index: 1030;
}
.ad-gallery .ad-image-wrapper .ad-next {
  right: 0;
}
.ad-gallery .ad-image-wrapper .ad-prev {
  left: 0;
}
.ad-gallery .ad-image-wrapper .ad-prev,
.ad-gallery .ad-image-wrapper .ad-next {
  background: url(/statika/style/non-existing.jpg)/* Or else IE will hide it */;
}
.ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image,
.ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
  background: url(/statika/AdGallery/gallery_icons.gif) 0 0 no-repeat;
  width: 30px;
  height: 30px;
  display: none;
  position: absolute;
  top: 47%;
  z-index: 101;
}
.ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image {
  background-position: 0 0;
  left: 15px;
}
.ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
  background-position: 0 -30px;
  right: 15px;
  left: auto;
}
.ad-gallery .ad-image-wrapper .ad-image {
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  z-index: 1020;
}
.ad-gallery .ad-image-wrapper .ad-image .ad-image-description {
  padding: 7px 0;
  text-align: left;
  width: 100%;
  z-index: 1035;
  background-color: white;
  color: #666666;
  margin-bottom: 0;
}
.ad-gallery .ad-image-wrapper .ad-image .ad-image-description .ad-description-title {
  color: #666666;
}
.ad-gallery .ad-controls {
  height: 0;
}
.ad-gallery .ad-info {
  color: #999999;
  display: block;
}
.ad-gallery .ad-info {
  margin: 0;
  padding: 0;
}
.ad-gallery .ad-slideshow-controls {
  float: right;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-start,
.ad-gallery .ad-slideshow-controls .ad-slideshow-stop {
  padding-left: 5px;
  cursor: pointer;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-countdown {
  padding-left: 5px;
  font-size: 0.9em;
}
.ad-gallery .ad-slideshow-running .ad-slideshow-start {
  cursor: default;
  font-style: italic;
}
.ad-gallery .ad-nav {
  width: 100%;
  position: relative;
}
.ad-gallery .ad-forward,
.ad-gallery .ad-back {
  position: absolute;
  top: 0;
  height: 65px;
  z-index: 10;
}
.ad-gallery .ad-back {
  cursor: pointer;
  left: -20px;
  width: 13px;
  display: block;
  background: url(/statika/AdGallery/gallery_icons.gif) 0 -73px no-repeat;
}
.ad-gallery .ad-back:hover {
  background: url(/statika/AdGallery/gallery_icons.gif) 0 -138px no-repeat;
}
.ad-gallery .ad-forward {
  cursor: pointer;
  display: block;
  right: -20px;
  width: 13px;
  background: url(/statika/AdGallery/gallery_icons.gif) 0 -203px no-repeat;
}
.ad-gallery .ad-forward:hover {
  background: url(/statika/AdGallery/gallery_icons.gif) 0 -268px no-repeat;
}
.ad-gallery .ad-nav .ad-thumbs {
  overflow: hidden;
  width: 100%;
}
.ad-gallery .ad-thumbs .ad-thumb-list {
  float: left;
  width: 9000px;
  list-style: none;
  margin-left: 0;
}
.ad-gallery .ad-thumbs li {
  float: left;
  padding: 0 5px 0 0;
}
.ad-gallery .ad-thumbs li a {
  display: block;
}
.ad-gallery .ad-thumbs li a img {
  display: block;
  height: 100px !important;
  width: auto !important;
  border: 1px solid #d2d2d2;
}
/*important: da ne povozimo na naslovnici eucilnice*/

/* Can't do display none, since Opera won't load the images then */

.ad-preloads {
  position: absolute;
  left: -9000px;
  top: -9000px;
}
.ad-gallery .close {
  border-style: none;
  background: transparent url(/statika/AdGallery/fancy_closebox.png) repeat scroll 0 0;
  cursor: pointer;
  height: 13px;
  position: absolute;
  right: 15px;
  top: 622px;
  width: 13px;
  z-index: 1030;
}
/* #endregion */

/* #region slovar in dodatna razlaga */

.dictionaryPopupTrigger {
  position: relative;
  cursor: pointer;
  background: yellow;
}
.dictionaryPopup {
  position: absolute;
  z-index: 1000;
  top: 25px;
  left: 0;
  padding: 5px;
  min-width: 200px;
  display: none;
  background-color: #00b0f0;
  color: white;
}
.dictionaryPopupTrigger:hover .dictionaryPopup {
  display: block;
}
.explanationTrigger {
  display: inline-block;
  vertical-align: bottom;
  margin-left: 5px;
  cursor: pointer;
  background-color: #00b0f0;
  color: white;
  line-height: 18px;
}
.explanationTrigger::before {
  content: "add";
  font-size: 18px;
}
.explanation {
  display: none;
  padding: 0;
  padding-left: 0px;
  padding-left: 5px;
  color: #00b0f0;
}
.link_block {
  text-decoration: underline;
  cursor: pointer;
  color: #00b0f0;
}
.link_block:hover {
  color: #0092c7;
}
/* #endregion */

/* #region prettyphoto */

div.pp_default .pp_top,
div.pp_default .pp_top .pp_middle,
div.pp_default .pp_top .pp_left,
div.pp_default .pp_top .pp_right,
div.pp_default .pp_bottom,
div.pp_default .pp_bottom .pp_left,
div.pp_default .pp_bottom .pp_middle,
div.pp_default .pp_bottom .pp_right {
  height: 13px;
}
div.pp_default .pp_top .pp_left {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) -78px -93px no-repeat;
}
div.pp_default .pp_top .pp_middle {
  background: url(/statika/style/baseImg/prettyphoto/sprite_x.png) top left repeat-x;
}
div.pp_default .pp_top .pp_right {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) -112px -93px no-repeat;
}
div.pp_default .pp_content .ppt {
  color: #f8f8f8;
}
div.pp_default .pp_content_container .pp_left {
  background: url(/statika/style/baseImg/prettyphoto/sprite_y.png) -7px 0 repeat-y;
  padding-left: 13px;
}
div.pp_default .pp_content_container .pp_right {
  background: url(/statika/style/baseImg/prettyphoto/sprite_y.png) top right repeat-y;
  padding-right: 13px;
}
div.pp_default .pp_next:hover {
  background: url(/statika/style/baseImg/prettyphoto/sprite_next.png) center right no-repeat;
  cursor: pointer;
}
div.pp_default .pp_previous:hover {
  background: url(/statika/style/baseImg/prettyphoto/sprite_prev.png) center left no-repeat;
  cursor: pointer;
}
div.pp_default .pp_expand {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) 0 -29px no-repeat;
  cursor: pointer;
  width: 28px;
  height: 28px;
}
div.pp_default .pp_expand:hover {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) 0 -56px no-repeat;
  cursor: pointer;
}
div.pp_default .pp_contract {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) 0 -84px no-repeat;
  cursor: pointer;
  width: 28px;
  height: 28px;
}
div.pp_default .pp_contract:hover {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) 0 -113px no-repeat;
  cursor: pointer;
}
div.pp_default .pp_close {
  width: 30px;
  height: 30px;
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) 2px 1px no-repeat;
  cursor: pointer;
}
div.pp_default .pp_gallery ul li a {
  background: url(/statika/style/baseImg/prettyphoto/default_thumb.png) center center #f8f8f8;
  border: 1px solid #aaaaaa;
}
div.pp_default .pp_social {
  margin-top: 7px;
}
div.pp_default .pp_gallery a.pp_arrow_previous,
div.pp_default .pp_gallery a.pp_arrow_next {
  position: static;
  left: auto;
}
div.pp_default .pp_nav .pp_play,
div.pp_default .pp_nav .pp_pause {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) -51px 1px no-repeat;
  height: 30px;
  width: 30px;
}
div.pp_default .pp_nav .pp_pause {
  background-position: -51px -29px;
}
div.pp_default a.pp_arrow_previous,
div.pp_default a.pp_arrow_next {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) -31px -3px no-repeat;
  height: 20px;
  width: 20px;
  margin: 4px 0 0;
}
div.pp_default a.pp_arrow_next {
  left: 52px;
  background-position: -82px -3px;
}
div.pp_default .pp_content_container .pp_details {
  margin-top: 5px;
}
div.pp_default .pp_nav {
  clear: none;
  height: 30px;
  width: 110px;
  position: relative;
}
div.pp_default .pp_nav .currentTextHolder {
  font-family: Georgia;
  font-style: italic;
  color: #999999;
  font-size: 11px;
  left: 75px;
  line-height: 25px;
  position: absolute;
  top: 2px;
  margin: 0;
  padding: 0 0 0 10px;
}
div.pp_default .pp_close:hover,
div.pp_default .pp_nav .pp_play:hover,
div.pp_default .pp_nav .pp_pause:hover,
div.pp_default .pp_arrow_next:hover,
div.pp_default .pp_arrow_previous:hover {
  opacity: 0.7;
}
div.pp_default .pp_description {
  font-size: 11px;
  font-weight: 700;
  line-height: 14px;
  margin: 5px 50px 5px 0;
}
div.pp_default .pp_bottom .pp_left {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) -78px -127px no-repeat;
}
div.pp_default .pp_bottom .pp_middle {
  background: url(/statika/style/baseImg/prettyphoto/sprite_x.png) bottom left repeat-x;
}
div.pp_default .pp_bottom .pp_right {
  background: url(/statika/style/baseImg/prettyphoto/sprite.png) -112px -127px no-repeat;
}
div.pp_default .pp_loaderIcon {
  background: url(/statika/style/baseImg/prettyphoto/loader.gif) center center no-repeat;
}
div.pp_pic_holder a:focus {
  outline: none;
}
div.pp_overlay {
  background: black;
  display: none;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 9500;
}
div.pp_pic_holder {
  display: none;
  position: absolute;
  width: 100px;
  z-index: 10000;
}
.pp_content {
  height: 40px;
  min-width: 40px;
}
* html .pp_content {
  width: 40px;
}
.pp_content_container {
  position: relative;
  text-align: left;
  width: 100%;
}
.pp_content_container .pp_left {
  padding-left: 20px;
}
.pp_content_container .pp_right {
  padding-right: 20px;
}
.pp_content_container .pp_details {
  float: left;
  margin: 10px 0 2px;
}
.pp_description {
  display: none;
  margin: 0;
}
.pp_social {
  float: left;
  margin: 0;
}
.pp_social .facebook {
  float: left;
  margin-left: 5px;
  width: 55px;
  overflow: hidden;
}
.pp_social .twitter {
  float: left;
}
.pp_nav {
  clear: right;
  float: left;
  margin: 3px 10px 0 0;
}
.pp_nav p {
  float: left;
  white-space: nowrap;
  margin: 2px 4px;
}
.pp_nav .pp_play,
.pp_nav .pp_pause {
  float: left;
  margin-right: 4px;
  text-indent: -10000px;
}
a.pp_arrow_previous,
a.pp_arrow_next {
  display: block;
  float: left;
  height: 15px;
  margin-top: 3px;
  overflow: hidden;
  text-indent: -10000px;
  width: 14px;
}
.pp_hoverContainer {
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 2000;
}
.pp_gallery {
  display: none;
  left: 50%;
  margin-top: -50px;
  position: absolute;
  z-index: 10000;
}
.pp_gallery div {
  float: left;
  overflow: hidden;
  position: relative;
}
.pp_gallery ul {
  float: left;
  height: 35px;
  position: relative;
  white-space: nowrap;
  margin: 0 0 0 5px;
  padding: 0;
}
.pp_gallery ul a {
  border: 1px rgba(0, 0, 0, 0.5) solid;
  display: block;
  float: left;
  height: 33px;
  overflow: hidden;
}
.pp_gallery ul a img {
  border: 0;
}
.pp_gallery li {
  display: block;
  float: left;
  margin: 0 5px 0 0;
  padding: 0;
}
.pp_gallery li.default a {
  background: url(/statika/style/baseImg/prettyphoto/default_thumbnail.gif) 0 0 no-repeat;
  display: block;
  height: 33px;
  width: 50px;
}
.pp_gallery .pp_arrow_previous,
.pp_gallery .pp_arrow_next {
  margin-top: 7px !important;
}
a.pp_next {
  background: url(/statika/style/baseImg/prettyphoto/btnNext.png) 10000px 10000px no-repeat;
  display: block;
  float: right;
  height: 100%;
  text-indent: -10000px;
  width: 49%;
}
a.pp_previous {
  background: url(/statika/style/baseImg/prettyphoto/btnNext.png) 10000px 10000px no-repeat;
  display: block;
  float: left;
  height: 100%;
  text-indent: -10000px;
  width: 49%;
}
a.pp_expand,
a.pp_contract {
  cursor: pointer;
  display: none;
  height: 20px;
  position: absolute;
  right: 30px;
  text-indent: -10000px;
  top: 10px;
  width: 20px;
  z-index: 20000;
}
a.pp_close {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  line-height: 22px;
  text-indent: -10000px;
}
.pp_loaderIcon {
  display: block;
  height: 24px;
  left: 50%;
  position: absolute;
  top: 50%;
  width: 24px;
  margin: -12px 0 0 -12px;
}
#pp_full_res {
  line-height: 1 !important;
}
#pp_full_res .pp_inline {
  text-align: left;
}
#pp_full_res .pp_inline p {
  margin: 0 0 15px;
}
div.ppt {
  color: white;
  display: none;
  font-size: 17px;
  z-index: 9999;
  margin: 0 0 5px 15px;
}
div.pp_default .pp_content {
  background-color: white;
}
div.pp_default #pp_full_res .pp_inline {
  color: black;
}
div.pp_default .pp_gallery ul li a:hover,
div.pp_default .pp_gallery ul li.selected a,
.pp_gallery ul a:hover,
.pp_gallery li.selected a {
  border-color: white;
}
div.pp_default .pp_details {
  position: relative;
}
.pp_top,
.pp_bottom {
  height: 20px;
  position: relative;
}
* html .pp_top,
* html .pp_bottom {
  padding: 0 20px;
}
.pp_top .pp_left,
.pp_bottom .pp_left {
  height: 20px;
  left: 0;
  position: absolute;
  width: 20px;
}
.pp_top .pp_middle,
.pp_bottom .pp_middle {
  height: 20px;
  left: 20px;
  position: absolute;
  right: 20px;
}
* html .pp_top .pp_middle,
* html .pp_bottom .pp_middle {
  left: 0;
  position: static;
}
.pp_top .pp_right,
.pp_bottom .pp_right {
  height: 20px;
  left: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 20px;
}
.pp_fade,
.pp_gallery li.default a img {
  display: none;
}
/* #endregion */

/* #region BI pregledi*/

/*genericne barve*/

.biGraphLegend .legendItem {
  margin-bottom: 10px;
  cursor: pointer;
  position: relative;
  padding-left: 1.5em;
}
.biGraphLegend .legendSquare {
  position: absolute;
  top: 0.3em;
  left: 0;
  width: 0.5em;
  height: 0.5em;
  border: 1px solid white;
  border-radius: 5px;
}
.biGraphLegend .legendLbl {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 20px;
}
.itemFailed .procentPredelano,
.hrmStatBar.barFailed,
.mentorStatItemColumn.itemFailed,
.mentorStatBar.itemFailed,
.legend0 .legendSquare {
  background-color: red;
}
.itemFailed .divPredelano,
.hrmStatItemTableColumnParent {
  border: 1px solid red;
}
.doughnutGraph path.segmentColor0 {
  fill: red;
}
.biStatus0 {
  color: red;
}
.itemActive .procentPredelano,
.hrmStatBar.barActive,
.mentorStatItemColumn.itemActive,
.mentorStatBar.itemActive,
.legend1 .legendSquare {
  background-color: #ff9900;
}
.itemActive .divPredelano {
  border: 1px solid #ff9900;
}
.doughnutGraph path.segmentColor1 {
  fill: #ff9900;
}
.biStatus1 {
  color: #ff9900;
}
.itemCompleted .procentPredelano,
.hrmStatBar.barCompleted,
.mentorStatItemColumn.itemCompleted,
.mentorStatBar.itemCompleted,
.legend2 .legendSquare {
  background-color: #4cbd6b;
}
.itemCompleted .divPredelano {
  border: 1px solid #4cbd6b;
}
.doughnutGraph path.segmentColor2 {
  fill: #4cbd6b;
}
.biStatus2 {
  color: #4cbd6b;
}
.doughnutGraph path.segmentColorNoData {
  fill: transparent;
}
.biTabs {
  box-shadow: inset 0px -4px 0px 0px #dddddd;
  -webkit-box-shadow: inset 0px -4px 0px 0px #dddddd;
  -moz-box-shadow: inset 0px -4px 0px 0px #dddddd;
}
.tabStats {
  display: inline-block;
  width: 20%;
  padding: 1em;
  cursor: pointer;
  color: #7c7c7c;
  font-weight: lighter;
}
.tabStats.active {
  background-color: #f0f0f0;
  color: #333333;
  border-radius: 10px 10px 0 0;
}
.biStatistics .bigNum {
  font-size: 4em;
  line-height: 1em;
  padding-bottom: 0.19em;
  font-weight: lighter;
}
.biStatistics .smallerNum {
  font-size: 2em;
  font-weight: lighter;
  line-height: 1em;
}
.biStatistics .smallestNum {
  font-size: 1em;
  font-weight: lighter;
  text-transform: lowercase;
}
.biStatistics .bigNum .smallerNum {
  font-size: 0.5em;
}
.tabStats span {
  font-size: 1.5em;
  line-height: 1em;
}
#mentorDetailsDateFrom,
#mentorDetailsDateTo {
  width: 150px;
}
/*moj profil - statistika*/

.biStatistics .tabContent {
  background: #f0f0f0;
  padding: 10px;
  margin-bottom: 1.5em;
  display: none;
  border-radius: 0 0 10px 10px;
}
.biStatistics .tabContent.active {
  display: block;
}
.biStatistics .tabContent1,
.biStatistics .tabContent2,
.biStatistics .tabContent3 {
  display: inline-block;
  width: 33%;
}
.biStatistics .list {
  display: none;
}
.biStatistics .list.active {
  display: block;
}
.biStatistics .listItems {
  float: left;
  width: 50%;
  height: 500px;
  max-height: 500px;
  overflow: auto;
}
.biStatistics .listDetails {
  float: right;
  width: 50%;
}
.biStatistics .detailsScrollable {
  height: 452px;
  max-height: 452px;
  overflow: auto;
}
.biStatistics .mCSB_container {
  margin-right: 3em;
}
.biStatistics .mCS_no_scrollbar {
  margin-right: 0;
}
.biStatistics .listDetails .inlineBtnBar {
  text-align: right;
}
.biStatistics .list .profileStatItem {
  padding: 25px;
  margin-bottom: 10px;
  position: relative;
  background: #e4e4e4;
  border-radius: 10px;
}
.biStatistics .profileStatItem .divPredelano {
  float: none;
  margin-left: 10px;
}
.profileStatItem .statusLbl {
  padding: 3px 5px;
  color: white;
  border-radius: 5px;
}
.itemCompleted .statusLbl {
  background-color: #4cbd6b;
}
.itemActive .statusLbl {
  background-color: #ff9900;
}
.itemFailed .statusLbl {
  background-color: red;
}
.biStatistics .details {
  padding: 0 0 10px 25px;
  display: none;
}
.biStatistics .details table {
  width: 100%;
}
.biStatistics .details table th {
  text-align: left;
}
.biStatistics .list .details.active {
  display: block;
}
.biStatistics .profileStatItem .itemName {
  font-weight: bold;
  font-size: 1.3em;
  margin-bottom: 0.3em;
}
.biStatistics .profileStatItem .itemName a {
  color: black;
}
.biStatistics .itemData {
  width: 30%;
  padding-right: 20px;
  vertical-align: bottom;
}
.biStatistics .itemData .predelanoout {
  width: 100%;
}
.biStatistics .box {
  border: 1px solid #dddddd;
  margin-bottom: 1em;
}
.biStatistics .dataBar {
  height: 2em;
}
.biStatistics .dataBar.blue {
  background-color: #4db0dc;
}
.biStatistics .dataBar.red {
  background-color: #e75312;
}
.biStatistics button {
  padding: 1em;
}
.biStatistics .initial .procentPredelano {
  width: 0 !important;
}
/*zacetno stanje*/

.biStatistics .procentPredelano {
  transition: width 200ms ease-out;
  -moz-transition: width 200ms ease-out;
  -webkit-transition: width 200ms ease-out;
  -o-transition: width 200ms ease-out;
}
.biStatistics .divPredelano {
  background-color: white;
  width: 70%;
  height: 7px;
  font-size: 0;
  display: inline-block;
  border-radius: 5px;
}
.biStatistics .divPredelano .procentPredelano {
  height: 7px;
}
.biStatistics .predelanoTxt {
  padding-left: 5px;
  display: inline-block;
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.biStatistics .doughnutSummary {
  width: 130px;
  height: 130px;
  float: left;
  margin-left: 15px;
}
/*spremeniti v klaso*/

.doughnutGraph path,
.doughnutGraph circle {
  cursor: pointer;
}
.doughnutGraph path.segment {
  stroke: white;
}
.doughnutGraph circle.segmentReset {
  fill: white;
  stroke: #dddddd;
}
.doughnutGraph path.inactive,
.doughnutGraph circle.inactive {
  fill: #999999;
}
.biGraphLegend {
  width: 220px;
  float: left;
  margin: 25px 0 0 35px;
}
.biStatistics .legendOpacity {
  opacity: 0.2;
}
/*bi manager*/

#biRadioBtns {
  margin-bottom: 5px;
}
.biStatistics.biManager {
  position: relative;
}
.biStatistics .managerCircle {
  width: 40%;
  float: left;
}
.biStatistics .biSummaryNums {
  width: 29%;
  float: left;
  padding-top: 1em;
}
.biStatistics .listItem {
  padding: 1em;
  margin-bottom: 1em;
  cursor: pointer;
  border-radius: 10px;
}
.biStatistics .listItem::after {
  content: "";
  display: block;
  clear: both;
}
.biStatistics.biManager .listItem {
  margin-bottom: 0;
}
.biManager .statItemEl1 {
  width: 60%;
  float: left;
}
.biManager .statItemEl2,
.biManager .statItemEl3 {
  width: 20%;
  float: left;
}
.biStatistics .details {
  cursor: default;
}
.biStatistics .listItem:hover {
  background: #efefef;
}
.biStatistics .listItem.active {
  background-color: #dddddd;
}
.biStatistics .listItem .itemName {
  font-weight: bold;
  font-size: 1.3em;
  margin-bottom: 0.3em;
}
.biStatistics .listItem .itemName a {
  color: black;
}
.biStatistics .itemData {
  width: 30%;
  padding-right: 20px;
  vertical-align: bottom;
}
.biStatistics .itemDataManager {
  width: 30%;
}
.biStatistics .details table {
  width: 100%;
}
.biStatistics .details table th {
  text-align: left;
}
.biStatistics .listItem.active .details {
  display: block;
  background: #dddddd;
}
.biStatistics .managerRightSide {
  padding-bottom: 20px;
}
.biStatistics .managerRightSide h1 {
  font-size: 2em;
}
.biStatistics .personNumberTop {
  padding-bottom: 0.5em;
}
.biStatistics #biViewControls .inlineBtn:not(.active) {
  background-color: silver;
  color: #333333;
  opacity: 0.4;
}
#biViewControls {
  position: absolute;
  top: 0.667em;
  right: 0;
  text-align: right;
  width: 550px;
}
#biViewControls .inlineBtn {
  display: block;
  float: right;
  margin: 0.8em 0;
}
#biViewControls .inlineBtn.active {
  width: 100px;
}
.managerModes {
  padding-top: 5px;
}
#ClassroomsAll + label {
  margin-right: 25px;
}
#subordinateAll + label {
  margin-right: 0;
}
#biViewControls .lblManagerModes {
  vertical-align: middle;
  padding-right: 0.75em;
}
/*skrijemo vsebino za summary */

.biStatistics #target.biSimpleView .tabContent {
  display: none;
}
.biStatistics #target.biSimpleView #tabs {
  margin-bottom: 1.5em;
}
.biStatistics #target.biSimpleView .biTabs {
  box-shadow: none;
  border-bottom: 4px solid #dddddd;
}
/*skrijemo drugi zavihek*/

.biStatistics #target.biViewEContentTab .tabStats + .tabStats {
  display: none;
}
/* #endregion */

/* #region hrm*/

.hrmStatItemTable {
  color: #333333;
  background: #f0f0f0;
  margin-bottom: 15px;
  border-radius: 10px;
}
.hrmStatItemTable table {
  width: 100%;
}
.hrmStatItemTable td {
  vertical-align: middle;
  padding: 10px;
}
.hrmStatItemTable .cell1 {
  width: 5%;
  padding-right: 0;
  vertical-align: top;
}
.hrmStatItemTable .cell2 {
  width: 40%;
}
.hrmStatItemTable .cell4 {
  width: 15%;
}
.hrmStatItem .itemName {
  font-size: 1.3em;
  margin-bottom: 0.3em;
}
.hrmStatItemTable .itemName {
  font-size: 1.1em;
  margin-bottom: 0.3em;
}
.hrmStatItemTable .itemDate,
hrmStatItemTable .itemHead,
.hrmStatItem .itemHead {
  font-size: 0.9em;
  font-weight: normal;
}
.hrmStatItem .itemName,
.hrmStatItemTable .itemName {
  font-weight: bold;
}
.hrmStatItemTable .hrmStatBar,
.mentorStatBar {
  font-size: 0.7em;
  float: left;
  height: 100%;
  position: relative;
}
.hrmStatItemTable div.hrmStatBar:nth-child(2),
div.mentorStatBar:nth-child(2) {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.hrmStatItemTable .hrmStatBar:last-of-type,
.mentorStatBar:last-of-type {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.hrmStatItemTable .hrmStatBar div,
.mentorStatBar div {
  color: white;
  position: absolute;
  z-index: 100;
  text-align: center;
  width: 100%;
  top: 3px;
}
.biStatistics .initial .tableViewStat {
  width: 0 !important;
}
.biStatistics .tableViewStat {
  width: 100%;
  transition: width 200ms ease-out;
  -moz-transition: width 200ms ease-out;
  -webkit-transition: width 200ms ease-out;
  -o-transition: width 200ms ease-out;
}
.biStatistics .hoverDataContainer {
  position: absolute;
  z-index: 10000;
  border: 1px solid #1ba0e1;
  background-color: white;
  font-size: 0.8em;
  padding: 0.4em;
  width: 180px;
  display: none;
  border-radius: 10px;
}
.hrmStatItemTable .hoverDataContainer,
.mentorStatItemTable .hoverDataContainer {
  top: -10px;
  left: -190px;
}
.biStatistics .hoverDataContainer .name {
  font-size: 1.5em;
  margin-bottom: 1em;
  font-weight: bold;
}
.biStatistics .hoverDataContainer p {
  margin: 0.1em;
}
/*mentorstvo ucilnica*/

.mentorViewBtns {
  text-align: right;
}
.mentorViewBtns .inlineBtnBar {
  text-align: right;
  justify-content: flex-end;
}
.mentorViewBtns .inlineBtnBar .inlineBtn {
  margin-top: 0.8em;
  margin-right: 0;
  margin-left: 0.8em;
}
.mentorViewBtns .inlineBtn:not(.active) {
  background-color: silver;
  color: #333333;
  opacity: 0.4;
}
.mentorSummary {
  position: relative;
  padding-bottom: 30px;
}
.mentorCircle {
  float: left;
  width: 38%;
}
#mentorSummaryData {
  float: right;
  width: 60%;
  height: 370px;
  padding: 0;
  overflow: hidden;
  position: relative;
}
#mentorGradivaTable,
#mentorOddelkiTable {
  height: 372px;
  max-height: 372px;
  overflow-y: auto;
}
#mentorstvo .listContent .mCSB_container {
  margin-right: 2em;
}
#mentorstvo .listContent .mCSB_container.mCS_no_scrollbar {
  margin-right: 0;
}
#mentorstvo .listContainer {
  position: absolute;
  width: 100%;
  height: 100%;
}
#mentorstvo .listContainerSelector {
  position: absolute;
  bottom: 3px;
  width: 100%;
}
#mentorstvo .listContainerSelector .singleSelector {
  width: 13px;
  height: 13px;
  float: left;
  margin: 4px;
  cursor: pointer;
  background-position: 0 -5825px;
}
#mentorstvo .listContainerSelector .singleSelector:not(.active) {
  background-position: 0 -5870px;
}
#mentorstvo .listContainerSelector .singleSelector:not(.active):hover {
  background-position: 0 -5825px;
}
.mentorStatItem {
  margin-bottom: 2%;
  width: 49%;
  float: left;
}
.mentorStatItem .statGraph {
  padding: 1.5em;
  background: white;
  border: 1px solid #f0f0f0;
  cursor: pointer;
}
.mentorStatItem .itemHead {
  background-color: #f0f0f0;
  padding: 5px;
}
.mentorStatItem.floatR {
  float: right;
}
.statItemType100 .statItemParent {
  position: relative;
  padding-left: 30px;
}
.statItemType100 .statItemArrow {
  position: absolute;
  height: 100%;
  width: 30px;
  left: 0;
  cursor: pointer;
}
.statItemArrow::before {
  content: "keyboard_arrow_down";
}
.opened .statItemArrow::before {
  content: "keyboard_arrow_up";
}
.statItemType100 .statItemChildren {
  padding-left: 60px;
  margin-top: 15px;
}
.listContainer a:nth-child(odd) .mentorStatItem {
  margin-right: 2%;
}
.mentorStatItem .details {
  cursor: default;
}
.mentorStatItem:hover {
  background: #efefef;
}
#mentorOddelki .statGraph {
  padding: 0.5em 1em;
}
.mentorStatItemColumnParent {
  position: relative;
  width: 25%;
  margin: 0 4%;
}
.mentorStatItem,
.mentorStatItemTable {
  color: black;
}
.mentorStatItemTable {
  background: #f0f0f0;
  margin-bottom: 15px;
  cursor: pointer;
  border-radius: 10px;
}
.mentorStatItemTable td {
  vertical-align: middle;
  padding: 10px;
}
.mentorStatItem .itemName {
  font-size: 1.3em;
  line-height: 1.5em;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mentorStatItemTable .itemName {
  margin-bottom: 0.3em;
}
.mentorStatItemTable .itemDate,
mentorStatItemTable .itemHead,
.mentorStatItem .itemHead {
  font-size: 0.9em;
  font-weight: normal;
}
.mentorStatItem .itemName,
.mentorStatItemTable .itemName {
  font-family: 'Segoe UI Semibold', Helvetica, Arial, sans-serif;
}
.mentorStatItemColumn {
  width: 100%;
  margin: 0 auto;
  float: left;
  position: absolute;
  bottom: 0;
}
#mentorstvo .mentorSend {
  position: absolute;
  bottom: 0;
  left: 0;
}
#mentorSendMsg {
  margin: 0;
}
#target.initial .procentPredelano,
#target.initial .mentorStatBar {
  width: 0 !important;
}
#target .procentPredelano,
#target .mentorStatBar {
  transition: width 200ms ease-out;
  -moz-transition: width 200ms ease-out;
  -webkit-transition: width 200ms ease-out;
  -o-transition: width 200ms ease-out;
}
#target.initial .mentorStatItemColumn {
  height: 0 !important;
}
#target .mentorStatItemColumn {
  transition: height 200ms ease-out;
  -moz-transition: height 200ms ease-out;
  -webkit-transition: height 200ms ease-out;
  -o-transition: height 200ms ease-out;
}
#targetCircleCourses {
  float: left;
  width: 49%;
}
#targetCircleCoursesEach,
#targetCircleContentsEach {
  width: 50px;
  height: 50px;
  float: left;
}
#mentorLegendBox {
  display: table-cell;
  vertical-align: middle;
  width: 170px;
}
#mentorLegendBox .biGraphLegend {
  margin-left: 0;
  width: auto;
}
/*mehurcki*/

.graphListBox {
  padding: 1em;
  background-color: #f0f0f0;
  margin-bottom: 1.5em;
  border-radius: 10px;
}
.graphListBox:after {
  content: '';
  display: block;
  clear: both;
}
#mentorstvo #svgBox {
  float: left;
  width: 60%;
  position: relative;
}
.bubblesGraph #svgBoxA {
  width: 45px;
  height: 358px/*348px + 5 + 5*/;
  position: absolute;
}
.bubblesGraph #svgBoxB {
  margin-left: 45px;
  margin-right: 10px;
  margin-top: 5px;
  height: 348px;
  background-color: white;
  /*border:1px solid #ccc;*/
  position: relative;
}
.bubblesGraph #svgBoxC {
  height: 50px;
  margin-left: 40px/*45-5*/;
}
#svgBox #graph,
#svgBox #barChart {
  overflow: hidden;
}
#mentorDetailsTop {
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #dddddd;
}
#mentorDetailsTopDates {
  float: left;
  margin-top: 15px;
}
/*crtni graf*/

.chartGraph #svgBoxA {
  width: 80px;
  height: 348px/*348px + 5 + 5*/;
  position: absolute;
}
.chartGraph #svgBoxB {
  margin-left: 80px;
  margin-right: 10px;
  height: 348px;
  background-color: white;
  /*border:1px solid #ccc;*/
  position: relative;
}
.chartGraph #svgBoxC {
  height: 50px;
  margin-left: 75px/*45-5*/;
}
#listBoxParent {
  width: 37%;
  height: 400px;
  float: right;
  position: relative;
}
#biMentorListBox {
  overflow: auto;
  height: 345px;
  margin-top: 5px;
}
#biMentorListBox .person {
  width: 32%;
  padding: 3px;
  margin: 0 1% 1% 0;
  border: 1px solid #d2d2d2;
  background: white;
  float: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: default;
  box-sizing: border-box;
}
#biMentorListBox .person.selected {
  background: #00b0f0;
  color: white;
}
#listBox {
  overflow: auto;
  height: 345px;
  margin-top: 5px;
}
#listBox:after {
  content: '';
  display: block;
  clear: both;
}
#listBox .person {
  width: 32%;
  padding: 5px;
  margin: 0 1% 1% 0;
  border: 1px solid #cccccc;
  border-radius: 10px;
  background: white;
  float: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
#listBox .person.selected {
  background: #00b0f0;
  color: white;
}
#mentorstvo circle.selected,
#mentorstvo rect.selected {
  fill: #52b9e9;
}
#mentorstvo .cellA {
  width: 5%;
}
#mentorstvo .cellB {
  width: 10%;
}
#mentorstvo .cellC {
  width: 13%;
}
#bubblesBtns {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
}
#bubblesBtns .resetBtn {
  float: left;
}
#bubblesBtns #bubbleSendMsg {
  float: right;
}
#dataTable .divPredelano {
  width: 70%;
}
/* #endregion*/

/* #region forumi */

.forums .tabs {
  display: flex;
  align-items: center;
}
.forums #column1 .forum .tileData::before {
  content: "forum";
}
.forums .detailsHeader .detailsAdditional1,
.forums .detailsHeader .detailsAdditional2 {
  display: block;
  margin-bottom: 20px;
}
#column1 .theme .tileData::before,
#column2 .theme .tileContent::before {
  content: "chat";
}
.themeList .icon,
.themeList .tileProgress {
  display: none;
}
/*zacasno*/

#column1 .forums .tileNum .tileNum1 {
  display: block;
  height: 15px;
}
.forums .tileNum .tileNum1.new {
  background-position: right -3305px;
}
.forums .tileNum .tileNum2 {
  display: block;
}
.listDetails #column2 .detailsHeader {
  position: relative;
}
#column2 .forumHeader .detailsHeader {
  position: static;
  padding-bottom: 0 !important;
}
.detailsHeader .detailsAdditional {
  position: absolute;
  bottom: 0;
  font-weight: lighter;
}
.forums .detailsHeader .detailsAdditional {
  position: static;
  font-weight: normal;
}
.ecourses .detailsHeader .detailsAdditional {
  position: static;
  font-weight: normal;
}
.detailsAdditional .detailsAdditional1,
.detailsAdditional .detailsAdditional2 {
  display: block;
}
.forums .detailsHeader .detailsAdditional1,
.forums .detailsHeader .detailsAdditional2 {
  font-size: 1.167em;
}
.forums .detailsHeader .forumNoThemes {
  font-weight: bold;
}
.forumCommandBtns .inlineBtn {
  margin-bottom: 0 !important;
}
.forumLastPost {
  margin-bottom: 20px;
  background-color: #f6f6f6;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
}
/*border gre v style;background je lahko pri vecini genericen*/

.forumLastPost .moreBar {
  display: none;
}
.ecourses .detailsAdditional .detailsAdditional1 {
  font-size: inherit;
  line-height: inherit;
}
.themes .tileContent .tileText {
  flex: 11;
}
.forums .themes {
  margin-bottom: 20px;
}
.forums .themes .tileNum {
  text-align: right;
  flex: 1;
  order: 3;
}
.forums group.themes .tileNumB {
  color: #8d8d8d;
}
.forums .themes .tileNumB {
  flex: 7;
  order: 2;
  color: white;
}
.themeList .tileText,
.themeList .tileContent .tileNum {
  float: none;
  width: auto;
}
.themeList .tileContent .tileNum {
  text-align: left;
}
.themeList .tileName {
  font-size: 2em;
  line-height: 1.33333em;
}
.themesGrid .authorName {
  font-style: italic;
  text-decoration: none;
}
.themeList .tileNum .tileNum1 {
  font-size: 1em;
  line-height: 1.33333em;
}
.themesGrid tr.gridPager,
.themesGrid tr.gridPager:hover,
.themesGrid tr.gridPager tr,
.themesGrid tr.gridPager tr:hover {
  background-color: transparent;
}
.themesGrid tr.gridPager > td {
  padding-top: 1.33333em;
}
.themesGrid tr.gridPager > td td {
  padding-left: 1.33333em;
}
/*
.tile.theme .icon {
    background-position: 0 -3348px
}
*/

.titleBtns {
  float: left;
  margin-right: 2em;
  padding-top: 5px;
}
.detailsSubTitle .moreBar {
  margin-bottom: 0;
  padding-top: 8px;
  padding-bottom: 0;
}
/*forumi teme in sporocila*/

.forumThemeHeader .detailsImg {
  display: none;
}
/*zacasno*/

.listDetails .forumThemeHeader .detailsHeaderData {
  float: none;
  padding-left: 0;
}
.detailsHeader h1 .tileHeader2 {
  font-size: 0.53333em;
}
.listDetails #column2 .forumThemeHeader .detailsHeader {
  height: auto;
}
.forumThemeHeader .detailsHeader .detailsAdditional {
  position: static;
  font-weight: normal;
}
.forumThemeHeader .detailsAdditional .detailsAdditional1,
.forumThemeHeader .detailsAdditional .detailsAdditional2 {
  font-size: 1em;
  line-height: 1.33333em;
}
table.themesGrid {
  width: 100%;
}
.themesGrid tr {
  cursor: default;
}
.forumPost {
  padding: 20px;
  display: flex;
  gap: 10px;
}
.forumPostList .forumPost {
  background-color: #f6f6f6;
  border: 1px solid #d2d2d2;
  border-radius: 10px;
  margin-bottom: 10px;
}
.lastPostInfo {
  padding: 20px 20px 0 20px;
}
.lastPostInfo a {
  font-weight: bold;
}
.lastPostInfo a:link,
.lastPostInfo a:visited {
  text-decoration: underline;
}
.lastPostInfo a:hover,
.lastPostInfo a:active {
  text-decoration: none;
}
.forumPost:after {
  content: '';
  display: block;
  clear: both;
}
.userImgCell {
  width: 50px;
  height: 50px;
}
.forumPostBody {
  flex: 10;
}
.postDataCell {
  vertical-align: top;
  padding-bottom: 10px;
}
.postDataCell > span {
  display: block;
}
.forumPostInfo {
  font-size: clamp(0.83rem, 1.06vw, 1rem);
  padding-bottom: 20px;
  color: #8d8d8d;
}
.forumPostInfo a:link,
.forumPostInfo a:visited {
  text-decoration: underline;
}
.forumPostInfo a:hover,
.forumPostInfo a:active {
  text-decoration: none;
}
.postActionsCell {
  padding: 0.5em 1.33333em 0.5em 0.5em;
  width: 25px;
  vertical-align: middle;
}
.userImgCell .userImg {
  width: 50px;
  height: 50px;
  border: 1px solid #d2d2d2;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
}
.userImgCell .userBlank::before {
  content: "person";
  font-size: 36px;
}
.postBtn {
  display: inline-block;
  cursor: pointer;
}
.themesGrid .postBtn {
  margin-right: 20px;
}
.footable .postBtn:first-child {
  margin-left: 0;
}
.postReply::before {
  content: "reply";
}
.postEdit::before {
  content: "edit";
}
.postDelete::before {
  content: "delete";
}
.postEcontents::before {
  content: "toc";
}
.postAlert::before {
  content: "notifications";
}
.postEcontents {
  width: 17px;
  height: 16px;
  background-position: right -7040px;
}
.postBlank {
  background-image: none !important;
}
.tablesort .postBtn,
.footable .postBtn,
.datalane .postBtn {
  margin-left: 10px;
}
.tablesort .postEdit,
.footable .postEdit {
  margin-bottom: 0;
}
.postLikeBtn.liked:after {
  display: inline-block;
  content: '';
  width: 13px;
  vertical-align: middle;
  height: 10px;
  background-position: right -6860px;
}
.forumPostList {
  position: relative;
  padding-bottom: 30px;
}
.forumPostsPager > span {
  display: block;
}
.forumThemesPager {
  margin-top: 20px;
}
.forumPostsPager {
  position: absolute;
  bottom: 0;
  width: 100%;
}
.forumThemesPager > span,
.forumPostsPager span {
  display: flex;
  gap: 20px;
  justify-content: center;
}
.forumPagerBtn {
  height: 25px;
  width: 25px;
}
span.forumPagerBtn {
  color: #b5b5b5;
}
a.forumPagerBtn {
  cursor: pointer;
}
span.forumPagerBtn {
  font-weight: bold;
}
.forumPagerBtn.first::before {
  content: "first_page";
}
.forumPagerBtn.prev::before {
  content: "keyboard_arrow_left";
}
.forumPagerBtn.next::before {
  content: "keyboard_arrow_right";
}
.forumPagerBtn.last::before {
  content: "last_page";
}
.forumPagerBtn.current,
a.forumPagerBtn.numeric {
  background-image: none;
  width: auto;
  padding: 0.2em 0.5em 0;
  height: auto;
  font-weight: bold;
  text-decoration: none;
  color: #333333;
}
a.forumPagerBtn:link,
a.forumPagerBtn:visited {
  opacity: 0.6;
}
.forumPagerBtn.current,
a.forumPagerBtn:hover,
a.forumPagerBtn:active {
  opacity: 1;
}
.themeSubject,
.postReplyBox {
  padding-bottom: 1em;
}
.newPostForm.new {
  margin-bottom: 1.33333em;
}
.newPostSeparator {
  background-color: #f0f0f0;
  border-bottom: 1px solid #f6f6f6;
  border-top: 1px solid #e5e5e5;
  height: 1px;
}
.newPostSeparator.typeTop {
  margin-bottom: 1.33333em;
}
.newPostSeparator.typeBottom {
  margin-top: 1.33333em;
}
.newPostForm.new .newPostSeparator.typeBottom {
  display: none;
}
.txtEditorSeparator {
  display: inline-block;
  background-color: #f0f0f0;
  border-right: 1px solid #f6f6f6;
  border-left: 1px solid #e5e5e5;
  height: 20px;
  width: 1px;
  margin: 0 0.5em;
}
.smallTxtEditorControls {
  padding-bottom: 10px;
  display: flex;
  justify-content: space-between;
}
.txtEditorBtns {
  height: 20px;
}
.postNotificationBox {
  text-align: right;
  margin-left: auto;
}
.txtEditorBtn,
.smiley {
  display: inline-block;
  margin-right: 0.5em;
  width: 20px;
  height: 20px;
  background: #c4ccce url(/statika/style/baseImg/smallTxtEditor.png) no-repeat;
  background-size: 20px 360px;
}
/*orig 40 x 720px*/

.smileyBox .txtEditorBtn {
  background-color: transparent;
}
.txtEditorBtn:hover {
  background-color: #a2a8aa;
}
.btnBold {
  background-position: center top;
}
.btnItalic {
  background-position: center -22.5px;
}
.btnUnderline {
  background-position: center -45px;
}
.btnLink {
  background-position: center -67.5px;
  position: relative;
}
.btnSmiley {
  background-color: transparent;
  background-position: center -112.5px;
  position: relative;
}
.smileyBox,
.hyperlinkForm,
.smallPopup {
  display: none;
  position: absolute;
  left: 0;
  bottom: 20px;
  width: 400px;
  padding: 1em;
  background-color: white;
  border: 1px solid #cccccc;
  box-shadow: 3px 3px 2px 1px #cccccc;
  -moz-box-shadow: 3px 3px 2px 1px #cccccc;
  -webkit-box-shadow: 3px 3px 2px 1px #cccccc;
}
.smallPopup h2 {
  margin-bottom: 0.5em;
}
.smallPopup .inlineBtnBar .inlineBtn {
  margin-bottom: 0;
}
.smiley {
  background-color: transparent;
  vertical-align: bottom;
}
/* [:)] */

.btnSmiley1,
.smiley.type1 {
  background-position: center -135px;
}
/* [:D] */

.btnSmiley2,
.smiley.type2 {
  background-position: center -157.5px;
}
/* [:|] */

.btnSmiley3,
.smiley.type3 {
  background-position: center -180px;
}
/* [:o] */

.btnSmiley4,
.smiley.type4 {
  background-position: center -202.5px;
}
/* [:(] */

.btnSmiley5,
.smiley.type5 {
  background-position: center -225px;
}
/*[:cry]*/

.btnSmiley6,
.smiley.type6 {
  background-position: center -247.5px;
}
/*[:blush}*/

.btnSmiley7,
.smiley.type7 {
  background-position: center -270px;
}
/*[:geek]*/

.btnSmiley8,
.smiley.type8 {
  background-position: center -292.5px;
}
/* [>:)] */

.btnSmiley9,
.smiley.type9 {
  background-position: center -315px;
}
/* [;)] */

.btnSmiley10,
.smiley.type10 {
  background-position: center -337.5px;
}
.smallTxtEditor .inpTextarea {
  width: 100%;
  font-size: 1.167em;
  height: 6em;
  resize: vertical;
}
.newPostBottomControls {
  padding-top: 1em;
}
.newPostAttachement {
  float: left;
  width: 60%;
}
.newPostBottomControls .inlineBtnBar {
  float: right;
  width: 35%;
}
.forums .quote {
  padding: 0.5em;
}
.forumPost .inlineBtnBar .inlineBtn {
  margin-bottom: 0;
}
.forumLastPost a,
.forumPostList a {
  color: #00b0f0;
}
.forumLastPost a:hover,
.forumPostList a:hover {
  color: #0092c7;
}
/* #endregion */

/* #region novice */

.newsDetailLink {
  margin-bottom: 20px;
  max-width: 60%;
}
.newsDetailLinkHeader {
  margin-bottom: 20px;
}
.newsDetailLinkTitle {
  color: #00b0f0;
  font-size: clamp(1.5rem, 1.92vw, 1.8rem);
  font-family: 'Segoe UI Light', Helvetica, Arial, sans-serif;
}
.newsDetailLinkTitle:hover {
  color: #0092c7;
}
.newsDetailLinkDate {
  color: #8d8d8d;
  font-size: clamp(0.83rem, 1.06vw, 1rem);
}
.newsDetailLinkContent {
  color: #333333;
  font-size: clamp(0.94rem, 1.19vw, 1.13rem);
  line-height: 27px;
}
.page_clanek #column2 .columnContent {
  max-width: 60%;
}
.page_clanek h1,
.page_clanek .newsDetailLinkDate {
  margin-bottom: 10px;
}
.newsDetails {
  flex-direction: column;
}
/* #endregion */

/* #region nov popup za dodajanje uporabnikov */

#addUsers.content {
  width: 95%;
  max-width: 1150px;
}
#addUsers .user::after {
  content: "";
  display: block;
  clear: both;
}
#addUsersTopBar {
  position: relative;
}
#usersAddBox {
  display: flex;
}
#addUsersSettings {
  width: 22px;
  height: 19px;
  position: absolute;
  right: 0;
  bottom: 10px;
  cursor: pointer;
  font-size: 14px;
  background-color: transparent;
}
#addUsersSettings::before {
  content: "settings";
  color: #333333;
}
#addUsersSettings .moreActionsMenu {
  position: absolute;
  top: 35px;
  right: 0;
  text-align: right;
  z-index: 100;
  background: #00b0f0;
  width: 170px;
}
#addUsersSettings .moreActionsMenuItem {
  padding-left: 40px;
  position: relative;
  text-align: left;
}
#addUsersSettings .moreActionsMenuItem::before {
  content: "check_box_outline_blank";
  display: block;
  position: absolute;
  top: 5px;
  left: 10px;
  width: 14px;
  height: 14px;
}
#addUsersSettings .active::before {
  content: "check_box";
  opacity: 1;
}
#addUsers #userGroupsTree {
  width: 40%;
}
#userGroupsTree .lbl {
  padding-top: 10px;
  margin-bottom: 20px;
  height: 30px;
}
#groupsTreeContent {
  height: 480px;
  max-height: 480px;
  overflow-y: scroll;
  padding: 10px;
  border: 1px solid #d2d2d2;
  background-color: #f6f6f6;
  border-radius: 20px 0 0 20px;
}
#addUsers .userGroupBox {
  position: relative;
  padding: 5px 0 5px 25px;
  cursor: pointer;
}
#groupsTreeContent > .userGroup > .userGroupBox {
  padding-left: 5px;
}
#groupsTreeContent > .userGroup > .childGroups {
  margin-left: 0;
}
#addUsers .userGroupBox:hover {
  background-color: #eeeeee;
}
#addUsers .userGroupBox.selected {
  background-color: #ffdc40;
  color: #333333;
}
#addUsers .toggleUserGroup {
  width: 15px;
  height: 15px;
  position: absolute;
  top: 3px;
  left: 0;
}
#addUsers .toggleUserGroup::before {
  content: "keyboard_arrow_down";
}
#addUsers .toggleUserGroup:hover::before {
  color: #00b0f0;
}
#addUsers .opened > .userGroupBox > .toggleUserGroup::before {
  content: "keyboard_arrow_up";
}
#addUsers .opened > .userGroupBox > .toggleUserGroup:hover::before {
  color: #00b0f0;
}
#addUsers .selected > .toggleUserGroup::before {
  color: #333333;
}
#addUsers .selected > .toggleUserGroup:hover::before {
  color: #333333;
}
#addUsers .opened > .selected > .toggleUserGroup::before {
  color: #333333;
}
#addUsers .opened > .selected > .toggleUserGroup:hover::before {
  color: #333333;
}
#addUsers .userGroupName {
  font-size: 14px;
  line-height: 16px;
}
#addUsers .childGroups {
  margin-left: 15px;
  display: none;
}
#addUsers .opened > .childGroups {
  display: block;
}
#addUsers .membersTitle {
  font-size: 14px;
  line-height: 16px;
  padding: 5px 0;
}
#addUsers #groupList {
  margin-bottom: 25px;
}
#addUsers #userListBox {
  width: 60%;
}
#addUsers #userListTop {
  height: 40px;
  margin-bottom: 20px;
  display: flex;
  justify-content: space-between;
}
#addUsers #userListTop .inlineBtnBar {
  margin-bottom: 0;
}
#addUsers #userListTop .inlineBtn {
  margin-bottom: 0;
}
#userListSearchBox {
  text-align: right;
  margin-left: auto;
}
#userListSearch {
  display: inline-block;
  border: 1px solid #d2d2d2;
  position: relative;
  border-radius: 20px;
  padding-inline: 15px;
  line-height: 20px;
  height: 40px;
  box-sizing: border-box;
}
#userListSearchTxt {
  width: 160px;
  border: 0 none;
  outline: 0 none;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0;
  height: 38px;
}
#userListSearchClear {
  position: absolute;
  top: 50%;
  right: 5px;
  margin-top: -6px;
  width: 12px;
  height: 12px;
  border: 0 none;
  outline: 0 none;
  background: none;
}
#userListSearchClear::before {
  content: "close";
}
#userListContent {
  height: 480px;
  max-height: 480px;
  overflow-y: scroll;
  padding: 10px;
  border: 1px solid #d2d2d2;
  background-color: #f6f6f6;
}
#addUsers .user {
  padding: 5px 0 5px 25px;
  position: relative;
  line-height: 16px;
}
#addUsers .user:hover {
  background-color: #f6f6f6;
}
#groupList .user,
#userList .user {
  cursor: pointer;
}
#addUsers .userCheck {
  width: 15px;
  height: 15px;
  position: absolute;
  top: 1px;
  left: 4px;
}
#addUsers .selected .userCheck::before {
  content: "add";
}
#addUsers .locked .userCheck::before {
  content: "check";
}
#addUsers .groupSubgroups .locked {
  cursor: default;
}
#addUsers .userName {
  float: left;
  width: 200px;
  font-size: 14px;
  padding-right: 5px;
}
#addUsers .selected .userName {
  font-weight: bold;
}
#addUsers .locked .userName {
  font-weight: bold;
  color: #999999;
}
#addUsers .email {
  float: left;
  width: 200px;
  font-size: 12px;
  color: #999999;
  padding-right: 5px;
}
#addUsers .hrCode {
  float: left;
  width: 80px;
  font-size: 12px;
  color: #999999;
}
#addUsersInfo {
  text-align: right;
  margin: 22px 0;
}
/* #endregion */

/* #region Wizzard eContent */

#mainCentral.wizzardEContent {
  flex-direction: column;
}
#wizardcontent {
  width: 100%;
}
#eContentImportXmlForm {
  line-height: 1.4em;
}
/* #endregion */

/* #region IDD tocke */

#reportTockeIDDTable {
  overflow-x: visible !important;
}
.podrocjeInfo {
  display: inline-block;
  width: 23px;
  height: 23px;
  margin: -5px 0 -2px 10px;
  vertical-align: middle;
  position: relative;
}
.podrocjeInfo::before {
  content: "info";
}
.podrocjeInfoPopup {
  position: absolute;
  z-index: 100;
  background: white;
  top: 0;
  left: 25px;
  display: none;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.32), 0 2px 4px 0 rgba(0, 0, 0, 0.28);
}
.podrocjeInfo:hover .podrocjeInfoPopup {
  display: block;
}
.podrocjeInfoPopupHeading {
  /*text-align: center;*/
  padding: 5px 10px;
  background-color: #00adee;
  color: white;
  text-transform: uppercase;
  white-space: nowrap;
  min-width: 200px;
}
.podrocjeInfoPopupContent {
  padding: 5px 10px;
}
/* #endregion */

/* #region responsive */

@media (min-width: 1461px) {
  #B2SkinMetroMaster:not(.fullscreenPage) .atomshow #column1,
  #B2SkinMetroMaster:not(.fullscreenPage) .atomshow #column1 .menu {
    display: block !important;
  }
  .fullscreenPage .atomshow #column1 {
    display: none;
  }
  .fullscreenPage .atomshow #column1 .menu {
    display: none;
  }
}
@media (max-width: 1460px) {
  #mainContent.atomshow {
    max-width: 1040px;
    position: relative;
  }
  .fullscreenPage #mainContent.atomshow {
    max-width: 1200px;
  }
  .atomshow #column1 {
    display: none;
    float: none;
    position: absolute;
    top: 50px;
    left: 0;
    z-index: 1000;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    max-height: 95%;
    overflow-y: auto;
  }
  .atomshow #graphProgress {
    position: static;
  }
  .btnsGroup1 {
    padding-left: 0;
  }
  .btnsGroup1 #contents {
    display: inline-block;
  }
}
@media (min-width: 1201px) {
  #navigation {
    display: flex !important;
  }
  /*atomshow fullscreen*/
  
  .fullscreenPage #mainContent.scormshow {
    width: 1250px;
  }
  .fullscreenPage .atomshow #column1 {
    display: none;
    width: 250px;
    position: absolute;
    z-index: 1000;
  }
  .fullscreenPage .atomshow #column1 .menu {
    display: none;
  }
  .fullscreenPage .atomshow #column1 {
    display: none;
  }
  .fullscreenPage .atomshow #column2 {
    width: 1200px;
    float: none;
  }
}
@media (max-width: 1200px) {
  #B2SkinMetroMaster {
    grid-template-areas: "topbar" "content";
    grid-template-columns: 100% !important;
    grid-template-rows: 70px 1fr;
  }
  #header {
    border-top: 3px solid #00b0f0;
  }
  #navigation {
    position: absolute;
    border: none;
    top: 70px;
    height: calc(100vh - 70px);
    background-color: white;
    display: none;
  }
  #desktopFooter {
    display: none;
  }
  #navContent {
    position: static;
    height: auto;
  }
  .imglink.openMenu {
    display: block;
  }
  #userMenuTrigger span {
    display: none;
  }
  #userMenuTrigger .profileImg::before {
    top: 0;
  }
  #loginBg .content {
    padding: 40px;
  }
  #loginBg .container {
    flex-direction: column;
  }
  #loginBg .banner {
    order: 2;
    min-height: 300px;
  }
  #loginBg.registerPage .banner {
    display: none;
  }
  #inactivityDialog {
    width: 80%;
  }
  .mCSB_container {
    max-height: 380px;
  }
  .page_learning #mainContentWrapper {
    padding: 10px 0;
  }
  .newsDetailLink,
  .page_clanek #column2 .columnContent {
    max-width: none;
  }
  #mainContent.profile #column2 {
    max-width: none;
  }
}
/*
//tu se sirina atomshowa zacne zmanjsevati
@media (max-width: 1060px) {
    #mainContentWrapper, main {
        background-color: white;
        padding: 25px 20px;
    }

    //ostali
    #mainContent, #mainCentral{
        border:0 none;
        padding:0;
    }

    //atomshow
    .page_learning #mainContentWrapper {
        padding: 20px;
    }

    #mainContent.atomshow {
        max-width: none;
    }

    .fullscreenPage #mainContent.atomshow {
        max-width: none;
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
    }

    .atomshow #column2, .atomshow .subcolumn1, .atomshow .subcolumn2 {
        float: none;
        width: auto;
    }

    .atomshow .mqContent {
        padding: 20px;
    }

    .atomshow .subcolumn1 .atomContent{
        padding:0;
        border:0 none;
        min-height:0;
    }

    .atomBtns .btnsGroup1 {
        gap: 15px;
    }

    .atomshow .atomComment{
        margin-bottom:20px;
    }
    .atomshow .subcolumn1 .mq {
        margin-top: 20px;
    }

    .extVideoBox,.embeddedVideo {
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 30px;
        height: 0 !important;
        max-width:100%;
        overflow: hidden;
    }

    .extVideoBox iframe, .extVideoBox object, .extVideoBox embed,
    .embeddedVideo iframe, .embeddedVideo object, .embeddedVideo embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

    .hotSpotItemText {
        padding: 10px;
    }

    .topBar h2{
        font-size:@fontsize-medium;
    }

    //atomeditor
    #atomEditHead {
        flex-direction: column;
    }

    .eContentEditor #atomTitle {
        margin-bottom: 20px;
    }

}
*/

@media only screen and (min-width: 1081px) {
  .atomshow #atomToolbarMore {
    display: none !important;
  }
}
@media only screen and (max-width: 1080px) {
  #B2SkinMetroMaster.page_learning {
    display: block;
  }
  .page_learning #header,
  .page_learning #navigation {
    display: none !important;
  }
  .btnsGroup1 #backToStart,
  .btnsGroup1 #atomMore {
    display: block;
  }
  .btnsGroup1 #favourite,
  .btnsGroup1 #sendMessage,
  .btnsGroup1 #files {
    display: none;
  }
}
/*medium (ipad) (od prej) - dodano iz krke*/

@media only screen and (min-width: 768px) and (max-width: 1080px) {
  .page_learning #atomNextTop,
  .page_learning #atomPrevBottom {
    display: none !important;
  }
  .page_learning #mainContentWrapper {
    padding: 0;
    height: 100vh;
  }
  .page_learning #mainContent {
    height: 100vh;
    max-width: none;
  }
  .page_predstavitevspletaja .atomBtns,
  .page_atomshow .atomBtns {
    position: absolute;
    width: 40px;
    height: 100%;
    top: 0;
    flex-direction: column;
    margin-bottom: 0;
  }
  .page_predstavitevspletaja .topBar,
  .page_atomshow .topBar {
    left: 0;
  }
  .page_predstavitevspletaja .topBar .btnsGroup2 {
    display: none;
  }
  .atomshow #column1 {
    top: 20px;
    left: 55px;
  }
  .page_atomshow .testing .topBar,
  .page_izpitopravljanje .testing .topBar {
    position: static;
    height: auto;
    padding: 0 55px;
  }
  .page_predstavitevspletaja .rightBar,
  .page_atomshow .rightBar {
    display: flex;
    right: 10px;
  }
  #atomNextRight {
    margin-left: 0;
  }
  .page_predstavitevspletaja .btnsGroup1,
  .page_atomshow .btnsGroup1 {
    flex-direction: column;
    margin-top: 20px;
    left: 14px;
    position: absolute;
    z-index: 20;
    width: 30px;
  }
  .page_learning .btnsGroup2 {
    position: absolute;
    top: 0;
    width: 40px;
    height: 100%;
    z-index: 10;
  }
  #atomLastReadRight {
    position: absolute;
    top: 20px;
  }
  #atomPrevTop,
  #atomNextRight {
    position: absolute;
    top: 50%;
    margin-top: -20px;
  }
  .page_atomshow .topBar .btnsGroup2 {
    left: 10px;
  }
  .page_predstavitevspletaja .myComments .btnsGroup2,
  .page_atomshow #divMyComments .btnsGroup2,
  .visProgress {
    display: none;
  }
  .page_atomshow #atomPrevTop {
    margin-left: 0;
  }
  .page_learning #column2 {
    width: auto;
    max-height: 100%;
    overflow-y: auto;
    padding: 0 55px;
    float: none;
    height: auto;
  }
  .atomshow .subcolumn1 {
    width: 78%;
  }
  .atomshow .subcolumn2 {
    width: 19.5%;
  }
  .atomshow .subcolumn1,
  .atomshow .subcolumn2,
  .atomshow.atomWide .subcolumn1 {
    margin-top: 20px;
  }
  .page_learning .subcolumn1 .atomContent,
  .page_learning .mqContent {
    padding: 20px;
  }
  .atomshow .subcolumn1 .mq {
    margin-top: 20px;
  }
  .page_atomshow .testing .topBar,
  .page_izpitopravljanje .testing .topBar,
  .page_atomshow .subcolumn1 .atomContent,
  .page_predstavitevspletaja .subcolumn1 .atomContent,
  .page_izpitopravljanje .subcolumn1 .atomContent,
  #divMyComments {
    width: auto;
    margin: 0 auto;
  }
  .page_atomshow.atomObjekt .subcolumn1 .atomContent {
    padding: 0;
    overflow: hidden;
  }
  .page_atomshow.atomObjekt .atomContent > h1 {
    display: none;
  }
  #iframePdf {
    height: 722px;
  }
}
@media only screen and (max-width: 767px) {
  #mainContentWrapper,
  main {
    background-color: white;
    padding: 25px 20px;
  }
  #mainContent,
  #mainCentral {
    border: 0 none;
    padding: 0;
  }
  .page_learning #mainContentWrapper {
    padding: 0;
  }
  #mainContent.atomshow {
    max-width: none;
    padding: 20px;
  }
  .fullscreenPage #mainContent.atomshow {
    max-width: none;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
  }
  .atomshow #column2,
  .atomshow .subcolumn1,
  .atomshow .subcolumn2 {
    float: none;
    width: auto;
  }
  .atomshow #column1 {
    position: fixed;
    top: auto;
    left: 20px;
    width: 90%;
    bottom: 70px;
  }
  .atomshow #column2 {
    padding-bottom: 40px;
  }
  .atomshow .mqContent {
    padding: 20px;
  }
  .atomshow .subcolumn1 .atomContent {
    padding: 0;
    border: 0 none;
    min-height: 0;
  }
  .atomBtns.topBar {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    margin-bottom: 0;
    padding-bottom: 10px;
    background-color: white;
    padding-top: 10px;
    border-top: 1px solid #d4d4d4;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }
  .atomBtns .btnsGroup1 {
    gap: 15px;
    padding-left: 15px;
  }
  .atomshow .btnsGroup2,
  .testTopRight {
    padding-right: 20px;
  }
  .testTopLeft {
    padding-left: 20px;
  }
  #divMyComments,
  #column2 .btnsGroup2 {
    display: none;
  }
  .atomshow .atomComment {
    margin-bottom: 20px;
  }
  .atomshow .subcolumn1 .mq {
    margin-top: 20px;
  }
  .extVideoBox,
  .embeddedVideo {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0 !important;
    max-width: 100%;
    overflow: hidden;
  }
  .extVideoBox iframe,
  .extVideoBox object,
  .extVideoBox embed,
  .embeddedVideo iframe,
  .embeddedVideo object,
  .embeddedVideo embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .hotSpotItemText {
    padding: 10px;
  }
  .topBar h2 {
    font-size: clamp(1.05rem, 1.34vw, 1.27rem);
  }
  #atomEditHead {
    flex-direction: column;
  }
  .eContentEditor #atomTitle {
    margin-bottom: 20px;
  }
}
@media (max-width: 639px) {
  /*
      // responsive layout glavne vsebine
      #mainContentWrapper, main {
          background-color: white;
          padding: 25px 20px;
          min-width: 340px;
      }
      */
  
  #headerSearchBox .searchBox {
    display: none;
  }
  /*
      .ajax__tab_body, #column1, #column2, #mainContent {
          padding: 0;
          border-radius: 0;
          border: none;
      }
  
      #inactivityDialog {
          width: 80%
      }
  
      #mainContent.listDetails #column2 {
          padding: 0;
          border-radius: 0;
          border: none;
      }
  
      #mainCentral.startPage .eCourseTile {
          flex-direction: column;
      }
  
      #mainCentral.startPage .eCourseDescription {
          display: none
      }
      */
}
@media only screen and (max-height: 500px) {
  .btnsGroup1 #myProgress {
    display: none;
  }
  #atomMoreMyProgress {
    display: block;
  }
}
/* #endregion */
/*
//default blue
//@color1: #0086b8; //header
//@color2: #2d3d43; //nav
//@color3: #375b69; //navRequired and optional
//@color4: #1a292f; //navRequired and optional hover
//@color5: #3d8dca; //nav menu selected, userMenu arrow
@color6: #000; //navItemSmall hover

@color8: #1a292f; //navSub
@color9: #006a9e; //dialog shadow

//@ec_icons: url(/Statika/style/default_templates/blue/img/ec4_icons.png?v=1.1);

@logo_height: 50px;
@logo_width: 222px;
*/
#header {
  padding-left: clamp(0.688rem, -0.484rem + 1.563vw, 1rem);
}
#loginBg .banner {
  background-image: url(/Statika/style/custom_templates/zbs/img/zbs_naslovnica_ec4.jpg);
  background-size: cover;
  background-position: center right;
}
#loginBg .logoWrapper img {
  display: none;
}
#loginBg .logoWrapper {
  background-image: url(/Statika/style/custom_templates/zbs/img/zbs_logo_ec4.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  min-height: 60px;
}
@media (max-width: 1200px) {
  #loginBg .banner {
    border-right: none;
    border-top: 1px solid #d2d2d2;
  }
  #header {
    padding-left: 23px;
  }
}
