@import url('custom_font_fontawesome.css');
@import url('custom_font_icomoon.css');

/* CSS Document for LS EZ */

/* Defaults */
::-ms-clear, ::-ms-reveal { display: none; }
button::-moz-focus-inner { border: 0; }
.clear { clear: both; height: 0; line-height: 0; margin: 0; padding: 0; border: 0; font-size: 0; }
.clear-low { clear: both; height: 10px; line-height: 0; margin: 0; padding: 0; border: 0; font-size: 0; }
.clear-med { clear: both; height: 20px; line-height: 0; margin: 0; padding: 0; border: 0; font-size: 0; }
.clear-high { clear: both; height: 40px; line-height: 0; margin: 0; padding: 0; border: 0; font-size: 0; }
.w100pc { width: 100%; }
.h100pc { height: 100%; }
.noMargin { margin: 0!important; }
.noPadding { padding: 0!important; }
.hidden { display: none; }
.trueHidden { display: none!important; }
.invisible { visibility: hidden; }
.center { text-align: center; }
.centerElem { margin: 0 auto; }
.floatLeft { float: left; }
.floatRight { float: right; }
.inline { display: inline-block; }
.inactiveText { color: #999; cursor: auto!important; }
.redText { color: #dd0000; }
.breakWord { word-wrap: break-word; }
.noUserSelect {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  }

.grayscale {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE 6-9 */
  }

.half-grayscale {
	-webkit-filter: grayscale(50%);
  -moz-filter: grayscale(50%);
  -ms-filter: grayscale(50%);
  -o-filter: grayscale(50%);
  filter: grayscale(50%);
  filter: gray; /* IE 6-9 */
  }

.slimScrollBar.ui-draggable {
  cursor: auto;
  }

.visuallyHidden {
  position: absolute!important;
  width: 1px!important;
  height: 1px!important;
  padding: 0!important;
  margin: -1px!important;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;    
  }

.cursorPointer { cursor: pointer!important; }
.noCursor { cursor: auto!important; }

.ellipsis {
  display: inline-block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  max-width: 100%;
  position: relative;
  }

.verticalTop {
  vertical-align: top;
  }

.verticalMiddle {
  vertical-align: middle;
  }

.verticalCenter {
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  }

.verticalBottom {
  vertical-align: bottom;
  }

.requireLabel:after {
  font-family: sans-serif;
  content: "*";
  font-size: 15px;
  color: #dd0000;
  position: absolute;
  margin-left: 1px;
  }

.dragInfoText {
  color: #999;
  font-style: italic;
  font-size: 12px;
  }  
  
.ui-draggable,
.cursorDrag {
  cursor: move;
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
  }

.ui-draggable:active,
.cursorDrag:active,
.draggableElement,
.ui-draggable-elem {
  cursor: move;
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
  }

.draggableElement,
.ui-draggable-elem {
  display: inline-block;
  background: #f4f4f4;
  border: 1px solid #ddd;
  padding: 1px 5px;
  border-radius: 3px;
  min-height: 28px;
  position: relative;
  cursor: move;
  cursor: -moz-grab;
  cursor: -webkit-grab;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }

.ui-draggable-elem {
  color: #222;
  text-decoration: none;
  font-weight: normal;
  font-size: 11px;
  box-shadow: 0px 0px 3px rgba(0,0,0,0.15);
  z-index: 2001;
  opacity: 1;
  }  
  
.draggableElement.blockElem {
  display: block;  
  }  
  
.draggableElement:hover {
  border-color: #bbb;
  }

.draggableElement span:not(.highlight),
.ui-draggable-elem span:not(.highlight) {
  font-size: 11px;
  position: relative;
  padding-bottom: 4px;
  padding-top: 4px;
  padding-right: 4px;
  top: 0px;
  padding-left: 8px;
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }
  
.draggableElement:before,
.ui-draggable-elem:before {
  font-family: icomoon;
  content: "\e66f";
  font-size: 14px;
  color: #888;
  margin-top: -1px;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  }  
  
.draggableElement i,
.ui-draggable-elem i {
  color: #555;
  display: inline-block;
  font-size: 13px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  margin-left: 8px;
  }  
  
.draggableElement em,
.ui-draggable-elem em {
  font-size: 11px;
  color: #bbb;
  cursor: pointer;
  font-weight: bold;
  padding-left: 0px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  right: 4px;
  z-index: 2;
  }  

.draggableElement:hover em,
.draggableElement em:hover {
  color: #dd0000;
  }    

.draggableElement i ~ span:not(.highlight),
.ui-draggable-elem i ~ span:not(.highlight) {
  padding-left: 25px;
  }

.draggableElement em ~ span:not(.highlight),
.ui-draggable-elem em ~ span:not(.highlight) {  
  padding-right: 15px;
  }  
  
.draggableElement.noDrag:before {
  display: none;
  }
  
.draggableElement.noDrag span:not(.highlight) {
  padding-left: 0px;
  }

.draggableElement.noDrag i ~ span:not(.highlight) {
  padding-left: 16px;
  }  
  
.draggableElement.noDrag i {
  padding-left: 0;
  margin-left: 0;
  }  
  
.draggableElement.noDrag {
  cursor: default;
  }

.dropActive,
.ui-droppable.dropActive {
  border: 1px dashed #444;
  }  

.dropHover,
.ui-droppable.dropHover {
  background: #f8fdf9;
  border-color: #14892c;
  }
  
.ui-droppable.allowedTarget {
  transition: box-shadow 0.2s, background 0.3s;
  }

/* Layouts */
.flexMainContainer {
  display: -webkit-flex;
  display: flex;
  }

.flexElementContainer {
  -webkit-flex: 1 1 100%;
  flex: 1 1 100%;
  }

/* Custom colors */
.denimBlue       { background: #0d4051!important; }
.wisteria        { background: #9365b8!important; }
.neonCarrot      { background: #fba026!important; }
.chateauGreen    { background: #41a85f!important; }
.architectBlue   { background: #54ACD2!important; }
.redRum          { background: #B8312F!important; }
.purpleRain      { background: #553982!important; }
.sunLight        { background: #f37934!important; }
.almondFrost     { background: #a38f84!important; }
.energy          { background: #fac51c!important; }
.mountainBreeze  { background: #1abc9c!important; }
.ironGray        { background: #75706b!important; }
.cinnabar        { background: #e25041!important; }
.blackLodge      { background: #28324e!important; }
.bubblegum       { background: #ff73b5!important; }
.chambray        { background: #475577!important; }

.denimBlueC      { color: #0d4051!important; }
.wisteriaC       { color: #9365b8!important; }
.neonCarrotC     { color: #fba026!important; }
.chateauGreenC   { color: #41a85f!important; }
.architectBlueC  { color: #54ACD2!important; }
.redRumC         { color: #B8312F!important; }
.purpleRainC     { color: #553982!important; }
.sunLightC       { color: #f37934!important; }
.almondFrostC    { color: #a38f84!important; }
.energyC         { color: #fac51c!important; }
.mountainBreezeC { color: #1abc9c!important; }
.ironGrayC       { color: #75706b!important; }
.cinnabarC       { color: #e25041!important; }
.blackLodgeC     { color: #28324e!important; }
.bubblegumC      { color: #ff73b5!important; }
.chambrayC       { color: #475577!important; }

/* Drop Zone with progress bar and file details */
.dropZoneContainer {
  height: 180px;
  overflow: hidden;
  position: relative;
  }

.dropZoneContainer.disabled:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: white;
  opacity: 0.5;
  z-index: 1;
  }

.dropMsg {
  text-align: center;
  margin-top: 3px;
  margin-bottom: 2px;
  }

.dropMsg span {
  position: relative;
  top: -2px;
  }

.dropZone {
  cursor: auto;
  background: white;
  padding: 15px;
  color: #333;
  width: 100%;
  height: 100%;
  border: 1px dashed #bbb;
  border-radius: 2px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  transition: border-color 0.3s, background 0.3s;
  }

.dropZone.dropOver {
  background-color: #f8fdf9;
  border-color: #14892c;
  }

.uploadProgressBarCont {
  border-radius: 2px;
  overflow: hidden;
  bottom: 10px;
  margin: 0 5%;
  position: absolute;
  width: 90%;
  display: none;
  }

.uploadProgressBarRail {
  width: 100%;
  height: 6px;
  background: #e5e5e5;
  position: relative;
  }

.uploadProgressBarStatus {
  width: 0;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #1268a7; /* TODO: theme */
  }

.uploadedFile {
  position: relative;
  display: none;
  }

.uploadedFileIcon {
  border: 1px solid #ddd;
  border-radius: 3px;
  font-size: 60px;
  padding: 25px;
  text-align: center;
  }

.uploadedFileIcon i {
  color: #ddd;
  }

.uploadedFileDetails {
  position: relative;
  margin-top: 8px;
  }

.uploadedFileDetails li {
  padding: 0 25px 0 1px;
  position: relative;
  overflow: hidden;
  }

.removeUploadedFile {
  position: absolute;
  right: 0;
  top: 0;
  }

.uploadedFileSize {
  color: #999;
  font-size: 11px;
  }

/* Drop Zone compact and multiple version */
.compact.dropZoneContainer {
  height: auto;
  }

.compact .dropZone {
  padding: 15px;
  }

.compact .uploadedFileIcon {
  display: none!important;
  }

.compact .uploadProgressBarCont {
  margin: 0;
  bottom: -1px;
  width: 100%;
  }

.compact .uploadedFileDetails {
  margin: 1px 0 0;
  }

.compact .uploadedFileDetails li {
  padding: 3px 25px 4px 1px;
  }

.compact .uploadProgressBarRail {
  height: 3px;
  }

.compact .uploadedFileListElement {
  float: left;
  margin-right: 5px;
  }

.compact .uploadedFileSize {
  margin-top: 1px;
  }

.compact .removeUploadedFile {
  top: 4px;
  }

.multiple .dropMsg {
  }

.multiple .uploadProgressBarCont {
  bottom: -1px;
  }

.multiple .uploadedFileDetails li {
  padding: 0 25px 6px 1px;
  }

.multiple .uploadedFileDetails li:last-child {
  padding-bottom: 0;
  }

.multiple .uploadedFileDetails {
  border-top: 1px dotted #ddd;
  margin: 8px 0 0;
  padding-top: 5px;
  }

.multiple .removeUploadedFile {
  top: 1px;
  }

.boldText {
  font-weight: bold;
  }

.italicText {
  font-style: italic;
  }

.ok { color: green; }
.warn { color: #FFA800; }
.error { color: #e10000; }
.line { color: #eee; }

.ui-tooltip-close,
.ui-tooltip-close .ui-icon-close {
  background: none!important;
  border: 0!important;
  font-size: 14px!important;
  text-decoration: none!important;
  }

.ui-tooltip-title { font-weight: bold; } 

.smoothGrey {
  background: #f4f4f4;
  position: relative;
  border: 1px solid #ddd;
  }

.errorBox {
  background: #ffe8e8;
  border: 1px solid #e66161;
  color: #dd0000;
  padding: 5px 8px;
  display: inline-block;
  border-radius: 2px;
  }

.infoBox {
  background: #FFF1C7;
  border: 1px solid #fde08a;  
  padding: 5px 8px;
  display: inline-block;
  border-radius: 2px;
  }  

.infoBox.full {
  display: block;
  }
  
.separator {
  width: 1px;
  height: 24px;
  background: #fff;
  margin: 3px 15px;
  box-shadow: -1px 0 0 black;
  }

.loading {
  background: url(../ez_images/loading.gif) no-repeat;
  width: 19px;
  height: 19px;
  display: none;  
  }

.loadingSmall {
  background: url("../ez_images/loader_circular.gif") no-repeat;
  background-size: 12px 12px;
  width: 12px;
  height: 12px;
  display: none;
  }

.loadingSmallGrey {
  background: url("../ez_images/loader_circular_grey.gif") no-repeat;
  background-size: 12px 12px;
  width: 12px;
  height: 12px;
  display: none;
  }

.arrowUp {
  width: 0; 
  height: 0; 
  border-left-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-width: 5px;
  border-right-width: 5px;
  border-bottom-width: 8px;
  border-left-color: transparent;
  border-right-color: transparent;
  border-bottom-color: #333;
  }

.arrowDown {
  width: 0;
  height: 0;
  border-left-style: solid;
  border-right-style: solid;
  border-top-style: solid;
  border-left-width: 5px;
  border-right-width: 5px;
  border-top-width: 8px;
  border-left-color: transparent;
  border-right-color: transparent;
  border-top-color: #333;
  }

.arrowRight {
  width: 0;
  height: 0;
  border-top-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-width: 5px;
  border-bottom-width: 5px;
  border-left-width: 8px;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #333;
  }

.arrowLeft {
  width: 0;
  height: 0;
  border-top-style: solid;
  border-bottom-style: solid;
  border-right-style: solid;
  border-top-width: 5px;
  border-bottom-width: 5px;
  border-right-width: 8px;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-right-color: #333;
  }

.arrowMed {
  border-left-width: 4px;
  border-right-width: 4px;
  border-bottom-width: 7px;
  }

.arrowMed {
  border-left-width: 4px;
  border-right-width: 4px;
  border-top-width: 7px;
  }

.arrowMed {
  border-top-width: 4px;
  border-bottom-width: 4px;
  border-left-width: 7px;
  }

.arrowMed {
  border-top-width: 4px;
  border-bottom-width: 4px;
  border-right-width: 7px;
  }

.logSeparator {
  display: block;
  height: 0;
  border-bottom: 1px solid #eee;
  margin: 3px 0;
  }

/* Font Icons customizations */
.rotate45 {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  }

.rotate90 {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  }

.rotate180 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
  }

.fa,.im {
  color: #333;
  }

.fa.white, 
.im.white {
  color: white;
  }

.fa.grey,
.im.grey {
  color: #aaa;
  }

.fa.iconDark,
.im.iconDark {
  color: #000;
  opacity: 0.75;
  }

.fa.trash-size {
  font-size: 14px;
  }

.fa.iconDark:hover,
.im.iconDark:hover { opacity: 1; }

.fa.iconGrey,
.im.iconGrey {
  color: #000;
  opacity: 0.45;
  }

.fa.iconGrey:hover,
.im.iconGrey:hover { opacity: 0.75; }

.fa.iconLight,
.im.iconLight {
  color: #fff;
  opacity: 0.2;
  }

.fa.iconLight:hover,
.im.iconLight:hover { opacity: 0.5; }

.fa.iconDarkLight,
.im.iconDarkLight {
  opacity: 0.2;
  }

.fa.iconDarkLight:hover,
.im.iconDarkLight:hover { opacity: 0.5; }

.fa.iconWhite,
.im.iconWhite {
  color: #fff;
  opacity: 0.75;
  }

.fa.iconWhite:hover,
.im.iconWhite:hover { opacity: 1; }

.fa.smallIcon,
.im.smallIcon {
  font-size: 12px;
  }

.fa.mediumIcon,
.im.mediumIcon {
  font-size: 20px;
  }

.fa.inactiveIcon,
.im.inactiveIcon,
.fa.inactiveIcon:hover,
.im.inactiveIcon:hover { opacity: 0.2; }

.im {
  display: inline-block;
  position: relative;
  top: 1px;
  }

.im-lg {
  font-size: 1.3333333333333333em;
  line-height: 0.75em;
  }

.im-mlg {
  font-size: 1.5555555555555555em;
  line-height: 0.75em;
  }

.im-vlg, .fa-vlg {
  font-size: 1.6666666666666666em;
  line-height: 0.75em;
  }

.im.iconRed, .fa.iconRed {
  color: #cd0000;
  }

.im.iconRed:hover, .fa.iconRed:hover,
.im.themeColor:hover, .fa.themeColor:hover {
  opacity: 0.85;
  }

.im.disabled, .fa.disabled,
.im.disabled:hover, .fa.disabled:hover {
  color: #999;
  opacity: 0.45;
  cursor: default!important;
  }

.iconBeforeText {
  margin-left: 4px;
  }

.iconAfterText {
  margin-right: 4px;
  }

.fa.iconBeforeText {
  margin-left: 5px;
  }

.fa.iconAfterText {
  margin-right: 5px;
  }  
  
.consentText {
  background: #f7f7f7;
  padding: 6px 8px;
  color: #cc0000;
  border-radius: 2px;
  }

/* Auto Save */
.autoSaveFeedback {
  border-left: 1px dotted #aaa;
  display: block;
  float: left;
  margin-left: 5px;
  padding-left: 6px;
  position: relative;
  top: 7px;
  }

.iconButton[disabled].triggerAutoSave {
  opacity: 0.6;
  }

.iconButton[disabled].triggerAutoSave i {
  opacity: 1!important;
  color: #222!important;
  }

.autoSaveIcon,
.iconButton i.autoSaveIcon {
  font-size: 18px;
  color: #414245;
  position: relative;
  top: 0;
  }

.triggerAutoSave:hover .autoSaveIcon {
  color: #222;
  }

.autoSaveFeedbackIcons {
  display: inline-block;
  }

.autoSaveFeedbackIcons.resultIsOk .autoSaveIcon:before {
  font-family: icomoon;
  content: "\e802";
  }

.autoSaveFeedbackIcons.resultIsFail .autoSaveIcon:before {
  font-family: icomoon;
  content: "\e801";
  color: #cd0000;
  }

.autoSaveStatus {
  color: #666;
  position: relative;
  vertical-align: middle;
  }

.autoSaveFeedbackIcons.resultIsFail + .autoSaveStatus {
  color: #cd0000;
  }

/* opacity settings */
#tbBg {
  opacity: .2; /* FF gt 1.5, Opera, Safari */
  filter: alpha(opacity=20); /* IE lt IE8 */
  -ms-filter: "alpha(opacity=20)"; /* IE8 */
  }

.separator {
  opacity: .2;
  filter: alpha(opacity=20);
  -ms-filter: "alpha(opacity=20)";
  }

.dbIcoBorder {
  opacity: .1;
  filter: alpha(opacity=10);
  -ms-filter: "alpha(opacity=10)";
  }

.dbIcoBorder_sm {
  opacity: .1;
  filter: alpha(opacity=10);
  -ms-filter: "alpha(opacity=10)";
  }

#tbTasks .inactive .wrapC, 
#hTasks .inactive .wrapC {
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
  }

#tbTasks .inactive, #hTasks .inactive { opacity: .5; }

.rBoxBg *, .rBoxBgPop * {
  opacity: .2;
  filter: alpha(opacity=20);
  -ms-filter: "alpha(opacity=20)";
  }

/* Popup Shadow */
.rBoxBgPop {
  box-shadow: 1px 1px 7px rgba(0,0,0,0.2);
  border-radius: 12px;
  }

/* background handling */
#bg * { margin: 0; padding: 0; }

#bg { position: fixed; }
#bg div {
  height: 200%;
  left: -50%;
  position: absolute;
  top: -50%;
  width: 200%;
  }

#bg td { text-align: center; vertical-align: middle; }

#bg img {
  margin: 0 auto;
  min-height: 50%;
  min-width: 50%;
  }

/* Inline editable elements */

.inlineEditInput.hide,
.inlineEditElem.hide {
  display: none;
  }

.inlineEditInput {
  position: relative;
  font-family: Verdana;
  min-width: 200px;
  }

.inlineEditable {
  position: relative;
  padding: 3px;
  margin-left: -5px;
  }

.inlineEditElem {
  position: relative;
  padding: 4px 25px 5px 5px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  display: inline-block;
  cursor: text;
  line-height: normal;
  }

.inlineEditElem:hover {
  background: white;
  border-radius: 3px;
  box-shadow: 0 0 3px rgba(0,0,0,0.5);
  z-index: 1;
  }

.inlineEditElem:after {
  font-family: icomoon;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  padding-left: 5px;
  position: absolute;
  right: 5px;
  top: 5px;
  content: "\e637";
  color: #222;
  }

.inlineEditElem.noEditIcon {
  padding: 5px;
}

.inlineEditElem.noEditIcon:after {
  display: none;
}

/* x-editable customization */
/* Editable selector */

.select-container .fa-plus {
  color: #333;
  margin-right: 10px;
  }

.color-rect {
  display: inline-block;
  width: 10px;
  height: 10px;
  border: 1px solid #eee;
  margin-right: 10px;
  position: relative;
  top: 1px;
  }

.customAddElem {
  margin-right: 10px;
  margin-left: 2px;
  }

.editable-input .editable-clear-x {
  background: none;
  cursor: pointer;
  opacity: 1;
  height: 14px;
  width: 14px;
  margin-top: 0;
  font-size: 15px;
  position: absolute;
  top: 3px;
  right: 6px;
  color: #d7d7d7;
  }

.editable-input .editable-clear-x:before {
  font-family: fontawesome;
  content: "\f057";
  }

.editable-input .editable-clear-x:hover {
  color: #b9b9b9;
  } 

.inlineEditElem.editable {
  border-bottom: 1px solid transparent;
  color: #232323;
  } 

.inlineEditElem.editable-empty, 
.inlineEditElem.editable-empty:focus {
  color: #777;
  font-style: italic;
  font-weight: normal;
  }

.inlineEditElem.editable-empty:hover {
  color: #232323;
  } 

.editable-buttons button {
  margin-left: 0!important;
  margin-right: 3px!important;
  margin-top: 4px!important;
  }

.editable-submit > i.im { color: green; }
.editable-cancel > i.im { color: #dd0000; }

.whiteEditableBtns .editable-submit > i.im, 
.whiteEditableBtns .editable-cancel > i.im { 
  color: white; 
  }

.fullWidthInputsCont .editable-buttons button {
  margin-left: 0!important;
  margin-right: 6px!important;
  margin-top: 3px!important;
  }

.fullWidthInputsCont .editable-container.editable-inline {
  width: 100%;
  padding-right: 50px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }

.fullWidthInputsCont .editable-container .editable-input {
  padding: 0;
  width: 100%;
  margin-bottom: 2px;
  }

.fullWidthInputsCont .editable-container .editable-input input {
  width: 100%;
  }


/* LOGIN elements */
/* Scrolling in login page */
body.bodyScroll {
  overflow: auto;
}

body.bodyScroll #container {
  overflow: visible;
}

#loginForm {
  width: 100%;
  height: 100%;
}

.centerWrapTable {
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  max-width: 100%;
  }

.centerContainer {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  text-align: center;
  }

.centerMainElement {
  display: inline-block;
  position: relative;
  }
  
#loginBox, #aboutBox, #logoutBox {
  text-align: left;
  z-index: 1001;
  margin: 10px 5px;
  display: inline-block;
  position: relative; 
  }

#loginBox {
  display: none;  
  }  
  
#aboutBox {
  z-index: 1000; 
  display: none;
  }

.loginContainer {
  margin: 0 10px;
  }

.contentHeaderC.loginLogosCont {
  height: 50px;
  }

.loginContainer .popupMainContent.ipadFlip {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  }

.legacyLoginElements {
  display: none;  
  }

.iconUserGroups.loginGroup {
  cursor: pointer;
  position: absolute;
  right: 60px;
  top: 7px;
  }

.iconUserGroups.active {
  opacity: 0.75;
  }

.caeHealthcareLogo {
  background: url(../ez_images/logo_cae_healthcare_white_2x.png) no-repeat;
  background-size: 138px 35px;
  width: 138px;
  height: 35px;
  }

.caeHealthcareLogo.login {
  margin: 0 auto;
  margin-top: 7px;
  margin-bottom: 7px;
  cursor: pointer;
  position: absolute;
  top: -55px;
  left: 0;
  right: 0;
  display: inline-block;
  }

.uniLogo img {
  max-width: 55%;
  margin: 10px 0 20px;
  }

.learningSpaceLogoBig {
  background: url(../ez_images/ls_intuity_logo_color.png) no-repeat 0 0;
  background-size: 135px 67px;
  background-position-x: 0%;
  background-position-y: 0%;  
  width: 135px;
  height: 67px;
  }

.learningSpaceLogoBig.smallScreen {
  display: none;
  }
  
.logoContainer {
  margin-top: 20px;
  margin-bottom: 20px;
  position: relative;
  }

.learningSpaceLogoBig.login {
  margin: 0 auto;
  }

.loginWelcome {
  color: #777;
  font-weight: 200;
  font-size: 32px;
  }

.itemLineLogin {
  padding: 0 30px;
  }

.clientName {
  color: #555;
  font-weight: 200;
  font-size: 17px;
  margin-bottom: 12px;
  padding: 0 40px;
  }

.clientName a {
  cursor: pointer;
  color: #555!important;
  font-weight: 200;
  text-decoration: none!important;
  }

.clientName a:hover {
  text-decoration: underline!important;
  }

.toggleLegacyLoginCont {
  display: none;
  }

.GOUltraportableLastSyncStatus {
  background: #f4f4f4;
  border-radius: 2px;
  padding: 6px 0;
  }

.easyLoginCont {
  margin: 10px auto 25px;
  text-align: center;
  }

.easyLoginType {
  margin: 0 0 10px;
  color: #333;
  font-size: 14px;
  font-weight: bold;
  }

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

.EZMessagesCont.login {
  padding: 0 30px;
  margin-top: 0px;
  }

.EZMessagesCont.show {
  visibility: visible;
  opacity: 1;
  display: block;
  }

#userSelector {
  position: relative;
  }

#groupSelector {
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  }

#groupSelector.show {
  visibility: visible;
  opacity: 1;
  }

.loginInputs {
  padding-bottom: 10px;
  position: relative;
  bottom: 0;
  }

.loginInputs input {
  padding: 0 0 0 8px;
  height: 29px!important;
  font-size: 13px;
  }

.loginInputs input,
.loginInputs button,
.fullWidthBtn button,
.fullWidthInput input {
  width: 100%;
  margin: 0;
  }

.loginInputCont {
  padding: 0 90px;
  margin: 7px 0;
  }

.logoutButtons a {
  display: inline-block;
  margin-top: 5px;
  }

.loginLinks {
  text-align: center;
  color: #666;
  }

.passLink {
  padding-top: 20px;
  padding-bottom: 10px;
  }

.regLink {
  padding-bottom: 5px;
  }

.bottomLinks {
  padding: 2px 30px;
  font-size: 11px;
  }

.bottomLinks a {
  text-decoration: none;
  font-weight: normal;
  }

.bottomLinks a:hover {
  text-decoration: underline;
  }

.bottomLinks ~ .aboutLSLink {
  margin-top: 10px;
  }

.redirect {
  color: #888;
  }

/* Login 3D flip */
.flipWrap {
  perspective: 800px;  
}

.flipCont {
  transform-style: preserve-3d;
  transition: transform 0.6s;    
}

.flipCont.flipped {
  transform: rotateY( 180deg ); 
}

.flipFront, .flipBack {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden; 
}

.flipBack {
  transform: rotateY( 180deg );
}

/*
.flipCont {
  width: 100%;
  height: 100%;
  
  -webkit-perspective: 1500;
  -moz-perspective: 1500;
  -ms-perspective: 1500;
  perspective: 1500;
  }

.flipCont.animate .flipBack {
  -moz-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
  }

.flipCont.animate .flipFront {
  -moz-transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  transform: rotateY(180deg);
  }

.flipWrap {
  -moz-transition: transform 0.6s, opacity 0.3s;
  -webkit-transition: -webkit-transform 0.6s, opacity 0.3s;
  -moz-transition: transform 0.6s, opacity 0.3s;
  transition: transform 0.6s, opacity 0.3s;
  
  -moz-transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  
  position: relative;
  width: 100%;
  height: 100%;
  }

.flipFront, .flipBack {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  
  -moz-transition: transform 0.6s, opacity 0.3s;
  -webkit-transition: -webkit-transform 0.6s, opacity 0.3s;
  -moz-transition: transform 0.6s, opacity 0.3s;
  transition: transform 0.6s, opacity 0.3s;
  
  -moz-transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  
  position: absolute;
  top: 0;
  left: 0;
  }

.flipFront {
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
  z-index: 2;
  }

.flipBack {
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  }
*/
  
/* Initial settings */
#initialSetupBox .setting-value {
  width: 200px;
  }

#initialSetupBox .setting-value.passwordInput,
#initialSetupBox .setting-label.error {
  width: auto;
  }

/* Portable Unit settings */
#portableUnitInitSetupBox .setting-label {
  width: 155px;
  }

#portResults.portTestOk i:before {
  content: "\f00c";
  color: green;
  }

#portResults.portTestFail i:before {
  content: "\f00d";
  color: #cc0000;
  }
  
#portResults i {
  font-size: 16px;
  }

#portResults {
  min-height: 17px;
  }

.puMessage {
  padding: 10px 0;
  text-align: center;
  }

.puMessagesCont .EZMessage {
  padding: 8px;
  text-align: left;
  }

.portFailHead {
  margin-bottom: 5px; 
  }

.portFailPorts {
  margin-bottom: 10px;
  }  
 
 #serverAddressTitle {
  padding: 7px 0 8px;
  font-weight: bold;
  }

/* Synchronize */
#btnPuSync.puSyncBtn {
  background: transparent;
  border: none;
  box-shadow: none;
  font-size: 19px;
  position: relative;
  margin: 0;
  padding: 0;
  }

#btnPuSync.puSyncBtn:before,
#btnPuSync.puSyncBtn:after {
  background: none;
}

#btnPuSync[disabled].puSyncBtn {
  opacity: 0.45;
  background: transparent!important;
  border: none!important;
  box-shadow: none!important;  
  }

.stageTextCont {
  padding: 10px  0;
  }  
  
.currentStage {
  margin-bottom: 5px;
  }
  
.currentStage .fa {
  color: #fff;
  visibility: hidden;
  }
  
.currentStage .stageText {
  color: #aaa;
  margin-left: 10px;
  }

.currentStage.current .stageText {
  color: #231f20;
  }
  
.currentStage.current .loadingSmall {
  display: inline-block;
  }  
  
.currentStage.current .fa {
  display: none;
  width: 12px;
  }    
  
.currentStage.current.done .loadingSmall {
  display: none;
  }   
  
.currentStage.current.done .fa {
  color: mediumSeaGreen;
  visibility: visible;
  display: inline-block;
  }

.currentStage.current.done.failed .fa:before {
  color: #e25041;
  visibility: visible;
  content: "\f00d";
  }

.initialCurrentStage {
  border: 1px solid transparent;
  margin: 10px 0 8px;
  }
  
.initialCurrentStage .stageTextCont {
  padding: 10px;
  }

.welcomeInitCont {
  margin: 10px 0;
  padding: 0 12px;
  }

.welcomeInitCont p.welcomeHead { 
  color: #555;
  font-size: 20px;
  font-weight: 300;
  }

.welcomeInitCont p.welcomeInfo {
  margin-top: 15px;
  margin-bottom: 15px;
  font-size: 12px;
  color: #777;
  }
  
/* main/constant layout elements */
#container {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  }

#header {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  z-index: 999;
  }

#header.absoluteHeader {
  position: absolute;
  }
  
#header i {
  color: #fff;
  }

.logoCaeLs {
  position: relative;
  z-index: 1;
  width: 282px;
  height: 35px;
  cursor: pointer;
  background: url(../ez_images/logo_cae_ls.png) no-repeat center center;
  }

#placardMain .logoCaeLs {
  padding: 7px;
  }

#logo {
  position: relative;
  z-index: 10;
  width: 282px;
  height: 34px;
  margin: 5px 0 0 0px;
  cursor: pointer;
  background: url(../ez_images/logo_cae_ls_ez.png) no-repeat center center;
  }

#headerBar {
  height: 100%;
  margin: 0 10px;
  position: relative;
 /* overflow: hidden;*/
  }

#headerBarBg {
  position: absolute;
  width: 100%;
  top: 0; left: 0;
  height: 100%;
  border-radius: 0 0 4px 4px;
  background: #000;
  }

#headerBarBgL {
  display: none;
  }

#headerBarBgC {
  width: auto;
  }

#headerBarBgR {
  display: none;
  }

#foot {
  left: 0;
  position: absolute;
  top: 44px;
  width: 100%;
  }

#footSeparator {
  background: #FFFFFF;
  border-top: 1px solid #000000;
  height: 1px;
  opacity: 0.25;
  position: relative;
  top: 1px;
  width: 100%;
  }

#slideContainer {
  height: 40px;
  }

