.label-success{
    background-color:#454545;
}

.label-success>span{
    width: max-content;
    background-color:#454545;
    padding: 1px 4px;
    font-size: 11px;
    border-radius: 0;
}

.custom-label-ts-start-date {
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  white-space: normal;
}

.categoryheader{
    position: absolute;
    width: 100%;
    margin-left: 10px;
    margin-top: -5px;
    font-size: 15px;
    z-index: 10;
    padding: 4px 2px 2px 5px;
}

.courseType.label{
    background-color: #00A139;
    border-radius: 3px;
}
.courseType{
    float:right;
    margin-top: 10px !important;
    margin-right: 15px !important;
}
.tagsBadge{
    font-size: 18px;
    margin: 15px;
    margin-top: 10px;
    border-radius: 15px;
    background-color: #00A139;
    cursor: pointer;
}
.customTag{
    font-weight: 700 !important;
    font-size: 11.4px;
    padding: 5px !important;   
    background-color: #6e6d72;
    display: inherit !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ef-card-entries .ef-card .ef-card-wrap div.caption .ef-plain.ef-header{
    font-weight: bold !important;
    padding-top: 10px;
}
.cardText{
    font-size: 15px;
    vertical-align: middle;
    margin-left: 10px;
}
.ef-card-entries .ef-card .ef-card-wrap div.caption{
    background-color: #f0f0f0;
}
div.ef-my-courses.ef-my-courses-grid div.ef-block div.ef-block-content div.ef-course-card div.caption div.ef-entry-status{
    position: relative;
}

.plain .item.course-cost {
    font-weight: bold;
}

.cardFooterBtn{
    float: right;
    margin-right: 10px;
    margin-top: 10px;   
}
div.ef-my-courses.ef-my-courses-grid div.ef-block div.ef-block-content div.ef-course-card div.caption div.ef-entry-status div.ef-my-courses-progress-bar{
    width: 100%;
}
.cardFooterCustom{
    min-height: 55px;
    background-color: rgba(0,0,0,.03);
    border-top: 1px solid #dddddd;
}
.img-rounded{
    width: 30px;
    height: 30px;
    margin: 10px;
}
#headerTitle{
    font-size: 18px;
    font-weight: 900;
    color: #000;
    word-break: break-word;
}
@media only screen and (min-width: 1200px) {
  .ef-card-entries .ef-card {
    width: 25%;
  }
}
@media only screen and (min-width: 992px) {
  .ef-card-entries .ef-card {
    width: 25%;
  }
}

.tagArea a span.labelText {
  background: #fff;
  color: #222;
  font-size: 14px;
  font-weight: bold;
  position:  absolute;
  bottom: 0;
  margin-left: -50px; 
  padding: 5px 7px;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all .4s;
  -moz-transition: all .4s;
  transition: all .4s;
  margin-right: 5px;
  z-index: 200;
}

.tagArea a span.labelText:before {
  content: '';
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #fff;
  position: absolute;
  bottom: -5px;
  left: 17px;
}

.tagArea a:hover span.labelText {
  bottom: 50px;
  visibility: visible;
  opacity: 1;
}
.labelText {
 -webkit-box-shadow: 3px 5px 15px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 3px 5px 15px 0px rgba(0,0,0,0.75);
 box-shadow: 3px 5px 15px 0px rgba(0,0,0,0.75);
  border-radius: 5px;
}

.plain {
    margin: 0 10px;
}

.plain .item {
    width: 25px;
    height: 25px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.plain.icons {
    position: absolute;
    bottom: 16px;
}

.course-info{
    position: absolute; 
    top:0; 
    left:0;
    width:100%; 
    height:100%; 
    z-index: 50; 
    background:#f2f2f2; 
    display:none;
}

.course-text{
    margin-left: 10px;
    margin-right: 10px;
}
.course-text img{
    display:none;
    width:100% !important;
}

.item.infoicon {
    background: transparent url('/plugins/MagnificentCatalog/assets/images/info-icon.svg') no-repeat center center;
    display: inline-block;
    width: 26px;
    height: 26px;
    position: absolute;
    z-index: 100;
    right: 5px;
    top: 5px;
    background-size: cover;
    filter: invert(28%) sepia(8%) saturate(0%) hue-rotate(187deg) brightness(95%) contrast(101%);
}

.ef-card .ef-card-wrap:hover .item.infoicon:hover ~ div.thumbnail div.default-action{
    display:none;
}

@keyframes rotateit {
    0% {  transform: rotateY(0deg)   }
    50%   {  transform: rotateY(90deg) }
    100%   {  transform: rotateY(0deg) }
}

.ef-card-wrap.ef-course-wrap.spin{
    animation: rotateit 1s ease-in-out;
}

.plain .label {
    padding: 1px 4px;
    font-size: 11px;
    font-weight: normal;
    border-radius: 0;
}

.ef-card-entries .ef-card .ef-card-wrap div.caption .ef-plain.ef-header {
    max-height: 60px !important;
    padding-top: 10px;
}

#headerTitle {
    line-height: 100%;
    font-weight: normal;
}

/* Catalog filters */
.checkbox.checbox-switch label > input:checked + span, .checkbox-inline.checbox-switch > input:checked + span {
    background-color: #f38f02;
    border-color: #f38f02;
    box-shadow: #f38f02 0px 0px 0px 8px inset;
    transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

 [data-role=expander] i.gj-icon {
    width: 0 !important;
    height: 0 !important;
    border-style: solid;
    display: inline-block;
}

 [data-role=expander] i.gj-icon.plus {
    border-width: 8px 0 8px 10px;
    border-color: transparent transparent transparent #f38f02;
}

 [data-role=expander] i.gj-icon.minus {
    border-width: 10px 8px 0 8px;
    border-color: #f38f02 transparent transparent transparent;
}

 [data-role=expander] i.gj-icon.plus:before,
 [data-role=expander] i.gj-icon.minus:before {
    content: "";
}

.gj-checkbox-bootstrap span {
    width: 15px;
    height: 15px;
    border-radius: 0;
    color: #fff;
}

.gj-checkbox-material-icons input[type=checkbox]:checked+span.checked {
    background-color: #f38f02;
    border-color: #f38f02;
}

.gj-checkbox-material-icons input[type=checkbox]:checked+span.checked:after {
    content: '';
}

#mainRow .col-lg-3 > div {
    display: flex;
    flex-wrap: wrap;
}

#mainRow .col-lg-3 > div > div {
    width: 100%;
}

[data-role=expander] {
    width: 15px;
}

ul.gj-list-bootstrap li [data-role=expander].gj-tree-material-icons-expander,
ul.gj-list-bootstrap li [data-role=checkbox] {
    padding: 0;
}

/* Indent */
[data-role="spacer"] {
    width: 24px !important;
}

/* ul.gj-list.gj-list-bootstrap {
    margin-left: 14px;
} */

/* Layout */
#mainRow .ef-extern-courses {
    width: 100%;
    margin: 0 !important;
    padding: 0;
}

#mainRow .ef-my-courses-controls {
    padding: 15px 0;
}

#mainRow {
    display: flex;
    flex-wrap: wrap;
}

#mainRow > .col-lg-3 {
    width: auto;
}

@media(max-width:600px) {
    #mainRow > .col-lg-3 {
        width: 100%;
    }
}