.twitter-typeahead .tt-query,
.twitter-typeahead .tt-hint {
    margin-bottom: 0;
}

.twitter-typeahead .tt-hint
{
    display: none;
}

.tt-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
    cursor: pointer;
}

.tt-suggestion {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #333333;
    white-space: nowrap;
}

.tt-suggestion:hover,
.tt-suggestion:focus {
    color: #ffffff;
    text-decoration: none;
    outline: 0;
    background-color: #428bca;
}

.bootstrap-tagsinput {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  display: inline-block;
  padding: 4px 6px;
  color: #555;
  vertical-align: middle;
  border-radius: 4px;
  max-width: 100%;
  line-height: 22px;
  cursor: text;
}
.bootstrap-tagsinput input {
  border: none;
  box-shadow: none;
  outline: none;
  background-color: transparent;
  padding: 0 6px;
  margin: 0;
  width: auto;
  max-width: inherit;
}
.bootstrap-tagsinput.form-control input::-moz-placeholder {
  color: #777;
  opacity: 1;
}
.bootstrap-tagsinput.form-control input:-ms-input-placeholder {
  color: #777;
}
.bootstrap-tagsinput.form-control input::-webkit-input-placeholder {
  color: #777;
}
.bootstrap-tagsinput input:focus {
  border: none;
  box-shadow: none;
}
.bootstrap-tagsinput .tag {
  margin-right: 2px;
  color: white;
}
.bootstrap-tagsinput .tag [data-role="remove"] {
  margin-left: 8px;
  cursor: pointer;
}
.bootstrap-tagsinput .tag [data-role="remove"]:after {
  content: "x";
  padding: 0px 2px;
}
.bootstrap-tagsinput .tag [data-role="remove"]:hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.bootstrap-tagsinput .tag [data-role="remove"]:hover:active {
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.select2-container{box-sizing:border-box;display:inline-block;margin:0;position:relative;vertical-align:middle}.select2-container .select2-selection--single{box-sizing:border-box;cursor:pointer;display:block;height:28px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;padding-left:8px;padding-right:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--single .select2-selection__clear{position:relative}.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered{padding-right:8px;padding-left:20px}.select2-container .select2-selection--multiple{box-sizing:border-box;cursor:pointer;display:block;min-height:32px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline-block;overflow:hidden;padding-left:8px;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-search--inline{float:left}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;border:none;font-size:100%;margin-top:5px;padding:0}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-dropdown{background-color:white;border:1px solid #aaa;border-radius:4px;box-sizing:border-box;display:block;position:absolute;left:-100000px;width:100%;z-index:1051}.select2-results{display:block}.select2-results__options{list-style:none;margin:0;padding:0}.select2-results__option{padding:6px;user-select:none;-webkit-user-select:none}.select2-results__option[aria-selected]{cursor:pointer}.select2-container--open .select2-dropdown{left:0}.select2-container--open .select2-dropdown--above{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--open .select2-dropdown--below{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{padding:4px;width:100%;box-sizing:border-box}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{border:0;margin:0;padding:0;display:block;position:fixed;left:0;top:0;min-height:100%;min-width:100%;height:auto;width:auto;opacity:0;z-index:99;background-color:#fff;filter:alpha(opacity=0)}.select2-hidden-accessible{border:0 !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;height:1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important;white-space:nowrap !important}.select2-container--default .select2-selection--single{background-color:#fff;border:1px solid #aaa;border-radius:4px}.select2-container--default .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--default .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--default .select2-selection--single .select2-selection__arrow{height:26px;position:absolute;top:1px;right:1px;width:20px}.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:#888 transparent transparent transparent;border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear{float:left}.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow{left:1px;right:auto}.select2-container--default.select2-container--disabled .select2-selection--single{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear{display:none}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #888 transparent;border-width:0 4px 5px 4px}.select2-container--default .select2-selection--multiple{background-color:white;border:1px solid #aaa;border-radius:4px;cursor:text}.select2-container--default .select2-selection--multiple .select2-selection__rendered{box-sizing:border-box;list-style:none;margin:0;padding:0 5px;width:100%}.select2-container--default .select2-selection--multiple .select2-selection__rendered li{list-style:none}.select2-container--default .select2-selection--multiple .select2-selection__placeholder{color:#999;margin-top:5px;float:left}.select2-container--default .select2-selection--multiple .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;margin-top:5px;margin-right:10px}.select2-container--default .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;cursor:default;float:left;margin-right:5px;margin-top:5px;padding:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{color:#999;cursor:pointer;display:inline-block;font-weight:bold;margin-right:2px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{color:#333}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice,.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder,.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline{float:right}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice{margin-left:5px;margin-right:auto}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove{margin-left:2px;margin-right:auto}.select2-container--default.select2-container--focus .select2-selection--multiple{border:solid black 1px;outline:0}.select2-container--default.select2-container--disabled .select2-selection--multiple{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-left-radius:0;border-top-right-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid #aaa}.select2-container--default .select2-search--inline .select2-search__field{background:transparent;border:none;outline:0;box-shadow:none;-webkit-appearance:textfield}.select2-container--default .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--default .select2-results__option[role=group]{padding:0}.select2-container--default .select2-results__option[aria-disabled=true]{color:#999}.select2-container--default .select2-results__option[aria-selected=true]{background-color:#ddd}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:#5897fb;color:white}.select2-container--default .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic .select2-selection--single{background-color:#f7f7f7;border:1px solid #aaa;border-radius:4px;outline:0;background-image:-webkit-linear-gradient(top, #fff 50%, #eee 100%);background-image:-o-linear-gradient(top, #fff 50%, #eee 100%);background-image:linear-gradient(to bottom, #fff 50%, #eee 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic .select2-selection--single:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--classic .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;margin-right:10px}.select2-container--classic .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--classic .select2-selection--single .select2-selection__arrow{background-color:#ddd;border:none;border-left:1px solid #aaa;border-top-right-radius:4px;border-bottom-right-radius:4px;height:26px;position:absolute;top:1px;right:1px;width:20px;background-image:-webkit-linear-gradient(top, #eee 50%, #ccc 100%);background-image:-o-linear-gradient(top, #eee 50%, #ccc 100%);background-image:linear-gradient(to bottom, #eee 50%, #ccc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0)}.select2-container--classic .select2-selection--single .select2-selection__arrow b{border-color:#888 transparent transparent transparent;border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear{float:left}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow{border:none;border-right:1px solid #aaa;border-radius:0;border-top-left-radius:4px;border-bottom-left-radius:4px;left:1px;right:auto}.select2-container--classic.select2-container--open .select2-selection--single{border:1px solid #5897fb}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow{background:transparent;border:none}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #888 transparent;border-width:0 4px 5px 4px}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single{border-top:none;border-top-left-radius:0;border-top-right-radius:0;background-image:-webkit-linear-gradient(top, #fff 0%, #eee 50%);background-image:-o-linear-gradient(top, #fff 0%, #eee 50%);background-image:linear-gradient(to bottom, #fff 0%, #eee 50%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0;background-image:-webkit-linear-gradient(top, #eee 50%, #fff 100%);background-image:-o-linear-gradient(top, #eee 50%, #fff 100%);background-image:linear-gradient(to bottom, #eee 50%, #fff 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0)}.select2-container--classic .select2-selection--multiple{background-color:white;border:1px solid #aaa;border-radius:4px;cursor:text;outline:0}.select2-container--classic .select2-selection--multiple:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--multiple .select2-selection__rendered{list-style:none;margin:0;padding:0 5px}.select2-container--classic .select2-selection--multiple .select2-selection__clear{display:none}.select2-container--classic .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;cursor:default;float:left;margin-right:5px;margin-top:5px;padding:0 5px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove{color:#888;cursor:pointer;display:inline-block;font-weight:bold;margin-right:2px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover{color:#555}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice{float:right;margin-left:5px;margin-right:auto}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove{margin-left:2px;margin-right:auto}.select2-container--classic.select2-container--open .select2-selection--multiple{border:1px solid #5897fb}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--classic .select2-search--dropdown .select2-search__field{border:1px solid #aaa;outline:0}.select2-container--classic .select2-search--inline .select2-search__field{outline:0;box-shadow:none}.select2-container--classic .select2-dropdown{background-color:#fff;border:1px solid transparent}.select2-container--classic .select2-dropdown--above{border-bottom:none}.select2-container--classic .select2-dropdown--below{border-top:none}.select2-container--classic .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--classic .select2-results__option[role=group]{padding:0}.select2-container--classic .select2-results__option[aria-disabled=true]{color:grey}.select2-container--classic .select2-results__option--highlighted[aria-selected]{background-color:#3875d7;color:#fff}.select2-container--classic .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic.select2-container--open .select2-dropdown{border-color:#5897fb}

@-webkit-keyframes swal2-show{0%{-webkit-transform:scale(.7);transform:scale(.7)}45%{-webkit-transform:scale(1.05);transform:scale(1.05)}80%{-webkit-transform:scale(.95);transform:scale(.95)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes swal2-show{0%{-webkit-transform:scale(.7);transform:scale(.7)}45%{-webkit-transform:scale(1.05);transform:scale(1.05)}80%{-webkit-transform:scale(.95);transform:scale(.95)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes swal2-hide{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}100%{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}}@keyframes swal2-hide{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}100%{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}}@-webkit-keyframes swal2-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}100%{top:2.8125em;left:.875em;width:1.5625em}}@keyframes swal2-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}100%{top:2.8125em;left:.875em;width:1.5625em}}@-webkit-keyframes swal2-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}100%{top:2.375em;right:.5em;width:2.9375em}}@keyframes swal2-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}100%{top:2.375em;right:.5em;width:2.9375em}}@-webkit-keyframes swal2-rotate-success-circular-line{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}5%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}12%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}100%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}}@keyframes swal2-rotate-success-circular-line{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}5%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}12%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}100%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}}@-webkit-keyframes swal2-animate-error-x-mark{0%{margin-top:1.625em;-webkit-transform:scale(.4);transform:scale(.4);opacity:0}50%{margin-top:1.625em;-webkit-transform:scale(.4);transform:scale(.4);opacity:0}80%{margin-top:-.375em;-webkit-transform:scale(1.15);transform:scale(1.15)}100%{margin-top:0;-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes swal2-animate-error-x-mark{0%{margin-top:1.625em;-webkit-transform:scale(.4);transform:scale(.4);opacity:0}50%{margin-top:1.625em;-webkit-transform:scale(.4);transform:scale(.4);opacity:0}80%{margin-top:-.375em;-webkit-transform:scale(1.15);transform:scale(1.15)}100%{margin-top:0;-webkit-transform:scale(1);transform:scale(1);opacity:1}}@-webkit-keyframes swal2-animate-error-icon{0%{-webkit-transform:rotateX(100deg);transform:rotateX(100deg);opacity:0}100%{-webkit-transform:rotateX(0);transform:rotateX(0);opacity:1}}@keyframes swal2-animate-error-icon{0%{-webkit-transform:rotateX(100deg);transform:rotateX(100deg);opacity:0}100%{-webkit-transform:rotateX(0);transform:rotateX(0);opacity:1}}body.swal2-toast-shown .swal2-container{background-color:transparent}body.swal2-toast-shown .swal2-container.swal2-shown{background-color:transparent}body.swal2-toast-shown .swal2-container.swal2-top{top:0;right:auto;bottom:auto;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}body.swal2-toast-shown .swal2-container.swal2-top-end,body.swal2-toast-shown .swal2-container.swal2-top-right{top:0;right:0;bottom:auto;left:auto}body.swal2-toast-shown .swal2-container.swal2-top-left,body.swal2-toast-shown .swal2-container.swal2-top-start{top:0;right:auto;bottom:auto;left:0}body.swal2-toast-shown .swal2-container.swal2-center-left,body.swal2-toast-shown .swal2-container.swal2-center-start{top:50%;right:auto;bottom:auto;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%)}body.swal2-toast-shown .swal2-container.swal2-center{top:50%;right:auto;bottom:auto;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}body.swal2-toast-shown .swal2-container.swal2-center-end,body.swal2-toast-shown .swal2-container.swal2-center-right{top:50%;right:0;bottom:auto;left:auto;-webkit-transform:translateY(-50%);transform:translateY(-50%)}body.swal2-toast-shown .swal2-container.swal2-bottom-left,body.swal2-toast-shown .swal2-container.swal2-bottom-start{top:auto;right:auto;bottom:0;left:0}body.swal2-toast-shown .swal2-container.swal2-bottom{top:auto;right:auto;bottom:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}body.swal2-toast-shown .swal2-container.swal2-bottom-end,body.swal2-toast-shown .swal2-container.swal2-bottom-right{top:auto;right:0;bottom:0;left:auto}body.swal2-toast-column .swal2-toast{flex-direction:column;align-items:stretch}body.swal2-toast-column .swal2-toast .swal2-actions{flex:1;align-self:stretch;height:2.2em;margin-top:.3125em}body.swal2-toast-column .swal2-toast .swal2-loading{justify-content:center}body.swal2-toast-column .swal2-toast .swal2-input{height:2em;margin:.3125em auto;font-size:1em}body.swal2-toast-column .swal2-toast .swal2-validation-message{font-size:1em}.swal2-popup.swal2-toast{flex-direction:row;align-items:center;width:auto;padding:.625em;box-shadow:0 0 .625em #d9d9d9;overflow-y:hidden}.swal2-popup.swal2-toast .swal2-header{flex-direction:row}.swal2-popup.swal2-toast .swal2-title{flex-grow:1;justify-content:flex-start;margin:0 .6em;font-size:1em}.swal2-popup.swal2-toast .swal2-footer{margin:.5em 0 0;padding:.5em 0 0;font-size:.8em}.swal2-popup.swal2-toast .swal2-close{position:initial;width:.8em;height:.8em;line-height:.8}.swal2-popup.swal2-toast .swal2-content{justify-content:flex-start;font-size:1em}.swal2-popup.swal2-toast .swal2-icon{width:2em;min-width:2em;height:2em;margin:0}.swal2-popup.swal2-toast .swal2-icon-text{font-size:2em;font-weight:700;line-height:1em}.swal2-popup.swal2-toast .swal2-icon.swal2-success .swal2-success-ring{width:2em;height:2em}.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line]{top:.875em;width:1.375em}.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left]{left:.3125em}.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right]{right:.3125em}.swal2-popup.swal2-toast .swal2-actions{height:auto;margin:0 .3125em}.swal2-popup.swal2-toast .swal2-styled{margin:0 .3125em;padding:.3125em .625em;font-size:1em}.swal2-popup.swal2-toast .swal2-styled:focus{box-shadow:0 0 0 .0625em #fff,0 0 0 .125em rgba(50,100,150,.4)}.swal2-popup.swal2-toast .swal2-success{border-color:#a5dc86}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line]{position:absolute;width:2em;height:2.8125em;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-radius:50%}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=left]{top:-.25em;left:-.9375em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:2em 2em;transform-origin:2em 2em;border-radius:4em 0 0 4em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=right]{top:-.25em;left:.9375em;-webkit-transform-origin:0 2em;transform-origin:0 2em;border-radius:0 4em 4em 0}.swal2-popup.swal2-toast .swal2-success .swal2-success-ring{width:2em;height:2em}.swal2-popup.swal2-toast .swal2-success .swal2-success-fix{top:0;left:.4375em;width:.4375em;height:2.6875em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line]{height:.3125em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line][class$=tip]{top:1.125em;left:.1875em;width:.75em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line][class$=long]{top:.9375em;right:.1875em;width:1.375em}.swal2-popup.swal2-toast.swal2-show{-webkit-animation:showSweetToast .5s;animation:showSweetToast .5s}.swal2-popup.swal2-toast.swal2-hide{-webkit-animation:hideSweetToast .2s forwards;animation:hideSweetToast .2s forwards}.swal2-popup.swal2-toast .swal2-animate-success-icon .swal2-success-line-tip{-webkit-animation:animate-toast-success-tip .75s;animation:animate-toast-success-tip .75s}.swal2-popup.swal2-toast .swal2-animate-success-icon .swal2-success-line-long{-webkit-animation:animate-toast-success-long .75s;animation:animate-toast-success-long .75s}@-webkit-keyframes showSweetToast{0%{-webkit-transform:translateY(-.625em) rotateZ(2deg);transform:translateY(-.625em) rotateZ(2deg);opacity:0}33%{-webkit-transform:translateY(0) rotateZ(-2deg);transform:translateY(0) rotateZ(-2deg);opacity:.5}66%{-webkit-transform:translateY(.3125em) rotateZ(2deg);transform:translateY(.3125em) rotateZ(2deg);opacity:.7}100%{-webkit-transform:translateY(0) rotateZ(0);transform:translateY(0) rotateZ(0);opacity:1}}@keyframes showSweetToast{0%{-webkit-transform:translateY(-.625em) rotateZ(2deg);transform:translateY(-.625em) rotateZ(2deg);opacity:0}33%{-webkit-transform:translateY(0) rotateZ(-2deg);transform:translateY(0) rotateZ(-2deg);opacity:.5}66%{-webkit-transform:translateY(.3125em) rotateZ(2deg);transform:translateY(.3125em) rotateZ(2deg);opacity:.7}100%{-webkit-transform:translateY(0) rotateZ(0);transform:translateY(0) rotateZ(0);opacity:1}}@-webkit-keyframes hideSweetToast{0%{opacity:1}33%{opacity:.5}100%{-webkit-transform:rotateZ(1deg);transform:rotateZ(1deg);opacity:0}}@keyframes hideSweetToast{0%{opacity:1}33%{opacity:.5}100%{-webkit-transform:rotateZ(1deg);transform:rotateZ(1deg);opacity:0}}@-webkit-keyframes animate-toast-success-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}100%{top:1.125em;left:.1875em;width:.75em}}@keyframes animate-toast-success-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}100%{top:1.125em;left:.1875em;width:.75em}}@-webkit-keyframes animate-toast-success-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}100%{top:.9375em;right:.1875em;width:1.375em}}@keyframes animate-toast-success-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}100%{top:.9375em;right:.1875em;width:1.375em}}body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown){overflow:hidden}body.swal2-height-auto{height:auto!important}body.swal2-no-backdrop .swal2-shown{top:auto;right:auto;bottom:auto;left:auto;background-color:transparent}body.swal2-no-backdrop .swal2-shown>.swal2-modal{box-shadow:0 0 10px rgba(0,0,0,.4)}body.swal2-no-backdrop .swal2-shown.swal2-top{top:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}body.swal2-no-backdrop .swal2-shown.swal2-top-left,body.swal2-no-backdrop .swal2-shown.swal2-top-start{top:0;left:0}body.swal2-no-backdrop .swal2-shown.swal2-top-end,body.swal2-no-backdrop .swal2-shown.swal2-top-right{top:0;right:0}body.swal2-no-backdrop .swal2-shown.swal2-center{top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}body.swal2-no-backdrop .swal2-shown.swal2-center-left,body.swal2-no-backdrop .swal2-shown.swal2-center-start{top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%)}body.swal2-no-backdrop .swal2-shown.swal2-center-end,body.swal2-no-backdrop .swal2-shown.swal2-center-right{top:50%;right:0;-webkit-transform:translateY(-50%);transform:translateY(-50%)}body.swal2-no-backdrop .swal2-shown.swal2-bottom{bottom:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}body.swal2-no-backdrop .swal2-shown.swal2-bottom-left,body.swal2-no-backdrop .swal2-shown.swal2-bottom-start{bottom:0;left:0}body.swal2-no-backdrop .swal2-shown.swal2-bottom-end,body.swal2-no-backdrop .swal2-shown.swal2-bottom-right{right:0;bottom:0}.swal2-container{display:flex;position:fixed;top:0;right:0;bottom:0;left:0;flex-direction:row;align-items:center;justify-content:center;padding:10px;background-color:transparent;z-index:1060;overflow-x:hidden;-webkit-overflow-scrolling:touch}.swal2-container.swal2-top{align-items:flex-start}.swal2-container.swal2-top-left,.swal2-container.swal2-top-start{align-items:flex-start;justify-content:flex-start}.swal2-container.swal2-top-end,.swal2-container.swal2-top-right{align-items:flex-start;justify-content:flex-end}.swal2-container.swal2-center{align-items:center}.swal2-container.swal2-center-left,.swal2-container.swal2-center-start{align-items:center;justify-content:flex-start}.swal2-container.swal2-center-end,.swal2-container.swal2-center-right{align-items:center;justify-content:flex-end}.swal2-container.swal2-bottom{align-items:flex-end}.swal2-container.swal2-bottom-left,.swal2-container.swal2-bottom-start{align-items:flex-end;justify-content:flex-start}.swal2-container.swal2-bottom-end,.swal2-container.swal2-bottom-right{align-items:flex-end;justify-content:flex-end}.swal2-container.swal2-grow-fullscreen>.swal2-modal{display:flex!important;flex:1;align-self:stretch;justify-content:center}.swal2-container.swal2-grow-row>.swal2-modal{display:flex!important;flex:1;align-content:center;justify-content:center}.swal2-container.swal2-grow-column{flex:1;flex-direction:column}.swal2-container.swal2-grow-column.swal2-bottom,.swal2-container.swal2-grow-column.swal2-center,.swal2-container.swal2-grow-column.swal2-top{align-items:center}.swal2-container.swal2-grow-column.swal2-bottom-left,.swal2-container.swal2-grow-column.swal2-bottom-start,.swal2-container.swal2-grow-column.swal2-center-left,.swal2-container.swal2-grow-column.swal2-center-start,.swal2-container.swal2-grow-column.swal2-top-left,.swal2-container.swal2-grow-column.swal2-top-start{align-items:flex-start}.swal2-container.swal2-grow-column.swal2-bottom-end,.swal2-container.swal2-grow-column.swal2-bottom-right,.swal2-container.swal2-grow-column.swal2-center-end,.swal2-container.swal2-grow-column.swal2-center-right,.swal2-container.swal2-grow-column.swal2-top-end,.swal2-container.swal2-grow-column.swal2-top-right{align-items:flex-end}.swal2-container.swal2-grow-column>.swal2-modal{display:flex!important;flex:1;align-content:center;justify-content:center}.swal2-container:not(.swal2-top):not(.swal2-top-start):not(.swal2-top-end):not(.swal2-top-left):not(.swal2-top-right):not(.swal2-center-start):not(.swal2-center-end):not(.swal2-center-left):not(.swal2-center-right):not(.swal2-bottom):not(.swal2-bottom-start):not(.swal2-bottom-end):not(.swal2-bottom-left):not(.swal2-bottom-right):not(.swal2-grow-fullscreen)>.swal2-modal{margin:auto}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.swal2-container .swal2-modal{margin:0!important}}.swal2-container.swal2-fade{transition:background-color .1s}.swal2-container.swal2-shown{background-color:rgba(0,0,0,.4)}.swal2-popup{display:none;position:relative;flex-direction:column;justify-content:center;width:32em;max-width:100%;padding:1.25em;border-radius:.3125em;background:#fff;font-family:inherit;font-size:1rem;box-sizing:border-box}.swal2-popup:focus{outline:0}.swal2-popup.swal2-loading{overflow-y:hidden}.swal2-popup .swal2-header{display:flex;flex-direction:column;align-items:center}.swal2-popup .swal2-title{display:block;position:relative;max-width:100%;margin:0 0 .4em;padding:0;color:#595959;font-size:1.875em;font-weight:600;text-align:center;text-transform:none;word-wrap:break-word}.swal2-popup .swal2-actions{flex-wrap:wrap;align-items:center;justify-content:center;margin:1.25em auto 0;z-index:1}.swal2-popup .swal2-actions:not(.swal2-loading) .swal2-styled[disabled]{opacity:.4}.swal2-popup .swal2-actions:not(.swal2-loading) .swal2-styled:hover{background-image:linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1))}.swal2-popup .swal2-actions:not(.swal2-loading) .swal2-styled:active{background-image:linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2))}.swal2-popup .swal2-actions.swal2-loading .swal2-styled.swal2-confirm{width:2.5em;height:2.5em;margin:.46875em;padding:0;border:.25em solid transparent;border-radius:100%;border-color:transparent;background-color:transparent!important;color:transparent;cursor:default;box-sizing:border-box;-webkit-animation:swal2-rotate-loading 1.5s linear 0s infinite normal;animation:swal2-rotate-loading 1.5s linear 0s infinite normal;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.swal2-popup .swal2-actions.swal2-loading .swal2-styled.swal2-cancel{margin-right:30px;margin-left:30px}.swal2-popup .swal2-actions.swal2-loading :not(.swal2-styled).swal2-confirm::after{display:inline-block;width:15px;height:15px;margin-left:5px;border:3px solid #999;border-radius:50%;border-right-color:transparent;box-shadow:1px 1px 1px #fff;content:'';-webkit-animation:swal2-rotate-loading 1.5s linear 0s infinite normal;animation:swal2-rotate-loading 1.5s linear 0s infinite normal}.swal2-popup .swal2-styled{margin:.3125em;padding:.625em 2em;font-weight:500;box-shadow:none}.swal2-popup .swal2-styled:not([disabled]){cursor:pointer}.swal2-popup .swal2-styled.swal2-confirm{border:0;border-radius:.25em;background:initial;background-color:#3085d6;color:#fff;font-size:1.0625em}.swal2-popup .swal2-styled.swal2-cancel{border:0;border-radius:.25em;background:initial;background-color:#aaa;color:#fff;font-size:1.0625em}.swal2-popup .swal2-styled:focus{outline:0;box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(50,100,150,.4)}.swal2-popup .swal2-styled::-moz-focus-inner{border:0}.swal2-popup .swal2-footer{justify-content:center;margin:1.25em 0 0;padding:1em 0 0;border-top:1px solid #eee;color:#545454;font-size:1em}.swal2-popup .swal2-image{max-width:100%;margin:1.25em auto}.swal2-popup .swal2-close{position:absolute;top:0;right:0;justify-content:center;width:1.2em;height:1.2em;padding:0;transition:color .1s ease-out;border:none;border-radius:0;outline:initial;background:0 0;color:#ccc;font-family:serif;font-size:2.5em;line-height:1.2;cursor:pointer;overflow:hidden}.swal2-popup .swal2-close:hover{-webkit-transform:none;transform:none;color:#f27474}.swal2-popup>.swal2-checkbox,.swal2-popup>.swal2-file,.swal2-popup>.swal2-input,.swal2-popup>.swal2-radio,.swal2-popup>.swal2-select,.swal2-popup>.swal2-textarea{display:none}.swal2-popup .swal2-content{justify-content:center;margin:0;padding:0;color:#545454;font-size:1.125em;font-weight:300;line-height:normal;z-index:1;word-wrap:break-word}.swal2-popup #swal2-content{text-align:center}.swal2-popup .swal2-checkbox,.swal2-popup .swal2-file,.swal2-popup .swal2-input,.swal2-popup .swal2-radio,.swal2-popup .swal2-select,.swal2-popup .swal2-textarea{margin:1em auto}.swal2-popup .swal2-file,.swal2-popup .swal2-input,.swal2-popup .swal2-textarea{width:100%;transition:border-color .3s,box-shadow .3s;border:1px solid #d9d9d9;border-radius:.1875em;font-size:1.125em;box-shadow:inset 0 1px 1px rgba(0,0,0,.06);box-sizing:border-box}.swal2-popup .swal2-file.swal2-inputerror,.swal2-popup .swal2-input.swal2-inputerror,.swal2-popup .swal2-textarea.swal2-inputerror{border-color:#f27474!important;box-shadow:0 0 2px #f27474!important}.swal2-popup .swal2-file:focus,.swal2-popup .swal2-input:focus,.swal2-popup .swal2-textarea:focus{border:1px solid #b4dbed;outline:0;box-shadow:0 0 3px #c4e6f5}.swal2-popup .swal2-file::-webkit-input-placeholder,.swal2-popup .swal2-input::-webkit-input-placeholder,.swal2-popup .swal2-textarea::-webkit-input-placeholder{color:#ccc}.swal2-popup .swal2-file:-ms-input-placeholder,.swal2-popup .swal2-input:-ms-input-placeholder,.swal2-popup .swal2-textarea:-ms-input-placeholder{color:#ccc}.swal2-popup .swal2-file::-ms-input-placeholder,.swal2-popup .swal2-input::-ms-input-placeholder,.swal2-popup .swal2-textarea::-ms-input-placeholder{color:#ccc}.swal2-popup .swal2-file::placeholder,.swal2-popup .swal2-input::placeholder,.swal2-popup .swal2-textarea::placeholder{color:#ccc}.swal2-popup .swal2-range input{width:80%}.swal2-popup .swal2-range output{width:20%;font-weight:600;text-align:center}.swal2-popup .swal2-range input,.swal2-popup .swal2-range output{height:2.625em;margin:1em auto;padding:0;font-size:1.125em;line-height:2.625em}.swal2-popup .swal2-input{height:2.625em;padding:0 .75em}.swal2-popup .swal2-input[type=number]{max-width:10em}.swal2-popup .swal2-file{font-size:1.125em}.swal2-popup .swal2-textarea{height:6.75em;padding:.75em}.swal2-popup .swal2-select{min-width:50%;max-width:100%;padding:.375em .625em;color:#545454;font-size:1.125em}.swal2-popup .swal2-checkbox,.swal2-popup .swal2-radio{align-items:center;justify-content:center}.swal2-popup .swal2-checkbox label,.swal2-popup .swal2-radio label{margin:0 .6em;font-size:1.125em}.swal2-popup .swal2-checkbox input,.swal2-popup .swal2-radio input{margin:0 .4em}.swal2-popup .swal2-validation-message{display:none;align-items:center;justify-content:center;padding:.625em;background:#f0f0f0;color:#666;font-size:1em;font-weight:300;overflow:hidden}.swal2-popup .swal2-validation-message::before{display:inline-block;width:1.5em;min-width:1.5em;height:1.5em;margin:0 .625em;border-radius:50%;background-color:#f27474;color:#fff;font-weight:600;line-height:1.5em;text-align:center;content:'!';zoom:normal}@supports (-ms-accelerator:true){.swal2-range input{width:100%!important}.swal2-range output{display:none}}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.swal2-range input{width:100%!important}.swal2-range output{display:none}}@-moz-document url-prefix(){.swal2-close:focus{outline:2px solid rgba(50,100,150,.4)}}.swal2-icon{position:relative;justify-content:center;width:5em;height:5em;margin:1.25em auto 1.875em;border:.25em solid transparent;border-radius:50%;line-height:5em;cursor:default;box-sizing:content-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;zoom:normal}.swal2-icon-text{font-size:3.75em}.swal2-icon.swal2-error{border-color:#f27474}.swal2-icon.swal2-error .swal2-x-mark{position:relative;flex-grow:1}.swal2-icon.swal2-error [class^=swal2-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left]{left:1.0625em;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right]{right:1em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.swal2-icon.swal2-warning{border-color:#facea8;color:#f8bb86}.swal2-icon.swal2-info{border-color:#9de0f6;color:#3fc3ee}.swal2-icon.swal2-question{border-color:#c9dae1;color:#87adbd}.swal2-icon.swal2-success{border-color:#a5dc86}.swal2-icon.swal2-success [class^=swal2-success-circular-line]{position:absolute;width:3.75em;height:7.5em;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-radius:50%}.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:3.75em 3.75em;transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=right]{top:-.6875em;left:1.875em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:0 3.75em;transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.swal2-icon.swal2-success .swal2-success-ring{position:absolute;top:-.25em;left:-.25em;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%;z-index:2;box-sizing:content-box}.swal2-icon.swal2-success .swal2-success-fix{position:absolute;top:.5em;left:1.625em;width:.4375em;height:5.625em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);z-index:1}.swal2-icon.swal2-success [class^=swal2-success-line]{display:block;position:absolute;height:.3125em;border-radius:.125em;background-color:#a5dc86;z-index:2}.swal2-icon.swal2-success [class^=swal2-success-line][class$=tip]{top:2.875em;left:.875em;width:1.5625em;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.swal2-icon.swal2-success [class^=swal2-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.swal2-progresssteps{align-items:center;margin:0 0 1.25em;padding:0;font-weight:600}.swal2-progresssteps li{display:inline-block;position:relative}.swal2-progresssteps .swal2-progresscircle{width:2em;height:2em;border-radius:2em;background:#3085d6;color:#fff;line-height:2em;text-align:center;z-index:20}.swal2-progresssteps .swal2-progresscircle:first-child{margin-left:0}.swal2-progresssteps .swal2-progresscircle:last-child{margin-right:0}.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep{background:#3085d6}.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep~.swal2-progresscircle{background:#add8e6}.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep~.swal2-progressline{background:#add8e6}.swal2-progresssteps .swal2-progressline{width:2.5em;height:.4em;margin:0 -1px;background:#3085d6;z-index:10}[class^=swal2]{-webkit-tap-highlight-color:transparent}.swal2-show{-webkit-animation:swal2-show .3s;animation:swal2-show .3s}.swal2-show.swal2-noanimation{-webkit-animation:none;animation:none}.swal2-hide{-webkit-animation:swal2-hide .15s forwards;animation:swal2-hide .15s forwards}.swal2-hide.swal2-noanimation{-webkit-animation:none;animation:none}.swal2-rtl .swal2-close{right:auto;left:0}.swal2-animate-success-icon .swal2-success-line-tip{-webkit-animation:swal2-animate-success-line-tip .75s;animation:swal2-animate-success-line-tip .75s}.swal2-animate-success-icon .swal2-success-line-long{-webkit-animation:swal2-animate-success-line-long .75s;animation:swal2-animate-success-line-long .75s}.swal2-animate-success-icon .swal2-success-circular-line-right{-webkit-animation:swal2-rotate-success-circular-line 4.25s ease-in;animation:swal2-rotate-success-circular-line 4.25s ease-in}.swal2-animate-error-icon{-webkit-animation:swal2-animate-error-icon .5s;animation:swal2-animate-error-icon .5s}.swal2-animate-error-icon .swal2-x-mark{-webkit-animation:swal2-animate-error-x-mark .5s;animation:swal2-animate-error-x-mark .5s}@-webkit-keyframes swal2-rotate-loading{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swal2-rotate-loading{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@media print{body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown){overflow-y:scroll!important}body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown)>[aria-hidden=true]{display:none}body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) .swal2-container{position:initial!important}}
/*!
 * Quill Editor v1.3.6
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: '\2022';
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: '\2611';
}
.ql-editor ul[data-checked=false] > li::before {
  content: '\2610';
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) '. ';
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) '. ';
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family: Georgia, Times New Roman, serif;
}
.ql-editor .ql-font-monospace {
  font-family: Monaco, Courier New, monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0,0,0,0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}

/*!
 * Quill Editor v1.3.6
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: '\2022';
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: '\2611';
}
.ql-editor ul[data-checked=false] > li::before {
  content: '\2610';
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) '. ';
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) '. ';
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family: Georgia, Times New Roman, serif;
}
.ql-editor .ql-font-monospace {
  font-family: Monaco, Courier New, monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0,0,0,0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}
.ql-bubble.ql-toolbar:after,
.ql-bubble .ql-toolbar:after {
  clear: both;
  content: '';
  display: table;
}
.ql-bubble.ql-toolbar button,
.ql-bubble .ql-toolbar button {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  float: left;
  height: 24px;
  padding: 3px 5px;
  width: 28px;
}
.ql-bubble.ql-toolbar button svg,
.ql-bubble .ql-toolbar button svg {
  float: left;
  height: 100%;
}
.ql-bubble.ql-toolbar button:active:hover,
.ql-bubble .ql-toolbar button:active:hover {
  outline: none;
}
.ql-bubble.ql-toolbar input.ql-image[type=file],
.ql-bubble .ql-toolbar input.ql-image[type=file] {
  display: none;
}
.ql-bubble.ql-toolbar button:hover,
.ql-bubble .ql-toolbar button:hover,
.ql-bubble.ql-toolbar button:focus,
.ql-bubble .ql-toolbar button:focus,
.ql-bubble.ql-toolbar button.ql-active,
.ql-bubble .ql-toolbar button.ql-active,
.ql-bubble.ql-toolbar .ql-picker-label:hover,
.ql-bubble .ql-toolbar .ql-picker-label:hover,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active,
.ql-bubble.ql-toolbar .ql-picker-item:hover,
.ql-bubble .ql-toolbar .ql-picker-item:hover,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected {
  color: #fff;
}
.ql-bubble.ql-toolbar button:hover .ql-fill,
.ql-bubble .ql-toolbar button:hover .ql-fill,
.ql-bubble.ql-toolbar button:focus .ql-fill,
.ql-bubble .ql-toolbar button:focus .ql-fill,
.ql-bubble.ql-toolbar button.ql-active .ql-fill,
.ql-bubble .ql-toolbar button.ql-active .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-bubble.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: #fff;
}
.ql-bubble.ql-toolbar button:hover .ql-stroke,
.ql-bubble .ql-toolbar button:hover .ql-stroke,
.ql-bubble.ql-toolbar button:focus .ql-stroke,
.ql-bubble .ql-toolbar button:focus .ql-stroke,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-bubble.ql-toolbar button:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar button:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar button:focus .ql-stroke-miter,
.ql-bubble .ql-toolbar button:focus .ql-stroke-miter,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: #fff;
}
@media (pointer: coarse) {
  .ql-bubble.ql-toolbar button:hover:not(.ql-active),
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) {
    color: #ccc;
  }
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
    fill: #ccc;
  }
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
    stroke: #ccc;
  }
}
.ql-bubble {
  box-sizing: border-box;
}
.ql-bubble * {
  box-sizing: border-box;
}
.ql-bubble .ql-hidden {
  display: none;
}
.ql-bubble .ql-out-bottom,
.ql-bubble .ql-out-top {
  visibility: hidden;
}
.ql-bubble .ql-tooltip {
  position: absolute;
  transform: translateY(10px);
}
.ql-bubble .ql-tooltip a {
  cursor: pointer;
  text-decoration: none;
}
.ql-bubble .ql-tooltip.ql-flip {
  transform: translateY(-10px);
}
.ql-bubble .ql-formats {
  display: inline-block;
  vertical-align: middle;
}
.ql-bubble .ql-formats:after {
  clear: both;
  content: '';
  display: table;
}
.ql-bubble .ql-stroke {
  fill: none;
  stroke: #ccc;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.ql-bubble .ql-stroke-miter {
  fill: none;
  stroke: #ccc;
  stroke-miterlimit: 10;
  stroke-width: 2;
}
.ql-bubble .ql-fill,
.ql-bubble .ql-stroke.ql-fill {
  fill: #ccc;
}
.ql-bubble .ql-empty {
  fill: none;
}
.ql-bubble .ql-even {
  fill-rule: evenodd;
}
.ql-bubble .ql-thin,
.ql-bubble .ql-stroke.ql-thin {
  stroke-width: 1;
}
.ql-bubble .ql-transparent {
  opacity: 0.4;
}
.ql-bubble .ql-direction svg:last-child {
  display: none;
}
.ql-bubble .ql-direction.ql-active svg:last-child {
  display: inline;
}
.ql-bubble .ql-direction.ql-active svg:first-child {
  display: none;
}
.ql-bubble .ql-editor h1 {
  font-size: 2em;
}
.ql-bubble .ql-editor h2 {
  font-size: 1.5em;
}
.ql-bubble .ql-editor h3 {
  font-size: 1.17em;
}
.ql-bubble .ql-editor h4 {
  font-size: 1em;
}
.ql-bubble .ql-editor h5 {
  font-size: 0.83em;
}
.ql-bubble .ql-editor h6 {
  font-size: 0.67em;
}
.ql-bubble .ql-editor a {
  text-decoration: underline;
}
.ql-bubble .ql-editor blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}
.ql-bubble .ql-editor code,
.ql-bubble .ql-editor pre {
  background-color: #f0f0f0;
  border-radius: 3px;
}
.ql-bubble .ql-editor pre {
  white-space: pre-wrap;
  margin-bottom: 5px;
  margin-top: 5px;
  padding: 5px 10px;
}
.ql-bubble .ql-editor code {
  font-size: 85%;
  padding: 2px 4px;
}
.ql-bubble .ql-editor pre.ql-syntax {
  background-color: #23241f;
  color: #f8f8f2;
  overflow: visible;
}
.ql-bubble .ql-editor img {
  max-width: 100%;
}
.ql-bubble .ql-picker {
  color: #ccc;
  display: inline-block;
  float: left;
  font-size: 14px;
  font-weight: 500;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.ql-bubble .ql-picker-label {
  cursor: pointer;
  display: inline-block;
  height: 100%;
  padding-left: 8px;
  padding-right: 2px;
  position: relative;
  width: 100%;
}
.ql-bubble .ql-picker-label::before {
  display: inline-block;
  line-height: 22px;
}
.ql-bubble .ql-picker-options {
  background-color: #444;
  display: none;
  min-width: 100%;
  padding: 4px 8px;
  position: absolute;
  white-space: nowrap;
}
.ql-bubble .ql-picker-options .ql-picker-item {
  cursor: pointer;
  display: block;
  padding-bottom: 5px;
  padding-top: 5px;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-label {
  color: #777;
  z-index: 2;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-fill {
  fill: #777;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: #777;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-options {
  display: block;
  margin-top: -1px;
  top: 100%;
  z-index: 1;
}
.ql-bubble .ql-color-picker,
.ql-bubble .ql-icon-picker {
  width: 28px;
}
.ql-bubble .ql-color-picker .ql-picker-label,
.ql-bubble .ql-icon-picker .ql-picker-label {
  padding: 2px 4px;
}
.ql-bubble .ql-color-picker .ql-picker-label svg,
.ql-bubble .ql-icon-picker .ql-picker-label svg {
  right: 4px;
}
.ql-bubble .ql-icon-picker .ql-picker-options {
  padding: 4px 0px;
}
.ql-bubble .ql-icon-picker .ql-picker-item {
  height: 24px;
  width: 24px;
  padding: 2px 4px;
}
.ql-bubble .ql-color-picker .ql-picker-options {
  padding: 3px 5px;
  width: 152px;
}
.ql-bubble .ql-color-picker .ql-picker-item {
  border: 1px solid transparent;
  float: left;
  height: 16px;
  margin: 2px;
  padding: 0px;
  width: 16px;
}
.ql-bubble .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  position: absolute;
  margin-top: -9px;
  right: 0;
  top: 50%;
  width: 18px;
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-bubble .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before {
  content: attr(data-label);
}
.ql-bubble .ql-picker.ql-header {
  width: 98px;
}
.ql-bubble .ql-picker.ql-header .ql-picker-label::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item::before {
  content: 'Normal';
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: 'Heading 1';
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: 'Heading 2';
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: 'Heading 3';
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: 'Heading 4';
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: 'Heading 5';
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: 'Heading 6';
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  font-size: 2em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  font-size: 1.5em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  font-size: 1.17em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  font-size: 1em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  font-size: 0.83em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  font-size: 0.67em;
}
.ql-bubble .ql-picker.ql-font {
  width: 108px;
}
.ql-bubble .ql-picker.ql-font .ql-picker-label::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item::before {
  content: 'Sans Serif';
}
.ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  content: 'Serif';
}
.ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  content: 'Monospace';
}
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  font-family: Georgia, Times New Roman, serif;
}
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  font-family: Monaco, Courier New, monospace;
}
.ql-bubble .ql-picker.ql-size {
  width: 98px;
}
.ql-bubble .ql-picker.ql-size .ql-picker-label::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item::before {
  content: 'Normal';
}
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  content: 'Small';
}
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  content: 'Large';
}
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  content: 'Huge';
}
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  font-size: 10px;
}
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  font-size: 18px;
}
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  font-size: 32px;
}
.ql-bubble .ql-color-picker.ql-background .ql-picker-item {
  background-color: #fff;
}
.ql-bubble .ql-color-picker.ql-color .ql-picker-item {
  background-color: #000;
}
.ql-bubble .ql-toolbar .ql-formats {
  margin: 8px 12px 8px 0px;
}
.ql-bubble .ql-toolbar .ql-formats:first-child {
  margin-left: 12px;
}
.ql-bubble .ql-color-picker svg {
  margin: 1px;
}
.ql-bubble .ql-color-picker .ql-picker-item.ql-selected,
.ql-bubble .ql-color-picker .ql-picker-item:hover {
  border-color: #fff;
}
.ql-bubble .ql-tooltip {
  background-color: #444;
  border-radius: 25px;
  color: #fff;
}
.ql-bubble .ql-tooltip-arrow {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  content: " ";
  display: block;
  left: 50%;
  margin-left: -6px;
  position: absolute;
}
.ql-bubble .ql-tooltip:not(.ql-flip) .ql-tooltip-arrow {
  border-bottom: 6px solid #444;
  top: -6px;
}
.ql-bubble .ql-tooltip.ql-flip .ql-tooltip-arrow {
  border-top: 6px solid #444;
  bottom: -6px;
}
.ql-bubble .ql-tooltip.ql-editing .ql-tooltip-editor {
  display: block;
}
.ql-bubble .ql-tooltip.ql-editing .ql-formats {
  visibility: hidden;
}
.ql-bubble .ql-tooltip-editor {
  display: none;
}
.ql-bubble .ql-tooltip-editor input[type=text] {
  background: transparent;
  border: none;
  color: #fff;
  font-size: 13px;
  height: 100%;
  outline: none;
  padding: 10px 20px;
  position: absolute;
  width: 100%;
}
.ql-bubble .ql-tooltip-editor a {
  top: 10px;
  position: absolute;
  right: 20px;
}
.ql-bubble .ql-tooltip-editor a:before {
  color: #ccc;
  content: "\D7";
  font-size: 16px;
  font-weight: bold;
}
.ql-container.ql-bubble:not(.ql-disabled) a {
  position: relative;
  white-space: nowrap;
}
.ql-container.ql-bubble:not(.ql-disabled) a::before {
  background-color: #444;
  border-radius: 15px;
  top: -5px;
  font-size: 12px;
  color: #fff;
  content: attr(href);
  font-weight: normal;
  overflow: hidden;
  padding: 5px 15px;
  text-decoration: none;
  z-index: 1;
}
.ql-container.ql-bubble:not(.ql-disabled) a::after {
  border-top: 6px solid #444;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  top: 0;
  content: " ";
  height: 0;
  width: 0;
}
.ql-container.ql-bubble:not(.ql-disabled) a::before,
.ql-container.ql-bubble:not(.ql-disabled) a::after {
  left: 0;
  margin-left: 50%;
  position: absolute;
  transform: translate(-50%, -100%);
  transition: visibility 0s ease 200ms;
  visibility: hidden;
}
.ql-container.ql-bubble:not(.ql-disabled) a:hover::before,
.ql-container.ql-bubble:not(.ql-disabled) a:hover::after {
  visibility: visible;
}

/*!
 * Quill Editor v1.3.6
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: '\2022';
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: '\2611';
}
.ql-editor ul[data-checked=false] > li::before {
  content: '\2610';
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) '. ';
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) '. ';
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family: Georgia, Times New Roman, serif;
}
.ql-editor .ql-font-monospace {
  font-family: Monaco, Courier New, monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0,0,0,0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}
.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  float: left;
  height: 24px;
  padding: 3px 5px;
  width: 28px;
}
.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
  float: left;
  height: 100%;
}
.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
  outline: none;
}
.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
  display: none;
}
.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  color: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: #06c;
}
@media (pointer: coarse) {
  .ql-snow.ql-toolbar button:hover:not(.ql-active),
  .ql-snow .ql-toolbar button:hover:not(.ql-active) {
    color: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
    fill: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
    stroke: #444;
  }
}
.ql-snow {
  box-sizing: border-box;
}
.ql-snow * {
  box-sizing: border-box;
}
.ql-snow .ql-hidden {
  display: none;
}
.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
  visibility: hidden;
}
.ql-snow .ql-tooltip {
  position: absolute;
  transform: translateY(10px);
}
.ql-snow .ql-tooltip a {
  cursor: pointer;
  text-decoration: none;
}
.ql-snow .ql-tooltip.ql-flip {
  transform: translateY(-10px);
}
.ql-snow .ql-formats {
  display: inline-block;
  vertical-align: middle;
}
.ql-snow .ql-formats:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow .ql-stroke {
  fill: none;
  stroke: #444;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.ql-snow .ql-stroke-miter {
  fill: none;
  stroke: #444;
  stroke-miterlimit: 10;
  stroke-width: 2;
}
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
  fill: #444;
}
.ql-snow .ql-empty {
  fill: none;
}
.ql-snow .ql-even {
  fill-rule: evenodd;
}
.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
  stroke-width: 1;
}
.ql-snow .ql-transparent {
  opacity: 0.4;
}
.ql-snow .ql-direction svg:last-child {
  display: none;
}
.ql-snow .ql-direction.ql-active svg:last-child {
  display: inline;
}
.ql-snow .ql-direction.ql-active svg:first-child {
  display: none;
}
.ql-snow .ql-editor h1 {
  font-size: 2em;
}
.ql-snow .ql-editor h2 {
  font-size: 1.5em;
}
.ql-snow .ql-editor h3 {
  font-size: 1.17em;
}
.ql-snow .ql-editor h4 {
  font-size: 1em;
}
.ql-snow .ql-editor h5 {
  font-size: 0.83em;
}
.ql-snow .ql-editor h6 {
  font-size: 0.67em;
}
.ql-snow .ql-editor a {
  text-decoration: underline;
}
.ql-snow .ql-editor blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}
.ql-snow .ql-editor code,
.ql-snow .ql-editor pre {
  background-color: #f0f0f0;
  border-radius: 3px;
}
.ql-snow .ql-editor pre {
  white-space: pre-wrap;
  margin-bottom: 5px;
  margin-top: 5px;
  padding: 5px 10px;
}
.ql-snow .ql-editor code {
  font-size: 85%;
  padding: 2px 4px;
}
.ql-snow .ql-editor pre.ql-syntax {
  background-color: #23241f;
  color: #f8f8f2;
  overflow: visible;
}
.ql-snow .ql-editor img {
  max-width: 100%;
}
.ql-snow .ql-picker {
  color: #444;
  display: inline-block;
  float: left;
  font-size: 14px;
  font-weight: 500;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.ql-snow .ql-picker-label {
  cursor: pointer;
  display: inline-block;
  height: 100%;
  padding-left: 8px;
  padding-right: 2px;
  position: relative;
  width: 100%;
}
.ql-snow .ql-picker-label::before {
  display: inline-block;
  line-height: 22px;
}
.ql-snow .ql-picker-options {
  background-color: #fff;
  display: none;
  min-width: 100%;
  padding: 4px 8px;
  position: absolute;
  white-space: nowrap;
}
.ql-snow .ql-picker-options .ql-picker-item {
  cursor: pointer;
  display: block;
  padding-bottom: 5px;
  padding-top: 5px;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  color: #ccc;
  z-index: 2;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
  fill: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  display: block;
  margin-top: -1px;
  top: 100%;
  z-index: 1;
}
.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
  width: 28px;
}
.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
  right: 4px;
}
.ql-snow .ql-icon-picker .ql-picker-options {
  padding: 4px 0px;
}
.ql-snow .ql-icon-picker .ql-picker-item {
  height: 24px;
  width: 24px;
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-options {
  padding: 3px 5px;
  width: 152px;
}
.ql-snow .ql-color-picker .ql-picker-item {
  border: 1px solid transparent;
  float: left;
  height: 16px;
  margin: 2px;
  padding: 0px;
  width: 16px;
}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  position: absolute;
  margin-top: -9px;
  right: 0;
  top: 50%;
  width: 18px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before {
  content: attr(data-label);
}
.ql-snow .ql-picker.ql-header {
  width: 98px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: 'Heading 1';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: 'Heading 2';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: 'Heading 3';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: 'Heading 4';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: 'Heading 5';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: 'Heading 6';
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  font-size: 2em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  font-size: 1.5em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  font-size: 1.17em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  font-size: 1em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  font-size: 0.83em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  font-size: 0.67em;
}
.ql-snow .ql-picker.ql-font {
  width: 108px;
}
.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
  content: 'Sans Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  content: 'Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  content: 'Monospace';
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  font-family: Georgia, Times New Roman, serif;
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  font-family: Monaco, Courier New, monospace;
}
.ql-snow .ql-picker.ql-size {
  width: 98px;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  content: 'Small';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  content: 'Large';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  content: 'Huge';
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  font-size: 10px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  font-size: 18px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  font-size: 32px;
}
.ql-snow .ql-color-picker.ql-background .ql-picker-item {
  background-color: #fff;
}
.ql-snow .ql-color-picker.ql-color .ql-picker-item {
  background-color: #000;
}
.ql-toolbar.ql-snow {
  border: 1px solid #ccc;
  box-sizing: border-box;
  font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  padding: 8px;
}
.ql-toolbar.ql-snow .ql-formats {
  margin-right: 15px;
}
.ql-toolbar.ql-snow .ql-picker-label {
  border: 1px solid transparent;
}
.ql-toolbar.ql-snow .ql-picker-options {
  border: 1px solid transparent;
  box-shadow: rgba(0,0,0,0.2) 0 2px 8px;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
  border-color: #000;
}
.ql-toolbar.ql-snow + .ql-container.ql-snow {
  border-top: 0px;
}
.ql-snow .ql-tooltip {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0px 0px 5px #ddd;
  color: #444;
  padding: 5px 12px;
  white-space: nowrap;
}
.ql-snow .ql-tooltip::before {
  content: "Visit URL:";
  line-height: 26px;
  margin-right: 8px;
}
.ql-snow .ql-tooltip input[type=text] {
  display: none;
  border: 1px solid #ccc;
  font-size: 13px;
  height: 26px;
  margin: 0px;
  padding: 3px 5px;
  width: 170px;
}
.ql-snow .ql-tooltip a.ql-preview {
  display: inline-block;
  max-width: 200px;
  overflow-x: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.ql-snow .ql-tooltip a.ql-action::after {
  border-right: 1px solid #ccc;
  content: 'Edit';
  margin-left: 16px;
  padding-right: 8px;
}
.ql-snow .ql-tooltip a.ql-remove::before {
  content: 'Remove';
  margin-left: 8px;
}
.ql-snow .ql-tooltip a {
  line-height: 26px;
}
.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
  display: none;
}
.ql-snow .ql-tooltip.ql-editing input[type=text] {
  display: inline-block;
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
  border-right: 0px;
  content: 'Save';
  padding-right: 0px;
}
.ql-snow .ql-tooltip[data-mode=link]::before {
  content: "Enter link:";
}
.ql-snow .ql-tooltip[data-mode=formula]::before {
  content: "Enter formula:";
}
.ql-snow .ql-tooltip[data-mode=video]::before {
  content: "Enter video:";
}
.ql-snow a {
  color: #06c;
}
.ql-container.ql-snow {
  border: 1px solid #ccc;
}

body.compensate-for-scrollbar{overflow:hidden}.fancybox-active{height:auto}.fancybox-is-hidden{left:-9999px;margin:0;position:absolute!important;top:-9999px;visibility:hidden}.fancybox-container{-webkit-backface-visibility:hidden;height:100%;left:0;outline:none;position:fixed;-webkit-tap-highlight-color:transparent;top:0;-ms-touch-action:manipulation;touch-action:manipulation;transform:translateZ(0);width:100%;z-index:99992}.fancybox-container *{box-sizing:border-box}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{bottom:0;left:0;position:absolute;right:0;top:0}.fancybox-outer{-webkit-overflow-scrolling:touch;overflow-y:auto}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.9;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption,.fancybox-infobar,.fancybox-navigation .fancybox-button,.fancybox-toolbar{direction:ltr;opacity:0;position:absolute;transition:opacity .25s ease,visibility 0s ease .25s;visibility:hidden;z-index:99997}.fancybox-show-caption .fancybox-caption,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-nav .fancybox-navigation .fancybox-button,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;transition:opacity .25s ease 0s,visibility 0s ease 0s;visibility:visible}.fancybox-infobar{color:#ccc;font-size:13px;-webkit-font-smoothing:subpixel-antialiased;height:44px;left:0;line-height:44px;min-width:44px;mix-blend-mode:difference;padding:0 10px;pointer-events:none;top:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-toolbar{right:0;top:0}.fancybox-stage{direction:ltr;overflow:visible;transform:translateZ(0);z-index:99994}.fancybox-is-open .fancybox-stage{overflow:hidden}.fancybox-slide{-webkit-backface-visibility:hidden;display:none;height:100%;left:0;outline:none;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:absolute;text-align:center;top:0;transition-property:transform,opacity;white-space:normal;width:100%;z-index:99994}.fancybox-slide:before{content:"";display:inline-block;font-size:0;height:100%;vertical-align:middle;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:hidden;padding:44px 0}.fancybox-slide--image:before{display:none}.fancybox-slide--html{padding:6px}.fancybox-content{background:#fff;display:inline-block;margin:0;max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:relative;text-align:left;vertical-align:middle}.fancybox-slide--image .fancybox-content{animation-timing-function:cubic-bezier(.5,0,.14,1);-webkit-backface-visibility:hidden;background:transparent;background-repeat:no-repeat;background-size:100% 100%;left:0;max-width:none;overflow:visible;padding:0;position:absolute;top:0;transform-origin:top left;transition-property:transform,opacity;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:99995}.fancybox-can-zoomOut .fancybox-content{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-content{cursor:zoom-in}.fancybox-can-pan .fancybox-content,.fancybox-can-swipe .fancybox-content{cursor:grab}.fancybox-is-grabbing .fancybox-content{cursor:grabbing}.fancybox-container [data-selectable=true]{cursor:text}.fancybox-image,.fancybox-spaceball{background:transparent;border:0;height:100%;left:0;margin:0;max-height:none;max-width:none;padding:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content,.fancybox-slide--map .fancybox-content,.fancybox-slide--pdf .fancybox-content,.fancybox-slide--video .fancybox-content{height:100%;overflow:visible;padding:0;width:100%}.fancybox-slide--video .fancybox-content{background:#000}.fancybox-slide--map .fancybox-content{background:#e5e3df}.fancybox-slide--iframe .fancybox-content{background:#fff}.fancybox-iframe,.fancybox-video{background:transparent;border:0;display:block;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.fancybox-iframe{left:0;position:absolute;top:0}.fancybox-error{background:#fff;cursor:default;max-width:400px;padding:40px;width:100%}.fancybox-error p{color:#444;font-size:16px;line-height:20px;margin:0;padding:0}.fancybox-button{background:rgba(30,30,30,.6);border:0;border-radius:0;box-shadow:none;cursor:pointer;display:inline-block;height:44px;margin:0;padding:10px;position:relative;transition:color .2s;vertical-align:top;visibility:inherit;width:44px}.fancybox-button,.fancybox-button:link,.fancybox-button:visited{color:#ccc}.fancybox-button:hover{color:#fff}.fancybox-button:focus{outline:none}.fancybox-button.fancybox-focus{outline:1px dotted}.fancybox-button[disabled],.fancybox-button[disabled]:hover{color:#888;cursor:default;outline:none}.fancybox-button div{height:100%}.fancybox-button svg{display:block;height:100%;overflow:visible;position:relative;width:100%}.fancybox-button svg path{fill:currentColor;stroke-width:0}.fancybox-button--fsenter svg:nth-child(2),.fancybox-button--fsexit svg:first-child,.fancybox-button--pause svg:first-child,.fancybox-button--play svg:nth-child(2){display:none}.fancybox-progress{background:#ff5268;height:2px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:0;transition-property:transform;transition-timing-function:linear;z-index:99998}.fancybox-close-small{background:transparent;border:0;border-radius:0;color:#ccc;cursor:pointer;opacity:.8;padding:8px;position:absolute;right:-12px;top:-44px;z-index:401}.fancybox-close-small:hover{color:#fff;opacity:1}.fancybox-slide--html .fancybox-close-small{color:currentColor;padding:10px;right:0;top:0}.fancybox-slide--image.fancybox-is-scaling .fancybox-content{overflow:hidden}.fancybox-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small{display:none}.fancybox-navigation .fancybox-button{background-clip:content-box;height:100px;opacity:0;position:absolute;top:calc(50% - 50px);width:70px}.fancybox-navigation .fancybox-button div{padding:7px}.fancybox-navigation .fancybox-button--arrow_left{left:0;left:env(safe-area-inset-left);padding:31px 26px 31px 6px}.fancybox-navigation .fancybox-button--arrow_right{padding:31px 6px 31px 26px;right:0;right:env(safe-area-inset-right)}.fancybox-caption{background:linear-gradient(0deg,rgba(0,0,0,.85) 0,rgba(0,0,0,.3) 50%,rgba(0,0,0,.15) 65%,rgba(0,0,0,.075) 75.5%,rgba(0,0,0,.037) 82.85%,rgba(0,0,0,.019) 88%,transparent);bottom:0;color:#eee;font-size:14px;font-weight:400;left:0;line-height:1.5;padding:75px 44px 25px;pointer-events:none;right:0;text-align:center;z-index:99996}@supports (padding:max(0px)){.fancybox-caption{padding:75px max(44px,env(safe-area-inset-right)) max(25px,env(safe-area-inset-bottom)) max(44px,env(safe-area-inset-left))}}.fancybox-caption--separate{margin-top:-50px}.fancybox-caption__body{max-height:50vh;overflow:auto;pointer-events:all}.fancybox-caption a,.fancybox-caption a:link,.fancybox-caption a:visited{color:#ccc;text-decoration:none}.fancybox-caption a:hover{color:#fff;text-decoration:underline}.fancybox-loading{animation:a 1s linear infinite;background:transparent;border:4px solid #888;border-bottom-color:#fff;border-radius:50%;height:50px;left:50%;margin:-25px 0 0 -25px;opacity:.7;padding:0;position:absolute;top:50%;width:50px;z-index:99999}@keyframes a{to{transform:rotate(1turn)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{opacity:0;transform:translate3d(-100%,0,0)}.fancybox-fx-slide.fancybox-slide--next{opacity:0;transform:translate3d(100%,0,0)}.fancybox-fx-slide.fancybox-slide--current{opacity:1;transform:translateZ(0)}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{opacity:0;transform:scale3d(1.5,1.5,1.5)}.fancybox-fx-zoom-in-out.fancybox-slide--next{opacity:0;transform:scale3d(.5,.5,.5)}.fancybox-fx-zoom-in-out.fancybox-slide--current{opacity:1;transform:scaleX(1)}.fancybox-fx-rotate.fancybox-slide--previous{opacity:0;transform:rotate(-1turn)}.fancybox-fx-rotate.fancybox-slide--next{opacity:0;transform:rotate(1turn)}.fancybox-fx-rotate.fancybox-slide--current{opacity:1;transform:rotate(0deg)}.fancybox-fx-circular.fancybox-slide--previous{opacity:0;transform:scale3d(0,0,0) translate3d(-100%,0,0)}.fancybox-fx-circular.fancybox-slide--next{opacity:0;transform:scale3d(0,0,0) translate3d(100%,0,0)}.fancybox-fx-circular.fancybox-slide--current{opacity:1;transform:scaleX(1) translateZ(0)}.fancybox-fx-tube.fancybox-slide--previous{transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{transform:translateZ(0) scale(1)}@media (max-height:576px){.fancybox-slide{padding-left:6px;padding-right:6px}.fancybox-slide--image{padding:6px 0}.fancybox-close-small{right:-6px}.fancybox-slide--image .fancybox-close-small{background:#4e4e4e;color:#f2f4f6;height:36px;opacity:1;padding:6px;right:0;top:0;width:36px}.fancybox-caption{padding-left:12px;padding-right:12px}@supports (padding:max(0px)){.fancybox-caption{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}}}.fancybox-share{background:#f4f4f4;border-radius:3px;max-width:90%;padding:30px;text-align:center}.fancybox-share h1{color:#222;font-size:35px;font-weight:700;margin:0 0 20px}.fancybox-share p{margin:0;padding:0}.fancybox-share__button{border:0;border-radius:3px;display:inline-block;font-size:14px;font-weight:700;line-height:40px;margin:0 5px 10px;min-width:130px;padding:0 15px;text-decoration:none;transition:all .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fancybox-share__button:link,.fancybox-share__button:visited{color:#fff}.fancybox-share__button:hover{text-decoration:none}.fancybox-share__button--fb{background:#3b5998}.fancybox-share__button--fb:hover{background:#344e86}.fancybox-share__button--pt{background:#bd081d}.fancybox-share__button--pt:hover{background:#aa0719}.fancybox-share__button--tw{background:#1da1f2}.fancybox-share__button--tw:hover{background:#0d95e8}.fancybox-share__button svg{height:25px;margin-right:7px;position:relative;top:-1px;vertical-align:middle;width:25px}.fancybox-share__button svg path{fill:#fff}.fancybox-share__input{background:transparent;border:0;border-bottom:1px solid #d7d7d7;border-radius:0;color:#5d5b5b;font-size:14px;margin:10px 0 0;outline:none;padding:10px 15px;width:100%}.fancybox-thumbs{background:#ddd;bottom:0;display:none;margin:0;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;padding:2px 2px 4px;position:absolute;right:0;-webkit-tap-highlight-color:rgba(0,0,0,0);top:0;width:212px;z-index:99995}.fancybox-thumbs-x{overflow-x:auto;overflow-y:hidden}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs__list{font-size:0;height:100%;list-style:none;margin:0;overflow-x:hidden;overflow-y:auto;padding:0;position:absolute;position:relative;white-space:nowrap;width:100%}.fancybox-thumbs-x .fancybox-thumbs__list{overflow:hidden}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar{width:7px}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track{background:#fff;border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:10px}.fancybox-thumbs__list a{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:rgba(0,0,0,.1);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;float:left;height:75px;margin:2px;max-height:calc(100% - 8px);max-width:calc(50% - 4px);outline:none;overflow:hidden;padding:0;position:relative;-webkit-tap-highlight-color:transparent;width:100px}.fancybox-thumbs__list a:before{border:6px solid #ff5268;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);z-index:99991}.fancybox-thumbs__list a:focus:before{opacity:.5}.fancybox-thumbs__list a.fancybox-thumbs-active:before{opacity:1}@media (max-width:576px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs__list a{max-width:calc(100% - 10px)}}
.croppie-container {
    width: 100%;
    height: 100%;
}

.croppie-container .cr-image {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    max-height: none;
    max-width: none;
}

.croppie-container .cr-boundary {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.croppie-container .cr-viewport,
.croppie-container .cr-resizer {
    position: absolute;
    border: 2px solid #fff;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    box-shadow: 0 0 2000px 2000px rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.croppie-container .cr-resizer {
  z-index: 2;
  box-shadow: none;
  pointer-events: none;
}

.croppie-container .cr-resizer-vertical,
.croppie-container .cr-resizer-horisontal {
  position: absolute;
  pointer-events: all;
}

.croppie-container .cr-resizer-vertical::after,
.croppie-container .cr-resizer-horisontal::after {
    display: block;
    position: absolute;
    box-sizing: border-box;
    border: 1px solid black;
    background: #fff;
    width: 10px;
    height: 10px;
    content: '';
}

.croppie-container .cr-resizer-vertical {
  bottom: -5px;
  cursor: row-resize;
  width: 100%;
  height: 10px;
}

.croppie-container .cr-resizer-vertical::after {
    left: 50%;
    margin-left: -5px;
}

.croppie-container .cr-resizer-horisontal {
  right: -5px;
  cursor: col-resize;
  width: 10px;
  height: 100%;
}

.croppie-container .cr-resizer-horisontal::after {
    top: 50%;
    margin-top: -5px;
}

.croppie-container .cr-original-image {
    display: none;
}

.croppie-container .cr-vp-circle {
    border-radius: 50%;
}

.croppie-container .cr-overlay {
    z-index: 1;
    position: absolute;
    cursor: move;
    touch-action: none;
}

.croppie-container .cr-slider-wrap {
    width: 75%;
    margin: 15px auto;
    text-align: center;
}

.croppie-result {
    position: relative;
    overflow: hidden;
}

.croppie-result img {
    position: absolute;
}

.croppie-container .cr-image,
.croppie-container .cr-overlay,
.croppie-container .cr-viewport {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

/*************************************/
/***** STYLING RANGE INPUT ***********/
/*************************************/
/*http://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html */
/*************************************/

.cr-slider {
    -webkit-appearance: none;
/*removes default webkit styles*/
	/*border: 1px solid white; *//*fix for FF unable to apply focus style bug */
    width: 300px;
/*required for proper track sizing in FF*/
    max-width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: transparent;
}

.cr-slider::-webkit-slider-runnable-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

.cr-slider:focus {
    outline: none;
}
/*
.cr-slider:focus::-webkit-slider-runnable-track {
background: #ccc;
}
*/

.cr-slider::-moz-range-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

/*hide the outline behind the border*/
.cr-slider:-moz-focusring {
    outline: 1px solid white;
    outline-offset: -1px;
}

.cr-slider::-ms-track {
    width: 100%;
    height: 5px;
    background: transparent;
/*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
	border-color: transparent;/*leave room for the larger thumb to overflow with a transparent border */
	border-width: 6px 0;
	color: transparent;/*remove default tick marks*/
}
.cr-slider::-ms-fill-lower {
	background: rgba(0, 0, 0, 0.5);
	border-radius: 10px;
}
.cr-slider::-ms-fill-upper {
	background: rgba(0, 0, 0, 0.5);
	border-radius: 10px;
}
.cr-slider::-ms-thumb {
	border: none;
	height: 16px;
	width: 16px;
	border-radius: 50%;
	background: #ddd;
	margin-top:1px;
}
.cr-slider:focus::-ms-fill-lower {
	background: rgba(0, 0, 0, 0.5);
}
.cr-slider:focus::-ms-fill-upper {
	background: rgba(0, 0, 0, 0.5);
}
/*******************************************/

/***********************************/
/* Rotation Tools */
/***********************************/
.cr-rotate-controls {
	position: absolute;
	bottom: 5px;
	left: 5px;
	z-index: 1;
}
.cr-rotate-controls button {
	border: 0;
	background: none;
}
.cr-rotate-controls i:before {
	display: inline-block;
	font-style: normal;
	font-weight: 900;
	font-size: 22px;
}
.cr-rotate-l i:before {
	content: '↺';
}
.cr-rotate-r i:before {
	content: '↻';
}

.daterangepicker {
  position: absolute;
  color: inherit;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #ddd;
  width: 278px;
  max-width: none;
  padding: 0;
  margin-top: 7px;
  top: 100px;
  left: 20px;
  z-index: 3001;
  display: none;
  font-family: arial;
  font-size: 15px;
  line-height: 1em;
}

.daterangepicker:before, .daterangepicker:after {
  position: absolute;
  display: inline-block;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  content: '';
}

.daterangepicker:before {
  top: -7px;
  border-right: 7px solid transparent;
  border-left: 7px solid transparent;
  border-bottom: 7px solid #ccc;
}

.daterangepicker:after {
  top: -6px;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
  border-left: 6px solid transparent;
}

.daterangepicker.opensleft:before {
  right: 9px;
}

.daterangepicker.opensleft:after {
  right: 10px;
}

.daterangepicker.openscenter:before {
  left: 0;
  right: 0;
  width: 0;
  margin-left: auto;
  margin-right: auto;
}

.daterangepicker.openscenter:after {
  left: 0;
  right: 0;
  width: 0;
  margin-left: auto;
  margin-right: auto;
}

.daterangepicker.opensright:before {
  left: 9px;
}

.daterangepicker.opensright:after {
  left: 10px;
}

.daterangepicker.drop-up {
  margin-top: -7px;
}

.daterangepicker.drop-up:before {
  top: initial;
  bottom: -7px;
  border-bottom: initial;
  border-top: 7px solid #ccc;
}

.daterangepicker.drop-up:after {
  top: initial;
  bottom: -6px;
  border-bottom: initial;
  border-top: 6px solid #fff;
}

.daterangepicker.single .daterangepicker .ranges, .daterangepicker.single .drp-calendar {
  float: none;
}

.daterangepicker.single .drp-selected {
  display: none;
}

.daterangepicker.show-calendar .drp-calendar {
  display: block;
}

.daterangepicker.show-calendar .drp-buttons {
  display: block;
}

.daterangepicker.auto-apply .drp-buttons {
  display: none;
}

.daterangepicker .drp-calendar {
  display: none;
  max-width: 270px;
}

.daterangepicker .drp-calendar.left {
  padding: 8px 0 8px 8px;
}

.daterangepicker .drp-calendar.right {
  padding: 8px;
}

.daterangepicker .drp-calendar.single .calendar-table {
  border: none;
}

.daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span {
  color: #fff;
  border: solid black;
  border-width: 0 2px 2px 0;
  border-radius: 0;
  display: inline-block;
  padding: 3px;
}

.daterangepicker .calendar-table .next span {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.daterangepicker .calendar-table .prev span {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
  min-width: 32px;
  width: 32px;
  height: 24px;
  line-height: 24px;
  font-size: 12px;
  border-radius: 4px;
  border: 1px solid transparent;
  white-space: nowrap;
  cursor: pointer;
}

.daterangepicker .calendar-table {
  border: 1px solid #fff;
  border-radius: 4px;
  background-color: #fff;
}

.daterangepicker .calendar-table table {
  width: 100%;
  margin: 0;
  border-spacing: 0;
  border-collapse: collapse;
}

.daterangepicker td.available:hover, .daterangepicker th.available:hover {
  background-color: #eee;
  border-color: transparent;
  color: inherit;
}

.daterangepicker td.week, .daterangepicker th.week {
  font-size: 80%;
  color: #ccc;
}

.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {
  background-color: #fff;
  border-color: transparent;
  color: #999;
}

.daterangepicker td.in-range {
  background-color: #ebf4f8;
  border-color: transparent;
  color: #000;
  border-radius: 0;
}

.daterangepicker td.start-date {
  border-radius: 4px 0 0 4px;
}

.daterangepicker td.end-date {
  border-radius: 0 4px 4px 0;
}

.daterangepicker td.start-date.end-date {
  border-radius: 4px;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
  background-color: #357ebd;
  border-color: transparent;
  color: #fff;
}

.daterangepicker th.month {
  width: auto;
}

.daterangepicker td.disabled, .daterangepicker option.disabled {
  color: #999;
  cursor: not-allowed;
  text-decoration: line-through;
}

.daterangepicker select.monthselect, .daterangepicker select.yearselect {
  font-size: 12px;
  padding: 1px;
  height: auto;
  margin: 0;
  cursor: default;
}

.daterangepicker select.monthselect {
  margin-right: 2%;
  width: 56%;
}

.daterangepicker select.yearselect {
  width: 40%;
}

.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {
  width: 50px;
  margin: 0 auto;
  background: #eee;
  border: 1px solid #eee;
  padding: 2px;
  outline: 0;
  font-size: 12px;
}

.daterangepicker .calendar-time {
  text-align: center;
  margin: 4px auto 0 auto;
  line-height: 30px;
  position: relative;
}

.daterangepicker .calendar-time select.disabled {
  color: #ccc;
  cursor: not-allowed;
}

.daterangepicker .drp-buttons {
  clear: both;
  text-align: right;
  padding: 8px;
  border-top: 1px solid #ddd;
  display: none;
  line-height: 12px;
  vertical-align: middle;
}

.daterangepicker .drp-selected {
  display: inline-block;
  font-size: 12px;
  padding-right: 8px;
}

.daterangepicker .drp-buttons .btn {
  margin-left: 8px;
  font-size: 12px;
  font-weight: bold;
  padding: 4px 8px;
}

.daterangepicker.show-ranges.single.rtl .drp-calendar.left {
  border-right: 1px solid #ddd;
}

.daterangepicker.show-ranges.single.ltr .drp-calendar.left {
  border-left: 1px solid #ddd;
}

.daterangepicker.show-ranges.rtl .drp-calendar.right {
  border-right: 1px solid #ddd;
}

.daterangepicker.show-ranges.ltr .drp-calendar.left {
  border-left: 1px solid #ddd;
}

.daterangepicker .ranges {
  float: none;
  text-align: left;
  margin: 0;
}

.daterangepicker.show-calendar .ranges {
  margin-top: 8px;
}

.daterangepicker .ranges ul {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

.daterangepicker .ranges li {
  font-size: 12px;
  padding: 8px 12px;
  cursor: pointer;
}

.daterangepicker .ranges li:hover {
  background-color: #eee;
}

.daterangepicker .ranges li.active {
  background-color: #08c;
  color: #fff;
}

/*  Larger Screen Styling */
@media (min-width: 564px) {
  .daterangepicker {
    width: auto;
  }

  .daterangepicker .ranges ul {
    width: 140px;
  }

  .daterangepicker.single .ranges ul {
    width: 100%;
  }

  .daterangepicker.single .drp-calendar.left {
    clear: none;
  }

  .daterangepicker.single .ranges, .daterangepicker.single .drp-calendar {
    float: left;
  }

  .daterangepicker {
    direction: ltr;
    text-align: left;
  }

  .daterangepicker .drp-calendar.left {
    clear: left;
    margin-right: 0;
  }

  .daterangepicker .drp-calendar.left .calendar-table {
    border-right: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .daterangepicker .drp-calendar.right {
    margin-left: 0;
  }

  .daterangepicker .drp-calendar.right .calendar-table {
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }

  .daterangepicker .drp-calendar.left .calendar-table {
    padding-right: 8px;
  }

  .daterangepicker .ranges, .daterangepicker .drp-calendar {
    float: left;
  }
}

@media (min-width: 730px) {
  .daterangepicker .ranges {
    width: auto;
  }

  .daterangepicker .ranges {
    float: left;
  }

  .daterangepicker.rtl .ranges {
    float: right;
  }

  .daterangepicker .drp-calendar.left {
    clear: none !important;
  }
}

.no-gutter {
    padding: 0;
}
input.input-edit,
input[type='text'].input-edit:focus {
    border: none;
    border-bottom: 1px solid #ddd;
    border-radius: unset;
    box-shadow: none;
    padding-bottom: 0;
    padding-left: 0;
    height: auto;
}
/* flex layout */
.flex {
    display: flex;
}
.flex-start {
    display: flex;
    justify-content: start;
    align-items: center;
}
.flex-start-center {
    display: flex;
    justify-content: start;
    align-items: center;
}
.flex-end-center {
    display: flex;
    justify-content: end;
    align-items: center;
}
.flex-space-between {
    display: flex;
    justify-content: space-between;
}
.bootstrap-tagsinput {
    width: 100%;
}
.bootstrap-tagsinput input{
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
}
.select2-container--default .select2-selection--single{
    height: 33px;
}
.select2-results__options img.img-flag{
    max-width: 3rem;
    max-height: 1.5rem;
    vertical-align: middle;
}
.select2-container--open .select2-dropdown--below{
    width: 10rem;
}
.select2-container--default .select2-selection--multiple ul.select2-selection__rendered{
    padding-bottom: 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered li{
    color: #000000;
}

/* marign */
.margin-top {
    margin-top: 1rem;
}

/* btn */
.btn.none-border,
.btn.none-border:visited,
.btn.none-border:hover {
    border: none;
    outline: none;
}
.btn.btn-circle {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

/* icons */
.icon {
    display: inline-block;
    object-fit: cover;
    object-position: center;
    vertical-align: middle;
    width: 25px;
    height: 25px;
}
.icon.icon-play {
    content: url('/assets/images/icons/play.svg');
}
.icon.icon-plus {
    content: url('/assets/images/icons/plus.svg');
}
.icon.icon-small {
    width: 25px;
    height: 25px;
}
.icon.icon-medium {
    width: 30px;
    height: 30px;
}

/* input */
input[type="file"].over-click {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /* background-color: red; */
    cursor: pointer;
    opacity: 0;
    z-index: 999;
}
label.checkbox {
    position: relative;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    min-width: 1.5rem;
    min-height: 1.5rem;
    margin: 0;
    cursor: pointer;
    /* background: rebeccapurple; */
}
label.checkbox > input[type="checkbox"] {
    display: none;
    position: absolute;
}
label.checkbox > input[type="checkbox"] + span{
    display: inline-block;
    width: 100%;
    height: 100%;
    /* border: 1px solid #999999; */
    background-color: #cdcdcd;
}
label.checkbox > input[type="checkbox"]:checked + span {
    background-color: #5db49a;
}
label.checkbox > input[type="checkbox"] + span::before { 
    display: none;
    content: "";
    position: absolute;
    width: 10px;
    height: 15px;
    border: solid white;
    border-width: 0 3px 3px 0;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -moz-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    -o-transform: translate(-50%, -50%) rotate(45deg);
}
label.checkbox > input[type="checkbox"]:checked + span::before {
    display: block;
}

label.radio {
    position: relative;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    min-width: 1.5rem;
    min-height: 1.5rem;
    margin: 0;
    cursor: pointer;
    /* background: rebeccapurple; */
}
label.radio > input[type="radio"] {
    display: none;
    position: absolute;
}
label.radio > input[type="radio"] + span{
    display: inline-block;
    width: 100%;
    height: 100%;
    border: 1px solid #cdcdcd;
    background-color: #fff;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
label.radio > input[type="radio"]:checked + span {
    background-color: #cdcdcd;
}
label.radio > input[type="radio"] + span::before {
    display: none;
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: #5db49a;
    transition: all 0.25s;
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -ms-transition: all 0.25s;
    -o-transition: all 0.25s;
}
label.radio > input[type="radio"]:checked + span::before {
    display: block;
    transition: all 0.25s;
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -ms-transition: all 0.25s;
    -o-transition: all 0.25s;
}
/* sweetalert2 */
.swal2-container .swal2-popup{
    font-size: 0.8rem;
    padding: 0;
    /* background-color: #d1d1d1; */
}
.swal2-popup .swal2-header {
    color: #fff;
}
.swal2-popup .swal2-content {
    /* background-color: #f5d8d8; */
    padding: 0.5em;
    font-size: 1.5em;
    border-bottom: 1px solid #d1d1d1;
}
.swal2-popup .swal2-content p{
    padding: 0.5em 0;
}
.swal2-popup .swal2-actions {
    margin-top: 0;
    width: 100%;
    /* margin-bottom: 1em; */
}

.swal2-popup .swal2-styled.swal2-confirm:focus {
    box-shadow: none;
}
.swal2-popup button.swal2-styled,
.swal2-popup .swal2-actions button{
    background-color: #fff;
    outline: none;
    margin: 0;
    border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
}
.swal2-popup .swal2-actions button:hover {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}
.swal2-popup .swal2-actions .swal2-cancel {
    color: #595959;
    flex-grow: 1;
}
.swal2-popup .swal2-actions .swal2-confirm {
    color: #5db49a;
    flex-grow: 1;
    border-left: 1px solid #d1d1d1 !important;
}
.swal2-container .swal2-icon {
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
}
.swal2-container .swal2-icon .swal2-icon-text {
    /* font-size: 1.75rem; */
}
/* .swal2-container .swal2-header {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
} */
.swal2-container .swal2-content div{
    padding: 35px 20px;
}
.swal2-container .swal2-actions .swal2-styled{
    padding: 1rem 0;
}
.swal2-icon.swal2-warning,
.swal2-icon.swal2-error {
    background-color: #fff;
    border-color: #fff;
    /* color: #fff; */
}
.swal2-icon.swal2-error [class^=swal2-x-mark-line] {
    background-color: #d11706;
}
/* .swal2-icon .swal2-icon-text {
    font-size: 1.75em;
} */

.btn-edit-course {
    width: 30px;
    height: 30px;
    /* padding: 0 0.5rem; */
    position: absolute !important;
    top: 0px;
    right: 0px;
    z-index: 9;
    font-size: 1.25rem;
    color: #fff;
    background-color: rgba(0,0,0,.1);
    border-radius: 5px;
}
.time-heart {
    width: 42%;
    display: flex;
    justify-content: flex-end;
    background: rgba(0,0,0,0.3);
    position: absolute!important;
    z-index: 9;
    right: 0;
    border-bottom-left-radius:10px;
}
.time-heart-p{
    font-size:16px;
    color:#fff;
    margin-top:0.7rem;
    font-weight:400;
    margin-right:0.2rem
}
.btn-heart {
    width: 45px;
    height: 45px;
    top: 0px;
    right: 0px;
    z-index: 9;
    font-size: 12px;
    color: #fff;
    border-radius: 5px;
}

.btn-heart-main {
    margin-right: 2rem;
    width: 50px;
    display: flex;
    height: 50px;
    z-index: 9;
    font-size: 14px;
    color: #fff;
    border-radius: 5px;
    justify-content: space-around;
}

.btn-heart-main .heart{
    position: absolute;
    top: 25%;
    left: 7%;
}
.btn-heart .heart{
    top:-37px;
}
.wrap-heart {
    width: 30px;
    height: 30px;
    font-size: 12px;
    color: #fff;
}
.heart-number{
    position: absolute;
    top: 23%;
    right: 12px;
    font-size: 10px;
}
.btn-edit-course:hover {
    color: #fff;
    background-color: rgba(0,0,0,.5);
}
.disabled {
    pointer-events:none;
    opacity:0.6;
    cursor: pointer;
}
/* switch */
.pi-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 25px;
  }
  
  /* Hide default HTML checkbox */
  .pi-switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .pi-switch .switch-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .pi-switch .switch-slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: -2px;
    top: 50%;
    transform: translateY(-50%);
    background-color: white;
    transition: 0.4s  ;
    -webkit-transition: 0.4s  ;
    -moz-transition: 0.4s  ;
    -ms-transition: 0.4s  ;
    -o-transition: 0.4s  ;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
  .pi-switch .switch-slider,
  .pi-switch .switch-slider:before {
      border: 1px solid #ccc;
  }
  
  .pi-switch input:checked + .switch-slider {
    background-color: #43e87a;
  }
  
  /* .pi-switch input:focus + .switch-slider {
    box-shadow: 0 0 1px #2196F3;
  } */
  
  .pi-switch input:checked + .switch-slider:before {
    left: 100%;
    transform: translate(calc(-100% + 2px), -50%);
    -webkit-transform: translate(calc(-100% + 2px), -50%);
    -moz-transform: translate(calc(-100% + 2px), -50%);
    -ms-transform: translate(calc(-100% + 2px), -50%);
    -o-transform: translate(calc(-100% + 2px), -50%);
}
  
  /* Rounded sliders */
  .pi-switch .switch-slider.round {
    border-radius: 34px;
  }
  
  .pi-switch .switch-slider.round:before {
    border-radius: 50%;
  }

  .panel.panel-pi .panel-heading{
    background-color: #5db49a;
  }
  .panel.panel-pi .list-group {
      /* padding: 0; */
      margin: 0;
  }
  .panel.panel-pi .list-group .list-group-item.active {
      background-color: #b8b8b8;
  }
  .panel.panel-pi .list-group .list-group-item a {
      color: #000;
  }
  .btn-pi {
      background-color: #5db49a;
      color: #fff;
  }
  .f-popup.f-popup-v {
      background-color: transparent;
      z-index: 1000;
  }
  .f-popup.f-popup-v::before{
      content: '';
      width: 100vw;
      position: fixed;
      display: block;
      left: 0;
      top: 0;
      height: 100vh;
      background-color: hsla(0, 0%, 50%, .9);
      z-index: -1;
  }

.block-ellipsis {
    display: block;
    display: -webkit-box;
    max-width: 100%;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.block-ellipsis.block-ellipsis-2 {
    -webkit-line-clamp: 2;
}
.block-ellipsis.block-ellipsis-1 {
    -webkit-line-clamp: 1;
}
.ellipsis {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.ctn-show-status {
    position: relative !important;
}
.show-status {
    position: absolute !important;
    top: 0;
    left: 0;
    padding: 0.2rem 0.8rem;
    z-index: 99;
    background-color: rgba(128,128,128,0.9);
    border-radius: 2px;
    font-size: 15px;
    color: white;
}
.show-status-draft {
    width: 109px;height: 27px; 
    transform: rotate(315deg);  
    top: 5px;
    left: -27px;
    padding: 0.2rem 2rem;   
    background-color: #10b313;
}
.show-status::first-letter{
    text-transform: capitalize;
}
/* .ql-toolbar.ql-snow {
   position: absolute;
    bottom: 50%;
    top: 0;
    left: 0;
} */

#create-flash-card .ql-container.ql-snow {
    border: none;
}
#create-flash-card .ql-toolbar.ql-snow {
    position: absolute;
    bottom: 100%;
}
#create-flash-card .ql-snow a {
    color: #06c;
}
.ql-editor {
    overflow-y: hidden;
}
.ql-editor div img {
    width: 100% !important;
}
.ql-editor iframe {
    width: 100%;
}
.ql-toolbar.ql-snow {
    background-color: #fff;
}
.ql-editor {
    padding: 0;
}
.ql-editor p {
    padding: 0 20px;
}
.card_text.ql-snow .ql-editor {
    white-space: normal;
}

.ql-video{
    width: 100%;
}
.ql-snow .ql-tooltip.ql-editing{
    left: 10px !important;
    right: 10px;
    /* top: 0px !important; */
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after{
    border-right: 0px;
    content: 'Save';
    padding-right: 0px;
    color: #000;
    margin-left: 8px;
}
#create-flash-card .question-type .question .text-question{
    padding: 0 0 !important;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value$="px"]::before {
    content: attr(data-value);
}

.ql-formats .ql-div::before {
    content: 'fullwidth';
    font-weight: bold;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before {
    content: attr(data-value);
}

.spinner {
    margin: 0 auto;
    width: 70px;
    text-align: center;
}

.spinner > div {
    width: 4px;
    height: 4px;
    background-color: #aaa;

    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
    0%, 80%, 100% { -webkit-transform: scale(0) }
    40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    } 40% {
          -webkit-transform: scale(1.0);
          transform: scale(1.0);
      }
}

.p-btn {
    font-size: 11px;
    padding: 5px 25px;
    border: none;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
}
.p-btn-primary {
    color: #fff;
    background-color: #5db49a;
}
.p-btn-default {
    color: #3b3b3b;
    background-color: #b3b5b5;
    margin-right: 20px;
}
input[type=range] {
    display: flex;
    align-items: center;
    width: 50%;
    margin: 0 auto;
}
input[type=range]::before {
    content: '';
    margin-right: 15px;
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url('/assets/images/icons/image.svg');
    background-repeat: no-repeat;
    background-size: contain;
}
input[type=range]::after {
    content: '';
    margin-left: 15px;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/assets/images/icons/image.svg');
    background-repeat: no-repeat;
    background-size: contain;
}
.bootstrap-datetimepicker-widget .list-unstyled{
    margin: 0;
    padding: 0 42.5px;
}
.bootstrap-datetimepicker-widget .timepicker-hour,.bootstrap-datetimepicker-widget .timepicker-minute,.bootstrap-datetimepicker-widget  .timepicker-second{
    display: block;
    text-align: center;
}
.sprite {
    background-image: url(../../images/icons/icons_thumbs.png);
    background-repeat: no-repeat;
    display: inline-block;
    cursor: pointer;
}

.sprite-fa-thumbs-down-green {
    width: 21px;
    height: 20px;
    background-position: -5px -5px;
}

.sprite-fa-thumbs-down-grey {
    width: 21px;
    height: 20px;
    background-position: -5px -35px;
}

.sprite-fa-thumbs-o-down-green {
    width: 21px;
    height: 22px;
    background-position: -5px -65px;
}

.sprite-fa-thumbs-o-down-grey {
    width: 21px;
    height: 22px;
    background-position: -5px -97px;
}

.sprite-fa-thumbs-o-up-green {
    width: 21px;
    height: 22px;
    background-position: -5px -129px;
}

.sprite-fa-thumbs-o-up-grey {
    width: 21px;
    height: 22px;
    background-position: -5px -161px;
}

.sprite-fa-thumbs-up-green {
    width: 21px;
    height: 20px;
    background-position: -5px -193px;
}

.sprite-fa-thumbs-up-grey {
    width: 21px;
    height: 20px;
    background-position: -5px -223px;
}

.jq-rating {
    padding: 5px 10px;
}

.jq-rating div {
    display: inline-block;
    vertical-align: middle;
    padding: 0 7px;
}

.sprite-fa-thumbs-down-grey:hover {
    background-position: -5px -5px;
}

.sprite-fa-thumbs-up-grey:hover {
    background-position: -5px -193px;
}
@media screen and (min-width: 320px) {

}

@media screen and (min-width: 640px) {

}

@media screen and (min-width: 768px) {

}

@media screen and (min-width: 1024px) {
    
}


#rocketchat,
.btn-inbox{
    display: none;
}
#rocketchat {
    width: 0;
    height: 0;
}
@media screen and (min-width: 320px) {

}

@media screen and (min-width: 640px) {

}

@media screen and (min-width: 768px) {
    .header-learning .prefix-name-learning {
        display: inline-block;
    }
    .recent-lesson .btn-continue {
        order: 3;
    }
    .recent-lesson .name-lesson {
        flex-basis: 60%;
        margin-top: 0;
    }
    .recent-lesson .title-learning {
        margin-bottom: 20px;
        flex-basis: 100%;
    }
    .btn-inbox{
        display: block;
    }
    #rocketchat {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 300px;
    }
}

@media screen and (min-width: 1024px) {
    .main-content {
        /* max-width: 75rem; */
        margin: 0 auto;
        position: relative;
    }
    #rocketchat {
        width: 400px;
    }
}

#create-course-page .btn {
    padding: 6px 12px;
}
#create-course-page .edit-description {
    min-height: 200px;
    height: min-content;
}
#create-course-page .course-item,
.card-course .course-item {
    box-sizing: border-box;
    box-shadow: none;
    border: 2px solid #f5f5f5;
    overflow: unset;
}
#create-course-page .ql-editor {
    height: 100%;
    min-height: 150px;
}
#create-course-page .course-item .show,
.card-course .course-item .show {
    display: flex !important;
}