#content {
  top: 45px;
  bottom: 17px;
  position: absolute;
  width: 100%;
  } 

#content.noHeader {
  top: 20px;
  bottom: 20px;
  }

.settings_ov,
.mainSectionOV {
  overflow: visible!important;
  }

#taskbar {
  height: 100%;
  margin: 0 10px;
  position: relative;
  }

/* ** HEADERBAR Elements ** */

/* Header Page Controls, back, home, logo  */
#headerPageControls {
  float: left;
  position: relative;
  height: 45px;
  z-index: 10;
  }

#pageControls {
  float: left;
  height: 45px;
  line-height: 45px;
  }

#pageControls #goBack {
  cursor: pointer;
  font-size: 15px;
  }

#pageControls #goHome {
  float: left;
  position: relative;
  top: 2px;
  }

#pageControls #logoCAE {
  background: url(../ez_images/logo_cae_2x.png) no-repeat center center;
  background-size: 57px 28px;
  float: left;
  margin-top: 7px;
  width: 57px;
  height: 28px;
  opacity: 1;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  }

#pageControls #logoLS {
  background: url(../ez_images/ls_intuity_logo_oneline_white.png) no-repeat 0 0;
  background-size: 147px 22px;
  background-position-x: 0%;
  background-position-y: 0%;  
  float: left;
  width: 147px;
  height: 22px;
  margin-left: 13px;
  margin-top: 17px;
  }

#pageControls .logoCont {
  float: left;
  position: relative;
  margin-left: 12px;
  }

.hoverEffect #pageControls .logoCont {
  cursor: pointer;
  }

/* Header Elements, record controls */
#headerElements { 
  line-height: 45px; 
  z-index: 10;
  float: left;
  position: relative;
  }

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

.simPatient { font-weight: bold; }

#camStatus {
  padding-left: 25px;
  background: url(../ez_images/ico_tb_rec_settings_w.png) no-repeat left center;
  font-weight: bold;
  }

#headRecLi,
#headStopLi{
  display: none;
  }

/* Header Controls, header icons */
#headerControls { 
  position: relative; 
  z-index: 10; 
  line-height: 45px; 
  overflow: hidden;
  height: 45px;
  right: 0;
  position: absolute;
  }

#headerControls a:hover,
#headerControls a:visited,
#headerControls a:active,
#headerControls a:hover {
  text-decoration: none;
  } 

#headerControls > ul {
  float: right;
  overflow: hidden;
  }

#headerControls > ul li {
  float: left;
  }

#userInfo {
  max-width: 285px;  
  }  
  
#headerUserInfo {
  float: right;
  position: relative;
  margin-right: 5px;
  }

#headerUserInfo .loggedUserName {
  color: white;
  }

#headerUserInfo i {
  overflow: hidden;
  top: 0!important;
  }
  
#windowLayoutLi {
  display: none;
  }

#windowLayout {
  cursor: pointer;
  }

#printAnnots {
  padding-left: 14px;
  background: url(../ez_images/ico_tb_print.png) no-repeat left center;
  }

#windowVisibilityInfoTip { top: 20px }
.popup.simple #windowVisibilityInfoTip { top: 10px; }

#headRoomSelectorLi {
  display: none;
  }

#fullscreenLayoutLi {
  display: none;
  }

#fullscreenLayout {
  cursor: pointer;
  padding-left: 13px;
  background: url(../ez_images/ico_fullscreen_layout.png) no-repeat left center;
  }

.aLink {
  padding: 15px 10px 12px;
  }

#switchSkin {
  color: white;
  }

#header #switchSkin.im { 
  font-size: 18px; 
  padding: 0 2px 0 0;
  }

.headerArrowDown {
  font-size: 11px!important;
  position: relative;
  top: 0px!important;
  }

#headerBar .im,
#headerBar .fa {
  font-size: 17px;
  position: relative;
  top: 2px;
  line-height: 44px;
  }

/* Header Messages */
#headerMessages ul#EZmsg li { 
  display: block; 
  float: right; 
  margin: 0; 
  padding: 0;
  height: auto;
  }

/* ** HEADER CONTROLS ** */
#mainLoader, #headerMessages ul li#sMsg {
  position: relative;
  z-index: 10;
  display: none;
  height: auto;
  }

.mainLoaderImg {
  background: url(../ez_images/loader_table_2x.gif) no-repeat;
  background-size: 16px 16px;
  width: 16px;
  height: 17px;
  display: inline-block;
  float: right;
  position: relative;
  top: 1px;
  }

.mainLoader {
  background: url(../ez_images/loader_table_2x.gif) no-repeat;
  background-size: 16px 16px;
  width: 16px;
  height: 17px;
  display: inline-block;
  position: relative;
  }

#mainLoader { z-index: 11; margin-left: 2px; }

.mainLoaderMsg {
  color: #555;
  position: relative;
  display: none;
  }

#sMsgC, #mainLoaderC {
  background-color: #31B564;
  padding: 6px 12px;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  min-height: 31px;
  }

.sMsgalert #sMsgC { background-color: #FF613A; }
.sMsgwarn #sMsgC {  background-color: #ffe69c; }

.sMsgwarn #sMsgC p, 
.sMsgwarn #sMsgC i.sMsgClose, 
.sMsgwarn #sMsgC a {
  color: #333;
  }

.sMsgwarn #sMsgC a {
  margin-right: 10px;
  padding: 2px 0;
  float: left;
  font-size: 12px;
  position: relative;
  top: 2px;
  text-decoration: underline;
  }

.sMsgwarn #sMsgC a:hover {
  text-decoration: none;
  }

#sMsg p, #mainLoaderC p {
  font-size: 12px;
  margin-right: 10px;
  color: #fff;
  max-height: 40px;
  float: left;
  overflow: auto;
  padding: 2px 0;
  position: relative;
  top: 0px;
  }

#mainLoaderC p { color: #222; }
#sMsg p { margin-right: 10px; }

#mainLoaderC {
  background-color: #fff;
  } 

#sMsg i.sMsgClose {
  color: white;
  font-size: 10px;
  top: 4px;
  cursor: pointer;
  }

/* General messages */

.EZMessagesCont {
  text-align: center;
  display: none;
  visibility: hidden;
  margin: 10px 0px 10px 0px;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  }

.EZMessage {
  padding: 8px 10px;
  border-radius: 8px;
  color: white;
  display: inline-block;
  font-size: 12px;
  }

.loadingMessage {
  display: flex;
  display: -webkit-flex;
  align-items: center;
  -webkit-align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
  }

.EZMessage .spinner {
  margin-right: 6px;
  }

.EZMessage.message {
  background: #31b564;
  }

.EZMessage.alert {
  background: #FF613A;
  }

.EZMessage.info {
  background: #ffeeb8;
  color: #222;
  }

.EZMessagesCont.fullWidth .EZMessage {
  display: block;
  }

.EZMessagesCont.paddingFix {
  margin: 0 12px;
  }

.portableUnitIsSyncNowCont {
  padding: 10px 0;
  }  
  
.portableUnitIsSyncNow {
  margin-bottom: 15px;
  }  

.portableUnitComeBack {
  margin-bottom: 5px;
  }
  
/* **ez_dashboard your events** */

#eventsContainer {
  text-align: left;
  position: relative;
  }

#eventsContHead {
  overflow: hidden;
  width: 1027px;
  height: 43px;
  }

.eventsContHeadIco {
  *float: left;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
  position: absolute;
  *position: relative;
  width: 210px; 
  height: 32px;
  }

#yevToggle { display: none; }

#yevContents {
  min-height: 250px;
  }

.eventsContToggleIco, .eventsContToggleIcoPlus {
  float: right;
  margin: 13px;
  margin-right: 15px;
  padding: 0 0 0 0;
  position: relative;
  width: 20px;
  height: 18px;
  cursor: pointer;
  background: url(../ez_images/icon_toggle2.png) no-repeat left !important;
  }

.eventsContToggleIcoMinus {
  float: right;
  margin: 13px;
  margin-right: 15px;
  *margin-left: 0px;
  padding: 0 0 0 0;
  position: relative;
  width: 20px;
  height: 18px;
  cursor: pointer;
  background: url(../ez_images/icon_toggle.png) no-repeat left !important;
  }

.headLineCu, .headLineUp {
  *float: left;
  margin-left: 21px;
  width: 105px;
  height: 2px;
  }

.headLineUp {
  width:120px;
  }

.settingsSmall {
  background: url(../ez_images/settings_small.png) no-repeat 0 0;
  width: 13px;
  height: 13px;
  display: inline-block;
  }.settingsSmall:hover { background-position: 0 100%; }

.yevEventSettings {
  position: relative;
  cursor: pointer;
  }

/* ** TASKBAR Elements * **/

#taskbar { position: relative; height: 33px; }
#tbBg {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 33px;
  background: black;
  border-radius: 3px 3px 0 0;
  }

#tbControl, #tbContent { position: absolute; z-index: 2; }
#tbControl { position: absolute; right: 0; top: 0; }
#tbContent { position: relative; }

#tbControl ul li { display: block; float: right; margin-right: 15px; }
#tbContent ul li { display: block; float: left; }

/* right panel elements */
.time { font-weight: bold; }

/* icon panel elements */
#tbIcons { padding: 3px 0 0 0; overflow: hidden;  float: left; }
#tbIcons li { margin-bottom: 5px; margin-right: 10px; }
#tbIcons .separator { margin-left: 0; margin-right: 0; }
#tbIcoHelp { padding: 0; position: absolute; right: 0; }

.tbIco {
  -webkit-transition: opacity 0.3s;
  -moz-transition: opacity 0.3s;
  transition: opacity 0.3s;
  opacity: 1; 
  }

.tbIco.parentPanelIsHide {
  opacity: 0.5;
  }

.tbIco {
  width: 16px;
  height: 18px;
  background-position: 0 0; 
  background-repeat: no-repeat;
  cursor: pointer;
  }

#annotsToggle { background-image: url(../ez_images/ico_tb_annots.png); }
#recCtrlToggle { background-image: url(../ez_images/ico_tb_rec_settings.png); }
#icomCtrlToggle { background-image: url(../ez_images/ico_tb_icom_control.png); }
#dataEntryToggle { background-image: url(../ez_images/ico_tb_data_entry.png); }
#settingsSave { background-image: url(../ez_images/ico_tb_save.png); }
#printButton { background-image: url(../ez_images/ico_tb_print.png); }

#annotsToggle.disabled { background-image: url(../ez_images/ico_tb_annots_disabled.png); }
#recCtrlToggle.disabled { background-image: url(../ez_images/ico_tb_rec_settings_disabled.png); }
#icomCtrlToggle.disabled { background-image: url(../ez_images/ico_tb_rec_settings_disabled.png); }
#dataEntryToggle.disabled { background-image: url(../ez_images/ico_tb_data_entry_disabled.png); }

#goHelp {
  display: block;
  background-image: url(../ez_images/ico_tb_help.png);
  }

#icomCtrlToggle {
  position: relative;
  top: -2px;
  }

/* task buttons */
#tbTasks { padding-top: 3px; margin: 0 10px; overflow: hidden; }
#hTasks * { display: block; text-decoration: none; }
#tbTasks * { text-decoration: none; }
#tbTasks i { color: #333; margin-right: 7px; }

#tbTasks li { margin-right: 10px; margin-bottom: 5px; }
#hTasks { overflow: hidden; margin-right: 20px; height: 30px; }
#hTasks li { display: block; height: 30px; margin-left: 3px; float: right!important; position: relative; padding: 0; }
#tbTasks li a, #hTasks li div { width: 100%; position: relative; color: #333; font-weight: normal; padding-left: 21px; }
#tbTasks li a { padding-left: 0; }
#hTasks li div { height: 30px; padding-left: 0; }
#hTasks li div a { float: left; font-weight: normal; cursor: pointer; } 
#hTasks li div a:hover { font-weight: bold; } 
#tbTasks .wrapC, #hTasks .wrapC {
  zoom: 1;
  line-height: 28px;
  height: 28px;
  background: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: url(../ez_images/tb_item_bg.png) repeat-x top left;
  }

#hTasks .wrapC {
  line-height: 30px;
  height: 30px;
  padding: 0 6px;
  background: #FFF;
  border-radius: 4px;
  opacity: .95;
  filter: alpha(opacity=95);
  -ms-filter: "alpha(opacity=95)";
  }

#hTasks li div a.hTasksClose {
  font-size: 13px;
  } 

#hTask {
  display: block;
  margin-right: 20px;
  overflow: hidden;
  }

.headerTaskCont {
  float: right;
  position: relative;
  margin-top: 7px;
  }

#tbTasks li a:hover .wrapC { background-position: bottom left; }
#tbTasks .wrapCont, #hTasks .wrapCont {
  display: inline-block;
  line-height: 28px;
  padding: 0 3px 0 25px;
  } #hTasks .wrapCont { font-size: 11px; line-height: 30px; padding: 0; width: 100%; }

/* header specific */
#headerTaskLi {
  display:none;
}

#hTaskAdd {
  background: #fff;
  border-radius: 6px;
  position: absolute; 
  right: 0; 
  width: 14px; 
  height: 30px; 
  line-height: 30px;
  top: 0px; 
  text-align: center; 
  cursor: pointer; 
  color: #023752;
  font-size: 14px;
  font-family: sans-serif;
  }

#hTaskAdd:hover { font-weight: bold; }

#hTaskAdd.inactive {
  font-weight: normal!important;
  cursor: default;
  opacity: 0.5;
  }

#headerMessages { position: absolute; top: 7px; left: 0; right: 0; padding: 0 10px; }
#EZmsg { position: relative; display: table; margin: 0 auto; z-index: 3000; }
.headerOverlay { 
  background: url(../ez_images/overlay_black_20.png) repeat center top; 
  width: 100%; 
  height: 45px; 
  position: absolute; 
  top: -9000px; 
  z-index: 99;
  display: none!important;
  border-radius: 0 0 2px 2px;
  }

#hTasks .wrapC { position: relative; width: 55px;}
.taskArrow {
  position: relative;
  height: 12px;
  top: 1px;
  *width: 70px;
  }

#hTasks a {
  color: #023752; 
  }

/* ** ROUNDED BOX FORMATTING ** */

.rBox {
  position: relative;
  }

.popup.rBox, .relPopup.rBox {
  /*box-shadow: 0 0 0 3px rgba(0,0,0,0.2), 1px 1px 20px rgba(0,0,0,0.3);*/
  }

#panels {
  height: 100%;
  float: left;
  margin-left: 20px;
  position: relative;
  top: 2px;
  -webkit-transform: translateZ(0);
  }

.panel.panelIn {
  /* We cannot use transate3d for left pos because translate3d and fixed position bug */
  /*-webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);*/
  /*left: 0;*/
  }

.panel.panelOut {
  /*-webkit-transform: translate3d(-1000px, 0px, 0px);
  -moz-transform: translate3d(-1000px, 0px, 0px);
  -ms-transform: translate3d(-1000px, 0px, 0px);
  transform: translate3d(-1000px, 0px, 0px);*/
  /*left: -1000px;*/
  }

.panel {
  /*-webkit-transform: translate3d(-1000px, 0px, 0px);
  -moz-transform: translate3d(-1000px, 0px, 0px);
  -ms-transform: translate3d(-1000px, 0px, 0px);
  transform: translate3d(-1000px, 0px, 0px); */
  position: relative;
  left: -1000px;
  /*-webkit-transition: left 0.3s ease;
  -moz-transition: left 0.3s ease;
  -ms-transition: left 0.3s ease;
  transition: left 0.3s ease;*/
  }

#panels .panelOutHidden { 
  position: absolute; 
  width: 1px;
  height: 1px;
  overflow: hidden;
  }

#panels.noSidePanel {
  margin-left: 5px;
  }

#panels .rBox { margin: 2px 5px 12px; }

.ezRoomSelectorPanels #recCtrl,
.ezRoomSelectorPanels #icomCtrl {
  width: 300px;
  }

#recCtrl { 
  z-index: 2; 
  position: 
  relative; 
  }

#icomCtrl { 
  z-index: 1; 
  position: relative; 
  }

#annots { 
  z-index: 1; 
  position: relative; 
  }

#dataEntry { 
  z-index: 1; 
  position: relative; 
  }

.panelsSideCtrlsCont {
  position: absolute;
  top: 5px;
  bottom: 0px;
  width: 20px;
  }

.panelsSideCtrlsCont ul {
  list-style: none outside none;
  margin: 0;
  padding: 0;  
  }

.panelsSideCtrlsCont ul > li {
  position: relative;
  color: #222;
  background: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 12px;
  line-height: 12px;
  overflow: hidden;
  width: 18px;
  margin-bottom: 10px;
  border-radius: 0 2px 2px 0;
  opacity: 1;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  }

.panelsSideCtrlsCont ul > li.out {
  opacity: 0.2;
  }

.panelsSideCtrlsCont ul > li span:after {
  content: "";
  float: left;
  margin-top: 100%;
  }

.panelsSideCtrlsCont ul > li span {
  display: inline-block;
  margin: 10px 0;
  left: -5px;
  position: relative;
  -moz-transform: translate(20px, 0px) rotate(90deg);
  -webkit-transform: translate(20px, 0px) rotate(90deg);
  -ms-transform: translate(20px, 0px) rotate(90deg);
  transform: translate(20px, 0px) rotate(90deg);
  -moz-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  white-space: nowrap;
  }

.panelsSideCtrlsCont ul > li.hidden {
  display: none;
  }

.rBoxBg, .rBoxBgPop {
  width: 100%; height: 100%;
  }

.rBoxBgTL, .rBoxBgTR, .rBoxBgBL, .rBoxBgBR {
  position: absolute;
  width: 12px;
  height: 12px;
  background: url(../ez_images/pBgCorner.png) no-repeat top left;
  }
.rBoxBgTL { top: 0; left: 0; }
.rBoxBgTR { background-position: top right; top: 0; right: 0; }
.rBoxBgBL { background-position: bottom left; bottom: 0; left: 0; }
.rBoxBgBR { background-position: bottom right; bottom: 0; right: 0; }
.rBoxBgV, .rBoxBgH, .rBoxBgVPop, .rBoxBgHPop { background-color: #000; position: absolute; }
.rBoxBgV, .rBoxBgVPop { top: 0; left: 12px; }
.rBoxBgH, .rBoxBgHPop { top: 12px; left: 0; }

.rBoxCont, .rBoxContPop {
  position: relative;
  }

.rBoxTL, .rBoxTR, .rBoxBL, .rBoxBR {
  position: absolute;
  width: 8px;
  height: 9px;
  background: url(../ez_images/pCorner.png) no-repeat top left;
  }
.rBoxTL { top: 0; left: 0; }
.rBoxTR { background-position: top right; top: 0; right: 0; }
.rBoxBL { background-position: bottom left; bottom: 0; left: 0; }
.rBoxBR { background-position: bottom right; bottom: 0; right: 0; }
.rBoxV, .rBoxH, .rBoxVPop, .rBoxHPop { background-color: #fff; position: absolute; }
.rBoxV, .rBoxVPop { top: 0; left: 8px; }
.rBoxH, .rBoxHPop { top: 8px; left: 0; }


/* ** PANELS GLOBAL ** */

.ui-resizable-e {
  display: none; 
  width: 18px!important; 
  right: -10px!important; 
  top: 0!important; 
  background: url(../ez_images/panel_resize.png) no-repeat center right;
  }

.resizeOverlay {
  display: none;
  position: absolute;
  height: 100%;
  width: 100%;
  background: transparent;
  z-index: 200;
  }

.deOverlay {
  background: #f4f4f4;
  width: 100%;
  height: 100%;
  position: relative;
  text-align: center;
  }

.deOverlayLoading {
  background: url(../ez_images/loading.gif) no-repeat;
  color: #666666;
  height: 19px;
  width: auto;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  margin: 0 auto;
  padding-left: 26px;
  padding-top: 2px;
  position: relative;
  top: 50%;
  }

.panelHead {
  position: relative;
  }

.panelHeadTextCont {
  padding-right: 55px;
  }

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

.headTabActive {
  cursor: auto;
  opacity: 1;
  }

.headTabInactive {
  cursor: pointer;
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
  }

.headTabInactive:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
  }

.panelHead h2:before {
  font-family: icomoon;
  font-size: 16px;
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
  font-weight: normal;
  }

#recCtrl .panelHead h2:before {
  content: "\e656";
  }

#icomCtrl .panelHead h2:before {
  font-family: fontawesome;
  content: "\f130";
  }

#annots .panelHead h2.panelHeadIcon:before {
  content: "\e600";
  }

#dataEntry .panelHead h2.panelHeadIcon:before {
  content: "\e620";
  }

.panelHead h2 {
  text-transform: uppercase;
  font-weight: 600;
  margin-right: 90px;
  padding: 0 0 0 20px;
  position: relative;
  }

.panelHead h2.panelHeadText {
  float: left;
  padding: 0 5px 0 0;
  margin: 0 5px 0 0;
  }

#groupGradeingHText {
  margin-right: 0;
  padding-right: 0;
  }

.panelHead h2.panelHeadText.disabled,
.panelHead h2.panelHeadText.disabled:hover {
  opacity: 0.2;
  filter: alpha(opacity=20);
  -ms-filter: "alpha(opacity=20)";
  cursor: auto;
  }

.panelHead h2.panelHeadText.headTabBorder {
  border-right: 1px solid #aaa;  
  }

.panelHeadIcon {
  float: left;
  height: 16px;
  margin-right: 7px!important;
  padding: 0!important;
  width: 16px;
  }

.panelHead .panelCtrl {
  position: relative;
  right: 0px;
  top: 0px;
  float: right;
  overflow: hidden;
  }

.panelHead .panelCtrl i {
  margin-left: 3px;
  cursor: pointer;
  display: inline-block;
  }

.panelHead .panelCtrl i.disabled { opacity: 0.3; cursor: default; }

.panelHead .panelCtrl .active {
  opacity: 0.6;
  }

.panelSettings.disabled {
  cursor: default;
  opacity: 0.3;
  }

#countCamerasLoad {
  width: 12px;
  height: 12px;
  display: inline-block;
  background: url(../ez_images/loader_circular.gif) no-repeat;
  background-size: 12px 12px;
  margin-left: 5px;
  }

/* Intercom Panel */
#icomCtrl .panelCont {
  position: relative;
  }

.icom_cover {
  position: absolute;
  top: 0;
  background-color: #ffffff;
  display: none;
  height: 95%;
  width: 100%;
  z-index: 2;
  text-align: center;
  opacity: 0;
  }

.icom_cover span {
  background: url(../ez_images/loading.gif) no-repeat;
  color: #666666;
  height: 19px;
  width: auto;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  margin: 0 auto;
  padding-left: 26px;
  padding-top: 2px;
  position: relative;
  top: 41%;
  display: none; 
  }

.icomTypesCont {
  margin-bottom: 12px;
  position: relative;
  }

.icomTypesCont .greyTabMenuCont ul li {
  padding: 0px;
  height: 24px;
  }

.icomTypesCont .greyTabMenuCont ul li:first-child {
  padding-right: 20px;
  }

.icomTypesCont .greyTabMenuCont ul li:last-child {
  padding-left: 20px;
  }

.icomTypesCont .greyTabMenuCont ul li span {
  max-height: 27px;
  line-height: 10px;
  font-size: 11px;
  }

.icomElementsCont {
  text-align: center;
  margin: 5px 20px 8px;
  }

.icomElements {
  margin: 6px 0px 6px;
  text-align: center;
  position: relative;
  }

.icomElements.icomRooms {
  margin-bottom: 5px;
  margin-top: 0px;
  }

.icomElements table { 
  margin: 0 auto;
  position: relative;
  left: 3px; 
  }

.icomElements table td {
  padding: 0 5px 0 0;
  }

.icomElements table td.icomPTTTD {
  padding: 0 15px 0 0;
  }

.icomElements table td {
  vertical-align: middle;
  }

.icomElementsCont select {
  width: 150px;
  font-size: 11px;
  }

.icomElementsCont select#audios {
  width: 150px;
  }

.icomElementsCont button.blue {
  padding: 3px 5px;
  width: 180px;
  }

.icomSelect ul li.icomSelect {
  margin: 0;
  }

#icomStationType li,
.icomTypesCont .greyTabElem {
  -webkit-transition: none;
  -moz-transition: none;
  transition: none;
  }

button.icomPTT i.fa-volume-up {
  -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  -moz-animation: blinkOp normal 1.3s infinite ease-in-out;
  -webkit-animation: blinkOp normal 1.3s infinite ease-in-out;
  -ms-animation: blinkOp normal 1.3s infinite ease-in-out;
  animation: blinkOp normal 1.3s infinite ease-in-out;
  }

@-moz-keyframes blinkOp {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}
@-webkit-keyframes blinkOp {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}
@-ms-keyframes blinkOp {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}
@keyframes blinkOp {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}

.disabledPTTCover {
  width: 100%;
  height: 100%;
  background: transparent;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: none;
  }

.icomSpeaker {
  position: absolute;
  background: url(../ez_images/icom_speaker.gif) no-repeat;
  float: right;
  height: 37px;
  width: 50px;
  top: 0px;
  right: 0px;
  display: none;
  }

/* Annots and Data Entry switch */
.annotsSettings, .recCtrlSettings {
  margin: 10px 10px 11px 10px;
  position: relative;
  top: -4px;
  border: 1px dotted #999;
  padding: 5px;
  display: none;
  }

.recCtrlSettings { 
  margin: 10px 4px 11px;
  top: 0;
  }

.panelCont {
  padding: 0px 5px;
  }

.realScoreShowing ~ #dataEntryDiv {
  padding-top: 20px;
  }

/*#annots .panelHead { height: 24px; }*/

#dataEntryDiv { z-index: 100; overflow: hidden; }
#annotsDiv { z-index: 101; position: relative; }

#realScoreCont {
  display: none;
  background: #ffefc0;
  width: 100%;
  color: #333;
  text-align: center;
  position: absolute;
  left: 0;
  padding: 2px 0;
  margin: 5px 0 0 0;
  z-index: 1001;
  font-size: 11px;
  }

#realScoreCont .realScoreNotUpToDate {
  visibility: hidden;
  }
#realScoreCont.scoreNotUpToDate .realScoreNotUpToDate {
  visibility: visible;
  }

/*IPAD definitions*/
.scrollDownArrow, .scrollUpArrow {
  position: absolute;
  right: -35px;
  top: 20px;
  width: 28px;
  height: 28px;
  background: url(../ez_images/scroll_up.png) no-repeat;
  cursor: pointer;
  display: none;
  }

.scrollDownArrow {
  top: 55px;
  background: url(../ez_images/scroll_down.png) no-repeat;
  }

.resizeToggleRL, .resizeToggleRight, .resizeToggleLeft {
  cursor: pointer;
  margin-top: 13px;
  margin-left: 407px;
  position: absolute;
  width: 28px;
  height: 28px;
  background: url(../ez_images/resizeleft.png) no-repeat;
  }

.resizeToggleRight {
  background: url(../ez_images/resizeright.png) no-repeat;
  }
 
#resizeToggle {
  display: none;
  }

/* TinyMCE table */
table.tinymce-table {
  border-collapse: collapse;
  margin: 10px;
  width: auto;
  max-width: calc(100% - 20px);
  word-break: break-all;
  }

table.tinymce-table thead tr td,
table.tinymce-table tbody tr td,
table.tinymce-table tfoot tr td {
  border-width: 1px!important;
  border-style: solid!important;
  border-color: #000;
  padding: 5px;
  }

/* ** FORM CONTROLS ** */
.form {
  position: relative;
  z-index: 1;
  }

.formGroup {
  clear: both;
  height: 27px;
  }

#recCtrl .formGroup .recLabels {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 181px;
  }

.formGroup .recLabels {
  float: left;
  font-size: 12px;
  font-weight: bold;
  vertical-align: bottom;
  margin: 3px 3px 0 0;
  }

.formGroup label {
  display: block;
  margin: 3px 6px 0 0;
  float: left;
  text-align: right;
  }

.formGroup select {
  display: block;
  float: left;
  /*height: 20px;*/
  font-size: 10px;
  }

.formGroup select.hidden {
  display: none;
  }

