body {
	font-family: 'Open Sans', Verdana, Arial, Helvetica, serif;
	font-size: 11pt;
    color: #4C4C4C;
}

a {
    color: #2E74C5;
    text-decoration: none;
    transition: color 0.2s ease-out;
}

a:focus {
    color: #2E74C5;
    text-decoration: none;
}

a:hover {
    color: #EB923A;
    text-decoration: none;
}

input[type=text].emailsubject {
    width: 100%;
    height: 30px;
    padding: 5px 10px 5px 10px;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

input[type=text].emailsubject:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.StripeElement {
  height: 40px;
  padding: 10px 12px;
  width: 100%;
  color: #32325d;
  background-color: white;

  border: 1px solid;
  border-radius: 5px;
  border-color: #B9B9B9 !important; 
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}

.stripe-container {
    background-color: #ba1212;
    width: 100%;
    border: 1px solid;
    height: 400px;
}

.stripe-label {
    width: 100%;
    padding-bottom: 10px;
}

.stripe-elementtitle {
    padding-bottom: 10px;
}

.stripe-errortext {
    padding-bottom: 10px;
    color: #fa755a;
}

.faded {
    opacity: 0.3;
}

/*.ReactTable{
    background:rgba(255,255,255,1) !important;
    border:1px solid rgba(0,0,0,0.2) !important;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .05);
          box-shadow: 0 3px 5px rgba(0, 0, 0, .05);
}

.ReactTable .rt-thead.-header{
    box-shadow:none !important;
}

.ReactTable .rt-thead .rt-th,.ReactTable .rt-thead .rt-td{
    border-right:1px solid rgba(0,0,0,0.1) !important;
}

.ReactTable .rt-thead .rt-th{
    border-bottom:0px solid rgba(0,0,0,0.1) !important;
}

.ReactTable .rt-tbody .rt-tr-group{
    border-bottom:solid 0px rgba(0,0,0,0.1) !important;
}

.ReactTable .rt-tbody .rt-td{
    border-right:1px solid rgba(0,0,0,0.1) !important;
}*/

.pageNotFound {
    position: relative;
    width: 100%;
    margin-left: 20%;
    margin-right: 20%;
    text-align: center;
    border: none !important;
}

.ReactTable{
    background:rgba(255,255,255,1) !important;
    border:1px solid rgba(0,0,0,0.1) !important;
    -webkit-box-shadow: none !important;
          box-shadow: none !important;
    border-radius: 0px 0px 10px 10px;
    text-align: left;
}

.loginContent {
    position: relative;
    width: 33%;
    margin-left: 33%;
}

.login_selfregister {
    width: 100%;
    border-top: 1px solid rgba(0,0,0,0.2);
}

.login_form_title {
    position: relative;
    padding-top: 10px;
    font-weight: bold;
}

.login_form {
    position: relative;
    padding-top: 10px;
}

.form_error {
    color: #7B7FD4;
    padding-top: 5px;
    text-align: right;
}

.form_submitted_error {
    color: #EC5A61;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: left;
}

.ReactTable .rt-thead .rt-td.-sort-desc{
    box-shadow:none !important;
}

.ReactTable .rt-thead.-header{
    box-shadow:none !important;
}

.ReactTable .rt-tfoot{
    box-shadow:none !important;
}

.ReactTable .-pagination{
    box-shadow:none !important;
}

.ReactTable .rt-thead .rt-th,.ReactTable .rt-thead .rt-td{
    border:none !important;
}

.ReactTable .rt-thead .rt-th{
    border:none !important;
}

.ReactTable .rt-tbody .rt-tr-group{
    border:none !important;
}

.ReactTable .rt-tbody .rt-td{
    border:none !important;
    font-size: 10pt;
}

.ReactTable .rt-thead.-headerGroups{
    background:rgba(233,233,233,1) !important;
    border-bottom:1px solid rgba(0,0,0,0.1) !important;
}

.ReactTable.-striped .rt-tr.-odd{
    background:rgba(255,255,255,1) !important;
    border-bottom:1px solid rgba(0,0,0,0.1) !important;
    border-top:1px solid rgba(0,0,0,0.1) !important;
}

.ReactTable.-striped .rt-tr.-even{
    background:rgba(255,255,255,1) !important;
}

.ReactTable.-highlight .rt-tbody .rt-tr:not(.-padRow):hover{
    background:rgba(224,224,224,1) !important;
}

.ReactTable .-pagination .-btn{
    background:rgba(241,241,241,1) !important;
}

.ReactTable .-pagination .-btn:not([disabled]):hover{
    background:rgba(224,224,224,1) !important;
}

.ReactTable .-pagination .-btn:not([disabled]):hover{
    background:rgba(0,0,0,0.3);
    color:#000 !important;
}

.ReactTableQuestionHeight .ql-editor{
  height: 100px;
  overflow: hidden;
  overflow-y: scroll;
  overflow-x: scroll;
}

.contentelement_quill .ql-editor{
  height: 500px;
  overflow: hidden;
  overflow-y: scroll;
  overflow-x: scroll;
}

.ReactTable.-highlight .rt-tbody .rt-tr:not(.-padRow):hover{
    background:rgba(99,164,226,0.3) !important;
}

.table_containers, .table_container1, .table_container2, .table_container3, .table_container4, .table_container5, .table_container6, .table_container7, .table_container8 {
  border: 0px solid;
  border-color: #ccc;
  border-radius: 6px;
  background-color: rgba(255,255,255,0);
  padding: 5px;
  padding-top: 7px;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table_container1 {
  border-color: #C5B5D6;
}

.table_container2 {
  border-color: #A7A9DD;
}

.table_container3 {
  border-color: #94B4D9;
}

.table_container4 {
  border-color: #66C4DA;
}

.table_container5 {
  border-color: #C3DA66;
}

.table_container6 {
  border-color: #EDDB66;
}

.table_container7{
  border-color: #F9B979;
}

.table_container8 {
  border-color: #EF9A9E;
}

.table_text {
  margin-top: 9px;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table_textleft {
  padding-left: 10px;
  margin-top: 9px;
  margin-bottom: 9px;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table_icon {
  margin-top: 6px;
  text-align: center;
}

.table_status, .table_status_green, .table_status_red, .table_status_amber {
  margin-top: 6px;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: bold;
  width: 100%;
}

.table_status_green {
    color: #009821;
}

.table_status_red {
    color: #E74645;
}

.table_status_amber {
    color: #E7A345;
}

.table_progressbg {
    width: 110px;
    background-color: #BCBCBC;
    height: 16px;
    margin-top: 9px;
    font-size: 9pt;
    overflow: hidden;
    border-radius: 6px;
}

.table_progressfill {
    width: 0%;
    background-color: #02C129;
    height: 16px;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: hidden;
    margin-top: -17px;
}

.table_progresstext1 {
    width: 110px;
    text-align: center;
    position: relative;
    color: #fff;
}

.table_progresstext2 {
    width: 110px;
    text-align: center;
    position: absolute;
    top: 0px;
    left: 0px;
    color: #fff;
}

.datepick input {
  border: 1px solid;
  border-radius: 5px;
  border-color: #B9B9B9 !important; 
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 4px;
  padding-right: 4px;
}

/*Bootstrap overrides*/
.panel {
  border: 0px solid transparent;
  border-radius: 6px;
  /*-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .05);
          box-shadow: 0 3px 5px rgba(0, 0, 0, .05);*/
  box-shadow: none;
}

.panel-heading {
  border-bottom: 0px solid transparent;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.panel-title {
  font-size: 12pt;
  font-weight: 600;
}

.panel-titleInteractive {
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0);
  transition: box-shadow 0.3s;
  cursor: pointer;
}

.panel-titleInteractive:hover {
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .1);
}

.breadcrumb {
  padding: 5px;
  margin-bottom: 1px;
  background-color: rgba(255, 255, 255, .75);
  border-radius: 0px;
  font-size: 10pt;
}

.hide {
    display: none;
}

.password_tick_container {
    position:relative;
    margin-top: -32px;
    left: calc(100% - 40px);
}

.password_tick {
    width: 30px;
    height: auto;
}

.btn {
    border: 0px;
}

.btn-default {
    background-color: #F5F5F5;
    border: solid 1px rgba(0,0,0,0.1);
}

.btn-default.white {
    background-color: #FFFFFF;
    text-overflow: clip !important;
}

.btn-default.white:hover {
    background-color: rgba(243,243,243,1);
}

.btn-default.clearbg {
    background-color: rgba(255,255,255,0.01);
    border: 1px solid rgba(255,255,255,0.01);
}

.btn-default.clearbg:hover {
    background-color: rgba(243,243,243,1);
}

.btn-default.sidemenu{
    padding-top: 10px;
    padding-bottom: 10px;
}

.btn-default.floatright{
    padding-top: 10px;
    padding-bottom: 10px;
    width: 150px;
    float: right;
}

.btn-default.floatleft{
    padding-top: 10px;
    padding-bottom: 10px;
    width: 150px;
    float: left;
}

.btn-default.small{
    padding-top: 6px;
    padding-bottom: 6px;
    width: 80px;
}

.btn-default.tablebtn{
    padding-top: 8px;
    padding-bottom: 5px;
}

.btn-default.tablebtnicon{
    padding-top: 5px;
    padding-bottom: 5px;
}

.btn-large{
    font-size: 13pt;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
}

.btn-default.disabled, .btn-default[disabled] {
    color: #D7D7D7;
}

.btnDisabled:disabled{
  color: #dedede !important;
}

.btn-default.transparentbg {
	background-color: rgba(0,0,0,0);
	border: none;
}

.btn-default.transparentbg:focus,
.btn-default.transparentbg:active,
.btn-default.transparentbg.focus {
	background-color: rgba(0,0,0,0) !important;
	border: none;
}

.modal-content {
    background-color: #F5F5F5;
}

.modal-subtitle {
    margin-bottom: 10px;
}

.sharp {
  border-radius:0px !important;
}

.panel-footer {
    height: 53px !important;
    background-color: #fff;
}

.formTitle, .formTitle_right {
    padding-top: 7px;
    padding-bottom: 7px;
    text-align: left;
}

.formTitle_right {
    text-align: right;
}

.react-datepicker {
  font-size: 1.3rem !important;
}

.react-datepicker__current-month {
  font-size: 1.5rem !important;
}

.react-datepicker__header {
  padding-top: 6px !important;
}

.react-datepicker__navigation {
  top: 13px !important;
}

.react-datepicker__day-name, .react-datepicker__day {
  margin: 0.7rem !important;
}

.react-datepicker-custom {
    width: 150px;
    text-align: center;
}

.table_checkBox {
	float: left;
	height: 18px;
	width: 50px;
	border-radius: 11px;
	border:	2px solid;
	border-color: #ccc;
	background-color: #fff;
	margin-top: 4px;
	margin-left: 5px;
}

.bootstrap_footer {
    background-color: #333;
}

.bootstrap_close_light .close {
    color: #fff; 
    opacity: 1;
}

.pointer-events-none{
    pointer-events: none;
}

.col-red {
	background-color: #ba1212;	
	border-radius: 0px;
}

.toggle-light {
   background-color:#fff !important;
}

.dark-text {
	color: #4C4C4C !important;
	caret-color: #777;	
}

.light-text {
	color: #fff !important;
	caret-color: #fff;	
}

.light-text:Hover {
	color: #EDEDED !important;
}

.lightest-text {
	color: #fff !important;
	caret-color: #fff;	
}

.disabled-text {
	font-weight: normal;
	color: #CCC;	
}

.red-text {
	color: #ba1212 !important;
}

.textSize-11 {
	font-size:11px;	
}

.textSize-13 {
	font-size:13pt;	
}

.textRight {
	text-align: right;
}

.textLeft {
	text-align: left;
}

.textCenter {
	text-align: center;
}

.textFail {
	width: 100%;
	color: #EC5A61;
	margin-bottom: 10px;	
}

.textSuccess {
	width: 100%;
	color: #36B622;
	margin-bottom: 10px;	
}

.padding-right15 {
	padding-right: 15px;
}

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

.margin-top2 {
	margin-top: 3px;
}

.margin-top3 {
	margin-top: 3px;
}

.margin-top4 {
	margin-top: 4px;
}

.margin-top5 {
	margin-top: 5px;
}

.margin-top6 {
	margin-top: 6px;
}

.margin-top7 {
	margin-top: 7px;
}

.margin-top8 {
	margin-top: 8px;
}

.margin-top10 {
	margin-top: 10px;
}

.margin-top15 {
	margin-top: 15px;
}

.margin-top20 {
	margin-top: 20px;
}

.margin-top25 {
	margin-top: 25px;
}

.margin-top30 {
	margin-top: 30px;
}

.margin-top35 {
	margin-top: 35px;
}

.margin-top40 {
	margin-top: 40px;
}

.margin-bottom3 {
	margin-bottom: 3px;
}

.margin-bottom5 {
	margin-bottom: 5px;
}

.margin-bottom7 {
	margin-bottom: 7px;
}

.margin-bottom10 {
	margin-bottom: 10px;
}

.margin-bottom15 {
	margin-bottom: 15px;
}

.margin-bottom20 {
	margin-bottom: 20px;
}

.margin-bottom25 {
	margin-bottom: 25px;
}

.margin-bottom30 {
	margin-bottom: 30px;
}

.margin-bottom40 {
	margin-bottom: 40px;
}

.margin-bottom50 {
	margin-bottom: 50px;
}

.margin-bottom60 {
	margin-bottom: 60px;
}

.margin-bottom70 {
	margin-bottom: 70px;
}

.margin-bottom80 {
	margin-bottom: 80px;
}

.margin-bottom90 {
	margin-bottom: 90px;
}

.margin-bottom-10 {
	margin-bottom: -10px;
}

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

.margin-top-7 {
	margin-top: -7px;
}

.margin-top-10 {
	margin-top: -10px;
}

.margin-top-15 {
	margin-top: -15px;
}

.margin-top-20 {
	margin-top: -20px;
}

.margin-top-25 {
	margin-top: -25px;
}

.margin-right3 {
	margin-right: 3px;
}

.margin-right5 {
	margin-right: 5px;
}

.margin-right7 {
	margin-right: 7px;
}

.margin-right10 {
	margin-right: 10px;
}

.margin-right15 {
	margin-right: 15px;
}

.margin-right20 {
	margin-right: 20px;
}

.margin-left-10 {
	margin-left: -10px;
}

.margin-left40 {
	margin-left: 40px;
}

.margin-left3 {
	margin-left: 3px;
}

.margin-left5 {
	margin-left: 5px;
}

.margin-left6 {
	margin-left: 6px;
}

.margin-left7 {
	margin-left: 7px;
}

.margin-left8 {
	margin-left: 8px;
}

.margin-left10 {
	margin-left: 10px;
}

.margin-left15 {
	margin-left: 15px;
}

.margin-left20 {
	margin-left: 20px;
}

.margin-left7 {
	margin-left: 7px;
}

.padding-top20 {
	padding-top: 20px;
}

.padding-top2 {
	padding-top: 2px;
}

.padding-top3 {
	padding-top: 3px;
}

.padding-top4 {
	padding-top: 4px;
}

.padding-top5 {
	padding-top: 5px;
}

.padding-top6 {
	padding-top: 6px;
}

.padding-top7 {
	padding-top: 7px;
}

.padding-left3 {
	padding-left: 3px;	
}

.padding-left15 {
	padding-left: 15px;	
}

.padding-left18 {
	padding-left: 18px;	
}

.padding_5_left {
	padding-left: 5px;	
}

.padding-bottom10 {
	padding-bottom: 10px;
}

.padding-bottom20 {
	padding-bottom: 20px;
}

.padding-top10 {
	padding-top: 10px;
}

.textBold {
    font-weight: bold;
}

.textItalic {
    font-style: italic;
}

.textUnderline {
  text-decoration: underline;
}

.no-scroll {
	overflow: none !important;
}

.menu-left-padding {
	
}

.cursorPointer {
    cursor: pointer;
    
}

.pointerEvents_none {
    pointer-events: none;
}

.userSelect_none {
    user-select: none;
}

#menu-left {
	width: 200px;
	padding-left: 0px;
	background-color: #fff;
	position: fixed;
	height: 100%;	
}

.content-container {
	position: relative;	
	width:100%;
}

.sidemenu-margin-top {
    margin-top: 41px;   
}

.sidemenu-margin-top-tall {
    margin-top: 31px;   
}

.draw_a_line {
    border-bottom: 1px solid #CECECE;
}

@media (max-width: 991px) {
  .content-withmenu {
	position: relative;
	width:100%;
	padding-left: 20px;
	padding-right: 20px;
  }
}

@media (min-width: 992px) {
  .content-withmenu {
	position: relative;
	width:calc(100% - 200px);
	padding-left: 20px;
	padding-right: 20px;
	margin-left: 200px;
  }
}

/*xsmall, small and medium*/
@media (max-width: 1199px) {
  .sidemenu-margin-top, .sidemenu-margin-top-tall {
    margin-top: 0px; 
  }
}

.transparent {
	background-color: rgba(0,0,0,0);
	border: none;
}

.transparent:hover {
	background-color: rgba(220,220,220,0.15) !important;
	border: none;
}

.transparent:focus,
.transparent:active,
.transparent.focus {
	background-color: rgba(220,220,220,0.25) !important;
	border: none;
}

a.list-group-item:hover,
button.list-group-item:hover,
a.list-group-item:focus,
button.list-group-item:focus {
	background-color: rgba(220,220,220,0.08) !important;
}

.navbar {
  position: relative;
  min-height: 50px;
  margin-bottom: 20px;
  border: none;
  border-radius: 0;
   border-bottom: 1px solid #eee;
}

.button_Icon_hotspot {
	opacity: 0;
	width: 30px;
	height: 30px;
	margin-top: -30px;
}

.button_Icon_icon {
	float: left;
	height: 30px;
	width: 30px;
	position: absolute;
	left: 0px;
	top: 0px;
}

.button_textWithIcon_icon {
	float: left;
	height: 30px;
	width: 30px;
	
}

.button_Icon_transparent {
	background-color:rgba(255, 255, 255, 0);
}

.button_Icon_base {
	position: relative;
	width: 30px;
	height: 30px;
}

.button_Icon_over {
	width: 30px;
	height: 30px;
	opacity: 0;
}

.button_textWithIcon_hotspot {
	position:absolute;
	opacity: 0;
	height: 30px;
	width: 100%;
	top: 0px;
	cursor: pointer;
}

.button_textWithIcon_hotspot_short {
	position:absolute;
	opacity: 0;
	height: 25px;
	width: 25px;
	top: 0px;
	cursor: pointer;
}

.button_textWithIcon_title {
	float: left;
	color: #FFFFFF;
	padding-top: 5px;
	padding-left: 4px;
}

.button_textWithIcon_titleDark {
	float: left;
	color: #000000;
	padding-top: 5px;
	padding-left: 4px;
}

.button_textWithIcon_squareTitle {
	float: left;
	color: #FFFFFF;
	padding-top: 4px;
	text-align: center;
	font-size: 9pt;
}

.buttonText_containerSelected {
	position: absolute;
	color: #20455e;
	top: 3px;
	width: 100%;
	text-align: center;
	font-weight: bold;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.buttonText_container {
	position: absolute;
	color: #20455e;
	top: 3px;
	width: 100%;
	text-align: center;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.button_checkBox {
	float: left;
	height: 18px;
	width: 18px;
	border-radius: 11px;
	border:	2px solid;
	border-color: #ccc;
	background-color: #fff;
	margin-top: 4px;
	margin-left: 4px;
}

.button_checkBoxFilled {
	position: absolute;
	height: 14px;
	width: 14px;
	border-radius: 7px;
	background-color: #000;
	margin-top: 6px;
	margin-left: 6px;
}

.button_tickBox {
	float: left;
	height: 22px;
	width: 22px;
	border:	2px solid;
	border-color: #ccc;
	background-color: #fff;
	margin-top: 4px;
	margin-left: 4px;
}

.button_tickBox_short {
	float: left;
	height: 19px;
	width: 19px;
	border:	2px solid;
	border-color: #ccc;
	background-color: #fff;
	margin-top: 3px;
	margin-left: 3px;
}

.button_tickBoxFilled {
	position: absolute;
	height: 14px;
	width: 14px;
	margin-top: 8px;
	margin-left: 8px;
	background-image: url("../images/icons/icon_tick_grey.png");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 100%;
}

.button_tickBoxFilled_short {
	position: absolute;
	height: 13px;
	width: 13px;
	margin-top: 6px;
	margin-left: 6px;
	background-image: url("../images/icons/icon_tick_grey.png");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 100%;
}

.button_checkBox_title {
	position: relative;
	margin-left: 27px;
	padding-top: 5px;
	padding-left: 5px;
}

.button_inputBox_title {
	float: left;
	padding-top: 4px;
	padding-right: 7px;
	padding-left: 3px;
}

.button_dropDown_title {	
	padding-top: 4px;
	padding-right: 7px;
	padding-left: 3px;
	width: calc(100% - 25px);
	height: 30px;
	position:absolute;
	border: solid 1px;
	overflow:hidden;	
}

.button_slider_title {
	float: left;
	margin-top: -4px;
	padding-right: 8px;
	padding-left: 2px;
}

.button_inputBox {
	float: left;
	width: 100%;
}

.button_inputNumberPostText {
	padding-top: 4px;
	padding-left: 3px;
	float: left;
}

.button_InputBox_titleContainer {
	position: absolute;
	float: left;
	top: 1px;
	width: 100%;
}

.button_DropDown_titleContainer {
	position: absolute;
	float: left;
	top: 5px;
	width: 100%;
    margin-left: 5px;
}

.button_slider_titleContainer {
	position: absolute;
	width: 100%;
	height: 50px;
}

.button_textAreaBox {
	font-size: 10pt;
	width: 100%;
	float: left;
	resize: none;
}

.button_searchTextBox, .button_searchTextBoxFullWidth {
	position: absolute;
	width: 115px;
	border: none;
	top: 2px;
	font-size: 10pt;
	color: #20455e;
	border-radius: 5px;
	text-align: left;
    background: rgba(255,255,255,0);
}

.button_searchTextBoxFullWidth {
	width: calc(100% - 54px);
}

.button_searchBox {
	font-size: 10pt;
	width: 100%;
	float: left;
	resize: none;
}

.button_searchMessage, .button_searchMessageFullWidth {
	position: relative;
	float: right;
	color: #20455e;
	width: 150px;
	height: 25px;
	font-size: 9pt;
	margin-right: 7px;
	margin-top: 6px;
	text-align: right;
}

.button_searchMessageFullWidth {
	float: none;
	color: #20455e;
	width: 100%;
	margin-right: 0px;
	margin-top: 0px;
	text-align: center;
}

.button_searchBox_container, .button_searchBoxFullWidth_container {
	position: relative;
	float: right;
	color: #20455e;
	width: 170px;
	height: 26px;
	background-color: #fff;
	border-radius: 5px;
	border: 1px solid #B9B9B9;
}

.button_searchBoxFullWidth_container {
	float: none;
	width: auto;
}

.button_searchBox_button {
	position: relative;
	float: left;
    top: 0px;
	width: 27px;
	height: 23px;
    background-color: #fff;
	border-radius: 5px;
	background-image: url("../images/icons/icon_search.png");
    background-repeat: no-repeat;
    background-position: 3px 2px;
	background-size: 18px 18px;
    cursor: pointer;
}

.button_searchBox_button:Hover {
    background-color: rgba(241,241,241,0.7);
}

.button_searchBox_close {
	position: relative;
	float: right;
    top: 0px;
	width: 23px;
	height: 23px;
    background-color: rgba(255,255,255,0);
	border-radius: 5px;
    cursor: pointer;
    padding-top:2px;
    padding-left: 4px;
    color: #B0B0B0;
}

.button_searchBox_close:Hover {
    background-color: rgba(231,231,231,0.7);
}

.button_search_base {
	position: relative;
	height: 25px;
	width: 100%;
}

.search_container {
    float:right;
	position: relative;
	height: 40px;
	width: 400px;
    padding-top: 2px;
}

.clearboth {
    clear: both;
}

.expandSearchContainer {
    width: 170px;
    animation-name: expandSearchContainerKey;
    animation-duration: 0.4s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.contractSearchContainer {
    width: 230px;
    animation-name: contractSearchContainerKey;
    animation-duration: 0.4s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

@keyframes expandSearchContainerKey {
    from {width: 170px;}
    to {width: 230px;}
}

@keyframes contractSearchContainerKey {
    from {width: 230px;}
    to {width: 170px;}
}

.expandSearchText {
    width: 115px;
    animation-name: expandSearchTextKey;
    animation-duration: 0.4s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.contractSearchText {
    width: 1750px;
    animation-name: contractSearchTextKey;
    animation-duration: 0.4s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

@keyframes expandSearchTextKey {
    from {width: 115px;}
    to {width: 175px;}
}

@keyframes contractSearchTextKey {
    from {width: 175px;}
    to {width: 115px;}
}

.button_colorSelector {
	width: 50px;
	border: none;
	border-color: #ccc !important;
	text-align: center;
	padding: 2px !important;
}

.button_colorSelectorPopup {
	border: none !important;
	border-color: #ccc !important;
}

.sp-input {
	font-size: 12px !important;
	border: none !important;
	padding: 3px !important;
	margin: 0;
	width: 100%;	
	border-radius: 0px !important;
	color: #222;
	background-color: #ffffff !important;
}

.sp-container button{
	display: none !important;
}

.sp-cancel {
	display: none !important;
}

.button_drop_title {
	float: left;
	padding-top: 3px;
	padding-right: 7px;
	padding-left: 3px;
}

.button_textWithIcon_titleContainer {
	position: absolute;
	float: left;
	top: 0px;
	width: 100%;	
}

.button_dropDown select {
	border: 0 !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance:none;
	background: #EEEEEE url("../../images/icons/icon_dropdown.png") no-repeat 99% center;
	width: 100%;
	height: 28px;
	text-indent: 0.01px;
	color: #000;
	border-radius: 0px;
	padding-left: 7px;
	padding-right: 25px;
	margin-top: 1px;
	font-size: 10pt;
    white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.button_dropDownLight select {
	background: #e5e5e5 url("../images/icons/icon_dropdown.png") no-repeat 96% center !important;
	color: #20455e !important;
}

.button_switch, .button_switch_disabled, .button_switch_off {
    position: relative;
    width: 55px;
    height: 30px;
    background-color: #62C552;
    border-radius: 15px;
    border: 2px solid #62C552;
    transition: background-color 0.3s, border-color 0.3s;
    cursor: pointer;
}

.button_switch_disabled {
    background-color: #F3F3F3;
    border-color: #F3F3F3;
    cursor: default;
}

.button_switch_off {
    background-color: #EBEBEB;
    border-color: #EBEBEB;
}

.button_switch_ball {
    position: relative;
    height: 26px;
    width: 26px;
    background-color: #fff;
    border-radius: 13px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .08);
    transition: left 0.3s;
    left: 25px;
    pointer-events: none;
}

.button_switch_title_container {
    position: relative;
    clear: both;
    width: 100%;
    height: 30px;
}

.button_switch_container {
    float: left;
    width: calc(100% - 170px);
}

.button_switch_title {
    float: left;
    margin-top: 4px;
    width: 170px;
}

.button_switch_container_right {
    float: left;
    width: 65px;
}

.button_switch_title_right {
    float: left;
    margin-top: 4px;
    width: calc(100% - 65px);
}

.backgroundBlue_light {
	background-color: #3a5b6b;
}

.backgroundBlue {
	background-color: #183e51;
}

.backgroundWhite {
	background-color: #fff;
}

.backgroundTransparent {
	background-color: transparent;
}

.backgroundGrey_light {
	background-color: #CCC;
}

.backgroundGrey_lightest {
	background-color: #f5f5f5;
}

.navigationWhite {
    background-color: #fff;
    padding-left: 20px;
    width: 100%;
}

.navigationGrey {
    background-color: #E1E1E1;
    margin-left: -20px;
}

.popupBlue {
	background-color: #63A4E2;
}

.popupLightBlue {
	background-color: #A8D2FA;
}

.button_textWithIcon_base {
	position: relative;
	height: 30px;
}

.button_dropDown_base {
	position: relative;
	height: 36px;
    width:auto;
}

.button_dropDownList {
    position: relative;
    float: left;
    width: 200px;
}

.button_textWithIcon_base_short {
	position: relative;
	height: 25px;
	width: 25px;
}

.button_textWithIcon_over {
	height: 30px;
	opacity: 0;
}

.button_dropDown_over {
	height: 36px;
	opacity: 0;
}

.button_textWithIcon_over_short {
	height: 25px;
	width: 25px;
	opacity: 0;
}

.page-header {
  padding-bottom: 9px;
  margin: 20px 0px 20px;
  border-bottom: 1px solid #eee;
}

.page-headerDark {
  padding-bottom: 9px;
  padding-top: 1px;
  padding-left: 10px;
  margin: 0px 0px 20px;
  border-bottom: 1px solid #999;
}

.page-headerLight {
  padding-bottom: 9px;
  padding-top: 1px;
  padding-left: 10px;
  margin: 0px 0px 20px;
  border-bottom: 1px solid #fff;

}

.page-headerSmall {
    font-size: 13pt;
    font-weight: 600;
}

.page-headerMedium {
    font-size: 18pt;
    font-weight: 500;
    padding-top: 3px;
}

.loader, .loader_mini {
	background-image: url("../images/loading-swish.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
    border-radius: 50%;
	background-color: rgba(255,255,255,0.1);
    width: 100px;
    height: 100px;
    animation: spin 2s ease-in-out infinite;
	position: relative;
}

.loader_default {
	left: calc(50% - 46px);
    top: calc(50% - 150px);
}

.loader_mini {
    width: 40px;
    height: 40px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes fadeMeOut {
    from {opacity: 0.5;}
    to {opacity: 0;}
}

@keyframes fadeMeOutFull {
    from {opacity: 1;}
    to {opacity: 0;}
}

@keyframes fadeMeIn {
    from {opacity: 0;}
    to {opacity: 0.5;}
}

@keyframes fadeMeInFull {
    from {opacity: 0;}
    to {opacity: 1;}
}

.fadeOut {
	opacity: 0;
	animation-name: fadeMeOut;
    animation-duration: 0.3s;
	animation-fill-mode: forwards;
}

.fadeOutFull {
	opacity: 0;
	animation-name: fadeMeOutFull;
    animation-duration: 0.3s;
	animation-fill-mode: forwards;
}

.fadeIn {
	opacity: 0.5;
	animation-name: fadeMeIn;
    animation-duration: 0.3s;	
	animation-fill-mode: forwards;
}

.fadeInFull {
	opacity: 1;
	animation-name: fadeMeInFull;
    animation-duration: 0.3s;	
	animation-fill-mode: forwards;
}

@keyframes fadeMeOutSlide {
    from {opacity: 1; top: 0px;}
    to {opacity: 0; top: 20px;}
}

.fadeOutSlide {
	opacity: 0;
	animation-name: fadeMeOutSlide;
    animation-duration: 0.5s;
	animation-fill-mode: forwards;
}

@keyframes fadeMeInSlide {
    from {opacity: 0; top: -20px;}
    to {opacity: 1; top: 0px;}
}

.fadeInSlide {
	opacity: 0;
	animation-name: fadeMeInSlide;
    animation-duration: 0.5s;
	animation-fill-mode: forwards;
}

.mouseHint {
	overflow:visible;
	opacity: 0;
	background-color:rgba(0, 0, 0, 1);
	white-space: nowrap;
	position: absolute;
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top: 8px;
	margin-left: 10px;
	display: none;
	color: #FFFFFF;
	float: left;
	z-index: 2056;
    user-select: none;
}

.mouseLabel {
    position: absolute;
    display: none;
    top: 0px;
    left: 0px;
    width: auto;
    user-select: none;
    pointer-events: none;
    background-color:rgba(51, 51, 51, 1);
	white-space: nowrap;
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 5px;
	padding-bottom: 5px;
    border-radius: 3px;
    color: #FFFFFF;
    z-index: 2056;
    opacity: 0;
    transition: opacity 0.4s;
}

.mouseLabel_arrow {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.image_listTick {
	width: 12px;
	height: 12px;
	background-image: url("../../images/selected-tick2.png");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 100%;
	position:relative;	
	float: right;
	padding-right: 20px;
	padding-top: 20px;
}

.image_listTitle {
	padding-left: 15px;
	padding-right: 10px;
	padding-top: 18px;
	color: #8B8B8B;
	text-align: left;
	float: left;
	font-size: 10pt;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	position: relative;
    width: calc(100% - 60px);
    user-select: none;
}

.image_squareError, .image_squareError_list {
	position: relative;
    color: #EC5A61;
	padding-top: 10px;
	padding-left: 5px;
	padding-right: 5px;
    text-align: center;
}

.image_squareError_list {
    float: left;
    text-align: left;
    padding-left: 15px;
	padding-right: 10px;
	padding-top: 18px;
}

.emptyLibrary {
    color: #A0A0A0;
    width: 100%;
    text-align: center;
    padding-top: 40px;
}

.popup_savesuccess {
	float: right;
	margin-right: 6px;
    margin-top: -17px;
    font-size: 10pt;
	position: relative;
    color: #00CC00;
}

.popup_savefail {
	float: right;
	margin-right: 6px;
    margin-top: -17px;
    font-size: 10pt;
	position: relative;
    color: #D63E3E;
}

.image_listImage_selected {
	border:	2px solid;
	border-color: #63A4E2;
	width: 45px;
	height: 45px;
}

.image_listImage {
	top: 3px;
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: contain;
	position: relative;
	float: left;
}

.image_list, .image_list_over {
	width: 100%;
	background-color: #fff;
	border-bottom: 1px solid #C4C4C4;
	clear: left;
    padding-left: 15px;
}

.image_list_over {
	background-color:rgba(99, 164, 226, 0.1);
}

.image_listContainer {
	flex: 0 0 100%;
}

.image_squareCloseButton {
	padding: 5px;
	position: relative;
	top: 0px;
	float: right;
	z-index: 6;
}

.image_squareInfo_text, .image_squareInfo_text_small {
	padding-top: 10px;
	padding-left: 15px;
	padding-bottom: 10px;
	flex: 1 1 60%;
	font-size: 10pt;
}

.image_squareInfo_text_small {
    flex: 1 1 40%;
}

.image_squareInfo_image {
	background-repeat: no-repeat;
    background-position: center center;	
	background-size: contain;
	display: table-cell;
	position: relative;
}

.object_squareInfo_edit {
    position: relative;
	display: inline-block;
	width: 100%;
}

.object_squareInfo_editButton {
	float: left;
	width: 30px;
}

.object_squareInfo_editText {
	margin-left: 35px;
	margin-top: 5px;	
	margin-right: 8px;
}

.object_squareInfo_textAreaBox {
	color: #000;
	width: 100%;
	resize: none;
	font-size: 10pt;
	position: relative;
}

.object_squareInfo_image, .object_squareInfo_image_large {
	background-repeat: no-repeat;
    background-position: center center;	
    background-size: contain;
    height: 220px;
	flex: 0 0 40%;
}

.object_squareInfo_image_large {
    flex: 0 0 60%;
    height: 300px;
    border-radius: 8px;
    background-color: #fff;
    border: 1px solid #D8D8D8;
}

.object_squareInfo_video_large {
    flex: 0 0 60%;
    height: 300px;
}

.object_pdf {
    height: 220px;
	flex: 0 0 40%;
    overflow: scroll;
    border: 1px solid #C4C4C4;
}

.object_squareInfo_video {
	position: relative;
	top: 0;
	left: 0;
    width: 100%;
    height: auto;
    max-height: 300px;
}

.object_squareInfo_audio {
	position: relative;
	top: 0;
	left: 0;
    width: 100%;
    height: 50px;
}

.object_squareInfo_topBar {
	height: 50px;
	position: relative;
	clear: both;
}

.image_squareInfo_content {
	height: 150px;
	position: relative;
	float: left;
	clear: both;
	margin-top: -40px
}

.object_squareInfo_content {
	position: relative;
	width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 20px;
}

.object_pointer {
    position: relative;
    left: calc(50% - 60px);
    width: 0;
	height: 25px;
	border-left: 60px solid transparent;
	border-right: 60px solid transparent;
	border-bottom: 25px solid #f5f5f5;
}

.image_squareInfo {
	width: 100%;
	position: relative;
    flex: 0 0 100%;
    border-bottom: 1px solid #C4C4C4;
    padding-left: 10px;
    padding-right: 10px;
}

.image_squareMagnify_thumbnail {
	width: 30px;
	height: 30px;
	background-image: url("../images/icons/icon_magnify_white.png");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 70%;
	position:relative;
	border-radius: 15px;
	background-color:rgba(0, 0, 0, 0.4);
    top: calc(100% - 40px);
    left: 8px;
}

.image_squareMagnify_list {
	width: 30px;
	height: 30px;
	background-image: url("../images/icons/icon_magnify_white.png");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 70%;
	position:relative;
	border-radius: 15px;
	background-color:rgba(0, 0, 0, 0.4);
    top: 10px;
    left: calc(100% - 40px);
}

.image_squareTick {
	width: 22px;
	height: 22px;
	background-image: url("../../images/selected-tick2.png");
    background-repeat: no-repeat;
    background-position: center center;
	position: absolute;
    left: calc(100% - 35px);
    top: calc(100% - 35px);
}

.image_squareImage_selected {
	border:	3px solid;
	border-color: #63A4E2;
	width: 100%;
	height: 100%;
	position: absolute;
}

.image_uploadBase {
	position: absolute;
    width: calc(100% - 20px);
	height: 20px;
	border-radius: 10px;
	background-color: #fff;
	opacity: 0.4;
	margin-left: 10px;
	margin-right: 10px;
	left: 0px;
	top: 0px;
	border: 1px solid;
	border-color: #d9e1e8;
}

.image_uploadFill {
	position: absolute;
	height: 20px;
	border-radius: 10px;
	background-color: #fff;
	margin-left: 10px;
	margin-right: 10px;
	left: 0px;
	top: 0px;
	border: 1px solid;
	border-color: #d9e1e8;
}

.image_uploadContainer {
	position: absolute;
	width: 100%;
	height: 20px;
	left: 0px;
}

.image_uploadContainer_list {
	position: relative;
	width: 100px;
	height: 20px;
    float: left;
    margin-right: 10px;
}

.object_squareInfo_buttons {
	float: left;
	margin-left: 8px;
	position: absolute;
}

.object_squareImage_selected {
	border:	3px solid;
	border-color: #63A4E2;
	position: absolute;
    width: 100%;
    height: 100%;
}

.object_squareImage_title {
    position: relative;
	color: #8B8B8B;
	text-align: center;
	font-size: 9pt;
	padding-top: 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
    width: 125px;
    height: 35px;
    user-select: none;
}

.image_square_over {
	background-color:rgba(0, 0, 0, 0.4);
	position: absolute;
	color: #fff;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding-top: 6px;
	padding-left: 5px;
	padding-right: 5px;
    width: 100%;
    height: 100%;
    user-select: none;
}

.object_square_over {
	background-color:rgba(0, 0, 0, 0);
	position: absolute;
	border:	3px solid;
	border-color: #63A4E2;
    width: 100%;
    height: 100%;
}

.object_squareImage {
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: contain;
	position: absolute;
    width: 100%;
    height: 100%;
}

.image_squareImage {
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: cover;
	position: absolute;
    width: 100%;
    height: 100%;
    border: 1px solid #D8D8D8;
    background-color: #fff;
}

.image_square {
	background-color:rgba(255, 255, 255, 0.2);
    width: 100%;
    height: 100%;
}

.object_square {
	background-color:rgba(99, 164, 226, 0);
    width: 100%;
    height: 125px;
    position: relative;
}

.image_squareContainer {
    flex: 0 0 250px;
    height: 250px;
    position: relative;
}

.folder_squareContainer {
    flex: 0 0 125px;
    height: 160px;
    position: relative;
}

.folder_display {
	overflow-y: scroll;
	overflow-x: hidden;
	position:relative;
	height: 100%;
	-webkit-overflow-scrolling: touch;
	position: relative;
    width: 100%;
    background-color: #fff;
}

.library_flex_container, .library_flex_container_list {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 20px;
    width: 100%;
    margin-bottom: 20px;
    text-align: left;
}

.library_flex_container_list {
    gap: 0px;
}

.library_container {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 180px;
}

.image_display {
	overflow: hidden;
	position:relative;
	text-align: center;
	height: 100%;
	position: relative;
}

.library_dropzone {
	overflow: hidden;
	position:relative;
	text-align: left;
	height: 100%;
	position: relative;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #fff;
}

.library_move {
    position: relative;
    width: 100%;
    max-height: 115px;
    overflow-y: auto;
    padding: 1px;
}

.library_move_folder, .library_move_folder_selected {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 25px;
    padding: 3px;
    padding-right: 10px;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    background-color: #fff;
    margin-bottom: 1px;
}

.library_move_folder:hover {
    background-color: #F2F8FF;
}

.library_move_folder_selected {
    background-color: #E9F4FF;
    outline: 1px solid #BCD6F1;
}

.popup_container {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 180px;
	text-align:center;
	border-radius: 8px;
	padding:10px;
}

.popup_contents_topBarSmall {
	height: 50px;
	width: 100%;
	position: relative;
	background-color: #fff;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

.popup_contents {
    
}

.optionPanel_searchBarLeft {
	float: left;
	position: relative;
}

.popup_viewButtonLeft {
	float: right;
	margin-right: 0px;
	margin-top: 12px;
	position: relative;
}

.popup_viewButtonRIght {
	float: right;
	margin-right: 8px;
	margin-top: 12px;
	position: relative;
}

.popup_buttons {
	float: right;
	margin-right: 5px;
	margin-top: 10px;
	position: relative;
	width: 160px;
}

.popup_buttonsLeft {
	float: left;
	margin-right: 10px;
	margin-top: 10px;
	position: relative;
}

.popup_icon {
    margin-top: -4px;    
}

.popup_floatRight {
	float: right;
	position: relative;
}

.popup_floatLeft {
	float: left;
	position: relative;
}

.popup_settings {
	padding-left:15px;
    padding-right:15px;
}

.option_back, .option_viewlist, .option_viewthumbnail, .option_close, .option_close_white, .option_close_black, .option_back_white, .option_back_black, .option_menu_white, .option_notification_black, .option_notification_white, .option_basket_black, .option_basket_white, .option_menu_black, .option_next_white, .option_next_black, .option_previous_white, .option_previous_black, .option_edit, .option_edit_black, .option_zoomin_white, .option_zoomin_black, .option_zoomin_black, .option_zoomout_white, .option_zoomout_black, .option_rotate_white, .option_rotate_black, .option_download_white, .option_download_black, .option_support_white, .option_support_black {
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 70% 70%;
}

.option_back {
	background-image: url("../../images/icons/icon_back.png");
}

.option_viewlist {
	background-image: url("../../images/icons/icon_viewlist.png");
}

.option_viewthumbnail {
	background-image: url("../../images/icons/icon_viewthumbnail.png");
}

.option_close {
	background-image: url("../../images/icons/icon_close.png");
}

.option_close_white {
	background-image: url("../../images/icons/icon_close_white.png");
}

.option_close_black {
	background-image: url("../../images/icons/icon_close_black.png");
}

.option_back_white {
	background-image: url("../../images/icons/icon_back_white.png");
}

.option_back_black {
	background-image: url("../../images/icons/icon_back_black.png");
}

.option_menu_white {
	background-image: url("../../images/icons/icon_menu_white.png");
}

.option_notification_black {
	background-image: url("../../images/icons/icon_notification_black.png");
}

.option_notification_white {
	background-image: url("../../images/icons/icon_notification_white.png");
}

.option_basket_black {
	background-image: url("../../images/icons/icon_basket_black.png");
}

.option_basket_white {
	background-image: url("../../images/icons/icon_basket_white.png");
}

.option_menu_black {
	background-image: url("../../images/icons/icon_menu_black.png");
}

.option_next_white {
	background-image: url("../../images/icons/icon_next_white.png");
}

.option_next_black {
	background-image: url("../../images/icons/icon_next_black.png");
}

.option_previous_white {
	background-image: url("../../images/icons/icon_previous_white.png");
}

.option_previous_black {
	background-image: url("../../images/icons/icon_previous_black.png");
}

.option_edit {
	background-image: url("../../images/icons/icon_editpencil.png");
}

.option_edit_black {
	background-image: url("../../images/icons/icon_editpencil_black.png");
}

#option_edit {
	background-image: url("../../images/icons/icon_mainmenudesign.png");
    background-repeat: no-repeat;
    background-position: center center;	
}

.option_zoomin_white {
	background-image: url("../../images/icons/icon_zoomin_white.png");
}

.option_zoomin_black {
	background-image: url("../../images/icons/icon_zoomin_black.png");
}

.option_zoomout_white {
	background-image: url("../../images/icons/icon_zoomout_white.png");
}

.option_zoomout_black {
	background-image: url("../../images/icons/icon_zoomout_black.png");
}

.option_rotate_white {
	background-image: url("../../images/icons/icon_rotate_white.png");
}

.option_rotate_black {
	background-image: url("../../images/icons/icon_rotate_black.png");
}

.option_download_white {
	background-image: url("../../images/icons/icon_download_white.png");
}

.option_download_black {
	background-image: url("../../images/icons/icon_download_black.png");
}

.option_support_white {
	background-image: url("../../images/icons/icon_support_white.png");
}

.option_support_black {
	background-image: url("../../images/icons/icon_support.png");
}

.option_info {
	background-image: url("../../images/icons/icon_info.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 90% 90%;
}

.icon_dashboard, .icon_dashboard_filled, .icon_courses, .icon_courses_filled, .icon_courses_white, .icon_learners, .icon_learners_filled, .icon_groups, .icon_groups_filled, .icon_reports, .icon_reports_filled, .icon_reports_white, .icon_setting, .icon_setting_filled, .icon_jump, .icon_jump_filled, .icon_categories, .icon_categories_filled {
    float: left;
    position: relative;
    height: 100%;
    width: 40px;
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 30px 30px;
}

.icon_dashboard {
    background-position: center 14px;
    background-image: url("../../images/icons/icon_dashboard.png");
}

.icon_dashboard_filled {
    background-position: center 14px;
    background-image: url("../../images/icons/icon_dashboard_filled.png");
}

.icon_courses {
    background-image: url("../../images/icons/icon_courses.png");
}

.icon_courses_filled {
    background-image: url("../../images/icons/icon_courses_filled.png");
}

.icon_courses_white {
    background-image: url("../../images/icons/icon_courses_white.png");
}

.icon_learners {
    background-position: center 16px;	
    background-image: url("../../images/icons/icon_learners.png");
}

.icon_learners_filled {
    background-position: center 16px;	
    background-image: url("../../images/icons/icon_learners_filled.png");
}

.icon_groups {
    background-image: url("../../images/icons/icon_groups.png");
}

.icon_groups_filled {
    background-image: url("../../images/icons/icon_groups_filled.png");
}

.icon_reports {
    background-image: url("../../images/icons/icon_reports.png");
}

.icon_reports_filled {
    background-image: url("../../images/icons/icon_reports_filled.png");
}

.icon_reports_white {
    background-image: url("../../images/icons/icon_reports_white.png");
}

.icon_setting {
    background-image: url("../../images/icons/icon_setting.png");
}

.icon_setting_filled {
    background-image: url("../../images/icons/icon_setting_filled.png");
}

.icon_jump {
    background-image: url("../../images/icons/icon_jump.png");
}

.icon_jump_filled {
    background-image: url("../../images/icons/icon_jump_filled.png");
}

.icon_categories {
    background-position: center 15px;
    background-image: url("../../images/icons/icon_categories.png");
}

.icon_categories_filled {
    background-position: center 15px;
    background-image: url("../../images/icons/icon_categories_filled.png");
}



.icon_account, .icon_account_filled, .icon_customise, .icon_customise_filled, .icon_customise_white, .icon_support, .icon_support_filled, .icon_logout, .icon_info, .icon_info_white, .icon_play, .icon_play_white, .icon_delete, .icon_delete_white, .icon_copy, .icon_copy_white, .icon_document, .icon_document_white, .icon_print, .icon_print_white, .icon_leaderboard, .icon_email_white, .icon_email, .icon_edit, .icon_edit_white, .icon_basket, .icon_basket_white {
    float: left;
    position: relative;
    height: 100%;
    width: 40px;
    background-repeat: no-repeat;
    background-position: center 12px;	
	background-size: 25px 25px;
}

.icon_print {
    background-position: center center;
    background-image: url("../../images/icons/icon_print.png");
}

.icon_print_white {
    background-position: center center;
    background-image: url("../../images/icons/icon_print_white.png");
}

.icon_play {
    background-position: center center;
    background-image: url("../../images/icons/icon_play.png");
}

.icon_play_white {
    background-position: center center;
    background-image: url("../../images/icons/icon_play_white.png");
}

.icon_email {
    background-position: center center;
    background-image: url("../../images/icons/icon_email.png");
}

.icon_email_white {
    background-position: center center;
    background-image: url("../../images/icons/icon_email_white.png");
}

.icon_edit {
    background-position: center center;
    background-image: url("../../images/icons/icon_edit.png");
}

.icon_edit_white {
    background-position: center center;
    background-image: url("../../images/icons/icon_edit_white.png");
}

.icon_basket {
    background-position: center center;
    background-image: url("../../images/icons/icon_basket.png");
}

.icon_basket_white {
    background-position: center center;
    background-image: url("../../images/icons/icon_basket_white.png");
}

.icon_document {
    background-position: center center;
    background-image: url("../../images/icons/icon_document.png");
}

.icon_document_white {
    background-position: center center;
    background-image: url("../../images/icons/icon_document_white.png");
}

.icon_account {
    background-image: url("../../images/icons/icon_account.png");
}

.icon_account_filled {
    background-image: url("../../images/icons/icon_account_filled.png");
}

.icon_leaderboard {
    background-image: url("../../images/icons/icon_leaderboard.png");
}

.icon_customise {
    background-image: url("../../images/icons/icon_customise.png");
}

.icon_customise_filled {
    background-image: url("../../images/icons/icon_customise_filled.png");
}

.icon_customise_white {
    background-image: url("../../images/icons/icon_customise_white.png");
}

.icon_support {
    background-image: url("../../images/icons/icon_support.png");
}

.icon_support_filled {
    background-image: url("../../images/icons/icon_support_filled.png");
}

.icon_logout {
    background-image: url("../../images/icons/icon_logout.png");
}

.icon_info {
   background-position: center center;
   background-image: url("../../images/icons/icon_info.png"); 
}

.icon_info_white {
   background-position: center center;
   background-image: url("../../images/icons/icon_info_white.png"); 
}

.icon_delete {
   background-position: center center;
   background-image: url("../../images/icons/icon_delete.png"); 
}

.icon_delete_white {
   background-position: center center;
   background-image: url("../../images/icons/icon_delete_white.png"); 
}

.icon_copy {
   background-position: center center;
   background-image: url("../../images/icons/icon_copy.png"); 
}

.icon_copy_white {
   background-position: center center;
   background-image: url("../../images/icons/icon_copy_white.png"); 
}

.icon_disabled {
    opacity: 0.1;
}

.dropzone_container {
	position: relative;
    overflow-y: auto; 
	overflow-x: hidden;
	width: 100%;
	height: 180px;
	text-align:center;
	border-radius: 8px;
	padding:10px;
    border: 1px dashed;
    border-color: #CDCDCD;
    background-color: #FFFFFF;
    -webkit-overflow-scrolling: touch;
}

.dropzone_container_accepted {	
	border-color:#009900;	
}

.dropzone_container_rejected {	
	border-color:#BA1212;	
}

.dropzone_fakeButton {	
	background-color:#337ab7;
    color: #FFFFFF;
	padding: 7px;
	width: 210px;
	border-radius: 10px;
	cursor: pointer;
	margin: auto;
    font-size: 10pt;
    margin-top: 15px;
    margin-bottom: 15px;
}

.dropzone_fakeButton:hover {		
	background-color:#286090;
}

.audio_controls {
    width: 100%;
}

.react_quill_edit {
    position: relative;
    width: 100%;
    height: 300px;
}

.div_center {
	margin: auto;
}

.courseImage_large {
	width: 100%;
	height: 350px;
	border: solid 1px;
	border-color:#DEDEDE;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: cover;
	position: relative;
	border-radius: 10px;
}

.profileImage_large {
	width: 100px;
	height: 100px;
    border: solid 1px;
	border-color:#DEDEDE;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size:contain;
    background-color: #fff;
	position: relative;
	border-radius: 50px;
    margin-bottom: 10px;
}

.profileImage_small {
	width: 40px;
	height: 40px;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size:contain;
	position: relative;
	border-radius: 20px;
	float: left;
	margin-top: -10px;
	margin-left: 8px;
}

.profileImage_table {
	width: 36px;
	height: 36px;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size:contain;
    background-color: #fff;
	position: relative;
	border-radius: 18px;
	float: left;
}

.logoImage_container {
	width: 100%;
	border: 1px solid;
    position: relative;
}

.logoImage_container, .logoImage_container_dark {
	width: 100%;
	height: 150px;
    background-color: #fff;
	position: relative;
    border: 1px solid #e9e9e9;
    padding: 5px;
    border-radius: 5px;
}

.logoImage_container_dark {
    background-color: #333;
}

.logoImage_large {
	width: 100%;
	height: 100%;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: contain;
}

.logoImage_button {
    position: relative;
    margin: 0 auto;
    width: 100%;
}

.logo_large {
	width: 100px;
	height: 100px;
	border: solid 5px;
	border-color:#CCC;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size:contain;
	position: relative;
}

.float_left {
	float: left;	
}

.tableButtonContainer {
	position: relative;
	display: inline-block;
	padding-bottom: 20px;
	padding-top: 10px;
	width: 100%;
}

.tableButtonContainer_basic {
	position: relative;
	display: inline-block;
	padding-top: 10px;
	width: 100%;
}

.borderMe {
	border: 1px solid;	
}

.optionTitle {
  font-weight: bold;	
}

.popupDropbox_center {
	display: table;
	width:50%;
	magin-left: auto;
	margin-right: auto;
}

.centerHalf {
	display: table;
 	margin: 0 auto;
	width:50%;
	text-align:center;
	border: 1px solid;
 	border-radius: 4px;
	padding: 8px;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
	box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
	border-color: #ddd
}

@media screen and (max-width: 767px) {
	.centerHalf {
		width:80%;	
	}
}

.element_center {
	display: table;
	width:50%;
	margin: 0 auto;
}

.element_centerFull {
	display: table;
	width: 80%;
	margin: 0 auto;
}

.description_small {
    font-size: 9pt;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #999;
    position: relative;
}

.infographic_numberstats_container, .infographic_numberstats_container_small {
    position: relative;
    height: 90px;
    width: 100%;
    margin-bottom: 12px;
}

.infographic_numberstats_container_small {
    height: 80px;
}

.infographic_numberstats_circle, .infographic_numberstats_circle_small {
    position: relative;
    height: 90px;
    min-width: 90px;
    background-color: rgba(255, 255, 255, 1);
    margin: 0 auto;
    border: 5px solid;
    border-color: #BA1212;
    border-radius: 45px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, .15);
    text-align: center;
}

.infographic_numberstats_circle_small {
    height: 80px;
}

.infographic_numberstats_value, .infographic_numberstats_value_small {
    text-align: center;
    font-size: 26pt;
    font-weight: 500;
}

.infographic_numberstats_value_small {
    font-size: 22pt;
}

.infographic_numberstats_title {
    text-align: center;
    font-size: 11pt;
    color: #7D7D7D;
}


.infographic_timeperiod_container {
    position: relative;
    width: 100%;
    height: 100%;
}

.infographic_linechart_container {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #fff;
}

.animation_container_linechart {
    width: 800px;
    height: 470px;
    position: relative;
    background-color: rgba(255, 255, 255, 1.00);
    margin: 0 auto;
}

.progressBar {
	height: 15px !important;	
}

.preview_container {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1055;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
	outline: 0;
	background-color: rgba(0, 0, 0, 0.3);
	width: 100%;
	height: 100%;
}

.preview_iframe {
  width: 100%;
  height: 100%;
  border: 0px !important;
  padding: 0px !important;
  margin: 0px !important;
}

.preview_documentContainer {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1055;
	overflow: hidden;
	outline: 0;
	background-color: rgba(83, 86, 89, 1);
	width: 100%;
	height: 100%;
}

#preview_document {
    position:relative;
 	margin: 0 auto;
    height: calc(100vh - 140px);
    overflow: auto;
	-webkit-overflow-scrolling: touch;
	text-align:center;
}

.preview_documentBG {
    position:relative;
 	margin: 0 auto;
	width:100%;
    height: 100%;
    border: 1px solid;
    border-color: #ba1212;
}

.preview_documentPage {
    position:relative;
    padding: 10px;
    margin: 0 auto;
}

.preview_page {
    
}

.preview_toolbar {
    position:fixed;
 	top: 0px;
    left: 0px;
	width:100%;
    height: 40px;
    background-color: rgba(50, 54, 56, 1);
    box-shadow: 0 4px 4px rgba(0, 0, 0, .05);
}

.preview_toolbarButtons_right {
    position:relative;
 	width: 40px;
    height: 40px;
    float: right;
    padding: 5px;
    padding-left: 0px;
}

.preview_toolbar_right {
    position:relative;
 	width: 40%;
    height: 40px;
    float: right;
    color: #fff;
}

.preview_toolbar_left {
    position:relative;
 	width: 40%;
    height: 40px;
    float: left;
    padding: 8px;
    padding-left: 10px;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
}

.preview_toolbar_center {
    position:relative;
 	width: 20%;
    height: 40px;
    float: left;
    padding: 8px;
    padding-left: 10px;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
}

.editor_iframe {
  position: relative;
  width: 100%;
  height: calc(100%-58);
  border: none;
}

.lmsplayer_contentcontainer {
	position: relative;	
	width:100%;
    padding: 20px;
}

.lmsplayer_contentcontainer .lmsplayer_menu {
    padding-top: 20px;
}

.lmsplayer_header, .navigation_header {
    position: relative;
    width: 100%;
    height: 50px;
}

.navigation_headerbuttonnotification, .navigation_headerbuttonbasket {
    position:relative;
 	width: 50px;
    height: 40px;
    margin-right: 10px;
    margin-top: 5px;
    float: right;
    border-right: 1px solid;
}

.navigation_headerbuttonbasket {
    padding-left: 10px;
    margin-left: 10px;
    margin-right: 0px;
    border-left: 1px solid;
    border-right: none;
}

.navigation_headeraccount {
    background-color: rgba(255,255,255,0);
    color: #ffffff;
    height: 50px;
    width: auto;
    float: right;
    padding-top: 7px;
    padding-bottom: 7px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.navigation_headeraccount:hover {
    background-color: rgba(255,255,255,0.12);
}

.navigation_headeraccountprofile {
	width: 35px;
	height: 35px;
	background-image: url("../../images/icon_user.png");
    background-repeat: no-repeat;
    background-position: center center;
	background-size:contain;
    background-color: #F4F4F4;
	position: relative;
	border-radius: 18px;
	float: left;
    margin-left: 7px;
    margin-right: 7px;
    pointer-events: none;
}

.navigation_headeraccountcontainer {
    width: 115px;
    position: relative;
    float: left;
    margin-top: -2px;
    pointer-events: none;
    user-select: none;
}

.navigation_headeraccounttitle {
    padding-top: 0px;
    max-width: 115px;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    font-size: 12pt;
    pointer-events: none;
    user-select: none;
}

.navigation_headeraccountpoints {
    padding-top: 0px;
    max-width: 115px;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    font-size: 10pt;
    pointer-events: none;
    user-select: none;
    margin-top: -2px;
}

.navigation_headeraccountexpand {
    float: right;
    position: relative;
    height: 100%;
    width: 30px;
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 16px 16px;
    pointer-events: none;
}

.navigation_headeraccountpopup, .navigation_headernotificationspopup {
    position: absolute;
    width: 230px;
    z-index: 100;
    top: 40px;
    left: calc(100% - 240px);
    opacity: 0;
    transition: opacity 0.3s;
}

.navigation_headernotificationspopup {
    width: 500px;
    left: calc(100% - 510px);
}

.navigation_headeraccountpopup_noTrans, .navigation_headernotificationspopup_noTrans {
    position: absolute;
    width: 230px;
    z-index: 100;
    top: 40px;
    left: calc(100% - 240px);
    opacity: 1;
}

.navigation_headernotificationspopup_noTrans {
    width: 500px;
    left: calc(100% - 510px);
}

.navigation_headeraccountpopup_show {
    opacity: 1;
}

.navigation_headeraccountpopup_hide {
    opacity: 0;
}

.navigation_headeraccountpopup_top, .navigation_headernotificationspopup_top {
    background-image: url("../../images/navigation_popuptop.png");
    background-repeat: no-repeat;
    background-position: 50px 0px;	
	background-size: 21px 17px;
    position: relative;
    height: 16px;
    width: 100%;
    z-index: 2;
    pointer-events: none;
}

.navigation_headernotificationspopup_top {
    background-position: calc(100% - 291px) 0px;	
}

.navigation_headeraccountpopup_bg, .navigation_headernotificationspopup_bg {
    position: relative;
    width: 100%;
    height: auto;
    border-radius: 10px;
    background-color: rgba(255,255,255,1);
    -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    z-index: 1;
    padding-top: 10px;
    padding-bottom: 10px;
}

.navigation_headernotificationspopup_bg {
    height: 300px;
    margin-top: 16px;
}

.navigation_title {
    position: relative;
    width: 100%;
    font-size: 17pt;
    font-weight: 500;
    padding-left: 15px;
    padding-top: 8px;
}

.navigation_button {
    transition: background-color 0.3s;
    height: 40px;
    cursor: pointer;
    padding: 10px 10px 10px 10px;
    border: none;
    background-color: rgba(0,0,0,0);
}

.navigation_button:hover {
    background-color: rgba(0,0,0,0.1);
}

.lmsplayer_headerright {
    position:relative;
 	width: 50%;
    height: 50px;
    float: right;
    color: #fff;
    padding-right: 10px;
}

.lmsplayer_headerrightlong, .navigation_headerrightlong {
    position:relative;
    width: calc(100% - 60px);
    height: 50px;
    float: right;
    color: #fff;
    padding-right: 10px;
}

.lmsplayer_headerleft, .lmsplayer_headerleftshort, .navigation_headerleft , .navigation_headerleftshort {
    position:relative;
 	width: 50%;
    height: 50px;
    float: left;
    color: #fff;
    padding-left: 10px;
}

.lmsplayer_headerleftshort, .navigation_headerleftshort {
    width: 60px;
}

.lmsplayer_headerbutton, .navigation_headerbutton {
    position:relative;
 	width: 40px;
    height: 40px;
    margin-top: 5px;
}

.lmsplayer_headerright .lmsplayer_headerbutton, .lmsplayer_headerrightlong .lmsplayer_headerbutton {
    float: right;
}

.lmsplayer_headerright .playerclose, .lmsplayer_headerrightlong .playerclose {
    float: right;
    margin-top: 10px;
    margin-left: 20px;
}

.lmsplayer_headerleft .lmsplayer_headerbutton {
    float: left;
    margin-right: 10px;
}

.lmsplayer_headerleft .floatleft {
    float: left;
}

.lmsplayer_title {
    position:relative;
    display: inline-block;
    margin-top: 10px;
    font-size: 14pt;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100% - 60px);
    margin-left: 10px;
}

.lmsplayer_elementtitle {
    position:relative;
    margin-top: 13px;
    font-size: 12pt;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100% - 160px);
    margin-left: 10px;
    margin-right: 10px;
    float: right;
}

.lmsplayer_menuimage {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    min-height: 200px;
}

.lmsplayer_courseimage {
	width: 100%;
	min-height: 200px;
	border-color:#DEDEDE;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: cover;
	position: relative;
	border-radius: 10px;
}

.lmsplayer_section {
    position: relative;
    width: 100%;
}

.lmsplayer_section_collapse {
    width: 100%;
    transition: max-height 0.4s;
    max-height: 0px;
    overflow: hidden;
}

.lmsplayer_progressbg {
    width: 100%;
    background-color: #F4F4F4;
    height: 4px;
}

.lmsplayer_progressfill {
    width: 1%;
    background-color: #02C129;
    height: 4px;
    transition: width 1s;
    margin-top: -4px;
}

.lmsplayer_progresstext {
    color: #AAAAAA;
    text-align: right;
    font-size: 10pt;
    margin-top: 5px;
}

.lmsplayer_progressreporttext {
    color: #787878;
    text-align: right;
    font-size: 10pt;
    margin-top: 5px;
}

.lmsplayer_reportprogress_container {
    margin-left: 20%;
    margin-right: 20%;
    margin-bottom: 20px;
    margin-top: -10px;
}

.lmsplayer_reportprogressbg {
    width: 100%;
    background-color: #F4F4F4;
    height: 8px;
    border-radius: 4px;
}

.lmsplayer_reportprogressfill {
    width: 1%;
    background-color: #02C129;
    height: 8px;
    transition: width 1s;
    margin-top: -8px;
    border-radius: 4px 0px 0px 4px;
}

.lmsplayer_reportdropdown_bg {
    position: relative;
    text-align: left;
    border: 1px solid;
    background-color: #fff;
    border-color: rgba(0,0,0,0.2);
    border-radius: 5px;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-right: 6px;
    padding-left: 6px;
    margin-left: 6px;
    margin-right: 6px;
    user-select: none;
    cursor: pointer;
    transition: background-color 0.3s;
}

.lmsplayer_reportdropdown_bg:hover {
    border-color: rgba(0,0,0,0.3);
    background-color: #E7E7E7;
}

.lmsplayer_reportdropdownlist_bg {
    position: fixed;
    width: 300px;
    max-height: 200px;
    text-align: left;
    border: 1px solid;
    background-color: #F3F3F3;
    border-color: rgba(0,0,0,0.2);
    border-radius: 5px;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    z-index: 2057;
    user-select: none;
    overflow: scroll;
}

.lmsplayer_reportdropdownlist_text {
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
}

.lmsplayer_reportdropdownlist_progressbg {
    width: 100%;
    background-color: #E1E1E1;
    height: 16px;
    font-size: 9pt;
    position: relative;
    overflow: hidden;
}

.lmsplayer_reportdropdownlist_progressfill {
    width: 0%;
    background-color: #217BB8;
    height: 16px;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: hidden;
}

.lmsplayer_reportdropdownlist_progresstext1 {
    width: 300px;
    text-align: center;
    position: absolute;
    top: -9px;
    color: #787878;
}

.lmsplayer_reportdropdownlist_progresstext2 {
    width: 300px;
    text-align: center;
    position: absolute;
    color: #fff;
    top: -9px;
}

.lmsplayer_questionprogressbg {
    background-color: #F4F4F4;
    border: 1px solid;
    border-top: none;
    border-color: rgba(0,0,0,0.1);
    border-radius: 0px 0px 5px 5px;
    height: 8px;
    width: 100%;
    overflow: hidden;
}

.lmsplayer_questionprogressfill {
    width: 1%;
    background-color: #217BB8;
    height: 8px;
    transition: width 1s;
    border-radius: 0px 0px 0px 5px;
}

.lmsplayer_reportlikert_progressbg {
    width: 100%;
    background-color: #CCCCCC;
    height: 16px;
    font-size: 9pt;
    position: relative;
    overflow: hidden;
}

.lmsplayer_reportlikert_progresstext1 {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 0px;
    color: #fff;
}

.lmsplayer_reportlikert_progresstext2 {
    width: 100%;
    text-align: center;
    position: absolute;
    color: #fff;
    top: -9px;
}

.lmsplayer_resumetext {
    color: #AAAAAA;
    text-align: center;
    font-size: 10pt;
}

.lmsplayer_elementsection {
    background-color: #E6E6E6;
    color: #383838;
    height: 60px;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.lmsplayer_elementsectiontitle {
    flex: 1 0;
    padding: 10px;
    padding-left: 2px;
    padding-top: 19px;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    font-size: 12pt;
    user-select: none;
}

.lmsplayer_element_expandbutton {
    position: relative;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background-color: #E6E6E6;
    transition: background-color 0.4s;
    border: 0px;
}

.lmsplayer_element_expandbutton:hover {
    background-color: #D9D9D9;
}

.lmsplayer_element_expandbutton:active {
    background-color: #CACACA;
}

.lmsplayer_element_expand {
    position: relative;
    flex: 0 0 50px;
    height: 60px;
}

.lmsplayer_element_expandbutton {
    
    padding: 0px;
}

.lmsplayer_textimage_image {  
    position: relative;
    width: 80%;
    height: auto;
}

.lmsplayer_elementbutton,
.lmsplayer_elementbuttonactive,
.lmsplayer_elementbuttonselected, .navigation_sidemenubutton,
.navigation_sidemenubuttonactive, .navigation_sidemenubuttonselected {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    background-color: #ffffff;
    color: #4C4C4C;
    height: 60px;
    width: 100%;
    position: relative;
}

.lmsplayer_elementbuttonselected, .navigation_sidemenubuttonselected {
    background-color: #EDEDED !important;
    color: #000;
}

.lmsplayer_elementbutton_insection {
    margin-left: 30px;
    width: calc(100% - 30px);
}

.navigation_sidemenubuttonselected {
    cursor: pointer;
}

.lmsplayer_elementbutton, .navigation_sidemenubutton {
    color: #D6D6D6;
}

.lmsplayer_elementbuttonactive, .navigation_sidemenubuttonactive {
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
}

.lmsplayer_elementbuttonactive:hover, .navigation_sidemenubuttonactive:hover{
    background-color: #F4F4F4;
    color: #000;
}

@keyframes lmsplayerbuttonanimation {from {background-color: #ffffff; color:#787878;}to {background-color: #F4F4F4; color:#000;}}

.lmsplayer_elementbuttonbottom, .navigation_sidemenubuttonbottom {
    position: relative;
    height: 5px;
    background-color: #F4F4F4;
}

.lmsplayer_elementbuttonbottomhover, .navigation_sidemenubuttonbottomhover {
    animation-name: lmsplayerbuttonbottomanimation;
    animation-duration: 0.3s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

@keyframes lmsplayerbuttonbottomanimation {from {background-color: #F4F4F4;}to {background-color: #FFF;}}

.lmsplayer_elementbuttontitle, .lmsplayer_elementbuttontitlelong, .navigation_sidemenubuttontitlelong {
    flex: 1 0;
    padding: 10px;
    padding-left: 2px;
    padding-top: 20px;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    user-select: none;
}

.lmsplayer_elementbuttontitlelong, .navigation_sidemenubuttontitlelong {
    max-width: calc(100% - 65px);
}

.navigation_sidemenubuttontitlelong {
    padding-left: 5px;
}

.lmsplayer_elementbuttontab, .lmsplayer_elementbuttontabselected, .navigation_sidemenubuttontab, .navigation_sidemenubuttontabselected {
    flex: 0 0 8px;
    height: 60px;
    background-color: #6A6A6A;
    position: relative;
    opacity: 0;
}

.lmsplayer_elementbuttontabselected, .navigation_sidemenubuttontabselected {
    opacity: 1 !important;
}

.navigation_sidemenubuttontab, .navigation_sidemenubuttontabselected {
   margin-right: 4px; 
}

.navigation_tabContainer {
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.navigation_tabContainer_dark {
  border-bottom: 1px solid #999;
}

.navigation_tabContainer_light {
  border-bottom: 1px solid #fff;
}

.navigation_tab, .navigation_tabActive {
    height: 40px;
    width: auto;
    flex: 0 0;
    background-color: transparent;
    border-radius: 5px 5px 0px 0px;
    margin-top: 5px;
}

.navigation_tabActive {
    cursor: pointer;
    transition: background-color 0.3s;
}

.navigation_tabTitle, .navigation_tabTitleDisabled {
    text-align: center;
    user-select: none;
    padding-top: 7px;
    padding-left: 15px;
    padding-right: 15px;
    height: 35px;
    font-size: 12pt;
    overflow: hidden;
    white-space: nowrap;
}

.navigation_tabTitleDisabled {
    opacity: 0.3;
    cursor: default;
}

.navigation_tabColorBar, .navigation_tabColorBarSelected {
    height: 5px;
    width: auto;
    background-color: #6A6A6A;
    position: relative;
    opacity: 0;
}

.navigation_tabColorBarSelected {
    opacity: 1 !important;
}

.lmsplayer_elementbuttoninfo {
    flex: 0 0 35px;
    margin-top: 15px;
    z-index: 10;
}

.lmsplayer_elementsectioninfo {
    flex: 0 0 35px;
    margin-top: 15px;
    z-index: 10;
}

.lmsplayer_elementinfo {
    position: relative;
    width: 30px;
    height 30px;
    border-radius: 15px;
    background-color: rgba(255,255,255,0);
    cursor: pointer;
    transition: background-color 0.4s;
}

.lmsplayer_elementinfo:hover {
    background-color: #fff;
}

.lmsplayer_element_type, .lmsplayer_element_type_disabled, .lmsplayer_element_type_section {
    flex: 0 0 50px;
    padding-top: 18px;
    padding-left: 10px;
    user-select: none;
    pointer-events: none;
}

.lmsplayer_element_type_disabled {
    opacity: 0.2;
}

.lmsplayer_element_type_section {
    flex: 0 0 58px;
    padding-left: 18px;
}

.lmsplayer_elementprogress {
    position: relative;
    padding-left: 10px;
    width: 50px;
    height 30px;
}

.lmsplayer_elementbuttonprogress {
    flex: 0 0 50px;
    margin-top: 15px;
}

.lmsplayer_elementprogressbg {
    width: 30px;
    height: 30px;
    position: relative;
    background-image: url("../../images/icons/icon_progress_0.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
}

.lmsplayer_elementprogressfill {
    width: 30px;
    height: 30px;
    position: relative;
    background-image: url("../../images/icons/icon_progress_100.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
    opacity: 0;
    margin-top: -30px;
}

.lmsplayer_elementprogressanimate0, .lmsplayer_elementprogressanimate1, .lmsplayer_elementprogressanimate2, .lmsplayer_elementprogressanimate3, .lmsplayer_elementprogressanimate4, .lmsplayer_elementprogressanimate5, .lmsplayer_elementprogressanimate6, .lmsplayer_elementprogressanimate7, .lmsplayer_elementprogressanimate8, .lmsplayer_elementprogressanimate9, .lmsplayer_elementprogressanimate10 {
    animation-name: fadeMeInFull;
    animation-duration: 0.8s;
    animation-delay: 0s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.lmsplayer_elementprogressanimate1 {animation-delay: 0.2s;}
.lmsplayer_elementprogressanimate2 {animation-delay: 0.4s;}
.lmsplayer_elementprogressanimate3 {animation-delay: 0.6s;}
.lmsplayer_elementprogressanimate4 {animation-delay: 0.8s;}
.lmsplayer_elementprogressanimate5 {animation-delay: 1s;}
.lmsplayer_elementprogressanimate6 {animation-delay: 1.2s;}
.lmsplayer_elementprogressanimate7 {animation-delay: 1.4s;}
.lmsplayer_elementprogressanimate8 {animation-delay: 1.6s;}
.lmsplayer_elementprogressanimate9 {animation-delay: 1.8s;}
.lmsplayer_elementprogressanimate10 {animation-delay: 2s;}

.lmsplayer_container, .navigation_container, .lmsplayer_previewcontainer {
    width: 100%;
    display: flex;
    flex-direction: row;
    overflow: none;
    max-height: 100vh;
}

.lmsplayer_previewcontainer {
    max-height: calc( 100vh - 150px );
}

.lmsplayer_sidemenu, .navigation_sidemenu, .navigation_sidemenu_startoff, .lmsplayer_sidemenu_startoff {  
    position: relative;
    overflow-x: hidden;
    flex-basis: 300px;
    flex-grow: 0;
    flex-shrink: 0;
    height: 100vh;
    background-color: #fff;
}

.navigation_sidemenu {  
    flex-basis: 230px;
}

.navigation_sidemenu_startoff, .lmsplayer_sidemenu_startoff {  
    flex-basis: 0px;
}

.lmsplayer_showmenu, .navigation_showmenu { 
    animation-name: lmsplayershowmenu;
    animation-duration: 0.3s;
    animation-delay: 0s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.navigation_showmenu { 
    animation-name: navigationshowmenu;
}

.lmsplayer_hidemenu, .navigation_hidemenu { 
    animation-name: lmsplayerremovemenu;
    animation-duration: 0.3s;
    animation-delay: 0s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.navigation_hidemenu { 
    animation-name: navigationremovemenu;
}

@keyframes lmsplayerremovemenu {from {flex-basis: 300px;}to {flex-basis: 0px;}}
@keyframes lmsplayershowmenu {from {flex-basis: 0px;}to {flex-basis: 300px;}}
@keyframes navigationremovemenu {from {flex-basis: 230px;}to {flex-basis: 0px;}}
@keyframes navigationshowmenu {from {flex-basis: 0px;}to {flex-basis: 230px;}}

.lmsplayer_sidemenucontents {  
    width: 300px;
}

.navigation_sidemenucontents {  
    width: 230px;
}

.lmsplayer_sidemenutop, .navigation_sidemenutop {  
    position: relative;
    width: 100%; 
    height: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.lmsplayer_sidemenutitle, .navigation_sidemenutitle {  
    position: relative;
    height: auto;
    min-height: 50px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 45px;
    font-size: 14pt;
    flex: 1 1;
}

.navigation_sidemenutitlelogo {  
    position: relative;
    padding-top: 8px;
    padding-left: 13px;
    padding-right: 13px;
    font-size: 14pt;
    flex: 1 1;
}

.navigation_logo { 
    position: relative;   
    height: auto;
    max-width: 100%;
}

.navigation_sidemenutitleline {
    border-top: 1px solid #E7E7E7;
    height: 1px;
    position: relative;
    flex: 1;
    margin-left: 15px;
    margin-right: 15px;
}

.lmsplayer_sidemenuprogress {
    position: relative;
    flex: 0 0 40px;
}

.lmsplayer_sidemenuclose {  
    flex: 0 0 50px;
    padding-top: 5px;
}

.navigation_sidemenuclose { 
    position: relative;
    flex: 0 0 30px;
    padding-top: 15px;
}

.lmsplayer_maincontentcontainer, .navigation_maincontentcontainer {
    position: relative;
    flex-basis: 100%;
    flex-grow: 1 1;
    -webkit-box-shadow: -3px 0px 8px rgba(0,0,0,0.2);
    box-shadow: -3px 0px 8px rgba(0,0,0,0.2);
    height: 100vh;
    overflow: hidden;
}

.navigation_maincontentcontainer {
    overflow: auto;
}

.navigation_pageTitle_container {
    position: relative;
    width: 100%;
    min-height: 35px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.navigation_pageTitle_button {
    flex: 0 0 45px;
}

.navigation_pageTitle {
    flex: 1 1;
    padding-top: 8px;
    user-select: none;
    position: relative;
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.navigation_pagePreview_button {
    flex: 0 0;
    align-self: flex-end;
}

.navigation_alerts {
    width: 250px;
    right: 0px;
    top: 50px;
    padding: 5px;
    position: absolute;
    z-index: 100;
}

.navigation_alert {
    width: 100%;
    height: 75px;
    background-color: #fff;
    position: relative;
    box-shadow: 0px 2px 4px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.1);
    margin-bottom: 5px;
    left: calc(100% + 5px);
    transition: left 0.3s ease-out, top 0.3s ease-out, background-color 0.3s ease-out, box-shadow 0.3s ease-out, height 0.3s ease-out;
    padding: 5px 10px 5px 10px;
    border-radius: 5px;
    font-size: 10pt;
    cursor: pointer;
}

.navigation_alert:hover {
    background-color: #f3f3f3;
    box-shadow: 0px 2px 4px rgba(0,0,0,0.3);
}

.navigation_alert_text {
    position: relative;
    width: 100%;
    height: 20px;
}

.navigation_alert_icon {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0px;
    top: 3px;
}

.navigation_alert_title {
    width: calc(100% - 20px);
    position: absolute;
    left: 20px;
    padding: 4px 0px 3px 5px;
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
    
    user-select: none;
}

.navigation_alert_close {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0px;
}

.navigation_alert_shorttext {
    position: relative;
    width: 100%;
    height: 17px;
}

.navigation_alert_subject {
    width: 100%;
    padding: 4px 0px 3px 0px;
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
    font-weight: 600;
    user-select: none;
}

.navigation_alert_description {
    width: 100%;
    padding: 4px 0px 3px 0px;
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
    user-select: none;
}

.lmsplayer_maincontent {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100% - 100px);
}

.lmsplayer_maincontent_long {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100% - 50px) !important;
}

.lmsplayer_maincontentbg {
    flex: 1 1 100%;
    width: 100%;
    padding: 10px;
    height: 100%;
    overflow: scroll;
}

.lmsplayer_jumpmotioncontentbg {
    flex: 1 1 100%;
    width: 100%;
    padding: 0px;
    height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
}

.lmsplayer_documentcontentbg {
    flex: 1 1 100%;
    width: 100%;
    padding: 10px;
    height: 100%;
    overflow: hidden;
}

.lmsplayer_scormcontentbg {
    flex: 1 1 100%;
    width: 100%;
    max-height: 100%;
    overflow: hidden;
}

.lmsplayer_bottombutton {
    position: absolute;
    top: 100%;
    width: 100%;
    background-color: #F5F5F5;
    box-shadow: inset 0px 2px 4px rgba(0,0,0,0.1);
    -webkit-box-shadow: inset 0px 2px 4px rgba(0,0,0,0.1);
    padding: 15px;
    height: 50px;
    color: #666666;
    
    transition: background-color 0.5s, color 0.5s;
    cursor: pointer;
    animation-name: lmsplayer_bottombuttonanimation;
    animation-duration: 0.4s;
    animation-delay: 0.5s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

@keyframes lmsplayer_bottombuttonanimation {from {top: calc(100%);}to {top: calc(100% - 50px);}}

.lmsplayer_bottombutton:hover {
    background-color: #E6E6E6;
    color: #000;
}

.lmsplayer_bottombuttontext {
    position: relative;
    width: 100%;
    text-align: center;
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
    pointer-events: none;
}

.lmsplayer_scrollcontainer {
    overflow: auto;
    width: 100%;
    height: 100%;
}

.lmsplayer_maintextimage, .lmsplayer_mainaudio, .lmsplayer_mainvideo, .lmsplayer_mainscorm, .lmsplayer_docdescription, .lmsplayer_scormdescription, .lmsplayer_mainjumpmotion {
    position: relative;
    width: calc(100% - 30px);
    border-radius: 8px;
    background-color: #fff;
    -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    padding: 15px !important;
    height: auto !important;
    box-sizing: content-box !important;
}

.lmsplayer_mainjumpmotion {
    width: 100%;
    padding: 0px !important;
    border-radius: 0px;
}

.lmsplayer_innerjumpmotion {
    opacity: 0;
}

.lmsplayer_scormdescription {
    border-radius: 0px;
    margin-bottom: 15px;
}

.lmsplayer_mainvideo {
    padding: 0px !important;
    width: 100%;
    border-radius: 0px;
}

.lmsplayer_docdescription {
    max-height: 70px !important;
    overflow-y: scroll; 
}

.lmsplayer_inneraudio {
    position: relative;
    width: 60%;
    margin-left: 20%;
    margin-right: 20%;
}

.lmsplayer_innervideo {
    position: relative;
    width: 100%;
}

.lmsplayer_video {
    width: 100%;
}

.lmsplayer_youtubecontainer {
    width: 100%;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
}

.lmsplayer_youtubecontainer iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.lmsplayer_maindocuments {
    position: relative;
    width: 100%;
    height: calc(100% - 150px);
    max-width: 100%;
    border-radius: 0px 0px 8px 8px;
    background-color: rgba(0,0,0,0.1);
    -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    padding: 15px;
    overflow: hidden;
}

.lmsplayer_document_nodescription {
    height: calc(100% - 40px) !important;
}

.lmsplayer_documenttitle {
    position: relative;
    width: 100%;
    height: 40px;
    border-radius: 8px 8px 0px 0px;
    -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
}

#lmsplayer_document {
    position:relative;
 	margin: 0 auto;
    width: 100%;
    height: 100%;
    overflow: auto;
	-webkit-overflow-scrolling: touch;
	text-align:center;
}

.lmsplayer_documentBG {
    position:relative;
 	margin: 0 auto;
	width:100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    margin: 0 auto;
}

.lmsplayer_documentPage {
    position:relative;
    padding: 10px;
    flex: 0 0;
    display: inline-block;
}

.lmsplayer_mainscorm {
    text-align: center;
    padding: 25px;
}

.lmsplayer_embeddedscorm {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    padding: 0px;
}

.lmsplayer_testintroimage {
    height: 150px;
    width: 150px;
    border-radius: 75px;
    box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
}

.lmsplayer_audioimage {
    height: 300px;
    width: 300px;
    border-radius: 150px;
    box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
}

.lmsplayer_testtitle_left, .lmsplayer_testtitle_right {
    position:relative;
 	width: 50%;
    height: 40px;
    float: left;
    padding: 8px;
    padding-left: 10px;
}

.lmsplayer_testtitle_right {
    float: left;
    text-align: right;
    padding-left: 0px;
    padding-right: 10px;
    padding-top: 0px;
}

.lmsplayer_testtitle_rightitem {
    float: right;
    margin-left: 10px;
}

.lmsplayer_testinfotext {
    width: 100%;
    text-align: center;
    font-size: 17pt;
    padding-top: 15px;
    padding-bottom: 20px;
    color: #8C8C8C;
    font-weight: 700;
}

.lmsplayer_testinfodescription {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}

.lmsplayer_testresultsdescription {
    width: 100%;
    margin-top: 20px;
    text-align: center;
}

.lmsplayer_testmain {
    position: relative;
    width: 100%;
    max-width: 100%;
    border-radius: 0px 0px 8px 8px;
    background-color: rgba(255,255,255,1);
    -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    padding: 15px;
    overflow: hidden;
}

.lmsplayer_testmainsubmitted {
    position: relative;
    width: 100%;
    max-width: 100%;
    background-color: rgba(255,255,255,1);
    -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    padding: 15px;
    overflow: hidden;
    margin-bottom: 10px;
}

.lmsplayer_testquestionnumber {
    position: relative;
    float: left;
    color: #797979;
    padding-bottom: 20px;
}

.lmsplayer_testquestion {
    margin-left: 20%;
    margin-right: 20%;
    margin-bottom: 30px;
    padding-bottom: 15px;
    padding-right: 0px !important;
    border-bottom: 1px solid;
    border-color: rgba(0,0,0,0.1);
    height: auto !important;
    box-sizing: content-box !important;
}

.lmsplayer_testoptions {
    margin-left: 20%;
    margin-right: 20%;
    margin-bottom: 20px;
}

.lmsplayer_testoptions_long {
    margin-left: 5%;
    margin-right: 5%;
    margin-bottom: 20px;
}

.lmsplayer_testfeedback, .lmsplayer_testcorrectincorrect {
    margin-left: 20%;
    margin-right: 20%;
    margin-bottom: 20px;
    background-color: #F3F3F3;
    border-radius: 5px;
    padding: 15px;
    text-align: center;
    color: #797979;
}

.lmsplayer_testcorrectincorrect {
    margin-bottom: 5px;
    color: #333333;
}

.lmsplayer_testwascorrect {
    width: 50px;
    height: 50px;
    background-image: url("../../images/icons/icon_test_tick_large.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
    margin: 0 auto;
}

.lmsplayer_testwasincorrect {
    width: 50px;
    height: 50px;
    background-image: url("../../images/icons/icon_test_cross_large.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
    margin: 0 auto;
}

.lmsplayer_testwascorrecttext {
    width: 100%;
    text-align: center;
    padding-top: 5px;
}

.lmsplayer_testsubmittedtext {
    padding-top: 15px;
    color: #B6B6B6;
}

.lmsplayer_testsubmitcontainer {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 100px;
}

.lmsplayer_testsubmititem {
    flex: 0 0;
    margin-bottom: 10px;
}

.lmsplayer_testquestionlist {
    width: 100%;
    height: 300px;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-top: 8px;
    padding-bottom: 8px;
}

.lmsplayer_testquestionlist_container, .lmsplayer_testquestionlist_nextcontainer,
.lmsplayer_testquestionlist_titlecontainer {
    width: 100%;
    height: 35px;
    background-color: rgba(255,255,255,0);
    cursor: pointer;
    color: #7F7F7F;
    padding: 8px;
    padding-top: 7px;
    position: relative;
}

.lmsplayer_testquestionlist_container:hover {
    background-color: rgba(255,255,255,0.7);
    color: #000;
}

.lmsplayer_testquestionlist_nextcontainer {
    background-color: rgba(255,255,255,0.4);
}

.lmsplayer_testquestionlist_nextcontainer:hover {
    background-color: rgba(255,255,255,0.7);
    color: #000;
}

.lmsplayer_testquestionlist_titlecontainer {
    cursor: auto;
}

.lmsplayer_testquestionlist_title, .lmsplayer_testquestionlist_toptitle {
    width: calc(80% - 16px);
    float: left;
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
    pointer-events: none;
}

.lmsplayer_testquestionlist_toptitle {
    color: #000;
    font-weight: 600;
}

.lmsplayer_testquestionlist_status, .lmsplayer_testquestionlist_negativestatus,
.lmsplayer_testquestionlist_titlestatus {
    font-size: 10pt;
    font-weight: 600;
    width: calc(20% - 16px);
    float: left;
    overflow: hidden;
	text-overflow: clip;
	white-space: nowrap;
    color: #38C427;
    text-align: center;
    pointer-events: none;
}

.lmsplayer_testquestionlist_negativestatus {
    color: #E74545;
}

.lmsplayer_testquestionlist_correctstatus, .lmsplayer_testquestionlist_incorrectstatus {
    width: 21px;
    height: 21px;
    float: left;
    background-image: url("../../images/icons/icon_test_tick_green.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
    margin-left: 34px;
    pointer-events: none;
}

.lmsplayer_testquestionlist_incorrectstatus {
    background-image: url("../../images/icons/icon_test_cross_red.png");
}

.lmsplayer_testquestionlist_titlestatus {
    margin-left: 16px;
    color: #000;
}

.lmsplayer_testquestionlist_selected {
    margin: 11px;
    margin-top: 6px;
    margin-left: 0px;
    width: 8px;
    height: 8px;
    float: left;
    border-radius: 4px;
    background-color: rgba(50,50,50,1);
    pointer-events: none;
}

.lmsplayer_testquestionlist_notselected {
    margin: 11px;
    margin-top: 6px;
    margin-left: 0px;
    width: 8px;
    height: 8px;
    float: left;
    border-radius: 4px;
    background-color: rgba(127,127,127,0.1);
}

.lmsplayer_multichoice_optioncontainer, .lmsplayer_multichoice_optioncontainersubmitted, .lmsplayer_multichoice_optioncontainercorrect, .lmsplayer_multichoice_optioncontainerincorrect,
.lmsplayer_ordering_optioncontainer, .lmsplayer_ordering_selectedcontainer, .lmsplayer_multichoice_optioncontainerreport {
    width: 100%;
    height: auto;
    color: #787878;
    margin-bottom: 15px;
    padding: 15px;
    background-color: rgba(255,255,255,1);
    border: 1px solid;
    border-color: rgba(0,0,0,0.2);
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
}

.lmsplayer_ordering_optioncontainer {
    cursor: ns-resize;
    position: relative;
    transition: transform 0.3s ease-out;
    -moz-transition: transform 0.3s ease-out;
    -webkit-transition: transform 0.3s ease-out;
}

.lmsplayer_ordering_selectedcontainer {
    cursor: ns-resize;
    position: relative;
}

.lmsplayer_multichoice_optioncontainersubmitted {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.1);
}

.lmsplayer_multichoice_optioncontainerreport {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.1);
    border-radius: 5px 5px 0px 0px;
}

.lmsplayer_multichoice_optioncontainercorrect {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.2);
    animation-name: lmsplayer_multichoicecorrect;
    animation-duration: 0.4s;
    animation-delay: 0.5s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

@keyframes lmsplayer_multichoicecorrect {from {border-color: rgba(0,0,0,0.2);}to {border-color: rgba(2,193,41,1);}}

.lmsplayer_multichoice_optioncontainerincorrect {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.2);
    animation-name: lmsplayer_multichoiceincorrect;
    animation-duration: 0.4s;
    animation-delay: 0.7s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

@keyframes lmsplayer_multichoiceincorrect {from {border-color: rgba(0,0,0,0.2);}to {border-color: rgba(231,69,69,1);}}

.lmsplayer_multichoice_optioncontainer:hover, .lmsplayer_ordering_optioncontainer:hover, .lmsplayer_ordering_selectedcontainer:hover {
    background-color: #F4F4F4;
    color: #000;
    animation-name: lmsplayerbuttonanimation;
    animation-duration: 0.3s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.lmsplayer_multichoice_optionselected {
    color: #000;
}

.lmsplayer_multichoice_checkbg, .lmsplayer_multichoice_checkcorrect, .lmsplayer_multichoice_checkincorrect, .lmsplayer_multichoice_checkgrey, .lmsplayer_multichoice_checkredcorrect,
.lmsplayer_ordering_movebg {
    width: 30px;
    height: 30px;
    position: relative;
    background-image: url("../../images/icons/icon_progress_0.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
    margin-right: 30px;
    border-radius: 15px;
    background-color: rgba(255,255,255,1);
    pointer-events: none;
    flex: 0 0 30px;
}

.lmsplayer_multichoice_checkcorrect {
    background-image: url("../../images/icons/icon_test_tick_green.png");
}

.lmsplayer_multichoice_checkincorrect {
    background-image: url("../../images/icons/icon_test_cross_red.png");
}

.lmsplayer_multichoice_checkgrey {
    background-image: url("../../images/icons/icon_test_tick_grey.png");
}

.lmsplayer_multichoice_checkredcorrect {
    background-image: url("../../images/icons/icon_test_tick_red.png");
}

.lmsplayer_ordering_movebg {
    background-image: url("../../images/icons/icon_ordering.png");
}

.lmsplayer_multichoice_check {
    width: 18px;
    height: 18px;
    position: absolute;
    border-radius: 9px;
    background-color: #696969;
    pointer-events: none;
    top: 6px;
    left: 6px;
}

.lmsplayer_multichoice_text {
    flex: 1 1;
    align-self: center;
    pointer-events: none;
    user-select: none;
}

.lmsplayer_fillthegap_text {
    text-align: left;
}

.lmsplayer_fillthegap_answeredtext, .lmsplayer_fillthegap_answeredtextstart, .lmsplayer_fillthegap_answeredtext_disabled, .lmsplayer_fillthegap_answeredtextstart_disabled {
    text-align: left;
    border: 1px solid;
    border-color: rgba(0,0,0,0.2);
    border-radius: 5px;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-right: 5px;
    margin-left: 4px;
    margin-right: 4px;
}

.lmsplayer_fillthegap_answeredtextstart, .lmsplayer_fillthegap_answeredtextstart_disabled {
    margin-left: 0px;
}

.lmsplayer_fillthegap_answeredtext_disabled, .lmsplayer_fillthegap_answeredtextstart_disabled {
    padding-left: 5px;
}

.lmsplayer_dropdown_answeredtext, .lmsplayer_dropdown_answeredtextstart {
    text-align: left;
    border: 1px solid;
    border-color: rgba(0,0,0,0.2);
    border-radius: 5px;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-right: 5px;
    padding-left: 5px;
    margin-left: 4px;
    margin-right: 4px;
}

.lmsplayer_dropdown_answeredtextstart {
    margin-left: 0px;
}

.lmsplayer_fillthegap_bracket, .lmsplayer_fillthegap_bracketStart {
    width: 200px;
    margin-left: 4px;
    margin-right: 4px;
    line-height: 100%;
    padding: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    border: 1px solid;
    border-color: rgba(29,29,29,0.3);
}

.lmsplayer_fillthegap_bracketStart {
    margin-left: 0px;
}

.lmsplayer_fillthegap {
    line-height: 230%;
    padding-left: 15px;
    padding-right: 15px;
}

.lmsplayer_fillthegap_answered {
    line-height: 270%;
    padding-left: 15px;
    padding-right: 15px;
}

.lmsplayer_fillthegap_correcttext {
    color: #02C129;
    font-weight: bold;
}

.lmsplayer_fillthegap_incorrecttext {
    color: #E74545;
    font-weight: bold;
}

.lmsplayer_fillthegap_tickcross {
    width: 30px;
    height: 30px;
    margin-left: 4px;
    margin-right: 4px;
    margin-top: -5px;
}

.lmsplayer_dropdown_bracket, .lmsplayer_dropdown_bracketStart {
    width: 200px;
    margin-left: 4px;
    margin-right: 4px;
    line-height: 100%;
    padding: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    border: 1px solid;
    border-color: rgba(29,29,29,0.3);
}

.lmsplayer_ordering_correcttext {
    color: #02C129 !important;
}

.lmsplayer_ordering_incorrecttext {
    color: #E74545 !important;
}

.lmsplayer_dragdrop_text {
    flex: 1 1 calc(100% - 140px);
    align-self: center;
    pointer-events: none;
    user-select: none;
}

.lmsplayer_dragdrop {
    width: 100%;
    position: relative;
    margin-bottom: 30px;
    display: table;
}

.lmsplayer_dragdrop_column {
    width: 50%;
    display: table-cell;
}

.lmsplayer_dragdrop_optionleft, .lmsplayer_dragdrop_optionright, .lmsplayer_dragdrop_selectedleft, .lmsplayer_dragdrop_selectedright, .lmsplayer_dragdrop_optionleftsubmitted, .lmsplayer_dragdrop_optionrightsubmitted,
.lmsplayer_dragdrop_optionleftcorrect, .lmsplayer_dragdrop_optionleftincorrect, .lmsplayer_dragdrop_optionrightcorrect,
.lmsplayer_dragdrop_optionrightincorrect {
    position: relative;
    width: 100%;
    height: auto;
    color: #787878;
    margin-bottom: 15px;
    padding: 15px;
    padding-right: 0px;
    background-color: rgba(255,255,255,1);
    border: 1px solid;
    border-color: rgba(0,0,0,0.2);
    border-radius: 5px 0px 0px 5px;
    display: flex;
    flex-direction: row;
    align-items: top;
    cursor: ns-resize;
}

.lmsplayer_dragdrop_optionleftcorrect, .lmsplayer_dragdrop_optionrightcorrect {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.2);
    animation-name: lmsplayer_multichoicecorrect;
    animation-duration: 0.4s;
    animation-delay: 0.5s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    align-items: center;
}

.lmsplayer_dragdrop_optionleftincorrect, .lmsplayer_dragdrop_optionrightincorrect {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.2);
    animation-name: lmsplayer_multichoiceincorrect;
    animation-duration: 0.4s;
    animation-delay: 0.7s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    align-items: center;
}

.lmsplayer_dragdrop_optionleftsubmitted {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.1);
    padding-left: 15px;
}

.lmsplayer_dragdrop_optionrightsubmitted {
    color: #B6B6B6;
    cursor: auto;
    border-color: rgba(0,0,0,0.1);
    border-radius: 0px 5px 5px 0px;
    padding-left: 15px;
}

.lmsplayer_dragdrop_optionright, .lmsplayer_dragdrop_selectedright {
    border-radius: 0px 5px 5px 0px;
    padding-left: 0px;
}

.lmsplayer_dragdrop_optionrightcorrect, .lmsplayer_dragdrop_optionrightincorrect {
    border-radius: 0px 5px 5px 0px;
    padding: 15px;
}

.lmsplayer_dragdrop_optionleftcorrect, .lmsplayer_dragdrop_optionleftincorrect {
    padding: 15px;
}

.lmsplayer_dragdrop_transition {
    transition: transform 0.3s ease-out;
    -moz-transition: transform 0.3s ease-out;
    -webkit-transition: transform 0.3s ease-out;
}

.lmsplayer_dragdrop_optionleft:hover, .lmsplayer_dragdrop_optionright:hover, .lmsplayer_dragdrop_selectedleft:hover, .lmsplayer_dragdrop_selectedright:hover {
    background-color: #F4F4F4;
    color: #000;
    animation-name: lmsplayerbuttonanimation;
    animation-duration: 0.3s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.lmsplayer_dragdrop_plugleft, .lmsplayer_dragdrop_plugright_connected, .lmsplayer_dragdrop_plugright_disconnected {
    width: 40px;
    height: 30px;
    position: relative;
    background-image: url("../../images/icons/icon_dragdrop1.png");
    background-repeat: no-repeat;
    background-position: right top;	
	background-size: auto 100%;
    margin-left: 30px;
    pointer-events: none;
    flex: 0 0 40px;
}

.lmsplayer_dragdrop_plugright_connected {
    margin-right: 30px;
    margin-left: 0px;
    background-image: url("../../images/icons/icon_dragdrop3.png");
    background-position: left top;	
}

.lmsplayer_dragdrop_plugright_disconnected {
    margin-right: 30px;
    margin-left: 0px;
    background-image: url("../../images/icons/icon_dragdrop2.png");
    background-position: left top;	
}

.lmsplayer_surveyfree, .lmsplayer_surveyfree_submitted, .lmsplayer_surveyfree_allcomments {
    width: 100%;
    padding: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    border: 1px solid;
    border-color: rgba(29,29,29,0.3);
}

.lmsplayer_surveyfree_submitted {
    border: none;
}

.lmsplayer_surveyfree_allcomments {
    overflow: auto;
    max-height: 300px;
}

.lmsplayer_surveyfree_commenttop {
    padding-top: 10px;
}

.lmsplayer_surveyfree_comment {
    border-top: 1px solid;
    border-color: rgba(0,0,0,0.1);
    padding-top: 10px;
}

.lmsplayer_surveyfree_commenttext {
    padding: 10px;
}

.lmsplayer_surveyfree_commentlabel {
    text-align: right;
    font-size: 10pt;
    color: #217BB8;
    padding-bottom: 5px;
    padding-right: 10px;
}

.lmsplayer_surveylikert_table {
    position: relative;
    width: 100%;
    color: inherit;
}

table.lmsplayer_surveylikert_table{
    
}

table.lmsplayer_surveylikert_table tr{
    border-bottom: 1px solid;
    border-color: rgba(0,0,0,0.2);
    padding: 5px;
}

table.lmsplayer_surveylikert_table td, th{
    padding: 5px;
    padding-top: 8px;
    padding-bottom: 8px;
    min-width: 40px;
}

table.lmsplayer_surveylikert_table .aligncenter{
    text-align: center;
}

table.lmsplayer_surveylikert_table tr:nth-child(even) {
    background-color: #F7F7F7;
}

table.lmsplayer_surveylikert_table tr:nth-child(odd) {
    background-color: #fff;
}

.removeImage {
    text-align: center;
    width: 90px;
    position: relative;
    font-size:11px;
}

.explanatoryText {
    color: #AAAAAA;
    text-align: left;
    font-size: 10pt;
}

.lmsplayer_surveylikert_checkbg {
    width: 30px;
    height: 30px;
    position: relative;
    background-image: url("../../images/icons/icon_progress_0.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
    margin: 0 auto;
    border-radius: 15px;
    background-color: rgba(255,255,255,1);
    pointer-events: none;
}

.lmsplayer_surveylikert_check {
    width: 18px;
    height: 18px;
    position: absolute;
    border-radius: 9px;
    background-color: #696969;
    pointer-events: none;
    top: 6px;
    left: 6px;
}

.lmsplayer_surveylikert_options, .lmsplayer_surveylikert_options_even {
    cursor: pointer;
}

.lmsplayer_surveylikert_options:hover {
    background-color: #EAEAEA;
    animation-name: lmsplayer_surveylikert_animation;
    animation-duration: 0.3s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

@keyframes lmsplayer_surveylikert_animation {from {background-color: #FFFFFF;}to {background-color: #EAEAEA;}}


.lmsplayer_surveylikert_options_even:hover {
    background-color: #EAEAEA;
    animation-name: lmsplayer_surveylikert_animation_even;
    animation-duration: 0.3s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.lmsplayer_jumpmotion_middlebuttons, .lmsplayer_jumpmotion_middlebuttons_long {
    position: absolute;
    width: 100%;
    top: calc(100vh - 75vh);
}

.lmsplayer_jumpmotion_middlebuttons_long {
    top: calc(100vh - 60vh);
}

.lmsplayer_jumpmotion_bottombuttons, .lmsplayer_jumpmotion_bottombuttons_long {
    position: absolute;
    width: 100%;
    height: 150px;
    padding-left: 20px;
    padding-right: 20px;
    top: calc(100vh - 250px);
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.2), rgba(0,0,0,0.6));
    opacity: 0;
    webkit-transition: opacity 0.1s;
    -moz-transition: opacity 0.1s;
    -o-transition: opacity 0.1s;
    -ms-transition: opacity 0.1s;
    transition: opacity 0.1s;
}

.lmsplayer_jumpmotion_bottombuttons_long {
    top: calc(100vh - 200px);
}

.lmsplayer_jumpmotion_scrubber_container {
    width: 100%;
    height: 30px;
    position: relative;
    margin-top: 55px;
}

.lmsplayer_jumpmotion_scrubber_base, .lmsplayer_jumpmotion_scrubber_progress, .lmsplayer_jumpmotion_scrubber_hotspot {
    position: absolute;
    border-radius: 3px;
    width: 100%;
    height: 6px;
    top: 12px;
    background-color: #FFFFFF;
}

.lmsplayer_jumpmotion_scrubber_progress {
    width: 1%;
    background-color: #EC5A61;
}

.lmsplayer_jumpmotion_scrubber_hotspot {
    background-color: rgba(0,0,0,0);
    height: 100%;
    top: 0px;
}

.lmsplayer_jumpmotion_scrubber_hotspot:hover {
    cursor: pointer;
}

.lmsplayer_jumpmotion_scrubber_ball {
    position: absolute;
    border-radius: 8px;
    width: 16px;
    height: 16px;
    background-color: #EC5A61;
    top: 7px;
    left: 0px;
}

.lmsplayer_jumpmotion_button_container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    height: 50px;
    width: 100%;
    position: relative;
    margin-top: 5px;
}

.lmsplayer_jumpmotion_button {
    flex: 0 0 50px;
    height: 50px;
    background-color: rgba(0, 0, 0, 0);
    cursor: pointer;
    background-image: url("../../images/icons/icon_jumpmotion_play.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 80%;
    webkit-transition: background-size 0.1s linear;
    -moz-transition: background-size 0.1s linear;
    -o-transition: background-size 0.1s linear;
    -ms-transition: background-size 0.1s linear;
    transition: background-size 0.1s linear;
    border: 0px;
    margin-left: 8px;
    margin-right: 8px;
}

.lmsplayer_jumpmotion_button: hover {
    background-size: 100%;
}

@keyframes lmsplayer_surveylikert_animation_even {from {background-color: #F7F7F7;}to {background-color: #EAEAEA;}}

.message_indicator {
    position: absolute;
    left: 0px;
    top: 0px;
    min-width: 18px;
    height: 18px;
    background-color: #EA5A5A;
    border-radius: 10px;
    padding-top: 1px;
    padding-bottom: 0px;
    pointer-events: none;
}

.message_indicatorText {
    text-align: center;
    min-width: 18px;
    color: #fff;
    font-size: 8pt;
    padding: 0px 4px 0px 3px;
}

.dashboard_help {
    max-height: 300px;
    overflow-x: none;
    overflow-y: scroll;
}

.dashboard_helptext {
    padding-top: 20px;
    text-align: center;
    color: #AAAAAA;
}

.dashboard_allcourses {
    max-height: 600px;
    overflow-y: scroll;
    overflow-x: none;
}

.dashboard_container, .dashboard_containerLong, .dashboard_add, .dashboard_addLong {
    position: relative;
    width: 100%;
    height: 218px;
    background-color: #fff;
    overflow: hidden;
}

.dashboard_container {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

.dashboard_containerLong, .dashboard_addLong {
    height: 60px;
}

.dashboard_container:hover, .dashboard_containerLong:hover {
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
	box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
}

.dashboard_add:hover, .dashboard_addLong:hover {
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
	box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
    cursor: pointer;
}

.dashboard_noimage, .dashboard_image, .certificate_image {
    width: 100%;
    height: 158px;
    border: 1px solid #D0D0D0;
}

.dashboard_noimageLong, .dashboard_imageLong {
    width: 80px;
    height: 60px;
    border: 1px solid #D0D0D0;
    float: left;
}

.dashboard_duration_container, .dashboard_price_container {
    height: 26px;
    background-color: white;
    border-radius: 5px;
    padding: 6px;
    padding-top: 4px;
    padding-right: 0px;
    position: absolute;
    right: 10px;
    top: -36px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
}

.dashboard_price_container {
    display: inline-block;
    right: auto;
    padding-right: 6px;
    text-align: center;
    white-space: nowrap;
}

.dashboard_duration_icon {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    background-image: url("../../images/icons/icon_duration.png");
    background-repeat: no-repeat;
    background-position: center center;	
	background-size: 100% 100%;
}

.dashboard_duration_text {
    flex: 1;
    padding: 6px;
    padding-top: 0px;
    font-size: 10pt;
}

.dashboard_image {
    flex: 1;
    height: auto;
}

.dashboard_image, .certificate_image {
    background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center top;
	background-size: cover;
}

.dashboard_imageLong {
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 100% auto;
}

.dashboard_addimage {
    width: 100%;
    height: 218px;
    border: 1px dashed #089CBF;
    background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: auto 25%;
}

.dashboard_addimageLong {
    width: 80px;
    height: 60px;
    border: 1px dashed #089CBF;
    border-right: none;
    float: left;
    background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: auto 80%;
}

.courseedit_noimagecircle {
    position: relative;
    width: 200px;
    height: 200px;
    border-radius: 100px;
    background-color: #000;
    margin: auto; 
    top: calc(50% - 100px);
}

.courseedit_noimagetext {
    position: relative;
    width: 200px;
    color: #fff;
    padding-top: 65px;
    text-align: center;
    font-size: 35pt;
}

.dashboard_noimagecircleLong {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background-color: #000;
    margin: auto;
    margin-top: 10px;    
}

.dashboard_noimagecircle {
    position: relative;
    width: 128px;
    height: 128px;
    border-radius: 64px;
    background-color: #000;
    margin: auto; 
    top: calc(50% - 64px);
}

.dashboard_noimagetext {
    position: relative;
    width: 100%;
    color: #fff;
    padding-top: 35px;
    text-align: center;
    font-size: 30pt;
}

.dashboard_noimagetextLong {
    position: relative;
    width: 40px;
    color: #fff;
    padding-top: 6px;
    text-align: center;
    font-size: 15pt;
}

.dashboard_titlecontainer, .dashboard_titlecontainerLong, .certificate_titlecontainer, .certificate_titlecontainerLong {
    width: 100%;
    height: 60px;
    border: 1px solid #D0D0D0;
    border-top: none;
    padding-left: 8px;
    padding-right: 8px;
}

.dashboard_titlecontainer {
    flex: 0;
    height: auto;
    padding-top: 3px;
    padding-bottom: 6px;
    position: relative;
}

.certificate_titlecontainerLong {
    border: 1px solid #D0D0D0;
    border-left: none;
    border-right: none;
    float: left;
    width: calc(100% - 350px);
}

.dashboard_titlecontainerLong {
    position: relative;
    border: 1px solid #D0D0D0;
    border-left: none;
    border-right: none;
    float: left;
    width: calc(100% - 250px);
}

.dashboard_addTitlecontainer {
    width: 100%;
    height: 60px;
    border: 1px dashed #089CBF;
    border-top: none;
    padding-left: 8px;
    padding-right: 8px;
}

.dashboard_addTitlecontainerLong {
    width: calc(100% - 80px);
    height: 60px;
    border: 1px dashed #089CBF;
    padding-left: 8px;
    padding-right: 8px;
    float: left;
}

.dashboard_buttoncontainerLong {
    border: 1px solid #D0D0D0;
    border-left: none;
    float: left;
    width: 270px;
    height: 60px;
    padding-right: 10px;
}

.dashboard_title, .dashboard_titleLong, .certificate_title, .certificate_titleLong, .dashboard_addTitle, .dashboard_addTitleLong {
    width: 100%;
    height: 30px;
    text-align: center;
    font-weight: bold;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    padding-top: 5px;
}

.dashboard_title {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    height: auto;
    padding-top: 5px;
    padding-bottom: 5px;
}

.dashboard_addTitle {
    width: 100%;
    position: absolute;
    top: 40px;
    color: #31B0CE;
}

.dashboard_addTitleLong {
    color: #31B0CE;
}

.dashboard_titleLong, .certificate_titleLong, .dashboard_addTitleLong {
    text-align: left;
}

.dashboard_activecontainer {
    padding-top: 3px;
    overflow: hidden;
    width: 100%;
}

.dashboard_activegreen, .dashboard_activeorange, .dashboard_activered, .dashboard_activegrey {
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: #02C129;
    float: left;
    margin-top: 3px;
}

.dashboard_activeorange {
    background-color: #EDDB66;
}

.dashboard_activered {
    background-color: #CA5C55;
}

.dashboard_activegrey {
    background-color: #C6C6C6;
}

.dashboard_activenone {
    display: none;
}

.dashboard_activetext, .dashboard_activetext_dark, .dashboard_activetext_dark_long {
    color: #AAAAAA;
    font-size: 10pt;
    float: left;
    margin-left: 7px;
   
}

.dashboard_activetext_dark, .dashboard_activetext_dark_long {
    color: #707070;
    margin-left: 0px;
    width: 100%;
}

.dashboard_activetext_dark_long {
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard_hotspot {
    width: 100%;
    height: 218px;
    position: absolute;
    left: 0px;
    top: 0px;
}

.dashboard_hotspot_long {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}

.dashboard_showpopup, .dashboard_hidepopup {
    width: 100%;
    height: 218px;
    position: absolute;
    left: 0px;
    top: 228px;
    background-color: rgba(0, 0, 0, 0.3);
    padding: 2px;

    animation-name: dashboard_showpopupanimation;
    animation-duration: 0.2s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.dashboard_hidepopup {
    animation-name: dashboard_hidepopupanimation;
    animation-timing-function: ease-in;
}

@keyframes dashboard_showpopupanimation {from {top: -228px; opacity: 0}to {top: 0px; opacity: 1}}
@keyframes dashboard_hidepopupanimation {from {top: 0px; opacity: 1}to {top: -228px; opacity: 0}}

.dashboard_menubutton, .dashboard_menubuttonactive, .dashboard_menubuttonselected {
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
    height: 50px;
    width: 100%;
    clear: both;
}

.dashboard_menubuttonselected {
    cursor: pointer;
}

.dashboard_menubutton {
    color: #D6D6D6;
}

.dashboard_menubuttonactive {
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
}

.dashboard_menubuttonactive:hover{
    background-color: rgba(0, 0, 0, 0.65);
    color: #fff;
}

.dashboard_menubuttontab, .dashboard_menubuttontabselected {
    height: 50px;
    width: 8px;
    background-color: #fff;
    position: relative;
    float: left;
    left: 0px;
    top: 0px;
    opacity: 0;
}

.dashboard_menubuttontabselected {
    opacity: 1 !important;
}

.dashboard_menubuttontab, .dashboard_menubuttontabselected {
   margin-right: 4px; 
}

.dashboard_menubuttontitlelong {
    padding: 10px;
    padding-left: 10px;
    padding-top: 20px;
    max-width: calc(100% - 120px);
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    float: left;
    user-select: none;
}

.dashboard_menubuttontitlelong {
    max-width: calc(100% - 65px);
}

.dashboard_menubuttontitlelong {
    padding-left: 5px;
}

.dashboard_menubuttonscontainerLong {
	float: right;
	padding-left: 3px;
	padding-top: 14px;
	position: relative;
}

.dashboard_menubuttonsLong {
	width: 40px;
    height: 30px;
}

.dashboard_courseTitleBar {
	height: 35px;
	width: calc(100% - 50px);
	position: absolute;
    top: 5px;
    margin-bottom: 10px;
    clear: both;
}

.dashboard_courseTitle {
    
}

.dashboard_categoryBar {
    width: 100%;
    height: 35px;
    background-color: #E4E4E4;
    border: 1px solid #D0D0D0;
    border-radius: 10px;
}

.dashboard_categoryBarTitle {
    width: calc(100% - 80px);
    padding-left: 10px;
    padding-top: 6px;
    font-weight: bold;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
    float: left;
}

.dashboard_infoButton {
    float: right;
    margin-top: 5px;
    margin-right: 10px;
}

.dashboard_info {
    position: relative;
    width: 24px;
    height 24px;
    border-radius: 12px;
    background-color: rgba(255,255,255,0);
    cursor: pointer;
}

.dashboard_info:hover {
    background-color: #fff;
}

.dashboard_searchContainer {
    float:right;
	position: relative;
	height: 40px;
	width: 250px;
    padding-top: 2px;
}

.dashboard_progressbg {
    width: 50%;
    background-color: #BCBCBC;
    height: 20px;
    margin-top: 5px;
    font-size: 10pt;
    overflow: hidden;
    border-radius: 5px;
    position: relative;
    min-width: 110px;
}

.dashboard_progresstext1 {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 1px;
    left: 0px;
    color: #fff;
}

.dashboard_progresstext2 {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 0px;
    left: 0px;
    color: #fff;
}

.dashboard_progressfill {
    width: 0%;
    background-color: #02C129;
    height: 20px;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: hidden;
}

.dashboard_expiredtext {
    color: #fff;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 60px;
    position: absolute;
    bottom: 0px;
    padding-top: 15px;
}

.dashboard_expiredtextlong {
    float: right;
	padding-left: 3px;
	padding-top: 16px;
	position: relative;
    text-align: right;
}

.dashboard_flexTitle {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
    margin-top: -3px;
}

.dashboard_thumbnailList {
    flex: 0 0 25px;
}

.dashboard_search {
    flex: 1;
    padding-right: 25%;
    padding-top: 5px;
}

.dashboard_jumplibrary_container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.dashboard_jumplibrary_categories {
    flex: 0 0 250px;
    padding-left: 10px;
}

.dashboard_previousnext_container {
    padding-top: 30px;
}

.dashboard_jumplibrary_courses {
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: 15px;
}

.dashboard_jumplibrary_course {
    flex: 1 0 230px;
    max-width: 300px;
}

.dashboard_jumplibrary_courseLong {
    flex: 1 100%;
}

.dashboard_categorylist {
    padding-right: 10px;
    position: relative;
}

.dashboard_categorylist_title {
    padding-bottom: 10px;
    user-select: none;
}

.dashboard_categorylist_reset {
    top: -4px;
    right: 0px;
    text-align: right;
    user-select: none;
    border-radius: 3px;
    padding: 4px;
    padding-left: 6px;
    padding-right: 6px;
    position: absolute;
    cursor: pointer;
    background-color: #fff;
    color: #6194CE;
    transition: background-color 0.4s;
}

.dashboard_categorylist_reset:hover {
    background-color: #ECECEC;
}

.dashboard_category {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.dashboard_category_select {
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
    background-color: #fff;
    transition: background-color 0.4s;
    cursor: pointer;
    padding: 3px;
}

.dashboard_category_select:hover {
    background-color: #E8E8E8;
}

.dashboard_tickbox {
    flex: 0 0 20px;
    height: 20px;
    border: 1px solid #D0D0D0; 
    background-color: #fff;
    transition: background-color 0.4s;
}

.dashboard_tickbox_fill {
    width: 14px;
    height: 14px;
    background-color: #fff;
    position: relative;
    top: 2px;
    left: 2px;
    transition: background-color 0.4s;
}

.dashboard_category_title {
    flex: 1;
    padding-left: 10px;
    user-select: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px;
}

.dashboard_category_dropdown {
    flex: 0 0 26px;
    height: 26px;
    background-color: #fff;
    transition: background-color 0.4s;
    cursor: pointer;
    padding-top: 3px;
    padding-left: 3px;
}

.dashboard_category_dropdown:hover {
    background-color: #E8E8E8;
}

.dashboard_category_coursecontainer {
    width: 100%;
    height: 0px;
    overflow: hidden;
    padding-left: 30px;
    transition: height 0.4s;
}

.searchresults_pagebuttons {
    display: flex;
    flex-direction: row; 
    justify-content: center;
    width: 100%;
    padding-bottom: 30px;
}

.searchresults_pagebutton, .searchresults_pagebutton_selected, .searchresults_pagebutton_disabled {
    flex: 0 0 30px;
    background-color: #ffff;
    transition: background-color 0.3s ease-out;
    overflow: hidden;
    border-radius: 15px;
    text-align: center;
    cursor: pointer;
    margin-left: 2px;
    margin-right: 2px;
    user-select: none;
}

.searchresults_pagebutton:hover {
    background-color: #ECECEC;
}

.searchresults_pagebutton_selected {
    color: #fff;
    background-color: #6194CE;
}

.searchresults_pagebutton_disabled {
    color: #D8D8D8;
    cursor: inherit;
}

.courseedit_emptycontainer {
    position: relative;
    width: 100%;
    min-height: 270px;
    border: 1px dashed;
    border-color: #CDCDCD;
    background-color: #FFFFFF;
    border-radius: 8px;
    padding: 0px 15px 0px 15px;
}

.courseedit_empty {
    color: #A0A0A0;
    width: 100%;
    text-align: center;
    padding-bottom: 20px;
    position: relative;
    box-sizing: border-box;
}

.courseedit_openai_message {
    color: #A0A0A0;
    width: 100%;
    text-align: center;
    position: relative;
    box-sizing: border-box;
    padding-top: 20px;
}

.courseedit_generating{
    color: #A0A0A0;
    width: 100%;
    text-align: center;
    padding-top: 20px;
    position: relative;
}

.courseedit_aibutton {
    position: relative;
    width: 100%;
    padding-left: calc(50% - 160px);
    padding-right: calc(50% - 160px);
    padding-bottom: 20px;
    box-sizing: border-box;
}

.courseedit_aibutton_nopadding {
    position: relative;
    width: 100%;
    padding-left: calc(50% - 160px);
    padding-right: calc(50% - 160px);
    box-sizing: border-box;
}

.courseedit_sections {
    position: relative;
}

.courseedit_sections_empty {
    position: absolute;
    width: 100%;
    min-height: 250px;
}

.courseedit_section {
    position: relative;
    width: 100%;
}

.courseedit_section_collapse {
    width: 100%;
    transition: max-height 0.4s;
    max-height: 0px;
    overflow: hidden;
}

.courseedit_element, .courseedit_element_selected , .courseedit_element_fake{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: 100%;
    height: 50px;
    position: relative;
    border: 1px solid #D0D0D0;
    border-radius: 10px;
    background-color: #fff;
}

.courseedit_element, .courseedit_element_selected {
    display: none;
}

.courseedit_element_fake {
    position: absolute;
    top: 0px;
    left: 0px;
    outline-style: solid;
    outline-color: #66C4DA;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
}

.courseedit_element_selected {
    outline-style: solid;
    outline-color: #66C4DA;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
}

.courseedit_element_insection {
    margin-left: 30px;
    width: calc(100% - 30px);
}

.courseedit_sectionline {
    position: absolute;
    top: 50px;
    left: 10px;
    width: 20px;
    transition: opacity 0.4s;
}

.courseedit_element_faded {
    opacity: 0.3;
}

.courseedit_element_nodrag {
    flex: 0 0 10px;
}

.courseedit_element_drag {
    flex: 0 0 30px;
    cursor: grab;
    margin-right: 10px;
}

.courseedit_element_drag_fake {
    flex: 0 0 30px;
    cursor: grabbing;
    margin-right: 10px;
}

.courseedit_element_type {
    flex: 0 0 40px;
    padding-top: 10px;
    user-select: none;
    pointer-events: none;
}

.courseedit_element_title {
    flex: 1 1;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-top: 13px;
    padding-right: 10px;
    user-select: none;
    color: #4C4C4C;
}

.courseedit_element_active {
    flex: 0 0 65px;
    padding-top: 10px;
}

.courseedit_element_edit, .courseedit_element_more {
    position: relative;
    flex: 0 0 40px;
    height: 40px;
    margin-top: 4px;
    margin-right: 5px;
}

.courseedit_element_more {
    flex: 0 0 20px;
}

.courseedit_element_editbutton {
    position: relative;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background-color: rgba(255,255,255,0);
    background-image: url("../../images/icons/icon_cog.png");
    background-repeat: no-repeat;
    background-size: 30px 30px;
    background-position: center center;
    transition: background-color 0.4s;
    border: 0px;
}

.courseedit_element_editbutton:hover {
    background-color: #DBDBDB;
}

.courseedit_element_editbutton:active {
    background-color: #CCCCCC;
}

.courseedit_element_morebutton, .courseedit_element_expandbutton {
    position: relative;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background-color: rgba(255,255,255,0);
    transition: background-color 0.4s;
    border: 0px;
}

.courseedit_element_morebutton:hover, .courseedit_element_expandbutton:hover {
    background-color: #DBDBDB;
}

.courseedit_element_morebutton:active, .courseedit_element_expandbutton:active {
    background-color: #CCCCCC;
}

.courseedit_element_expand {
    position: relative;
    flex: 0 0 30px;
    height: 50px;
}

.courseedit_element_expandbutton {
    border-radius: 0px 10px 10px 0px;
    height: calc(100% - 2px);
    border-left: 1px solid #D0D0D0;
    padding: 0px;
}

.courseedit_element_morelist {
    position: absolute;
    display: none;
    top: 0px;
    left: 0px;
    width: auto;
	white-space: nowrap;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
    border-radius: 3px;
    z-index: 2056;
    opacity: 0;
    transition: opacity 0.4s;
}

.courseedit_element_morelist_arrow {
    position: absolute;
    top: 0px;
    left: 0px;
    width: auto;
    height: auto;
}

.courseedit_element_morelist_shadow {
  filter: drop-shadow(0px 4px 4px rgb(0 0 0 / 0.4));
}

.courseedit_element_moreoption, .courseedit_element_moreoption_disabled {
    position: relative;
    width: 100%;
    height: 40px;
    background-color:rgba(255, 255, 255, 1);
	white-space: nowrap;
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 9px;
	padding-bottom: 0px;
    transition: background-color 0.4s;
    cursor: pointer;
    user-select: none;
    border: 0px;
}

.courseedit_element_moreoption:hover {
    background-color: #EFEFEF;
}

.courseedit_element_moreoption:active {
    background-color: #DADADA;
}

.courseedit_element_moreoption_text {
    pointer-events: none;
}

.courseedit_element_moreoption_disabled {
    opacity: 0.3;
    cursor: auto;
    color: #4C4C4C !important;
}

.courseedit_droplabel, .courseedit_droplabel_insection {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: calc(100% - 25px);
    height: 15px;
    position: relative;
    margin-top: 3px;
    margin-bottom: 3px;
    margin-left: -20px;
    opacity: 0;
    transition: opacity 0.2s;
}

.courseedit_droplabel_insection {
    margin-left: 10px;
    width: calc(100% - 5px);
}

.courseedit_droplabel_text {
    position: relative;
    flex: 0 0 40px;
    height: 15px;
    color: #fff;
    background-color: #089CBF;
    border-radius: 5px;
    font-size: 7pt;
    text-align: center;
}

.courseedit_droplabel_line {
    position: relative;
    flex: 1 1;
    height: 2px;
    background-color: #089CBF;
    margin-top: 6px;
}

.courseedit_addbutton , .courseedit_addbutton_disabled{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: 100%;
    height: 50px;
    position: relative;
    border: 1px solid #D0D0D0;
    border-radius: 10px;
    background-color: #fff;
    padding: 0px;
    cursor: pointer;
    transition: background-color 0.4s, border-color 0.4s;
}

.courseedit_addbutton:hover {
    background-color: #E6E6E6;
    border-color: #9F9F9F;
}

.courseedit_addbutton:active {
    background-color: #D4D4D4;
    border-color: #838383;
}

.courseedit_addbutton_disabled {
    cursor: auto;
    background-color: rgba(255,255,255,0.3);
}

.courseedit_jumpmotion_container {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: rows;
    flex-wrap: nowrap;
    margin-top: 10px;
}

.courseedit_jumpmotion_delete {
    flex: 0 0 50px;
}

.courseedit_jumpmotion_prop {
    flex: 1;
}

.courseedit_jumpmotion_input {
    width: 100px;
    padding: 5px 10px;
    box-sizing: border-box;
    border: 1px solid #A9A9A9;
    border-radius: 4px;
    margin-left: 5px;
}

.courseedit_status_text {
    padding-top: 6px;
    color: #AAAAAA;
    font-size: 10pt;  
}

.certificate_image {
    height: 178px;
}

.certificate_titlecontainer {
    height: 40px;
}

.certificate_title {
    padding-top: 7px;
}

.certificate_titleLong, .dashboard_addTitleLong {
    height: 60px;
    padding-top: 18px;
}

#certificateeditor_container {
    background-color: #fff;
    position: relative;
    border: 1px solid;
}

.certificateeditor_image {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 100% 100%;
}

.certificateeditor_textcontainer {
    width: 100%;
    position: absolute; 
    text-align: center;
    top: 0px;
    left: 0px;
    overflow: visible;
    cursor: pointer;
}

.certificateeditor_textborder, .certificateeditor_textborderselected {
    position: absolute;
    border: 1px solid rgba(220, 144, 36, 1); 
    top: 0px;
    left: 0px;
    width: 100%;
}

.certificateeditor_textborder {
    border: 1px solid rgba(220, 144, 36, 0);     
}

.certificateeditor_textborder:hover {
    border: 1px solid rgba(220, 144, 36, 0.5);     
}

.certificateeditor_textanchor {
	position: absolute;
	border: 1px solid;
	border-color: #dc9024;
	background-color: rgba(255, 255, 255, 1);
	width: 10px;
	height: 10px;
	box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

.certificateeditor_text {
    transform-origin: top left;
}

.certificateeditor_infocontainer {
    position: absolute;
    background-color: #333333;
    height: 20px;
    border-radius: 10px;
    padding-left: 8px;
    padding-right: 8px;
    top: -30px;
    left: 0px;
    color: #fff;
    font-size: 10pt;
}

.certificateeditor_settingscontainer {
    overflow: visible;
    width: 250px;
    position: absolute;
    top: 0px;
    left: 0px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    background-color: #fff;
    z-index: 10;
}

.certificateeditor_settingstitlecontainer {
    width: 100%;
    height: 35px;
    background-color: #fff;
    padding-left: 10px;
    padding-right: 10px;
    cursor: pointer;
}

.certificateeditor_settingstitle {
    position: relative;
    float: left;
    padding-top: 5px;
}

.certificateeditor_settingsclose {
    position: relative;
    float: right;
    padding-top: 7px;
}

.certificateeditor_settingscontentbox, .certificateeditor_settingscontentbox_noborder {
    position: relative;
    width: 100%;
    padding: 10px;
    border-bottom: 1px solid #D0D0D0;
}

.certificateeditor_settingscontentbox_noborder {
    border-bottom: none;
}

.certificateeditor_settingscontenthint {
    font-size: 9pt;
    margin-top: 10px;
    color: #999;
    position: relative;
    text-align: center;
}

.certificateeditor_formatbutton {
    position: relative;
    float: left;
}

.buttonslider_outer {
    width: 100%;
    height: 30px;
    position: relative;
}

.buttonslider_container, .buttonslider_container_number {
    width: 100%;
    height: 30px;
    position: relative;
}

.buttonslider_container_number {
    width: calc( 100% - 60px);
}

.buttonslider_sliderbg, .buttonslider_slider {
    position: absolute;
    top: 12px;
    width: 100%;
    height: 6px;
    border-radius: 3px;
    background-color: #B8E9F8;
    -webkit-box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 2px 3px rgba(0, 0, 0, .1);
}

.buttonslider_slider {
    width: 1px;
    background-color: #2AA8CF;
    -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 3px rgba(0, 0, 0, .1);
}

.buttonslider_spot {
    width: 16px;
    height: 16px;
    position: absolute;
    margin-left: -8px;
    top: 7px;
    border-radius: 8px;
    background-color: #2AA8CF;
    border: 4px solid #fff;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    transition: box-shadow 0.4s;
    pointer-events: none;
}

.buttonslider_spot:hover {
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
}

.buttonslider_number, .buttonslider_numberinput {
    width: 60px;
    position: absolute;
    left: calc( 100% - 60px );
    top: 3px;
    text-align: right;
    padding-left: 3px;
    padding-right: 3px;
}

.buttonslider_numberinput {
    top: 2px;
    width: 50px;
    left: calc( 100% - 50px );
    padding-right: 0px;
}

.buttoncustomdrop_container {
    width: 100%;
    height: 30px;
    position: relative;
}

.buttoncustomdrop_textcontainer {
    width: 100%;
    height: 100%;
    position: relative;
}

.buttoncustomdrop_text {
    color: #2AA8CF;
    position: absolute;
    width: calc( 100% - 30px );
}

.buttoncustomdrop_arrowdown, .buttoncustomdrop_arrowup {
    position: absolute;
    width: 30px;
    height: 30px;
    left: calc( 100% - 30px );
    background-image: url("../../images/icons/icon_expanddown_dark.png");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 50%;
}

.buttoncustomdrop_arrowup {
    background-image: url("../../images/icons/icon_expandup_dark.png");
}

.buttoncustomdrop_dropcontainer {
    z-index: 10;
    width: 250px;
    min-height: 30px;
    position: absolute;
    top: 30px;
    left: 0px;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    overflow-y: scroll;
    opacity: 0;
    
    animation-name: fadeMeInFull;
    animation-duration: 0.2s;
	animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.buttoncustomdrop_dropitem, .buttoncustomdrop_dropitemselected {
    width: 100%;
    height: 30px;
    position: relative;
    background-color: #fff;
    padding-left: 10px;
    padding-right: 10px;
}

.buttoncustomdrop_dropitem:hover {
    background-color: rgba(184,233,248,0.3);
    cursor: pointer;
}

.buttoncustomdrop_dropitemtext {
    padding-top: 4px;
}

.buttoncustomdrop_dropitemselected {
    background-color: rgba(184,233,248,1);
}

.enrolled, .notenrolled {
    background-color: rgba(98,197,82,1);
    border-radius: 5px;
    padding: 2px;
    color: #fff;
}

.notenrolled {
    background-color: rgba(234,146,58,1);
}

.contentelement_title {
    font-weight: bold;
    font-size: 13pt;
    margin-bottom: 10px;
}

.contentelement_bottom {
    background-color: rgba(51,51,51,1);
    min-height: 55px;
    width: 100%;
    position: fixed;
    bottom: 0px;
    left: 0px;
    padding: 10px;
    padding-left: 20px;
    z-index: 1000;
}

.contentelement_buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.contentelement_button {
    flex: 0 0;
    align-self: center;
}

.contentelement_save {
    flex: 0 0 200px;
}

.contentelement_container {
    position: relative;
    margin-bottom: 50px;
}

.contentelement_quill {
    position: relative;
    background-color: #fff;
    min-height: 500px;
}

.popup_center {
	display: table;
	margin: 0 auto;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.triangle-up {
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 25px solid #fff;
}

.triangle-down {
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 25px solid #fff;
}

.triangle-left {
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-right: 25px solid #fff;
	border-bottom: 10px solid transparent;
}

.triangle-right {
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-left: 25px solid #fff;
	border-bottom: 10px solid transparent;
}

.wizard_fade {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100vw;
    height: 100%;
    background-color: rgba(0,0,0,1);
    z-index: 1100;    
}

.wizard_targetzindex {
    position: relative;
    z-index: 1101;
}

.wizard_container {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 300px;
    z-index: 1102;
    clear: both;
}

.wizard_bg {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    border-radius: 5px;
    background-color: rgba(255,255,255,1);
    padding: 10px;
    padding-left: 15px;
    padding-right: 15px;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    color: #4C4C4C;
}

.wizard_arrow {
    position: absolute;
    top: 0px;
    left: 0px;
}

.help_container {
    position: fixed;
    z-index: 2100;
    width: 600px;
    height: 500px;
    top: 70px;
    left: calc( 50% - 300px );
    border-radius: 5px;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
    background-color: rgba(255,255,255,1);
    border: 1px solid #D0D0D0;
    overflow: hidden;
}

.help_titlebar {
    position: relative;
    width: 100%;
    height: 50px;
    padding: 5px;
    padding-left: 15px;
    font-size: 14pt;
}

.help_searchbar {
    position: relative;
    padding: 10px 15px 10px 15px;
    height: 57px;
    width: 100%;
    background-color: rgba(236,236,236,1);
    border-bottom: 1px solid #D0D0D0;
}

.help_contentouter {
    position: relative;
    width: 100%;
    height: calc( 100% - 107px);
    overflow: hidden;
}

.help_content {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 100%;
    top: 0px;
    overflow: hidden;
    transition: left 0.3s;
    background-color: #fff;
}

.help_title {
    padding-top: 5px;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 13pt;
}

.help_iframe {
    position: relative;
    width: 100%;
    height: calc( 100% - 47px );
    clear: both;
    border-top: 1px solid #D0D0D0;
}

.help_titleposition {
    position: relative;
    float: left;
    z-index: 10;
}

.help_buttoncontainer {
    position: relative;
    width: 100%;
    border-bottom: 1px solid #D0D0D0;
    padding: 10px 15px 10px 15px;
    background-color: #fff;
    transition: background-color 0.3s;    
}

.help_buttoncontainer:hover {
    background-color: #A8D2FA;
    cursor: pointer;
}

.subscription_flex {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
}

.subscription_columns {
    flex: 1 1 20%;
    position: relative;
}

.subscription_container {
    width: 100%;
    height: 400px;
    padding: 0px 5px 20px 5px;
    position: relative;
}

.subscription_col {
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    border: 3px solid;
    border-color: #BA1212;
    border-radius: 45px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, .15);
}

.subscription_button {
    width: 130px;
    position: absolute;
    margin: 0 auto;
    bottom: 15px;
    left: calc( 50% - 63px );
}

.subscription_title {
    font-size: 14pt;
    font-weight: 500;
    width: 100%;
    text-align: center;
    padding-top: 15px;
}

.subscription_selectedplan {
    position: relative;
    height: 40px;
    color: #fff;
    font-size: 12pt;
    font-weight: 500;
    width: 100%;
    text-align: center;
    background-color: #A782CE;
    padding: 8px 5px 5px 5px;
}

.subscription_notselectedplan {
    position: relative;
    height: 40px;
    color: #fff;
    font-size: 12pt;
    font-weight: 500;
    width: 100%;
    text-align: center;
    background-color: #fff;
    padding: 5px;
}

.subscription_learnercount {
    margin-bottom: 10px;
    clear: both;
}

.subscription_interval {
    background-color: #fff;
    padding: 10px;
    position: relative;
    width: 100%;
    border-radius: 5px;
    margin-bottom: 30px;
}

.subscription_price{
    font-size: 23pt;
    font-weight: 400;
    width: 100%;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 15px;
}

.subscription_price_small{
    font-weight: 200;
    font-size: 14pt;
}

.subscription_description{
    position: relative;
    width: 100%;
    text-align: center;
    padding: 5px;
}

.subscription_cancel {
    width: 100%;
    height: 60px;
    position: relative;
}

.subscription_options {
    position: relative;
    width: 100%;
    height: 35px;
}

.subscription_icon {
    width: 25px;
    height: 25px;
    position: absolute;
    left: 0px;
    top: 0px;
}

.subscription_icon_text {
    width: calc(100% - 25px);
    position: absolute;
    left: 25px;
    top: 0px;
    padding: 2px 8px 0px 8px;
}

.email_inserttext_container {
    display: flex;
    flex-direction: row;
    flex-flow: row wrap;
    justify-content: flex-start;
    row-gap: 5px;
    column-gap: 5px;
    width: 100%;
    margin-bottom: 10px;
}

.email_inserttext {
    flex: 0 1 auto;
}

.email_quill_container {
    width: 100%;
    position: relative;
    clear: both;
}

.email_subject_container {
    display: flex;
    flex-direction: row;
    flex-flow: row wrap;
    justify-content: flex-start;
    row-gap: 5px;
    column-gap: 5px;
    width: 100%;
    margin-bottom: 10px;
}

.email_subjecttitle {
    flex: 0 1 auto;
    margin-right: 8px;
    margin-top: 4px;
}

.email_totitle {
    flex: 0 1 auto;
    margin-right: 8px;
    margin-top: 6px;
}

.email_subject {
    flex: 1 1 auto;
}

.email_send_container {
    position: relative;
    width: 100%;
    height: 35px;
}

.email_send_icon {
    width: 25px;
    height: 25px;
    position: absolute;
    left: 0px;
    top: 3px;
}

.semail_send_text {
    width: calc(100% - 25px);
    position: absolute;
    left: 25px;
    top: 0px;
    padding: 2px 8px 0px 8px;
}

.notification_container {
    width: 100%;
    height: 60px;
    position: relative;
}

.notification_profileimage {
    top: 12px;
	width: 36px;
	height: 36px;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size:contain;
	position: relative;
    background-color: #fff;
	border-radius: 18px;
	float: left;
}

.notification_newmessage, .notification_oldmessage {
    width: 3px;
    height: 60px;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: #6194CE;
    margin-right: 7px;
}

.notification_oldmessage {
    background-color: #fff;
    opacity: 0;
}

.notification_from, .notification_from_read {
    width: calc( 100% - 80px);
    position: absolute;
    left: 10px;
    top: 0px;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    user-select: none;
}

.notification_from_read {
    font-weight: normal;
}

.notification_date {
    width: 70px;
    position: absolute;
    right: 0px;
    top: 0px;
    text-align: right;
    font-size: 9pt;
    color: #AAAAAA;
    user-select: none;
}

.notification_long {
    width: 150px;
    position: absolute;
    right: 0px;
    top: 0px;
    text-align: right;
    font-size: 9pt;
    color: #AAAAAA;
    user-select: none;
}

.notification_subject {
    width: calc( 100% - 10px );
    position: absolute;
    left: 10px;
    top: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #2E74C5;
    user-select: none;
}

.notification_snippet {
    width: calc( 100% - 10px );
    position: absolute;
    left: 10px;
    top: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #8A8A8A;
    user-select: none;
}

.notification_tick {
    position: relative;
    left: 0px;
    top: 17px;
}

.notification_read {
    position: relative;
    left: 0px;
    top: 12px;
}

.notification_inbox_container {
    display: flex;
    flex-direction: row;
    flex-flow: nowrap;
    justify-content: flex-start;
    width: 100%;
    position: relative;
    overflow: hidden;   
}

.notification_showinbox {
    flex: 0 0 auto;
    position: relative;
    width: 100%;
    left: 0px;
    top: 0px;
    transition: left 0.3s;
}

.notification_shownewmessage {
    flex: 0 0 auto;
    position: relative;
    width: 100%;
    left: 0px;
    top: 0px;
    transition: left 0.3s;
}

.notification_showmessage {
    flex: 0 0 auto;
    position: relative;
    width: 100%;
    left: 0px;
    top: 0px;
    transition: left 0.3s;
}

.notification_newmessage_container {
    width: 100%;
    position: relative;
    background-color: #fff;
    padding: 10px;
}

.notification_message_container {
    width: 100%;
    position: relative;
    background-color: #fff;
}

.notification_individualmessage_container {
    width: 100%;
    position: relative;
    background-color: #fff;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 0 6px rgba(0, 0, 0, .15);
    margin-bottom: 10px;
}

.notification_individualmessage_top {
    width: 100%;
    position: relative;
    padding-bottom: 10px;
    border-bottom: 1px solid #D0D0D0;
}

.notification_message_from {
    width: calc( 100% - 80px);
    position: relative;
    font-weight: bold;
    padding-bottom: 4px;
}

.notification_message_subject {
    width: calc( 100% - 10px );
    position: relative;
    color: #2E74C5;
    padding-bottom: 4px;
}

.notification_message_to {
    width: calc( 100% - 10px );
    position: relative;
}

.notification_individualmessage_body {
    padding-top: 10px;
}

.notification_topbuttons_container {
    display: flex;
    flex-direction: row;
    flex-flow: row wrap;
    justify-content: flex-start;
    row-gap: 5px;
    column-gap: 5px;
    width: 100%;
    margin-bottom: 10px;
    padding: 15px;
}

.notification_replymessage {
    padding: 5px;
    margin-bottom: 10px;
}

.notification_allmessages {
    padding: 0px 15px 5px 15px;
}

.leaderboard_learnerlist {
    width: 100%;
    height: 300px;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-top: 8px;
    padding-bottom: 8px;
}

.leaderboard_titlecontainer {
    width: 100%;
    height: 35px;
    background-color: rgba(255,255,255,0);
    color: #7F7F7F;
    padding-top: 7px;
    position: relative;
}

.leaderboard_toptitle {  
    width: calc(100% - 160px);
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
    pointer-events: none;
    color: #000;
    font-weight: 600;
    float: left;
    padding-left: 10px;
    margin-left: 50px;
}

.leaderboard_pointstitle {
    font-size: 10pt;
    font-weight: 600;
    width: 110px;
    color: #000;
    text-align: center;
    pointer-events: none;
    float: left;
}

.leaderboard_firstplace, .leaderboard_secondplace, .leaderboard_thirdplace {
    margin-top: 2px;
    width: 50px;
    height: 40px;
    float: left;
    background-image: url("../../images/icons/icon_trophy.png");
    background-repeat: no-repeat;
    background-position: left center;	
	background-size: 40px 40px;
    pointer-events: none;
}

.leaderboard_secondplace {
    background-image: url("../../images/icons/icon_silver.png");
}

.leaderboard_thirdplace {
    background-image: url("../../images/icons/icon_bronze.png");
}

.leaderboard_place {
    width: 50px;
    height: 45px;
    float: left;
    padding-top: 13px;
    font-weight: 600;
    text-align: center;
}

.leaderboard_name {
    overflow: hidden;
	text-overflow: clip;
	white-space: nowrap;
    width: calc( 100% - 200px);
    height: 40px;
    float: left;
    padding-left: 10px;
    padding-top: 12px;
}

.leaderboard_points {
    width: 110px;
    height: 40px;
    float: left;
    text-align: center;
    padding-top: 12px;
}

.leaderboard_container, .leaderboard_nextcontainer, .leaderboard_selected {
    width: 100%;
    height: 45px;
    background-color: rgba(255,255,255,0);
    cursor: pointer;
    color: #7F7F7F;    
    position: relative;
}

.leaderboard_container:hover {
    background-color: rgba(255,255,255,0.7);
    color: #000;
}

.leaderboard_nextcontainer {
    background-color: rgba(255,255,255,0.4);
}

.leaderboard_nextcontainer:hover {
    background-color: rgba(255,255,255,0.7);
    color: #000;
}

.leaderboard_selected {
    background-color: rgba(212,227,245,0.4);
    color: #000;
    font-weight: 600;
}

.leaderboard_selected:hover {
    background-color: rgba(212,227,245,0.7);
}

.leaderboard_profileImage {
	width: 40px;
	height: 40px;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size:contain;
    background-color: #fff;
	position: relative;
	border-radius: 18px;
	float: left;
    margin-top: 2px;
}

.integrations_table {
    display: flex;
    flex-direction: row;
    flex-flow: row wrap;
    min-height: 60px;
}

.integrations_stripe {
    flex: 0 0 60px; 
    background-image: url("../../images/stripe-logo-1.png");
    background-repeat: no-repeat;
    background-position: left center;
	background-size: 50px;
    border-right: 1px solid #999;
    padding-right: 15px;
}

.integrations_enable, .integrations_loader {
    flex: 0 1; 
    border-left: 1px solid #999;
    padding: 10px 5px 5px 10px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    flex-flow: wrap;
    align-items: center;
    gap: 10px;
}

.integrations_loader {
    min-width: 75px;
}

.integrations_enable_switch {
    flex: 0 0 60px; 
}

.integration_reconnect {
    flex: 1 0;
}

.integrations_content {
    flex: 1 1; 
    padding: 10px 20px 10px 20px;
}

.integration_status_container {
    display: flex;
    flex-direction: row;
    flex-flow: row wrap;
}

.integration_status {
    flex: 0 0 200px;
    display: flex;
    flex-direction: row;
    flex-flow: nowrap;
    padding-right: 20px;
}

.integration_status_ball_green, .integration_status_ball_red {
    flex: 0 0 12px; 
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: #02C129;
    margin-top: 3px;
    margin-right: 7px;
}

.integration_status_ball_red {
    background-color: #CA5C55;
}

.integration_status_text {
    flex: 1 1; 
    color: #AAAAAA;
    font-size: 10pt;   
}

.basket_container {
    width: 100%;
    padding: 0px 10px 0px;
    display: flex;
    flex-direction: row;
    flex-flow: row wrap;
    gap: 20px;
}

.basket_total {
    flex: 1 1;
    border-radius: 10px;
    background-color: #fff;
    min-width: 200px;
    padding: 10px 20px 10px;
    display: flex;
    flex-direction: row;
    flex-flow: wrap;
    align-content: flex-start;
}

.basket_total_title {
    flex: 1 1;
    width: 50%;
    height: auto;
    font-size: 14pt;
    font-weight: 500;
    padding-bottom: 20px;
}

.basket_total_price {
    flex: 1 1;
    width: 50%;
    text-align: right;
    font-size: 14pt;
    font-weight: 500;
}

.basket_total_checkout {
    flex: 0 0 100%;
    width: 100%;
}

.basket_total_checkoutbutton, .basket_total_checkoutbutton_disabled {
    width: 100%;
    text-align: center;
    background-color: #2E74C5;
    padding: 10px 20px 10px;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color 0.3s;
    color: #fff;
    user-select: none;
}

.basket_total_checkoutbutton_disabled {
    background-color: #F1F0EA;
    cursor: default;
}

.basket_total_checkoutbutton:hover {
    background-color: #1E5799;
}

.basket_empty {
    width: 100%;
    font-size: 14pt;
    font-weight: 500;
    text-align: center;
    padding-top: 50px;
    color: #939393;
}

.basket_items {
    flex: 3 3;
}

.basket_item {
    width: 100%;
    position: relative;
    border-radius: 10px;
    background-color: #fff;
    padding: 15px;
    display: flex;
    flex-direction: row;
    flex-flow: nowrap;
}

.basket_item_imagecontainer {
	flex: 1 1;
    min-width: 150px;
}

.basket_item_image {
	width: 100%;
    height: 150px;
	border-color:#DEDEDE;
	background-image: url("../../images/no-image-126x126.jpg");
    background-repeat: no-repeat;
    background-position: center center;
	background-size: cover;
	position: relative;
	border-radius: 8px;
}

.basket_item_noimage {
    position: relative;
    width: 150px;
    height: 150px;
    border-radius: 75px;
    background-color: #000;
    margin: auto; 
    top: calc(50% - 75px);
}

.basket_item_noimagetext {
    position: relative;
    width: 150px;
    color: #fff;
    padding-top: 40px;
    text-align: center;
    font-size: 35pt;
}

.basket_item_infocontainer {
	flex: 2 2;
    padding-left: 20px;
    position: relative;
    min-width: 200px;
}

.basket_item_infotitle {
    position: relative;
    width: 100%;
    font-size: 14pt;
    font-weight: 500;
}

.basket_item_infodescription {
    position: relative;
    width: 100%;
    padding-top: 6px;
    padding-bottom: 30px;
}

.basket_item_infoprice_container {
    position: absolute;
    width: 100%;
    padding-top: 6px;
    bottom: 0px;
}

.basket_item_remove {
    position: absolute;
    width: 50%;
    bottom: 0px;
}

.basket_item_price {
    position: absolute;
    width: 50%;
    bottom: 0px;
    right: 20px;
    text-align: right;
    font-size: 14pt;
    font-weight: 500;
}

.checkout_container {
    width: calc(100% - 20px);
    margin-left: 10px;
    margin-right: 10px;
    padding: 10px;
    background-color: #fff;
    border-radius: 10px;
}

.checkout_success_container {
    width: calc(100% - 20px);
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 20px 10px;
    background-color: #fff;
    border-radius: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.checkout_success_tick {
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
}

.checkout_success_text {
    flex: 1 1 100%;
    width: 100%;
    text-align: center;
    padding-top: 15px;
    font-size: 16pt;
    font-weight: 500;
}

.checkout_success_othertext {
    flex: 1 1 100%;
    width: 100%;
    text-align: center;
    padding-top: 10px;
}

.checkout_courses_container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0px 10px 10px 10px;
    gap: 20px;
    width: 100%;
    justify-content: center;
}

.checkout_course {
    flex: 0 0 300px;
}

/*extra small*/
@media (max-width: 767px) {
    .basket_total {
        flex: 0 0 100%;
        border-radius: 0px;
        order: 0;
    }

    .basket_items {
        flex: 0 0 100%;
        order: 1;
    }
    
    .basket_item {
        border-radius: 0px;
    }
    
    .checkout_container {
        border-radius: 0px;
    }

    .lmsplayer_contentcontainer .lmsplayer_menu {
        padding-top: 0px;
    }
    .lmsplayer_headerright {
        width: 20%;
    }
    .lmsplayer_headerleft {
        width: 80%;
    }
    .lmsplayer_menuimage {
        margin-bottom: 15px;
    }
    .lmsplayer_sidemenu, .navigation_sidemenu { 
        position: absolute;
        z-index: 1001;
        flex-basis: 0%;
        width: 0%;
    }
    
    @keyframes lmsplayerremovemenu {from {width: 100%;}to {width: 0%;}}
    @keyframes lmsplayershowmenu {from {width: 0%;}to {width: 100%;}}
    @keyframes navigationremovemenu {from {width: 100%;}to {width: 0%;}}
    @keyframes navigationshowmenu {from {width: 0%;}to {width: 100%;}}
    
    .lmsplayer_sidemenucontents {  
        width: 100vw;
    }
    
    .navigation_sidemenucontents {  
        width: 100vw;
    }
    
    .navigation_logo { 
        max-width: 75%;
    }
    
    .lmsplayer_maincontentbg, .lmsplayer_documentcontentbg {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .lmsplayer_maintextimage, .lmsplayer_mainaudio, .lmsplayer_mainvideo, .lmsplayer_mainscorm, .lmsplayer_scormdescription {
        border-radius: 0px;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    
    .lmsplayer_maindocuments, .lmsplayer_docdescription {
        border-radius: 0px;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    
    .lmsplayer_inneraudio {
        position: relative;
        width: 80%;
        margin-left: 10%;
        margin-right: 10%;
    }
    
    .lmsplayer_innervideo {
        position: relative;
        width: 100%;
    }

    .lmsplayer_documenttitle {
        border-radius: none !important;
    }
    
    #lmsplayer_document {
        width: calc(100vw - 50px);
    }
    
    .lmsplayer_testinfodescription {
        margin-top: 0px;
        margin-bottom: 20px;
    }
    
    .lmsplayer_testmain {
        border-radius: 0px;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    
    .lmsplayer_testmainsubmitted {
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    
    .lmsplayer_testquestion {
        margin-left: 0px;
        margin-right: 0px;
    }
    
    .lmsplayer_testoptions {
        margin-left: 0px;
        margin-right: 0px;
    }
    
    .lmsplayer_testoptions_long {
        margin-left: 0px;
        margin-right: 0px;
    }
    
    .lmsplayer_testfeedback, .lmsplayer_testcorrectincorrect {
        margin-left: 0px;
        margin-right: 0px;
    }
    
    .lmsplayer_reportprogress_container {
        margin-left: 0px;
        margin-right: 0px;
    }
    
    .lmsplayer_testquestionnumber {
        text-align: center;
        width: 100%;
    }
    
    .navigation_tab, .navigation_tabActive {
        flex: 1 0;
    }
    
    .dashboard_allcourses {
        max-height: none;
    }
    
    .dashboard_titlecontainerLong, .certificate_titlecontainerLong {
        border: 1px solid #D0D0D0;
        border-right: none;
        width: calc(100% - 270px);
    }
    
    .dashboard_noimageLong, .dashboard_imageLong, .dashboard_addimageLong {
        display: none;
    }
    
    .dashboard_courseTitle {
        display: none;
    }
    
    .help_container {
        width: calc( 100% - 40px );
        height: 500px;
    }
    
    .subscription_columns {
        flex: 1 1 100%;
    }
    
    .popup_viewButtonLeft {
        display: none;
    }

    .popup_viewButtonRIght {
        display: none;
    }
    
    .popup_contents_topBarSmall .search_container {
        width: 200px;
    }
    
    .object_pdf {
        flex: 0 0 100%;
    }
    
    .object_squareInfo_image, .object_squareInfo_image_large, .object_squareInfo_video_large {
        flex: 0 0 100%;
    }

    .image_squareInfo_text, .image_squareInfo_text_small {
        flex: 0 0 100%;
    }
    
    .formTitle_right {
        text-align: left;
    }
    
    .loginContent {
        width: calc(100% - 20px);
        margin-left: 10px;
    }
    
    .lmsplayer_testsubmititem {
        flex: 0 0 100%;
        margin-bottom: 10px;
    }
    
    #navigation_help {
        display: none;
    }
    
    .element_centerFull {
        width: calc(100% - 20px;);
    }
    
    .contentelement_buttons {
        justify-content: center;
    }

    .contentelement_button {
        margin-bottom: 10px;
    }
    
    .contentelement_save {
        flex: 0 0 140px;
    }
    
    .lmsplayer_courseimage {
        min-height: 350px;   
        margin-bottom: 30px;
    }
    
    .dashboard_jumplibrary_categories {
        flex: 0 0 100%;
        padding-top: 20px;
    }

    .dashboard_jumplibrary_courses {
        flex: 0 0 100%;
    }
    
    .dashboard_category_title {
        max-width: 400px;
    }
    
    .integrations_content {
        padding: 10px 20px 10px 10px;
    }
}

/*small*/
@media (min-width: 768px) and (max-width: 991px) {    
    .dashboard_allcourses {
        max-height: none;
    }
    
    .dashboard_titlecontainerLong, .certificate_titlecontainerLong {
        border: 1px solid #D0D0D0;
        border-right: none;
        width: calc(100% - 270px);
    }
    
    .dashboard_noimageLong, .dashboard_addimageLong {
        display: none;
    }
    
    .dashboard_jumplibrary_categories {
        flex: 0 0 100%;
        padding-top: 20px;
    }
    
    .subscription_columns {
        flex: 1 1 50%;
    }
    
    .popup_contents_topBarSmall .search_container {
        width: 200px;
    }
    
    .object_squareInfo_image, .object_squareInfo_image_large, .object_squareInfo_video_large {
        flex: 0 0 100%;
    }

    .image_squareInfo_text, .image_squareInfo_text_small {
        flex: 0 0 100%;
    }
    
    .object_pdf {
        flex: 0 0 100%;
    }
    
    .loginContent {
        width: calc(100% - 20px);
        margin-left: 10px;
    }
    
    .lmsplayer_courseimage {
        min-height: 350px;   
        margin-bottom: 30px;
    }
    
    .lmsplayer_headerright {
        width: 30%;
    }
    .lmsplayer_headerleft {
        width: 70%;
    }
    .lmsplayer_sidemenuclose, .navigation_sidemenuclose {  
        display: none;
    }
    
    .lmsplayer_testinfodescription {
        margin-top: 0px;
        margin-bottom: 20px;
    }
    
    .navigation_tab, .navigation_tabActive {
        flex: 1 0;
    }
    
    .integrations_content {
        padding: 10px 20px 10px 10px;
    }
}

/*medium*/
@media (min-width: 992px) and (max-width: 1199px) {
    .lmsplayer_sidemenuclose, .navigation_sidemenuclose {  
        display: none;
    }
    
    .subscription_columns {
        flex: 1 1 33%;
    }
    
    .lmsplayer_courseimage {
        min-height: 350px;   
        margin-bottom: 30px;
    }
}

/*large*/
@media (min-width: 1200px) {
    .lmsplayer_sidemenuclose, .navigation_sidemenuclose {  
        display: none;
    }
}