#create-course-page .course-item .show img,
.card-course .course-item .show img {
    max-width: 2rem;
    max-height: 1rem;
    margin-right: 4px;
}

#create-course-page .button-update-course {
    padding: 10px;
    width: 100%;
    font-family: Roboto;
    font-size: 16px;
    color: #ffffff;
    font-weight: 500;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    border-radius: 6px;
    background-color: #5db49a;
    background-size: cover;
    box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.2);
}

#create-course-page .button-detail-course {
    margin-top: 10px;
    padding: 10px;
    width: 100%;
    font-family: Roboto;
    font-size: 16px;
    color: #ffffff;
    font-weight: 500;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    border-radius: 6px;
    background-color: #337899;
    background-size: cover;
    box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.2);
}

/* #create-course-page .course-item:hover {
    border: 2px solid #00bba9;
} */
#create-course-page .course-item .container-thumbnail,
.card-course .course-item .container-thumbnail {
    position: relative !important;
    /* height: 50%; */
    width: 100%;
    background-color: #cccccc;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding-top: calc(100%*2/3);
}

#create-course-page .course-item .container-thumbnail .course_image,
.card-course .course-item .container-thumbnail .course_image {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    z-index: 10;
}

#create-course-page .course-item .container-thumbnail .file-thumbnail,
#create-course-page .course-item .container-thumbnail .placeholder,
.card-course .course-item .container-thumbnail .file-thumbnail,
.card-course .course-item .container-thumbnail .placeholder {
    display: inline-block;
    position: absolute !important;
    cursor: pointer;
}