/* Customize Select */
.jquery-selectbox {
  position: relative;
  height: 22px;
  border: 1px solid #BBBDBF;
  width: 190px;
  z-index: 0;
  float: left;
  display: inline;
  margin: 0;
  padding: 0;
  color: #666;
  cursor: pointer;
  font-size: 10px;
  }

.jquery-selectbox.selecthover {
  z-index: 700;
  }
  
.jquery-selectbox .jquery-selectbox-currentItem {
  padding: 5px 0px 0px 3px;
  white-space: nowrap;
  display: block;
  overflow: hidden;
  }

.jquery-selectbox .jquery-selectbox-list {
  display: none;
  position: absolute;
  top: 22px;
  left: -1px;
  width: 190px;
  height: auto;
  max-height: 200px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  z-index: 1000;
  border: 1px solid #BBBDBF;
  background-color: #fff;
  }

.jquery-selectbox .jquery-selectbox-moreButton {
  position: absolute;
  top: 0;
  right: 0;
  background: url(../ez_images/form_sel_arrow.png) no-repeat 0 -48px;
  width: 24px;
  height: 22px;
  cursor: pointer;
  }

.jquery-selectbox .jquery-selectbox-moreButton.morebuttonhover {
  background-position: 0 -24px;
  }

.jquery-selectbox.selecthover .jquery-selectbox-moreButton {
  height: 24px;
  }

.jquery-selectbox .jquery-selectbox-item.listelementhover {
  background: #eee;
  }

.jquery-selectbox .jquery-selectbox-item.listelementhover {
  color: #0d4051; /* TODO: SASS */
  }

.jquery-selectbox .jquery-selectbox-item {
  display: block;
  cursor: default;
  padding: 3px 2px;
  }

.select_icos {
  float: left;
  }

#ico_all {
  margin-left: 3px;
  }

.select_icos .openKeylock i:before  { content: "\f09c"; }

.locked {
  position: relative;
  left: 1px;
  font-size: 16px;
  color: #333;
  cursor: default;
  }

.select_icos button.disabled_ico_button {
  background-color: #A6A8AB;
  border: 1px solid #6D6E70;  
  cursor: default;
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha(opacity=60)";
  }
  
.select_icos button.disabled_ico_button:hover {
  background-color: #A6A8AB;
  border: 1px solid #6D6E70;  
  }  

.dataTables_wrapper table tr td.chkbox {
  padding-left: 0!important;
  }

.dataTables_wrapper table tr td .cbox {
  margin-left: 1px!important;
  }

#delmsg {
  font-size: 11px;
  font-style: italic;
  color: #666;
  padding: 5px;
  background-color: #FFF1C7;
  margin-top: 5px;
  }

#delmsg.activeVideoSelecting { 
  color: #cc0000; 
  font-style: normal;
  }

#delmsg.activeSelecting {
  color: #333; 
  font-style: normal;
  }

/* EZ Video Search Tooltip Box  */
.tooltipBox {
  position: absolute;
  max-width: 350px;
  }

.bt {
  background: url(../ez_images/tooltip_box.png) no-repeat scroll 100% 0 transparent;
  height: 10px;
  margin: 0 0 0 18px;
  }
  
.bt div {
  background: url(../ez_images/tooltip_box.png) no-repeat scroll 0 0 transparent;
  font-size: 0;
  height: 10px;
  left: -18px;
  line-height: 0;
  position: relative;
  width: 18px;
  }
  
.bb {
  background: url(../ez_images/tooltip_box.png) no-repeat scroll 100% 100% transparent;
  height: 10px;
  margin: 0 0 0 12px;
  }

.bb div {
  background: url(../ez_images/tooltip_box.png) no-repeat scroll 0 100% transparent;
  font-size: 0;
  height: 10px;
  left: -12px;
  line-height: 0;
  position: relative;
  width: 12px;
  }
  
.i1 {
  background: url(../ez_images/tooltip_borders.png) repeat-y scroll 0 0 transparent;
  padding: 0 0 0 3px;
  }
 
.i2 {
  background: url(../ez_images/tooltip_borders.png) repeat-y scroll 100% 0 transparent;
  padding: 0 3px 0 0;
  }
  
.i3 {
  background: none repeat scroll 0 0 #fff1c7;
  display: block;
  margin: 0;
  padding: 0 10px;
  }

/* BASIC FORM ELEMENTS */

button.blue {
  margin: 0 0 0 3px;
  }

button.blue.noMargin,
button.noMargin {
  margin: 0;  
  }

button.active {
  cursor: default;
  }

button.iconBtn {
  width: 35px;
  padding: 4px 5px;
  position: relative;
  vertical-align: middle;
  }

button.iconBtn .im {
  color: #FFFFFF;
  padding: 1px 0;
  position: relative;
  top: -1px;
  font-size: 15px;
  margin: 0;
  }

button.iconBtn .fa {
  color: #FFFFFF;
  padding: 2px 0;
  position: relative;
  top: -1px;
  font-size: 15px;
  margin: 0;
  }

button.blue.addSelectedButton {
  display: block;
  width: 100%;
  margin: 0 0 0 0;
  padding: 3px 5px;
  text-align: right;
  }

button.blue.addSelectedButton i {
  color: white;
  position: relative;
  top: 2px;
  margin-left: 3px;
  margin-right: 0;
  float: right; 
  }

button.blue.addSelectedButton.addLeft {
  text-align: left;
  }  

button.blue.addSelectedButton.addLeft i {
  margin-right: 3px;
  margin-left: 0;
  float: left; 
  }

button.blue.addSelectedButton.addLeft i:before {
  content: "\e665";
  }

button.blue.addSelectedButton.removeSelected i:before,
button.blue.addSelectedButton.removeSelected.addLeft i:before {
  content: "\e64c";
  }

button.bigBtn {
  font-size: 15px;
  padding: 10px 15px;
  }

button.blue.simpleBtn {
  box-shadow: none;
  border: 1px solid transparent;
  }

/* Main EZ icons */
.controls:before {
  color: #0d4051; /* TODO: SASS */
  }

.controls:not(.noHover):hover:before {
  color: #12566d; /* TODO: SASS */
  }

.controls {
  display: inline-block;
  cursor: pointer;
  margin: 0 auto;
  position: relative;
  }

.controls:before {
  font-family: icomoon;
  font-size: 17px;
  display: inline-block;
  }

.controls.noHover {
  cursor: default;
  }

.controls.disabled,
.controls.disabled:before {
  cursor: default;
  color: #999!important;
  opacity: 0.8;
  }

.controls.disabled:hover,
.controls.disabled:hover:before {
  color: #999!important;
  cursor: default!important;
  }

.ezRemove:before,
.ezRecord:before,
.icomRecord:before {
  content: "\f068";
  font-family: fontawesome;
  font-size: 20px;
  color: #cc0000!important;
  }

.ezRemove:hover:before,
.ezRecord:hover:before,
.icomRecord:hover:before {
  color: #aa0000!important;
  }

.ezRecord:before,
.icomRecord:before {
  font-family: icomoon;
  content: "\e664";
  font-size: 18px;
  }

.ezSettings:before {
  content: "\e645";
  }

.ezAdd:before {
  content: "\f067";
  font-family: fontawesome;
  font-size: 18px;
  }

.ezApply:before {
  content: "\e61c";
  }

.ezCancel:before {
  content: "\e64a";
  font-size: 14px;
  }

.ezEdit:before {
  content: "\e637";
  }

.ezInfo:before {
  content: "\e62e";
  }

.ezLog:before {
  content: "\e627";
  }

.ezPiechart:before {
  content: "\e639";
  }

.ezPlay:before,
.icomPlay:before {
  font-family: fontawesome;
  content: "\f04b";
  font-size: 16px;
  } 

.ezStop:before,
.icomStop:before {
  font-family: fontawesome;
  content: "\f04d";
  font-size: 16px;
  }

.ezVideoRecs:before {
  content: "\e656";
  }

.ezSpeaker:before {
  content: "\e658";
  }

.ezSpeaker.animate:before {
  -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  -moz-animation: blinkOp normal 1.3s infinite ease-in-out;
  -webkit-animation: blinkOp normal 1.3s infinite ease-in-out;
  -ms-animation: blinkOp normal 1.3s infinite ease-in-out;
  animation: blinkOp normal 1.3s infinite ease-in-out;
  }

/* Main Sections and Popups H2 icons */

.tableContHeader h2,
.contentHeader h2 {
  font-family: "Open Sans"; /* TODO */
  display: inline-block;
  float: left;
  padding-top: 4px;
  font-weight: bold;
  text-transform: uppercase;
  position: relative;
  margin-right: 3px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }

.tableContHeader h2 {
  margin-right: 3px;
  }

.tableContHeader h2:before,
.contentHeader h2:before {
  font-size: 20px;
  font-weight: normal;
  padding-right: 6px;
  margin-right: 3px;
  position: relative;
  top: 0px;
  vertical-align: middle;
  }

.tableContHeader h2.im:before,
.contentHeader h2.im:before {
  font-family: icomoon;
  }

.tableContHeader h2.fa:before,
.contentHeader h2.fa:before {
  font-family: fontawesome;
  }

.tableContHeader h2.yevIcon:before {
  font-family: icomoon;
  content: "\e62b";
  font-size: 26px;
  }

.tableContHeader h2.systemIcon:before {
  font-family: icomoon;
  content: "\e649";
  font-size: 26px;
  }

.tableContHeader h2.resourceManagerIcon:before {
  font-family: icomoon;
  content: "\e642";
  font-size: 26px;
  }

.tableContHeader h2.videoReviewIcon:before,
.contentHeader h2#videoRecordingsTitle:before {
  font-family: icomoon;
  content: "\e656";
  font-size: 26px;
  }

.tableContHeader h2.caseManagerIcon:before {
  font-family: icomoon;
  content: "\e61b";
  font-size: 26px;
  }

.tableContHeader h2.calendarIcon:before {
  font-family: icomoon;
  content: "\e617";
  font-size: 26px;
  }

.tableContHeader h2.userManagerIcon:before {
  font-family: icomoon;
  content: "\e653";
  font-size: 26px;
  }

.tableContHeader h2.evaluationIcon:before {
  font-family: icomoon;
  content: "\e62b";
  font-size: 28px;
  }

/* TINYMCE Custom Overrides */

/* TinyMCE uses default styles, which should not be reseted */
.tinyStyles strong { font-weight: bold; }
.tinyStyles em { font-style: italic; }
.tinyStyles ul { list-style-type: disc; padding-left: 15px; }
.tinyStyles ol { list-style-type: decimal; padding-left: 15px; }
.tinyStyles code { font-family: monospace; }
.tinyStyles sub, .tinyStyles sup { font-size: 80%; position: relative; vertical-align: baseline; }
.tinyStyles sup { top: -0.5em; }
.tinyStyles sub { bottom: -0.25em; }
.tinyStyles h1 { font-size: 32px; font-weight: bold; }
.tinyStyles h2 { font-size: 24px; font-weight: bold; }
.tinyStyles h3 { font-size: 18px; font-weight: bold; }
.tinyStyles h4 { font-size: 16px; font-weight: bold; }
.tinyStyles h5 { font-size: 13px; font-weight: bold; }
.tinyStyles h6 { font-size: 10px; font-weight: bold; }
.tinyStyles audio, .tinyStyles video {
  max-width: 100%;
  }
.tinyStyles audio {
  width: 300px;
  height: 40px;
  }

.mce-btn button,
.mce-btn button:hover {
  margin: 0;
  padding: 0;
  font-weight: normal;
  font-style: normal;
  box-shadow: none;
  background-color: transparent;
  }

.mce-btn button {
  line-height: 14px!important;
  }

.mce-btn button span,
.mce-btn button i {
  line-height: 16px!important;
  }

.mce-btn-small button {
  padding: 3px!important;
  }

button.disabled.forced, button[disabled].forced,
button.forced {
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  background: #3BC04F!important;
  border: 1px solid #006838 !important;
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  margin: 0 0 0 3px;
  cursor: default; 
  }

.warningBtnDiv {
  position: relative;
  background: transparent;
  /*padding: 4px 0;*/
  display: inline-block;
  border-radius: 2px;
  }

.warningBtnDiv.activeWarning {
  /*background: url('../ez_images/warning_div_btn_bg.png') repeat;*/
  }

.warningBtnDiv.activeWarning button.blue, 
.warningBtnDiv.activeWarning button {
  background: #000!important;
  border: 1px solid black;
  margin: 0 3px;
  font-weight: bold;
  }

.warningBtnDiv.activeWarning button.blue:hover,
.warningBtnDiv.activeWarning button:hover {
  background: #373737!important;
  }

.warningBtnDiv.activeWarning button.blue:active,
.warningBtnDiv.activeWarning button:active {
  background: #000!important;
  }

.warningBtnDiv.activeWarning button.disabled,
.warningBtnDiv.activeWarning button[disabled] {
  background: #000!important;
  border: 1px solid black!important;
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  }

.buttonFirst {
  margin-left: 0px!important;
  }

button.ui-multiselect.ui-state-disabled:focus {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.065) inset;
  border: 1px solid #BBBDBF!important;
  }

.slimFixShadow {
  position: relative;
  }

form .error .jquery-selectbox {
  color: #d00;
  border-color: #d00;
  background-image: url("../img/bg-TextFieldError.gif");
  }

.longInput {
  width: 360px;
  }

select.smallSelect {
  border: 0;
  height: auto;
  padding: 1px 2px;
  font-size: 10px;
  }

/* ** ENDOF FORM CONTROLS ** */

/* panel specific definitions */
.panelCont .formGroup label {
  width: 80px;
  }

.panelCont .formGroup select {
  width: 182px;
  }

/* ** REC START/STOP ** */
#recStartStop {
  position: relative; top: 8px;
  }

#recStartStop table {
  width: 100%;
  }

#recStartStop table td {
  padding: 0 7px;
  vertical-align: middle;
  position: relative;
  text-align: center;
  }

#recStartStop table td.clean {
  background: none;
  }

#recStartStop table td a {
  display: inline-block;
  }


#recStartStop table td a#recStop.inactive,
#recStartStop table td a#recStart.inactive {
  color: #666;
  background-position: 5px -40px;
  cursor: default;
  }

/* ** REC informations ** */
#toggleControls {
  position: relative;
  }

#recDetails, #liveNoRec {
  display: none;
  width: 100%!important;
  height: 99%;
  position: absolute;
  top: 0px; left: 0;
  margin: 0 -10px;
  padding-right: 20px;
  z-index: 10;
  font-size: 11px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  }

#recDetails p {
  padding: 3px 5px;
  font-size: 10px;
  padding-right: 15px;
  width: 100%;
  background-color: #d7effb; /* TODO: SASS */
  }

#liveNoRec {
  display: block;
  background-color: #ffffff;
  z-index: 9;
  }

#liveNoRec p {
  padding: 25px 5px;
  font-size: 12px;
  text-align: center;
  }

#recDetails ul {
  padding: 3px 5px;
  margin-bottom: 5px;
  width: 100%;
  padding-right: 15px;
  }

#recDetails ul li {
  margin-bottom: 5px;
  clear: both;
  }

#recDetails ul li .recLabel, #recDetails ul li .recValue {
  float: left;
  }

#recDetails, #liveNoRec {
  background-color: #d7effb; /* TODO: SASS */
  }

.recLabel {
  width: 75px;
  margin-right: 5px;
  text-align: right;
  color: #0d4051; /* TODO: SASS */
  }

.recValue {
  width: 180px;
  }
  
.recValueReadOnly {
  float: left;
  font-size: 11px;
  margin: 4px 0 0 4px;
  width: 180px;
  }

/* ** ANNOTATIONS & EVENT LOG  ** */

.annotUserDropActive {
  border: 1px dashed #444!important;
  }

.annotUserDropHover {
  background: #e9e9e9; /* Old browsers */
  background: -moz-linear-gradient(top, #efefef 50%, #dfdfdf 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#efefef), color-stop(100%,#dfdfdf)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #efefef 50%,#dfdfdf 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #efefef 50%,#dfdfdf 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #efefef 50%,#dfdfdf 100%); /* IE10+ */
  background: linear-gradient(to bottom, #efefef 50%,#dfdfdf 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#dfdfdf',GradientType=0 ); /* IE6 */
  }

.aListCont {
  } 

#aList {
  margin: 0;
  /*height: 200px;*/
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  position: relative;
  z-index: 21;
  width: 100%; /* TODO: js :( */
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }

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

#aList ul {
  margin: 0;
  margin-right: 1px;
  }

#logs {
  height: 88%;
  width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden; 
  }

/* Annotation colors */

.annotColorDiv { display: none; }

#aList li.ann_bm .annotColorDiv {
  position: absolute;
  right: 0;
  top: 0;
  width: 10px;
  height: 100%;
  display: block;
  }

#aList li.ann_bm .yellowColorAnnot {
  background: #ffe96a;
  }

#aList li.ann_bm .orangeColorAnnot {
  background: #ffb45c;
  }

#aList li.ann_bm .greenColorAnnot {
  background: #85dd77;
  }

#aList li.ann_bm .blueColorAnnot,
#aList li.ann_bm .lightblueColorAnnot {
  background: #43d1ff;
  }

#aList li.ann_bm .purpleColorAnnot {
  background: #d594ff;
  }

#aList li.ann_bm .redColorAnnot {
  background: #fd8989;
  }

#aList li.ann_ordsel, #aList li.ann_ordsel:hover {
  border: 1px dashed #BBBDBF;
  background-color: #f6f6f6;
  }

#aList li.ann_ordsel .annotColorDiv { display: none; }

#logs li { border-bottom: 1px solid #BBBDBF; margin: 0 5px; padding: 4px 0; }
#logs li:last-child { border: 0; }

#logs li:last-child:hover { border: 0; }

#aList li.hl {
  background-color: #FFF1C7; border: 1px solid #fde08a;
  }

#logs li.hl { background-color: #FFF1C7; border: 1px solid #fde08a; }
#logs li.hl { border: 0; border-bottom: 1px solid #fde08a; }

#aList li:hover .aCtrl { visibility: visible; opacity: 1; }

#aList .annotCategory.small {
  float: left;
  margin: 1px;
  position: relative;
  top: 1px;
  }

#aList .wrapC {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  }

#aList .userList > div {
  margin: 0 10px 0 0;
  }

#aList li p {
  font-size: 10px;
  padding-left: 2px;
  padding-right: 25px;
  margin-left: 20px;
  margin-top: 1px;
  }

#aList li.ann_ordsel p { margin-left: 2px; }

#logs li p {
  font-size: 10px;
  padding-left: 15px;
  background-image: url(../ez_images/bullet_grey.png);
  background-repeat: no-repeat;
  background-position: left center;  
  }

#logs li p { color: #231F20; padding-right: 5px; }

#aList li p .aTime, #aList li p .aTime a { color: #333; font-weight: normal; margin-right: 3px; }
#logs li p .aTime, #logs li p .aTime a { font-weight: 500; }

a.aMore:link, a.aMore:visited, a.aMore:hover, a.aMore:active {
  font-weight: normal;
  text-decoration: none;
  color: #888;
  } a.aMore:hover { color: #333; text-decoration: none; }

.aMoreArrow {
  padding: 0 4px;
  }

.aLessArrow {
  padding: 0 4px;
  }

.aCtrl { float: right; margin: 3px 9px 0 0; padding: 0; visibility: hidden; opacity: 0; }
.lCtrl { color: #BBBDBF; padding: 5px 10px 0px; overflow: hidden; }
.aCtrl li, .lCtrl li { display: block; float: left; margin-right: 5px; height: 10px; }
.aCtrl a.aJump, .lCtrl a.lJump, .lCtrl a.lSync {
  display: block;
  height: 10px;
  text-decoration: none;
  font-size: 10px; 
  padding-left: 15px;
  line-height: 10px !important;
  background: url(../ez_images/ico_sm_remove_annot.png) no-repeat 0 0;
  color: #BBBDBF;
  cursor: pointer;
  }

.aCtrl a.aRemove {
  display: block;
  color: #BBBDBF;
  text-decoration: none;
  font-size: 12px;
  font-family: Verdana;
  line-height: 10px !important;
  }

.aCtrl a.aRemove:hover { color: #D11B24;}

.aCtrl a.aJump, .lCtrl a.lJump { background-image: url(../ez_images/ico_sm_jump_to.png); }

.lCtrl a:hover { background-position: 0 -10px; color: #6D6E70; }

.annotsOperations {
  margin-left: 5px;
  }

#aAdd {
  z-index: 5;
  overflow: hidden;
  }

#aAdd > table { width: 100%; }

#aAdd > table .annotsOpBtnsTd {
  vertical-align: top;
  width: 85px;
  }

#aAdd > table .annotsOpBtnsTd.inRow {
  width: 43px;
  }

.presetAnnotsToggleCont {
  margin-left: 2px;
  margin-top: 10px;
  margin-bottom: 6px;
  cursor: pointer;
  display: inline-block;
  position: relative;
  }

.presetAnnotsToggleCont .arrowDown,
.presetAnnotsToggleCont .arrowRight {
  position: absolute;
  top: 4px;
  }

.presetAnnotsToggleCont .arrowRight {
  top: 3px;
  }

.presetAnnotsToggleText {
  margin-left: 13px;
  }

.annotsOpBtns {
  float: left;
  }

.annotsOpBtns.inRow {
  float: none;
  margin-right: 0;
  margin-bottom: 5px;
  }

.aAnnotArea {
  display: block;
  position: relative;
  z-index: 101;
  }

.incAnn, .decAnn, .disableAnn {
  position: absolute;
  float: left;
  top: 7px;
  right: 7px;
  width: 10px;
  height: 12px;
  cursor: pointer;
  background: url(../ez_images/ico_contract_annot.png) 0 0;
  z-index: 101;
  }.incAnn:hover { background-position: 10px 0; }

.decAnn {
  background: url(../ez_images/ico_expand_annot.png) 0 0; 
  }.decAnn:hover { background-position: 10px 0; }

.disableAnn {
  cursor: auto;
  background: url(../ez_images/ico_disable_annot.png) no-repeat;
  }.disableAnn:hover { background-position: 0 0; }

.markerflag {
  position: absolute;
  top: -1px;
  cursor: pointer;
  }

.markerflag:before {
  font-size: 17px;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
  -webkit-transition: color 1s;
  -moz-transition: color 1s;
  transition: color 1s;
  }

.markLog, .markerflag.whiteColorAnnot {
  color: #f5f5f5;
  }

.markerflag.yellowColorAnnot {
  color: #ffe96a;
  }

.markerflag.orangeColorAnnot {
  color: #ffb45c;
  }

.markerflag.greenColorAnnot {
  color: #85dd77;
  }

.markerflag.blueColorAnnot,
.markerflag.lightblueColorAnnot {
  color: #43d1ff;
  }

.markerflag.purpleColorAnnot {
  color: #d594ff;
  }

.markerflag.redColorAnnot {
  color: #fd8989;
  }

.annotationColor.markerflag {
  position: absolute;
  top: 5px;
  right: 5px;
  }

.annotationColorPicker {
  position: absolute;
  bottom: -134px; 
  right: 1px;
  background-color: white;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  padding: 4px;
  border-radius: 3px;
  box-shadow: 0 0 3px rgba(0,0,0,0.3);
  }

.annotationColorPicker.hide { visibility: hidden; opacity: 0; }
.annotationColorPicker.show { visibility: visible; opacity: 1; }

.annotationColorPicker ul li {
  padding: 1px 0;
  }

.annotationColorPicker ul li a.markerflag {
  position: relative;
  margin: 1px 0;
  display: block;
  }

a.markerflag,
a.markerflag:hover {
  text-decoration: none!important;
  }

.defaultAnnotationColorsCont {
  font-size: 11px;
  }

.defaultAnnotationColorPicker {
  margin-top: 2px;
  }

.defaultAnnotationColorPicker ul {
  overflow: hidden;
  }

.defaultAnnotationColorPicker ul li {
  margin: 0 1px;
  padding: 3px 4px 2px 4px;
  float: left;
  display: block;
  border-radius: 2px;
  border: 1px solid transparent;
  cursor: pointer;
  }

.defaultAnnotationColorPicker ul li:hover {
  border: 1px solid #ccc;
  }

.defaultAnnotationColorPicker ul li.activeDefault {
  background: #f4f4f4;
  border: 1px solid #bbb;
  cursor: auto;
  }

.defaultAnnotationColorPicker ul li.activeDefault a { cursor: auto; }

.defaultAnnotationColorPicker ul li a.markerflag {
  position: relative;
  display: block;
  }

#aAddPreDef { width: 272px; }

.annot_pause_cont, .annot_case_select {
  text-align: left;
  margin-bottom: 4px;
  }

.annot_pause_cont input[type="checkbox"],
.annot_case_select input[type="checkbox"] {
  margin: 0;
  padding: 0;
  border: none;
  position: relative;
  width: 15px;
  }

.annot_pause_label {
  position: relative;
  }

.disabled_label {
  color: #aaa;
  }

/* log spec navigation */
#syncLog {
  background: #d7effb; /* TODO: SASS */
  }

#syncLog {
  height: 12%;
  width: 100%;
  position: relative;
  background: #CFE4F6 url(../ez_images/border_lb.gif) repeat-x top left;
  }

#syncLog label, #syncLog input, #syncLog #syncArr {
  position: relative;
  margin: 0 2px;
  }

#syncLog label {
  display: block;
  max-width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; 
  color: #231F20;
  font-size: 10px;
  margin-left: 10px;
  margin-right: 5px;
  }

#syncLog input {
  display: block;
  width: 65px;
  top: 1px;
  padding: 1px 2px;
  font-size: 10px;
  }

#syncLog #syncArr {
  height: 18px;
  text-align: left;
  }

#syncLog #syncArr #sync_sec_up,
#syncLog #syncArr #sync_sec_down,
#syncLog #syncArr #sync_here {
  display: block;
  float: left;
  width: 10px;
  height: 10px;
  margin: 4px;
  cursor: pointer;
  }

#syncLog #syncArr #sync_sec_down {
  margin: 4px 6px 4px 0;
  }

#syncLog > table {
  height: 100%;
  }

#syncLog > table td {
  vertical-align: middle;
  }

/* ** USERLISTS **  */

/* RecCtrl userList and DataEntry userList */
#learnerList { display: none; }

#learnerList .user.ui-selected .wrapC {
  border: 1px solid #0d4051; /* TODO: SASS */
  }

.userList { 
  border-top: 1px dotted #999;
  padding: 7px 0 3px; 
  position: relative;
  margin-top: 6px;
  zoom: 1; 
  }

.userList, 
.userDEList {
  max-height: 69px;
  overflow: auto;
  }

.userList.dragContainer,
.userList.dragContainer div, 
#annotsDiv .userList {
  overflow: inherit;
  margin: 0;
  padding: 0;
  border: none;
  }

.userList *, userDEList * { display: block; text-decoration: none; }

.userList div,
.userDEList div { 
  float: left; 
  margin: 2px 3px 2px 0; 
  }

.userList div.clear, 
.userDEList div.clear { 
  float: none; 
  height: 0; 
  line-height: 0; 
  }

.userList div a, 
.userDEList div a { 
  width: auto; 
  cursor: default; 
  white-space: nowrap; 
  }

.userDEList div a,
.userDEList div a label { 
  cursor: pointer; 
  }

.userList div a:hover,
.userDEList div a:hover { 
  text-decoration: none; 
  }

.userDEList input[type="checkbox"] {
  position: absolute;
  left: -8000px;
  }

.userDEList div a.user .wrapC {
  display: inline-block;
  white-space: nowrap;
  border-radius: 2px;
  position: relative;
  padding: 1px 6px; 
  }

.userDEList div a.user .wrapC {
  color: #555;
  border: 1px solid #c1c1c1;
  box-shadow: 1px 1px 2px -1px rgba(0, 0, 0, 0.09);
  background: #fefefe;
  }

.userDEList div a.user.DELearnerActive .wrapC {
  background: #E0E0E0;
  border: 1px solid transparent;
  filter: none;
  color: #222;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3) inset;
  text-shadow: 0 1px 0 #eee;
  }

.userDEList div a.user.DELearnerInactive .wrapC:hover {
  color: #000;
  border: 1px solid #aaa;
  background: #f9f9f9;
  }

.userDEList div a.user.DELearnerActive .wrapC:hover {
  color: #000;
  background: #d9d9d9;
  filter: none;
  text-shadow: 0 1px 0 #eee;
  }

/* User roles style */
select.role_learner,
select.role_learner:focus,
.userList div a.user.role_learner .wrapC {
  border-left: 4px solid #488aba;
  }

select.role_sp,
select.role_sp:focus,
.userList div a.user.role_sp .wrapC {
  border-left: 4px solid #48BA8E;
  }

.user .wrapCont { display: inline; line-height: 16px; font-size: 11px; }
.user .wrapCont .remove { cursor: pointer; display: inline; font-weight: bold; color: #bbb; font-family: verdana; }
.user .wrapCont .remove:hover { color: #d11b24; }
.user .wrapC:hover .wrapCont .remove { color: #d11b24; }
.ui-notowned .wrapCont { color: #d11b24; }
.ui-nosel .wrapCont { color: #444; }
.ui-nosel .wrapC { border: 1px dashed #444; }

#learnerListLoad { 
  position: absolute; 
  display: none;
  background-color: #fff;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-bottom: 2px;
  opacity: .8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
  z-index: 10;
  }

#learnerListLoad p {
  text-align: center;
  font-weight: bold;
  color: #0d4051; /* TODO: SASS */
  }

#aList .userList { margin: 2px 22px; color: #777; }

.userList em { display: inline; margin-right: 5px; }

.password-meter {
  height: 5px;
  width: 198px;
  margin-left: 5px;
  position: relative;
  top: -5px;
  border-radius: 0 0 3px 3px;
  margin-bottom: -5px;
  }

.setting-value .password-meter {
  margin-left: 0;
  width: 200px;
  }

#mastPass .setting-value .password-meter {
  width: 170px;
  }

.password_weak { background: #A22; }
.password_strong { background: #2A2; }

.chkCamsUl li {
  padding: 3px 0;
  float: left;
  margin-right: 10px;
  }

.formCams input[type="checkbox"] {
  vertical-align: bottom;
  padding: 0;
  margin: 0;
  }

.formCams label {
  font-size: 11px;
  position: relative;
  }

.restartRec {
  margin-left: 2px;
  }

.chkCamsList {
  margin-left: 2px;
  overflow: hidden; 
  } 

 .chkCamsCount {
  font-size: 11px;
  margin-left: 2px;
  margin-top: 10px;
  padding-top: 6px;
  }

.vidRecCtrlDottedBorder {
  border-top: 1px dotted #CCCCCC;
  }

.chkCamsCount:hover .recDetToggleUp { background-position: 0 -12px; }
.chkCamsCount:hover .recDetToggleDown { background-position: center bottom; }
 
.chkCamsCount a {
  text-decoration: none;
  } 

/* ** REVIEW TABLE ** */
.tableContainer {
  text-align: left;
  }

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

.tableContHeader .tableContHeaderL,
.tableContHeader .tableContHeaderR,
.contentHeaderL,
.contentHeaderR {
  display: none;
  }

.tableContHeaderC:before,
.tableContHeaderC:after,
.contentHeaderC:before,
.contentHeaderC:after {
  content: " ";
  display: table;
  }
 
.tableContHeaderC:after,
.contentHeaderC:after {
  clear: both;
  }

.tableContHeader p {
  color: #999999;
  padding-bottom: 10px;
  }

.tableContainer input[type="checkbox"]{
  border: none;
  }

#educTable h3 { 
  padding: 0; 
}

#educTable .dataTables_scroll { 
  overflow: hidden; 
}

.review_search {
  margin-left: 0px;
  }

.review_settings {
  float: left;
  margin: 7px 0 0 0;
  }

#searchBox {
  background-position: 344px center;
  background-repeat: no-repeat;
  }

#reviewSearchInfoTip {
  margin-left: 3px;
  margin-right: 10px;
  float: left;
  left: 0;
  }

.vidSearchInfoMargin {
  margin-top: 10px;
  }

.yellowSampleCode {
  background: #ffe9a6;
  padding: 2px;
  border: 1px dashed #f9ce4e;
  float: left;
  margin-top: 3px;
  }

.incompleteScoreExplanation {
  padding: 26px 0 15px 15px;
  margin-left: auto;
  font-size: 12px;
  color: #666;
  }

.visibleTable {
  position: relative;
  visibility: visible;
  top: 0;
  }

.hiddenTable {
  position: absolute;
  visibility: hidden;
  top: -5000px;
  }

.visibleTableFooter {
  display: table-footer-group;
  }

.hiddenTableFooter {
  display: none;
  }

#tableBox {
  overflow: auto; 
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  }

.iconSpacer {
  margin-right: 15px;
  }

.icoDelBig {
  display: block;
  margin-top: 3px;
  vertical-align: bottom;
  width: 10px; height: 10px;
  background: url(../ez_images/ico_x_big.png) no-repeat center left;
  cursor: pointer;
  } .icoDelBig:hover { background-position: center right; }

#table_filter {
  float: left;
  }

.table_filter_chks {
  float: left; 
  }

.table_filter_chks ul li {
  padding-top: 2px;
  }

.dataTables_info {
  margin-left: 20px;
  margin-top: 11px;
  color: #999;
  float: left;
  display: none;
  }
  
.noAdditionalBtns .dataTables_info {
  margin-top: 12px;
  }
  
.tableContainer .tfoot p em {
  font-style: italic;
  }

.btn.videoUploadIcon .im-video-review {
  font-size: 16px;
  margin-top: 2px;
  margin-right: 2px;
  }

.btn.videoUploadIcon .im-upload {
  position: absolute;
  top: 2px;
  right: -2px;
  height: 10px;
  overflow: hidden;
  }

.uploadInProgress .errorIconInBtn {
  position: absolute!important;
  top: 3px!important;
  right: 3px!important;
  visibility: hidden;
  }

.uploadInProgress.uploadError .im-upload {
  visibility: hidden;
  }

.uploadInProgress.uploadError .errorIconInBtn {
  visibility: visible;
  }

#videoUploadPopup .setting-value {
  position: relative;
  }

.fetchable {
  position: absolute;
  right: 35px;
  top: 7px;
  }

/* Custom checkbox */
.ezCheckbox {
  width: 18px;
  height: 16px;
  margin: 0 auto;
  position: relative;
  left: -2px;
  cursor: pointer;
  font-family: icomoon;
  font-size: 15px;
  display: inline-block;
  }

.ezCheckbox.checkAll:before {
   content: "\e61d";
  }

.ezCheckbox.checkNone:before {
   content: "\e61f";
  }

.ezCheckbox.checkManual:before {
   content: "\e61e";
  }

.ezCheckbox.checkAll.disabled,
.ezCheckbox.checkNone.disabled, 
.ezCheckbox.checkManual.disabled {
  opacity: 0.45;
  filter: alpha(opacity=45);
  -ms-filter: "alpha(opacity=45)";
  }

/* cut table text */
#table tbody tr td span {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  }

.audioOnlyWBg {
  position: absolute;
  z-index: 10;
  width: 70px;
  height: 70px;
  left: 0;
  right: 0;
  top: 1px;
  bottom: 0;
  margin: auto;
  font-size: 70px;
  opacity: 0.65;
  text-shadow: 2px 2px 0 rgba(0,0,0,0.1);
  }

.audioOnlyWBg .fa {
  color: white;
  }

/* Overlay HELP */
.overlayHelp {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1005;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.3s, visibility 0.3s;
  -moz-transition: opacity 0.3s, visibility 0.3s;
  transition: opacity 0.3s, visibility 0.3s;
  }

.overlayHelp.showOverlayHelp {
  opacity: 1;
  visibility: visible;
  }

.overlayHelpItem {
  position: absolute;
  }

.overlayHelpText {
  background: rgba(0,0,0,0.5);
  border-radius: 6px;
  padding: 5px 7px;
  font-size: 11px;
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  transition: background 0.3s;
  z-index: 1006;
  position: relative;
  }

.overlayHelpText:hover {
  background: rgba(0,0,0,0.95);
  z-index: 1007;
  }

.overlayHelpClose,
.overlayOnlineHelp {
  position: absolute;
  bottom: 15px;
  left: 15px;
  text-transform: uppercase;
  padding: 5px 8px;
  display: inline-block;
  cursor: pointer;
  }

.overlayOnlineHelp {
  right: 15px;
  left: auto;
  }

.overlayHelpClose span,
.overlayOnlineHelp a.onlineHelpLink {
  position: relative;
  vertical-align: middle;
  text-transform: uppercase;
  margin-left: 5px;
  }

.overlayHelpClose i,
.overlayOnlineHelp i {
  vertical-align: middle;
  font-size: 17px;
  }

.overlayOnlineHelp i { top: 0; }

.overlayHelpClose:hover span { text-decoration: underline; }
.overlayOnlineHelp a.onlineHelpLink { 
  color: white; 
  font-weight: normal; 
  }

.overlayHelpArrow {
  position: absolute;
  background: url("../ez_images/help_arrow.png") center center no-repeat;
  width: 50px;
  height: 31px;
  background-size: 50px 31px;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  }

.overlayHelpArrow.bigArrow {
  background: url("../ez_images/help_arrow_big.png") center center no-repeat;
  width: 100px;
  height: 110px;
  background-size: 100px 110px;
  }

.overlayHelpArrow.leftTop {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  right: -55px;
  }

.overlayHelpArrow.bigArrow.leftTop {
  right: -100px;
  }

.overlayHelpArrow.leftBottom {
  -webkit-transform: scaleY(-1);
  transform: scaleY(-1);
  right: -55px;
  top: -25px;
  }

.overlayHelpArrow.bigArrow.leftBottom {
  right: -100px;
  top: -50px;
  }

.overlayHelpArrow.topRight {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  left: -55px;
  }

.overlayHelpArrow.bigArrow.topRight {
  left: -100px;
  }

.overlayHelpArrow.topLeft {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  right: -55px;
  }

.overlayHelpArrow.bigArrow.topLeft {
  right: -100px;
  }

.overlayHelpArrow.rightTop {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  left: -55px;
  }

.overlayHelpArrow.bigArrow.rightTop {
  left: -100px;
  }

.overlayHelpArrow.rightBottom {
  -webkit-transform: scale(-1, -1);
  transform: scale(-1, -1);
  left: -55px;
  top: -25px;
  }

.overlayHelpArrow.bigArrow.rightBottom {
  left: -100px;
  top: -50px;
  }

.overlayHelpArrow.bottomLeft {
  -webkit-transform: scaleY(-1);
  transform: scaleY(-1);
  right: -55px;
  top: -25px;
  }

.overlayHelpArrow.bigArrow.bottomLeft {
  right: -100px;
  top: -50px;
  }

.overlayHelpArrow.bottomRight {
  -webkit-transform: scale(-1, -1);
  transform: scale(-1, -1);
  left: -55px;
  top: -25px;
  }

.overlayHelpArrow.bigArrow.bottomRight {
  left: -100px;
  top: -50px;
  }

/* Confirmation Styling */
.confirmation-wrap {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1999;
  }

.confirmation-overlay {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2000;
  background: rgba(0,0,0,0.4);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s;
  -moz-transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s;
  transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s;
  }

.confirmation-container.popup {
  opacity: 0;
  visibility: hidden;
  z-index: 2001;
  margin: 0;
  top: 50%;
  left: 50%;
  max-width: 800px;
  }

.confirmation-wrap.visible .confirmation-container.popup,
.confirmation-wrap.visible .confirmation-overlay {
  opacity: 1;
  visibility: visible;
  }

.confirmation-content {
  padding: 6px;
  }

.confirmContScroll {
  overflow: auto;
  max-height: 400px;
}

/* ** POPUPS ** */
#contentCover,
.contentCoverLSNext {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  visibility: hidden;
  opacity: 0;
  background: rgba(0,0,0,0.4);
  -webkit-transition: opacity 0.3s, visibility 0.3s;
  -moz-transition: opacity 0.3s, visibility 0.3s;
  transition: opacity 0.3s, visibility 0.3s;
  }

#contentCover.showPopupCover.hideCover {
  display: none;
  }  

#contentCover.showPopupCover.transparent,
.contentCoverLSNext.showCoverTransparent {
  opacity: 0;
  visibility: visible;
  }  

#contentCover.showPopupCover,
.contentCoverLSNext.showPopupCover,
#contentCover.showOverlayCover {
  opacity: 1;
  visibility: visible;
  }  
  
#contentCover.showOverlayCover {
  z-index: 1004;
  }

.popup {
  visibility: hidden;
  position: absolute;
  z-index: 1001;
  text-align: left;
  margin: 10px 20px 10px;
  /* Animated position *//*
  -webkit-transform: translateY(10%);
  -moz-transform: translateY(10%);
  -ms-transform: translateY(10%);
  transform: translateY(10%);
  opacity: 0;
  -webkit-transition: all 0.2s ease-in-out 0s;
  -moz-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;*/
  opacity: 0;
  -webkit-transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s;
  -moz-transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s;
  transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s;
  }

.popup.flipAnimate,
.flipAnimate {
  -webkit-transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s, -webkit-transform 0.6s;
  -moz-transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s, transform 0.6s;
  transition: opacity 0.3s, visibility 0.3s, box-shadow 0.3s, transform 0.6s;
  }

.showPopup.popup {
  /* Animated position *//*
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
  visibility: visible;*/
  opacity: 1;
  visibility: visible;
  z-index: 1001;
  }

.alwaysShowPopup.popup {
  opacity: 1;
  visibility: visible;
  z-index: 1000;
  }

.popupContainer {
  position: relative;
  }

#availableRoomList {
  overflow: auto;
  }

#helpInfosList a:link,
#helpInfosList a:visited,
#helpInfosList a:active,
#helpInfosList a:hover {
  text-decoration: none;
  color: inherit;
  }

.popup .formGroup {
  position: relative;
  margin: 15px 5px;
  }

.popup .btnCont {
  position: relative;
  margin: 10px;
  margin-left: 0;
  }

.popup .btnGroup {
  text-align: right;
  }

.popup .btnGroupLeft {
  text-align: left;
  }

.popup .formGroup label {
  width: 100px;
  position: absolute;
  left: 0; 
  bottom: 0;
  }

.popup .formGroup select {
  width: 210px;
  height: 21px;
  font-size: 12px;
  width: 250px;
  position: absolute;
  bottom: 0;
  right: 3px;
  }

#errorPopup h2 { 
  text-align: center; 
  padding: 15px 5px 5px;
  font-weight: bold;
  }

.popup .closePopup {
  position: absolute;
  top: 6px; right: 0px;
  z-index: 100;
  cursor: pointer;
  } 

.popup .closePopup:hover:before { color: #333; }

.popup .closePopup:before {
  font-family: icomoon;
  content: "\e64c";
  font-size: 13px;
  color: #a1a3a6;
  }

.popup p.info {
  padding: 5px 6px 4px 6px;
  background-color: #FFF1C7;
  border: 1px solid #fde08a;  
  }

.popup p.error {
  background-color: #FFCCCE;
  border: 1px solid #EC1C24;
  padding: 5px;
  }

.popup p.inline {
  display: inline-block;
  }

.popup .contentHeader { margin-bottom: 0px; }

.popup .popupContScroll, .popupContScroll {
  padding: 15px;
  padding-bottom: 0;
  max-height: 800px;
  position: relative;
  top: 0px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.popupContScroll:after {
  content: "";
  display: block;
  height: 15px;
  }

.popup.simple .popupContScroll {
  padding: 10px;
  padding-bottom: 0;
  }

.popup.simple .popupContScroll:after {
  height: 10px;
  }

.moreBtnPopupContent {
  padding: 6px 4px;
  }

.moreBtnPopupContent button {
  margin-top: 10px;
  margin-left: 0;
  margin-right: 0;
  padding: 6px 5px;
  }

.moreBtnPopupContent button:first-child {
  margin-top: 0;
  }

.moreBtnPopupContent button i {
  font-size: 13px;
  }

.popupOperationBtns {
  position: absolute;
  right: 10px;
  top: 10px;
  }

.popupOperationBtns ul li {
  margin-left: 5px;
  display: inline-block;
  vertical-align: middle;
  }

.popupOperationBtns button,
.popupOperationBtns button i {
  font-size: 20px;
  }

.popupOperationBtns ul li a {
  padding: 0 5px;
  }

.popupOperationBtns button i.im-dragdots,
.im-dragdots.rotated {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  }

.popupOperationBtns .additionalTextInfo {
  margin-top: 1px;
  color: #888;
  font-style: italic;
  }

.popupEditableTitle {
  display: block;
  position: relative;
  top: 4px;
  float: left;
  }

.popupEditableTitle .inlineEditElem {
  font-weight: bold;
  min-height: 16px;
  min-width: 5px;
  }

/* Alert Popup */
.alertPopup .closePopup {
  right: 10px;
  }

.alertPopup button {
  font-weight: normal;
  font-size: 12px;
  text-transform: none;
  }

.popup .popupContent {
  text-align: center;
  }

.popup .alertTextMain {
  margin: 0 10px;
  }

.popup .alertText {
  color: #000;
  margin-bottom: 5px;
  }

.popup .alertWarning {
  color: #dd0000;
  margin: 20px 0; 
  }

.popup .alertSpacer {
  height: 15px;
  }

.popup .alertTextNote {
  background-color: #FFF1C7;
  border-bottom: 1px solid #fde08a;
  margin: 0 10px;
  padding: 4px 3px;
  font-size: 11px;
  color: #333;
  font-weight: bold;
  }
 
.popup .popupButtons {
  margin-bottom: 10px;
  margin-top: 15px;
  }

.confirmPinCont {
  margin: 10px 0 5px;
  }

.pinNumberHead {
  font-weight: bold;
  margin: 5px 0;
  }

.pinNumber {
  display: inline-block;
  margin-right: 5px;
  border: 1px solid #E4E4E4;
  border-radius: 2px;
  padding: 4px 5px;
  }

.pinNumberInput {
  width: 60px;
  }

.pinInfo {
  font-size: 11px;
  color: #777;
  font-style: italic;
  margin-top: 5px;
  }

/* Account popop */

/* Account settings  Popup */
table#user_account td {
  padding: 1px;
  vertical-align: middle;
  }

table#user_account td.user_acc_label {
  max-width: 150px;
  }

.popup_setaccount {
  visibility: hidden;
  position: absolute;
  }

.popup_setaccount .closePopup {
  position: absolute;
  top: 0; right: 10px;
  z-index: 100;
  width: 10px; height: 10px;
  background: url(../ez_images/ico_x_big.png) no-repeat center left;
  cursor: pointer;
  } .popup_setaccount .closePopup:hover { background-position: center right; }

#user_account {
  width: 100%;
  }

.useracc_text {
  font-size: 11px;
  padding: 4px;
  margin: 0 10px;
  display: block; 
  background-color: #FFF1C7;
  border-bottom: 1px solid #fde08a;
  }

#user_account input,
#user_account select { 
  width: 198px; 
  margin-lefT: 5px;
  }

/*About Popup*/

#about_logo {
  background: url(../ez_images/ls_intuity_logo_color.png) no-repeat;
  background-size: 150px 75px;
  width: 150px;
  height: 75px;
  margin: 20px auto;
  cursor: pointer;
  }

#about_logo a {
  text-decoration: none;
  width: 100%;
  height: 100%;
  }

#version {
  font-size: 17px;
  color: #919195;
  text-align: center;
  margin: 8px auto;
  padding-bottom: 10px;
  }

.moreInfoCont {
  text-align: center; 
  margin: 40px 0px;
  }

.moreInfo {
  padding: 4px 15px; 
  border-radius: 100px; 
  color: #fff;
  margin: 0px auto; 
  display: inline-block;
  cursor: pointer;
  }

.moreInfo a.moreInfoLink {
  margin-right: 5px;
  font-weight: normal;
  color: #fff;
  text-decoration: none;
  }

.moreInfo:hover a.moreInfoLink {
  text-decoration: underline;
  }

.moreInfo .fa {
  position: relative;
  font-size: 13px;
  color: white;
  }

#meti_link { text-align: center; margin: 20px auto 10px; }
#meti_link a:link,
#meti_link a:visited,
#meti_link a:hover,
#meti_link a:active {
  color: #919195;
  font-size: 18px;
  text-decoration: none;
  }

#meti_link a:hover {
  text-decoration: underline;
  }

#allrights {
  color: #919195;
  font-size: 13px;
  text-align: center;
  margin: 0 auto 15px;
  }

.serial_cont {
  width: auto;
  height: auto;
  max-height: 100px;
  margin: 0 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.mls_serial, .vcs_serials  {
  text-align: center;
  margin: 0 auto;
  color: #919195;
  font-size: 13px;
  line-height: 19px;
  }

/* Window Layout popup  */

.advancedLayoutSettings {
  display: none;
  }

#windowLayoutSettings .setting-label {
  max-width: 85px;
  width: 85px;
  }

#windowLayoutSettings .popupListHead {
  margin-right: 20px;
  }

.autoAnnotPanelSettings {
  padding: 10px 0 5px 8px; 
  }

.popupInfoTip.infoTip {
  position: absolute;
  top: 10px; right: 10px;
  z-index: 100;
  }

/* ** EZ Calendar ** */
/* Date picker calendar icon */
.dateBox { position: relative; display: inline-block; }

.dateBox label, .dateBox input, .dateBox .icon {
  display: block;
  float: left;
  }

.dateBox button.ui-datepicker-trigger:after {
  display: none;
  }

.dateBox button.ui-datepicker-trigger {
  background: none;
  border: 1px solid transparent;
  box-shadow: none;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 0px;
  top: -1px;
  cursor: pointer;
  width: 26px;
  }

.dateBox .icon,
.dateBox .ui-datepicker-trigger {
  cursor: pointer;
  position: absolute;
  top: -1px;
  right: 1px;
  font-weight: normal!important;
  text-decoration: none!important;
  background: none;
  border: 1px solid transparent;
  line-height: normal;
  }

.dateBox button.ui-datepicker-trigger:before,
.dateBox a.icon:before {
  content: "\e618";
  font-family: icomoon;
  font-size: 18px;
  color: #666;
  position: relative;
  top: 3px;
  left: 0px;
  height: auto;
  }

.dateBox button.ui-datepicker-trigger img { display: none; }

.dateBox button.ui-datepicker-trigger[disabled] {
  background: none!important;
  border: 1px solid transparent!important;
  box-shadow: none!important;
  }

.dateBox input {
  padding-right: 25px;
  }

.loading.sessSetup {
  display: none;
  width: 16px;
  height: 16px;
  float: left;
  margin-left: 15px;
  margin-top: 3px;
  padding-left: 22px;
  color: #666;
  font-size: 11px;
  background: url(../ez_images/loading_icon.gif) no-repeat;
  }

.calendar {
  z-index: 100000;
  }

.fc-content {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.fc-view {
  overflow-x: hidden!important;
  }

.fc-view-month table {
  padding-bottom: 1px!important;
  }

.popupCont, .sessionSetupCont {
  max-height: 800px;
  position: relative;
  top: 0px;
  }

.sessionSetupCont {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.sessStartCont, .sessEvent {
  float: left;
  margin-right: 70px;
  }

.sessLabel {
  display: block;
  float: left;
  margin-right: 20px;
  padding-left: 12px;
  width: 100px;
  font-weight: normal;
  text-align: left;
  font-size: 12px;
  }

.sessionSetupCont input[type=text] {
  font-size: 12px;
  color: #333;
  width: 175px;
  }

.sessionSetupCont input[type=checkbox] {
  margin: 0 5px 0 5px;
  height: auto;
  border: none;
  }

.sessEvent select {
  width: 250px;
  }

.sessRooms {
  background: white;
  border: 1px solid #bbbdbf;
  width: 238px; 
  max-height: 130px;
  min-height: 100px;
  height: auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  text-align: left;
  padding: 5px;
  }

.sessRooms label {
  display: block;
  line-height: 22px;
  width: auto;
  }

.sessBtnCont .saveBtns {
  margin-bottom: 5px;
  }

button.sessBtn {
  text-transform: none;
  font-weight: normal;
  font-size: 12px;
  border-radius: 2px;
  }

.warnSession {
  display: none;
  margin: 0 0 20px 0;
  text-align: center;
  background: none repeat scroll 0 0 #FFF1C7;
  border-bottom: 1px solid #fde08a;
  color: red;
  padding: 3px 5px 2px;
  font-size: 11px;
  }

.occupiedRooms a:link,
.occupiedRooms a:visited,
.occupiedRooms a:active {
  color: #231F20;
  text-decoration: none;
  font-weight: normal;
  position: relative;
  }

.noOccuppied {
  font-style: italic;
  color: #888; 
  }

.printCalBtn, .printEmailBtn {
  float: right;
  position: relative;
  top: 5px;
  right: 7px;
  cursor: pointer;
  margin-left: 13px;
  }

.printCalBtn:before, .printEmailBtn:before { font-size: 20px; }

#emailPopup .closePopup {
  right: 7px;
  }

#emailPopup button {
  font-weight: normal;  
  }

.emailContent {
  text-align: center;
  margin: 15px;
  height: auto;
  }

.emailInfo {
  color: #777;
  font-style: normal;
  margin: 10px auto;
  }

.emailToInput {
  width: 250px;
  font-size: 12px;
  }

.emailTo {
  padding: 3px;
  color: #777;
  font-style: italic;
  padding: 25px 10px 26px;
  }

.oRoomsDetails {
  background: #f9f9f9;
  border: 1px solid #ddd;
  padding: 5px 5px;
  margin-bottom: 5px;
  margin-top: -1px;
  display: none;
  }

.oRoomsDetails ul {
  list-style-type: disc;
  margin-left: 15px;
  }

.oRoomsDetails ul li {
  cursor: pointer;
  font-size: 11px;
  color: #333;
  line-height: 16px;
  }

.oRoomsDetails ul li span {
  color: #777;
  font-style: normal;
  }

.oRoomsDetails ul li:hover {
  text-decoration: underline;
  }

/* Duration Slider */
.sessDuration {
  float: left;
  margin-right: 3px;
  width: 63px;
  }

.durationSlider {
  float: left;
  }

.durationSliderBg { width: 151px; }
  
#slider { display: block; }

.durationSliderPlace {
  border-radius: 0!important;
  background: none!important;
  border: none!important;
  margin: 0 12px 0 0!important;
  }

.durationSliderBg {
  background: url(../ez_images/slider_bg.png) repeat-x;
  height: 19px;
  border: 0;
  float: left;
  }

.durationSliderHandle {
  border-radius: 0!important;
  background: url(../ez_images/slider_handle.png) no-repeat !important;
  width: 12px !important;
  height: 28px !important;
  border: 0 !important;
  top: -5px!important;
  margin: 0 !important;
  }.durationSliderHandle:hover { background-position: center bottom!important; }

.sliderDown, .sliderUp {
  background: url(../ez_images/slider_down.png) no-repeat;
  width: 17px;
  height: 19px;
  float: left;
  cursor: pointer;
  }.sliderDown:hover { background-position: center bottom; }

.sliderUp {
  background: url(../ez_images/slider_up.png) no-repeat;
  }.sliderUp:hover { background-position: center bottom; }

.inactiveSlider {
  display: none;
  width: 190px;
  height: 30px;
  margin-top: -6px;
  position: absolute;
  background: white;
  z-index: 10;
  filter:alpha(opacity=100);
  -moz-opacity:1;
  opacity: 1;
  }

.fc-event.session_debrief, .session_debrief .fc-event,
.session_debrief .ui-selectmenu-item-icon,
.session_debrief .fc-event-time {
  background: #b280c4!important;
  border-color: #b280c4!important;
  color: white!important;
  }

.fc-event.session_exam, .session_exam .fc-event,
.session_exam .ui-selectmenu-item-icon,
.session_exam .fc-event-time {
  background: #faab70!important;
  border-color: #faab70!important;
  color: white!important;
  }

.fc-event.session_lab, .session_lab .fc-event,
.session_lab .ui-selectmenu-item-icon,
.session_lab .fc-event-time {
  background: #339C3F!important;
  border-color: #339C3F!important;
  color: white!important;
  }

.fc-event.session_maint, .session_maint .fc-event,
.session_maint .ui-selectmenu-item-icon,
.session_maint .fc-event-time {
  background: #03a2b0!important;
  border-color: #03a2b0!important;
  color: white!important;
  }

.fc-event.session_osce, .session_osce .fc-event,
.session_osce .ui-selectmenu-item-icon,
.session_osce .fc-event-time {
  background: #e75858!important;
  border-color: #e75858!important;
  color: white!important;
  }

.fc-event.session_sim, .session_sim .fc-event,
.session_sim .ui-selectmenu-item-icon,
.session_sim .fc-event-time {
  background: #603fc7!important;
  border-color: #603fc7!important;
  color: white!important;
  }

.fc-event.session_not_specified, .session_not_specified .fc-event,
.session_not_specified .ui-selectmenu-item-icon,
.session_not_specified .fc-event-time {
  background: #005daa!important;
  border-color: #005daa!important;
  color: white!important;
  }

#eventsType-button.session_all .ui-selectmenu-item-icon {
  background: none!important;
  width: 0;
  height: 0;
  }

.session_all .ui-selectmenu-status {
  padding-left: 5px!important;
  }

/* CALENDAR Customization */
.fc-state-highlight {
  background: #fefae0!important;
  }

.fc-event {
  color: #FFFFFF!important;
  }

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

.eventsTypeCont span a {
  background-color: #f4f4f4;
  background-repeat: repeat-x;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
  color: #333333;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  text-decoration: none!important;
  }

.eventsTypeCont span a.ui-state-hover {
  background-position: 0 -15px;
  background: #e6e6e6;
  color: #333;
  text-decoration: none;
  -webkit-transition: background-position 0.1s linear 0s;
  -moz-transition: background-position 0.1s linear 0s;
  transition: background-position 0.1s linear 0s;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25)!important;
  }

.eventsTypeCont span a.ui-state-active {
  background-color: #ccc;
  background-image: none;
  box-shadow: 0 2px 4px rgba(0,0,0,0.15) inset, 0 1px 2px rgba(0,0,0,0.05);
  outline: 0 none;
  }

.eventsTypeCont span a.ui-corner-all {
  border-radius: 2px!important;
  }

.eventsTypeCont span a.ui-corner-top {
  border-radius: 2px 2px 0 0!important;
  }

.fc-button {
  font-size: 11px!important;
  }

/* UI Selectmenu customizataion */
.eventsTypeCont a#eventsType-button, #eventsType-menu {
  min-width: 130px;
  }

#eventsType-menu li:first-child a {
  padding-left: 2px!important;
  }

#eventsType-menu li.ui-selectmenu-hasIcon a {
  padding-right: 10px!important;
  }

.eventsTypeCont .ui-selectmenu {
  height: 21px!important;
  }

.eventsTypeCont .ui-selectmenu-item-icon,
#eventsType-menu .ui-selectmenu-item-icon { 
  background-size: 13px 13px; 
  }

#eventsType-menu li.session_all .ui-selectmenu-item-icon {
  background-size: 0px;
  }

#eventsType-menu .ui-icon,
.eventsTypeCont .ui-icon {
  width: 13px;
  height: 13px;
  border-radius: 1px!important;
  }

.eventsTypeCont .ui-selectmenu-status {
  font-size: 11px!important;
  line-height: 13px!important;
  }

#eventsType-menu li .ui-icon {
  margin-top: -5px!important;
  }

#eventsType-menu .ui-selectmenu-status .ui-icon {
  margin-top: -7px!important;
  }

.ui-selectmenu-open {
  z-index: 99999!important;
  }

#eventsType-menu li.ui-selectmenu-hasIcon a, #eventsType-menu .ui-selectmenu-hasIcon .ui-selectmenu-status { 
  font-size: 11px!important;
  }
  
.ui-selectmenu:hover { border-color: #999!important; }

#eventsType-menu .ui-selectmenu-item-focus.ui-state-hover {
  background-color: #f4f4f4;
  background-repeat: repeat-x;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  }

.printView {
  height: auto!important;
  max-height: none!important;
  }

/* FULLCALENDAR Customization */

.fc-event-bg {
	display: none!important;
  }

.fc-event {
  text-shadow: none!important;
  overflow: hidden;
  }
.fc-event-time {
  display: inline-block;
  }