#create-course-page .course-item .container-thumbnail .placeholder,
.card-course .course-item .container-thumbnail .placeholder {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 1rem;
    left: 0;
    top: 50%;
    width: 100%;
    height: 100%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

#create-course-page .course-item .container-thumbnail .placeholder .icon-plus .card-course .course-item .container-thumbnail .placeholder .icon-plus {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

#create-course-page .course-item .container-thumbnail .file-thumbnail,
.card-course .course-item .container-thumbnail .file-thumbnail {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 10;
}

#create-course-page .detail-part__title.none-border-bottom {
    border-bottom: none;
}

#create-course-page .detail-part__title {
    text-transform: none;
}

#create-course-page .instructor-block img {
    opacity: 1;
    background-color: #999;
    max-width: 8rem;
    border-radius: 100%;
    height: 80%;
}

#create-course-page .instructor-block {
    border: 1px solid #dadada;
    border-radius: 6px;
    margin-left: 0px !important;
}

#create-course-page .alert {
    margin-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

#create-course-page .alert.alert-gray {
    border: 1px solid #999999;
    background-color: #f5f5f5;
}

#create-course-page .course_title {
    height: calc(20px * 2);
}

#create-course-page .show-errors {
    padding: 0 1rem;
}

#create-course-page .show-errors .error {
    padding: 0.5rem 1rem 0;
    color: red;
    font-weight: bold;
}