.fc-border-separate tr.fc-last th {
  background: #f0f0f0;
  vertical-align: middle;
  font-weight: normal;
  height: 25px;
  }

.fc-border-separate tr.fc-last th, .fc-border-separate tr.fc-last td,
.fc-widget-header, .fc-widget-content {
  border-color: #ddd;
  }

.fc-event-inner .fa-exclamation-triangle {
  background: #FF613A;
  padding: 1px 2px;
  border-radius: 1px;
  font-size: 10px;
  }

/* EVALUATION MAIN SECTION */

/* Participants */
.participantMainCont {
  display: table;
  table-layout: fixed;
  width: 100%;
  }

.participantSection {
  display: table-cell;
  padding: 0 10px;
  }

.participantSection:first-child {
  padding-left: 0;
  }

.participantSection:last-child {
  padding-right: 0;
  }

.participantSection .participantElement {
  background: #f4f4f4;
  padding: 10px 15px 15px;
  border-radius: 8px;
  }

.participantSection i {
  font-size: 85px;
  }

.activityParticipantGotoLink {
  margin-top: 30px;
  }

/* E-mails */
.emailSectionMainCont {
  position: relative;
  margin-top: 20px;
  }

.emailPropertiesMain {
  display: none;
  }

.emailStatus {
  position: relative;
  }

.emailStatus .infoTip {
  position: absolute !important;
  }

.emailComposeFilters .emailStatus .infoTip {
  top: 2px!important;
  }

.emailPropertiesMain .emailStatus .infoTip {
  top: 10px!important;
  }

.statusLabelTag {
  text-transform: uppercase;
  border-radius: 2px;
  display: inline-block;
  padding: 6px 8px;
  margin-right: 5px;
  width: 58px;
  text-align: center;
  color: #555;
  float: left;
  font-size: 11px;
  }

.emailType.emailIsSent .accordionHead  {
  cursor: auto!important;
  }

.emailType.emailIsSent .accordionSectionArrow {
  opacity: 0;
  }

.emailType.emailIsSent .emailEditIcon,
.emailType.emailIsSent .accordionContent {
  display: none!important;
  }

.emailType.emailIsSent .emailEditIcon {
  display: inline-block;
  }

.emailTitleSectionCont .emailTitleSection {
  min-height: 16px;
  max-width: 75%;
  }

.emailPropsContainer {
  display: table;
  width: 100%;
  box-sizing: border-box;
  }

.emailPropsContainer .settingsItem.emailProps {
  display: table-cell;
  vertical-align: top;
  width: auto;
  padding-right: 10px;
  }

.atDateInputs,
.relativeDateInputs,
.recipientSubgroup,
.perfCatSelect,
.newRecordDays {
  display: block;
  margin-top: 6px;
  position: relative;
  }

.atDateInputs .dateBox {
  margin-right: 4px;
  }

.pastDateInfo {
  color: #fba026;
  display: none;
  position: absolute;
  top: 8px;
  cursor: pointer;
  }

.pastDateInfo.active {
  display: inline-block;
  }

.pastDateInfo.active + .relativeDateLabel {
  padding-left: 18px;
  position: relative;
  top: 2px;
  }

.settingsItem.emailProps.emailDateProps {
  width: 300px;
  }

.settingsItem.emailRecipients {
 width: 245px;
}

.emailAtDateInput,
.emailDatesSelect,
.recipientSubgroupSelect,
.perfCat select
{
  width: 180px;
}

.recipientSelect,
.recipientSubgroup,
.settingsItem .newRecordDays {
  width: 260px;
  }

.recipientSubgroup,
.newRecordDays,
.perfCat {
  display: none;
  }

.recipientSubgroup.active,
.newRecordDays.active,
.perfCat.active {
  display: block;
  }

.emailDaysInput{
  width: 48px;
  }

.newRecordDaysInput {
  width: 48px;
  }

.emailDateBeforeAfterSelect {
  width: 128px;
  }

.readyToSendLabel {
  max-width: 108px;
  }

.readyToSendToggle {
  margin-top: 4px;
  }

.emailMoreBtnPopupContent {
  display: none;
  }

/* Assignments */
.defaultAssignmentsMsg {
  margin-top: 10px;
  }

.defaultAssignmentsMsg a {
  font-style: inherit;
  }

.assignmentStatusInfo {
	position: absolute; 
	bottom: 10px; 
	right: 20px;
	color: #888;
	font-style: italic;
 }

.evaluatorTypeSelectorWrapper {
  text-align: center;
  margin-bottom: 20px;
  padding-right: 20px;
  }

.assignmentsContainerScroll {
  overflow: auto;
  padding: 0 20px 0 3px;
  }

.assignmentsHead {
  margin-bottom: 20px;
  padding-right: 20px;
  }

.assignmentsHead td:nth-child(1) {
  padding-left: 75px;
  }

.assignmentsHead td:nth-child(3) {
  padding-right: 75px;
  }

.assignmentsHead .sectionHead {
  text-align: center;
  margin: 0;
  padding: 0;
  font-size: 14px;
  }

.assignmentsContainer {
  position: relative;
  }

.assignmentCellBox {
  display: table-cell;
  vertical-align: top;
  }

.assignmentCellBox.accessCellBox {
  width: 125px;
  }

.subgroupAccessSelector {
  margin-right: 30px;
  margin-top: 12px;
  }

.subgroupAccessSelector label {
  color: #777;
  font-size: 11px;
  position: relative;
  top: -1px;
  padding-left: 6px;
  width: 85px;
  word-wrap: break-word;
  }

.subgroupAccessSelector select {
  font-size: 11px;
  width: 90px;
  }

.subgroupAccessSelectorArrow {
  background: #f4f4f4;
  padding: 5px;
  height: 21px;
  position: relative;
  }

.subgroupAccessSelectorArrow:after {
  position: absolute;
  top: -7px;
  right: -20px;
  content: "";
  width: 0;
  height: 0;
  border-top-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-width: 23px;
  border-bottom-width: 22px;
  border-left-width: 20px;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #f4f4f4;
  }

.assignmentRow {
  margin-top: 15px;
  border-radius: 2px;
  border: 1px solid transparent;
  -webkit-transition: border-color 0.2s ease;
  -moz-transition: border-color 0.2s ease;
  transition: border-color 0.2s ease;
  }

.assignmentRow.deleteFocus {
  border-color: rgba(255, 0, 0, 0.3);
  }

.assignmentRow:first-child {
  margin-top: 0;
  }

.assignmentGroup {
  background: #f4f4f4;
  border: 1px solid transparent;
  border-radius: 2px;
  padding: 8px;
  position: relative;
  }

.removeAssignmentGroup {
  position: absolute;
  right: -20px;
  top: 6px;
  }

.removeAssignmentGroup button {
  font-size: 14px;
  }

.assignmentTitleCont {
  height: 25px;
  margin-bottom: 5px;
  }

/* Properties */
.ipHostname {
  padding: 4px 4px 4px 20px;
  }

.ipHostname select,
.ipHostname input {
  vertical-align: middle;
  width: 180px;
  }

.ipHostname input {
  width: 125px;
  }

/* Report Availability */
.activityReportHeadSection {
  display: inline-block;
  margin-right: 10px;
  }

.repavContainerScroll {
  overflow: auto;
  }

.activityReportHeadSection > span {
  vertical-align: middle;
  }

.learnerAccessContainerHead {
  margin-bottom: 20px;
  }

.learnerAccessContainerHead > div {
  position: relative;
  }

.learnerAccessContainerHead > h3 {
  padding: 0 0 10px;
  }

.reportAvailabilitySettingsContainer.popupContentTableRightElem {
  width: 50%;
  }

.reportAvailabilityContainer .treeView {
  padding: 0 10px;
  }

.reportAvailabilityContainer .treeViewCont .fancytree-icon {
  font-size: 16px;
  top: -1px;
  width: 18px;
  }

.reportAvailabilityContainer .treeViewCont ul.fancytree-container li {
  margin-top: 2px;
  }

.checkbox-second-level {
  padding-left: 15px;
  }

.caseSectionsToggle {
  padding: 2px 0!important;
  }

.caseSectionsToggle i {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  }

.caseSectionsToggle.open i {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  }

.caseSectionsToggleBtn {
  position: relative;
  top: -1px;
  }

.caseSectionsToggleCont {
  margin: 3px 10px 7px 28px;
  padding: 5px 10px;
  background: #f4f4f4;
  }

.caseSelectorCont .setting-value {
  padding-left: 5px!important;
  }

.caseSectionsToggleCont .setting-value {
  padding: 0!important;
  }

/* ** EZ Settings ** */
#contRooms .dataTables_scrollHead table thead th.roomCtrls,
#contStationCM .dataTables_scrollHead table thead th.STStatTH,
#contStationCM .dataTables_scrollHead table thead th.SPStatTH,
#contStationCM .dataTables_scrollHead table thead th.ADDStatTH {
  text-align: center;
  }

#contRooms .dataTables_scrollHead table thead th.roomCtrls,
#contStationCM .dataTables_scrollHead table thead th.STStatTH,
#contStationCM .dataTables_scrollHead table thead th.SPStatTH,
#contStationCM .dataTables_scrollHead table thead th.ADDStatTH {
  text-align: center;
  }

.mainSection {
  text-align: left;
  }

.timeCont {
  float: left;
  margin: 0;
  }

.currTime {
  position: relative;
  float: right;
  font-weight: bold;
  color: #404041;
  }

.currTime span {
  font-weight: normal;
  }

.timeRefresh {
  width: 16px;
  height: 16px;
  background: url(../ez_images/loading_clock.png) no-repeat 0 0;
  float: left;
  margin-right: 5px;
  }

.mainSettingsCont,
.mainSectionCont {
  position: relative;
  padding: 15px 0 15px 0;
  }

.settingsContents,
.mainSectionContents {
  -webkit-overflow-scrolling: touch;
  position: relative;
  padding: 0 15px 0 15px;
  overflow: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }

.sectionCenterLine {
  display: none;
  position: absolute;
  left: 50%;
  height: 100%;
  width: 1px;
  background: #ccc;
  }

.sectionCenterLine.showLine {
  display: block;
  }

.simulatorsLine.sectionCenterLine {
  left: 50%
  }

.tableContainer table tr td .draggableElement.blockElem {
  margin-right: 7px;
  }  
  
.tableContainer table tbody tr.hoverRnseTr td,
.tableContainer table tbody tr.odd.hoverRnseTr td,
.tableContainer table tbody tr.even.hoverRnseTr td,
.tableContainer table tbody tr.noRNSECaseTr:hover td.noRNSECase,
.tableContainer table tbody tr.odd.noRNSECaseTr:hover td.noRNSECase,
.tableContainer table tbody tr.even.noRNSECaseTr:hover td.noRNSECase,
.tableContainer table tr.even.highlightRow td,
.tableContainer table tr.odd.highlightRow td,
.tableContainer table tr.even.hightlightSpecialRow:hover td,
.tableContainer table tr.odd.hightlightSpecialRow:hover td {
  background-color: #FFF1C7;
  }

.tableContainer table tr.even.hightlightSpecialRow td,
.tableContainer table tr.odd.hightlightSpecialRow td {
  background-color: #afdff6;
  }

.tableContainer table tbody tr.noRNSECaseTr td.noRNSECase,
.tableContainer table tbody tr.odd.noRNSECaseTr td.noRNSECase,
.tableContainer table tbody tr.even.noRNSECaseTr td.noRNSECase {
  background: #fef9c2;
  }

.rnseCover {
  background: white;
  opacity: 0;
  -ms-filter: "alpha(opacity=0)";
  filter: alpha(opacity=0); 
  display: block;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 9;
  }

.selSpan.rnse select {
  margin: 5px 0;
  float: left;
  width: 100%;
  font-size: 12px;
  color: #444;
  }

.selSpanOK {
  margin: 0 auto;
  text-align: center;
  padding: 5px 0;
  }

.selSpanHead {
  padding: 5px 0;
  white-space: normal;
  line-height: 16px;
  font-size: 11px;
  }

.datedRNSE {
  color: #888;
  }

.mainSectionContents .dataTables_info {
  margin-left: 5px;
  margin-top: 26px;
  }

.mainSectionContents .noAdditionalBtns .dataTables_info {
  margin-top: 12px;  
  }
  
.mainSectionContents .dataTables_paginate {
  margin-right: 4px;
  margin-top: 15px;
  }

.tDesc {
  display: inline-block;
  padding: 0 3px;
  border: 1px solid transparent;
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  }

.tHighlightDesc {
  background: white;
  box-shadow: 0 0 3px #666;
  border-radius: 3px;
  padding: 0 3px;
  cursor: text;
  border: 1px solid #BBBDBF\0/;
  }

.tNewDesc {
  width: 95%;
  display: inline-block;
  font-size: 11px;
  border: 1px solid #BBBDBF;
  font-family: inherit;
  height: 23px;
  }

.tNewDesc:focus {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.065) inset!important;
  }

.additionalBtns {
  float: left;
  margin-top: 15px;
  margin-right: 10px;
  padding-bottom: 3px;
  display: none;
  }

.additionalBtns button {
  margin-left: 0;
  margin-right: 3px;
  margin-bottom: 2px; 
  }

.additionalBtnsRight {
  position: absolute;
  right: 0;
  }

/* EZ Settings - General */
h3 {
  padding: 10px 0;
  font-weight: bold;
  }

.fancyHead {
  font-size: 13px;
  color: #333;
  font-weight: bold;
  margin: 0px 0 15px;
  padding: 5px 7px;
  text-align: center;
  background: #f4f4f4;
  }

.settingsItem {
 /* display: block;*/
  display: table;
  padding: 7px 0;
  width: 100%; /*div table*/
  }

.settingsItem.tight {
  padding: 4px 0;  
  }  
 
.settingsItem.tightest {
  padding: 0;
  }
 
.settingsHelp {
  width: 21px;
  height: 20px;
  background-image: url(../ez_images/settings_help.png);
  background-position: 0 0;
  position: absolute;
  right: 15px;
  cursor: pointer;
  color: #ddd;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
  }.settingsHelp:hover { background-position: 0 -20px; }

.setting-label {
  /*float: left;*/
  width: 130px;
  text-align: left;
  /*margin-right: 20px;*/
  padding-right: 20px; /*div table*/
  padding-left: 12px; /*div table*/
  padding-top: 5px;
  display: table-cell; /*div table*/
  vertical-align: top; /*div table*/
  }

.settingsItem.floatMode .setting-label {
  width: auto;
  float: left;
  margin-top: 4px;
  display: block;
  padding-right: 20px;
  padding-left: 0;
  }

.settingsItem.floatMode .setting-value {
  width: auto;
  float: left;
  display: block;
  }

.setting-label.head {
  padding-left: 0;
  padding-right: 32px;
  }


.setting-label.first {
  padding-top: 0;
  margin-top: 0;
  }

.setting-label.noLeftPadding {
  padding-left: 0;
  }

.setting-in-label-input {
  float:right;
  }

.setting-value.single { padding-left: 12px; }
.setting-value.slimFloat { float: left; }

.setting-value {
  /*display: block;*/
  display: table-cell; /*div table*/
  vertical-align: middle; /*div table*/
  }

.setting-value.setting-value-details {
  padding: 5px;
  font-size: 11px;
  }   
  
.setting-value.setting-value-details > div {
  margin-bottom: 5px;    
  }

.setting-value.setting-value-details > div:last-child {
  margin-bottom: 0px;
  }

.setting-value.setting-value-details .popInput,
.setting-value.setting-value-details .popSelect,
.setting-value.setting-value-details .popTextarea {
  min-width: 188px;
  width: 188px;
  }

.setting-value-details.disabled:after {
  content: "";
  background: white;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0.5;
  position: absolute;
  width: 100%;
  z-index: 2;    
  }
  
.setting-value textarea { 
  width: 392px;
  max-width: 392px;
  min-width: 392px;
  height: 70px;
  max-height: 70px;
  min-height: 70px;
  font-size: 12px;
  padding: 3px;
  resize: none;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.setting-value textarea.medTall {
  height: 100px;
  max-height: 100px;
  min-height: 100px;
  }

.setting-value textarea.medTaller {
  height: 130px;
  max-height: 130px;
  min-height: 130px;
  }

.setting-value input[type="text"], 
.setting-value input[type="password"] {
  color: #444;
  }

.setting-value select {
  font-size: 12px;
  }

.setting-value input[type="checkbox"],
.setting-value input[type="radio"] {
  border: none;
  }

.setting-value input[type="checkbox"] {
  margin-left: 0;
  }


/* SettingItem label and value one above the other */
.settingsItem.aboveEachOther {
  display: block;
  }

.settingsItem.aboveEachOther .setting-label {
  display: block;
  width: auto;
  padding: 5px 0;
  }

.settingsItem.aboveEachOther .setting-value {
  display: block;
  }

.settingsItem.aboveEachOther .setting-label.first {
  padding-top: 0;
  margin-top: 0;
  }


.settingsItem.aboveEachOther.paddingFix {
  padding: 12px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }

.cabinetSelectWrapper > button {
  width: 100%!important;
  min-width: 100%!important;  
  }

input.instName { width: 400px; }
input.mastpass { width: 171px; }
input.thresh { width: 30px; }
select.vBookmarksSelect { width: 289px; }
input.bmNewInput { width: 289px; }
input.setrcntev, input.resetPwd, input.thresh { width: 40px; }

input.warn,
button.warn,
select.warn {
	border: 1px solid #fba026 !important;
  background-color: #f9ecdb!important;
  color: #444;
  }

input.error,
button.error {
  border: 1px solid #d00 !important;
  background-color: #fdd !important;
  }

select.error {
  border: 1px solid #d00;
  background-color: #fdd;
  }

.warnMsgCont {
  margin-top: 4px;
  }

.itemLine {
  border-bottom: 1px dotted #e7e7e7;
  height: 1px;
  margin: 5px 0;
  background: none;
  }

.itemLine.solid {
  border-bottom: 1px solid #ccc;
  }

.itemLine.dotted {
  border-bottom: 1px dotted #aaa;
  }

.itemLine.highSeparator {
  margin: 25px 0 20px;
  }

.vidBookMarksLabel {
  vertical-align: top;
  padding-top: 4px;
  }

.vBookmarksCases {
  font-style: italic;
  height: 16px;
  }

.vBookmarksCases span {
  font-style: italic;
  display: inline-block;
  }

#video_warning {
  width: 400px;
  max-width: 400px;
  min-width: 400px;
  }

.educationalMsg {
  width: 400px;
}

/* Preset Annotation table */
.annotationsTableCont table.annotationsTable,
.activityTypeTableCont table#activityTypeListWrapper {
  width: 100%!important; /* forced to 100%, because datatable uses px in some cases */
  }

.activityTypeTableCont table thead {
  background: none!important;
  border: 0!important;
  }

.annotationsTableCont table.annotationsTable th,
.activityTypeTableCont table thead th {
  font-size: 12px;
  padding: 0!important
  }

.annotationsTableCont table.annotationsTable tr.odd > td,
.activityTypeTableCont table#activityTypeListWrapper tr.odd > td {
  background: #f4f4f4;
  }

.annotationsTableCont table.annotationsTable tr.even > td,
.activityTypeTableCont table#activityTypeListWrapper tr.even > td {
  background: #fff;
  }

.annotationsTableCont table.annotationsTable tr td,
.activityTypeTableCont table#activityTypeListWrapper tr td {
  padding: 1px 3px;
  vertical-align: middle;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  }

.annotationsTableCont table tr td.dataTables_empty,
.activityTypeTableCont table tr td.dataTables_empty {
  border: none;
  font-style: italic;
  color: #666;
  font-size: 11px;
  }

.annotationsTableCont table.annotationsTable tr.odd > td.dataTables_empty,
.activityTypeTableCont table#activityTypeListWrapper tr.odd > td.dataTables_empty {
  background: transparent;
  }

.annotationsTableCont table tr td a {
  color: #222;
  text-decoration: none;
  font-weight: normal;
  padding: 2px 3px;
  display: inline-block;
  border: 1px solid transparent;
  font-size: 11px;
  }

.annotationsTableCont table tr td a.annotationDraggable {
  cursor: move;
  cursor: -moz-grab;
  cursor: -webkit-grab;
  }

.annotationsTableCont table tr td a.annotationDraggable:hover,
.tableDraggableElem:not(.noDrag):hover {
  text-decoration: none;
  border-radius: 3px;
  border: 1px dashed #aaa;
  box-shadow: 0 0 3px #aaa;
  background: white;
  }

.ui-draggable-annots,
.ui-draggable-annots:hover,
.ui-draggable-annots:active,
.ui-draggable-tableDraggableElem,
.ui-draggable-tableDraggableElem:hover,
.ui-draggable-tableDraggableElem:active {
  color: #222;
  text-decoration: none;
  font-weight: normal;
  cursor: move;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
  padding: 2px 3px;
  font-size: 11px;
  box-shadow: 0 0 3px #666;
  border-radius: 3px;
  border: 1px dashed #aaa;
  z-index: 2001;
  opacity: 0.85;
  background: #fff;
  }

.annotationsTableCont .tableBottomBorder {
  border-color: #ddd; 
  }

.addAnnotContainer,
.addActivityTypeContainer {
  padding: 3px;
  position: relative;
  margin-top: 8px;
  margin-bottom: 5px;
  }

.removeAnnotCont {
  position: relative;
  }

.annotColorPicker a:before {
  text-shadow: 1px 0 0 rgba(0,0,0,0.3);
  }

.defaultAnnotColor {
  overflow: hidden;
  display: inline-block;
  }

.defaultAnnotColorText {
  margin: 7px 7px 0 3px;
  }

.defaultAnnotColor li a {
  display: block;
  position: relative;
  top: 0;
  }

.defaultAnnotColor li {
  float: left;
  border-radius: 3px;
  margin: 0 1px 0 1px;
  cursor: pointer;
  padding: 4px 6px;
  border: 1px solid transparent;
  background: #fff;
  }

.defaultAnnotColor li.active {
  background: #f4f4f4; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 20%, #f4f4f4 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(20%,#ffffff), color-stop(100%,#f4f4f4)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #ffffff 20%,#f4f4f4 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #ffffff 20%,#f4f4f4 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #ffffff 20%,#f4f4f4 100%); /* IE10+ */
  background: linear-gradient(to bottom, #ffffff 20%,#f4f4f4 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f4f4f4',GradientType=0 ); /* IE6-9 */
  border: 1px solid #C1C1C1;
  }

.defaultAnnotColor li.active,
.defaultAnnotColor li.active a {
  cursor: auto;
  }

.defaultAnnotColor li:hover {
  border: 1px solid #C1C1C1;
  }

.recycleIcon {
  float: right;
  padding: 10px;
  position: relative;
  right: -2px;
  margin-top: 5px;
  }

.recycleTop {
  background: url(../ez_images/icon_recycle_bin.png) no-repeat;
  background-position: 0 0;
  width: 17px;
  height: 5px;
  }
  
.recycleBottom {
  background: url(../ez_images/icon_recycle_bin.png) no-repeat;
  background-position: 0 -5px;
  width: 17px;
  height: 14px;
  }  

.removeAnnotCont.annotCatDropActive.annotCatDropHover {
  background: transparent;
  }

.recycleIcon .recycleTop,  
.recycleIcon .recycleBottom {
  -webkit-transform: rotate3d(0,0,1,0deg);
  -ms-transform: rotate3d(0,0,1,0deg);
  transform: rotate3d(0,0,1,0deg);
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;  
  } 
 
.recycleIcon.open1 .recycleTop,  
.recycleIcon.open1 .recycleBottom {
  -moz-transform-origin: right bottom; 
  -webkit-transform-origin: right bottom; 
  -ms-transform-origin: right bottom;
  transform-origin: right bottom;
  }
 
.recycleIcon.open1 .recycleTop {
  -moz-transform: rotate3d(0,0,1,45deg);
  -webkit-transform: rotate3d(0,0,1,45deg);
  -ms-transform: rotate3d(0,0,1,45deg);
  transform: rotate3d(0,0,1,45deg);
  }

.recycleIcon.open2 .recycleTop,  
.recycleIcon.open2 .recycleBottom {
  -moz-transform-origin: right bottom; 
  -webkit-transform-origin: right bottom; 
  -ms-transform-origin: right bottom;
  transform-origin: right bottom;
  }  
  
.recycleIcon.open2 .recycleTop {
  -moz-transform: rotate3d(0,0,1,90deg);
  -webkit-transform: rotate3d(0,0,1,90deg);
  -ms-transform: rotate3d(0,0,1,90deg);
  transform: rotate3d(0,0,1,90deg);
  }  

#presetAnnotsTip,
#activityTypesTip {
  float: right;
  position: relative;
  left: -8px;
  }

#newPresetAnnotation,
.newActivityType {
  float: left;
  width: 410px;
  padding: 5px;
  }

button.addPresetAnnotation,
button.addActivityType {
  font-size: 15px;
  padding: 2px 4px;
  position: relative;
  margin-right: 0;
  }

.annotProperties {
  margin-bottom: 8px;
  }

/* Activity Type Settings */
.tableDraggableElemCont {
  position: relative;
  }

.tableDraggableElem {
  display: inline-block;
  padding: 2px 3px;
  border: 1px solid transparent;
  max-width: 80%;
  }

.tableDraggableElemIconRight {
  position: absolute;
  right: 10px;
  }

.tableDraggableElem .color-rect {
  top: 0;
  }

.tableDraggableElem span {
  top: -1px;
  }

/* Location Management Settings */
.locationContainer {
  margin-top: 15px;
}

.locationContainer .newLocation {
  float: left;
  width: 420px;
  margin-right: 5px;
}

/* EZ Settings - Localization */
.localSelect {
  width: 200px;
  }

#lang_ctrl {
  width: 400px;
  overflow: hidden;
  }

/* EZ Settings - Security */
.secInput {
  width: 300px;
  }

.secSpan {
  width: 300px;
  display: block;
  word-wrap: break-word;
}

textarea.ldap_input {
  max-width: 300px;
  min-width: 300px;
  width: 300px;
  min-height: 26px;
  max-height: none;
  }

.ldapSettings .flexElementContainer {
  -webkit-flex: 0 1 auto;
  flex: 0 0 auto;
  border-right: 1px solid #e7e7e7;
  padding-right: 18px;
  margin-right: 18px;
  margin-top: 15px;
  margin-bottom: 15px;
  }

.ldapSettings .flexElementContainer:last-child {
  border: 0;
  }

.ldapServerSelect {
  width: 300px;
  }

.ldapServerSetupCont {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  }

.ldapSSLSettings {
  margin: 5px 0;
  }

.ldapServerSetupCont .ldapServerInputCont {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  }

.ldapServerSetupCont .ldapServerBtnsCont {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-top: 8px;
  }

.ldapServerSelect .infoBox {
  margin-right: 3px;
  margin-bottom: 3px;
  }

@media all and (max-width: 1330px) {
  .ldapSettings {
    -webkit-flex-direction: column;
    flex-direction: column;
  }

  .ldapServerSelect {
    width: auto;
  }

  .ldapSettings .flexElementContainer {
    border-right: 0;
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 15px;
    margin-top: 0;
  }

}

/* EZ Settings - Intercom */
#icomTable tr td {
  cursor: default;
  }

.ez_speaker {
  background-image: url(../ez_images/ez_speaker.png);
  background-position: 0px 0px;
  background-repeat: no-repeat;
  width: 25px;
  height: 17px;
  }

#intercomAudioAppDividing {
  width: 100%;
  }

#intercomAudioAppDividing td.audioTableTd {
  vertical-align: top;
  padding-right: 15px;
  }

#intercomAudioAppDividing td.icomTd {
  vertical-align: top;
  padding-top: 21px;
  }

span.audioDesc {
  display: inline-block;
  min-height: 21px;
  }

.recActiveText {
  color: #d91b24;
  font-weight: bold;
  }

/* EZ Settings - Station */
#statsTable tbody tr td.invStation {
  color: #d91b24;
  }

#statsTable tr td {
  cursor: default;
  }

.stationChecked.ezApply {
  background-position: 0 0;
  }

.stationUnchecked.ezApply {
  background-position: 0 -40px;
  opacity: 0.3;
  }

.ezCheck {
  background-image: url(../ez_images/station_check.png);
  background-position: 0 0;
  width: 22px;
  height: 22px;
  position: relative;
  right: 5px;
  margin: 0 auto;
  cursor: pointer;
  }

.ezCheck, .ezCheck:hover { background-position: 0 0; cursor: auto; }

/* EZ Settings - Downloads */
.downloadHead {
  display: block;
  padding: 10px 0 10px 12px;
  margin-bottom: 15px;
  }

.downloadUlCont {
  margin-top: 5px;
  }

.downloadUlCont ul li {
  padding: 5px 0;
  }

.downloadUlCont ul li a {
  padding-left: 17px;
  }

/* EZ Settings - Client Tester */
.clientTestFlash {
  float: left;
  }

.porttestMsg {
  display: none;
  width: 458px;
  background: #f5f5f5;
  padding: 8px 10px;
  text-align: center;
  border: 1px solid #e9e9e9;
  }

.clientTestResults {
  float: left;
  width: 440px;
  margin: 20px 0 0 0;
  }

.clientResultItem {
  padding: 7px 0;
  }

.clientBold {
  font-weight: normal;
  }

.downloadLatest {
  width: 350px;
  margin: 5px 0 0 0;
  line-height: 15px;
  }

.downloadLatest span {
  color: #444;
  font-style: italic;
  font-size: 12px;
  margin-right: 5px;
  }

.downloadLatest a {
  width: 20px;
  height: 20px;
  margin-left: 5px;
  position: relative;
  top: 3px;
  display: inline-block;
  }

.downloadLatest a.firefox_icon { background: url(../classic_images/firefox_icon.png) no-repeat; }
.downloadLatest a.ie_icon { background: url(../classic_images/ie_icon.png) no-repeat; }
.downloadLatest a.safari_icon { background: url(../classic_images/safari_icon.png) no-repeat; }
.downloadLatest a.chrome_icon { background: url(../classic_images/chrome_icon.png) no-repeat; }
.downloadLatest a.qt_icon { background: url(../classic_images/qt_icon.png) no-repeat; }
.downloadLatest a.amc_icon { background: url(../classic_images/amc_icon.png) no-repeat; }
.downloadLatest a.flash_icon { background: url(../classic_images/flash_icon.png) no-repeat; }