#create-course-page .course_wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#create-course-page .course_wrap .show {
    font-size: 0.8rem;
}

#create-course-page .container-thumbnail .btn-remove {
    background-color: #dedede;
    opacity: 0.8;
    position: absolute !important;
    width: 2rem;
    height: 2rem;
    top: 0;
    right: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
    z-index: 11;
}

/* create-flash-card */
#publish-modal input[type="radio"]:checked,
#publish-modal input[type="radio"]:not(:checked) {
    position: relative;
    left: 0;
    top: 0;
}

#create-flash-card .thumbnail {
    border: 0;
    padding: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card audio {
    max-height: 40px;
    padding: 0;
    border-radius: unset;
    -webkit-border-radius: unset;
    -moz-border-radius: unset;
    -ms-border-radius: unset;
    -o-border-radius: unset;
}

#create-flash-card input,
#create-flash-card textarea {
    resize: none;
    margin: 0;
    box-shadow: none;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card li {
    float: none;
    padding: 0;
}

#create-flash-card a {
    color: #fff;
}

#create-flash-card .right-content,
#create-flash-card .left-content {
    height: 100vh;
    display: grid;
    align-items: center;
}

#create-flash-card .left-content {
    align-items: start;
}

#create-flash-card .main_course {
    /* margin: 0 auto; */
    left: unset;
    top: unset;
    transform: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    margin-top: 3rem;
}

#create-flash-card .main_course .btn-control {
    position: relative;
    left: unset;
    transform: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    margin-top: 1rem;
    min-height: 8rem;
}

#create-flash-card .main_course .tools {
    position: absolute;
    top: 0;
    right: -5%;
    display: grid;
    grid-column: auto;
    grid-row-gap: 0.5rem;
    padding: 0.25rem;
    background-color: #fff;
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    border-radius: 1rem;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    -ms-border-radius: 1rem;
    -o-border-radius: 1rem;
}

#create-flash-card .main_course .tools .btn {
    position: relative;
    background-color: #bdbdbd;
    width: 2rem;
    height: 2rem;
    transition: all 0.25s;
    /* margin-bottom: 1rem; */
}

#create-flash-card .main_course .tools .btn:hover {
    background-color: #5db49a;
    transition: all 0.25s;
}

#create-flash-card .main_course .tools .btn::before {
    /* content: 'Tạo card mới'; */
    position: absolute;
    font-weight: bold;
    top: 50%;
    left: calc(100% + 0.5rem);
    color: #474747;
    font-family: Roboto;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

#create-flash-card .main_course .btn-create-card:hover::before {
    content: 'Thêm';
}

#create-flash-card .main_course .btn-save-card:hover::before {
    content: 'Lưu';
}

#create-flash-card .main_course .btn-delete-card:hover::before {
    content: 'Xóa';
}

#create-flash-card .main_course .btn .fa {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 1rem;
    color: #fff;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}

#create-flash-card .main_course .btn .fa.fa-spin {
    top: 25%;
    left: 25%;
}

#create-flash-card .main_course .btn-back {
    position: absolute;
    top: 100%;
    transform: translateY(100%);
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
}

#create-flash-card .main_course .container-of-card .screen-radio .radio-container .content {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

#create-flash-card .main_course .container-of-card .screen-radio .radio-container .content.content-text {
    /*overflow: hidden;*/
    /* overflow-y: scroll; */
    /* padding: 0 1rem; */
}

#create-flash-card.assignment .btn-control.btn-control-action .tooltips {
    display: none;
}

.content-text {
    /*padding-left: 20px;*/
    /*padding-right: 20px;*/
    /* position:relative; */
}

/*.content-text div p img {*/
/*    max-width: calc(100% + 40px) !important;*/
/*    width: calc(100% + 40px) !important;*/
/*    margin-left: -20px;*/
/*    height: 100% !important;*/
/*}*/

/*.content-text div img {*/
/*    max-width: calc(100% + 40px) !important;*/
/*    width: calc(100% + 40px) !important;*/
/*    margin-left: -20px;*/
/*    height: auto !important;*/
/*}*/

/*
.content-text img{
    /* position: absolute;; */
/* width: calc(100% + 40px) !important; */
/* max-width: calc(100% + 40px) !important; */
/* width: calc(100% + 40px);
    position: relative;
    left: -20px;
    top: -20px; */
/* margin: 0 -80px -40px 0; */
/* margin-right: -20px;
    margin-left: -20px */
/* margin-left: -20px;
   
} */
#create-flash-card .question-type .answers {
    padding: 0 1rem;
}


#create-flash-card .notification-question-card {
    padding: 0.5rem;
}

#create-flash-card .notification-audio-card {
    background-color: #f1f3f4;
}

#create-flash-card .question-type {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

#create-flash-card .question-type .question {
    flex-grow: 1;
    overflow: hidden;
    border-bottom: 1px solid #bdbdbd;
}

#create-flash-card .question-type .question .text-question {
    height: 100%;
    overflow: hidden;
    padding: 0px 20px
}

#create-flash-card .question-type .question,
#create-flash-card .question-type .answers .answer {
    margin-bottom: 1rem;
}

#create-flash-card .question-type .answers .answer .text-answer {
    margin-left: 1rem;
}

#create-flash-card .content .container-thumbnail {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

#create-flash-card .content .container-thumbnail .btn-remove {
    background-color: #dedede;
    opacity: 0.8;
    position: absolute;
    width: 2rem;
    height: 2rem;
    top: 0;
    right: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
}

#create-flash-card .content .container-thumbnail .btn-remove:hover {
    opacity: 1;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
}

#create-flash-card .container-thumbnail .btn-remove .fa-remove {
    color: #575757;
    font-size: 18px;
    font-weight: 300;
}

#create-flash-card .content .container-thumbnail .thumbnail {
    border: none;
    padding: 0;
    width: 100%;
    /* height: 100%; */
    outline: none;
    box-shadow: none;
    object-fit: cover;
}

#create-flash-card .btn-control {
    padding: 0 1rem;
}

#create-flash-card .btn-control ul {
    background-color: transparent;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card .btn-control .actions {
    background-color: white;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

#create-flash-card .btn-control.btn-control-action .tooltips {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card {
    float: none;
    display: table;
    width: 40px;
    height: 40px;

}

#create-flash-card .tooltips .tooltip-for-card button {
    display: table-cell;
    margin: 0;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    position: relative;
    background-color: #cdcdcd;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button .fa-icon {
    font-size: 1.5rem;
    color: white;
    line-height: unset;
}

#create-flash-card .btn-control.btn-control-action .question-types .type.active,
#create-flash-card .tooltip-for-card button.active,
#create-flash-card .tooltip-for-card button:hover {
    background-color: #5db49a;
    color: white;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button.related:hover .fa-icon {
    color: white;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button.related .fa-icon {
    color: #5db49a;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button:disabled:hover {
    background-color: #cdcdcd;
    cursor: not-allowed;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button:disabled:hover .fa-icon {
    color: white;
}

#create-flash-card .btn-control.btn-control-action .question-types {
    display: grid;
    grid-template-columns: auto auto;
    text-align: left;
    grid-gap: 0.5rem 1rem;
}

#create-flash-card .btn-control.btn-control-action .question-types button {
    display: table;
    width: auto;
    height: auto;
    background-color: #cdcdcd;
    overflow: hidden;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

#create-flash-card .btn-control.btn-control-action .question-types button:disabled:hover,
#create-flash-card .btn-control.btn-control-action .question-types button:disabled a:hover {
    background-color: #cdcdcd;
    cursor: not-allowed;
}

#create-flash-card .btn-control.btn-control-action .question-types button a {
    display: table-cell;
    padding: 0.25rem 0.5rem;
    width: 100%;
    height: 100%;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card .btn-control.btn-control-action .answer{
    border-radius: 20px;
}

#create-flash-card .btn-control.btn-control-action .answer ul{
    padding: 20px;
    display: grid;
    grid-template-columns: auto auto;
    text-align: left;
    grid-gap: 0.5rem 1rem;
}
#create-flash-card .btn-control.btn-control-action .answer ul button{
    display: table;
    width: auto;
    height: auto;
    background-color: #cdcdcd;
    overflow: hidden;
    border-radius: 20px;
    padding: 0.3rem 0;
}
#create-flash-card .btn-control.btn-control-action .answer ul button.action{
    background-color: #5db49a;
    color: white;
}

#create-flash-card .content-answer .header-answer{
    padding-top: 15px;
}

#create-flash-card .content-answer .header-answer p.title-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    text-transform: uppercase;
    padding-bottom:1rem;
    font-weight: 500;
}

#create-flash-card .content-answer .header-answer p.title-answer .bottom-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

#create-flash-card .content-answer .header-answer p.title-answer .right-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

.radio-container .header-answer .body-answer{
    height: 27em;
    overflow: auto;
}

.radio-container .header-answer p.title-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    text-transform: uppercase;
    padding-bottom:0rem;
    font-weight: 500;
}

.radio-container .header-answer p.title-answer .bottom-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

.radio-container .header-answer p.title-answer .right-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

#create-flash-card #lesson {
    background-color: #fcfcfc;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    font-family: Roboto;
    font-size: 16px;
    color: #757575;

}

#create-flash-card #lesson .dropdown .btn {
    width: 100%;
    outline: none;
    box-shadow: none;
    display: flex;
    align-items: center;
}

#create-flash-card #lesson .dropdown .btn .text {
    width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

#create-flash-card ::-webkit-scrollbar {
    /* background-color: #000; */
    /* display: none; */
}

#create-flash-card .screen-radio .dropdown-menu {
    padding: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: none;
    background-color: #ebebeb;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    box-shadow: none;
    overflow: hidden;
    overflow-y: scroll;
}

#create-flash-card .screen-radio .dropdown-menu.open {
    display: block;
}

#create-flash-card .screen-radio .dropdown-menu li {
    display: block;
    margin: 0 auto;
    width: 95%;
    border: 1px solid #ffffff;
    background-color: #adadad;
    background-size: cover;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    padding: 1rem;
}

#create-flash-card .screen-radio .dropdown-menu li:hover {
    cursor: pointer;
}

#create-flash-card .screen-radio .dropdown-menu li.create {
    padding: 0.75rem;
}

#create-flash-card .screen-radio .dropdown-menu li.selected {
    background-color: #5db49a;
}

#create-flash-card .screen-radio .dropdown-menu>li>a {
    display: flex;
    align-items: center;
    justify-content: start;
    color: #fff;
}

#create-flash-card .screen-radio .dropdown-menu>li>a .icon {
    margin-right: 1rem;
}

#create-flash-card .screen-radio .dropdown-menu>li>a:hover,
#create-flash-card .screen-radio .dropdown-menu>li>a:visited {
    background-color: #adadad;
}

#create-flash-card .screen-radio .dropdown-menu>li.selected>a:hover,
#create-flash-card .screen-radio .dropdown-menu>li.selected>a:visited {
    background-color: #5db49a;
}

#create-flash-card .container-of-percentage {
    background-color: #fcfcfc;
}

#create-flash-card .container-of-percentage .percent {
    background-color: #ebebeb;
}

#create-flash-card .main_course .container-of-card .final-card .container-final {
    padding: 0;
}

#create-flash-card .main_course .container-of-card .final-card .btn-change-audio {
    padding-right: 1rem;
}

#create-flash-card .main_course .container-of-card .final-card .btn-change-audio .fa-icon {
    font-size: 1.5rem;
}

#create-flash-card .cke_inner .cke_toolbox {
    display: flex;
    flex-direction: column;
}

/* powerpoint */
#create-flash-card .left-content .action-menu {
    position: fixed;
    color: #000;
    z-index: 1000;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,.15);
    background-color: #fff;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

#create-flash-card .left-content .action-menu div a{
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}
#create-flash-card .left-content .action-menu div a:hover{
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5;
}

#create-flash-card .left-content .container-ppt {
    margin-top: 3rem;
    min-width: 10rem;
    max-width: 13rem;
    position: relative;
}

#create-flash-card .left-content .powerpoint {
    background-color: #fff;
    height: calc(100vh - 4rem);
    ;
    width: 100%;
    max-width: 100%;
    max-height: calc(100vh - 4rem);
    overflow-y: scroll;
    box-shadow: 0 0 1rem 0.25rem rgba(0, 0, 0, 0.1);
}

#create-flash-card .left-content .container-ppt .powerpoint-name {
    overflow: hidden;
    max-width: 20rem;
    /* width: 24rem; */
    text-overflow: ellipsis;
    white-space: nowrap;
    position: absolute;
    font-size: 20px;
    top: 0;
    left: 0;
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
}

#create-flash-card .left-content .powerpoint .group-lesson .items {
    padding-right: 1rem;
}
.group-lesson {
    position: relative;
}
.group-lesson .btn-actions {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 99;
}
.group-lesson .btn-actions .dropdown-menu {
    left: unset;
    right: 0;
    min-width: 1rem;
    /* padding: 0.5rem; */
}
.group-lesson .btn-actions .dropdown-menu a {
    color: #000 !important;
    min-width: 1rem;
}
.group-lesson .btn-actions .dropdown-menu a i{
    margin-right: 0.5rem;
}
/* #create-flash-card .left-content .powerpoint .numbers,
#create-flash-card .left-content .powerpoint .items {
    height: 100%;
} */

#create-flash-card .left-content .powerpoint .left {
    width: 25%;
    float: left;
}

#create-flash-card .left-content .powerpoint .right {
    width: 75%;
    float: right;
}

#create-flash-card .left-content .powerpoint .items .item {
    font-size: 0.75rem;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    text-align: center;
    padding: 0.5rem;
    overflow: hidden;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

#create-flash-card .left-content .powerpoint .items .item .id-card {
    font-weight: bold;
}

#create-flash-card .left-content .powerpoint .items .item,
#create-flash-card .left-content .powerpoint .numbers .number {
    height: 160px;
    margin-bottom: 1rem;
}

#create-flash-card .left-content .powerpoint .numbers .number {
    display: flex;
    font-size: 1rem;
    font-weight: bold;
    justify-content: center;
    align-items: start;
}

#create-flash-card .left-content .powerpoint .items .item {
    width: 120px;
    background-color: #f5f5f5;
    border: 1px solid #bdbdbd;
    cursor: pointer;
}

#create-flash-card .left-content .powerpoint .items .item.active {
    border: 1px solid #5db49a;
    /* box-shadow: 0 0 0.25rem 1px #5db49a; */
}

#create-flash-card .left-content .powerpoint .btn-collapse {
    padding: 0.5rem 1rem 0.5rem 1rem;
    display: flex;
    width: 100%;
    justify-content: start;
    align-items: center;
    font-size: 1rem;
    font-weight: bold;
}

#create-flash-card .left-content .powerpoint .btn-collapse {
    font-size: 14px;
}

#create-flash-card .left-content .powerpoint .btn-collapse[aria-expanded=false] {
    border-bottom: 1px solid #bdbdbd;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card .left-content .powerpoint .group-lesson:last-child .btn-collapse[aria-expanded=false] {
    border-bottom: none;
}

.cke_chrome {
    min-width: 332px;
}

.main-content .menu-top {
    z-index: 1000;
}

/* #publish-modal .form-group {
    margin: 0;
} */

#publish-modal .modal-header {
    position: relative;
    /* background-color: rebeccapurple; */
}

#publish-modal .modal-header .alert-copied {
    text-align: center;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 0.5rem;
    /* background-color: rebeccapurple; */
}

#publish-modal .modal-header .alert-copied .txt {
    display: inline-block;
    padding: 0.25rem 2rem;
    background-color: #81b7f0;
    color: #121212;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
}

#publish-modal .item-role,
#publish-modal .item-role--copy .item-role {
    display: flex;
    align-items: center;
    background-color: #f2f2f2;
    padding: 0.5rem 1rem;
    border: 1px solid #e0e0e0;
    border-top: none;
}

#publish-modal .form-group:first-child .item-role {
    border-top: 1px solid #e0e0e0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

#publish-modal .item-role--copy .item-role {
    padding-top: 0;
    padding: 0;
    background-color: #fff;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

#publish-modal .item-role--copy .item-role .text {
    /* padding: 0rem 1rem; */
    width: 100%;
    justify-content: start;
}

#publish-modal .item-role--copy .item-role .left {
    flex-grow: 1;
}

#publish-modal .item-role--copy .item-role .right {
    background-color: #f2f2f2;
    border-left: 1px solid #e0e0e0;
}
#publish-modal .modal-header {
    position: relative;
    height: 4rem;

    /* background-color: rebeccapurple; */
}
#publish-modal .select-share{
    position: absolute;
    right: 2rem;
    top: 1rem;
}
#publish-modal .select-tick{
    position: absolute;
    right: 5rem;
    color:#5DB49A;
}
.selectedLi{
    background: #f2f2f2;
}
#publish-modal .open{
    background: #fff!important;
}

#publish-modal .open .select-li-share{
    display: none!important;
}
#publish-modal .dropdown .select-li-share{
    display: block;
}

#publish-modal .dropdown {
    background: #f2f2f2;
}
#publish-modal .dropdown .dropdown-toggle .select-tick {
    display: none!important;
}

#publish-modal .open .dropdown-toggle .select-tick{
    display: block!important;
}

#publish-modal #dropdownMenu1{
    width: 100%; 
    border: 1px solid #ccc;
    height: 35px; 
    padding-left: 20px;
}
#publish-modal .list-share{
    height: 35px;
}

.icon-share-company{
    position: relative;
    top: 0.6rem;
    left: -1.3rem;
    font-size: 13px;
}
.title-company{
    color: #ff0d00;
    font-size: 18px;
}
#publish-modal .p-share-link{
    font-family: Roboto;
    font-size: 16px;
    color: #121212;
    margin-bottom:5px;
    text-decoration: underline;
}
#status-share{
    position: relative;
    top : 0.3rem;
}
.disabled-li{
    pointer-events:none;
    opacity:0.6;
}

#publish-modal .item-role--copy .item-role .link {
    padding-left: 1rem;
    font-size: 14px;
    color: #707070;
    font-weight: 300;
    text-decoration: none solid rgb(112, 112, 112);
}

#publish-modal .item-role--copy .item-role .js-btn-copy-link {
    padding: 0 1rem;
}

#publish-modal .item-role.active,
#publish-modal .form-group:not(.item-role--copy) .item-role:hover {
    background-color: #5db49a;
}


#publish-modal .radio {
    margin-right: 1.5rem;
}

#publish-modal input[type=radio]:checked+span {
    background-color: #fff;
}

#publish-modal .text {
    display: flex;
    width: 100%;
    justify-content: start;
    align-items: center;
    font-size: 1rem;
}

#publish-modal input.link {
    position: absolute;
    opacity: 0;
    z-index: -999;
}

#publish-modal .icon-fa {
    min-width: 3rem;
    display: inline-block;
    margin-right: 0.5rem;
}

#publish-modal .icon-fa .fa {
    font-size: 1.5rem;
    padding: 0.5rem;
    /* background-color: #f5f5f5; */
}

#publish-modal .under {
    font-size: 12px;
    color: #bdbdbd;
    font-style: italic;
}

#publish-modal .btn {
    border: none;
}

#publish-modal .btn-save {
    background-color: #5db49a;
    margin-right: 1rem;
}

#publish-modal .btn-cancel {
    background-color: #a8a8a8;
    color: #fff;
}

#publish-modal .modal-dialog.modal-content.modal-body.form-group .invite-users-add{
    display: block;
}


.fl-left{
    float: left;
}
.fl-right{
    float: right;
}
.fl-right .dropdown-toggle{
    border: 1px solid;
    height: 40px;
}
.fl-right .dropdown-menu .icon_invite .aa{
    display: flex;
    height: 30px;
}
.fl-right .dropdown-menu .icon_invite .mg-right{
    margin-left: 5px;
}
.checkboxs{
    display: flex !important;
}
.mg-lefts{
    margin-top: 2px;
    font-size: 16px;
    font-weight: 300;
    margin-left: 10px;
}
.mg-rights{
    margin-top: 2px;
    font-size: 16px;
    font-weight: 300;
    margin-left: 5px;
    margin-right: 10px;
}
/* .cke.cke_float {
    transform-origin: top left;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
.cke.cke_float .cke_button {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
} */

/* create-assignment-page */
.create-assignment-page .detail-part__title {
    border-bottom: none;
}

.create-assignment-page input {
    margin: 0;
}

.create-assignment-page .d-flex {
    display: flex;
    align-items: center;
}

.create-assignment-page .d-flex .text {
    margin-left: 1rem;
}

/* card show */
.wrapper-learning{
    background: #fff;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 10px;
}

.wrapper-learning .title-learning{
    flex-basis: 60%;
    font-size: 20px;
    color: #484848;
    padding-right: 15px;
}

.wrapper-learning .content-learning{
    font-size: 15px;
    color: #707070;
}

.wrap-img img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: cover;
}

.timeline {
    position: relative;
    margin-left: 80px;
}

.timeline::before {
    content: '';
    left: -50px;
    top: 70px;
    position: absolute;
    display: block;
    /* width: 5px; */
    height: calc(100% - 140px);
    border-left: 1px dashed #000;
    /* background-color: red; */
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

.create-detail-learning-page.container--primary{
    margin-top: 90px;
}

.create-detail-learning-page .btn-back{
    align-self: center;
    text-decoration: none;
    color: #000;
    height: 30px;
    display: block;
}

.create-detail-learning-page .btn-back i{
    align-self: center;
    font-size: 30px;
}

#myModalCreateCourse .container-thumbnail {
    position: relative !important;
    background-color: #d2d3d3;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    height: 8rem;
    width: 12rem;
    border: 1px solid #c2bcbc;
    border-radius:6px;
    justify-content: center;
    align-items: center;
}

#myModalCreateCourse .container-thumbnail .course_image_drap {
    width: 100%;
    height: 100%;
    margin: 0;
    z-index: 10;
}

#myModalCreateCourse .container-thumbnail .file_thumbnail_drap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 10;
}
.btn-remove-img-course {
    background-color: #dedede;
    opacity: 0.8;
    position: absolute !important;
    width: 2rem;
    height: 2rem;
    top: 0;
    right: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
    z-index: 11;
}
.box {
    position: relative;
    font-family: Roboto;
    background-color: #fff;
    display: flex;
    margin-bottom: 3rem;
    box-shadow: 0 0 0 1px #c2bebe;
    border-radius: 6px;
    height: 140px;
}