/* EZ Settings - Rooms */
#roomsSetupPopup .flexElementContainer {
  padding-right: 50px;
  -webkit-flex-basis: 372px;
  flex-basis: 372px; /* Must specify width because of IE11 */
  }

#roomsSetupPopup select,
#roomsSetupPopup input {
  min-width: 220px;
  width: 220px;
  }

#roomsTable tr td {
  cursor: default;
  }

#simRecChk .setting-value {
  max-width: 200px;
  }

/* EZ Settings - Email */
select.emailFromSelect,
select.emailTemplatesSelect {
  width: 266px;
  }

.email_btns {
  display: inline;
  margin-left: 23px;
  }

input.emailAdd {
  width: 266px;
  }

textarea.emailTemplateBody {
  min-height: 300px;
  height: 300px;
  max-height: 300px;
  width: 435px;
  min-width: 435px;
  max-width: 435px;
  margin-left: 15px;
  }

.emailTemplateBodyCont {
  float: left;
  padding-bottom: 10px;
  margin-top: -32px;
  left: 8px;
  position: relative;
  }

.emailTemplateBodyCont .setting-value {
  float: left;
  }

.emailTemplates {
  float: left;
  margin-left: 5px;
  margin-top: 10px;
  position: relative;
  width: 430px;
  }

.etlistGlobalCont {
  margin-bottom: 25px;
  margin-left: 5px;
  margin-right: 30px;
  float: left;
  }

.etlist_global,
.etlist {
  margin-left: 5px;
  font-size: 11px;
  }

.etlistCont {
  float: left;
  margin-left: 5px;
  }

.etListHead {
  font-weight: bold;
  margin-bottom: 10px;
  max-width: 195px;
  }

.fieldInfo {
  color: #777;
  font-style: italic;
  margin: 0 0 10px 5px;
  }

.emailTemplates ul li {
  padding: 3px 0;
  cursor: pointer;
  }

.emailTemplates ul li .emtempvar {
  background: #F5F5F5;
  border: 1px dotted #CCCCCC;
  font-weight: normal;
  padding: 1px 5px;
  display: inline-block;
  max-width: 175px;
  }.emailTemplates ul li .emtempvar:hover { border: 1px dotted #333; background: #efefef; }

.smtpInput { width: 180px; }

#email_http_host {
  margin-left: 7px;
  }

/* EZ Settings - Cameras */
#camerasTable tr td {
  cursor: default;
  }

.cameraContBorder {
  border: 3px solid #ddd;
  width: 336px;
  height: 256px;
  }

.cameraContBg { background: black; }

#videoEmbedCont {
  position: relative;
  }

.cameraContBorder.isDak {
  border: none;
  background: none;
  display: none;
  width: 1px;
  height: 1px;
  position: relative;
  top: 0;
  left: -8000px;
  }

.camSettingsTable {
  text-align: center;
  }

.videoEmbed {
  display: table;
  margin: 0 auto 20px;
  }

.camerasProps {
  display: table;
  margin: 0 auto;
  padding-right: 12px;
  }

.camSettingsTable .camPropTilt {
  vertical-align: middle;
  }

.camSettingsTable a {
  display: inline-block;
  }

.ptztxt {
  position: relative;
  top: -7px;
  display: inline-block;
  margin: 0 5px;
  text-transform: uppercase;
  }

.labelTilt { 
  margin: 7px 0; 
  text-transform: uppercase;
  }

.labelCamProps {
  font-size: 11px;
  }

.camPropIcons {
  cursor: pointer;
  }

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

.camerasSetupCont .ptzPan, 
.camerasSetupCont .ptzZoom, 
.camerasSetupCont .ptzFocus {
  margin-top: 10px;
  }

/* EZ Settings - Dictionary */
#educTable tr td,
#ordTable tr td {
  cursor: default;
  }

#tableEduc { 
  float: left;
  }

#tableOrd {
  float: right;
  }

.detailsCont {
  width: 49%;
  }

/* EZ Settings - RM Units */
.unitTypeName {
  margin: 5px 0 0 7px;
  font-size: 11px;
  color: #444;
  }

/* EZ Settings - Simulators & Bridges */
.contWBridge {
  float: left;
  width: 49%;
  }

.contSimulators {
  float: right;
  width: 49%;
  }

.wnetLoading {
  margin: 3px 0 0 10px;
  }

/* EZ Settings Central Server Client */

.CSClientEnabled {
  width: 100px;
  }

.settingBroadcast {
  display: none;
  }

/* Range slider customization */
.sliderRangeWrapper {
  width: 491px;
  margin-left: 6px; 
  margin-top: 6px; 
  }

.sliderRangeOptions {
  margin: 20px 0;
  }

#sliderRange .ui-slider-range,
#sliderRange.inverted.ui-widget-content {
  border: 1px solid #38afea; /* TODO: SASS */
  background: #38afea; /* TODO: SASS */
  }

#sliderRange {
  width: 481px;
  height: 6px;
  border: 1px solid transparent;
  display: inline-block;
  }

#sliderRange .ui-slider-handle {
  background: #fff;
  border: 1px solid #bbb;
  border-radius: 100%; 
  height: 18px;
  width: 18px; 
  top: -7px;
  outline: none;
  margin-left: -9px;
  cursor: pointer;
  }

#sliderRange .ui-slider-handle:hover {
  background: #f7f7f7;
  border: 1px solid #bbb;
  }

#sliderRange .ui-slider-range, #sliderRange.inverted.ui-widget-content {
  top: -1px;
  }

#sliderRange.ui-widget-content,#sliderRange.inverted .ui-slider-range {
  top: -1px;
  background: #e5e5e5;
  }

#sliderRange.inverted .ui-slider-range {
  border: 1px solid transparent;
  }

.sliderRangeSteps {
  position: relative;
  left: -6px;
  display: inline-block;
  margin-top: 5px;
  width: 481px;
  height: 30px;
  }

.sliderRangeSteps span {
  display: inline-block;
  width: 16px;
  color: #aaa;
  font-size: 11px;
  text-align: center;
  position: absolute;
  left: 0;
  }

.sliderRangeSteps span.stepEmpty {
  height: 11px;
  overflow: hidden;
  }

.currValueCont {
  margin-right: 15px;
  display: inline-block;
  }

#sliderRange.ui-slider-disabled.ui-state-disabled ~ .sliderRangeSteps {
  opacity: 0.3;
  }

#sliderRange.ui-slider-disabled.ui-state-disabled .ui-slider-handle {
  background-position: 0 0;
  cursor: auto;
  }

/* Progress Bar */
.progressBarStatus {
  background: #38afea; /* TODO: SASS */
  }

.progressBar {
  display: inline-block;
  border-radius: 20px 20px 20px 20px;
  background: #e5e5e5;
  border: 1px solid transparent;
  height: 8px;
  width: 350px;
  overflow: hidden;
  }

.progressBarStatus {
  color: white;
  text-align: right;
  font-size: 10px;
  line-height: 14px;
  height: 100%;
  width: 0%;
  }

.progressBarCont {
  position: relative;
  display: inline-block;
  }

.progressBarWrap {
  margin-top: 5px;
  margin-bottom: 15px;
  }

.valueTooltipCont {
  position: absolute;
  top: -33px;
  width: 45px;
  text-align: center;
  margin-left: -23px;
  }

.valueTooltip {
  padding: 4px;
  border-radius: 2px;
  color: #333;
  background: #FFF1C7;
  border: 1px solid #FDE08A;
  }

.valueTooltipArrowBorder,
.valueTooltipArrow {
  position: relative;
  margin: 0 auto;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 6px 5px 0 5px;
  border-color: #FDE08A transparent transparent transparent;
  }

.valueTooltipArrow {
  position: absolute;
  top: -8px;
  left: -5px;
  border-color: #FFF1C7 transparent transparent transparent;
  }

.uploadDisabledBtns {
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 5px;
  }

.uploadStatusTooltip {
  margin-left: 5px;
  }

#upload_progress_text {
  margin-bottom: 10px;
  }

#cs_sys_password {
  margin-right: 5px;
  display: block;
  margin: 0 auto;
  width: 250px;
  }

#cs_connectivity_result {
  display: none;
  min-width: 500px;
  margin-bottom: 7px;
  min-height: 20px;
  }

#cs_connectivity_result > #fail > span {
  margin-right: 10px;
  }

#cs_connectivity_result > #fail > span.first {
  margin-right: 5px;
  }

#cs_connectivity_result > #fail > span#rsync_all_ok {
  margin-right: 0;
  }

#cs_connectivity_result tr td:first-child {
  font-weight: bold;
  }

#cs_connectivity_result tr td {
  min-width: 35px;
  }

#cs_connectivity_result table tr.network td {
  border-bottom: 1px solid #ddd;
  }

#cs_connectivity_result table tr.upload td {
  border: none;
  }

#cs_connectivity_result table tr:hover td {
  background: transparent;
  } 

#cs_progress {
  display:none;
  }

/* EZ Settings Central Server */

.csImportLogCont,
.csAuthLogCont,
.csCExportLogCont,
.csCTransferLogCont {
  padding: 10px 20px 10px 20px;
  }

.logContScroll {
  max-height: 800px;
  position: relative;
  top: 0px;
  -webkit-overflow-scrolling: touch;
  }

.logPanel .logDatesCont {
  float: left;
  width: 150px;
  padding-right: 10px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.logPanel .logCont {
  margin-left: 160px;
  }

.logPanel .logCont .logOptions {
  padding: 3px;
  margin-bottom: 5px;
  border: 1px solid #e1e1e1;
  }

.logOptions select {
  width: 155px;
  }

.logPanel .logCont .log {
  padding: 7px;
  font-family: "Courier New", Courier, monospace;
  font-size: 11px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #e1e1e1;
  word-wrap: break-word;
  color: #333333;
  }
  
.logPanel .logCont .log b {
  font-weight: bold; 
  color: #000000;
  }

.linksContainer {
  margin-left: 3px;
  overflow: hidden;
  }

.linkCont {
  margin-bottom: 5px;
  }

.linkCont span {
  cursor: pointer;
  }

.linkArrow {
  float: left;
  left: 0;
  margin-top: 4px;
  position: relative;
  transition: left 0.05s ease-out 0s;
  }

.linkArrowCont {
  float: left;
  width: 14px;
  }

.linkCont:hover .linkArrow {
  left: 3px;
  }

.linkCont.activeLogDate .linkArrow,
.linkCont.activeLogDate:hover .linkArrow {
  left: 3px;
  }

.linkCont.activeLogDate span {
  cursor: auto;
  font-weight: bold;
  }

#cert_ex .cert_ex_cont {
  float: left;
  }

#cert_ex table tr td {
  border-bottom: 1px solid #ddd;
  line-height: 16px;
  padding-right: 25px;
  }

#cert_ex table tr:hover td {
  background: transparent;
  }

#cert_ex tr td:first-child { 
  font-weight: bold;
  }

/* EZ Settings AVS User Manager */

.privileges label {
  display: block;
  margin-bottom: 2px;
  }

/* System Popups */
.fixedPopup {
  position: fixed!important;
  }

.fixedPopupBtns {
  padding: 15px;
  text-align: center;
  background: #f4f4f4;
  border-radius: 0 0 2px 2px;
  border-top: 1px solid #dfdfdf;
  }

.popup .popInput,
.popup .popSelect,
.popup .popTextarea {
  width: 200px;
  min-width: 200px;
  }

.popup .popInput.shortInput,
.popup .popSelect.shortSelect,
.popup .popTextarea.shortTextarea {
  width: 145px;
  min-width: 145px;
  }

.popup .popInput.medInput,
.popup .popSelect.medSelect,
.popup .popTextarea.medTextarea {
  width: 250px;
  min-width: 250px;
  }

.popup .popInput.longInput,
.popup .popSelect.longSelect,
.popup .popTextarea.longTextarea {
  width: 300px;
  min-width: 300px;
  }

.popup .popInput.long2Input,
.popup .popSelect.long2Select,
.popup .popTextarea.long2Textarea {
  width: 400px;
  min-width: 400px;
  }

.popup .popInput.dateInput {
  width: 160px;
  min-width: 160px;
  }

.calendarSpecialInput {
  width: auto;
  margin-right: 3px;
  }

.calendarSpecialInput.noMargin {
  margin: 0;
  }

.doubleDateInputCont {
  width: 323px;
  }

.popup .popInput[type="checkbox"],
.popup .popInput[type="radio"] {
  width: auto!important;
  min-width: 0!important;
  }

.popup .fullWidthInput, 
.fullWidthInput {
  width: 100%!important;
  min-width: 100%!important;
  }

.fullWidthInputsCont {
  width: 100%;
  }

.fullWidthInputsCont.w90pc {
  width: 90%;
  }

/* DataTables ovverides */

.dataTables_processing {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 250px;
  height: 30px;
  margin-left: -125px;
  margin-top: -15px;
  padding: 14px 0 2px 0;
  border: 1px solid #BBBDBF;
  text-align: center;
  color: #999;
  font-size: 14px;
  background-color: white;
  z-index: 1;
  }

.centerData {
  text-align: center;
  }

.mainSectionContents .dataTables_scrollHeadInner {
  padding-right: 0!important;
  min-width: 50%;
  }

.mainSectionContents .dataTables_scrollHeadInner > .fixedDataTable.dataTable {
  min-width: 50%;
  }

.fixedDataTable td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-overflow-mode: ellipsis;
  }

.dataTables_scrollBody table thead tr th {
  border: none;
  }

.inlineEditor {
  width: 95%;
  display: inline-block;
  font-size: 11px;
  border: 1px solid #BBBDBF;
  font-family: inherit;
  height: 23px;
  }

.inlineEditorHighlight {
  background: white;
  box-shadow: 0 0 3px #666;
  border-radius: 3px;
  cursor: text;
  border: 1px solid #BBBDBF\0/;
  }

.tableBottomBorder {
  display: none!important;
  width: 100%;
  height: 0px;
  position: relative; 
  z-index: 20; 
  top: -1px;
  border-top-width: 2px;
  border-style: solid;
  border-color: #e5e5e5; 
  }

/* Arrow Sections */

.arrowSectionContainer {
  margin-bottom: 5px;
  margin-top: 10px;
  cursor: pointer;
  float: left;
  }

.arrowSectionContainer:first-child { margin-top: 5px; }

.arrowSectionContent { display: none; }

.arrowSectionContainer.open .arrowSectionContent { display: block; }

.arrowSectionLabel {
  font-size: 14px;
  margin-left: 5px;
  }

.arrowSectionIcon {
  font-size: 17px;
  position: relative;
  left: 0;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
  }

.arrowSectionContainer:hover .arrowSectionIcon {
  left: 5px;
  }

.arrowSectionContainer.open .arrowSectionIcon {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  left: 5px;
  }

/* Custom form elements */
.ez_input {
  color: #666;
  padding: 6px;
  font-size: 13px;
  width: 100%;
  }

.input2-container input.ez_input {
  font-size: 13px;
  }
  
.ez_search {
  padding: 4px 25px 4px 5px;
  }  

.input2-container input.ez_search {
  padding: 4px 25px 4px 5px;
  }

/*.ez_input_wrap_advanced .input2-list-icon-indicator {
  display: none;
  }*/

.dropdown_details {
  margin-top: 20px;
  }

select.input2-advanced-search-select {
  margin-left: 53px;
  }  

.ez_search_ico {
  position: absolute;
  top: 5px;
  right: 7px;
  font-size: 14px;
  color: #c2c2c2;
  line-height: normal;
  }
  
.ez_search_loader {
  width: 12px;
  height: 12px;
  background-image: url(../ez_images/loader_circular.gif);
  background-size: 12px 12px;
  background-repeat: no-repeat;
  right: 8px;
  top: 6px;
  }

.ez_search_ico.ez_search_loader { font-size: 0; }
  
.ez_input_wrap { 
  position: relative; 
  }
  
.ez_search_wrap { 
  margin-right: 10px;
  width: 220px;
  }
  
.ez_input_wrap .clearInput {
  width: 14px;
  height: 14px;
  text-decoration: none;
  position: absolute;
  right: 6px;
  top: 5px;
  cursor: pointer;
  display: none;
  color: #d7d7d7;
  font-size: 15px;
  line-height: normal;
  }.ez_input_wrap .clearInput:hover { color: #b9b9b9; }
 
.rounded {
  position: relative;
  }

.noRounded {
  border-radius: 0!important;
  }

/* jQuery UI Autocomplete */

.ui-autocomplete.ui-widget-content a {
  color: #666;
  }

.ui-autocomplete.ui-widget-content {
  border: 1px solid #bbbdbf;
  background-color: #fff;
  font-size: 12px;
  color: #333;
  z-index: 999!important;
  border-radius: 2px;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
  }

.ui-autocomplete.ui-menu {
  background: white;
  cursor: pointer;
  }

.ui-autocomplete.ui-menu li {
  padding: 4px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }

.ui-autocomplete.ui-menu li a {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1;
  padding: 3px 4px;
  font-size: 12px;
  }
 
.ui-autocomplete .ui-state-hover, 
.ui-autocomplete.ui-widget-content .ui-state-hover, 
.ui-autocomplete.ui-widget-header .ui-state-hover, 
.ui-autocomplete .ui-state-focus, 
.ui-autocomplete.ui-widget-content .ui-state-focus, 
.ui-autocomplete.ui-widget-header .ui-state-focus {
  border: 1px solid transparent;
  color: #fff!important;
  background: #0d4051!important;
  border-radius: 2px;
  }

/* RESOURCE MANAGER */

.dataTables_scrollBody {
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden!important;
  overflow-y: auto;
  }

.visibleXScroll .dataTables_scrollBody {
  overflow-x: auto!important;
  }

/* RESOURCE MANAGER - Recent Usage Tab */

.recentUsageMain {
  height: 100%;
  }

.recentUsage {
  float: left;
  width: 49%;
  position: relative;
  }

.recentUsage h3,
.favoriteUsage h3 {
  padding: 8px;
}

.favoriteUsage {
  float: right;
  width: 49%;
  position: relative;
  }

.noRecentUsages {
  color: #888;
  font-style: italic;
  }

.recentUsagesContainer {
  float: left; 
  }

.recentUsagesList {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.recentUsagesToggle:hover .recentUsagesName,
.recentUsagesToggle.opened .recentUsagesName {
  color: #0d4051; /* TODO: SASS */
  }

.recentUsagesToggle {
  cursor: pointer;
  float: left;
  padding: 5px 0 5px 5px;
  }

.recentUsagesToggle:hover .recentUsagesArrow,
.recentUsagesArrow.arrowDown {
  left: 1px;
  }

.recentUsagesArrowCont {
  float: left;
  width: 14px;
  }

.recentUsagesArrow {
  margin-top: 3px;
  float: left;
  position: relative;
  left: -2px;
  -webkit-transition: left 0.05s ease-out;
  -moz-transition: left 0.05s ease-out;
  transition: left 0.05s ease-out;  
  }

.recentUsagesName {
  float: left;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-transition: color 0.1s ease-out;
  -moz-transition: color 0.1s ease-out;
  transition: color 0.1s ease-out;
  }

.recentUsagesToggle.noUsagesToggle {
  cursor: auto;
  }

.recentUsagesToggle.noUsagesToggle .recentUsagesArrow,
.recentUsagesToggle.noUsagesToggle .recentUsagesArrow:hover {
  left: -2px;
  }

.recentUsagesToggle.noUsagesToggle .recentUsagesArrow.arrowRight {
  border-left-color: #cecece;
  }

.recentUsagesToggle.noUsagesToggle .recentUsagesName,
.recentUsagesToggle.noUsagesToggle:hover .recentUsagesName {
  color: #333;
  }

.detailsLinkCont {
  float: left;
  padding: 5px 5px 5px 0;
  }

.detailsLinkSeparator {
  margin: 0 5px;
  float: left;
  }

.recentUsagesToggleSection {
  background: #f4f4f4;
  margin-bottom: 5px;
  margin-left: 20px; 
  padding: 5px 10px;
  float: left;
  border-radius: 2px;
  }

.recentUsagesToggleSection table.recentUsagesTable tbody tr td {
  border-bottom: 0px;
  line-height: 16px;
  border: 1px solid transparent;
  padding: 0 2px;
  }

.recentUsagesToggleSection table.recentUsagesTable tbody tr:hover td {
  border: 1px solid transparent;
  background: none;
  }

.recentUsagesSettings  {
  position: absolute;
  top: 8px;
  right: 8px;
  }

.favoriteResourceCabinetQuantity,
.favoriteResourceQuantity {
  margin-left: 5px;
  }

#favoriteResourceContent .controls.ezPiechart {
  top: 3px;
  left: 2px;
  }

.recentUsagesSelectorContainer {
  padding: 6px;
  }

.recentUsagesSelectorContainer input[type="radio"] {
  margin-right: 7px;
  }

.recentUsageSelectorHead {
  margin-bottom: 5px;
  font-weight: bold;
  }

.recentUsagesHeadInfo {
  display: none;
  margin-left: 7px;
  padding-left: 7px;
  border-left: 1px solid #bbb;
  font-style: italic;
  color: #555;
  }

.recentFavHead {
  margin-top: 10px;
  }

.flotr-mouse-value {
  z-index: 3;
  }

/* RESOURCE MANAGER - Resources Tab */

.rmManageCabinets {
  margin: 5px 0 0 25px;
  }

#rm_cabinets_filter {
  width: 220px;
  }

.addCabinetNameCont {
  margin: 15px auto 3px;
  text-align: center;
  }

.addCabinetNameCont #addCabinetName {
  width: 155px;
  }

/* RESOURCE MANAGER - Clients */

#addClientPopup .setting-label,
#editClientPopup .setting-label { 
  width: 150px; 
  }

/* RESOURCE MANAGER - Resource Register Tab */

.additionalFilters,
.popupAdditionalFilters {
  border-bottom: 1px solid #e5e5e5;
  position: relative;
  padding: 10px 15px;
  background: #ffffff;
  }

.additionalFilters table td,
.popupAdditionalFilters table td {
  padding-bottom: 5px;
  vertical-align: middle;
  }

.additionalFilters table tr:last-child td,
.popupAdditionalFilters table tr:last-child td {
  padding-bottom: 0px;
  }

.additionalFilters table.longFilters td,
.popupAdditionalFilters table.longFilters td {
  padding-right: 20px;
  padding-bottom: 7px;
  }

table.settingsItemsFilters td,
.popupAdditionalFilters table.settingsItemsFilters td {
  padding-right: 30px;
  padding-bottom: 7px;
  }

table.settingsItemsFilters.tight td {
  padding-right: 20px;
  padding-bottom: 3px;
  }

table.settingsItemsFilters td:last-child,
.popupAdditionalFilters table.settingsItemsFilters td:last-child {
  padding-right: 0;
  }

.filterSection {
  margin-bottom: 0px;
  }

.filterLabel {
  margin: 2px 7px 2px 0;
  }

.filterComponent {
  margin-top: 0px;
  }

.filterElement {
  margin-right: 10px;
  }

.filterElement > select {
  width: 220px;
  }

.filterElement > input {
  width: 88px;
  }

.filterElement input[type="checkbox"],
.filterElement input[type="radio"] {
  width: auto;
  }

.filterElement #SessionCBox {
  width: 181px;
  }

.resUsageDetailedList {
  display: none;
  float: right;
  }

.resUsageDetailedListText {
  border: 1px solid #0d4051; /* TODO: SASS */
  border-radius: 2px;
  font-weight: bold;
  padding: 3px 4px;
  position: absolute;
  bottom: 0;
  right: 0;
  margin-bottom: 5px;
  text-align: center;
  max-width: 200px;
  line-height: 16px;
  font-size: 11px;
  }

/* Filter Side Tabs  */
.filterSideTabsPlacer {
  margin-left: 44px;
  }

.filterSideTabsFilterCont {
  height: 60px;
  }

.filterSideTabsCont {
  height: 80px;
  left: -14px;
  position: absolute;
  top: -10px;
  width: 36px;
  z-index: 20;
  }

.filterSideTabsBg {
  background: #fff; /* Old browsers */
  background: -moz-linear-gradient(top, #fafafa 20%, #ffffff 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(20%,#fafafa), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #fafafa 20%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #fafafa 20%,#ffffff 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #fafafa 20%,#ffffff 100%); /* IE10+ */
  background: linear-gradient(to bottom, #fafafa 20%,#ffffff 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
  border-right: 1px solid #e4e4e4;
  width: 100%;
  height: 100%;
  }

.filterSideTabElem {
  width: 33px;
  height: 31px;
  position: absolute;
  right: -1px;
  border: 1px solid transparent;
  border-right: none;
  }

.filterSideTabElem.active {
  border: 1px solid #e4e4e4;
  border-right: none;
  border-radius: 4px 0 0 4px;
  box-shadow: -1px 1px 1px rgba(0,0,0,0.05);
  }

.filterSideTabElem .eventModeIcon, 
.filterSideTabElem .videoModeIcon {
  opacity: 0.65;
  filter: alpha(opacity=65);
  -ms-filter: "alpha(opacity=65)";
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
  }

.filterSideTabElem.active .eventModeIcon, 
.filterSideTabElem.active .videoModeIcon,
.filterSideTabElem .eventModeIcon:hover,
.filterSideTabElem .videoModeIcon:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  }

.filterSideTabTop {
  top: 7px;
  cursor: pointer;
  }

.filterSideTabTop.active {
  background: #ffffff;
  cursor: auto;
  }

.filterSideTabBottom {
  top: 41px;
  cursor: pointer;
  }

.filterSideTabBottom.active {
  background: #fff;
  cursor: auto;
  }

.eventModeIcon, .videoModeIcon {
  width: 25px;
  height: 20px;
  margin: 5px 3px;
  }

.videoModeIcon {
  height: 18px;
  }

.eventModeIcon {
  background: url("../ez_images/db_ico_events_2x.png") no-repeat;
  background-size: 25px 31px;
  }

.videoModeIcon {
  background: url("../ez_images/db_ico_vidrev_2x.png") no-repeat;
  background-size: 23px 28px;
  margin: 6px 8px 7px 6px;
  }

.videoModeVideoSelectionText, 
.getVideoListLink {
  line-height: 25px;
  }

.getVideoListLink {
  margin-left: 5px;
  }
 
.videoModeVideoSelectionText {
  font-size: 12px;
  color: #333;
  }

.videoModeVideoSelectionText.noVideoSelect {
  color: #777;
  font-style: italic;
  }

.videoModeVideoSelectionText span {
  font-weight: bold;
  }

.selVidCount {
  display: none;
  font-weight: bold;
  }

button.getVideoList {
  margin-left: 0;
  }

#DatePickerFrom {
  margin-right: 5px;
  }

.filterSection {
  position: relative;
  }

.filterSection table {
  float: left;
  }

.filterSection table td {
  vertical-align: middle;
  padding-bottom: 5px;
  }

.filterSection table td .filterComponent {
  margin: 0;
  }

.editResources {
  display: none;
  }

.editResources input.editResourceQuantity {
  width: 68px;
  }

.editResourceAbbrev {
  margin-top: 3px;
  margin-left: 5px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  }

#editResourceEventDropDown select {
  width: 97%;
  }

#editResourceSessionDropDown select {
  width: 97%;
  }

#editResourceTimeslotDropDown select {
  width: 97%;
  }

.tooltipVideoSelectTable {
  display: table;
  margin: 7px 0;
  }

.tooltipVideoSelectLabel {
  padding-right: 10px;
  text-align: right;
  min-width: 90px;
  color: #666;
  display: table-cell;
  vertical-align: top;
  }

.tooltipVideoSelectValue {
  display: table-cell;
  vertical-align: top;
  }
  
.removeSelectedVideoRecsCont {
  float: right;
  margin-left: 3px;
  }

.iconRecycle {
  width: 13px;
  height: 17px;
  background: url('../ez_images/icon_recycle.png') no-repeat 0 0;
  cursor: pointer;
  }.iconRecycle:hover { background-position: -13px 0; }

.resourceManagerResourceRegisterFilters .filterLabel {
  margin: 0 7px 0 0;
  }

#videoRecordingsPopup .videoSearchFiltersCont {
  margin: 3px 0 5px 3px;
  }
#videoRecordingsPopup #videoRecsDataTable td {
  cursor: auto;
  }

.highlightFooter {
  background: #d7effb; /* TODO: SASS */
  }

/* RESOURCE MANAGER - Reports Tab */

#tabResourceManagerReportsCont,
.reportMainSection,
.reportGeneratorSection,
.reportResourceBox {
  height: 100%;
  }

.reportResourceBox {
  width: 31.9%;
  }

#reportDatePickerFrom {
  margin-right: 5px;
  }

.reportFormatDropdown {
  margin-left: 10px;
  }

.resourcesReportTitle {
  margin-top: 10px;
  margin-bottom: 20px;
  padding: 8px;
  }

.reportContent {
  padding: 0 7px;
  }

.reportContent table {
  width: 100%;
  }

.reportContent table tr td.reportContentLabel {
  padding-right: 5px;
  }

.reportContent table tr td {
  padding-bottom: 10px;
  vertical-align: middle;
  }

.reportContent table tr td .filterElement {
  width: 100%;
  }

.resourceReportButton {
  max-width: 220px;
  margin-left: 0!important;
  }

#number_of_workdays {
   width: 50px;
  }

.reportGeneratorSection .sectionCenterLine {
  position: relative;
  margin: 0 1%;
  left: auto;
  float: left;
  display: block;
  }

.centerResourceUsageOverview table {
  margin: 0 auto;
  }

/* RESOURCE MANAGER  - Resources Booking */

/* xScheduler Customizing */

.schedulerContainer .schedulerContainerBox {
  position: relative;
  }

.schedulerContainer #roomSearch {
  position: absolute;
  top: 47px;
  left: 0px;
  z-index: 4;
  }

.schedulerContainer #roomSearch .ez_search {
  border-radius: 0;
  }  
  
.schedulerContainer #roomSearch .ez_search_wrap {
  width: 200px;
  }

.schedulerContainer .dhx_cal_navline  {
  top: -14px!important;
  }
  
.schedulerContainer .dhx_cal_container {
  background: transparent;
  }
  
.schedulerContainer .dhx_row_item td {
  background: white;
  height: 20px!important;
  }