.create-detail-learning-page .box {
    display: block;
    height: 165px;
    cursor: move;
}
.create-detail-learning-page .box:hover {
    border: 1px solid #5db49a;
    border-radius: 6px;
    box-shadow: 0 1px 5px 0 #c2bebe, 0 1px 5px 0#c2bebe;
}
.timeline .box--node {
    position: absolute;
    content: '';
    display: inline-block;
    text-align: center;
    line-height: 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #666666;
    background-color: #ebebeb;
    font-weight: 700;
    font-size: 18px;
    color: #000;
    left: -50px;
    top: 50%;
    z-index: 10;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.timeline .box--node.active {
    background: #ffffff;
    border-color: #5db49a;
}

.timeline .box::before,
.timeline .box::after {
    position: absolute;
    display: inline-block;
    width: 40px;
    height: 50%;
    background-color: #fff;
    left: -50px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}
.create-detail-learning-page.header-learning{
    position: fixed;
    top: 0;
    left: 0;
}

.create-detail-learning-page .detail-learning.wrapper-learning .detail{
    display: flex;
}

.create-detail-learning-page .sp-timeline{
    position: absolute;
}

.create-detail-learning-page .sp-timeline .item-order{
    position: relative;
    height: 165px;
    margin-bottom: 48px;
}
.create-detail-learning-page .sp-timeline .box--node {
    position: absolute;
    content: '';
    display: inline-block;
    text-align: center;
    line-height: 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #666666;
    background-color: #ebebeb;
    font-weight: 700;
    font-size: 18px;
    color: #000;
    left: 30px;
    top: 50%;
    z-index: 10;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
/* .timeline .box:nth-child(2)::before {
    content: '';
    top: 0;
}

.timeline .box:last-child::after {
    content: '';
    bottom: 0;
} */
.time-heart-learnning{
    width: 15%;
    top: 0;
    display: flex;
    justify-content: flex-end;
    background: rgba(0,0,0,0.3);
    position: absolute!important;
    z-index: 9;
    border-bottom-left-radius: 10px;
}
.time-heart-learnning p{
    font-size: 14px;
    color: #fff;
    font-weight: 400;
    margin-right: 0.5rem;
    margin-top: 0.1rem;
}
.box--wrap-img {
    width: 210px;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    border-radius: 6px;
    overflow: hidden;
}

.create-detail-learning-page .box--wrap-img {
    border-radius: 6px 0 0 0 ;
}

.box--wrap-img img{
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.box__body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
    position: relative;
    overflow: hidden;
}

.create-detail-learning-page .box__body {
    flex-direction: row;
    justify-content: start;
    flex-grow: 1;
    height: 140px;
}

.box--close {
    position: absolute;
    display: inline-block;
    top: 2px;
    right: 2px;
    font-size: 1rem;
    width: 20px;
    height: 20px;
    color: #666464;
    z-index: 9;
}

.create-detail-learning-page .box--move {
    position: absolute; 
    right: 5px; 
    top: 50%; 
    transform: translate(0%, -50%); 
    font-size: 20px;
}

.box--check {
    font-size: 1rem;
    color: #5db49a;
}

.box--title {
    margin: 10px 30px 10px 15px;
    font-size: 16px;
    color: #303030;
    font-weight: 300;
    text-decoration: none solid rgb(48, 48, 48);
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-align: justify;
    font-weight: 400;
    word-break: break-all;
}

.box__body .box--title {
    margin: 5px 30px 10px 15px;
    font-size: 16px;
    color: #303030;
    font-weight: 300;
    text-decoration: none solid rgb(48, 48, 48);
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-align: justify;
    font-weight: 400;
    word-break: normal;
}

.box--des { 
    margin: 10px 30px 10px 15px;
    font-size: 14px;
    color: #303030;
    font-weight: 300;
    text-decoration: none solid rgb(48, 48, 48);
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    max-height: 50px;
    text-align: justify;
}
.box-footer-des{
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
}

.box-footer-des div{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.box--small-footer.js-item-button {
    font-size: 14px !important;
    color: #b0b0b0;
    /* text-decoration: none solid rgb(176, 176, 176); */
    text-align: center;
    margin: 10px 20%;
    background-color: #e0e0e0;
    line-height: 30px;
    border-radius: 6px;
}

.box--small-footer .item-type span{
    font-size: 14px !important;
}
.box--small-footer.js-item-button:hover {
    background: #d0d0d0;
}
.box--small-footer.js-item-button.disable{
    /* pointer-events: none; */
    /* cursor: default; */
}
.box--small-footer.js-item-button.active{
    color: #5db49a;
}

.create-detail-learning-page .box--small-footer.js-item-description {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: #424242;
    text-align: center;
    padding: 0 10px;
    line-height: 25px;
    border-top: solid 1px #858585;
}

.create-detail-learning-page .box--small-footer.js-item-description > div {
    width: 60%;
    height: 100%;
    text-align: left;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by{
    width: 40%;
    display: flex;
    align-items: center;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by .avt-instructor{
    height: 20px;
    width: 20px;
    min-width: 20px;
    min-height: 20px;
    margin-right: 5px;
    border-radius: 50%;
    overflow: hidden;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by .avt-instructor img{
    width: 100%;
    height: 100%;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by .js-item-create-by{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.detail-learning .actions {
    margin-bottom: 2rem;
}

.detail-learning .action {
    position: relative;
}

.detail-learning .action--btn {
    background-color: #3498db;
    font-size: 14px;
    color: #fff;
    padding: 6px 10px;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

.detail-learning .select2-container {
    position: absolute;
    top: 0;
    left: 0;

}

.detail-learning .select2-container .select2-selection {
    opacity: 0;
}

.btn--create {
    width: 100%;
    padding: 0.8rem 2rem;
    border-radius: 10px;
    background-color: #26ba9c;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    font-family: Roboto;
    font-weight: 500;
    text-decoration: none solid #fff;
}

.view-learning-learning-page{
    /*margin-top: 80px; */
}

.header-learning{
    background: #dadada;
    z-index: 999;
    width: 100%;
}

.header-learning .container{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 75px;
    padding: 0 15px;
    position: relative;
    top: 0;
}
/* .header-learning:before {
    position: absolute;
    content: '';
    background-color: #dadada;
    width: calc(100vw - 15px);
    height: 100%;
    top: 0;
    left: 50%;
    z-index: -1;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
} */
.header-learning .prefix-name-learning {
    display: none;
}
.header-learning .header-left{
    display: flex;
    flex-grow: 1;
    justify-content: space-between;
}

.header-learning .header-left .title{
    flex-grow: 1;
    font-size: 16px;
    line-height: 40px;
}

.header-learning .header-left .name-learning{
    font-weight: 600;
}

.header-learning .header-left .percent{
    background: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #c7c7c7;
    margin-right: 20px;
    min-width: 40px;
}

.header-learning .header-right{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    /* flex-grow: 2; */
}

.header-learning .header-right .btn-header-detail-learning{
    padding: 10px;
    width: 140px;
    background: #5db49a;
    font-size: 14px;
    color: #fff;
    margin-right: 10px;
}



.header-learning .header-right .btn-back{
    width: 40px;
    height: 40px;
    background: #cfcfcf;
    border-radius: 50%;
    font-size: 24px;
    border: 0.5px solid #c7c7c7;
    margin-right: 20px;
    text-align: center;
    line-height: 40px;
    color: #000000;
}

.header-learning .header-right .profile{
    width: 40px;
    height: 40px;
    background: #cfcfcf;
    border-radius: 50%;
    font-size: 24px;
    overflow: hidden;
    border: 0.5px solid #c7c7c7;
}

.header-learning .header-right .profile img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.recent-lesson{
    background: #5db49a;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 999;
}

.recent-lesson .title-learning{
    font-size: 16px;
    color: #000000;
}

.recent-lesson .content-learning{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.recent-lesson .name-lesson{
    font-size: 18px;
    color: #ffffff;
    margin-top: 20px;
}

.recent-lesson .btn-continue{
    flex-basis: 40%;
    border: 1px solid #a1a1a1;
    border-radius: 6px;
    color: #5db49a;
    background-color: #ffffff;
    /*min-width: 235px;*/
    min-height: 30px;
    max-height: 30px;
    line-height: 30px;
    text-align: center;
    max-width: 230px;
}

.route-learning{
    overflow: hidden;
    padding: 30px 10px 0 10px;
}
.route-learning .title-learning{
    background: #a1a1a1;
    color: #ffffff;
    font-size: 16px;
    text-align: center;
    line-height: 40px;
    margin: -30px -30px 30px -30px;
}
/* ck dialog youtbe */
/* .cke_dialog .cke_dialog_body .cke_dialog_contents_body {
    height: auto !important;
}
.cke_dialog .cke_dialog_body .cke_dialog_contents .cke_dialog_page_contents > table tbody > tr:not(:nth-child(3)) .cke_dialog_ui_vbox_child{
    display: none !important;
    
}
.cke_dialog .cke_dialog_body .cke_dialog_contents .cke_dialog_page_contents > table tbody > tr:nth-child(3) .cke_dialog_ui_vbox_child td:not(:nth-child(1)){
    display: none !important;
}
/* account-settings */
.settings {
    margin: 2rem auto;
    font-size: 1rem;
}

.settings .list-group-item.active,
.settings .list-group-item.active:focus,
.settings .list-group-item.active:hover,
.settings .panel>.panel-collapse>.list-group .list-group-item {
    border: none;
}

.settings .list-group-item a {
    display: block;

    /* margin-left: 2px; */
}
.settings .list-group-item a,
.settings .panel-title{
    text-transform: capitalize;
}
.settings .list-group-item a:focus,
.settings .list-group-item a:focus,
.settings .list-group-item a:focus,
.settings .list-group-item a:visited {
    text-decoration: none;
}

.settings .list-group-item a i {
    width: 25px;
}

.settings input,
.settings textarea {
    box-shadow: none;
    margin: 0px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.settings .phone-container .code {
    background-color: #c9bcbb;
    padding: 0 0.5rem;
    display: flex;
    align-items: center;
}

.settings .phone-container {
    display: flex;
    align-items: stretch;

}

.settings .panel-title {
    font-size: 18px;
    font-weight: bold;
}

.settings .nav-title{
    display: none;
}

.settings .left {
    display: block;
    padding: 0 !important;
}

.loading-course{
    display: flex;
    height: 140px;
    margin: 20px;
}

.loading-course .loading-course-left{
    min-width: 210px;
    margin-right: 10px;
}

.loading-course .loading-course-right{
    width: 100%;
}

.loading-course .loading-course-right .loading-course-top{
    height: 30px;
    margin-bottom: 10px;
} 

.loading-course .loading-course-right .loading-course-bot{
    height: 100px;
} 

.loading-text{
    height: 20px;
    margin: 10px 20px 10px 20px;
}

.loading-card-image{
    height: 198px;
    width: 100%;
}

.loading-card-text{
    height: 20px;
    margin: 5px;
}

@media (max-width: 768px){
    .loading-course{
        display: flex;
        height: 100px;
        margin: 20px;
    }
    
    .loading-course .loading-course-left{
        min-width: 150px;
        margin-right: 10px;
    }
    
    .loading-course .loading-course-right .loading-course-top{
        height: 20px;
        margin-bottom: 10px;
    } 
    
    .loading-course .loading-course-right .loading-course-bot{
        height: 70px;
    } 
    
    .settings .left {
        padding-left: 0;
        padding-right: 0;
        display: none;
    }
    .settings .nav-title{
        display: block;
        width: 100%;
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }
    .settings .panel-group{
        margin: 0;
    }
    .settings .panel-title button{
        display: none;
    }
}

.settings .left .panel-title {
    color: #ffffff;
}

.settings .right .panel-title {
    color: #000000;
    position: relative;
}

.settings .right .panel-title:before {
    content: '';
    position: absolute;
    left: 0;
    top: 100%;
    width: 200px;
    height: 2px;
    background-color: #26ba9c;
}

/* .tab-content {
    margin-left: 10px;
    margin-right: 30px;
} */

.account-settings {
    font-size: 1rem;
}

.account-settings th {
    white-space: nowrap;
}

.account-settings .panel {
    background-color: #fff;
    /*border-radius: 10px;*/
    /*border: 1px solid #9e9e9e;*/
    border: none;
    background-size: cover;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
    /*overflow: hidden;*/
}

.tab-pane .actions .action .fa-circle{
    font-size: 5px;
}
.settings .search-input {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 5px 8px;
    height: auto;
}
.settings .form-group-inline {
    display: flex;
}
.members-content {
    font-size: 14px;
}
.settings .js-group-item {
    cursor: pointer;
}
.members-content .info {
    display: flex;
    align-items: center;
    justify-content: start;
}
.members-content .info--img {
    min-width: 40px;
    min-height: 40px;
    max-width: 40px;
    max-height: 40px;
    object-fit: cover;
    object-position: center;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.members-content .table>tbody>tr>td {
    vertical-align: middle;
}
.members-content .info__right {
    margin-left: 1em;
}
.members-content .info--fullname {
    font-size: 14px;
    font-weight: 500;
}
.members-content .info--username {
    color: #5e5e5e;
}
.dropdown-menu [data-state="deactive"] a{
    color: #c71208 !important;
}
.dropdown-menu li::first-letter {
    text-transform: capitalize;
}
.settings .container-upload {
    width: 155px;
    height: 155px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 0 auto;
    background-color: #dadada;
    border: 2px solid #c8c8c8;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
/* .settings .container-upload .file-upload,
.settings .container-upload .image-upload,
.settings .container-upload {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
} */
.settings .container-upload .file-upload,
.settings .container-upload .image-upload {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.settings .container-upload .file-upload {
    z-index: 100;
    opacity: 0;
    cursor: pointer;
}
.settings .container-upload .image-upload {
    z-index: 99;
}
.settings .container-upload .icon-upload {
    font-size: 50px;
    color: #a8a8a8;
}

.organization .info-organization {
    display: flex;
    padding-bottom: 48px;
    border-bottom: 1px solid #666;
}

.organization .info-organization .logo-organization {
    width: 78px;
    height: 78px;
    border: 1px solid #c8c8c8;
}

.organization .info-organization .logo-organization img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.organization .info-organization .content-organization {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 19px;
}

.organization .info-organization .content-organization h4 {
    font-size: 20px;
    color: #030303;
    font-weight: 700;
    text-decoration: none solid rgb(3, 3, 3);
}

.organization .info-organization .content-organization a {
    margin-top: 5px;
    background-size: cover;
    font-size: 16px;
    color: #020ddb;
    text-decoration: none solid rgba(2, 13, 219, 0.92);
}

.organization .admin-organization {
    margin-top: 27px;
}

.organization .config-assessment-organization {
    padding: 20px 0;
    border-bottom: 1px solid #666666;
    /* display:none; */
}
.organization .config-assessment-organization .title-config-assessment{
    font-family: Roboto;
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}
.organization .config-assessment-organization .infor-config{
    padding-top:1.5rem;
    display:flex;
    justify-content: flex-start;
    margin-bottom: 1rem;
}
.organization .config-assessment-organization  .infor-config .title-infor-config{
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
    padding: 0.3rem 2rem 0 0;
}
.organization .config-assessment-organization  .infor-config .input-infor-config{
    padding: 0px 10px;
    border: 1px solid #c9c9c9;
    border-radius: 4px;
    width:4rem;
    background-color: #ffffff;
    background-size: cover;
    font-family: Roboto;
    font-size: 16px;
    color: #000000;
    text-decoration: none solid rgb(0, 0, 0);
    text-align: right;
}
.organization .config-assessment-organization  .infor-config .btn-save-config{
    border: 1px solid #c8c8c8;
    margin-left: 2rem;
    background: #5db49a;
    color:#fff;
    font-size: 14px;
    border-radius: 3px;
}
.organization .config-assessment-organization  .infor-config .js-cancel{
    border: 1px solid #c8c8c8;
    margin-left: 1rem;
    background: #a8a8a8;
    color:#fff;
    font-size: 14px;
    border-radius: 3px;
    margin-top:2px;
}
.organization .config-assessment-organization  .infor-config .wrong_value{
    position: absolute;
    left: -1rem;
}
.organization .config-assessment-organization  .infor-config input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
.organization .admin-organization .title-admin-organization h5 {
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization {
    display: flex;
    justify-content: space-between;
    margin-top: 21px;
}
.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item {
    display: flex;
    align-items: center;
    width: 80%;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .avatar-item {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    border: 0.5px solid #dbd9d9;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .avatar-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .name-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 15px;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .name-item h5 {
    font-size: 16px;
    color: #000000;
    text-decoration: none solid rgb(0, 0, 0);
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .name-item span {
    font-size: 14px;
    color: #000000;
    font-weight: 300;
    text-decoration: none solid rgb(0, 0, 0);
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .type-admin-item {
    font-size: 14px;
    color: #000000;
    font-weight: 300;
    text-decoration: none solid rgb(0, 0, 0);
    width: 20%;
}
.organization-form input{
    padding: 0 30px 0 10px ;
    line-height: 30px;
    height: 30px;
    border-radius: 5px;
    font-size: 16px;
}

.organization-form .icon-is-verified{
    color:#5db49a; 
    font-size: 20px;
    position: absolute;
    right: 5px;
    bottom: 5px;
}


/* .col-xs-4 {
    width: 25%;
}

.col-xs-8 {
    width: 75%;
} */

/* .panel.panel-pi {
    margin-left: -10px;
    margin-right: -10px;.organization-form input{
    padding: 0 30px 0 10px ;
    line-height: 30px;
    height: 30px;
    border-radius: 5px;
    font-size: 16px;
}
} */

.panel.panel-pi .panel-heading .panel-title.text-center .text-organizations {
    text-decoration: none;
}

.panel .panel-body .authenticate_content {
    margin-top: -20px;
}

.panel-body .authenticate_content {
    display: flex;
}

.panel-body .authenticate_content .icon_check_email {
    margin-left: 10px;
    max-height: 25px;
}

.panel .panel-body .authen_email {
    display: flex;
    margin-top: 20px;
    margin-left: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.panel .panel-body .authen_haravan {
    display: flex;
    margin-top: 20px;
    margin-left: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.panel .panel-body .authen_oss {
    display: flex;
    margin-top: 20px;
    margin-left: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.panel .panel-body .authen_email_content{
    margin-left: 20px;
}

.panel .panel-body .authen_email_content_text{
    margin-top: -24px;
    margin-left: -10px;
    font-size: 16px;
}

.panel .panel-body .authenticate_content{
    margin-top: 0px;
    font-size: 16px;
}

.panel .panel-body .authen_email_content_text2{
    font-size: 14px;
}

.panel .panel-body .authen_haravan_content_text_haravan{
    font-size: 14px;
}

.panel .panel-body .authen_haravan_content_text_oss{
    font-size: 14px;
}

.panel .panel-body .content_replace{
    font-size: 14px;
}

.panel .panel-body .col_left {
    display: flex;
}

.panel-body .btn-setting {
    width: 120px;
    height: 30px;
    margin-top: 10px;
    padding: 6px 10px;
    border-radius: 10px;
    background-color: #3498db;
    background-size: cover;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
}

.panel-body .btn-edit {
    width: 120px;
    height: 30px;
    margin-top: 10px;
    padding: 6px 10px;
    border-radius: 10px;
    background-color: #c2c2c2;
    background-size: cover;
    font-family: Roboto;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
}

.panel-body .col_left .icon_at{
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    background-size: cover;
    box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
}

.panel-body .col_left .icon_at .fa-at {
    color: #3498db;
    font-size: 24px;
}

.panel-body .col_left .fa-at.single {
    color: #3498db;
    margin-top: -22px;
    margin-right: 0px;
    font-size: 20px;
}

.panel-body .col_left .iconAuHaravan {
    margin-top: -22px;
    margin-right: 0px;
    width: 24px;
    height: 24px;
}

.panel-body .col_left .iconAuOss {
    margin-top: -18px;
    margin-right: -5px;
    width: 42px;
    height: 16px;
}

.bootstrap-tagsinput {
    width: 620px;
    margin-top: 10px;
    border: 1px solid #c8c8c8;
    border-radius: 8px;
    background-color: #ffffff;
    background-size: cover;
    font-size: 16px;
    color: #949494;
    font-weight: 300;
    text-decoration: none solid rgb(148, 148, 148);
}

.content_auth {
    margin-left: 10px;
    margin-top: 15px;
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}

.authen_email_content_haraven_and_oss {
    margin-left: 10px;
    margin-top: 15px;
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}

.bootstrap-tagsinput .tag {
    margin-top: 4px;
    border-radius: 4px;
    background-color: #5db49a;
    background-size: cover;
    text-align: center;
    background-color: #5db49a;
    font-size: 14px;
    color: #f7f7f7;
    font-weight: 400;
    text-decoration: none solid rgb(247, 247, 247)
}

.panel-body .btn-save {
    width: 116px;
    height: 39px;
    margin-top: 30px;
    margin-left: 10px;
    padding: 6px 10px;
    border-radius: 8px;
    background-color: #5db49a;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
}

.manage-select{
    font-size: 14px;
    padding: 1px 20px 1px 20px;
    height:30px;
}

.skills-selected .select2-selection__choice{
    font-size: 14px;
}

@keyframes dot-keyframes {
    0% {
        opacity: .4;
        transform: scale(1, 1);
    }

    50% {
        opacity: 1;
        transform: scale(1.2, 1.2);
    }

    100% {
        opacity: .4;
        transform: scale(1, 1);
    }
}
  
.loading-dots {
    text-align: center;
    width: 100%;
}
    
.loading-dots--dot {
    animation: dot-keyframes 1.5s infinite ease-in-out;
    background-color: #000;
    border-radius: 5px;
    display: inline-block;
    height: 5px;
    width: 5px;
}   
    
.loading-dots--dot:nth-child(2) {
    animation-delay: .5s;
}
    
.loading-dots--dot:nth-child(3) {
    animation-delay: 1s;
}

.view-start-course .detail-part__title,
.view-start-course .link{
    text-transform: lowercase;
    color: #454242;
}
.view-start-course .detail-part__title::first-letter,
.view-start-course .link::first-letter{
    text-transform: uppercase;
}
.view-start-course .instructor-avt img{
    border-radius: 50%;
}
.view-start-course .instructor-comp__username {
    color: #696969;
    font-weight: 300;
}
.view-start-course .course-detail {
    margin-top: 0;
}
.view-start-course .container_course_detail_about {
    background: none;
    margin: 0;
    padding: 0;
}
.view-start-course .jq-rating {
    display: grid;
    justify-content: center;
    grid-auto-flow: column;
    grid-template-columns: 120px 120px;
    grid-template-rows: auto auto;
    grid-gap: 20px;
}

.view-start-course .jq-rating div {
    justify-self: center;
}
.view-start-course .jq-rating .jq-rating-like:after,
.view-start-course .jq-rating .jq-rating-dislike:after {
    content: attr(data-content);
    text-overflow: ellipsis;
}
.view-start-course .after-title {
    font-weight: 300;
}
.view-start-course h5 {
    font-size: 16px;
}
.view-start-course .container-comment {
    position: relative;
    width: auto;
}
.view-start-course .comments__body {
    height: auto;
    overflow: hidden;
}
.view-start-course .sprite {
    pointer-events: none;
}
.view-start-course .panel-default>.panel-heading {
    background-color: #fff;
}

@media screen and (max-width: 550px){
    .view-detail-learning-page{
        padding: 0;
    }

    .view-detail-learning-page .btn--create{
        margin-bottom: 20px;
    }

    .view-detail-learning-page .title-learning{
        font-size: 16px;
    }

    .view-detail-learning-page .columns.large-4.small-12.left-side{
        padding: 0 30px;
    }

    .view-detail-learning-page .btn--create{
        border-radius: 20px;
    }

    .timeline{
        margin: 0;
        margin-left: 30px;
    }

    .timeline .box{
        width: 100%;
        height: 100px;
        text-align: center;
    }

    .timeline .box--node{
        width: 20px;
        height: 20px;
        font-size: 14px !important;
        line-height: 20px;
        left: -20px;
        top: 50%;
    }

    .timeline .box__body .box--title{
        margin: 5px 10px;
        font-size: 15px;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }

    .timeline .box__body .box--small-footer{
        margin: 0;
        width: 80%;
        min-width: 100px;
        align-self: center;
        font-size: 12px !important;
        margin-bottom: 5px;
    }

    .timeline .box__header{
        margin: 0;
        min-width: 150px;
        max-width: 150px;
        height: 100%;
    }

    .timeline .box--wrap-img{
        width: 100%;
        height: 100%;
    }

    .timeline::before {
        left: -20px;
        top: 50px;
        height: calc(100% - 100px);
    }
    
    .timeline .box::before,
    .timeline .box::after {
        left: -20px;
        width: 10px;
    }

    .create-detail-learning-page .timeline .box__body .box--title{
        margin: 5px 20px 5px 10px;
    }

    .create-detail-learning-page .box__body{
        height: 75px;
    }

    .create-detail-learning-page .sp-timeline{
        left: 8px;
    }

    .create-detail-learning-page .sp-timeline .item-order{
        height: 100px;
    }

    .create-detail-learning-page .timeline::before{
        height: calc(100% - 100px);
    }

    .box--des{
        display: none;
    }

    .view-detail-learning-page .timeline .box__body .box--small-footer{
        justify-content: space-between;
    }

    .view-detail-learning-page .timeline .box__body .box--small-footer .item-name-company{
        width: 50% !important;
        max-width: 50%;
    }
    
    .view-detail-learning-page .timeline .box__body .box--small-footer .item-level{
        width: 50% !important;
        max-width: 50%;
    }
    .box-footer-des{
        display: none;
    }
}

@media screen and (max-width: 1023px){
    .view-detail-learning-page .columns.large-4.small-12.left-side{
        position: unset !important;
    }
}

.view-learning-learning-page .content-learning{
    position: relative;
}

.view-learning-learning-page .content-learning .title-learning .loading-dots{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.invite-member{
    background: #fff;
}

.invite-member .validate-icon{
    display: none; 
    position: absolute; 
    right: 0; 
    top: 0; 
    font-size: 30px;
    padding: 5px 20px;
}
.invite-member .validate-invite-ok{
    color:green;    
}

.invite-member .validate-invite-error{
    color:red;
}

.btn-emove-invite{
    font-size: 35px; 
    cursor: pointer;
}

.invite-member .js-btn-invite-user{
    margin-top: 30px;
    height: 30px; 
    width: 100px; 
    color: #fff; 
    background:#2ba6cb;
}

.invite-member .btn-remove-invite{
    font-size: 35px;
    cursor: pointer;
}

.invite-member .js-input-level-invite{
    margin-bottom: 0;
}


.profile-comp__name{
    font-size: 16px;
}

.profile-comp__info{
    font-size: 14px;
    font-weight: 300;
}
.content_follow {
    display: flex;
}

.content_following {
    display: flex;
}

.content_follow .icon-follow {
    font-size: 20px
}

.content_follow .text-follow {
    margin-top: 1px;
    font-weight: 400 !important;
}

.content_following .icon-following {
    font-size: 20px
}

.content_following .text-following {
    margin-top: 1px;
    font-weight: 400 !important;
}

.totalFollowers {
    margin-bottom: -30px;
    margin-top: 8px;
    font-weight: 300;
    font-size: 14px;
    color: #545454;
    text-decoration: none solid rgb(84, 84, 84);
}
.profile-btn__follow{
    border-radius: 6px;
    background-color: #7a7a7a;
    font-size: 14px;
    color: #ffffff;
    font-weight: 300;
    margin-top: 10px;
    padding: 3px 20px;
}

.organization-form .avatar_edit{
    margin-left: 0;
    bottom: unset;
    position: unset;
    margin-top: 10px;
}
/* #powerpoint .items {
    list-style-type: none;
} */

#powerpoint .items .ui-selected {
    background: red;
    color: white;
    font-weight: bold;
}

.sortable-highlight {
    width: 120px;
    height: 160px;
    margin-bottom: 16px;
    border: 1px solid red;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    font-weight: bold;
    font-size: 45px;
    background-color: lightblue;
}

#powerpoint .items .item{
    position: relative;
    overflow: visible !important;
}

#powerpoint .items .item .dropdown{
    display: none;
    position: absolute;
    top: 50%;
    right: -25px;
    transform: translate(0, -50%);
    font-size: 6px;
    z-index: 999;
}

#powerpoint .items .item.empty.active .dropdown{
    display: none;
}

#powerpoint .items .item.active .dropdown{
    display: block;
}

.view-detail-learning-page .timeline .box__body .box--title{
    margin: 5px 20px 5px 10px;
    line-height: 18px;
}

.view-detail-learning-page .timeline .box__body .box--des{
    margin: 5px 20px 5px 10px;
}

.view-detail-learning-page .timeline .box__body .box--des p{
    line-height: 17px;
}
.view-detail-learning-page .timeline .box__body .box--small-footer {
    display: flex;
    margin: 5px 20px 5px 10px;
    color: #303030;
    font-size: 15px;
    font-weight: 300;
    text-align: left;
}

.view-detail-learning-page .timeline .box__body .box--small-footer .item-name-company{
    width: 12%;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
    overflow: hidden;
}

.view-detail-learning-page .timeline .box__body .box--small-footer .item-level{
    width: 60%;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
    overflow: hidden;
}

.instructors-learning .instructor-item{
    border-radius: 10px;
    box-shadow: 0px 1px 2px #8c8c8c;
    text-align: center;
    margin: 5px;;
}

.instructors-learning .instructor-item-ex{
    display: none;
}

.instructors-learning .instructor-item .header-img-instructor{
    padding: 20px 0 10px 0;
    width: 100%;
    display: flex;
    justify-content: center;
}

.instructors-learning .instructor-item .header-img-instructor img{
    object-fit: contain;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid #337899;
}

.instructors-learning .instructor-item .header-title-instructor{
    padding: 10px 5px;
    font-size: 16px;
    color: #484848;
    width: 100%;
    height: 65px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.instructors-learning .instructor-item .bottom-info-instructor{
    padding: 10px 5px;
    margin-bottom: 40px;
    color: #484848;
    font-weight: 300;
    width: 100%;
    height: 65px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.instructors-learning .instructor-item .bottom-info-instructor span{
    font-size: 16px !important;
}

.view-detail-learning-page .wrapper-learning .create-by{
    font-size: 13px;
    font-weight: 300;
    padding: 0 5px 5px 5px;
}

.view-detail-learning-page .wrapper-learning .create-by span{
    font-size: 13px !important;
}
.popup_create_course{
    background: #edebeb; 
    height:2rem;
    margin: 0 auto;
    /* display: none; */
    cursor: pointer;
    border-radius: 4px;
    font-size: 16px;
    color: #424242;
}

.learningpath-action .selection{
    display: none;
}

.assignment-action .selection{
    display: none;
}

.course-action .selection{
    display: none;
}

.loading-gradient{
    animation-duration: 1.8s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #fafafa 8%, #f4f4f4 38%, #fafafa 54%);
    background-size: 1000px 640px;
}

@keyframes placeHolderShimmer{
    0%{
        background-position: -468px 0
    }
    100%{
        background-position: 468px 0
    }
}
.js-popup-change-group-name .popup{
    width: 340px;
    height: 218px;
    opacity: 0.9;
    border: 1px solid #d1d1d1;
    border-radius: 4px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    justify-content: center;
    position: relative;
    opacity: 0.8;
}
.js-popup-change-group-name .popup .close{
    position: absolute;
    right: 0;
    top:0;
}
.js-popup-change-group-name .popup .header{
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.js-popup-change-group-name .popup .body{
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
}
.js-popup-change-group-name .popup .body input{
    border-radius: 4px;
}
.js-popup-change-group-name .popup .footer{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.js-popup-change-group-name .popup .footer button{
    color: #FFF;
    background: #5db49a;
    padding: 5px 10px;
    border-radius: 4px;
}

#popup-alert-success .popup {
    animation-name: show-popup;
    animation-duration: 0.3s;
    opacity: 0.8;
}
#popup-alert-success .popup .popup-alert-success {
    width: 340px;
    height: 218px;
    opacity: 0.9;
    border: 1px solid #d1d1d1;
    border-radius: 4px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    justify-content: center;
    position: relative;
}
#popup-alert-success .popup .popup-alert-success .close{
    position: absolute;
    right: 0;
    top:0;
}
#popup-alert-success .popup .popup-alert-success .close i{
    font-size: 30px;
    color: #858282;
}
#popup-alert-success .popup .popup-alert-success .header {
    flex: 3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#popup-alert-success .popup .popup-alert-success .header i {
    font-size: 70px;
    color: #5db49a;
}

#popup-alert-success .popup .popup-alert-success .body {
    padding-top: 15px;
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    font-family: Roboto;
    font-size: 18px;
    color: #000000;
    text-decoration: none solid rgb(0, 0, 0);
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes show-popup {
    0% {transform: translate(-50%, -50%) scale(0)}
    90% {transform: translate(-50%, -50%) scale(1.1)}
    100% {transform: translate(-50%, -50%) scale(1)}
}

/* Standard syntax */
@keyframes show-popup {
    0% {transform: translate(-50%, -50%) scale(0)}
    90% {transform: translate(-50%, -50%) scale(1.1)}
    100% {transform: translate(-50%, -50%) scale(1)}
}

.btn-course-detail .container-tooltip{
    top: 56px;
}

.btn-course-detail .container-tooltip::after{
    top: -10px;
}
#title-card {
    position: relative;
}
.main_course .time-limit {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    color: #fa1b0f;
    font-size: 16px;
    font-weight: normal;
}
.main_course .time-limit--item  {
    display: inline-block;
    
}
.main_course .time-limit--fa {
    margin-right: 0.5rem;
    color: #636261;
    font-size: 18px;
}

.course-item.suggest-tracking:hover{
    box-shadow: 0 0 0 2px #00bba9;
}
.p-btn--primary {
    background-color: #5db49a;
    color: #ffffff;
}
.p-qr-code__download {
    display: flex;
    /* flex-direction: column; */
    align-items: center;
}

.select2-results__options .avatar-thumbnail{
    width: 30px;
    height: 30px;
    max-width: 30px;
    max-height: 30px;
    min-width: 30px;
    min-height: 30px;
    border-radius: 50%;
    object-fit: cover;
    vertical-align: middle;
    margin-right: 0.5rem;
}
/* featured page */
.pi-featured .row {
    margin-left: -15px;
    margin-right: -15px;
}
.pi-content {
    margin-top: 26px;
}
.pi-featured ul{
    padding-bottom: 0;
}

.pi-featured--title {
    color: #ffffff;
}
.pi-featured-content {
    margin-bottom: 2rem;
}
.pi-featured-content--title {
    border-radius: 10px;
    background-color: #5db49a;
    background-repeat: no-repeat;
    font-family: Roboto;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgba(255, 255, 255, 0.84);
    padding: 0.25rem 2rem;
    width: fit-content;
    text-transform: capitalize;
}

/* pi post */
.pi-btn {
    border: none;
    padding: 0.25rem 1.5rem;
}
.pi-post--ratio,.pi-post__cover--ratio {
    padding-top: calc(100%*4/3);
    position: relative;
    /* height: 0; */
    width: 100%;
}
.pi-post--inside {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height:100%;
}
.pi-post {
    border: 1px solid #cccccc;
    border-radius: 6px;
    background-color: #fff;
    overflow: hidden;
    transition: 0.25s;
    box-shadow: 0px 2px 5px 1px hsla(0, 0%, 70%, .5);
    margin: 15px 0;
}

.pi-post:hover {
    border: 1px solid #00bba9;
}
.pi-post--action {
    justify-self: center;
    margin: 0 auto;
    border: 1px solid #5db49a;
    border-radius: 4px;
    background-color: #5db49a;
    background-repeat: no-repeat;
    font-family: Roboto;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255)
}
.pi-post--cover {
    width: 100%;
    object-fit: cover;
}
.pi-post__cover {
    overflow: hidden;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.pi-post__cover--ratio {
    padding-top: calc(100%*2/3);
}

.pi-post__post {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.pi-post__body {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    padding: 1rem;
    height: 100%;
}
.pi-post__content {
    height: 100%;
}
.pi-post__description {
    flex-grow: 1;
    display: flex;
    align-items: center;
}

.pi-post--title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    height: calc(21px * 2);
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    font-size: 18px;
    color: #000000;
    font-weight: 500;
    line-height: 21px;
}

.pi-post--description {

}

.pi-post--horizontal .pi-post__post{
    flex-direction: row;
}
.pi-post--horizontal .pi-post--ratio {
    padding-top: calc((47%)*2/3);
}
.pi-post--horizontal .pi-post--inside {
    min-height: 100%;
}
.pi-post--horizontal .pi-post__content {
    flex-basis: 53%;
}
.pi-post--horizontal .pi-post__cover--ratio {
    padding-top: calc((47%)*2/3);
    flex-basis: calc(47%);
}
.pi-post--horizontal .pi-post__cover {
    border-top-right-radius: 0;
    border-bottom-left-radius: 5px;
}
.p-modal--select .modal-content{
    background-color: #ebebeb;
}
.p-modal--select .modal-body,
.p-modal--select .modal-footer,
.p-modal--select .modal-header {
    border: none;
}
.p-modal--select .modal-header label {
    text-decoration: underline;
}
.p-modal--select .modal-body{
    padding-top: 0;
    padding-bottom: 0;
}
.p-modal--select .modal-header {
    padding-top: 2rem;
}
.p-modal--select .modal-footer {
    padding-bottom: 2rem;
}


.no-gutter {
    padding: 0;
}
input.input-edit,
input[type='text'].input-edit:focus {
    border: none;
    border-bottom: 1px solid #ddd;
    border-radius: unset;
    box-shadow: none;
    padding-bottom: 0;
    padding-left: 0;
    height: auto;
}
/* flex layout */
.flex {
    display: flex;
}
.flex-start {
    display: flex;
    justify-content: start;
    align-items: center;
}
.flex-start-center {
    display: flex;
    justify-content: start;
    align-items: center;
}
.flex-end-center {
    display: flex;
    justify-content: end;
    align-items: center;
}
.flex-space-between {
    display: flex;
    justify-content: space-between;
}
.bootstrap-tagsinput {
    width: 100%;
}
.bootstrap-tagsinput input{
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
}
.select2-container--default .select2-selection--single{
    height: 33px;
}
.select2-results__options img.img-flag{
    max-width: 3rem;
    max-height: 1.5rem;
    vertical-align: middle;
}
.select2-container--open .select2-dropdown--below{
    width: 10rem;
}
.select2-container--default .select2-selection--multiple ul.select2-selection__rendered{
    padding-bottom: 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered li{
    color: #000000;
}

/* marign */
.margin-top {
    margin-top: 1rem;
}

/* btn */
.btn.none-border,
.btn.none-border:visited,
.btn.none-border:hover {
    border: none;
    outline: none;
}
.btn.btn-circle {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

/* icons */
.icon {
    display: inline-block;
    object-fit: cover;
    object-position: center;
    vertical-align: middle;
    width: 25px;
    height: 25px;
}
.icon.icon-play {
    content: url('/assets/images/icons/play.svg');
}
.icon.icon-plus {
    content: url('/assets/images/icons/plus.svg');
}
.icon.icon-small {
    width: 25px;
    height: 25px;
}
.icon.icon-medium {
    width: 30px;
    height: 30px;
}

/* input */
input[type="file"].over-click {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /* background-color: red; */
    cursor: pointer;
    opacity: 0;
    z-index: 999;
}
label.checkbox {
    position: relative;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    min-width: 1.5rem;
    min-height: 1.5rem;
    margin: 0;
    cursor: pointer;
    /* background: rebeccapurple; */
}
label.checkbox > input[type="checkbox"] {
    display: none;
    position: absolute;
}
label.checkbox > input[type="checkbox"] + span{
    display: inline-block;
    width: 100%;
    height: 100%;
    /* border: 1px solid #999999; */
    background-color: #cdcdcd;
}
label.checkbox > input[type="checkbox"]:checked + span {
    background-color: #5db49a;
}
label.checkbox > input[type="checkbox"] + span::before { 
    display: none;
    content: "";
    position: absolute;
    width: 10px;
    height: 15px;
    border: solid white;
    border-width: 0 3px 3px 0;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -moz-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    -o-transform: translate(-50%, -50%) rotate(45deg);
}
label.checkbox > input[type="checkbox"]:checked + span::before {
    display: block;
}

label.radio {
    position: relative;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    min-width: 1.5rem;
    min-height: 1.5rem;
    margin: 0;
    cursor: pointer;
    /* background: rebeccapurple; */
}
label.radio > input[type="radio"] {
    display: none;
    position: absolute;
}
label.radio > input[type="radio"] + span{
    display: inline-block;
    width: 100%;
    height: 100%;
    border: 1px solid #cdcdcd;
    background-color: #fff;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
label.radio > input[type="radio"]:checked + span {
    background-color: #cdcdcd;
}
label.radio > input[type="radio"] + span::before {
    display: none;
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: #5db49a;
    transition: all 0.25s;
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -ms-transition: all 0.25s;
    -o-transition: all 0.25s;
}
label.radio > input[type="radio"]:checked + span::before {
    display: block;
    transition: all 0.25s;
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -ms-transition: all 0.25s;
    -o-transition: all 0.25s;
}
/* sweetalert2 */
.swal2-container .swal2-popup{
    font-size: 0.8rem;
    padding: 0;
    /* background-color: #d1d1d1; */
}
.swal2-popup .swal2-header {
    color: #fff;
}
.swal2-popup .swal2-content {
    /* background-color: #f5d8d8; */
    padding: 0.5em;
    font-size: 1.5em;
    border-bottom: 1px solid #d1d1d1;
}
.swal2-popup .swal2-content p{
    padding: 0.5em 0;
}
.swal2-popup .swal2-actions {
    margin-top: 0;
    width: 100%;
    /* margin-bottom: 1em; */
}

.swal2-popup .swal2-styled.swal2-confirm:focus {
    box-shadow: none;
}
.swal2-popup button.swal2-styled,
.swal2-popup .swal2-actions button{
    background-color: #fff;
    outline: none;
    margin: 0;
    border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
}
.swal2-popup .swal2-actions button:hover {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}
.swal2-popup .swal2-actions .swal2-cancel {
    color: #595959;
    flex-grow: 1;
}
.swal2-popup .swal2-actions .swal2-confirm {
    color: #5db49a;
    flex-grow: 1;
    border-left: 1px solid #d1d1d1 !important;
}
.swal2-container .swal2-icon {
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
}
.swal2-container .swal2-icon .swal2-icon-text {
    /* font-size: 1.75rem; */
}
/* .swal2-container .swal2-header {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
} */
.swal2-container .swal2-content div{
    padding: 35px 20px;
}
.swal2-container .swal2-actions .swal2-styled{
    padding: 1rem 0;
}
.swal2-icon.swal2-warning,
.swal2-icon.swal2-error {
    background-color: #fff;
    border-color: #fff;
    /* color: #fff; */
}
.swal2-icon.swal2-error [class^=swal2-x-mark-line] {
    background-color: #d11706;
}
/* .swal2-icon .swal2-icon-text {
    font-size: 1.75em;
} */

.btn-edit-course {
    width: 30px;
    height: 30px;
    /* padding: 0 0.5rem; */
    position: absolute !important;
    top: 0px;
    right: 0px;
    z-index: 9;
    font-size: 1.25rem;
    color: #fff;
    background-color: rgba(0,0,0,.1);
    border-radius: 5px;
}
.time-heart {
    width: 42%;
    display: flex;
    justify-content: flex-end;
    background: rgba(0,0,0,0.3);
    position: absolute!important;
    z-index: 9;
    right: 0;
    border-bottom-left-radius:10px;
}
.time-heart-p{
    font-size:16px;
    color:#fff;
    margin-top:0.7rem;
    font-weight:400;
    margin-right:0.2rem
}
.btn-heart {
    width: 45px;
    height: 45px;
    top: 0px;
    right: 0px;
    z-index: 9;
    font-size: 12px;
    color: #fff;
    border-radius: 5px;
}

.btn-heart-main {
    margin-right: 2rem;
    width: 50px;
    display: flex;
    height: 50px;
    z-index: 9;
    font-size: 14px;
    color: #fff;
    border-radius: 5px;
    justify-content: space-around;
}

.btn-heart-main .heart{
    position: absolute;
    top: 25%;
    left: 7%;
}
.btn-heart .heart{
    top:-37px;
}
.wrap-heart {
    width: 30px;
    height: 30px;
    font-size: 12px;
    color: #fff;
}
.heart-number{
    position: absolute;
    top: 23%;
    right: 12px;
    font-size: 10px;
}
.btn-edit-course:hover {
    color: #fff;
    background-color: rgba(0,0,0,.5);
}
.disabled {
    pointer-events:none;
    opacity:0.6;
    cursor: pointer;
}
/* switch */
.pi-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 25px;
  }
  
  /* Hide default HTML checkbox */
  .pi-switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .pi-switch .switch-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .pi-switch .switch-slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: -2px;
    top: 50%;
    transform: translateY(-50%);
    background-color: white;
    transition: 0.4s  ;
    -webkit-transition: 0.4s  ;
    -moz-transition: 0.4s  ;
    -ms-transition: 0.4s  ;
    -o-transition: 0.4s  ;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
  .pi-switch .switch-slider,
  .pi-switch .switch-slider:before {
      border: 1px solid #ccc;
  }
  
  .pi-switch input:checked + .switch-slider {
    background-color: #43e87a;
  }
  
  /* .pi-switch input:focus + .switch-slider {
    box-shadow: 0 0 1px #2196F3;
  } */
  
  .pi-switch input:checked + .switch-slider:before {
    left: 100%;
    transform: translate(calc(-100% + 2px), -50%);
    -webkit-transform: translate(calc(-100% + 2px), -50%);
    -moz-transform: translate(calc(-100% + 2px), -50%);
    -ms-transform: translate(calc(-100% + 2px), -50%);
    -o-transform: translate(calc(-100% + 2px), -50%);
}
  
  /* Rounded sliders */
  .pi-switch .switch-slider.round {
    border-radius: 34px;
  }
  
  .pi-switch .switch-slider.round:before {
    border-radius: 50%;
  }

  .panel.panel-pi .panel-heading{
    background-color: #5db49a;
  }
  .panel.panel-pi .list-group {
      /* padding: 0; */
      margin: 0;
  }
  .panel.panel-pi .list-group .list-group-item.active {
      background-color: #b8b8b8;
  }
  .panel.panel-pi .list-group .list-group-item a {
      color: #000;
  }
  .btn-pi {
      background-color: #5db49a;
      color: #fff;
  }
  .f-popup.f-popup-v {
      background-color: transparent;
      z-index: 1000;
  }
  .f-popup.f-popup-v::before{
      content: '';
      width: 100vw;
      position: fixed;
      display: block;
      left: 0;
      top: 0;
      height: 100vh;
      background-color: hsla(0, 0%, 50%, .9);
      z-index: -1;
  }

.block-ellipsis {
    display: block;
    display: -webkit-box;
    max-width: 100%;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.block-ellipsis.block-ellipsis-2 {
    -webkit-line-clamp: 2;
}
.block-ellipsis.block-ellipsis-1 {
    -webkit-line-clamp: 1;
}
.ellipsis {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.ctn-show-status {
    position: relative !important;
}
.show-status {
    position: absolute !important;
    top: 0;
    left: 0;
    padding: 0.2rem 0.8rem;
    z-index: 99;
    background-color: rgba(128,128,128,0.9);
    border-radius: 2px;
    font-size: 15px;
    color: white;
}
.show-status-draft {
    width: 109px;height: 27px; 
    transform: rotate(315deg);  
    top: 5px;
    left: -27px;
    padding: 0.2rem 2rem;   
    background-color: #10b313;
}
.show-status::first-letter{
    text-transform: capitalize;
}
/* .ql-toolbar.ql-snow {
   position: absolute;
    bottom: 50%;
    top: 0;
    left: 0;
} */

#create-flash-card .ql-container.ql-snow {
    border: none;
}
#create-flash-card .ql-toolbar.ql-snow {
    position: absolute;
    bottom: 100%;
}
#create-flash-card .ql-snow a {
    color: #06c;
}
.ql-editor {
    overflow-y: hidden;
}
.ql-editor div img {
    width: 100% !important;
}
.ql-editor iframe {
    width: 100%;
}
.ql-toolbar.ql-snow {
    background-color: #fff;
}
.ql-editor {
    padding: 0;
}
.ql-editor p {
    padding: 0 20px;
}
.card_text.ql-snow .ql-editor {
    white-space: normal;
}

.ql-video{
    width: 100%;
}
.ql-snow .ql-tooltip.ql-editing{
    left: 10px !important;
    right: 10px;
    /* top: 0px !important; */
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after{
    border-right: 0px;
    content: 'Save';
    padding-right: 0px;
    color: #000;
    margin-left: 8px;
}
#create-flash-card .question-type .question .text-question{
    padding: 0 0 !important;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value$="px"]::before {
    content: attr(data-value);
}

.ql-formats .ql-div::before {
    content: 'fullwidth';
    font-weight: bold;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before {
    content: attr(data-value);
}

.spinner {
    margin: 0 auto;
    width: 70px;
    text-align: center;
}

.spinner > div {
    width: 4px;
    height: 4px;
    background-color: #aaa;

    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
    0%, 80%, 100% { -webkit-transform: scale(0) }
    40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    } 40% {
          -webkit-transform: scale(1.0);
          transform: scale(1.0);
      }
}

.p-btn {
    font-size: 11px;
    padding: 5px 25px;
    border: none;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
}
.p-btn-primary {
    color: #fff;
    background-color: #5db49a;
}
.p-btn-default {
    color: #3b3b3b;
    background-color: #b3b5b5;
    margin-right: 20px;
}
input[type=range] {
    display: flex;
    align-items: center;
    width: 50%;
    margin: 0 auto;
}
input[type=range]::before {
    content: '';
    margin-right: 15px;
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url('/assets/images/icons/image.svg');
    background-repeat: no-repeat;
    background-size: contain;
}
input[type=range]::after {
    content: '';
    margin-left: 15px;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/assets/images/icons/image.svg');
    background-repeat: no-repeat;
    background-size: contain;
}
.bootstrap-datetimepicker-widget .list-unstyled{
    margin: 0;
    padding: 0 42.5px;
}
.bootstrap-datetimepicker-widget .timepicker-hour,.bootstrap-datetimepicker-widget .timepicker-minute,.bootstrap-datetimepicker-widget  .timepicker-second{
    display: block;
    text-align: center;
}
#create-course-page .btn {
    padding: 6px 12px;
}
#create-course-page .edit-description {
    min-height: 200px;
    height: min-content;
}
#create-course-page .course-item,
.card-course .course-item {
    box-sizing: border-box;
    box-shadow: none;
    border: 2px solid #f5f5f5;
    overflow: unset;
}
#create-course-page .ql-editor {
    height: 100%;
    min-height: 150px;
}
#create-course-page .course-item .show,
.card-course .course-item .show {
    display: flex !important;
}

#create-course-page .course-item .show img,
.card-course .course-item .show img {
    max-width: 2rem;
    max-height: 1rem;
    margin-right: 4px;
}

#create-course-page .button-update-course {
    padding: 10px;
    width: 100%;
    font-family: Roboto;
    font-size: 16px;
    color: #ffffff;
    font-weight: 500;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    border-radius: 6px;
    background-color: #5db49a;
    background-size: cover;
    box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.2);
}

#create-course-page .button-detail-course {
    margin-top: 10px;
    padding: 10px;
    width: 100%;
    font-family: Roboto;
    font-size: 16px;
    color: #ffffff;
    font-weight: 500;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    border-radius: 6px;
    background-color: #337899;
    background-size: cover;
    box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.2);
}

/* #create-course-page .course-item:hover {
    border: 2px solid #00bba9;
} */
#create-course-page .course-item .container-thumbnail,
.card-course .course-item .container-thumbnail {
    position: relative !important;
    /* height: 50%; */
    width: 100%;
    background-color: #cccccc;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding-top: calc(100%*2/3);
}

#create-course-page .course-item .container-thumbnail .course_image,
.card-course .course-item .container-thumbnail .course_image {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    z-index: 10;
}

#create-course-page .course-item .container-thumbnail .file-thumbnail,
#create-course-page .course-item .container-thumbnail .placeholder,
.card-course .course-item .container-thumbnail .file-thumbnail,
.card-course .course-item .container-thumbnail .placeholder {
    display: inline-block;
    position: absolute !important;
    cursor: pointer;
}

#create-course-page .course-item .container-thumbnail .placeholder,
.card-course .course-item .container-thumbnail .placeholder {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 1rem;
    left: 0;
    top: 50%;
    width: 100%;
    height: 100%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

#create-course-page .course-item .container-thumbnail .placeholder .icon-plus .card-course .course-item .container-thumbnail .placeholder .icon-plus {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

#create-course-page .course-item .container-thumbnail .file-thumbnail,
.card-course .course-item .container-thumbnail .file-thumbnail {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 10;
}

#create-course-page .detail-part__title.none-border-bottom {
    border-bottom: none;
}

#create-course-page .detail-part__title {
    text-transform: none;
}

#create-course-page .instructor-block img {
    opacity: 1;
    background-color: #999;
    max-width: 8rem;
    border-radius: 100%;
    height: 80%;
}

#create-course-page .instructor-block {
    border: 1px solid #dadada;
    border-radius: 6px;
    margin-left: 0px !important;
}

#create-course-page .alert {
    margin-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

#create-course-page .alert.alert-gray {
    border: 1px solid #999999;
    background-color: #f5f5f5;
}

#create-course-page .course_title {
    height: calc(20px * 2);
}

#create-course-page .show-errors {
    padding: 0 1rem;
}

#create-course-page .show-errors .error {
    padding: 0.5rem 1rem 0;
    color: red;
    font-weight: bold;
}

#create-course-page .course_wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#create-course-page .course_wrap .show {
    font-size: 0.8rem;
}

#create-course-page .container-thumbnail .btn-remove {
    background-color: #dedede;
    opacity: 0.8;
    position: absolute !important;
    width: 2rem;
    height: 2rem;
    top: 0;
    right: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
    z-index: 11;
}

/* create-flash-card */
#publish-modal input[type="radio"]:checked,
#publish-modal input[type="radio"]:not(:checked) {
    position: relative;
    left: 0;
    top: 0;
}

#create-flash-card .thumbnail {
    border: 0;
    padding: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card audio {
    max-height: 40px;
    padding: 0;
    border-radius: unset;
    -webkit-border-radius: unset;
    -moz-border-radius: unset;
    -ms-border-radius: unset;
    -o-border-radius: unset;
}

#create-flash-card input,
#create-flash-card textarea {
    resize: none;
    margin: 0;
    box-shadow: none;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card li {
    float: none;
    padding: 0;
}

#create-flash-card a {
    color: #fff;
}

#create-flash-card .right-content,
#create-flash-card .left-content {
    height: 100vh;
    display: grid;
    align-items: center;
}

#create-flash-card .left-content {
    align-items: start;
}

#create-flash-card .main_course {
    /* margin: 0 auto; */
    left: unset;
    top: unset;
    transform: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    margin-top: 3rem;
}

#create-flash-card .main_course .btn-control {
    position: relative;
    left: unset;
    transform: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    margin-top: 1rem;
    min-height: 8rem;
}

#create-flash-card .main_course .tools {
    position: absolute;
    top: 0;
    right: -5%;
    display: grid;
    grid-column: auto;
    grid-row-gap: 0.5rem;
    padding: 0.25rem;
    background-color: #fff;
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    border-radius: 1rem;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    -ms-border-radius: 1rem;
    -o-border-radius: 1rem;
}

#create-flash-card .main_course .tools .btn {
    position: relative;
    background-color: #bdbdbd;
    width: 2rem;
    height: 2rem;
    transition: all 0.25s;
    /* margin-bottom: 1rem; */
}

#create-flash-card .main_course .tools .btn:hover {
    background-color: #5db49a;
    transition: all 0.25s;
}

#create-flash-card .main_course .tools .btn::before {
    /* content: 'Tạo card mới'; */
    position: absolute;
    font-weight: bold;
    top: 50%;
    left: calc(100% + 0.5rem);
    color: #474747;
    font-family: Roboto;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

#create-flash-card .main_course .btn-create-card:hover::before {
    content: 'Thêm';
}

#create-flash-card .main_course .btn-save-card:hover::before {
    content: 'Lưu';
}

#create-flash-card .main_course .btn-delete-card:hover::before {
    content: 'Xóa';
}

#create-flash-card .main_course .btn .fa {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 1rem;
    color: #fff;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}

#create-flash-card .main_course .btn .fa.fa-spin {
    top: 25%;
    left: 25%;
}

#create-flash-card .main_course .btn-back {
    position: absolute;
    top: 100%;
    transform: translateY(100%);
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
}

#create-flash-card .main_course .container-of-card .screen-radio .radio-container .content {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

#create-flash-card .main_course .container-of-card .screen-radio .radio-container .content.content-text {
    /*overflow: hidden;*/
    /* overflow-y: scroll; */
    /* padding: 0 1rem; */
}

#create-flash-card.assignment .btn-control.btn-control-action .tooltips {
    display: none;
}

.content-text {
    /*padding-left: 20px;*/
    /*padding-right: 20px;*/
    /* position:relative; */
}

/*.content-text div p img {*/
/*    max-width: calc(100% + 40px) !important;*/
/*    width: calc(100% + 40px) !important;*/
/*    margin-left: -20px;*/
/*    height: 100% !important;*/
/*}*/

/*.content-text div img {*/
/*    max-width: calc(100% + 40px) !important;*/
/*    width: calc(100% + 40px) !important;*/
/*    margin-left: -20px;*/
/*    height: auto !important;*/
/*}*/

/*
.content-text img{
    /* position: absolute;; */
/* width: calc(100% + 40px) !important; */
/* max-width: calc(100% + 40px) !important; */
/* width: calc(100% + 40px);
    position: relative;
    left: -20px;
    top: -20px; */
/* margin: 0 -80px -40px 0; */
/* margin-right: -20px;
    margin-left: -20px */
/* margin-left: -20px;
   
} */
#create-flash-card .question-type .answers {
    padding: 0 1rem;
}


#create-flash-card .notification-question-card {
    padding: 0.5rem;
}

#create-flash-card .notification-audio-card {
    background-color: #f1f3f4;
}

#create-flash-card .question-type {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

#create-flash-card .question-type .question {
    flex-grow: 1;
    overflow: hidden;
    border-bottom: 1px solid #bdbdbd;
}

#create-flash-card .question-type .question .text-question {
    height: 100%;
    overflow: hidden;
    padding: 0px 20px
}

#create-flash-card .question-type .question,
#create-flash-card .question-type .answers .answer {
    margin-bottom: 1rem;
}

#create-flash-card .question-type .answers .answer .text-answer {
    margin-left: 1rem;
}

#create-flash-card .content .container-thumbnail {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

#create-flash-card .content .container-thumbnail .btn-remove {
    background-color: #dedede;
    opacity: 0.8;
    position: absolute;
    width: 2rem;
    height: 2rem;
    top: 0;
    right: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
}

#create-flash-card .content .container-thumbnail .btn-remove:hover {
    opacity: 1;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
}