.schedulerContainer .dhx_row_item:nth-child(2n) td {
  background: #f7f7f7;
  }

.schedulerContainer .dhx_row_item:last-child td {
  }
  
.schedulerContainer .dhx_cal_data {
  overflow-y: scroll; 
  border: 1px solid #cecece;
  box-sizing: border-box;
  background: #fff;
  }
  
.schedulerContainer td.dhx_matrix_scell  {
  border-right: 1px solid #cecece;
  box-sizing: border-box;
  }

.schedulerContainer td.dhx_matrix_scell > div {
  padding: 0!important;
  }  

.schedulerContainer .dhx_scell_name {
  padding-left: 15px;
  padding-right: 15px;
  }
  
.schedulerContainer .dhx_scale_bar {
  background: #e5e5e5;
  border-top: 1px solid #cecece;
  }

.schedulerContainer .dhx_cal_header {
  border-top: 1px solid transparent;
  }

.schedulerContainer .dhx_cal_prev_button,
.schedulerContainer .dhx_cal_next_button {
  background: none;
  border: none;
  }

.schedulerContainer .dhx_cal_next_button:after,
.schedulerContainer .dhx_cal_prev_button:after {
  font-family: icomoon;
  content: "\e666";
  font-size: 20px;
  cursor: pointer;
  color: #666;
  }

.schedulerContainer .dhx_cal_prev_button:hover:after,
.schedulerContainer .dhx_cal_next_button:hover:after {
  color: #333;
  }

.schedulerContainer .dhx_cal_prev_button:after {
  content: "\e665";
  }

.schedulerContainer .dhx_cal_today_button {
  width: auto;
  padding: 0 18px;
  color: #333;
  background: linear-gradient(to bottom, #ffffff 20%,#f4f4f4 100%);
  border: 1px solid #ddd;  
  }

.schedulerContainer .dhx_cal_event_line.pendingBooking,
.schedulerContainer .dhx_cal_event_line.rejectedBooking,
.schedulerContainer .dhx_cal_event_line.notSavedBooking {
  background: #999;
  }

.schedulerContainer .dhx_cal_event_line.disabledBooking {
  background: #999;
  opacity: 0.65;
  }

.schedulerContainer .dhx_cal_event_line.approvedBooking:before,
.schedulerContainer .dhx_cal_event_line.pendingBooking:before,
.schedulerContainer .dhx_cal_event_line.rejectedBooking:before {
  font-family: "fontawesome";
  content: "\f058";
  color: white;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.15);
  font-size: 14px;
  position: absolute;
  left: 12px;  
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  }
 
.schedulerContainer .dhx_cal_event_line.pendingBooking:before {
  content: "\f071";
  color: #ffba00;
  }

.schedulerContainer .dhx_cal_event_line.rejectedBooking:before {
  content: "\f05e";
  color: #ed0404;
  }

.schedulerContainer .dhx_cal_event_line .dhx_event_resize {
  background: none;
  width: 7px;
  }

.schedulerContainer .displayBookingRoomName,
.schedulerContainer .displayBookingResourceList {
  overflow: hidden;
  margin: 0 10px 0 0;
  position: relative;
  text-overflow: ellipsis;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  white-space: nowrap;
  }

.schedulerContainer .dhx_cal_event_line.approvedBooking .displayBookingRoomName,
.schedulerContainer .dhx_cal_event_line.approvedBooking .displayBookingResourceList,
.schedulerContainer .dhx_cal_event_line.pendingBooking .displayBookingRoomName,
.schedulerContainer .dhx_cal_event_line.pendingBooking .displayBookingResourceList,  
.schedulerContainer .dhx_cal_event_line.rejectedBooking .displayBookingRoomName,
.schedulerContainer .dhx_cal_event_line.rejectedBooking .displayBookingResourceList { 
  margin-left: 20px;
  }
  
.schedulerContainer .dhx_cal_event_line .dhx_event_resize_start:before,
.schedulerContainer .dhx_cal_event_line .dhx_event_resize_end:before {
  font-family: "icomoon";
  content: "\e66f";
  color: white;
  position: relative;
  opacity: 0.65;
  margin-top: -1px;
  display: inline-block;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  }

.schedulerContainer .dhx_cal_event_line .dhx_event_resize_start:before {
  left: -3px;  
  }  

.schedulerContainer .dhx_cal_event_line .dhx_event_resize_end:before {
  left: auto;
  right: 3px;
  }
  
.bookedResourcesInfo {
  display: inline-block;
  margin-right: 5px;
  }

.bookedResourcesInfo:last-child {
  margin-right: 0px;
  }  
  
.bookedResourcesIcon {
  font-size: 17px;
  vertical-align: middle;
  margin-right: 3px;
  }
  
.rmSystemTypeIconUser:before {
  font-family: "icomoon";
  content: "\e669";
  }
  
.rmSystemTypeIconRoom:before {
  font-family: "icomoon";
  content: "\e629";
  }

.rmSystemTypeIconStation:before {
  font-family: "icomoon";
  content: "\e670";
}
  
.rmSystemTypeIconCamera:before {
  font-family: "icomoon";
  content: "\e655";
  }
  
.rmSystemTypeIconSimulator:before {
  font-family: "icomoon";
  content: "\e671";
  }
  
.rmSystemTypeIconOther:before {
  font-family: "icomoon";
  content: "\e664";
  }  

.bookingNameSelCont  {
  margin: 10px 0 0;
  text-align: right;
  }

.bookingNameSelCont > label  {
  margin-right: 10px
  }  
  
/* Mini calendar */
.schedulerContainer .dhx_cal_navline div.dhx_minical_icon {
  position: absolute;
  left: auto!important;
  right: 220px; /* TODO: need a much better way */
  background: none;
  }

.schedulerContainer .dhx_cal_navline div.dhx_minical_icon:before {
  font-family: "icomoon";
  content: "\e618";
  color: #666;
  font-size: 25px;
  }
  
.dhx_cal_container.dhx_mini_calendar {
  color: #333;
  }
  
.dhx_minical_popup .dhx_month_head.dhx_year_event {
  background-color: #1268a7!important; /* TODO: theme */
  border-radius: 3px !important;
  color: white;
  }

.dhx_minical_popup .dhx_mini_calendar .dhx_now .dhx_month_head {
  text-decoration: underline;
  font-weight: bold;
  background: transparent;
  }
  
.dhx_minical_popup .dhx_now .dhx_month_body {
  background: transparent; 
  }

.dhx_minical_popup td:not(.dhx_before):not(.dhx_after) .dhx_month_head:hover {
  background: #e5e5e5;
  border-radius: 3px !important;
  }
  
/* Resources Booking */
#bookingSetupPopup {
  width: 780px!important;
  }
  
.bookingStatus i {
  font-size: 16px;
  vertical-align: middle;
  position: relative;
  top: 1px;
  margin-right: 3px;
  }  

.bookingStatus span {
  margin-left: 3px;    
  vertical-align: middle;
  max-width: 200px;
  }  

.bookingStatus.pending i:before {
  font-family: fontawesome;
  content: "\f071";
  color: orange;
  }
  
.bookingStatus.approved i:before {
  font-family: fontawesome;
  content: "\f058";
  color: green;
  }

.bookingStatus.rejected i:before {
  font-family: fontawesome;
  content: "\f05e";
  color: #cc0000;
  }
 
.rmBookingStatusSection {
  position: relative;
  }
 
.bookingReviewRecipients {
  position: absolute;
  top: 7px;
  right: 12px;
  font-size: 21px;
  cursor: pointer;
  } 

#resourcesNote textarea {
  height: 35px;
  min-height: 35px;
  max-height: 100px;
  resize: vertical;
  }
  
.bookedResourcesCont {
  padding-left: 12px;
  padding-bottom: 10px;
  }
  
.bookedResourcesLabel {
  margin: 10px 0;
  }  
  
.bookedResourcesListCont {
  height: 100px;
  width: 400px;
  }  
  
.bookedResourcesList {
  width: 100%;
  height: 100%;
}  
  
.bookedResourcesListCont {  
  overflow: auto;
  }

.bookedResourceElem {
  display: inline-block;
  max-width: 250px;
  word-wrap: break-word;
  margin-bottom: 4px;
  margin-right: 4px;
  }  
  
.bookingResourcesTableCont {
  width: 275px; 
  }  
  
.sectionSearch {
  margin-bottom: 15px;  
  }

.bookingResourcesTableCont .sectionSearch { 
  margin-bottom: 5px;
  }

.sectionSearch .ez_search_wrap {
  width: 100%;
  }

.overlappedResource {
  color: #FA9214!important;
  position: absolute;
  top: 3px;
  right: 6px;
  top: 4px!important;
  z-index: 1;
  }
 
.resourceElem .overlappedResource ~ span {
  padding-right: 20px!important;
  }

.bookedResourceElem .overlappedResource ~ span {
  padding-right: 30px!important;
  }
 
.bookedResourceElem .overlappedResource {
  right: 18px;
  }

#container ~ .dhtmlXTooltip.tooltip {
  background-color: white;
  color: #231F20;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.15); 
  max-width: 400px;
  }

.dhtmlXTooltip.tooltip:before {
  content: "";
  position: absolute;
  top: -9px;
  left: 8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 7px 9px 7px;
  border-color: transparent transparent #cccccc transparent;
  display: none; 
  }

.dhtmlXTooltip.tooltip:after {
  content: "";
  position: absolute;
  top: -8px;
  left: 10px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 5px 8px 5px;
  border-color: transparent transparent #ffffff transparent;
  display: none; 
  }  

.dhtmlXTooltip.tooltip div {
  margin-top: 6px;
  }

.dhtmlXTooltip.tooltip div:first-child {
  margin-top: 0px;
  }

.dhtmlXTooltip.tooltip span {
  display: block;
  color: #888;
  font-size: 13px;
  padding-bottom: 3px;
  }

/* USER MANAGER */
/* USER MANAGER - Users */
.groupUserSearch .ez_input_wrap,
.longSearchCont .ez_input_wrap {
  width: 300px;
  }

#usermanagerFilterSettings {
  margin: 4px 0 0 10px;
  }

.userEditMainFiltersTableRow {
  max-width: 85%;
  margin-top: 5px;
  }

.userEditMainFilters { position: relative; }

.userEditMainFilters .longFilters {
  max-width: 80%;
  }

.groupNameLabelsHead {
  margin-left: 2px;
  }

.groupNameLabelsHeadDetails {
  font-size: 11px;
  color: #777;
  margin-left: 12px;
  }

.userEditMainFiltersTableRow.groupNameLabels tr.userNamesInputs td {
  background: #f4f4f4;
  }

.userEditMainFiltersTableRow.groupNameLabels td {
  padding: 5px;
  }

.userNamesInputs {
  border: 1px solid transparent;
  }

.userNameIsMissing .userNamesInputs {
  border-color: rgba(255, 0, 0, 0.4);
  }

.userAccountPopupContentColumns {
  display: flex;
  flex-direction: row;
}

#userAccountPopupContent .optEmailField {
  height: 60px;
  min-height: 60px;
  max-height: 60px;
  min-width: 200px; 
  width: 200px;
  }

#editUserPopup #userFullname {
  max-width: 500px;
  }

#editUserPopup #userEmail {
  max-width: 200px;
  }

#editUserPopup #userUCID {
  max-width: 100px;
  }

#editUserPopup #userRole select { 
  width: 145px; 
  min-width: 145px;
  }

.userEditPersonalDataContainer {
  display: table;
  }

.userEditPersonalData,
.userEditPhysicalData {
  display: table-cell;
  }

.userEditPersonalData {
  padding-right: 30px;
  }

.userManagerSPDetailsForm {
  display: table;
  }

.userSPActivitySection,
.addDataToTableSection {
  display: table-cell;
  padding-right: 25px;
  }

.userSPActivitySection.left,
.addDataToTableSection.left {
  padding-right: 25px;
  }

.addDataToTableSection.right {
  padding-right: 0;
  }

#spActcomment { 
  min-height: 25px; 
  height: 25px; 
  max-height: 25px;
  }

.saveSPActivityCont .setting-label {
  padding-left: 2px;
  padding-right: 2px;
  }

#add_customBtn { margin-left: 0; }

#custom_data_fields { 
  position: relative; 
  width: 315px; 
  }

#custom_data_fields .settingsItem {
  position: relative;
  }

#custom_data_fields .del_custom {
  font-size: 14px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  right: -10px;
  }

#sp-custom .setting-label.verticalTop {
  padding-top: 5px;
  }

@media screen and (max-width: 768px) {
.userEditPersonalDataContainer,
.userEditPersonalData,
.userEditPhysicalData,
.userSPActivitySection {
  display: block;
  }

.saveSPActivityCont .setting-label {
  padding-left: 12px;
  padding-right: 20px;
  }
}

/* User avatar */
.userAvatarContainer {
  border: 2px solid #fff;
  box-shadow: 0 0 1px 1px rgba(0,0,0,0.2);
  width: 78px;
  height: 78px;
  border-radius: 2px;
  background: white;
  position: absolute;
  right: 10px;
  top: 21px;
  cursor: pointer;
  }

.userAvatarContainer.empty {
  border: 2px dashed #ddd;
  box-shadow: none;
  cursor: default;
  }  

.emptyAvatar { display: none; }
.emptyAvatar i { color: #ddd; }
  
.userAvatarContainer.empty  .emptyAvatar {
  display: inline-block;
  color: #ddd;
  font-size: 40px;
  position: relative;
  top: 17px;
  left: 19px;
  }  
  
.userAvatar  {
  width: 100%;
  height: 100%;
  }

.userAvatarContainer.empty img {
  display: none;
  }  
  
.userAvatar img {
  display: inline;
  width: 100%;
  height: 100%;
  border-radius: 2px;
  }

.removeAvatar, .editAvatar {
  display: none;
  z-index: 3;
  font-size: 14px;
  position: absolute;
  padding: 5px;
  border-radius: 100%;
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.2);
  }

.removeAvatar i, .editAvatar i { top: -1px; }
  
.userAvatarContainer:not(.noEdit):hover .editAvatar {
  display: inline-block;
  background: white;
  top: -7px;
  left: -8px;
  cursor: pointer;
  }

.userAvatarContainer.empty:not(.noEdit):hover .removeAvatar {
  display: none;
  }

.userAvatarContainer:not(.noEdit):hover .removeAvatar {
  display: inline-block;
  background: white;
  top: -7px;
  right: -8px;
  cursor: pointer;
  }

/* SP Medical condition list */
#editUserPopup .spMedhistContainer,  
#editUserPopup .medhistConditionListCont,   
#editUserPopup .addConditionListCont {
  height: 100%;
  }

.addConditionListCont {
  margin-left: 40px;
  }

.medhistConditionListCont .textBox {
  height: -moz-calc(100% - 38px);
  height: -webkit-calc(100% - 38px);
  height: calc(100% - 38px);
  }

.addConditionListCont .textBox {
  height: -moz-calc(100% - 104px);
  height: -webkit-calc(100% - 104px);
  height: calc(100% - 104px);
  }

.userReadOnlyMode .addConditionListCont .textBox {
  height: -moz-calc(100% - 69px);
  height: -webkit-calc(100% - 69px);
  height: calc(100% - 69px);
  }

#medhists a {
  cursor: default;
  }

input.searchmedicalCondition {
  width: 260px;
  margin-bottom: 6px;
  }

.spMedhistBtnCont {
  text-align: center;
  margin-top: 8px;
  margin-bottom: 5px;
  }

#saveMedhistComment i {
  font-size: 11px;
  } 

#spMedhistCommentTtip {
  resize: none;
  }

/* Users settings - groups */
.umGroupUserSearchCont {
  position: relative;
  }

.umGroupUserSearchCont .groupUserSearch {
  margin-bottom: 12px;
  margin-right: 5px;
  }

#umGroupUserSearch.groupUserSearch .ez_input_wrap {
  width: 350px;
  }

#editUserPopup .userSettingsDetailsContainer,
.popupFullHeightTabsContentCont {
  height: -moz-calc(100% - 15px);
  height: -webkit-calc(100% - 15px);
  height: calc(100% - 15px);
  }

#editUserPopup .userSettingsDetailsSection,
#editUserPopup .userSettingsDetailsContentCont,
#editUserPopup #umUserGroups {
  height: 100%
  }

#editUserPopup .userSettingsDetailsContentCont {
  max-width: 600px;
}

#editUserPopup .userManagerInfoColumn {
  width: 350px;
  padding-left: 20px;
  box-sizing: border-box;
}

#umUserGroupList {
  width: 350px;
  height: -moz-calc(100% - 75px);
  height: -webkit-calc(100% - 75px);
  height: calc(100% - 75px);
  }

#umUserGroupList a {
  cursor: default;
  }

.userReadOnlyMode #umUserGroupList {
  height: -moz-calc(100% - 39px);
  height: -webkit-calc(100% - 39px);
  height: calc(100% - 39px);
  }

/* Multiple user edit popup */
.userMultipleSettingsDetailsContainer {
  padding-bottom: 10px;
  }

.userMultipleSettingsContainer {
  padding-left: 285px;
  padding-top: 12px;
  }

.userMultipleBox {
  height: 400px;
  width: 260px;
  }

#umSelectedAdditionalInfoCont {
  padding: 10px 0;
  margin-bottom: 5px;
  }

#umSelectedDeselectedLabel {
  padding: 0 0 10px;
  }

#umSelectedDeselectedLabel.showDeselectedLabel ~ .userMultipleBox li {
  color: #cc0000;
  }

.noUserMultipleBox ~ .userMultipleSettingsContainer {
  padding-left: 0;
  }

/* USER MANAGER - Groups */
.groupTreeContainer,
.mainTreeContainer {
  float: left;
  width: 34%;
  margin-top: 0;
  position: relative;
  }

.userTableContainer,
.mainTargetTableContainer {
  float: right;
  width: 64%;
  position: relative;
  }

#userTable th.usersTitle { text-align: left; }

#userTable td .unknownPrivIcon.im-user-single { font-size: 14px; }

.input2-list-element-content i.resultIsAGroup:before,
.input2-list-icon-indicator.resultIsAGroup:before {
  content: "\e652";
  font-family: icomoon;
  }

.input2-list-element-content i.resultIsAUser:before,
.input2-list-icon-indicator.resultIsAUser:before {
  content: "\e654";
  font-family: icomoon;
  }

.input2-list-element-content i.resultIsARole:before,
.input2-list-icon-indicator.resultIsARole:before {
  content: "\e66d";
  font-family: icomoon;
  }

.input2-list-element-content i.resultIsAnEmail:before,
.input2-list-icon-indicator.resultIsAnEmail:before {
  content: "\f0e0";
  font-family: fontawesome;
  }

.input2-list-element-content i.resultIsAnUcid:before,
.input2-list-icon-indicator.resultIsAnUcid:before {
  content: "\f09d";
  font-family: fontawesome;
  }

.input2-list-icon-indicator {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  left: 7px;
  font-size: 12px;
  z-index: 2;
  }

.input2-list-icon-indicator ~ input {
  padding-left: 24px!important;
  }

.allUsersNode {
  background-image: none!important;
  }

.allUsersGroupCont {
  display: inline-block;
  position: relative;
  margin-left: 22px;
  margin-top: 5px;
  margin-bottom: 5px;
  }

.allUsersGroupBtn {
  background: transparent;
  border-radius: 3px;
  color: #000;
  cursor: pointer;
  display: inline-block;
  font-size: 11px;
  font-weight: bold;
  padding: 2px 4px 3px 6px;
  position: relative;
  }

.allUsersGroupBtn:hover {
  background: #fae6aa;
  color: #333;
  }

.allUsersGroupBtn.activeNode {
  color: white;
  background: #38afea; /* TODO: SASS */
  }

.allUsersGroupCont span {
  font-size: 19px;
  color: #989ca0;
  margin-right: 3px;
  position: relative;
  top: 3px;
  }

span.fancytree-title.treeDropActive {
  border: 1px dashed #aaa;
  }

span.fancytree-title.treeDropHover {
  border: 1px dashed #444;
  background: #fff;
  box-shadow: 0 0 1px rgba(0,0,0,0.2);
  }

.rootHiddenNode > span.fancytree-node {
  position: relative;
  top: 0px;
  display: none;
  }

.rootHiddenNode > span.fancytree-node.rootClass {
  display: none!important;
  }

.rootHiddenNode > span > .fancytree-icon {
  display: none!important;
  }

.rootHiddenNode > span > .fancytree-expander {
  cursor: auto;
  display: none!important;
  }

.rootHiddenNode > span.fancytree-folder > .fancytree-title {
  cursor: auto;
  font-weight: bold!important;
  display: none;
  }

.rootHiddenNode > span.fancytree-folder > .fancytree-title:hover {
  color: #000!important;
  background: transparent!important;
  }

.rootHiddenNode > ul > li:first-child > span > span.fancytree-expander:before {
  background: #f6f6f6;
  content: "";
  position: absolute;
  top: 0;
  left: 4px;
  width: 3px;
  height: 3px;
  }

.rootHiddenNode > ul > li:first-child > span.fancytree-exp-n > span.fancytree-expander:before,
.rootHiddenNode > ul > li:first-child > span.fancytree-exp-nl > span.fancytree-expander:before {
  height: 7px;
  }

.rootHiddenNode > ul > li:first-child > span.fancytree-exp-el > span.fancytree-expander:before,
.rootHiddenNode > ul > li:first-child > span.fancytree-exp-cl > span.fancytree-expander:before,
.rootHiddenNode > ul > li:first-child > span.fancytree-exp-edl > span.fancytree-expander:before,
.rootHiddenNode > ul > li:first-child > span.fancytree-exp-cdl > span.fancytree-expander:before {
  height: 5px;
  }

.groupWithNoAccess > span > .fancytree-title {
  color: #777;
  font-style: italic;
  }

.groupWithNoAccess > span > .fancytree-icon {
  color: #aaa!important;
  }

.groupWithNoAccess,
.groupWithNoAccess > span,
.groupWithNoAccess > span > .fancytree-title {
  cursor: auto!important;
  }

.groupWithNoAccess > span > .fancytree-title:hover {
  background: transparent!important;
  color: #777!important;  
  }

.permissionWarn {
  display: inline-block;
  margin: 8px 10px;
  }

.permissionWarn:before {
  content: "-";
  margin-right: 8px;
  }

.hiddenGroup > span > .fancytree-title {
  color: #777;
  }

.hiddenGroup > span > .fancytree-icon {
  opacity: 0.5;
  }

.hiddenGroupIcon {
  font-size: 13px;
  color: #333;
  cursor: default;
  }

.hiddenGroupsCheckCont,
.searchCheckBoxCont {
  margin-top: 3px;
  margin-left: 12px; 
  }

.umGroupsUsersLegend {
  position: absolute; 
  right: 15px; 
  top: 13px; 
  font-size: 18px;
  }

.listLegendQtip ul li i {
  top: 3px;
  float: left;
  position: relative;
  }

.listLegendQtip ul li i.fa {
  top: 4px;
  }  
  
.listLegendQtip ul li i.kw {
  top: 0px;
  font-weight: bold;
  }  

.listLegendQtip ul li {
  margin: 8px 0;
  padding-left: 7px;
  padding-right: 7px;
  }

.listLegendQtip ul li span { 
  display: block;
  margin-left: 28px;
  }

.listLegendQtip .kw-list td {
	padding: 5px;
	text-transform: lowercase;
  }

.listLegendQtip ul li strong { 
  font-weight: bold;
  }

.listLegendQtip ul li span.no-margin-left {
  margin-left: 0px;
  }

#umGroupLearnerEventsLegendQtip ul {
  max-height: 540px;
  overflow-y: auto;
  }

.listLegendQtip h3 {
  padding-top: 2px;
  padding-bottom: 6px;
  }

.listLegendQtip h3:first-child {
  padding-top: 3px;
  }

.listLegendQtip .itemLine {
  margin: 15px 0 10px;
  }

.listLegendQtip .quickSearchLegend i {
  font-size: 16px;
  vertical-align: middle;
  }

.listLegendQtip .quickSearchLegend i.fa-envelope,
.listLegendQtip .quickSearchLegend i.fa-credit-card {
  font-size: 14px;
  }

.gradientGrey {
  padding: 0;
  border-left: none;
  border-right: none;
  background: #f4f4f4;
  position: relative;
  overflow: auto;
  }

.gradientGrey {
  padding: 10px;
  }

.gradientGrey h3:first-child {
  padding-top: 0;
  }

.rootClass td,
.childrenClass { 
  cursor: pointer;
  }

#umGroupTree .fancytree-icon {
  font-size: 21px;
  width: 22px;
  top: -3px;
  }

#umGroupTree.cursorDrag * {
  cursor: move;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
  }

.treeIconFaculty > span > span.fancytree-icon:before {
  content: "\e668";
  font-size: 20px;
  }

.treeIconSP > span > span.fancytree-icon:before {
  content: "\e669";
  }

.treeIconSingleUser > span > span.fancytree-icon:before {
  content: "\e654";
}
.treeIconGroup > span > span.fancytree-icon:before {
  content: "\e652";
}
.treeIconLearner > span > span.fancytree-icon:before {
  content: "\e667";
  }

.treeIconUnknown > span > span.fancytree-icon:before {
  content: "\e652";
  font-size: 19px;
  }

.treeIconFaculty > span > span.fancytree-icon,
.facultyPrivIcon {
  color: #f38400;
  }

.treeIconSP > span > span.fancytree-icon,
.spPrivIcon {
  color: #48BA8E;
  }

.treeIconLearner > span > span.fancytree-icon,
.learnerPrivIcon {
  color: #488aba;
  }

.treeIconUnknown > span > span.fancytree-icon,
.unknownPrivIcon {
  color: #a7b1bc;
  }

#umGroupTree .fancytree-drag-source,
.treeViewcont .fancytree-drag-source {
  border: 0 none;
  background: transparent;
  }

#umGroupTree .fancytree-drag-source .fancytree-title,
.treeViewCont .fancytree-drag-source .fancytree-title {
  border: 1px dashed #aaa;
  background: transparent;
  border-radius: 3px;
  color: black;
  }

#fancytree-drop-marker {
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  }

#fancytree-drop-marker:before {
  font: 11px FontAwesome;
  content: "\f138";
  color: #21a521;
  margin-left: 2px;
  text-align: right;
  position: relative;
  top: 1px;
  background: #f6f6f6;
  border-radius: 100%;
  }

#fancytree-drop-marker.fancytree-drop-after:before,
#fancytree-drop-marker.fancytree-drop-before:before {
  font: 14px FontAwesome;
  content: "";
  color: #999;
  padding-left: 10px;
  position: relative;
  top: 2px;
  background: transparent;
  }

.fancytree-drag-helper.ui-draggable-dragging {
  color: #222;
  text-decoration: none;
  font-weight: normal;
  cursor: move;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
  padding: 2px 3px!important;
  font-size: 11px;
  box-shadow: 0 0 3px rgba(0,0,0,0.15);
  border-radius: 2px;
  background: #f1f1f1;
  background: #f4f4f4;
  border: 1px solid #ddd;
  z-index: 2001;
  opacity: 1;
  }

.fancytree-drag-helper.ui-draggable-dragging.fancytree-drop-reject {
  border-color: #ddd;
  }

.fancytree-drag-helper.ui-draggable-dragging span.fancytree-title {
  margin: 0;
  padding: 0;
  display: inline;
  vertical-align: middle;
  position: relative;
  top: 0px;
  }

.fancytree-drag-helper.ui-draggable-dragging span:before {
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font: 12px FontAwesome;
  position: relative;
  top: 1px;
  }

.fancytree-drag-helper.ui-draggable-dragging.fancytree-drop-accept span.fancytree-drag-helper-img:before {
  content: "\f058";
  color: #21a521;
  }

.fancytree-drag-helper.ui-draggable-dragging.fancytree-drop-reject span.fancytree-drag-helper-img:before {
  content: "\f05e";
  color: #dd0000;
  }

.fancytree-drag-helper.ui-draggable-dragging span.fancytree-drag-helper-img:before {
  content: "\f059";
  color: #ccc;
  }

.fancytree-drag-helper.ui-draggable-dragging {
  border-radius: 2px;
  background: #f1f1f1; 
  background: #f4f4f4;
  border: 1px solid #ddd;
  padding-left: 5px;
  }

.fancytree-container .readOnlyGroup > .fancytree-node > .fancytree-expander .accessIcon,
.fancytree-container .groupWithNoAccess > .fancytree-node > .fancytree-expander .accessIcon {
  position: absolute;
  left: 30px;
  top: 9px;
  display: block;
  background: #fff;
  border-radius: 100%;
  width: 12px;
  height: 11px;
  text-align: center;
  z-index: 3;
  padding-top: 2px;
  font-size: 10px;
  cursor:default;
  }


.editGroupTableFlow,
.popupContentTableCont {
  display: table;
  table-layout: fixed;
  position: relative;
  width: 100%;
  }

.editGroupPopupUsers,
.popupContentTableElem {
  display: table-cell;
  position: relative;
  float: none;
  width: 50%;
  vertical-align: top;
  }

.sourceGroupMultiCont,
.popupContentTableLeftElem {
  padding-right: 12px;
  }

.currentUsersCont,
.popupContentTableRightElem {
  padding-left: 12px;
  padding-right: 0;
  }

.editUsersDataTable {
  width: 100%;
  }

.editGroupPopupUsers .tableContainer table tbody tr td,
.editGroupPopupUsers .tableContainer table tfoot tr td {
  padding: 0px 4px 0px 4px;
  font-size: 11px;
  }

.editGroupPopupUsers .filterComponent,
.popupContentTableElem .filterComponent {
  margin-bottom: 7px;
  width: 250px;
  }

.editGroupPopupUsers h2,
.popupContentTableElem h2,
.sectionHead {
  text-align: left;
  font-size: 13px;
  margin: 0 0 15px;
  padding-left: 0;
  padding-top: 2px;
  font-weight: bold;
  }

.editGroupPopupUsers .groupPopupUsersArrow {
  position: absolute;
  top: 5px;
  z-index: 2;
  }

.editGroupPopupUsers .groupPopupUsersArrow.left { left: 7px; }
.editGroupPopupUsers .groupPopupUsersArrow.right { right: 7px; }

.editGroupPopupUsers .groupPopupUsersArrow i {
  font-size: 15px;
  color: #999;
  }

.editGroupPopupUsers .dataTables_info {
  display: none;
  }

#editGroupPopup .controls:before { font-size: 16px; }

#parentGroupSelectorContainer,
.parentSelectorContainer {
  width: 250px;
  }

#sourcreUserSearchContainer,
.popupContentTableElem .ez_search_wrap {
  width: 100%;
  margin-right: 0;
  margin-left: 5px;
  margin-bottom: 15px;
  } 

.groupUserFilterCont {
  display: flex;
  display: -webkit-flex;
  }

.groupSelectorForSourceUsers {
   flex: 1 0 50%;
   -webkit-flex: 1 0 50%;
   margin-right: 5px;  
  }

.groupSelectorForSourceUsers {
  max-width: 50%;
  }

#currentUserSearchContainer,
#subgroupUserSearchContainer, 
.popupContentTableRightElem .ez_search_wrap {
  float: none;
  margin-bottom: 15px;
  width: 99%;
  }

.sourceUsersMultipleSelector {
  width: 250px;
  }

.fa.tableIcon,
.im.tableIcon {
  height: auto;
  width: auto;
  }

input[type="text"][disabled].readOnlyInput {
  background: transparent;
  border: 1px solid #ccc;
  box-shadow: none;
  color: #333;
  font-weight: bold;
  opacity: 1;
  }

.tableTitleButton {
  display: inline-block;
  margin-left: 12px;
  }

.tableTitleButton.right { 
  position: absolute;
  top: 6px;
  right: 0;
  }

.tableContainer table th.titleHasButton.sorting,
.tableContainer table th.titleHasButton.sorting_desc,
.tableContainer table th.titleHasButton.sorting_asc {
  background-position: 4px 6px;
  }

.smallTable table th, 
.smallTable table td {
  padding: 3px 5px;
  text-align: left;
  font-size: 12px;
  }  

.smallTable table th {
  font-weight: bold;
  color: #222;
  border-bottom-width: 2px;
  }

.smallTable table tr:nth-child(even) td {
  background: transparent; 
  }  
  
.smallTable table tr:nth-child(odd) td {
  background: transparent;  
  }
  
.smallTable table tr:hover td {  
  background: rgba(0,0,0,0.0);
  }
 
.lightTable {
  border: 1px solid #bbbdbf;
  background: #fafafa;
  font-size: 11px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  }

.lightTable table {
  width: 100%;
  }

.lightTable table tr td, 
.lightTable table tr th {
  vertical-align: middle;
  padding: 6px 10px;
  background: #f9f9f9;
  }

.lightTable table tr td:last-child, 
.lightTable table tr th:last-child {
  border-right: none;
  }

.lightTable table tr th {
  background: #f0f0f0;
  border-right: none;
  font-weight: bold;
  }

.lightTable table tr:nth-child(2n) td {
  background: #fff;
  }
 
.rowSelectionInfo {
  margin-left: 10px;
  }

.rowSelectionInfo:before {
  content: "|";
  margin-right: 10px;
  }

.groupAccessControlSetupSection {
  margin-top: 15px;
  margin-bottom: 20px;
  }

.groupAccessControlSettingsItem,
.sharePopupSettings {
  margin-bottom: 20px;
  }

.groupAccessControlOptions {
  width: 125px;
  }

.removeAccessListElement {
  margin-left: 25px;
  }

/* USER MANAGER - Roles Tab */

.userManagerRolesCont { padding-top: 10px; }

.rolesManagerContainer {
  margin-right: 0px;
  position: fixed;
  }

.rolesManagerList,
.textBoxListCont {
  padding: 6px;
  height: 350px;
  border-radius: 2px;
  overflow: auto;
  width: 260px;
  }

.textBox .textBoxListElem a.listElemActive {
  background: #38afea!important; /* TODO: SASS */
  }

.textBox .textBoxListElem {
  position: relative;
  margin-bottom: 2px;
  }

.textBox .textBoxListElem a {
  color: #333;
  font-weight: normal;
  display: block;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  word-wrap: break-word;
  border-radius: 3px; 
  padding: 4px 70px 4px 4px;  
  }

.textBox .textBoxSeparator {
  height: 1px;
  background: #ccc;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.025);
  margin: 5px 0;
  }

.textBox .textBoxListElem span {
  margin-top: 0px;
  margin-bottom: 0px;
  display: inline-block;
  }

.textBox .textBoxListElem span.loadingList {
  display: inline-block;
  padding: 4px;
  font-style: italic;
  }

.textBox .textBoxListElem a.userSystemRole {
  font-style: italic;
  padding-right: 35px;
  }

.textBox .textBoxListElem:hover a,
.textBox .textBoxListElem.hoverableHelpElem a {
  background: #e5e5e5;
  }

.textBox .textBoxListElem a.listElemActive {
  color: white;
  }

.textBox .textBoxListElem .listElemIcons {
  position: absolute;
  right: 1px;
  top: 4px;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  }

.textBox .textBoxListElem .listElemIcon {
  font-size: 13px;
  margin-right: 6px;
  color: #222;
  opacity: 0.75;
  }

.textBox .textBoxListElem .listElemIcon.removeIcon {
  color: #dd0000;
  font-size: 14px;
  } 

.textBox .textBoxListElem .listElemIcon:hover {
  opacity: 1;
  }

.textBox .textBoxListElem a.listElemActive ~ .listElemIcons .listElemIcon {
  color: white;
  opacity: 1;
  }

.textBox .textBoxListElem a.listElemActive ~ .listElemIcons .listElemIcon:hover {
  opacity: 0.75;
  }

.textBox .textBoxListElem:hover .listElemIcons,
.textBox .textBoxListElem.hoverableHelpElem .listElemIcons {
  opacity: 1;
  visibility: visible;
  }

.textBox .textBoxListElem .editable-inline ~ .listElemIcons {
  display: none;
  }

.textBoxListElem .editable-buttons button {
  margin-top: 4px;
  margin-right: 3px;
  margin-left: 0;
  }

.textBoxListElem .editable-input input {
  width: 200px;
  padding: 3px 4px;
  }

.roleManagerBtns,
.textBoxListElemInputBtncont {
  position: relative;
  margin-top: 10px;
  }

.addCustomRoleInput,
.addTextBoxListElemInput { 
  vertical-align: middle; 
  width: 218px; 
  }

#tabUserManagerRolesCont .rolesContainer {
  padding-left: 300px;
  }

.rolesContainer {
  font-size: 11px;
  }

.rolesContainer span {
  display: inline-block;
  margin-left: 0px;
  padding-bottom: 10px;
  }

.rolesContainer input {
  float: left;
  margin: 0 7px 0 0;
  }

.rolesContainer label {
  margin-left: 20px;
  padding-bottom: 5px;
  padding-top: 2px;
  display: block;
  }

.rolesContainer input[disabled] + label {
  color: #666;
  }

.rolesContainer input[disabled]:checked + label {
  color: #000;
  }

.rolesContainer table td {
  padding: 0 15px;
  }

.rolesContainer .itemLine {
  margin: 20px 0;
  }

#editUserPopup .rolesContainer {
  padding: 10px 0;
  }

.userEditPrivList {
  margin-left: 12px;
  }

.userEditPrivList.rolesContainer input[disabled] + label {
  color: #222;
  }

/* USER MANAGER - BUC Tab */

.breadCrumb {
  position: relative;
  text-align: center;
  }

.crumbsBg {
  background: none repeat scroll 0 0 #333333;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  }

.breadCrumb ul {
  display: inline-block;
  list-style: none outside none;
  }

.breadCrumb ul li {
  float: left;
  margin-right: 5px;
  }

.breadCrumb ul li span {
  background: none repeat scroll 0 0 #e1e1e1;
  color: #333333;
  display: block;
  float: left;
  font-size: 13px;
  height: 27px;
  padding: 7px 25px 0 35px;
  position: relative;
  text-align: center;
  }

.breadCrumb ul li span:after {
  border-bottom: 17px solid rgba(0, 0, 0, 0);
  border-left: 12px solid #e1e1e1;
  border-top: 17px solid rgba(0, 0, 0, 0);
  content: "";
  position: absolute;
  right: -12px;
  top: 0;
  z-index: 1;
  }

.breadCrumb ul li span:before {
  border-bottom: 17px solid rgba(0, 0, 0, 0);
  border-left: 12px solid #fff;
  border-top: 17px solid rgba(0, 0, 0, 0);
  content: "";
  left: 0;
  position: absolute;
  top: 0;
  }

.breadCrumb ul li:first-child span {
  border-bottom-left-radius: 6px;
  border-top-left-radius: 6px;
  }

.breadCrumb ul li:first-child span:before {
  display: none;
  }

.breadCrumb ul li:last-child span {
  border-bottom-right-radius: 6px;
  border-top-right-radius: 6px;
  padding-right: 30px;
  }

.breadCrumb ul li:last-child span:after {
  display: none;
  }

.hoverAction.breadCrumb ul li span:hover,
.breadCrumb ul li span.active {
  color: #FFFFFF;
  }

.hoverAction.breadCrumb ul li span:hover,
.breadCrumb ul li span.active {
  background: #38afea; /* TODO: SASS */
}

.hoverAction.breadCrumb ul li span:hover:after,
.breadCrumb ul li span.active:after {
  border-left-color: #38afea; /* TODO: SASS */
}

.bucMainContentContainer {
  margin-top: 20px;
  }

.bucMainContentContainer .fileInputPath {
  width: 250px;
  }
  
.bucStepsMainCont {
  padding: 20px 20px;  
  }
  
.bucStepsCont {
  float: left;
  }

.bucStepsDescCont {
  margin: 0;
  padding-left: 40px;
  overflow: hidden;
  }

.bucSteps h3 {
  margin-bottom: 10px;
} 
  
.bucMultipleSelector {
  width: 250px;
  }

.multipleSelectorBtn {
  position: relative;
  margin-left: 5px;
  }

.bucNavButtons {
  margin: 20px 0px 10px 0px;
  bottom: 5px;
  display: inline-block;
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  }

.sectionNavigateBtns {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  display: inline-block;
  }  

.sectionNavigateBtns button {
  font-size: 13px;
  padding: 3px 20px;
  min-width: 130px;
  }  
  
.bucErrorContainer {
  padding: 5px 8px;
  }

.bucResultSummaryCont {  
  margin-bottom: 20px;
  }
  
.bucResultSummaryCont .errorBox {  
  color: #222;
  }  
  
.bucResultSummaryCont table {
  width: 100%;
  }

.bucSummaryErrorHead {
  margin-bottom: 10px;
  }  
  
.bucResultSummaryCont .smallTable {
  max-height: 125px;
  overflow: auto;
  }
  
.bucResultSummary {
  display: inline-block;
  padding: 10px 15px;
  }

.bucResultSummary span {
  display: inline-block;
  margin-right: 10px;
  }

.bucResultSummary label {
  display: inline-block;
  font-weight: bold;
  }

#bucTableContainer .notAllowedToUpdate td {
  color: #dd0000;
}
  
#bucTableContainer .notAllowedToUpdate td i:before {
  font-family: 'fontawesome';
  content: "\f071";
  color: #dd0000;
  margin-left: 3px;
  }
   
#bucTableContainer .warnTypeNoAccessForGroup td {
  color: #dd0000;
  }
  
#bucTableContainer .warnTypeNoAccessForGroup td i:after {
  font-family: 'icomoon';
  content: "\e652";
  color: #dd0000;
  margin-left: 5px; 
  }  
  
#bucTableContainer .notAllowedToUpdate.warnTypeNoAccessForGroup td i:after {
  font-family: 'icomoon';
  content: "\e652";
  color: #dd0000;
  margin-left: 5px;	
  }   

#bucTableContainer table tr td img {
  height: 21px;
  cursor: pointer;
  }

#bucTableContainer .changed {
  background-color: #d7effb; /* TODO: SASS */
  }

.bucTableLegendIcon {
  font-size: 15px;
  }

#bucTableLegendQtip i {
  margin-right: 5px;
  font-size: 15px;
  width: 14px;
  }  
  
#bucTableLegendQtip span {
  margin-left: 48px;
  }   
  
#bucTableLegendQtip .fa-exclamation-triangle,
#bucTableLegendQtip .im-user-group {
  color: #dd0000;  
  }
  
.bucDefaultGroupContainer {
  position: relative;
  margin-bottom: 5px;
  padding-bottom: 10px;
  }

#bucDefaultGroupName {
  width: 230px;
  }

.missingImage {
  background: #fff;
  border-color: #aaa #ddd #ddd #aaa;
  border-style: solid;
  border-width: 1px;
  display: inline-block;
  padding: 6px 5px;
  }

.missingImage i {
  color: #dd0000;
  background: none repeat scroll 0 0 white;
  border: 1px solid #ccc;
  display: inline;
  font-size: 8px;
  padding: 2px 3px;
  position: relative;
  top: 0;
  }

/* Fancy Tree customization */
.fancytree-title.ui-droppable {
  cursor: move;
  cursor: -moz-grab;
  cursor: -webkit-grab;
  }

#umGroupTree ul.fancytree-container,
.treeViewCont ul.fancytree-container {
  border: none;
  overflow: auto;
  padding: 5px 3px;
  }

#umGroupTree ul.fancytree-container li,
.treeViewCont ul.fancytree-container li {
  padding: 0 0 2px 0;
  position: relative;
  }

/* CASE MANAGER */
/* Search results */
.input2-list-element-content i.resultIsACase:before,
.input2-list-icon-indicator.resultIsACase:before {
  content: "\f0ca";
  font-family: fontawesome;
  }

.input2-list-element-content i.resultIsACase:before {
  }

.input2-list-element-content i.resultIsACabinet:before,
.input2-list-icon-indicator.resultIsACabinet:before {
  content: "\e672";
  font-family: icomoon;
  }

.input2-list-element-content i.resultIsACabinet:before {
  font-size: 15px;
  margin-right: 2px;
  top: 1px;
  }

.input2-list-icon-indicator.resultIsACabinet:before {
  font-size: 14px;
  }

/* Case links */
.caseLinks {
  margin-top: 5px;
  }

.caseLinks li {
  display: inline;
  list-style-type: none;
  padding-right: 20px;	
  }

.hiddenCase {
  color: #777;
 }

/* Cabinets */
#cmCabinetTree span.fancytree-title {
  top: -2px;
  }

.treeIconCabinet > span > span.fancytree-icon:before {
  font-family: "icomoon";
  content: "\e672";
  font-size: 20px;
  color: #a7b1bc;
  }

.treeIconCabinet > span > span.fancytree-icon {
  color: #989ca0;
  }

/* Cases Table */
.hiddenCheckboxTd,
.hiddenCheckbox {
  padding: 0;
  margin: 0;
  display: none;
  }

.caseContentButton {
  position: absolute;
  top: 10px;
  right: 10px;
  text-align: right;
  }

#spWhoDidThis ul {
  margin-left: 10px;
  }

#spWhoDidThis ul li {
  padding: 4px 0;
  list-style-type: disc;
  }

/* Case properties Popup */
.addedAnnotationInfo span {
  position: relative;
  top: 4px;
  font-style: italic;
  }

.addNewAnnotationCont {
  margin-top: 10px;
  }

.addNewAnnotationCont input {
  width: 310px;
  }

.customFieldList {
  position: relative;
  }

.tableOperationsHead {
  background: #f4f4f4;
  height: 25px;
  margin-bottom: 5px;
  padding: 10px 8px;
  }

.accordionSection {
  background: #f9f9f9;
  border-radius: 2px;
  margin-bottom: 15px;
  position: relative;
  cursor: pointer;
  }

.accordionSection .sectionHead {
  padding: 5px;
  margin: 0;
  }

.accordionSection:hover {
  background: #f3f3f3;
  }

.accordionSection.noHover {
  cursor: auto;
  }

.accordionSection.noHover:hover {
  background: #f9f9f9;
  }

.accordionHead {
  overflow: hidden;
  padding: 10px 15px;
  position: relative;
  }

.accordionHeadBar {
  display: block;
  padding: 6px 8px;
  border-radius: 2px 2px 0 0;
  background: #e5e5e5;
  font-size: 11px;
  text-transform: uppercase;
  }

.accordionSectionArrow {
  box-sizing: border-box;
  height: 100%;
  padding: 18px 12px;
  position: absolute;
  top: 0;
  left: 0;
  }

.accordionSectionArrow i {
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  }

.accordionSectionArrow  + .emailTitleSectionCont {
  margin-left: 8px;
  }

.accordionSectionOpened .accordionSectionArrow i {
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  }

.accordionContent {
  padding: 0 15px 10px;
  background: #eee;
  border-radius: 0 0 4px 4px;
  position: relative;
  }

.accordionSection.draggableAccordion .accordionHead,
.accordionSection.draggableAccordion .accordionContent {
  padding-left: 25px;
  }

.emptySectionText {
  margin-bottom: 15px;
  }

.customCasePropDescriptionSection {
  margin: 0 20px 15px 0;
  }

.customCasePropTitleSection {
  margin-right: 20px;
  }

.customCasePropTitle.inlineEditElem,
.inlineEditElem.sectionHead {
  margin: 0;
  padding: 4px 25px 5px 5px;
  }

.customCasePropTitleEditor.inlineEditInput {
  margin-left: 3px;
  width: 400px;
  }

.sectionDragIcon {
  font-size: 18px;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  padding: 12px 0 12px 6px;
  margin-top: -1px;
  cursor: move;
  cursor: -moz-grab;
  cursor: -webkit-grab;
  }

.sectionDragIcon i {
  color: #bbb;
  }

.sectionDragIcon:hover i {
  color: #888;
  }

.sectionDragContent {
  padding-left: 15px;
  }

#resourceCaseDefaultsEntityCollectorContainer .entityTableView > div:first-child {
  width: 85%;
  }

#resourceUsageInputsCont {
  width: 40%;
  }

.quantityContainer {
  width: 200px;
  }

.quantityMeasureAbbrCont.hidden {
  display: none;
  }

.quantityMeasureAbbrCont > div {
  margin-left: 5px;
  white-space: nowrap;
  }

/* css for timepicker */
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; }
.ui-timepicker-rtl dl dd { margin: 0 65px 10px 10px; }

.ui-datepicker { 
  z-index: 2000!important;
  font-family: Helvetica; 
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
  }

.ui-datepicker .ui-state-active { border: 1px solid #555!important; }

.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, 
.ui-widget-header .ui-priority-secondary {
  font-weight: bold!important;
  opacity: 1!important;
  }

.ui-datepicker .ui-datepicker-buttonpane button { box-shadow: none!important; }

.ui-datepicker table.ui-datepicker-calendar {
  table-layout: fixed;
  }

.ui-datepicker.ui-widget {
  padding: 5px;
  }

.ui-datepicker.hideTimepicker .ui-timepicker-div,
.ui-datepicker.hideTimepicker .ui-datepicker-buttonpane {
  display:none;
}

/* Flotr2 chart customization */

.flotr-grid-label {
  font-size: 11px;
  color: #555;
  }

.flotr-legend table tr td.flotr-legend-label,
.flotr-legend table tr td.flotr-legend-color-box {
  line-height: 15px;
  max-width: 200px;
  padding: 2px 5px;
  font-size: 10px;
  border-bottom: 1px solid transparent;
  vertical-align: middle;
  }

.flotr-legend table tr:hover td.flotr-legend-label,
.flotr-legend table tr:hover td.flotr-legend-color-box {
  border-bottom: 1px solid transparent;
  background: none;
  }

.pieChartTitle {
  font-size: 14px;
  color: #333;
  text-align: center;
  font-weight: bold;
  padding-top: 10px;
  }

.pieChartSubtitleCont {
  font-size: 12px;
  margin-top: 5px;
  color: #333;
  text-align: center;
  }

.pieChartSubtitle {
  margin-right: 10px;
  }
  
.highlight {
  font-weight: bold;
  color: black;
  }

/* Placard */
img.logoLSPlacard {
  margin-left: 10px;
  position: relative;
  top: 4px;
  }

#placardMain .tableContHeaderC { position: relative; }

.logoUniCont {
  position: absolute;
  right: 25px;
  top: 2px;
  z-index: 1;
  padding: 3px;
  border-radius: 100%;
  /* For rounded logo */
  /*background: #D0E9F5;
  border-bottom: 2px solid #BDD0E0;*/
  }

.logoUni {
  /* For custom logo */
  /*background: url(../ez_images/placard_uni_logo.png) no-repeat;*/
  width: 99px;
  height: 99px;
  }

.detailsContents {
  margin: 20px;
  }

.event.textHead {
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  margin: 35px 0px 30px;
  }

.case.textHead {
  font-size: 21px;
  font-weight: bold;
  text-align: center;
  margin: 0px 0px 15px;
  }

.caseContainer {
  padding: 5px;
  margin-top: 30px;
  margin-bottom: 15px;
  }

.caseDescr {
  margin: 0;
  padding: 0 20px;
  overflow: hidden;
  }

.caseDescr p,
.caseDescr {
  font-size: 18px;
  font-weight: normal;
  text-align: justify;
  line-height: normal;
  }

.caseDescr p span {
  font-family: "Open Sans"!important;
  font-size: inherit!important;
  line-height: inherit!important;
  }

.caseDescr strong * {
  font-weight: bold;
  }

.caseDescr em * {
  font-style: italic;
  }

.caseDescrDots {
  visibility: hidden;
  padding: 0 20px;
  height: 20px;
  background: url(../ez_images/resizable_area_dots.png) no-repeat scroll center center;
  background-size: 30px auto;
  }

.caseDescrDots.show {
  visibility: visible;
  }

.learners {
  display: table;
  margin: 0 auto;
  padding: 0 20px;
  }

.schedTime {
  font-size: 18px;
  color: #555;
  padding-right: 10px;
  padding-bottom: 5px;
  text-align: right;
  }

.schedLrnName {
  font-size: 18px;
  font-weight: bold;
  }

.schedLrn {
  display: table-row;
  position: relative;
  }

.schedLrnElem {
  display: table-cell;
  }

.schedLrn .fa { 
  visibility: hidden; 
  left: -10px; 
  top: 0px;
  position: relative;
  font-size: 24px;
  color: #dd0000;
  }

.schedLrn.selectedUser .fa { visibility: visible; }

.footerCont {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  min-height: 50px;
  text-align: center;
  margin: 0 30px;
  border-top: 1px solid #ddd;
  padding-top: 5px;
  }

.footerHead {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  }

.footerDetails {
  font-size: 15px;
  font-weight: normal;
  text-align: center;
  }

#roomInfo {
  top: 15px;
  position: relative;
  }

#roomInfo.recordingActive {
  top: 5px;
  }

#recordStatus {
  font-size: 15px;
  position: relative;
  margin-top: 7px;
  }

#recordStatus.recordingIcon:before {
  content: "";
  width: 10px;
  height: 10px;
  background: #dd0000;
  display: inline-block;
  margin-right: 5px;
  border-radius: 100%;
  -moz-animation: blink steps(1) 2s infinite;
  -webkit-animation: blink steps(1) 2s infinite;
  -ms-animation: blink steps(1) 2s infinite;
  animation: blink steps(1) 2s infinite;
  }

@-moz-keyframes blink{  0% { visibility: visible; }50% { visibility: hidden; }100% { visibility: visible; }}
@-webkit-keyframes blink {  0% { visibility: visible; }50% { visibility: hidden; }100% { visibility: visible; }}
@-ms-keyframes blink {  0% { visibility: visible; }50% { visibility: hidden; }100% { visibility: visible; }}
@keyframes blink {  0% { visibility: visible; }50% { visibility: hidden; }100% { visibility: visible; }}


.blinking {
  -moz-animation: blinking normal 1.3s infinite ease-in-out;
  -webkit-animation: blinking normal 1.3s infinite ease-in-out;
  -ms-animation: blinking normal 1.3s infinite ease-in-out;
  animation: blinking normal 1.3s infinite ease-in-out;
  }

@-moz-keyframes blinking {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}
@-webkit-keyframes blinking {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}
@-ms-keyframes blinking {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}
@keyframes blinking {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}}

/* Todays Info Screen */

#todaysEventMain h3 {
  display: inline-block;
  font-size: 22px;
  padding: 6px 12px;
  }

.todaysInfoDetailsCont {
  margin: 14px;
  }

.todaysInfoCont {
  padding: 10px 0;
  border-bottom: 1px dotted #ddd;
  }

.todaysInfoCont:last-child {
  border-bottom: 0px dotted #ddd;
  }

.todaysInfoEventName {
  font-size: 17px;
  font-weight: bold;
  }

.todaysInfoRoomDetails {
  margin-top: 3px;
  }

.todaysInfoSessionTimeFrame {
  font-size: 17px;
  color: #555;
  }

.todaysInfoRooms {
  font-size: 17px;
  font-weight: bold;
  }

.todaysInfoBullet {
  margin: 0 5px;
  }

/* RESPONSIVE DEFINITIONS */
/* iPad portrait */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait) {
  .popup.fixedPopup.showPopup {
    max-width: 740px!important;
  }
}

/* iPhone landscape */
@media only screen 
and (min-device-width: 320px) 
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) {
  .popup.fixedPopup.showPopup {
    max-width: 500px;
  }
  .popup:not(.simple).fixedPopup.showPopup .popupContScroll {
    max-height: 170px;  
  }

  .popup:not(.simple).fixedPopup.showPopup .aboutPopupScroll.popupContScroll {
    max-height: 275px;
  }
  
  .eventsContainer .sep.breakLine:after {
    content: "\A";
    white-space: pre;
  }  
  
  .eventsContainer .sep.breakLine {
    visibility: hidden;
  }

  .eventsContainer li {
    margin-bottom: 8px;
  }

  #yevContents {
    min-height: 1px;
    height: auto!important;
  }
}

/* Small screen mode */
@media all and (max-width: 560px) {
  /* Main Header */
  #pageControls #logoCAE {
    /*display: none;*/
  } 

  #pageControls #logoLS {
    /*margin-left: 0;
    width: 32px;
    background-position-x: 0%;
    background-position-y: 0%;*/
  }

  #userInfo {
    max-width: 110px;
  }

  /* Dashboad Icons */
  .dbIcons.small .dbIco:not(.icoAlone),
  .ipad.dbIcons.small .dbIco:not(.icoAlone) {
    float: left;
    height: 28px;
    width: calc(50% - 10px);
    width: -webkit-calc(50% - 10px);
    width: -moz-calc(50% - 10px);
    margin: 5px!important;
    margin-top: 3px!important;
    box-sizing: border-box;
  }

  .dbIcons.small .dbIco:not(.icoAlone) .dbIcoImg {
    font-size: 20px;
    float: left;
    position: absolute;
    left: 4px;
    top: -1px;
  }

  .dbIcons.small .dbIco:not(.icoAlone) .dbIcoTextCont {
    display: block;
    height: 28px;
    position: relative;
    text-align: left;
    width: auto;
  }

  .dbIcons.small .dbIco:not(.icoAlone) .dbIcoText {
    display: inline-block;
    padding: 9px 5px 9px 33px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;    
  }
  
  /* Your Events */
  #eventsContainer {
    padding-bottom: 3px;
  }
  
  .eventsContainer .sep.breakLine:after {
    content: "\A";
    white-space: pre;
  }  
  
  .eventsContainer .sep.breakLine {
    visibility: hidden;
  }

  .eventsContainer li {
    margin-bottom: 8px;
  }

  #yevContents {
    min-height: 1px;
    height: auto!important;
  }  
  
  /* Login & Logout */
  #loginBox .popupContScroll,
  #aboutBox .popupContScroll {
    margin: 0;
    padding: 10px 15px;
  }

  .loginInputCont {
    padding: 0 8px;
  }

  .loginLogosCont {
    text-align: center;
  }
  
  .caeHealthcareLogo {
    background-size: 100px auto;
    width: 100px;
    height: 26px;
    top: -45px!important;
  }

  .learningSpaceLogoBig {
    background-size: 100px auto;
    width: 100px;
    height: 50px;
  }

  .loginWelcome {
    font-size: 24px;
  }

  .clientName {
    font-size: 13px;
    margin-bottom: 3px;
  }

  .userTypeSelectorMain {
    margin-bottom: 8px;
    margin-top: 8px;
    font-size: 11px;
  }

  .iconUserGroups.loginGroup {
    right: -18px;
  }  
  
  .loginBtn.loginBtn {
    margin-top: 12px;
  }

  .passLink {
    padding-bottom: 5px;
    padding-top: 12px;
  }  
 
  .moreInfoCont {
    margin: 30px 0 40px;
  }

  .serial_cont {
    margin-top: 10px;
  }

  #logoutBox .EZMessagesCont.login {
    margin-top: 10px;
  }
 
  /* Popups General */
  .popup.fixedPopup.showPopup,
  .popup, .relPopup {
    max-width: 300px!important;
  }  
  
  .popup .popInput,
  .popup .popSelect,
  .popup .popTextarea {
    width: 150px;
    min-width: 150px;
  }  
  
  #about_logo {
    background-size: 100% auto;
    width: 260px;
  }
  
  .setting-label {
    padding-left: 0;
  }
  
  .overlayHelpItem {
    max-width: 100px!important; /* TODO */
  }
}

/* Mobile mode */
body.ls-mobile {
  background-image: none;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body.ls-mobile #header {
  background-image: none;
}

body.ls-mobile #container {
  overflow: visible;
}

body.ls-mobile input, 
body.ls-mobile select, 
body.ls-mobile textarea {
  font-size: 16px!important;
}

body.ls-mobile #yevContents {
  height: auto!important;
}

.loading-text-indicator {
  /*margin-top: 5px;*/
  text-align: center;
  padding: 5px 0px;
  display: none;
  background-color: rgb(245, 245, 245);
  display: block;
  /*position: relative;*/
  /*bottom: 60px;*/
}

.contentReadOnly {  
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.07);
	width: 100%;
	height: 100%;
	z-index: 5;
}

.readOnlyMode {
	 float: left;
	 position: relative;
	 top: 7px;
	 margin-left: 5px;	
}

#userAccountPopupContent .popInput,
#userAccountPopupContent .popTextarea,
#userAccountPopupContent .popSelect {
  width: 300px;
  overflow: hidden;
}