#create-flash-card .container-thumbnail .btn-remove .fa-remove {
    color: #575757;
    font-size: 18px;
    font-weight: 300;
}

#create-flash-card .content .container-thumbnail .thumbnail {
    border: none;
    padding: 0;
    width: 100%;
    /* height: 100%; */
    outline: none;
    box-shadow: none;
    object-fit: cover;
}

#create-flash-card .btn-control {
    padding: 0 1rem;
}

#create-flash-card .btn-control ul {
    background-color: transparent;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card .btn-control .actions {
    background-color: white;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

#create-flash-card .btn-control.btn-control-action .tooltips {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card {
    float: none;
    display: table;
    width: 40px;
    height: 40px;

}

#create-flash-card .tooltips .tooltip-for-card button {
    display: table-cell;
    margin: 0;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    position: relative;
    background-color: #cdcdcd;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button .fa-icon {
    font-size: 1.5rem;
    color: white;
    line-height: unset;
}

#create-flash-card .btn-control.btn-control-action .question-types .type.active,
#create-flash-card .tooltip-for-card button.active,
#create-flash-card .tooltip-for-card button:hover {
    background-color: #5db49a;
    color: white;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button.related:hover .fa-icon {
    color: white;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button.related .fa-icon {
    color: #5db49a;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button:disabled:hover {
    background-color: #cdcdcd;
    cursor: not-allowed;
}

#create-flash-card .btn-control.btn-control-action .tooltips .tooltip-for-card button:disabled:hover .fa-icon {
    color: white;
}

#create-flash-card .btn-control.btn-control-action .question-types {
    display: grid;
    grid-template-columns: auto auto;
    text-align: left;
    grid-gap: 0.5rem 1rem;
}

#create-flash-card .btn-control.btn-control-action .question-types button {
    display: table;
    width: auto;
    height: auto;
    background-color: #cdcdcd;
    overflow: hidden;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

#create-flash-card .btn-control.btn-control-action .question-types button:disabled:hover,
#create-flash-card .btn-control.btn-control-action .question-types button:disabled a:hover {
    background-color: #cdcdcd;
    cursor: not-allowed;
}

#create-flash-card .btn-control.btn-control-action .question-types button a {
    display: table-cell;
    padding: 0.25rem 0.5rem;
    width: 100%;
    height: 100%;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card .btn-control.btn-control-action .answer{
    border-radius: 20px;
}

#create-flash-card .btn-control.btn-control-action .answer ul{
    padding: 20px;
    display: grid;
    grid-template-columns: auto auto;
    text-align: left;
    grid-gap: 0.5rem 1rem;
}
#create-flash-card .btn-control.btn-control-action .answer ul button{
    display: table;
    width: auto;
    height: auto;
    background-color: #cdcdcd;
    overflow: hidden;
    border-radius: 20px;
    padding: 0.3rem 0;
}
#create-flash-card .btn-control.btn-control-action .answer ul button.action{
    background-color: #5db49a;
    color: white;
}

#create-flash-card .content-answer .header-answer{
    padding-top: 15px;
}

#create-flash-card .content-answer .header-answer p.title-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    text-transform: uppercase;
    padding-bottom:1rem;
    font-weight: 500;
}

#create-flash-card .content-answer .header-answer p.title-answer .bottom-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

#create-flash-card .content-answer .header-answer p.title-answer .right-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

.radio-container .header-answer .body-answer{
    height: 27em;
    overflow: auto;
}

.radio-container .header-answer p.title-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    text-transform: uppercase;
    padding-bottom:0rem;
    font-weight: 500;
}

.radio-container .header-answer p.title-answer .bottom-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

.radio-container .header-answer p.title-answer .right-answer{
    font-size: 16px;
    color: #474747;
    text-align: center;
    font-weight: 100;
    text-transform: none;
    text-decoration:underline ;
}

#create-flash-card #lesson {
    background-color: #fcfcfc;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    font-family: Roboto;
    font-size: 16px;
    color: #757575;

}

#create-flash-card #lesson .dropdown .btn {
    width: 100%;
    outline: none;
    box-shadow: none;
    display: flex;
    align-items: center;
}

#create-flash-card #lesson .dropdown .btn .text {
    width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

#create-flash-card ::-webkit-scrollbar {
    /* background-color: #000; */
    /* display: none; */
}

#create-flash-card .screen-radio .dropdown-menu {
    padding: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: none;
    background-color: #ebebeb;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    box-shadow: none;
    overflow: hidden;
    overflow-y: scroll;
}

#create-flash-card .screen-radio .dropdown-menu.open {
    display: block;
}

#create-flash-card .screen-radio .dropdown-menu li {
    display: block;
    margin: 0 auto;
    width: 95%;
    border: 1px solid #ffffff;
    background-color: #adadad;
    background-size: cover;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    padding: 1rem;
}

#create-flash-card .screen-radio .dropdown-menu li:hover {
    cursor: pointer;
}

#create-flash-card .screen-radio .dropdown-menu li.create {
    padding: 0.75rem;
}

#create-flash-card .screen-radio .dropdown-menu li.selected {
    background-color: #5db49a;
}

#create-flash-card .screen-radio .dropdown-menu>li>a {
    display: flex;
    align-items: center;
    justify-content: start;
    color: #fff;
}

#create-flash-card .screen-radio .dropdown-menu>li>a .icon {
    margin-right: 1rem;
}

#create-flash-card .screen-radio .dropdown-menu>li>a:hover,
#create-flash-card .screen-radio .dropdown-menu>li>a:visited {
    background-color: #adadad;
}

#create-flash-card .screen-radio .dropdown-menu>li.selected>a:hover,
#create-flash-card .screen-radio .dropdown-menu>li.selected>a:visited {
    background-color: #5db49a;
}

#create-flash-card .container-of-percentage {
    background-color: #fcfcfc;
}

#create-flash-card .container-of-percentage .percent {
    background-color: #ebebeb;
}

#create-flash-card .main_course .container-of-card .final-card .container-final {
    padding: 0;
}

#create-flash-card .main_course .container-of-card .final-card .btn-change-audio {
    padding-right: 1rem;
}

#create-flash-card .main_course .container-of-card .final-card .btn-change-audio .fa-icon {
    font-size: 1.5rem;
}

#create-flash-card .cke_inner .cke_toolbox {
    display: flex;
    flex-direction: column;
}

/* powerpoint */
#create-flash-card .left-content .action-menu {
    position: fixed;
    color: #000;
    z-index: 1000;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,.15);
    background-color: #fff;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

#create-flash-card .left-content .action-menu div a{
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}
#create-flash-card .left-content .action-menu div a:hover{
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5;
}

#create-flash-card .left-content .container-ppt {
    margin-top: 3rem;
    min-width: 10rem;
    max-width: 13rem;
    position: relative;
}

#create-flash-card .left-content .powerpoint {
    background-color: #fff;
    height: calc(100vh - 4rem);
    ;
    width: 100%;
    max-width: 100%;
    max-height: calc(100vh - 4rem);
    overflow-y: scroll;
    box-shadow: 0 0 1rem 0.25rem rgba(0, 0, 0, 0.1);
}

#create-flash-card .left-content .container-ppt .powerpoint-name {
    overflow: hidden;
    max-width: 20rem;
    /* width: 24rem; */
    text-overflow: ellipsis;
    white-space: nowrap;
    position: absolute;
    font-size: 20px;
    top: 0;
    left: 0;
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
}

#create-flash-card .left-content .powerpoint .group-lesson .items {
    padding-right: 1rem;
}
.group-lesson {
    position: relative;
}
.group-lesson .btn-actions {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 99;
}
.group-lesson .btn-actions .dropdown-menu {
    left: unset;
    right: 0;
    min-width: 1rem;
    /* padding: 0.5rem; */
}
.group-lesson .btn-actions .dropdown-menu a {
    color: #000 !important;
    min-width: 1rem;
}
.group-lesson .btn-actions .dropdown-menu a i{
    margin-right: 0.5rem;
}
/* #create-flash-card .left-content .powerpoint .numbers,
#create-flash-card .left-content .powerpoint .items {
    height: 100%;
} */

#create-flash-card .left-content .powerpoint .left {
    width: 25%;
    float: left;
}

#create-flash-card .left-content .powerpoint .right {
    width: 75%;
    float: right;
}

#create-flash-card .left-content .powerpoint .items .item {
    font-size: 0.75rem;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    text-align: center;
    padding: 0.5rem;
    overflow: hidden;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

#create-flash-card .left-content .powerpoint .items .item .id-card {
    font-weight: bold;
}

#create-flash-card .left-content .powerpoint .items .item,
#create-flash-card .left-content .powerpoint .numbers .number {
    height: 160px;
    margin-bottom: 1rem;
}

#create-flash-card .left-content .powerpoint .numbers .number {
    display: flex;
    font-size: 1rem;
    font-weight: bold;
    justify-content: center;
    align-items: start;
}

#create-flash-card .left-content .powerpoint .items .item {
    width: 120px;
    background-color: #f5f5f5;
    border: 1px solid #bdbdbd;
    cursor: pointer;
}

#create-flash-card .left-content .powerpoint .items .item.active {
    border: 1px solid #5db49a;
    /* box-shadow: 0 0 0.25rem 1px #5db49a; */
}

#create-flash-card .left-content .powerpoint .btn-collapse {
    padding: 0.5rem 1rem 0.5rem 1rem;
    display: flex;
    width: 100%;
    justify-content: start;
    align-items: center;
    font-size: 1rem;
    font-weight: bold;
}

#create-flash-card .left-content .powerpoint .btn-collapse {
    font-size: 14px;
}

#create-flash-card .left-content .powerpoint .btn-collapse[aria-expanded=false] {
    border-bottom: 1px solid #bdbdbd;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

#create-flash-card .left-content .powerpoint .group-lesson:last-child .btn-collapse[aria-expanded=false] {
    border-bottom: none;
}

.cke_chrome {
    min-width: 332px;
}

.main-content .menu-top {
    z-index: 1000;
}

/* #publish-modal .form-group {
    margin: 0;
} */

#publish-modal .modal-header {
    position: relative;
    /* background-color: rebeccapurple; */
}

#publish-modal .modal-header .alert-copied {
    text-align: center;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 0.5rem;
    /* background-color: rebeccapurple; */
}

#publish-modal .modal-header .alert-copied .txt {
    display: inline-block;
    padding: 0.25rem 2rem;
    background-color: #81b7f0;
    color: #121212;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
}

#publish-modal .item-role,
#publish-modal .item-role--copy .item-role {
    display: flex;
    align-items: center;
    background-color: #f2f2f2;
    padding: 0.5rem 1rem;
    border: 1px solid #e0e0e0;
    border-top: none;
}

#publish-modal .form-group:first-child .item-role {
    border-top: 1px solid #e0e0e0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

#publish-modal .item-role--copy .item-role {
    padding-top: 0;
    padding: 0;
    background-color: #fff;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

#publish-modal .item-role--copy .item-role .text {
    /* padding: 0rem 1rem; */
    width: 100%;
    justify-content: start;
}

#publish-modal .item-role--copy .item-role .left {
    flex-grow: 1;
}

#publish-modal .item-role--copy .item-role .right {
    background-color: #f2f2f2;
    border-left: 1px solid #e0e0e0;
}
#publish-modal .modal-header {
    position: relative;
    height: 4rem;

    /* background-color: rebeccapurple; */
}
#publish-modal .select-share{
    position: absolute;
    right: 2rem;
    top: 1rem;
}
#publish-modal .select-tick{
    position: absolute;
    right: 5rem;
    color:#5DB49A;
}
.selectedLi{
    background: #f2f2f2;
}
#publish-modal .open{
    background: #fff!important;
}

#publish-modal .open .select-li-share{
    display: none!important;
}
#publish-modal .dropdown .select-li-share{
    display: block;
}

#publish-modal .dropdown {
    background: #f2f2f2;
}
#publish-modal .dropdown .dropdown-toggle .select-tick {
    display: none!important;
}

#publish-modal .open .dropdown-toggle .select-tick{
    display: block!important;
}

#publish-modal #dropdownMenu1{
    width: 100%; 
    border: 1px solid #ccc;
    height: 35px; 
    padding-left: 20px;
}
#publish-modal .list-share{
    height: 35px;
}

.icon-share-company{
    position: relative;
    top: 0.6rem;
    left: -1.3rem;
    font-size: 13px;
}
.title-company{
    color: #ff0d00;
    font-size: 18px;
}
#publish-modal .p-share-link{
    font-family: Roboto;
    font-size: 16px;
    color: #121212;
    margin-bottom:5px;
    text-decoration: underline;
}
#status-share{
    position: relative;
    top : 0.3rem;
}
.disabled-li{
    pointer-events:none;
    opacity:0.6;
}

#publish-modal .item-role--copy .item-role .link {
    padding-left: 1rem;
    font-size: 14px;
    color: #707070;
    font-weight: 300;
    text-decoration: none solid rgb(112, 112, 112);
}

#publish-modal .item-role--copy .item-role .js-btn-copy-link {
    padding: 0 1rem;
}

#publish-modal .item-role.active,
#publish-modal .form-group:not(.item-role--copy) .item-role:hover {
    background-color: #5db49a;
}


#publish-modal .radio {
    margin-right: 1.5rem;
}

#publish-modal input[type=radio]:checked+span {
    background-color: #fff;
}

#publish-modal .text {
    display: flex;
    width: 100%;
    justify-content: start;
    align-items: center;
    font-size: 1rem;
}

#publish-modal input.link {
    position: absolute;
    opacity: 0;
    z-index: -999;
}

#publish-modal .icon-fa {
    min-width: 3rem;
    display: inline-block;
    margin-right: 0.5rem;
}

#publish-modal .icon-fa .fa {
    font-size: 1.5rem;
    padding: 0.5rem;
    /* background-color: #f5f5f5; */
}

#publish-modal .under {
    font-size: 12px;
    color: #bdbdbd;
    font-style: italic;
}

#publish-modal .btn {
    border: none;
}

#publish-modal .btn-save {
    background-color: #5db49a;
    margin-right: 1rem;
}

#publish-modal .btn-cancel {
    background-color: #a8a8a8;
    color: #fff;
}

#publish-modal .modal-dialog.modal-content.modal-body.form-group .invite-users-add{
    display: block;
}


.fl-left{
    float: left;
}
.fl-right{
    float: right;
}
.fl-right .dropdown-toggle{
    border: 1px solid;
    height: 40px;
}
.fl-right .dropdown-menu .icon_invite .aa{
    display: flex;
    height: 30px;
}
.fl-right .dropdown-menu .icon_invite .mg-right{
    margin-left: 5px;
}
.checkboxs{
    display: flex !important;
}
.mg-lefts{
    margin-top: 2px;
    font-size: 16px;
    font-weight: 300;
    margin-left: 10px;
}
.mg-rights{
    margin-top: 2px;
    font-size: 16px;
    font-weight: 300;
    margin-left: 5px;
    margin-right: 10px;
}
/* .cke.cke_float {
    transform-origin: top left;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
.cke.cke_float .cke_button {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
} */

/* create-assignment-page */
.create-assignment-page .detail-part__title {
    border-bottom: none;
}

.create-assignment-page input {
    margin: 0;
}

.create-assignment-page .d-flex {
    display: flex;
    align-items: center;
}

.create-assignment-page .d-flex .text {
    margin-left: 1rem;
}

/* card show */
.wrapper-learning{
    background: #fff;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 10px;
}

.wrapper-learning .title-learning{
    flex-basis: 60%;
    font-size: 20px;
    color: #484848;
    padding-right: 15px;
}

.wrapper-learning .content-learning{
    font-size: 15px;
    color: #707070;
}

.wrap-img img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: cover;
}

.timeline {
    position: relative;
    margin-left: 80px;
}

.timeline::before {
    content: '';
    left: -50px;
    top: 70px;
    position: absolute;
    display: block;
    /* width: 5px; */
    height: calc(100% - 140px);
    border-left: 1px dashed #000;
    /* background-color: red; */
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

.create-detail-learning-page.container--primary{
    margin-top: 90px;
}

.create-detail-learning-page .btn-back{
    align-self: center;
    text-decoration: none;
    color: #000;
    height: 30px;
    display: block;
}

.create-detail-learning-page .btn-back i{
    align-self: center;
    font-size: 30px;
}

#myModalCreateCourse .container-thumbnail {
    position: relative !important;
    background-color: #d2d3d3;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    height: 8rem;
    width: 12rem;
    border: 1px solid #c2bcbc;
    border-radius:6px;
    justify-content: center;
    align-items: center;
}

#myModalCreateCourse .container-thumbnail .course_image_drap {
    width: 100%;
    height: 100%;
    margin: 0;
    z-index: 10;
}

#myModalCreateCourse .container-thumbnail .file_thumbnail_drap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 10;
}
.btn-remove-img-course {
    background-color: #dedede;
    opacity: 0.8;
    position: absolute !important;
    width: 2rem;
    height: 2rem;
    top: 0;
    right: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -ms-transition: opacity 0.25s;
    -o-transition: opacity 0.25s;
    z-index: 11;
}
.box {
    position: relative;
    font-family: Roboto;
    background-color: #fff;
    display: flex;
    margin-bottom: 3rem;
    box-shadow: 0 0 0 1px #c2bebe;
    border-radius: 6px;
    height: 140px;
}

.create-detail-learning-page .box {
    display: block;
    height: 165px;
    cursor: move;
}
.create-detail-learning-page .box:hover {
    border: 1px solid #5db49a;
    border-radius: 6px;
    box-shadow: 0 1px 5px 0 #c2bebe, 0 1px 5px 0#c2bebe;
}
.timeline .box--node {
    position: absolute;
    content: '';
    display: inline-block;
    text-align: center;
    line-height: 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #666666;
    background-color: #ebebeb;
    font-weight: 700;
    font-size: 18px;
    color: #000;
    left: -50px;
    top: 50%;
    z-index: 10;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.timeline .box--node.active {
    background: #ffffff;
    border-color: #5db49a;
}

.timeline .box::before,
.timeline .box::after {
    position: absolute;
    display: inline-block;
    width: 40px;
    height: 50%;
    background-color: #fff;
    left: -50px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}
.create-detail-learning-page.header-learning{
    position: fixed;
    top: 0;
    left: 0;
}

.create-detail-learning-page .detail-learning.wrapper-learning .detail{
    display: flex;
}

.create-detail-learning-page .sp-timeline{
    position: absolute;
}

.create-detail-learning-page .sp-timeline .item-order{
    position: relative;
    height: 165px;
    margin-bottom: 48px;
}
.create-detail-learning-page .sp-timeline .box--node {
    position: absolute;
    content: '';
    display: inline-block;
    text-align: center;
    line-height: 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #666666;
    background-color: #ebebeb;
    font-weight: 700;
    font-size: 18px;
    color: #000;
    left: 30px;
    top: 50%;
    z-index: 10;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
/* .timeline .box:nth-child(2)::before {
    content: '';
    top: 0;
}

.timeline .box:last-child::after {
    content: '';
    bottom: 0;
} */
.time-heart-learnning{
    width: 15%;
    top: 0;
    display: flex;
    justify-content: flex-end;
    background: rgba(0,0,0,0.3);
    position: absolute!important;
    z-index: 9;
    border-bottom-left-radius: 10px;
}
.time-heart-learnning p{
    font-size: 14px;
    color: #fff;
    font-weight: 400;
    margin-right: 0.5rem;
    margin-top: 0.1rem;
}
.box--wrap-img {
    width: 210px;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    border-radius: 6px;
    overflow: hidden;
}

.create-detail-learning-page .box--wrap-img {
    border-radius: 6px 0 0 0 ;
}

.box--wrap-img img{
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.box__body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
    position: relative;
    overflow: hidden;
}

.create-detail-learning-page .box__body {
    flex-direction: row;
    justify-content: start;
    flex-grow: 1;
    height: 140px;
}

.box--close {
    position: absolute;
    display: inline-block;
    top: 2px;
    right: 2px;
    font-size: 1rem;
    width: 20px;
    height: 20px;
    color: #666464;
    z-index: 9;
}

.create-detail-learning-page .box--move {
    position: absolute; 
    right: 5px; 
    top: 50%; 
    transform: translate(0%, -50%); 
    font-size: 20px;
}

.box--check {
    font-size: 1rem;
    color: #5db49a;
}

.box--title {
    margin: 10px 30px 10px 15px;
    font-size: 16px;
    color: #303030;
    font-weight: 300;
    text-decoration: none solid rgb(48, 48, 48);
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-align: justify;
    font-weight: 400;
    word-break: break-all;
}

.box__body .box--title {
    margin: 5px 30px 10px 15px;
    font-size: 16px;
    color: #303030;
    font-weight: 300;
    text-decoration: none solid rgb(48, 48, 48);
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-align: justify;
    font-weight: 400;
    word-break: normal;
}

.box--des { 
    margin: 10px 30px 10px 15px;
    font-size: 14px;
    color: #303030;
    font-weight: 300;
    text-decoration: none solid rgb(48, 48, 48);
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    max-height: 50px;
    text-align: justify;
}
.box-footer-des{
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
}

.box-footer-des div{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.box--small-footer.js-item-button {
    font-size: 14px !important;
    color: #b0b0b0;
    /* text-decoration: none solid rgb(176, 176, 176); */
    text-align: center;
    margin: 10px 20%;
    background-color: #e0e0e0;
    line-height: 30px;
    border-radius: 6px;
}

.box--small-footer .item-type span{
    font-size: 14px !important;
}
.box--small-footer.js-item-button:hover {
    background: #d0d0d0;
}
.box--small-footer.js-item-button.disable{
    /* pointer-events: none; */
    /* cursor: default; */
}
.box--small-footer.js-item-button.active{
    color: #5db49a;
}

.create-detail-learning-page .box--small-footer.js-item-description {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: #424242;
    text-align: center;
    padding: 0 10px;
    line-height: 25px;
    border-top: solid 1px #858585;
}

.create-detail-learning-page .box--small-footer.js-item-description > div {
    width: 60%;
    height: 100%;
    text-align: left;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by{
    width: 40%;
    display: flex;
    align-items: center;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by .avt-instructor{
    height: 20px;
    width: 20px;
    min-width: 20px;
    min-height: 20px;
    margin-right: 5px;
    border-radius: 50%;
    overflow: hidden;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by .avt-instructor img{
    width: 100%;
    height: 100%;
}

.create-detail-learning-page .box--small-footer.js-item-description .item-create-by .js-item-create-by{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.detail-learning .actions {
    margin-bottom: 2rem;
}

.detail-learning .action {
    position: relative;
}

.detail-learning .action--btn {
    background-color: #3498db;
    font-size: 14px;
    color: #fff;
    padding: 6px 10px;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

.detail-learning .select2-container {
    position: absolute;
    top: 0;
    left: 0;

}

.detail-learning .select2-container .select2-selection {
    opacity: 0;
}

.btn--create {
    width: 100%;
    padding: 0.8rem 2rem;
    border-radius: 10px;
    background-color: #26ba9c;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
    font-family: Roboto;
    font-weight: 500;
    text-decoration: none solid #fff;
}

.view-learning-learning-page{
    /*margin-top: 80px; */
}

.header-learning{
    background: #dadada;
    z-index: 999;
    width: 100%;
}

.header-learning .container{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 75px;
    padding: 0 15px;
    position: relative;
    top: 0;
}
/* .header-learning:before {
    position: absolute;
    content: '';
    background-color: #dadada;
    width: calc(100vw - 15px);
    height: 100%;
    top: 0;
    left: 50%;
    z-index: -1;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
} */
.header-learning .prefix-name-learning {
    display: none;
}
.header-learning .header-left{
    display: flex;
    flex-grow: 1;
    justify-content: space-between;
}

.header-learning .header-left .title{
    flex-grow: 1;
    font-size: 16px;
    line-height: 40px;
}

.header-learning .header-left .name-learning{
    font-weight: 600;
}

.header-learning .header-left .percent{
    background: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #c7c7c7;
    margin-right: 20px;
    min-width: 40px;
}

.header-learning .header-right{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    /* flex-grow: 2; */
}

.header-learning .header-right .btn-header-detail-learning{
    padding: 10px;
    width: 140px;
    background: #5db49a;
    font-size: 14px;
    color: #fff;
    margin-right: 10px;
}



.header-learning .header-right .btn-back{
    width: 40px;
    height: 40px;
    background: #cfcfcf;
    border-radius: 50%;
    font-size: 24px;
    border: 0.5px solid #c7c7c7;
    margin-right: 20px;
    text-align: center;
    line-height: 40px;
    color: #000000;
}

.header-learning .header-right .profile{
    width: 40px;
    height: 40px;
    background: #cfcfcf;
    border-radius: 50%;
    font-size: 24px;
    overflow: hidden;
    border: 0.5px solid #c7c7c7;
}

.header-learning .header-right .profile img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.recent-lesson{
    background: #5db49a;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 999;
}

.recent-lesson .title-learning{
    font-size: 16px;
    color: #000000;
}

.recent-lesson .content-learning{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.recent-lesson .name-lesson{
    font-size: 18px;
    color: #ffffff;
    margin-top: 20px;
}

.recent-lesson .btn-continue{
    flex-basis: 40%;
    border: 1px solid #a1a1a1;
    border-radius: 6px;
    color: #5db49a;
    background-color: #ffffff;
    /*min-width: 235px;*/
    min-height: 30px;
    max-height: 30px;
    line-height: 30px;
    text-align: center;
    max-width: 230px;
}

.route-learning{
    overflow: hidden;
    padding: 30px 10px 0 10px;
}
.route-learning .title-learning{
    background: #a1a1a1;
    color: #ffffff;
    font-size: 16px;
    text-align: center;
    line-height: 40px;
    margin: -30px -30px 30px -30px;
}
/* ck dialog youtbe */
/* .cke_dialog .cke_dialog_body .cke_dialog_contents_body {
    height: auto !important;
}
.cke_dialog .cke_dialog_body .cke_dialog_contents .cke_dialog_page_contents > table tbody > tr:not(:nth-child(3)) .cke_dialog_ui_vbox_child{
    display: none !important;
    
}
.cke_dialog .cke_dialog_body .cke_dialog_contents .cke_dialog_page_contents > table tbody > tr:nth-child(3) .cke_dialog_ui_vbox_child td:not(:nth-child(1)){
    display: none !important;
}
/* account-settings */
.settings {
    margin: 2rem auto;
    font-size: 1rem;
}

.settings .list-group-item.active,
.settings .list-group-item.active:focus,
.settings .list-group-item.active:hover,
.settings .panel>.panel-collapse>.list-group .list-group-item {
    border: none;
}

.settings .list-group-item a {
    display: block;

    /* margin-left: 2px; */
}
.settings .list-group-item a,
.settings .panel-title{
    text-transform: capitalize;
}
.settings .list-group-item a:focus,
.settings .list-group-item a:focus,
.settings .list-group-item a:focus,
.settings .list-group-item a:visited {
    text-decoration: none;
}

.settings .list-group-item a i {
    width: 25px;
}

.settings input,
.settings textarea {
    box-shadow: none;
    margin: 0px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.settings .phone-container .code {
    background-color: #c9bcbb;
    padding: 0 0.5rem;
    display: flex;
    align-items: center;
}

.settings .phone-container {
    display: flex;
    align-items: stretch;

}

.settings .panel-title {
    font-size: 18px;
    font-weight: bold;
}

.settings .nav-title{
    display: none;
}

.settings .left {
    display: block;
    padding: 0 !important;
}

.loading-course{
    display: flex;
    height: 140px;
    margin: 20px;
}

.loading-course .loading-course-left{
    min-width: 210px;
    margin-right: 10px;
}

.loading-course .loading-course-right{
    width: 100%;
}

.loading-course .loading-course-right .loading-course-top{
    height: 30px;
    margin-bottom: 10px;
} 

.loading-course .loading-course-right .loading-course-bot{
    height: 100px;
} 

.loading-text{
    height: 20px;
    margin: 10px 20px 10px 20px;
}

.loading-card-image{
    height: 198px;
    width: 100%;
}

.loading-card-text{
    height: 20px;
    margin: 5px;
}

@media (max-width: 768px){
    .loading-course{
        display: flex;
        height: 100px;
        margin: 20px;
    }
    
    .loading-course .loading-course-left{
        min-width: 150px;
        margin-right: 10px;
    }
    
    .loading-course .loading-course-right .loading-course-top{
        height: 20px;
        margin-bottom: 10px;
    } 
    
    .loading-course .loading-course-right .loading-course-bot{
        height: 70px;
    } 
    
    .settings .left {
        padding-left: 0;
        padding-right: 0;
        display: none;
    }
    .settings .nav-title{
        display: block;
        width: 100%;
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }
    .settings .panel-group{
        margin: 0;
    }
    .settings .panel-title button{
        display: none;
    }
}

.settings .left .panel-title {
    color: #ffffff;
}

.settings .right .panel-title {
    color: #000000;
    position: relative;
}

.settings .right .panel-title:before {
    content: '';
    position: absolute;
    left: 0;
    top: 100%;
    width: 200px;
    height: 2px;
    background-color: #26ba9c;
}

/* .tab-content {
    margin-left: 10px;
    margin-right: 30px;
} */

.account-settings {
    font-size: 1rem;
}

.account-settings th {
    white-space: nowrap;
}

.account-settings .panel {
    background-color: #fff;
    /*border-radius: 10px;*/
    /*border: 1px solid #9e9e9e;*/
    border: none;
    background-size: cover;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
    /*overflow: hidden;*/
}

.tab-pane .actions .action .fa-circle{
    font-size: 5px;
}
.settings .search-input {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 5px 8px;
    height: auto;
}
.settings .form-group-inline {
    display: flex;
}
.members-content {
    font-size: 14px;
}
.settings .js-group-item {
    cursor: pointer;
}
.members-content .info {
    display: flex;
    align-items: center;
    justify-content: start;
}
.members-content .info--img {
    min-width: 40px;
    min-height: 40px;
    max-width: 40px;
    max-height: 40px;
    object-fit: cover;
    object-position: center;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.members-content .table>tbody>tr>td {
    vertical-align: middle;
}
.members-content .info__right {
    margin-left: 1em;
}
.members-content .info--fullname {
    font-size: 14px;
    font-weight: 500;
}
.members-content .info--username {
    color: #5e5e5e;
}
.dropdown-menu [data-state="deactive"] a{
    color: #c71208 !important;
}
.dropdown-menu li::first-letter {
    text-transform: capitalize;
}
.settings .container-upload {
    width: 155px;
    height: 155px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 0 auto;
    background-color: #dadada;
    border: 2px solid #c8c8c8;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
/* .settings .container-upload .file-upload,
.settings .container-upload .image-upload,
.settings .container-upload {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
} */
.settings .container-upload .file-upload,
.settings .container-upload .image-upload {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.settings .container-upload .file-upload {
    z-index: 100;
    opacity: 0;
    cursor: pointer;
}
.settings .container-upload .image-upload {
    z-index: 99;
}
.settings .container-upload .icon-upload {
    font-size: 50px;
    color: #a8a8a8;
}

.organization .info-organization {
    display: flex;
    padding-bottom: 48px;
    border-bottom: 1px solid #666;
}

.organization .info-organization .logo-organization {
    width: 78px;
    height: 78px;
    border: 1px solid #c8c8c8;
}

.organization .info-organization .logo-organization img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.organization .info-organization .content-organization {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 19px;
}

.organization .info-organization .content-organization h4 {
    font-size: 20px;
    color: #030303;
    font-weight: 700;
    text-decoration: none solid rgb(3, 3, 3);
}

.organization .info-organization .content-organization a {
    margin-top: 5px;
    background-size: cover;
    font-size: 16px;
    color: #020ddb;
    text-decoration: none solid rgba(2, 13, 219, 0.92);
}

.organization .admin-organization {
    margin-top: 27px;
}

.organization .config-assessment-organization {
    padding: 20px 0;
    border-bottom: 1px solid #666666;
    /* display:none; */
}
.organization .config-assessment-organization .title-config-assessment{
    font-family: Roboto;
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}
.organization .config-assessment-organization .infor-config{
    padding-top:1.5rem;
    display:flex;
    justify-content: flex-start;
    margin-bottom: 1rem;
}
.organization .config-assessment-organization  .infor-config .title-infor-config{
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
    padding: 0.3rem 2rem 0 0;
}
.organization .config-assessment-organization  .infor-config .input-infor-config{
    padding: 0px 10px;
    border: 1px solid #c9c9c9;
    border-radius: 4px;
    width:4rem;
    background-color: #ffffff;
    background-size: cover;
    font-family: Roboto;
    font-size: 16px;
    color: #000000;
    text-decoration: none solid rgb(0, 0, 0);
    text-align: right;
}
.organization .config-assessment-organization  .infor-config .btn-save-config{
    border: 1px solid #c8c8c8;
    margin-left: 2rem;
    background: #5db49a;
    color:#fff;
    font-size: 14px;
    border-radius: 3px;
}
.organization .config-assessment-organization  .infor-config .js-cancel{
    border: 1px solid #c8c8c8;
    margin-left: 1rem;
    background: #a8a8a8;
    color:#fff;
    font-size: 14px;
    border-radius: 3px;
    margin-top:2px;
}
.organization .config-assessment-organization  .infor-config .wrong_value{
    position: absolute;
    left: -1rem;
}
.organization .config-assessment-organization  .infor-config input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
.organization .admin-organization .title-admin-organization h5 {
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization {
    display: flex;
    justify-content: space-between;
    margin-top: 21px;
}
.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item {
    display: flex;
    align-items: center;
    width: 80%;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .avatar-item {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    border: 0.5px solid #dbd9d9;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .avatar-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .name-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 15px;
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .name-item h5 {
    font-size: 16px;
    color: #000000;
    text-decoration: none solid rgb(0, 0, 0);
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .info-item .name-item span {
    font-size: 14px;
    color: #000000;
    font-weight: 300;
    text-decoration: none solid rgb(0, 0, 0);
}

.organization .admin-organization .list-admin-organization .item-list-admin-organization .type-admin-item {
    font-size: 14px;
    color: #000000;
    font-weight: 300;
    text-decoration: none solid rgb(0, 0, 0);
    width: 20%;
}
.organization-form input{
    padding: 0 30px 0 10px ;
    line-height: 30px;
    height: 30px;
    border-radius: 5px;
    font-size: 16px;
}

.organization-form .icon-is-verified{
    color:#5db49a; 
    font-size: 20px;
    position: absolute;
    right: 5px;
    bottom: 5px;
}


/* .col-xs-4 {
    width: 25%;
}

.col-xs-8 {
    width: 75%;
} */

/* .panel.panel-pi {
    margin-left: -10px;
    margin-right: -10px;.organization-form input{
    padding: 0 30px 0 10px ;
    line-height: 30px;
    height: 30px;
    border-radius: 5px;
    font-size: 16px;
}
} */

.panel.panel-pi .panel-heading .panel-title.text-center .text-organizations {
    text-decoration: none;
}

.panel .panel-body .authenticate_content {
    margin-top: -20px;
}

.panel-body .authenticate_content {
    display: flex;
}

.panel-body .authenticate_content .icon_check_email {
    margin-left: 10px;
    max-height: 25px;
}

.panel .panel-body .authen_email {
    display: flex;
    margin-top: 20px;
    margin-left: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.panel .panel-body .authen_haravan {
    display: flex;
    margin-top: 20px;
    margin-left: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.panel .panel-body .authen_oss {
    display: flex;
    margin-top: 20px;
    margin-left: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.panel .panel-body .authen_email_content{
    margin-left: 20px;
}

.panel .panel-body .authen_email_content_text{
    margin-top: -24px;
    margin-left: -10px;
    font-size: 16px;
}

.panel .panel-body .authenticate_content{
    margin-top: 0px;
    font-size: 16px;
}

.panel .panel-body .authen_email_content_text2{
    font-size: 14px;
}

.panel .panel-body .authen_haravan_content_text_haravan{
    font-size: 14px;
}

.panel .panel-body .authen_haravan_content_text_oss{
    font-size: 14px;
}

.panel .panel-body .content_replace{
    font-size: 14px;
}

.panel .panel-body .col_left {
    display: flex;
}

.panel-body .btn-setting {
    width: 120px;
    height: 30px;
    margin-top: 10px;
    padding: 6px 10px;
    border-radius: 10px;
    background-color: #3498db;
    background-size: cover;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
}

.panel-body .btn-edit {
    width: 120px;
    height: 30px;
    margin-top: 10px;
    padding: 6px 10px;
    border-radius: 10px;
    background-color: #c2c2c2;
    background-size: cover;
    font-family: Roboto;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
}

.panel-body .col_left .icon_at{
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    background-size: cover;
    box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
}

.panel-body .col_left .icon_at .fa-at {
    color: #3498db;
    font-size: 24px;
}

.panel-body .col_left .fa-at.single {
    color: #3498db;
    margin-top: -22px;
    margin-right: 0px;
    font-size: 20px;
}

.panel-body .col_left .iconAuHaravan {
    margin-top: -22px;
    margin-right: 0px;
    width: 24px;
    height: 24px;
}

.panel-body .col_left .iconAuOss {
    margin-top: -18px;
    margin-right: -5px;
    width: 42px;
    height: 16px;
}

.bootstrap-tagsinput {
    width: 620px;
    margin-top: 10px;
    border: 1px solid #c8c8c8;
    border-radius: 8px;
    background-color: #ffffff;
    background-size: cover;
    font-size: 16px;
    color: #949494;
    font-weight: 300;
    text-decoration: none solid rgb(148, 148, 148);
}

.content_auth {
    margin-left: 10px;
    margin-top: 15px;
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}

.authen_email_content_haraven_and_oss {
    margin-left: 10px;
    margin-top: 15px;
    font-size: 14px;
    color: #3d3d3d;
    text-decoration: none solid rgb(61, 61, 61);
}

.bootstrap-tagsinput .tag {
    margin-top: 4px;
    border-radius: 4px;
    background-color: #5db49a;
    background-size: cover;
    text-align: center;
    background-color: #5db49a;
    font-size: 14px;
    color: #f7f7f7;
    font-weight: 400;
    text-decoration: none solid rgb(247, 247, 247)
}

.panel-body .btn-save {
    width: 116px;
    height: 39px;
    margin-top: 30px;
    margin-left: 10px;
    padding: 6px 10px;
    border-radius: 8px;
    background-color: #5db49a;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255);
    text-align: center;
}

.manage-select{
    font-size: 14px;
    padding: 1px 20px 1px 20px;
    height:30px;
}

.skills-selected .select2-selection__choice{
    font-size: 14px;
}

@keyframes dot-keyframes {
    0% {
        opacity: .4;
        transform: scale(1, 1);
    }

    50% {
        opacity: 1;
        transform: scale(1.2, 1.2);
    }

    100% {
        opacity: .4;
        transform: scale(1, 1);
    }
}
  
.loading-dots {
    text-align: center;
    width: 100%;
}
    
.loading-dots--dot {
    animation: dot-keyframes 1.5s infinite ease-in-out;
    background-color: #000;
    border-radius: 5px;
    display: inline-block;
    height: 5px;
    width: 5px;
}   
    
.loading-dots--dot:nth-child(2) {
    animation-delay: .5s;
}
    
.loading-dots--dot:nth-child(3) {
    animation-delay: 1s;
}

.view-start-course .detail-part__title,
.view-start-course .link{
    text-transform: lowercase;
    color: #454242;
}
.view-start-course .detail-part__title::first-letter,
.view-start-course .link::first-letter{
    text-transform: uppercase;
}
.view-start-course .instructor-avt img{
    border-radius: 50%;
}
.view-start-course .instructor-comp__username {
    color: #696969;
    font-weight: 300;
}
.view-start-course .course-detail {
    margin-top: 0;
}
.view-start-course .container_course_detail_about {
    background: none;
    margin: 0;
    padding: 0;
}
.view-start-course .jq-rating {
    display: grid;
    justify-content: center;
    grid-auto-flow: column;
    grid-template-columns: 120px 120px;
    grid-template-rows: auto auto;
    grid-gap: 20px;
}

.view-start-course .jq-rating div {
    justify-self: center;
}
.view-start-course .jq-rating .jq-rating-like:after,
.view-start-course .jq-rating .jq-rating-dislike:after {
    content: attr(data-content);
    text-overflow: ellipsis;
}
.view-start-course .after-title {
    font-weight: 300;
}
.view-start-course h5 {
    font-size: 16px;
}
.view-start-course .container-comment {
    position: relative;
    width: auto;
}
.view-start-course .comments__body {
    height: auto;
    overflow: hidden;
}
.view-start-course .sprite {
    pointer-events: none;
}
.view-start-course .panel-default>.panel-heading {
    background-color: #fff;
}

@media screen and (max-width: 550px){
    .view-detail-learning-page{
        padding: 0;
    }

    .view-detail-learning-page .btn--create{
        margin-bottom: 20px;
    }

    .view-detail-learning-page .title-learning{
        font-size: 16px;
    }

    .view-detail-learning-page .columns.large-4.small-12.left-side{
        padding: 0 30px;
    }

    .view-detail-learning-page .btn--create{
        border-radius: 20px;
    }

    .timeline{
        margin: 0;
        margin-left: 30px;
    }

    .timeline .box{
        width: 100%;
        height: 100px;
        text-align: center;
    }

    .timeline .box--node{
        width: 20px;
        height: 20px;
        font-size: 14px !important;
        line-height: 20px;
        left: -20px;
        top: 50%;
    }

    .timeline .box__body .box--title{
        margin: 5px 10px;
        font-size: 15px;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }

    .timeline .box__body .box--small-footer{
        margin: 0;
        width: 80%;
        min-width: 100px;
        align-self: center;
        font-size: 12px !important;
        margin-bottom: 5px;
    }

    .timeline .box__header{
        margin: 0;
        min-width: 150px;
        max-width: 150px;
        height: 100%;
    }

    .timeline .box--wrap-img{
        width: 100%;
        height: 100%;
    }

    .timeline::before {
        left: -20px;
        top: 50px;
        height: calc(100% - 100px);
    }
    
    .timeline .box::before,
    .timeline .box::after {
        left: -20px;
        width: 10px;
    }

    .create-detail-learning-page .timeline .box__body .box--title{
        margin: 5px 20px 5px 10px;
    }

    .create-detail-learning-page .box__body{
        height: 75px;
    }

    .create-detail-learning-page .sp-timeline{
        left: 8px;
    }

    .create-detail-learning-page .sp-timeline .item-order{
        height: 100px;
    }

    .create-detail-learning-page .timeline::before{
        height: calc(100% - 100px);
    }

    .box--des{
        display: none;
    }

    .view-detail-learning-page .timeline .box__body .box--small-footer{
        justify-content: space-between;
    }

    .view-detail-learning-page .timeline .box__body .box--small-footer .item-name-company{
        width: 50% !important;
        max-width: 50%;
    }
    
    .view-detail-learning-page .timeline .box__body .box--small-footer .item-level{
        width: 50% !important;
        max-width: 50%;
    }
    .box-footer-des{
        display: none;
    }
}

@media screen and (max-width: 1023px){
    .view-detail-learning-page .columns.large-4.small-12.left-side{
        position: unset !important;
    }
}

.view-learning-learning-page .content-learning{
    position: relative;
}

.view-learning-learning-page .content-learning .title-learning .loading-dots{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.invite-member{
    background: #fff;
}

.invite-member .validate-icon{
    display: none; 
    position: absolute; 
    right: 0; 
    top: 0; 
    font-size: 30px;
    padding: 5px 20px;
}
.invite-member .validate-invite-ok{
    color:green;    
}

.invite-member .validate-invite-error{
    color:red;
}

.btn-emove-invite{
    font-size: 35px; 
    cursor: pointer;
}

.invite-member .js-btn-invite-user{
    margin-top: 30px;
    height: 30px; 
    width: 100px; 
    color: #fff; 
    background:#2ba6cb;
}

.invite-member .btn-remove-invite{
    font-size: 35px;
    cursor: pointer;
}

.invite-member .js-input-level-invite{
    margin-bottom: 0;
}


.profile-comp__name{
    font-size: 16px;
}

.profile-comp__info{
    font-size: 14px;
    font-weight: 300;
}
.content_follow {
    display: flex;
}

.content_following {
    display: flex;
}

.content_follow .icon-follow {
    font-size: 20px
}

.content_follow .text-follow {
    margin-top: 1px;
    font-weight: 400 !important;
}

.content_following .icon-following {
    font-size: 20px
}

.content_following .text-following {
    margin-top: 1px;
    font-weight: 400 !important;
}

.totalFollowers {
    margin-bottom: -30px;
    margin-top: 8px;
    font-weight: 300;
    font-size: 14px;
    color: #545454;
    text-decoration: none solid rgb(84, 84, 84);
}
.profile-btn__follow{
    border-radius: 6px;
    background-color: #7a7a7a;
    font-size: 14px;
    color: #ffffff;
    font-weight: 300;
    margin-top: 10px;
    padding: 3px 20px;
}

.organization-form .avatar_edit{
    margin-left: 0;
    bottom: unset;
    position: unset;
    margin-top: 10px;
}
/* #powerpoint .items {
    list-style-type: none;
} */

#powerpoint .items .ui-selected {
    background: red;
    color: white;
    font-weight: bold;
}

.sortable-highlight {
    width: 120px;
    height: 160px;
    margin-bottom: 16px;
    border: 1px solid red;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    font-weight: bold;
    font-size: 45px;
    background-color: lightblue;
}

#powerpoint .items .item{
    position: relative;
    overflow: visible !important;
}

#powerpoint .items .item .dropdown{
    display: none;
    position: absolute;
    top: 50%;
    right: -25px;
    transform: translate(0, -50%);
    font-size: 6px;
    z-index: 999;
}

#powerpoint .items .item.empty.active .dropdown{
    display: none;
}

#powerpoint .items .item.active .dropdown{
    display: block;
}

.view-detail-learning-page .timeline .box__body .box--title{
    margin: 5px 20px 5px 10px;
    line-height: 18px;
}

.view-detail-learning-page .timeline .box__body .box--des{
    margin: 5px 20px 5px 10px;
}

.view-detail-learning-page .timeline .box__body .box--des p{
    line-height: 17px;
}
.view-detail-learning-page .timeline .box__body .box--small-footer {
    display: flex;
    margin: 5px 20px 5px 10px;
    color: #303030;
    font-size: 15px;
    font-weight: 300;
    text-align: left;
}

.view-detail-learning-page .timeline .box__body .box--small-footer .item-name-company{
    width: 12%;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
    overflow: hidden;
}

.view-detail-learning-page .timeline .box__body .box--small-footer .item-level{
    width: 60%;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
    overflow: hidden;
}

.instructors-learning .instructor-item{
    border-radius: 10px;
    box-shadow: 0px 1px 2px #8c8c8c;
    text-align: center;
    margin: 5px;;
}

.instructors-learning .instructor-item-ex{
    display: none;
}

.instructors-learning .instructor-item .header-img-instructor{
    padding: 20px 0 10px 0;
    width: 100%;
    display: flex;
    justify-content: center;
}

.instructors-learning .instructor-item .header-img-instructor img{
    object-fit: contain;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid #337899;
}

.instructors-learning .instructor-item .header-title-instructor{
    padding: 10px 5px;
    font-size: 16px;
    color: #484848;
    width: 100%;
    height: 65px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.instructors-learning .instructor-item .bottom-info-instructor{
    padding: 10px 5px;
    margin-bottom: 40px;
    color: #484848;
    font-weight: 300;
    width: 100%;
    height: 65px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.instructors-learning .instructor-item .bottom-info-instructor span{
    font-size: 16px !important;
}

.view-detail-learning-page .wrapper-learning .create-by{
    font-size: 13px;
    font-weight: 300;
    padding: 0 5px 5px 5px;
}

.view-detail-learning-page .wrapper-learning .create-by span{
    font-size: 13px !important;
}
.popup_create_course{
    background: #edebeb; 
    height:2rem;
    margin: 0 auto;
    /* display: none; */
    cursor: pointer;
    border-radius: 4px;
    font-size: 16px;
    color: #424242;
}

.learningpath-action .selection{
    display: none;
}

.assignment-action .selection{
    display: none;
}

.course-action .selection{
    display: none;
}

.loading-gradient{
    animation-duration: 1.8s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #fafafa 8%, #f4f4f4 38%, #fafafa 54%);
    background-size: 1000px 640px;
}

@keyframes placeHolderShimmer{
    0%{
        background-position: -468px 0
    }
    100%{
        background-position: 468px 0
    }
}
.js-popup-change-group-name .popup{
    width: 340px;
    height: 218px;
    opacity: 0.9;
    border: 1px solid #d1d1d1;
    border-radius: 4px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    justify-content: center;
    position: relative;
    opacity: 0.8;
}
.js-popup-change-group-name .popup .close{
    position: absolute;
    right: 0;
    top:0;
}
.js-popup-change-group-name .popup .header{
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.js-popup-change-group-name .popup .body{
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
}
.js-popup-change-group-name .popup .body input{
    border-radius: 4px;
}
.js-popup-change-group-name .popup .footer{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.js-popup-change-group-name .popup .footer button{
    color: #FFF;
    background: #5db49a;
    padding: 5px 10px;
    border-radius: 4px;
}

#popup-alert-success .popup {
    animation-name: show-popup;
    animation-duration: 0.3s;
    opacity: 0.8;
}
#popup-alert-success .popup .popup-alert-success {
    width: 340px;
    height: 218px;
    opacity: 0.9;
    border: 1px solid #d1d1d1;
    border-radius: 4px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    justify-content: center;
    position: relative;
}
#popup-alert-success .popup .popup-alert-success .close{
    position: absolute;
    right: 0;
    top:0;
}
#popup-alert-success .popup .popup-alert-success .close i{
    font-size: 30px;
    color: #858282;
}
#popup-alert-success .popup .popup-alert-success .header {
    flex: 3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#popup-alert-success .popup .popup-alert-success .header i {
    font-size: 70px;
    color: #5db49a;
}

#popup-alert-success .popup .popup-alert-success .body {
    padding-top: 15px;
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    font-family: Roboto;
    font-size: 18px;
    color: #000000;
    text-decoration: none solid rgb(0, 0, 0);
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes show-popup {
    0% {transform: translate(-50%, -50%) scale(0)}
    90% {transform: translate(-50%, -50%) scale(1.1)}
    100% {transform: translate(-50%, -50%) scale(1)}
}

/* Standard syntax */
@keyframes show-popup {
    0% {transform: translate(-50%, -50%) scale(0)}
    90% {transform: translate(-50%, -50%) scale(1.1)}
    100% {transform: translate(-50%, -50%) scale(1)}
}

.btn-course-detail .container-tooltip{
    top: 56px;
}

.btn-course-detail .container-tooltip::after{
    top: -10px;
}
#title-card {
    position: relative;
}
.main_course .time-limit {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    color: #fa1b0f;
    font-size: 16px;
    font-weight: normal;
}
.main_course .time-limit--item  {
    display: inline-block;
    
}
.main_course .time-limit--fa {
    margin-right: 0.5rem;
    color: #636261;
    font-size: 18px;
}

.course-item.suggest-tracking:hover{
    box-shadow: 0 0 0 2px #00bba9;
}
.p-btn--primary {
    background-color: #5db49a;
    color: #ffffff;
}
.p-qr-code__download {
    display: flex;
    /* flex-direction: column; */
    align-items: center;
}

.select2-results__options .avatar-thumbnail{
    width: 30px;
    height: 30px;
    max-width: 30px;
    max-height: 30px;
    min-width: 30px;
    min-height: 30px;
    border-radius: 50%;
    object-fit: cover;
    vertical-align: middle;
    margin-right: 0.5rem;
}
/* featured page */
.pi-featured .row {
    margin-left: -15px;
    margin-right: -15px;
}
.pi-content {
    margin-top: 26px;
}
.pi-featured ul{
    padding-bottom: 0;
}

.pi-featured--title {
    color: #ffffff;
}
.pi-featured-content {
    margin-bottom: 2rem;
}
.pi-featured-content--title {
    border-radius: 10px;
    background-color: #5db49a;
    background-repeat: no-repeat;
    font-family: Roboto;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgba(255, 255, 255, 0.84);
    padding: 0.25rem 2rem;
    width: fit-content;
    text-transform: capitalize;
}

/* pi post */
.pi-btn {
    border: none;
    padding: 0.25rem 1.5rem;
}
.pi-post--ratio,.pi-post__cover--ratio {
    padding-top: calc(100%*4/3);
    position: relative;
    /* height: 0; */
    width: 100%;
}
.pi-post--inside {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height:100%;
}
.pi-post {
    border: 1px solid #cccccc;
    border-radius: 6px;
    background-color: #fff;
    overflow: hidden;
    transition: 0.25s;
    box-shadow: 0px 2px 5px 1px hsla(0, 0%, 70%, .5);
    margin: 15px 0;
}

.pi-post:hover {
    border: 1px solid #00bba9;
}
.pi-post--action {
    justify-self: center;
    margin: 0 auto;
    border: 1px solid #5db49a;
    border-radius: 4px;
    background-color: #5db49a;
    background-repeat: no-repeat;
    font-family: Roboto;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none solid rgb(255, 255, 255)
}
.pi-post--cover {
    width: 100%;
    object-fit: cover;
}
.pi-post__cover {
    overflow: hidden;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.pi-post__cover--ratio {
    padding-top: calc(100%*2/3);
}

.pi-post__post {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.pi-post__body {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    padding: 1rem;
    height: 100%;
}
.pi-post__content {
    height: 100%;
}
.pi-post__description {
    flex-grow: 1;
    display: flex;
    align-items: center;
}

.pi-post--title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    height: calc(21px * 2);
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    font-size: 18px;
    color: #000000;
    font-weight: 500;
    line-height: 21px;
}

.pi-post--description {

}

.pi-post--horizontal .pi-post__post{
    flex-direction: row;
}
.pi-post--horizontal .pi-post--ratio {
    padding-top: calc((47%)*2/3);
}
.pi-post--horizontal .pi-post--inside {
    min-height: 100%;
}
.pi-post--horizontal .pi-post__content {
    flex-basis: 53%;
}
.pi-post--horizontal .pi-post__cover--ratio {
    padding-top: calc((47%)*2/3);
    flex-basis: calc(47%);
}
.pi-post--horizontal .pi-post__cover {
    border-top-right-radius: 0;
    border-bottom-left-radius: 5px;
}
.p-modal--select .modal-content{
    background-color: #ebebeb;
}
.p-modal--select .modal-body,
.p-modal--select .modal-footer,
.p-modal--select .modal-header {
    border: none;
}
.p-modal--select .modal-header label {
    text-decoration: underline;
}
.p-modal--select .modal-body{
    padding-top: 0;
    padding-bottom: 0;
}
.p-modal--select .modal-header {
    padding-top: 2rem;
}
.p-modal--select .modal-footer {
    padding-bottom: 2rem;
}


#rocketchat,
.btn-inbox{
    display: none;
}
#rocketchat {
    width: 0;
    height: 0;
}
@media screen and (min-width: 320px) {

}

@media screen and (min-width: 640px) {

}

@media screen and (min-width: 768px) {
    .header-learning .prefix-name-learning {
        display: inline-block;
    }
    .recent-lesson .btn-continue {
        order: 3;
    }
    .recent-lesson .name-lesson {
        flex-basis: 60%;
        margin-top: 0;
    }
    .recent-lesson .title-learning {
        margin-bottom: 20px;
        flex-basis: 100%;
    }
    .btn-inbox{
        display: block;
    }
    #rocketchat {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 300px;
    }
}

@media screen and (min-width: 1024px) {
    .main-content {
        /* max-width: 75rem; */
        margin: 0 auto;
        position: relative;
    }
    #rocketchat {
        width: 400px;
    }
}

/*!
 * smartbanner.js v1.16.0 <https://github.com/ain/smartbanner.js>
 * Copyright © 2020 Ain Tohvri, contributors. Licensed under GPL-3.0.
 */
.smartbanner{position:absolute;top:0;left:0;overflow-x:hidden;width:100%;height:84px;background:#f3f3f3;font-family:Helvetica, sans, sans-serif}.smartbanner__exit{position:absolute;top:calc(50% - 6px);left:9px;display:block;margin:0;width:12px;height:12px;border:0;text-align:center}.smartbanner__exit::before,.smartbanner__exit::after{position:absolute;width:1px;height:12px;background:#767676;content:' '}.smartbanner__exit::before{transform:rotate(45deg)}.smartbanner__exit::after{transform:rotate(-45deg)}.smartbanner__icon{position:absolute;top:10px;left:30px;width:64px;height:64px;border-radius:15px;background-size:64px 64px}.smartbanner__info{position:absolute;top:10px;left:104px;display:flex;overflow-y:hidden;width:60%;height:64px;align-items:center;color:#000}.smartbanner__info__title{font-size:14px}.smartbanner__info__author,.smartbanner__info__price{font-size:12px}.smartbanner__button{position:absolute;top:32px;right:10px;z-index:1;display:block;padding:0 10px;min-width:10%;border-radius:5px;background:#f3f3f3;color:#1474fc;font-size:18px;text-align:center;text-decoration:none}.smartbanner__button__label{text-align:center}.smartbanner.smartbanner--android{background:#3d3d3d url("data:image/gif;base64,R0lGODlhCAAIAIABAFVVVf///yH5BAEHAAEALAAAAAAIAAgAAAINRG4XudroGJBRsYcxKAA7");box-shadow:inset 0 4px 0 #88b131}.smartbanner.smartbanner--android .smartbanner__exit{left:6px;margin-right:7px;width:17px;height:17px;border-radius:14px;background:#1c1e21;box-shadow:0 1px 2px rgba(0,0,0,0.8) inset,0 1px 1px rgba(255,255,255,0.3);color:#b1b1b3;font-family:'ArialRoundedMTBold', Arial;font-size:20px;line-height:17px;text-shadow:0 1px 1px #000}.smartbanner.smartbanner--android .smartbanner__exit::before,.smartbanner.smartbanner--android .smartbanner__exit::after{top:3px;left:8px;width:2px;height:11px;background:#b1b1b3}.smartbanner.smartbanner--android .smartbanner__exit:active,.smartbanner.smartbanner--android .smartbanner__exit:hover{color:#eee}.smartbanner.smartbanner--android .smartbanner__icon{background-color:transparent;box-shadow:none}.smartbanner.smartbanner--android .smartbanner__info{color:#ccc;text-shadow:0 1px 2px #000}.smartbanner.smartbanner--android .smartbanner__info__title{color:#fff;font-weight:bold}.smartbanner.smartbanner--android .smartbanner__button{top:30px;right:20px;padding:0;min-width:12%;border-radius:0;background:none;box-shadow:0 0 0 1px #333, 0 0 0 2px #dddcdc;color:#d1d1d1;font-size:14px;font-weight:bold}.smartbanner.smartbanner--android .smartbanner__button:active,.smartbanner.smartbanner--android .smartbanner__button:hover{background:none}.smartbanner.smartbanner--android .smartbanner__button__label{display:block;padding:0 10px;background:#42b6c9;background:linear-gradient(to bottom, #42b6c9, #39a9bb);box-shadow:none;line-height:24px;text-align:center;text-shadow:none;text-transform:none}.smartbanner.smartbanner--android .smartbanner__button__label:active,.smartbanner.smartbanner--android .smartbanner__button__label:hover{background:#2ac7e1}
