/*
* iTracIMS 2.0 - iTrac Custom Styles
* http://www.fcicanada.com
*
* v 1.2
*/
li .autocomplete-container.value-selected  .search-empty{
    display:none;
  }
  
  ul.itrac-record .ui-listview-filter .ui-input-search {
      margin:0px;
  }
  
  ul.itrac-item-errors{
          list-style: none;
      margin: 0px;
  }
  
  .selected-autocomplete-option{
   position:relative;
   padding:.7em 15px;
   border: 1px solid #b0b0b0;
   box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  }
  
  /*Back to Top Button*/
  .back-to-top {
      position: fixed;
      bottom: -0.3em;
      right: 20px;
      border: 1px solid rgba(0,0,0,0.2);
      text-decoration: none;
      background-color: rgba(235, 235, 235, 0.80);
      display: none;
      padding: 0em 0.3em;
  }
  .back-to-top:hover {
      background-color: rgba(135, 135, 135, 0.50);
  }
  
  .ui-header{
    height: auto;
    /*zoom: 1;*/
  }
  
  .itrac-header-btn-icon{
   cursor:pointer; 
   zoom:1;
   top:0;
   position:relative;
   height:2.81em;
   display:inline-block;
   text-overflow: ellipsis;
   overflow: hidden;
   border: 0px;
   padding: 0px;
   margin: 0px;
   text-align: center;
  }
  
  .itrac-header-btn{
   cursor: pointer; 
   zoom: 1;
   top: 0;
   position:relative;
   height: 2.81em;
   width:auto;
   display: inline-block;
   text-overflow: ellipsis;
   overflow: hidden;
   border: 0px;
   padding: 0px;
   margin: 0px;
   text-align:left;
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  
  /* breakpoint is 1000px. */
  .itrac-header-btn span {
      display:none;
  }
  
  @media screen and (min-width: 1025px){
  .itrac-header-btn span {
      display:inline-block;
      width: 1px;
      margin-top:auto;
      margin-bottom:auto;
      overflow:hidden;
      visibility:hidden;
      white-space:nowrap;
      position:relative;
      top:0px;
      line-height:2.81em;
      -webkit-transition: width 0.3s ease-in-out, visibility 0.3s linear;
      -moz-transition: width 0.3s ease-in-out, visibility 0.3s linear;
      -o-transition: width 0.3s ease-in-out, visibility 0.3s linear;
      transition: width 0.3s ease-in-out, visibility 0.3s linear;
  
  }
  
   .itrac-header-btn:hover span {
      visibility: visible;
      width:12em;
   }
  }
  
  .itrac-header-logo{
      height: 2.81em;
      display: none;
  }
  
  .itrac-menu-btn-logo {
      display: inline;
      position: relative;
      max-height: 2.81em;
      max-width: 2.81em;
  }
  
  .itrac-header-logo-icon{
      height: 2.81em;
      display: inline;
  }
  .itrac-breadcrumb-full{
          display: none;
  }
  .itrac-breadcrumb-back{
          display: inline;
  }
  
  /* breakpoint is 768px. */
  @media screen and (min-width: 768px){
      .itrac-header-logo{
      display: inline;
      }
      .itrac-header-logo-icon{
      display: none;
      }
      .itrac-breadcrumb-full{
      display: inline;
      float:left;
      white-space:nowrap;
      width:90%;
      height:2.81em;
      }
  }
  
  .body-contain{
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      border:0px;
      outline:0px;
  }
  
  /*Pop ups */
  div.popup-panel {
      background-color:white;
      top: 0px;
      position: absolute;
      z-index: 1006;
      max-width: 100vw;
      width: 500px;
      min-width: 200px;
      max-height: 100vh;
      height: 100vh;
      text-align:center;
  }
  
  div.popup-panel iframe{
      height:100%;
      width:100%;
  }
  
  
  
  .itrac-dyn-popup .popup-content{
  overflow:hidden;
  }
  .itrac-popup .popup-content{
  overflow:hidden;
  }
  
  .ui-popup .popup-help{
      font-size:10pt;
      padding:.5em;
  }
  
  .ui-popup .popup-footer{
      position:relative;
      bottom: 4px;
  }
  
  .ui-popup {
      max-height: calc(100vh - 100px);
      overflow: auto;
  }	
  
  .ui-popup .ui-header .ui-title{
  margin-left:auto;
  margin-right:auto;
  padding-right: 25px;
  }
  
  
  
  .itrac-record li{
      font-weight:normal;
  }
  
  
  
  
  
  /* Override jQuery Mobile Auto-Styling - fix for UofRIssue cfraser 04-09-2016 */
  .itrac-record-row .display_only .ui-li-desc{
      font-size: 16px;
      font-weight: normal;
      display: inline;
      margin: 0;
      overflow: auto;
      white-space: normal;
  }
  
  .itrac-record-row .ui-disabled{
    filter: Alpha(Opacity=55) !important;
    opacity: 0.55 !important;
  }
  
  .itrac-record-row .ui-state-disabled{
      filter: Alpha(Opacity=55) !important;
      opacity: 0.55 !important;
  }
  
  .itrac-tree-title h1{
  text-align:left !important;
  font-size: 6pt;
  margin-left:2.3em !important;
  width:75%;
  }
  
  .itrac-tree li .ui-btn-text, .itrac-tree li.ui-li-static{
  font-size: 10pt;
  }
  .itrac-entry-ind{
  font-size:16px;
  }
  
  /* Custom iTrac Search */
  .itrac-search-contain{
  white-space:nowrap;
  max-width:100%;
  display:block;
  }
  
  .itrac-search-bar{
      top:5px;
      right: 5px;
      white-space:nowrap;
      position:absolute;
      float:right;
      width:70%;
      left: 5;
      z-index:500;
      max-width: 98vw;
      display:none;
  }
  
  .itrac-search-btn {
  max-height:45px;
  margin:0px;
  top:5px;
  right:50px;
  position:absolute;
  display:inline-block;
  white-space:nowrap;
  }
  .itrac-search-field{
  width:0px;
  max-width:100%;
  min-width:0px;
  display: inline-block;
  float: right;
  }
  .itrac-search-field .ui-btn-inner {
    font-size: 14px;
    padding: .6em 14px .6em;
  }
  
  .itrac-search-btn .ui-btn {
  height:35px !important;
  width:35px !important;
  margin:0px!important;
  }
  .itrac-search-btn .ui-btn {
  height:35px !important;
  width:35px !important;
  margin:0px!important;
  }
  
  .itrac-search-bar div div .ui-input-text,
  .itrac-search-bar div div div .ui-input-text {
  width:100%;
  margin:0px!important;
  }
  .itrac-search-field .ui-select{
  margin-left:15px;
  }
  
  .itrac-search-bar div div .ui-btn {
  height:35px;
  margin:0px!important;
  }
  
  .ui-icon-itrac-search {
      background-color: transparent;
      background: url("/i/themes/itrac_theme/icons/tool-search-alt.png") no-repeat 50% 50% !important;      
      width: 30px;
      height: 30px;
      -moz-border-radius:0px  !important;
      -webkit-border-radius:0px  !important;
      border-radius:0px !important;
      border:0px  !important;
  }
  
  .itrac-search-bar .ui-grid-b .ui-block-a{
  width:30%;margin:0px!important;float:left;
  }
  
  .itrac-search-bar .ui-grid-b .ui-block-b{
  width:70%;margin:0px;float:left;
  }
  
  .itrac-search-bar .ui-grid-b .ui-block-a .ui-select{
  min-width:50px;
  }
  
  .itrac-search-close{
      position:absolute!important;
      top:-3px;
      right:0px;
  }
  
  /* Fixes legend not wrapping on IE10 */
  .ui-controlgroup-label legend {
   max-width: 100%;
  }
   
  .itrac-displayonly{
      font-weight: normal;
      min-height:28px;
  }
  .itrac-displayonly img{
      max-width:100%;
  }
  
  .ui-controlgroup-label {
      line-height: normal!important;
  }
  
  .ui-body-j{ /* Data theme J is read-only swatch*/
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
     box-shadow: none !important;
     cursor: text;
  }
  
  .ui-body-l{ /* Data theme L is locked input swatch*/
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
     box-shadow: none !important;
     cursor: text;
  }
  
  ul.itrac-record div.ui-select .ui-btn{margin-left:0px;margin-right:0px}
  
  .ui-btn[data-theme="l"] select{ /* hide select when locked */
    display: none;
  }
  
  .ui-disabled[data-theme="l"] { 
  opacity: 0.8 !important; 
  }
  
  form input[type='number']::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
  }
  
  /* Force Navbar to vertical mode when screen is small */
  @media screen and (max-width: 768px){
      .itrac-pages-navbar .ui-grid-d > :nth-child(n) {
      width: 100% !important;
      }
  }
  @media screen and (max-width: 500px){
      .itrac-pages-navbar .ui-grid-c > :nth-child(n) {
      width: 100% !important;
      }
  }
  @media screen and (max-width: 350px){
      .itrac-pages-navbar .ui-grid-b > :nth-child(n) {
      width: 100% !important;
      }
  }
  
  
  /*Fix select list cut-off in chrome*/
  select {
  font-family: Arial !important;
  font-size: 11pt !important;
  }
  
  .itrac-icon-btn.ui-btn-icon-notext{
  margin: 0px;
  }
  
  .itrac-icon-btn .ui-btn-inner{
  padding-left: 35px;
  }
  
  .itrac-icon-btn.ui-btn-icon-notext{
  background-size:20px 20px;
  }
  
  
  /* Display for child record references */
  li.itrac-rcd-children-contain {
  padding:0px !important;
  }
  
  div.add-child-btn{
  padding:1em 4em;
  text-align:center;
  }
  
  div.add-child-btn div.ui-btn{
  min-width:200px;
  width:40%;
  margin:auto;
  }
  
  .itrac-rcd-children-contain  ul.itrac-record {
  margin:0px;
  }
  
  .itrac-rcd-children-contain ul.itrac-record li.ui-li {
  border-right: 0px;
  border-left: 0px;
  }
  
  /*---------------------------------- Printing ----------------------------*/
  @media print
  {
  html,body{
      overflow:visible !important;
      position:absolute !important;
      max-height:auto !important;
      width: 100%;
  }
  div.content-form-body{
      overflow:auto;
  }
  .ui-page-active{
      visibility:hidden;
      overflow:visible !important;
      height:auto !important;
      max-height:auto !important;
      position:absolute !important;
      width: 100%;
      display:inline;
      float:none;
      zoom: 0.7;
  }
  .ui-content{
      overflow:visible !important;
      height:auto !important;
      max-height:auto !important;
      position:absolute !important;
      margin:0px;
      padding:0px;
      width: 95%;
      display:inline;
      float:none;
  }
  
  .viewport-ir, .viewport-ir-tab, .viewport-tab, .viewport-notab, .scroller-tab, .scroller, .scroller-full{
      overflow:visible !important;
      height:auto !important;
      position:absolute !important;
      max-height:auto !important;
      width: 100%;
  }
  .scroller-tab{
      overflow: auto;
  }
  .ui-panel{
  display:none !important;
  width:0px !important;
  padding:0px !important;
  margin:0px !important;
  }
  .ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-reveal, .ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-push, .ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal, .ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push{
  -webkit-transform: none !important;
  -moz-transform: none !important;
  transform: none !important;
  }
  
  .ui-panel-content-wrap, .ui-panel-content-wrap-open{
  margin:0px !important;
  padding:0px !important;
  width:99.9% !important;
  left:0 !important;
  right:0 !important;
  }
  .ui-header{
  position:absolute !important;
  display:none;
  top:0;
  left:0;
  }
  .ui-page-active .itrac-header-logo{
  visibility: visible;
  display:block;
  position:absolute !important;
  top:0;
  left:0;
  }
  
  .ui-page-active .printable {  
     width: 99% !important;
     visibility:visible;
     display:inline;
     overflow:visible;
     position: relative;
     left: 0;
     float:none;
   }
  
   .not-printable{
      display:none;
   }
  }
  
  @media screen and (min-device-width: 1050px) {
  ::-webkit-scrollbar {
      width: 10px;
      height: 10px;
      padding:0;
      margin:0;
  }
   
  ::-webkit-scrollbar-track {
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
      border-radius: 10px;
      padding:0;
      margin:0;
      background-color: transparent;
  }
   
  ::-webkit-scrollbar-thumb {
      border-radius: 10px;
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
      padding:0;
      margin:0;
  }
  }
  
  /*---------------------------------- iTrac Tool Tabs ----------------------*/
  @media screen and (max-device-width: 1050px) {
      html.ui-mobile body{
          position: fixed;
      }
      .itrac-tooltab{
          right: 5px !important;
      }
      .itrac-tooltab-group {
          right: 5px !important;
      }
  }
  
  .itrac-tooltab{
      display:inline;
      white-space: nowrap;
      position: absolute;
      right: 16px;
      pointer-events:none;
      z-index: 1000;
      height:16.938em;/*height:223px;*/
      min-height:16.938em;
      min-width:2.813em;
  }
  
  .itrac-tooltab-btn{
      width: 2.813em;
      height: 3em;
      font-weight: bold;
      text-align: left;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      background-repeat:no-repeat;
      background-position:bottom;
      background-size:90%;
      pointer-events:all;
      z-index:1050;
  }
  .itrac-tooltab-panel{
      margin-left:-1px;
      display: none;
      pointer-events: all;
      margin-top:5px;
      white-space: nowrap;
      vertical-align: top;
      height: 400px;
      float: right;
      padding: 10px;
      z-index:950;
  }
  .itrac-tooltab-group{
      margin-top:5px;
      display:inline;
      white-space: nowrap;
      position: absolute;
      right: 16px;
      pointer-events:none;
      z-index: 1050;
      height:16.938em;/*height:223px;*/
      min-height:16.938em;
      min-width: 2.813em;
  }
  .itrac-tooltab-group-btn {
      width: 2.813em;
      height: 3em;
      font-weight: bold;
      text-align: left;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      background-repeat:no-repeat;
      background-position:bottom;
      background-size:90%;
      pointer-events:all;
      z-index:1050;
  }
  .itrac-tooltab-group-panel{
      pointer-events: all;
      margin-left:2.813em;
      vertical-align: top;
      min-width:2.813em;
      width:auto;
      display:none;
      /*height:215px !important;
      max-height:215px !important;*/
      height: 16.438em;
      min-height:16.938em;
      max-height:16.438em;
      overflow: auto;
      padding: 5px;
      z-index:1050;
  }
  
  @media all and (min-width: 50em){
  
      .itrac-tooltab{
          max-width:720px;
      }
  
      .itrac-tooltab-group{
          max-width:720px;
      }
  
      .itrac-tooltab-panel{
          max-width: 450px;
          width: 70%;
      }
  
  }
  
  .itrac-tooltab-title {
      text-align:left;
      margin-left:-18px;
      margin-top:-12px;
      font-family: Calibri;
      font-size: 11px;
      font-weight: bold;
      overflow:wrap;
      display: block;
      align:left;
  }
  .itrac-tooltab-title-outline{
  text-align:center;
  line-height:25px;
  color:white;
  font-size:12pt;
  text-shadow: -2px 0 black, 0 2px black,2px 0 black, 0 -2px black;
  }
  
  .tooltab-position-ir{
  top: 103px;
  }
  .tooltab-position-0{
  top: 0px;
  }
  .tooltab-position-1{
  /*top: 93px;*/
  top: 2.8em;
  }
  .tooltab-position-2{
  /*top:153px;*/
  top: 6.2em 
  }
  .tooltab-position-3{
  /*top: 213px;*/
  top: 9.55em;
  }
  .tooltab-position-4{
  /*top: 273px;*/
  top: 13.2em;
  }
  
  .itrac-user-menu{
      z-index: 1250;
  }
  
  @media all and (min-width:55em){
      div.tooltabRelief{
          padding-right:70px;
      }
  }
  
  div.itrac-record-row{
   padding: 3px 0em 0px 0px !important;
   margin: 0px !important;
   border-width: 0 !important;
  }
  li.itrac-record-row {
   margin-top: 0px !important;
   padding-top: 2px !important;
   padding-bottom: 2px !important;
   min-height: 2.1em !important;
   border-bottom-width: 0px !important;
   border-top-width:0px !important;
   font-weight: normal;
  }
  
  li.itrac-record-row .ui-btn-inner a.ui-link-inherit{
    padding-left:15px !important;
    padding-right:5px !important;
  }
  
  @media (min-width: 50em){
   li.itrac-record-row {
   padding-right: 3px !important;
   }
  }
  
  li.itrac-record-row.ui-first-child{
   border-top-width: 1px !important;
  }
  li.itrac-record-row.ui-last-child{
   border-bottom-width: 1px !important;
  }
  
  .itrac-item-label{
  background: transparent !important;
  border: 0px !important;	
  }
  
  div.form-item-container .itrac-item-label{
      font-weight: bold;
      font-size: 10pt;
      opacity: 0.8;
  }
  
  div.form-item-container span.display_only{
      display:block;
      margin-bottom: 1em;
  }
  
  .itrac-record-row .itrac-item-label{
  min-height: 28px !important;
  }
  
  .itrac-record-row .ui-input-search{
  width:auto !important;
  }
  
  .medium-flipswitch  + .ui-slider-switch { 
  width: 8.5em !important;
  }
  
  .large-flipswitch  + .ui-slider-switch {
  width: 9.5em !important;
  }
  
  .validation-msg{
  text-align: left;
  background: transparent !important;
  border: 0px !important;
  }
  
  /* Future Fix for new standards, validation below field...
  .validation-msg{
  text-align:left;
  background: transparent !important;
  border: 0px !important;
  }
  
  .validation-msg .itrac-item-errors li{
  display:block;
  margin-top:0.5em;
  margin-bottom:0.5em;
  font-size: 9pt
  }*/
  
  .pre-text, .post-text{
  font-weight:normal !important;
  align: right;
  }
  
  @media ( min-width: 50em ) {
  .ui-field-contain .pre-text,.ui-field-contain .post-text{
  margin-left:42%;
  }
  }
  
  .pre-text{
  margin-top:1em;
  }
  .post-text{
  margin-bottom:1em;
  }
  
  .itrac-dynamic-help{
  font-weight:normal !important;
  margin-right:4em;
  }
  
  @media ( min-width: 50em ) {
  .date-time-contain[data-role="fieldcontain"] div.ui-input-text{
      width:29% !important;
      margin:0px;
      display:inline-block;
      }
  }
  
  .date-time-contain:not(.ui-field-contain) div.ui-input-text{
      margin: 0px !important;
  }
  
  .itrac-tooltip {
      margin-left:41%;   
  }
  
  .ui-li-icon-sub{
  float: left;
  width:24px;
  margin-right: 10px;
  position: absolute;
  border-width: 0;
  left:28px;
  }
  
  .itrac-icon{
  vertical-align:center;
  width:16px;
  margin-right: 10px;
  border-width: 0;
  }
  .itrac-transparent-label{
  background: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
  opacity: 0.5;
  color: #000000;
  }
  .itrac-label-nobodybg{
  background: transparent !important;
  border: 0px !important;
  }
  .itrac-panel-header{
      padding-left: 5px;
      text-align: left;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      height:2.81em;
      line-height:45px;
      vertical-align: center;
      margin-top:1px;
  }
  
  .itrac-panel-account-list{
      width:17em;
  }
  
  .itrac-portal-header{
      margin:0px;
      margin-top:20px;
      margin-bottom:-40px;
      white-space:nowrap;
      overflow:hidden;
  }
  .itrac-time-entry{
      min-width:20px;
  }
  
  .itrac-search{
      z-index:1300;
  }
  
  .itrac-item-action{
     height: 1.5em;
     width: 1.5em;
     display:block;
     background-size:80% 80%;
     background-repeat:no-repeat;
     background-position:center; 
     background-origin:border-box;
     float:right;
     margin-left:7px;
     top:-1px;
     position:absolute;
     right:16px;	
     cursor: pointer;
  }
  
  .item-help-btn{
   display:block;
   position: absolute;
   right:1.7em;
   height:1.7em !important;
   
  }
  
  .ui-li-divider .item-help-btn{
      display:inline-block;
      position: absolute;
      top: 2px;
      right: 5px;	
  }
  
  .ui-li-divider .item-help-btn a{
          border-radius:2em;
  }
  
  .itrac-nested-collapsible .ui-collapsible-content .ui-listview{
  margin-left:-15px; 
  margin-right:-15px;
  }
  
  .itrac-nested-collapsible .ui-collapsible-content{
  padding-top:0px; 
  padding-bottom:0px;
  margin-top:-5px;
  margin-bottom:-5px;
  width:100%;
  }
  
  .itrac-nested-collapsible{
      list-style-type: none;
  }
  
  .itrac-nested-collapsible > li{
      padding-left: 0px !important;
      margin-left: 0px !important;
      text-indent: 0px !important;
  }
  
  .collapsible-hdr-btn .ui-btn-inner{
      padding-left: 0px !important;
  }
  
  .collapsible-hdr-btn{
      display: inline-block!important;
      position: relative;
      right: 0px;
      top: -2px;
      float: right;
  }
  
  .dynportal-collapsible  .ui-collapsible-heading-toggle p{
    display:inline-block;
    float:left;
    margin:0px;  
  }
  
  .dynportal-collapsible .ui-collapsible-heading-toggle .ui-btn-text p{
    display: inline-block;
    max-width: 90%;
    white-space: pre-wrap;
  }
  
  
  /*------------------------------ Custom Navi Design ------------*/
  .itrac-async-navi li .ui-li-link-alt .ui-btn-inner .ui-btn {
      border-width: 0 !important;
  }
  
  .itrac-async-navi li .ui-li-link-alt .ui-btn-inner .ui-btn, .ui-icon-alt li .ui-li-link-alt .ui-btn-inner .ui-btn .ui-btn-inner .ui-icon {
      box-shadow: 0 0 0 !important;
  }
  
  .itrac-async-navi li.ui-no-icon span.ui-icon {
       display:none;
  }
  
  .itrac-async-navi2 .ui-btn-icon-left:after, .ui-btn-icon-right:after, .ui-btn-icon-top:after, .ui-btn-icon-       bottom:after, .ui-btn-icon-notext:after {
  background-color: transparent !important;
  background-image: none !important;
  }
  
  .itrac-async-navi  span.ui-btn-icon-notext {
  background-image: none !important;
  background-color: transparent !important;
  }
  
  .itrac-async-navi .progress{
    top:45px;
    position:absolute;
    z-index:200;
  }
  
  .itrac-async-nav-panel{
    white-space:nowrap;	
  }
  
  .itrac-async-nav-container{
    display:inline-block;
    width:100%;
    vertical-align:top;
    position:relative; 
  }
  
  .async-nav-animate:not(.animate-paused){
      -webkit-transition: margin-left 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
      transition: margin-left 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  .displace-left{
      margin-left:-100%;
  }
  .displace-right{
      margin-left:100%;
  }
  
  div.fullpage-progress:not(.invisible) {
      -webkit-transition: visibility 0.3s; /* Safari */
      transition: visibility 0.3s;
      -webkit-transition-delay: 2s; /* Safari */
      transition-delay: 2s;
  }
  
  .ui-li-link-alt-left {
  left: 0;
  right: auto;
  border-right-width: 1px;
  border-left-width: 0px;
  }
  .ul-li-has-alt-left {
  padding-right: auto !important;
  padding-left: 48px !important;
  }
  .ui-top-list-item{
  min-height:48px !important;
  }
  
  .ui-top-list-item a {
  font-size:15px;
  line-height:26px;
  font-weight:heavy;
  }
  
  .disabled-li-link{
  cursor:default;
  }
  
  .disabled-li-link .ui-body-c{
  border:none;
  }
  
  .no-padding{
  padding:0!important;
  }
  
  /*----------------------------- APEX Regions ------------------*/
  .itrac-region-title{
      text-align: left;
      margin-bottom: 0px;
      padding: .5em 15px;
      font-size: 14px;
      font-weight: 700;
  }
  
  .itrac-notification{
      z-index:3000;
      position: fixed;
      top: 25px;
      left: 50%;
      max-width:100%;
      width:600px;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
  }
  
  .itrac-notification .ui-bar{
  padding:.4em 10px;
  }
  
  .circle-btn{
  border-radius:50%;
  -webkit-border-radius:50%;
  }
  
  .itrac-notification section{
      border-top-right-radius: 0px;
        border-top-left-radius: 0px;
        vertical-align: middle;
        width:100%;
  }
  
  .itrac-notification section .htmldbUlErr{
      width: 100%;
  }
  
  .itrac-entry-nt{
  position:absolute;
  padding:2em;
  z-index:3000;
  margin-top:13em;
  max-width:900px;
  top:0em;
  }
  
  .itrac-notification .nt-icon{
  float:left;
  border-right:1px solid white;
  }
  
  .itrac-notification .nt-icon svg{
  width:34px;
  height:34px;
  padding-right:10px;
  }
  
  .itrac-notification  .nt-msg{
  top:0;
  display:block;
  position:relative;
  margin-left:55px;
  font-size:12pt;
  font-weight:normal;
  }
  
  .itrac-notification .nt-msg h4{
  font-weight:normal;	
  font-size: 13pt;
  text-shadow: none;
  }
  
  .itrac-notification .nt-msg .htmldbUlErr{
  font-weight: normal;	
  font-size: 12pt;
  text-shadow: none;
  }
  
  .itrac-notification .nt-msg .htmldbUlErr li{
  padding:4px 2px;	
  }
  
  .close-btn{
  position: absolute;
  right:4px !important;
  top:4px !important;
  display:block;
  border:0px;
  background:transparent;
  }
  
  
  .apex-ui-icon-success{
  background-color: transparent;
  background-image: url("../../../apex_ui/apex_ui.png");
  background-position: -84px 0px;
  background-repeat: no-repeat;
  width: 32px;
  height: 32px;
  margin: 8px;
  display: block;
  visibility: visible;
  vertical-align:middle;
  }
  .apex-ui-icon-warning{
  background-color: transparent;
  background-image: url("../../../apex_ui/apex_ui.png");
  background-position: -116px 0px;
  background-repeat: no-repeat;
  width: 32px;
  height: 32px;
  margin: 8px;
  display: block;
  visibility: visible;
  vertical-align: middle;
  }
  
  .notyContainer{
  bottom: 20px; 
  right: 20px; 
  position: fixed; 
  width: 310px;
  height: auto; 
  margin: 0px; 
  padding: 0px; 
  list-style-type: none; 
  z-index: 1360;
  }
  
  
  fieldset.textarea{
  display:inherit!important;
  }
  
      .itrac-help{
          min-width:300px;
          width:700px;
                  max-width:100%;
          float: right;
      }
      .itrac-help-content{
          margin-right: 45px;
          min-height: 25px;
          padding: 1em;
      }
      .itrac-help-icon{
          position: absolute;
          width: 2.81em;
          top: 0;
          right: 0;
      }
      .itrac-help-btn-active{
          width: 2.81em;
          cursor: pointer;
      }
      .itrac-help-btn{
      margin:0px;
      }
      
  
  @media all and (max-width:60em){
   .custom-block{float:none !important; width:100% !important;}
  
  }
  
  /*------------------------------ UI-MINI listview button support --------------------------*/
  li.ui-mini .ui-btn-inner {padding-right:0px !important;}
  
  /*----------------------------- Custom Field Contain ----------------------------*/
  @media all and (max-width: 50em){
      .itrac-item-label{
          margin-right: 4em !important;
      }
  
      .itrac-record .ui-li-icon {
      left: 5px;
      max-height: 16px;
      max-width: 16px;
      top: 0.6em;
      }
      .itrac-record .ui-li-static.ui-li-has-icon {
      min-height: 20px;
      padding-left: 20px;
      }
      .itrac-record li.ui-li.ui-li-divider {
      padding-left: 20px;
      }
      .itrac-displayonly{
      padding-top:5px;
      }
  }
  @media all and (min-width: 50em){
      .trumbowyg-box{
          display: inline-block!important;
          width:57.6%!important;
          margin:auto!important;
      }
      .itrac-item-label {
      box-sizing:border-box;
      -moz-box-sizing:border-box;
      }
      .ui-field-contain label.ui-submit {width: 40%;}
      .ui-field-contain .ui-btn.ui-submit {width: 58%;}
  
      .ui-field-contain .ui-controlgroup-label { width: 40%;}
      .ui-field-contain .ui-controlgroup-controls { width: 58%; }
  
      .ui-field-contain label.ui-select {width: 40%; }
      .ui-field-contain .ui-select { width: 58%;}
  
      .ui-field-contain label.ui-input-text {width: 40%;}
      
      /*.ui-field-contain input.ui-input-text,*/
      .ui-field-contain textarea.ui-input-text,
      .ui-field-contain .ui-input-search,
      .ui-field-contain div.ui-input-text { width: 58%; }
      
  
      .ui-field-contain .ui-rangeslider .ui-rangeslider-sliders,
      .ui-field-contain .ui-rangeslider.ui-mini .ui-rangeslider-sliders {width: 58%;}
      
      .ui-field-contain .ui-slider-input {width: 40px !important;}
  
      .ui-field-contain label.ui-slider { width: 40%; }
  
      .ui-field-contain div.ui-slider { width: 58%; border:0;}
      
      div.itrac-record-row{
          padding: 3px 4em 0px 0px !important;
      }
      
      .hide-label-grid label.itrac-item-label{
          display:none;
      }
  }
  
  /*----------------------------- iTrac Custom Grids - Standard Grid 60%  --------*/
      .itrac-2grid  .ui-block-a, 
      .itrac-2grid  .ui-block-b, 
      .itrac-2grid  .ui-block-c,
      .itrac-2grid  .ui-block-d,
      .itrac-2grid  .ui-block-e { 
          width: 100%; 
          float: none; 
      }
  
  @media all and (min-width: 70em) {
  
      .itrac-2grid .ui-block-a { 
          float: left;
          width: 60%;
      }
      .itrac-2grid  .ui-block-b {
          float: right;
          width: 40%;
      }
      .itrac-2grid .ui-block-c{
          text-align: center;
          clear: both;
          width: 100%;
      }
      .itrac-2grid-rev .ui-block-d,
      .itrac-2grid-rev .ui-block-e { 
          width: 0%; 
          float: none; 
      }
  }
  
      .itrac-2grid-rev.ui-block-a, 
      .itrac-2grid-rev .ui-block-b, 
      .itrac-2grid-rev .ui-block-c,
      .itrac-2grid-rev .ui-block-d,
      .itrac-2grid-rev .ui-block-e { 
          float: none;
          width: 100%;
          text-align:left;
      }
      
  @media all and (min-width: 75em) {
  
      .itrac-2grid-rev .ui-block-a { 
          padding-left:20px;
          padding-top:10px;
          float: right; 
          width: 40%;
      }
      .itrac-2grid-rev .ui-block-b { 
          float: left;
          width: 60%;
      }
      .itrac-2grid-rev.ui-block-c{
          text-align: center;
          clear:both;
          width:100%;
      }
      .itrac-2grid-rev .ui-block-d,
      .itrac-2grid-rev .ui-block-e { 
          width: 0%; 
          float: none; 
      }
  }
  
      .itrac-grid3565 .ui-block-a, 
      .itrac-grid3565 .ui-block-b, 
      .itrac-grid3565 .ui-block-c,
      .itrac-grid3565 .ui-block-d,
      .itrac-grid3565 .ui-block-e { 
          width: 100%; 
          float: none; 
      }
  
  /*----------------------------- iTrac 40em Table Reflow --------------*/
  
  tr.itrac-data-row{
  font-size:10pt !important;
  }
  
  tr.itrac-data-row td{
  height:24px;
  }
  
  @media all and (max-width:60em){
      table.no-reflow td.max15{
          width:15px;
          max-width:15px;
      }
  }
  
  /* Fix for labels on Pagination Row */
  .ui-table-reflow.itrac-reflow-40 td .ui-table-cell-label,
  .ui-table-reflow.itrac-reflow-40 th .ui-table-cell-label { 
          display: none;
  }
  
  /* --- Add labels on data rows only */
  .itrac-reflow-40 .itrac-data-row td .ui-table-cell-label,
  .itrac-reflow-40 .itrac-data-row th .ui-table-cell-label{
    background-color: #eeeeee; /* non-RGBA fallback  */
    background-color: rgba(0,0,0,0.06);
    display: block;
    padding: .4em; 
    min-width: 30%; 
    display: inline-block;
    margin: -.4em 1em -.4em -.4em;
  }
      
  @media ( min-width: 40em ) {
      /* Fixes table rendering when switching between breakpoints in Safari <= 5. See https://github.com/jquery/jquery-mobile/issues/5380 */
      .ui-table-reflow.itrac-reflow-40 {
          display: table;
          width: 100%;
      }
      /* Show the table header rows */ 
      .ui-table-reflow.itrac-reflow-40 td,
      .ui-table-reflow.itrac-reflow-40 th,
      .ui-table-reflow.itrac-reflow-40 tbody th,
      .ui-table-reflow.itrac-reflow-40 tbody td,
      .ui-table-reflow.itrac-reflow-40 thead td,
      .ui-table-reflow.itrac-reflow-40 thead th {
          display: table-cell;
          margin: 0;
      }
      /* Hide the labels in each cell */ 
      .ui-table-reflow.itrac-reflow-40 td .ui-table-cell-label,
      .ui-table-reflow.itrac-reflow-40 th .ui-table-cell-label { 
          display: none;
      }
  }
  /* Hack to make IE9 and WP7.5 treat cells like block level elements, scoped to ui-responsive class */ 
  /* Applied in a max-width media query up to the table layout breakpoint so we don't need to negate this*/ 
  @media ( max-width: 40em ) {
      .ui-table-reflow.itrac-reflow-40 td,
      .ui-table-reflow.itrac-reflow-40 th {
          width: 100%;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          float: left;
          clear: left;
      }
  }
  
  /*----------------------------- iTrac 50em Table Reflow --------------*/
  
  /* Fix for labels on Pagination Row */
  .ui-table-reflow.itrac-reflow-50 td .ui-table-cell-label,
  .ui-table-reflow.itrac-reflow-50 th .ui-table-cell-label { 
          display: none;
  }
  
  /* --- Add labels on data rows only */
  .itrac-reflow-50 .itrac-data-row td .ui-table-cell-label,
  .itrac-reflow-50 .itrac-data-row th .ui-table-cell-label{
    background-color: #eeeeee; /* non-RGBA fallback  */
    background-color: rgba(0,0,0,0.06);
    display: block;
    padding: .4em; 
    min-width: 30%; 
    display: inline-block;
    margin: -.4em 1em -.4em -.4em;
  }
  
  @media ( min-width: 50em ) {
      /* Fixes table rendering when switching between breakpoints in Safari <= 5. See https://github.com/jquery/jquery-mobile/issues/5380 */
      .ui-table-reflow.itrac-reflow-50 {
          display: table;
          width: 100%;
      }
      /* Show the table header rows */ 
      .ui-table-reflow.itrac-reflow-50 td,
      .ui-table-reflow.itrac-reflow-50 th,
      .ui-table-reflow.itrac-reflow-50 tbody th,
      .ui-table-reflow.itrac-reflow-50 tbody td,
      .ui-table-reflow.itrac-reflow-50 thead td,
      .ui-table-reflow.itrac-reflow-50 thead th {
          display: table-cell;
          margin: 0;
      }
      /* Hide the labels in each cell */ 
      .ui-table-reflow.itrac-reflow-50 td .ui-table-cell-label,
      .ui-table-reflow.itrac-reflow-50 th .ui-table-cell-label { 
          display: none;
      }
  }
  /* Hack to make IE9 and WP7.5 treat cells like block level elements, scoped to ui-responsive class */ 
  /* Applied in a max-width media query up to the table layout breakpoint so we don't need to negate this*/ 
  @media ( max-width: 50em ) {
      .ui-table-reflow.itrac-reflow-50 td,
      .ui-table-reflow.itrac-reflow-50 th {
          width: 100%;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          float: left;
          clear: left;
      }
  }
  
  /*----------------------------- iTrac 60em Table Reflow --------------*/
  
  /* Fix for labels on Pagination Row */
  .ui-table-reflow.itrac-reflow-60 td .ui-table-cell-label,
  .ui-table-reflow.itrac-reflow-60 th .ui-table-cell-label { 
          display: none;
  }
  
  /* --- Add labels on data rows only */
  .itrac-reflow-60 .itrac-data-row td .ui-table-cell-label,
  .itrac-reflow-60 .itrac-data-row th .ui-table-cell-label{
    background-color: #eeeeee; /* non-RGBA fallback  */
    background-color: rgba(0,0,0,0.06);
    display: block;
    padding: .4em; 
    vertical-align:top;
    min-width: 30%; 
    display: inline-block;
    margin: -.4em 1em -.4em -.4em;
  }
  
  @media ( min-width: 60em ) {
      /* Fixes table rendering when switching between breakpoints in Safari <= 5. See https://github.com/jquery/jquery-mobile/issues/5380 */
      .ui-table-reflow.itrac-reflow-60 {
          display: table;
          width: 100%;
      }
      /* Show the table header rows */ 
      .ui-table-reflow.itrac-reflow-60 td,
      .ui-table-reflow.itrac-reflow-60 th,
      .ui-table-reflow.itrac-reflow-60 tbody th,
      .ui-table-reflow.itrac-reflow-60 tbody td,
      .ui-table-reflow.itrac-reflow-60 thead td,
      .ui-table-reflow.itrac-reflow-60 thead th {
          display: table-cell;
          margin: 0;
      }
      /* Hide the labels in each cell */ 
      .ui-table-reflow.itrac-reflow-60 td .ui-table-cell-label,
      .ui-table-reflow.itrac-reflow-60 th .ui-table-cell-label { 
          display: none;
      }
  }
  /* Hack to make IE9 and WP7.5 treat cells like block level elements, scoped to ui-responsive class */ 
  /* Applied in a max-width media query up to the table layout breakpoint so we don't need to negate this*/ 
  @media ( max-width: 60em ) {
      .ui-table-reflow.itrac-reflow-60 td,
      .ui-table-reflow.itrac-reflow-60 th {
          width: 100%;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          float: left;
          clear: left;
      }
      
      .ui-table-reflow .itrac-data-row{
          position: relative;
          display:    block;
      }
      
      .ui-table-reflow tr.itrac-data-row div.ui-input-text,
      .ui-table-reflow tr.itrac-data-row div.ui-select
      {
           display: inline-block;
           min-width: 40%;
           vertical-align: middle;
      }
  
      .ui-table-reflow tr.itrac-data-row fieldset{
          display: inline-block;
          min-width: 40%;
          vertical-align: middle;
          margin-bottom: 1em;
      }
  
      .ui-table-reflow tr.itrac-data-row fieldset div.ui-input-text,
      .ui-table-reflow tr.itrac-data-row fieldset div.ui-select
      {
           min-width: 40%;
           vertical-align: middle;
           display: block;
      }
      
      .ui-table-reflow tr.itrac-data-row .ui-btn[data-icon="delete"]{
          position: absolute;
          z-index: 50;
          display: block;
          right: 8px;
          top: 0px;
      }
  
      .ui-table-reflow tr.itrac-data-row td{
          height: auto!important;
      }
  
      .ui-table-cell-label{
          height: 32px;
      }
  
  }
  
  
  
  
  /*----------------------------- iTrac 75em Table Reflow --------------*/
  
  /* Fix for labels on Pagination Row */
  .ui-table-reflow.itrac-reflow-75 td .ui-table-cell-label,
  .ui-table-reflow.itrac-reflow-75 th .ui-table-cell-label { 
          display: none;
  }
  
  /* --- Add labels on data rows only */
  .itrac-reflow-75 .itrac-data-row td .ui-table-cell-label,
  .itrac-reflow-75 .itrac-data-row th .ui-table-cell-label{
    background-color: #eeeeee; /* non-RGBA fallback  */
    background-color: rgba(0,0,0,0.06);
    display: block;
    padding: .4em; 
    min-width: 30%; 
    display: inline-block;
    margin: -.4em 1em -.4em -.4em;
  }
  
  @media ( min-width: 75em ) {
      /* Fixes table rendering when switching between breakpoints in Safari <= 5. See https://github.com/jquery/jquery-mobile/issues/5380 */
      .ui-table-reflow.itrac-reflow-75 {
          display: table;
          width: 100%;
      }
      /* Show the table header rows */ 
      .ui-table-reflow.itrac-reflow-75 td,
      .ui-table-reflow.itrac-reflow-75 th,
      .ui-table-reflow.itrac-reflow-75 tbody th,
      .ui-table-reflow.itrac-reflow-75 tbody td,
      .ui-table-reflow.itrac-reflow-75 thead td,
      .ui-table-reflow.itrac-reflow-75 thead th {
          display: table-cell;
          margin: 0;
      }
      /* Hide the labels in each cell */ 
      .ui-table-reflow.itrac-reflow-75 td .ui-table-cell-label,
      .ui-table-reflow.itrac-reflow-75 th .ui-table-cell-label { 
          display: none;
      }
  }
  /* Hack to make IE9 and WP7.5 treat cells like block level elements, scoped to ui-responsive class */ 
  /* Applied in a max-width media query up to the table layout breakpoint so we don't need to negate this*/ 
  @media ( max-width: 75em ) {
      .ui-table-reflow.itrac-reflow-75 td,
      .ui-table-reflow.itrac-reflow-75 th {
          width: 100%;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          float: left;
          clear: left;
      }
  }
  
  
  /*----------------------------- iTrac 100em Table Reflow --------------*/
  
  /* Fix for labels on Pagination Row */
  .ui-table-reflow.itrac-reflow-200 td .ui-table-cell-label,
  .ui-table-reflow.itrac-reflow-200 th .ui-table-cell-label { 
          display: none;
  }
  
  /* --- Add labels on data rows only */
  .itrac-reflow-200 .itrac-data-row td .ui-table-cell-label,
  .itrac-reflow-200 .itrac-data-row th .ui-table-cell-label{
    background-color: #eeeeee; /* non-RGBA fallback  */
    background-color: rgba(0,0,0,0.06);
    display: block;
    padding: .4em; 
    min-width: 30%; 
    display: inline-block;
    margin: -.4em 1em -.4em -.4em;
  }
  
  @media ( min-width: 200em ) {
      /* Fixes table rendering when switching between breakpoints in Safari <= 5. See https://github.com/jquery/jquery-mobile/issues/5380 */
      .ui-table-reflow.itrac-reflow-200 {
          display: table;
          width: 100%;
      }
      /* Show the table header rows */ 
      .ui-table-reflow.itrac-reflow-200 td,
      .ui-table-reflow.itrac-reflow-200 th,
      .ui-table-reflow.itrac-reflow-200 tbody th,
      .ui-table-reflow.itrac-reflow-200 tbody td,
      .ui-table-reflow.itrac-reflow-200 thead td,
      .ui-table-reflow.itrac-reflow-200 thead th {
          display: table-cell;
          margin: 0;
      }
      /* Hide the labels in each cell */ 
      .ui-table-reflow.itrac-reflow-200 td .ui-table-cell-label,
      .ui-table-reflow.itrac-reflow-200 th .ui-table-cell-label { 
          display: none;
      }
  }
  /* Hack to make IE9 and WP7.5 treat cells like block level elements, scoped to ui-responsive class */ 
  /* Applied in a max-width media query up to the table layout breakpoint so we don't need to negate this*/ 
  @media ( max-width: 200em ) {
      .ui-table-reflow.itrac-reflow-200 td,
      .ui-table-reflow.itrac-reflow-200 th {
          width: 100%;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          float: left;
          clear: left;
      }
  }
  
  .ui-navbar .ui-btn-inner{ 
      /*white-space: normal !important; */
  }
  
  
  .ui-table, .itrac-data-row, .itrac-data-row th{
  overflow:hidden;
  table-layout: fixed;
  text-overflow:ellipsis;
  }
  
  .itrac-data-row td{
  overflow:hidden;
  table-layout: fixed;
  }
  
  
  
  /* ---------------------------- Custom Panel Response -----------*/
  /* wrap on wide viewports once open */
  @media screen and (min-width:115em){ /* Large Screen Viewport for Panel (roughly 1080p)*/
  
  /* panel */
  .ui-panel {
      width: 25em;
      min-height: 100%;
      max-height: none;
      border-width: 0;
      position: absolute;
      top: 0;
      height: auto;
      display: block;
  }
  
  .itrac-panel-account-list{
      width:25em;
  }
  
  .ui-panel-position-left {
      left: -25em;
  }
  /* animated: panel left (for overlay and push) */
  .ui-panel-animate.ui-panel-position-left.ui-panel-display-overlay,
  .ui-panel-animate.ui-panel-position-left.ui-panel-display-push {
      left: 0;
      -webkit-transform: translate3d(-25em,0,0);
      -moz-transform: translate3d(-25em,0,0);
      transform: translate3d(-25em,0,0);
  }
  /* positioning: content wrap, fixed toolbars and dismiss */
  /* panel left open */
  .ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open,
  .ui-panel-content-wrap-position-left.ui-panel-content-wrap-open,
  .ui-panel-dismiss-position-left.ui-panel-dismiss-open {
      left: 25em;
      right: -25em;
  }
  /* animated: panel left open (for reveal and push) */
  .ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-reveal,
  .ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-push,
  .ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal,
  .ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push {
      left: 0;
      right: 0;
      -webkit-transform: translate3d(25em,0,0);
      -moz-transform: translate3d(25em,0,0);
      transform: translate3d(25em,0,0);
  }
  /* panel right open */
  .ui-panel-content-fixed-toolbar-position-right.ui-panel-content-fixed-toolbar-open,
  .ui-panel-content-wrap-position-right.ui-panel-content-wrap-open,
  .ui-panel-dismiss-position-right.ui-panel-dismiss-open {
      left: -25em;
      right: 25em;
  }
  /* animated: panel right open (for reveal and push) */
  .ui-panel-animate.ui-panel-content-fixed-toolbar-position-right.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-reveal, 
  .ui-panel-animate.ui-panel-content-fixed-toolbar-position-right.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-push,
  .ui-panel-animate.ui-panel-content-wrap-position-right.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal, 
  .ui-panel-animate.ui-panel-content-wrap-position-right.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push {
      left: 0;
      right: 0;
      -webkit-transform: translate3d(-25em,0,0);
      -moz-transform: translate3d(-25em,0,0);
      transform: translate3d(-25em,0,0);
  }
  
  /* panel right */
  .ui-panel-position-right {
      right: -25em;
  }
  /* animated: panel right (for overlay and push) */
  .ui-panel-animate.ui-panel-position-right.ui-panel-display-overlay,
  .ui-panel-animate.ui-panel-position-right.ui-panel-display-push {
      right: 0;
      -webkit-transform: translate3d(25em,0,0);
      -moz-transform: translate3d(25em,0,0);
      transform: translate3d(25em,0,0);
  }
  
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-push.ui-panel-content-fixed-toolbar-position-left,
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-reveal.ui-panel-content-fixed-toolbar-position-left,
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-push.ui-panel-content-wrap-position-left,
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-reveal.ui-panel-content-wrap-position-left {
          margin-right: 25em;
      }
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-push.ui-panel-content-fixed-toolbar-position-right,
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-reveal.ui-panel-content-fixed-toolbar-position-right,
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-push.ui-panel-content-wrap-position-right,
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-reveal.ui-panel-content-wrap-position-right {
          margin-left: 25em;
      }
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-push,
      .ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-reveal {
          width: auto;	
      }
      .ui-responsive-panel .ui-panel-dismiss-display-push {
          display: none;
      }	
      
      
  }
  
  /*----------------------------- iTrac 2 Scrollbar styles --------*/
  @media screen{
  /*Hides browser scroll and fixes padding*/
  .ui-panel-inner {
      padding:0px !important;
      overflow: hidden;
  }
  .ui-listview-filter {
        margin: 0px !important;	
  }
  
  .ui-collapsible-content{
      padding: 0px;
  }
  
  .filter-wrapper {
    padding-top: 47px;
  }
  
  .filter-wrapper form{
     min-width: 17em;
     position: fixed;
     top: 0px;
     left: 0px;
     z-index: 1000;
  }
  
  .panel-header {
     min-width: 17em;
     position: fixed;
     top: 0px;
     left: 0px;
     z-index: 1000;
  }
  
  html, body {
      width: 100%;
      height: 100%;
      overflow: hidden;
  } 
  
  .ui-page {
      overflow:hidden !important;
      -webkit-backface-visibility: hidden;
  }
  div.ir-page div.ui-content[data-role="content"]{
      overflow: visible;
      max-height: calc(100vh - 45px);
  }
  div.ui-content[data-role="content"]{
      overflow-x: visible;
      min-height: calc(99.8vh - 45px);
  }
  div.ui-popup .ui-content[data-role="content"]{
      max-height:100vh;
      height:auto;
      min-height:100px;
  }
  .ui-mobile .ui-page-active{
      overflow:hidden;
  }
  .trumbowyg-textarea{
      width:100%!important;
  }
  .scroller{
      -webkit-overflow-scrolling: touch !important;
      -webkit-transform: translateZ(0) !important;
      outline:0;
      min-height:100%;
      min-width: 100%;
      width: auto;
      display:inline-block;
  }
  .itrac-popup-page .scroller{
      display:block;
  }
  
  .viewport{
      margin:-15px;
      position:relative;
      overflow-y:auto;
      overflow-x:auto;
      height: 100%;
      height: -webkit-calc(100vh - 47px);
      height: -moz-calc(100vh - 47px);
      height: calc(100vh - 47px);
  }
  .viewport-ir{
     /* overflow:hidden;*/
      margin-top:0px;
      margin-left:0px;
      margin-right:0px;
  }
  .viewport-ir-tab{
     /* overflow:hidden;*/
      margin-top:0px;
      margin-left:0px;
      margin-right:1.8em;
  }
  
  .itrac-panel{
  position:fixed;
  }
  }
  
  .ir-frame-container{
      overflow: auto!important; 
      -webkit-overflow-scrolling: touch!important;
  }
  
  .ir-frame-container iframe{
  width: 100%; 
  display: block; 
  overflow: scroll; 
  -webkit-overflow-scrolling: touch!important;	
  height: 100%;
  height: -webkit-calc(100vh - 50px);
  height: -moz-calc(100vh - 50px);
  height: calc(100vh - 50px);
  }
  
  .center-div-horiz{
      position:relative;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
  }
  
  .center-div-vert{
      position:relative;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -moz-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      transform: translateY(-50%);
  }
  
  /*----------------------------- iTrac 2 General Styles --------*/
  .itrac-content{
      padding:15px;
      min-width:310px;
  }
  .itrac-content-tab{
      padding-top:15px;
      padding-bottom:15px;
      padding-left:15px;
      padding-right:15px;
      min-width:310px;
  }
  .title-contain{
      padding-top:5px;
      padding-left:15px;
      padding-right:15px;
  }
  .itrac-splash{
  background-repeat: no-repeat; 
  background-position: center;
  background-size:contain;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  height: 180px;
  }
  
  @media all and (min-width: 768px){
      .itrac-splash{
          margin-top:5px;
          height:200px;
      }
  }
  @media all and (min-width: 1020px){ 
      .itrac-splash{
          margin-top:10px;
          height:250px;
      }
  }
  @media all and (min-width: 1620px){ 
      .itrac-splash{
          margin-top:30px;
          height:370px;
      }
  }
  .itrac-splash-end{
  background-repeat: no-repeat; 
  background-position: center;
  background-size:contain;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  height: 180px;
  }
  
  @media all and (min-width: 768px){
      .itrac-splash-end{
          margin-top:5px;
          height:400px;
      }
  }
  @media all and (min-width: 1020px){ 
      .itrac-splash-end{
          margin-top:10px;
          height:550px;
      }
  }
  @media all and (min-width: 1620px){ 
      .itrac-splash-end{
          margin-top:30px;
          height:600px;
      }
  }
  
  .ui-slider-switch{
  width : 7em !important;
  }
  
  .block-ui{
      display: block;
      cursor: wait;
      position: fixed;
      top: 0px;
      left: 0px;  
      width: 100%;
      height: 100%;
      z-index: 9000; 
      background-color: black;
      opacity: 0.4;
  }
  .block-ui-clear{
      display: none;
      cursor: wait;
      position: fixed;
      top: 0px;
      left: 0px;  
      width: 100%;
      height: 100%;
      z-index: 9000; 
      background-color: none;
  }
  .block-ui-tab{
      display: none;
      position: fixed;
      pointer-events:all;
      top: 0px;
      left: 0px;  
      width: 100%;
      height: 100%;
      z-index: 1005;
      background-color: black;
      opacity: 0.3;
  }
  
  .mainFrame iframe {
      border: none;
      margin-left: -15px;
      margin-top: -15px;
      top: 0;
      left: 0;
      width: 100%;
  }
  
  iframe {
      border: none;
  }
  
  
  .ui-table .ui-mini .ui-btn-inner{
  margin: 0px;
  line-height: 1.2em;
  vertical-align: center;
  }
  
  .view_btn{
      background-repeat: no-repeat; 
      background-position: center;
      background-size:contain;
      background-image:url(icons/item_btn_drilldown.png);
      width: 32px;
      height: 32px;
      margin: 0px;
      cursor: pointer;
      display: inline-block;
  }
  
  .ui-table td{
  padding-top:0.2em; 
  padding-bottom:0.2em}
  
  .itrac-address-complete .ui-li-aside{
   padding-right: 2em;
  }
  
  /*Gridlist*/
  
  .grid-list .ui-li-aside {
      display: none !important;
  }
  /* First breakpoint is 75em. 3 column layout. Tiles 250x250 pixels at the breakpoint. */
  @media all and (min-width: 1024px){
  
      .grid-list .ui-li-aside {
      display: none !important;
       }
      .grid-list .ui-content {
          padding: 9px;
      }
      .grid-list .ui-listview .ui-li.ui-btn {
          float:left;
          width: 30.933%; /* 33.3333% incl. 2 x 1.2% margin */
          max-width:200px;
          height: 200px;
          margin: 9px 1.2%;
          border-width: 0; /* The 1px border would break the layout so we set it on .ui-btn-inner instead. */
      }
      /* If you don't want a border at all, just set "border: none;" here to negate the semi white top border */
      .grid-list .ui-listview .ui-li.ui-btn-inner {
          border: inherit;
          border-width: 1px;
          margin: -1px;
      }
      .grid-list .ui-listview .ui-btn-inner,
      .grid-list .ui-listview .ui-btn-text,
      .grid-list .ui-listview .ui-link-inherit,
      .grid-list .ui-listview .ui-li-thumb {
          width: 100%;
          height: 100%;
          display: block;
          overflow: hidden;
      }
      .grid-list .ui-listview .ui-link-inherit {
          padding: 0 !important;
          position: relative;
      }
      /* Inherit the border-radius from the UL that has class .ui-corner-all in case of an inset listview. */
      .grid-list .ui-listview .ui-li,
      .grid-list .ui-listview .ui-btn-text,
      .grid-list .ui-listview .ui-link-inherit,
      .grid-list .ui-listview .ui-li-thumb {
          -webkit-border-radius: inherit;
          border-radius: inherit;
      }
      .grid-list .ui-listview .ui-li-thumb {
          height: auto; /* To keep aspect ratio. */
          max-width: 60%;
          max-height: none;
          margin: 0;
          left: 20%;
          right: 20%;
          top:5%;
          z-index: -1;
      }
      /* Hide the icon */
      .grid-list .ui-listview .ui-icon {
          display: none;
      }
      /* Make text wrap. */
      .grid-list .ui-listview .ui-li-heading,
      .grid-list .ui-listview .ui-li-desc {
          white-space: normal;
          overflow: visible;
          position: absolute;
          color:#dadada;
          text-shadow: 0 /*{a-bar-shadow-x}*/ 1px /*{a-bar-shadow-y}*/ 0 /*{a-bar-shadow-radius}*/ #3b3b3b /*{a-bar-shadow-color}*/;
          left: 0;
          right: 0;
      }
      /* Text position */
      .grid-list .ui-listview .ui-li-heading {
          margin: 0;
          padding: 20px;
          bottom: 50%;
      }
      .grid-list .ui-listview .ui-li-desc {
          margin: 0;
          padding: 0 20px;
          min-height: 50%;
          bottom: 0;
          line-height: 1.5;
      }
      /* Semi transparent background and different position if there is a thumb */
      .grid-list .ui-listview .ui-li-has-thumb .ui-li-heading,
      .grid-list .ui-listview .ui-li-has-thumb .ui-li-desc {
          background: #111;
          background: rgba(0,0,0,.8);
          -webkit-background-clip: padding;
          background-clip: padding-box;
      }
      .grid-list .ui-listview .ui-li-has-thumb .ui-li-heading {
          padding: 10px;
          bottom: 20%;
      }
      .grid-list .ui-listview .ui-li-has-thumb .ui-li-desc {
          padding: 0 10px;
          min-height: 45%;
          overflow: hidden !important;
          max-height: 8em;
          -webkit-border-bottom-left-radius: inherit;
          border-bottom-left-radius: inherit;
          -webkit-border-bottom-right-radius: inherit;
          border-bottom-right-radius: inherit;
      }
      /* ui-li-aside has class .ui-li-desc as well so we have to override some things. */
      .grid-list .ui-listview .ui-li-desc.ui-li-aside {
          padding: 2px 10px;
          width: auto;
          min-height: 0;
          top: 0;
          left: auto;
          bottom: auto;
  
          /* Custom styling. */
          color: #000000;
          background: #b88a00;
          -webkit-border-top-right-radius: inherit;
          border-top-right-radius: inherit;
          -webkit-border-bottom-left-radius: inherit;
          border-bottom-left-radius: inherit;
          -webkit-border-bottom-right-radius: 0;
          border-bottom-right-radius: 0;
      }
       /* If you want to add shadow, don't kill the focus style. 
      .grid-list .ui-listview .ui-btn:not(.ui-focus) {
          -moz-box-shadow: 0px 0px 9px #111;
          -webkit-box-shadow: 0px 0px 9px #111;
          box-shadow: 0px 0px 9px #111;
      }*/
      /* Animate focus and hover style, and resizing. */
      .grid-list .ui-listview .ui-btn {
          -webkit-transition: all 500ms ease;
          -moz-transition: all 500ms ease;
          -o-transition: all 500ms ease;
          -ms-transition: all 500ms ease;
          transition: all 500ms ease;
      }
  }
  
  /*Gridlist Image*/
  .grid-list-img .ui-li-aside {
      display: none !important;
  }
  /* First breakpoint is 768px. 3 column layout. Tiles 250x250 pixels at the breakpoint. */
  @media all and (min-width: 768px){
          
      .grid-list-img .ui-content {
          padding: 9px;
      }
      .grid-list-img .ui-listview .ui-li.ui-btn {
          float: left;
          width: 30.9333%; /* 33.3333% incl. 2 x 1.2% margin */
          height: 200px;
          margin: 9px 1.2%;
          border-width: 0; /* The 1px border would break the layout so we set it on .ui-btn-inner instead. */
      }
      /* If you don't want a border at all, just set "border: none;" here to negate the semi white top border */
      .grid-list-img .ui-listview .ui-li.ui-btn-inner {
          border: inherit;
          border-width: 1px;
          margin: -1px;
      }
      .grid-list-img .ui-listview .ui-btn-inner,
      .grid-list-img .ui-listview .ui-btn-text,
      .grid-list-img .ui-listview .ui-link-inherit,
      .grid-list-img .ui-listview .ui-li-thumb {
          height:100%;
          width: 100%;
          display: block;
          overflow: hidden;
      }
      .grid-list-img .ui-listview .ui-link-inherit {
          padding: 0 !important;
          position: relative;
      }
      /* Inherit the border-radius from the UL that has class .ui-corner-all in case of an inset listview. */
      .grid-list-img .ui-listview .ui-li,
      .grid-list-img .ui-listview .ui-btn-text,
      .grid-list-img .ui-listview .ui-link-inherit,
      .grid-list-img .ui-listview .ui-li-thumb {
          -webkit-border-radius: inherit;
          border-radius: inherit;
      }
      .grid-list-img .ui-listview .ui-li-thumb {
          height: auto; /* To keep aspect ratio. */
          max-height:none;
          max-width: 100%;
          position:absolute;
          top:0;
          bottom:0;
          margin:auto;
          z-index: -1;
      }
      
      /* Hide the icon */
      .grid-list-img .ui-listview .ui-icon {
          display: none;
      }
      /* Make text wrap. */
      .grid-list-img .ui-listview .ui-li-heading,
      .grid-list-img .ui-listview .ui-li-desc {
          white-space: normal;
          overflow: hidden;
          text-overflow:ellipsis;
          max-height:5em;
          position: absolute;
          color:#dadada;
          text-shadow: 0 /*{a-bar-shadow-x}*/ 1px /*{a-bar-shadow-y}*/ 0 /*{a-bar-shadow-radius}*/ #3b3b3b /*{a-bar-shadow-color}*/;
          left: 0;
          right: 0;
          display:none;
      }
      /* Text position */
      .grid-list-img .ui-listview .ui-li-heading {
          margin: 0;
          padding: 20px;
          bottom: 50%;
      }
      .grid-list-img .ui-listview .ui-li-desc {
          margin: 0;
          padding: 0 20px;
          min-height: 50%;
          bottom: 0;
          line-height: 1.5;
      }
      /* Semi transparent background and different position if there is a thumb */
      .grid-list-img .ui-listview .ui-li-has-thumb .ui-li-heading,
      .grid-list-img .ui-listview .ui-li-has-thumb .ui-li-desc {
          background: #111;
          background: rgba(0,0,0,.8);
          -webkit-background-clip: padding;
          background-clip: padding-box;
      }
      .grid-list-img .ui-listview .ui-li-has-thumb .ui-li-heading {
          padding: 10px;
          bottom: 20%;
      }
      .grid-list-img .ui-listview .ui-li-has-thumb .ui-li-desc {
          padding: 0 10px;
          min-height: 40%;
          overflow: hidden !important;
          max-height:2.5em;
          height: 2.5em !important;
          -webkit-border-bottom-left-radius: inherit;
          border-bottom-left-radius: inherit;
          -webkit-border-bottom-right-radius: inherit;
          border-bottom-right-radius: inherit;
      }
      /* ui-li-aside has class .ui-li-desc as well so we have to override some things. */
      .grid-list-img .ui-listview .ui-li-desc.ui-li-aside {
          padding: 2px 10px;
          width: auto;
          min-height: 0;
          top: 0;
          left: auto;
          bottom: auto;
  
          /* Custom styling. */
          color: #000000;
          background: #b88a00;
          -webkit-border-top-right-radius: inherit;
          border-top-right-radius: inherit;
          -webkit-border-bottom-left-radius: inherit;
          border-bottom-left-radius: inherit;
          -webkit-border-bottom-right-radius: 0;
          border-bottom-right-radius: 0;
      }
      /* If you want to add shadow, don't kill the focus style. 
      .grid-list-img .ui-listview .ui-btn:not(.ui-focus) {
          -moz-box-shadow: 0px 0px 9px #111;
          -webkit-box-shadow: 0px 0px 9px #111;
          box-shadow: 0px 0px 9px #111;
      }*/
      /* Animate focus and hover style, and resizing. */
      .grid-list-img .ui-listview .ui-btn {
          -webkit-transition: all 500ms ease;
          -moz-transition: all 500ms ease;
          -o-transition: all 500ms ease;
          -ms-transition: all 500ms ease;
          transition: all 500ms ease;
      }
  }
  /* Second breakpoint. 4 column layout. Tiles will be 250x250 pixels again at the breakpoint. */
  @media all and (min-width: 1000px){
      .grid-list-img .ui-content {
          padding: 10px;
      }
      /* Set a max-width for the last breakpoint to prevent too much stretching on large screens.
      By setting the max-width equal to the breakpoint width minus padding we keep square tiles. */
      .grid-list-img .ui-listview {
          max-width: 1000px;
          margin: 0 auto;
      }
      /* Because of the 1000px max-width the width will always be 230px (and margin left/right 10px),
      but we stick to percentage values for demo purposes. */
      .grid-list-img .ui-listview .ui-li.ui-btn {
          width: 23%;
            height: 200px;
          margin: 10px 1%;
      }
  }
  
  img { -ms-interpolation-mode: bicubic; }
  
  .grid-list div.ui-li.focus-within{
      outline: 1px solid;
  }
  
  
  /* Reveal menu shadow on top of the list items */
  .ui-panel-display-reveal {
         -webkit-box-shadow: none;
         -moz-box-shadow: none;
         box-shadow: none;
  }
  
  
  .ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open,
  .ui-panel-content-wrap-position-left.ui-panel-content-wrap-open {
         -webkit-box-shadow: -5px 0 5px rgba(0,0,0,.10);
         -moz-box-shadow: -5px 0 5px rgba(0,0,0,.10);
         box-shadow: -5px 0 5px rgba(0,0,0,.10);
  }
  
  /*!
   * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
   * Copyright 2015 Daniel Cardoso <@DanielCardoso>
   * Licensed under MIT
   */
   
  .point-loader,
  .point-loader > div {
      position: relative;
      -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
              box-sizing: border-box;
  }
  .point-loader {
      display: block;
      font-size: 0;
      color: #606060;
      margin:auto;
  }
  
  .point-loader.white{
      color: #000;
  }
  
  .point-loader > div {
      display: inline-block;
      float: none;
      background-color: currentColor;
      border: 0 solid currentColor;
  }
  .point-loader {
  
      width: 50px;
      height: 16px;
  }
  .point-loader > div:nth-child(1) {
      -webkit-animation-delay: -200ms;
         -moz-animation-delay: -200ms;
           -o-animation-delay: -200ms;
              animation-delay: -200ms;
  }
  .point-loader > div:nth-child(2) {
      -webkit-animation-delay: -100ms;
         -moz-animation-delay: -100ms;
           -o-animation-delay: -100ms;
              animation-delay: -100ms;
  }
  .point-loader > div:nth-child(3) {
      -webkit-animation-delay: 0ms;
         -moz-animation-delay: 0ms;
           -o-animation-delay: 0ms;
              animation-delay: 0ms;
  }
  
  
  .point-loader > div {
      width: 8px;
      height: 8px;
      margin: 4px;
      border-radius: 100%;
      -webkit-animation: ball-pulse 1s ease infinite;
         -moz-animation: ball-pulse 1s ease infinite;
           -o-animation: ball-pulse 1s ease infinite;
              animation: ball-pulse 1s ease infinite;
  }
  .point-loader.la-sm {
      width: 26px;
      height: 8px;
  }
  .point-loader.la-sm > div {
      width: 4px;
      height: 4px;
      margin: 2px;
  }
  .point-loader.la-2x {
      width: 108px;
      height: 36px;
  }
  .point-loader.la-2x > div {
      width: 20px;
      height: 20px;
      margin: 8px;
  }
  .point-loader.la-3x {
      width: 162px;
      height: 54px;
  }
  .point-loader.la-3x > div {
      width: 30px;
      height: 30px;
      margin: 12px;
  }
  
  
  
  .lds-ripple {
    display: inline-block;
    position: relative;
    width: 128px;
    height: 128px;
  }
  .lds-ripple div {
    position: absolute;
    border: 4px solid #26a69a;
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1.6s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  }
  .lds-ripple div:nth-child(2) {
    animation-delay: -0.5s;
  }
  @keyframes lds-ripple {
    0% {
      top: 45px;
      left: 45px;
      width: 0;
      height: 0;
      opacity: 1;
    }
    100% {
      top: -1px;
      left: -1px;
      width: 92px;
      height: 92px;
      opacity: 0;
    }
  }
  
  .lds-ring {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
  }
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 56px;
    height: 56px;
    margin: 6px;
    border: 4px solid #26a69a;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #26a69a transparent transparent transparent;
  }
  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }
  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }
  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }
  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  
  
  
  /*
   * Animation
   */
  @-webkit-keyframes ball-pulse {
      0%,
      60%,
      100% {
          opacity: 1;
          -webkit-transform: scale(1);
                  transform: scale(1);
      }
      30% {
          opacity: .1;
          -webkit-transform: scale(.01);
                  transform: scale(.01);
      }
  }
  @-moz-keyframes ball-pulse {
      0%,
      60%,
      100% {
          opacity: 1;
          -moz-transform: scale(1);
               transform: scale(1);
      }
      30% {
          opacity: .1;
          -moz-transform: scale(.01);
               transform: scale(.01);
      }
  }
  @-o-keyframes ball-pulse {
      0%,
      60%,
      100% {
          opacity: 1;
          -o-transform: scale(1);
             transform: scale(1);
      }
      30% {
          opacity: .1;
          -o-transform: scale(.01);
             transform: scale(.01);
      }
  }
  @keyframes ball-pulse {
      0%,
      60%,
      100% {
          opacity: 1;
          -webkit-transform: scale(1);
             -moz-transform: scale(1);
               -o-transform: scale(1);
                  transform: scale(1);
      }
      30% {
          opacity: .1;
          -webkit-transform: scale(.01);
             -moz-transform: scale(.01);
               -o-transform: scale(.01);
                  transform: scale(.01);
      }
  }
  
  /*Block Rect Loader */
  .spinner {
    margin: 10px auto;
    width: 50px;
    height: 40px;
    text-align: center;
    font-size: 10px;
  }
  
  .spinner > div {
    background-color: #000000;
    height: 99%;
    width: 5px;
    margin:1px;
    display: inline-block;
    -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
    animation: sk-stretchdelay 1.2s infinite ease-in-out;
  }
  
  .spinner .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
  }
  
  .spinner .rect3 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
  }
  
  .spinner .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
  }
  
  .spinner .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
  }
  
  @-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
    20% { -webkit-transform: scaleY(1.0) }
  }
  
  @keyframes sk-stretchdelay {
    0%, 40%, 100% { 
      transform: scaleY(0.4);
      -webkit-transform: scaleY(0.4);
    }  20% { 
      transform: scaleY(1.0);
      -webkit-transform: scaleY(1.0);
    }
  }
  
  /* Grow Wrap */
  .itrac-material .wrap {
    transform: translateY(20px);
    transition: all 0.5s;
    visibility: hidden;
  }
  .itrac-material  .wrap .content {
    opacity: 0;
  }
  .itrac-material  .wrap:before {
    position: absolute;
    width: 1px;
    height: 1px;
    background: black;
    content: "";
    -webkit-transition: all 600ms cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 600ms cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  .itrac-material  .wrap.active {
    display: block;
    visibility: visible;
    transition: all 600ms;
    transform: translateY(0px);
    transition: all 0.5s;
  }
  .itrac-material  .wrap.active .content {
    position: relative;
    z-index: 1;
    opacity: 1;
    transition: all 600ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  
  /*custom blocks*/
  .itrac-material  .wrap.active:before {
    height: 2000px;
    width: 2000px;
    border-radius: 50%;
    display: block;
    -webkit-transition: all 600ms cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 600ms cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  
  /*
  ====== Zoom-out effect ======
  */
  .mfp-zoom-out {
    /* start state */
    /* animate in */
    /* animate out */
  }
  .mfp-zoom-out .mfp-with-anim {
    opacity: 0;
    transition: all 0.3s ease-in-out;
    transform: scale(1.3);
  }
  .mfp-zoom-out.mfp-bg {
    opacity: 0;
    transition: all 0.3s ease-out;
  }
  .mfp-zoom-out.mfp-ready .mfp-with-anim {
    opacity: 1;
    transform: scale(1);
  }
  .mfp-zoom-out.mfp-ready.mfp-bg {
    opacity: 0.8;
  }
  .mfp-zoom-out.mfp-removing .mfp-with-anim {
    transform: scale(1.3);
    opacity: 0;
  }
  .mfp-zoom-out.mfp-removing.mfp-bg {
    opacity: 0;
  }
  
  
  
  
  /* END Animations */
  
  
  /* Dynamic Portal Styles */
  div.itrac-sub-portal a.ui-collapsible-heading-toggle span.ui-btn-inner span.ui-btn-text,
  div.itrac-sub-portal a.ui-collapsible-heading-toggle span.ui-btn-inner span.ui-icon{
  margin-left:10px;
  }
  
  div.itrac-sub-portal a.ui-collapsible-heading-toggle span.ui-btn-inner .custom-count{
      font-size: 11px;
      font-weight: bold;
      padding: 0.2em 0.5em;
      float: right;
  }
  
  .dynportal-body{
      overflow-x:auto;
  }
  
  /*Table Styles Portal */
  .dynportal-body .ui-table td {font-size:10pt;}
  .dynportal-body .ui-table th {font-size:10pt;
      font-size: 10pt;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
  }
  
  @media all and (max-width:60em){
  
  .dynportal-body .ui-table td .ui-table-cell-label,
  .dynportal-body .ui-table th .ui-table-cell-label{
    background-color: #eeeeee; /* non-RGBA fallback  */
    background-color: rgba(0,0,0,0.06);
    padding: .4em; 
    min-width: 30%; 
    display: inline-block;
    line-height: 1.4em;
    margin: 0em 1em 0em -0.4em;
  }
  
  }
  
  
  @media all and (min-width:60em){
  tr.percent-25-75 td:nth-child(1){width:25%;}
  tr.percent-25-75 td:nth-child(2){width:75%;}
      
  tr.percent-75-25 td:nth-child(1){width:75%;}
  tr.percent-75-25 td:nth-child(2){width:25%;}
  
  tr.percent-50-25-25 td:nth-child(1){width:50%;}
  tr.percent-50-25-25 td:nth-child(2){width:25%;}
  tr.percent-50-25-25 td:nth-child(3){width:25%;}
      
  tr.percent-25-50-25 td:nth-child(1){width:25%;}
  tr.percent-25-50-25 td:nth-child(2){width:50%;}
  tr.percent-25-50-25 td:nth-child(3){width:25%;}
  
  tr.percent-25-25-50 td:nth-child(1){width:50%;}
  tr.percent-25-25-50 td:nth-child(2){width:25%;}
  tr.percent-25-25-50 td:nth-child(3){width:25%;}
      
  tr.percent-25-25-25-25 td:nth-child(1){width:25%;}
  tr.percent-25-25-25-25 td:nth-child(2){width:25%;}
  tr.percent-25-25-25-25 td:nth-child(3){width:25%;}
  tr.percent-25-25-25-25 td:nth-child(4){width:25%;}
     
      
  .dynportal-body .ui-table{
      table-layout:auto;
  }
     
  }
  
  /*-------- COLOR BARS ----------------------------*/
  
  
  /*-- Red ---*/
  div.color-bar-red, th.color-bar-red, td.color-bar-red, tr.color-bar-red td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #F44336;
      -moz-box-shadow: inset 4px 0px 0px 0px #F44336;
      box-shadow: inset 4px 0px 0px 0px #F44336;
  }       
  
  div.color-bar-red.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #F44336;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #F44336;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #F44336;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-red.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #F44336;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #F44336;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #F44336;
  }
  
  /*-- Pink ---*/
  div.color-bar-pink, th.color-bar-pink, td.color-bar-pink, tr.color-bar-pink td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #E91E63;
      -moz-box-shadow: inset 4px 0px 0px 0px #E91E63;
      box-shadow: inset 4px 0px 0px 0px #E91E63;
  }  
  
  div.color-bar-pink.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #E91E63;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #E91E63;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #E91E63;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-pink.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #E91E63;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #E91E63;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #E91E63;
  }
  
  /*-- Purple ---*/
  div.color-bar-purple, th.color-bar-purple, td.color-bar-purple, tr.color-bar-purple  td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #9C27B0;
      -moz-box-shadow: inset 4px 0px 0px 0px #9C27B0;
      box-shadow: inset 4px 0px 0px 0px #9C27B0;
  }
  
  div.color-bar-purple.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #9C27B0;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #9C27B0;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #9C27B0;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-purple.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #9C27B0;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #9C27B0;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #9C27B0;
  }
  
  
  
  /*-- Indigo ---*/
  div.color-bar-indigo, th.color-bar-indigo, td.color-bar-indigo, tr.color-bar-indigo td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #3F51B5;
      -moz-box-shadow: inset 4px 0px 0px 0px #3F51B5;
      box-shadow: inset 4px 0px 0px 0px #3F51B5;
  }  
  
  div.color-bar-indigo.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #3F51B5;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #3F51B5;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #3F51B5;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-indigo.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #3F51B5;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #3F51B5;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #3F51B5;
  }
  
  
  /*-- Blue ---*/
  div.color-bar-blue, th.color-bar-blue, td.color-bar-blue, tr.color-bar-blue td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #2196F3;
      -moz-box-shadow: inset 4px 0px 0px 0px #2196F3;
      box-shadow: inset 4px 0px 0px 0px #2196F3;
  }  
  
  div.color-bar-blue.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #2196F3;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #2196F3;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #2196F3;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-blue.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #2196F3;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #2196F3;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #2196F3;
  }
  
  
  /*-- Light Blue ---*/
  div.color-bar-lightblue, th.color-bar-lightblue, td.color-bar-lightblue, tr.color-bar-lightblue td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #03A9F4;
      -moz-box-shadow: inset 4px 0px 0px 0px #03A9F4;
      box-shadow: inset 4px 0px 0px 0px #03A9F4;
  }  
  
  div.color-bar-lightblue.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #03A9F4;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #03A9F4;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #03A9F4;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-lightblue.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #03A9F4;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #03A9F4;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #03A9F4;
  }
  
  /*-- Cyan ---*/
  
  div.color-bar-cyan, th.color-bar-cyan, td.color-bar-cyan, tr.color-bar-cyan td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #00BCD4;
      -moz-box-shadow: inset 4px 0px 0px 0px #00BCD4;
      box-shadow: inset 4px 0px 0px 0px #00BCD4;
  }  
  
  div.color-bar-cyan.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #00BCD4;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #00BCD4;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #00BCD4;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-cyan.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #00BCD4;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #00BCD4;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #00BCD4;
  }
  
  /*-- Teal ---*/
  
  div.color-bar-teal, th.color-bar-teal, td.color-bar-teal, tr.color-bar-teal td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #009688;
      -moz-box-shadow: inset 4px 0px 0px 0px #009688;
      box-shadow: inset 4px 0px 0px 0px #009688;
  }  
  
  div.color-bar-teal.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #009688;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #009688;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #009688;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-teal.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #009688;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #009688;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #009688;
  }
  
  /*-- Green ---*/
  
  div.color-bar-green, th.color-bar-green, td.color-bar-green, tr.color-bar-green td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #4CAF50;
      -moz-box-shadow: inset 4px 0px 0px 0px #4CAF50;
      box-shadow: inset 4px 0px 0px 0px #4CAF50;
  }  
  
  div.color-bar-green.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #4CAF50;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #4CAF50;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #4CAF50;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-green.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #4CAF50;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #4CAF50;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #4CAF50;
  }
  
  /*-- Light Green ---*/
  
  div.color-bar-lightgreen, th.color-bar-lightgreen, td.color-bar-lightgreen, tr.color-bar-lightgreen td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #8BC34A;
      -moz-box-shadow: inset 4px 0px 0px 0px #8BC34A;
      box-shadow: inset 4px 0px 0px 0px #8BC34A;
  }  
  
  div.color-bar-lightgreen.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #8BC34A;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #8BC34A;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #8BC34A;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-lightgreen.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #8BC34A;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #8BC34A;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #8BC34A;
  }
  
  /*-- Lime ---*/
  
  div.color-bar-lime, th.color-bar-lime, td.color-bar-lime, tr.color-bar-lime td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #CDDC39;
      -moz-box-shadow: inset 4px 0px 0px 0px #CDDC39;
      box-shadow: inset 4px 0px 0px 0px #CDDC39;
  }  
  div.color-bar-lime.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #CDDC39;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #CDDC39;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #CDDC39;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-lime.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #CDDC39;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #CDDC39;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #CDDC39;
  }
  
  /*-- Yellow ---*/
  
  div.color-bar-yellow, th.color-bar-yellow, td.color-bar-yellow, tr.color-bar-yellow td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #FFEB3B;
      -moz-box-shadow: inset 4px 0px 0px 0px #FFEB3B;
      box-shadow: inset 4px 0px 0px 0px #FFEB3B;
  }  
  div.color-bar-yellow.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFEB3B;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFEB3B;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFEB3B;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-yellow.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFEB3B;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFEB3B;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFEB3B;
  }
  
  /*-- Amber ---*/
  
  div.color-bar-amber, th.color-bar-amber, td.color-bar-amber, tr.color-bar-amber td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #FFC107;
      -moz-box-shadow: inset 4px 0px 0px 0px #FFC107;
      box-shadow: inset 4px 0px 0px 0px #FFC107;
  }  
  div.color-bar-amber.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFC107;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFC107;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFC107;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-amber.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFC107;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFC107;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFC107;
  }
  
  /*-- Orange ---*/
  
  div.color-bar-orange, th.color-bar-orange, td.color-bar-orange, tr.color-bar-orange td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #FF9800;
      -moz-box-shadow: inset 4px 0px 0px 0px #FF9800;
      box-shadow: inset 4px 0px 0px 0px #FF9800;
  }  
  div.color-bar-orange.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FF9800;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FF9800;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FF9800;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-orange.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FF9800;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FF9800;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FF9800;
  }
  
  /*-- Brown ---*/
  
  div.color-bar-brown, th.color-bar-brown, td.color-bar-brown, tr.color-bar-brown td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #795548;
      -moz-box-shadow: inset 4px 0px 0px 0px #795548;
      box-shadow: inset 4px 0px 0px 0px #795548;
  }  
  div.color-bar-brown.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #795548;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #795548;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #795548;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-brown.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #795548;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #795548;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #795548;
  }
  
  /*-- Grey ---*/
  
  
  div.color-bar-grey, th.color-bar-grey, td.color-bar-grey, tr.color-bar-grey td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #9E9E9E;
      -moz-box-shadow: inset 4px 0px 0px 0px #9E9E9E;
      box-shadow: inset 4px 0px 0px 0px #9E9E9E;
  }  
  div.color-bar-grey.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #9E9E9E;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #9E9E9E;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #9E9E9E;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-grey.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #9E9E9E;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #9E9E9E;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #9E9E9E;
  }
  
  /*-- Blue Grey ---*/
  
  div.color-bar-bluegrey, th.color-bar-bluegrey, td.color-bar-bluegrey, tr.color-bar-bluegrey td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #607D8B;
      -moz-box-shadow: inset 4px 0px 0px 0px #607D8B;
      box-shadow: inset 4px 0px 0px 0px #607D8B;
  }  
  div.color-bar-bluegrey.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #607D8B;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #607D8B;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #607D8B;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-bluegrey.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #607D8B;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #607D8B;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #607D8B;
  }
  
  /*-- Black ---*/
  
  div.color-bar-black, th.color-bar-black, td.color-bar-black, tr.color-bar-black td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #000000;
      -moz-box-shadow: inset 4px 0px 0px 0px #000000;
      box-shadow: inset 4px 0px 0px 0px #000000;
  }  
  div.color-bar-black.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #000000;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #000000;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #000000;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-black.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #000000;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #000000;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #000000;
  }
  
  /*-- White ---*/
  
  div.color-bar-white, th.color-bar-white, td.color-bar-white, tr.color-bar-white td:nth-child(1){
      webkit-box-shadow: inset 4px 0px 0px 0px #FFFFFF;
      -moz-box-shadow: inset 4px 0px 0px 0px #FFFFFF;
      box-shadow: inset 4px 0px 0px 0px #FFFFFF;
  }  
  div.color-bar-white.card {
      webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFFFFF;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFFFFF;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24), inset 2px 0px 0px 0px #FFFFFF;
      transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  div.color-bar-white.card-hover:hover {
      webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFFFFF;
      -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFFFFF;
      box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22), inset 2px 0px 0px 0px #FFFFFF;
  }
  
  
  
  div.color-bar-alt-red, th.color-bar-alt-red, td.color-bar-alt-red, tr.color-bar-alt-red td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #F44336;
      -moz-box-shadow: inset -2px 0px 0px 0px #F44336;
      box-shadow: inset -2px 0px 0px 0px #F44336;
  }       
  
  div.color-bar-alt-pink, th.color-bar-alt-pink, td.color-bar-alt-pink, tr.color-bar-alt-pink td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #E91E63;
      -moz-box-shadow: inset -2px 0px 0px 0px #E91E63;
      box-shadow: inset -2px 0px 0px 0px #E91E63;
  }  
      
  div.color-bar-alt-purple, th.color-bar-alt-purple, td.color-bar-alt-purple, tr.color-bar-alt-purple  td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #9C27B0;
      -moz-box-shadow: inset -2px 0px 0px 0px #9C27B0;
      box-shadow: inset -2px 0px 0px 0px #9C27B0;
  }
  
  div.color-bar-alt-indigo, th.color-bar-alt-indigo, td.color-bar-alt-indigo, tr.color-bar-alt-indigo td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #3F51B5;
      -moz-box-shadow: inset -2px 0px 0px 0px #3F51B5;
      box-shadow: inset -2px 0px 0px 0px #3F51B5;
  }  
  
  div.color-bar-alt-blue, th.color-bar-alt-blue, td.color-bar-alt-blue, tr.color-bar-alt-blue td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #2196F3;
      -moz-box-shadow: inset -2px 0px 0px 0px #2196F3;
      box-shadow: inset -2px 0px 0px 0px #2196F3;
  }  
  
  div.color-bar-alt-lightblue, th.color-bar-alt-lightblue, td.color-bar-alt-lightblue, tr.color-bar-alt-lightblue td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #03A9F4;
      -moz-box-shadow: inset -2px 0px 0px 0px #03A9F4;
      box-shadow: inset -2px 0px 0px 0px #03A9F4;
  }  
  
  div.color-bar-alt-cyan, th.color-bar-alt-cyan, td.color-bar-alt-cyan, tr.color-bar-alt-cyan td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #00BCD4;
      -moz-box-shadow: inset -2px 0px 0px 0px #00BCD4;
      box-shadow: inset -2px 0px 0px 0px #00BCD4;
  }  
  
  div.color-bar-alt-teal, th.color-bar-alt-teal, td.color-bar-alt-teal, tr.color-bar-alt-teal td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #009688;
      -moz-box-shadow: inset -2px 0px 0px 0px #009688;
      box-shadow: inset -2px 0px 0px 0px #009688;
  }  
  
  div.color-bar-alt-green, th.color-bar-alt-green, td.color-bar-alt-green, tr.color-bar-alt-green td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #4CAF50;
      -moz-box-shadow: inset -2px 0px 0px 0px #4CAF50;
      box-shadow: inset -2px 0px 0px 0px #4CAF50;
  }  
  
  div.color-bar-alt-lightgreen, th.color-bar-alt-lightgreen, td.color-bar-alt-lightgreen, tr.color-bar-alt-lightgreen td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #8BC34A;
      -moz-box-shadow: inset -2px 0px 0px 0px #8BC34A;
      box-shadow: inset -2px 0px 0px 0px #8BC34A;
  }  
  
  div.color-bar-alt-lime, th.color-bar-alt-lime, td.color-bar-alt-lime, tr.color-bar-alt-lime td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #CDDC39;
      -moz-box-shadow: inset -2px 0px 0px 0px #CDDC39;
      box-shadow: inset -2px 0px 0px 0px #CDDC39;
  }  
  
  div.color-bar-alt-yellow, th.color-bar-alt-yellow, td.color-bar-alt-yellow, tr.color-bar-alt-yellow td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #FFEB3B;
      -moz-box-shadow: inset -2px 0px 0px 0px #FFEB3B;
      box-shadow: inset -2px 0px 0px 0px #FFEB3B;
  }  
  
  div.color-bar-alt-amber, th.color-bar-alt-amber, td.color-bar-alt-amber, tr.color-bar-alt-amber td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #FFC107;
      -moz-box-shadow: inset -2px 0px 0px 0px #FFC107;
      box-shadow: inset -2px 0px 0px 0px #FFC107;
  }  
  
  div.color-bar-alt-orange, th.color-bar-alt-orange, td.color-bar-alt-orange, tr.color-bar-alt-orange td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #FF9800;
      -moz-box-shadow: inset -2px 0px 0px 0px #FF9800;
      box-shadow: inset -2px 0px 0px 0px #FF9800;
  }  
  
  div.color-bar-alt-brown, th.color-bar-alt-brown, td.color-bar-alt-brown, tr.color-bar-alt-brown td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #795548;
      -moz-box-shadow: inset -2px 0px 0px 0px #795548;
      box-shadow: inset -2px 0px 0px 0px #795548;
  }  
  
  
  div.color-bar-alt-grey, th.color-bar-alt-grey, td.color-bar-alt-grey, tr.color-bar-alt-grey td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #9E9E9E;
      -moz-box-shadow: inset -2px 0px 0px 0px #9E9E9E;
      box-shadow: inset -2px 0px 0px 0px #9E9E9E;
  }  
  
  div.color-bar-alt-bluegrey, th.color-bar-alt-bluegrey, td.color-bar-alt-bluegrey, tr.color-bar-alt-bluegrey td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #607D8B;
      -moz-box-shadow: inset -2px 0px 0px 0px #607D8B;
      box-shadow: inset -2px 0px 0px 0px #607D8B;
  }  
  
  div.color-bar-alt-black, th.color-bar-alt-black, td.color-bar-alt-black, tr.color-bar-alt-black td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #000000;
      -moz-box-shadow: inset -2px 0px 0px 0px #000000;
      box-shadow: inset -2px 0px 0px 0px #000000;
  }  
  
  div.color-bar-alt-white, th.color-bar-alt-white, td.color-bar-alt-white, tr.color-bar-alt-white td:nth-last-child(1){
      webkit-box-shadow: inset -2px 0px 0px 0px #FFFFFF;
      -moz-box-shadow: inset -2px 0px 0px 0px #FFFFFF;
      box-shadow: inset -2px 0px 0px 0px #FFFFFF;
  } 
  
  /*-- Color-Bar-Text ----*/
  .color-title.color-bar-red, .color-title.color-bar-alt-red{color:#F44336;}       
  .color-title.color-bar-pink, .color-title.color-bar-alt-pink{color:#E91E63;}  
  .color-title.color-bar-purple, .color-title.color-bar-alt-purple{color:#9C27B0;}
  .color-title.color-bar-indigo, .color-title.color-bar-alt-indigo{ color:#3F51B5;}  
  .color-title.color-bar-blue, .color-title.color-bar-alt-blue{color:#2196F3;}  
  .color-title.color-bar-lightblue, .color-title.color-bar-alt-lightblue{color:#03A9F4;}  
  .color-title.color-bar-cyan, .color-title.color-bar-alt-cyan{color:#00BCD4;}  
  .color-title.color-bar-teal, .color-title.color-bar-alt-teal{color:#009688;}  
  .color-title.color-bar-green, .color-title.color-bar-alt-green{color:#4CAF50;}  
  .color-title.color-bar-lightgreen, .color-title.color-bar-alt-lightgreen{color:#8BC34A;}  
  .color-title.color-bar-lime, .color-title.color-bar-alt-lime{color:#CDDC39;}  
  .color-title.color-bar-yellow, .color-title.color-bar-alt-yellow{color:#FFEB3B;}  
  .color-title.color-bar-amber, .color-title.color-bar-alt-amber{color:#FFC107;}  
  .color-title.color-bar-orange, .color-title.color-bar-alt-orange{color:#FF9800;}  
  .color-title.color-bar-brown, .color-title.color-bar-alt-brown{color:#795548;}  
  .color-title.color-bar-grey, .color-title.color-bar-alt-grey{color:#9E9E9E;}
  .color-title.color-bar-bluegrey, .color-title.color-bar-alt-bluegrey{color:#607D8B;}  
  .color-title.color-bar-black, .color-title.color-bar-alt-black{color:#000000;}  
  .color-title.color-bar-white, .color-title.color-bar-alt-white{color:#FFFFFF;} 
  
  
  
  
  
  
  
  
  /* End - Dynamic Portal Styles */
  
  
  /* ContentTools Styles */
  /* Center (default) */
  .cms-page .scroller{
    min-height:100vh;
  }
  
  
  .cms-page .ui-content[role="main"] iframe,
  .cms-page .ui-content[role="main"]  image,
  .cms-page .ui-content[role="main"]  [data-ce-tag=img],
  .cms-page .ui-content[role="main"]  img,
  .cms-page .ui-content[role="main"]  video {
      clear: both;
      display: block;
      margin-left: auto;
      margin-right: auto;
      max-width: 100%;
  }
  
  /* Left align */
  .cms-page .ui-content[role="main"]  .align-left {
      clear: initial;
      float: left;
      margin-right: 0.5em;
  }
  
  /* Right align */
  .cms-page .ui-content[role="main"]  .align-right {
      clear: initial;
      float: right;
      margin-left: 0.5em;
  }
  
  /* Alignment styles for text in editable regions */
  .cms-page .ui-content[role="main"]  .text-center {
      text-align: center;
  }
  
  .cms-page .ui-content[role="main"]  .text-left {
      text-align: left;
  }
  
  .cms-page .ui-content[role="main"]  .text-right {
      text-align: right;
  }
  ​/* END - ContentTools styles */
  
  .card {
    background: #fff;
    border-radius: 2px;
    display: inline-block;
    height: 300px;
    margin: 1rem;
    position: relative;
    width: 300px;
  }
  
  .splitlist-blend-btn .ui-li-link-alt .ui-btn-icon-notext {
  border-radius:11px;
  -webkit-border-radius:11px;
  display:block;
  border:0px;
  background:transparent;
  }
  
  .splitlist-blend-btn  .ui-li-link-alt .ui-btn-inner {
      pointer-events: none;
  }
  
  .hr-sect {
      display: flex;
      flex-basis: 100%;
      align-items: center;
      color: rgba(0, 0, 0, 0.35);
      font-size: 12px;
      margin: 25px 0px 8px 0px;
  }
  .hr-sect::before,
  .hr-sect::after {
      content: "";
      flex-grow: 1;
      background: rgba(0, 0, 0, 0.20);
      height: 1px;
      font-size: 0px;
      line-height: 0px;
      margin: 0px 16px;
  }
  
  .svg-semi-transparent{
    fill-opacity:0.6;
   }
  
  .spacing-hr{
  margin: 16px 0px 24px 0px;
  opacity: 0.5;
  }
  
  h2.page-title{
  margin-bottom: 0px;
  font-weight:normal;
  }
  p.page-descr{
  font-weight: normal;
  font-size: 11pt;
  margin-top: 0.6em;
  margin-bottom: 2.6em;
  white-space:normal;
  }
  
  .ui-btn-right{
  float:right;
  }
  
  .ui-btn-right[title="Close"]{
      right: 4px !important;
      top: 4px !important;
      display: block;
      border: 0px;
      background: transparent;
      -webkit-border-radius: 50%;
  }
  
  .invisible {
    visibility:hidden!important;
  }
  
  .hidden{
    display: none!important;
  }
  
  /*------------------------------------- Data Tables --------------------*/
  
  li.itrac-table-row {
  padding-left: 3px!important;
  }
  
  table.datatable {
  min-width: 800px;	
  }
  
  table.dataTable tbody th, table.dataTable tbody td.input-contain {
   padding:2px;
  }
  
  
  table.dataTable tbody th, table.dataTable tbody td.input-contain .ui-select .ui-btn-inner {
   max-height: 15px;
  }
  
  table.dataTable tbody th, table.dataTable tbody td.input-contain .ui-select .ui-btn-inner  .ui-btn-text{
   margin-top:-5px;
  }
  
  table.dataTable tbody th, table.dataTable tbody td.input-contain .ui-input-datebox {
   min-height: 35px;
  }
  
  table.dataTable tbody td.input-contain .ui-controlgroup-label, table.dataTable tbody td.input-contain .ui-controlgroup{
    margin:0px;
  }
  
  table.dataTable thead th.no-sort{
      padding: 0px 2px;
  }
  
  table.dataTable tfoot th, table.dataTable tfoot td {
      padding: 10px 18px 12px 10px;
  }
  
  .ui-input-datebox { min-width: 130px; }
  
.ui-input-datebox .ui-btn{
    border: 1px solid rgba(0,0,0,0.3);
    border-radius: 50%;
}

  table.dataTable tfoot th{
      padding-top:15px;
  }
  
  span.calc-type-label{
      font-size: 9pt;
      display: inline-block;
      position: relative;
      color: rgba(0,0,0,0.4);
      top: -15px;
      left:0px;
      /*margin-right: 5px;*/
  }
  
  .md-checkbox *, .md-checkbox *:before, .md-checkbox *:after {
      box-sizing: border-box;
  }
  
  
  .md-checkbox {
    position: relative;
    height:20px;
    width:20px;
    display:inline-block;
    margin:8px;
  }
  
  .md-checkbox-contain{
      height: 35px;
      width: 35px;
      border-radius: 50%;
      display: inline-block;
      position: relative;
      transition: background .4s cubic-bezier(.25,.8,.25,1);
  }
  
  .md-checkbox-contain:hover{
      background: rgba(0,0,0,0.05);
  }
  
  .md-checkbox-contain.focus-within,
  .md-checkbox-contain:focus-within{
      background: rgba(0,0,0,0.1);
  }
  
  .md-checkbox label {
    cursor: pointer;
  }
  
  .md-checkbox label:focus:before{
      border: 2px solid #337ab7;
  }
  
  
  .md-checkbox label:before, .md-checkbox label:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
  }
  .md-checkbox label:before {
    width: 20px;
    height: 20px;
    background: #fff;
    border: 2px solid rgba(0, 0, 0, 0.54);
    border-radius: 2px;
    cursor: pointer;
    transition: background .3s;
  }
  .md-checkbox input[type="checkbox"] {
    outline: 0;
    margin-right: 10px;
  }
  .md-checkbox input[type="checkbox"]:checked + label:before {
    background: #337ab7;
    border: none;
  }
  .md-checkbox input[type="checkbox"]:checked + label:after {
    transform: rotate(-45deg);
    top: 5px;
    left: 4px;
    width: 12px;
    height: 6px;
    border: 2px solid #fff;
    border-top-style: none;
    border-right-style: none;
  }
  
  a.field-inline {position:relative;}
  a.field-inline .ui-btn-inner{height:15px;}
  a.field-inline .ui-btn-inner .ui-btn-text { top: -3px; }
  
  .itrac-data-table-header {
      height: 64px;
      max-height: 64px; 
      box-sizing: inherit;
      -webkit-flex-direction: row;
      -ms-flex-direction: row;
      flex-direction: row;
      display: flex;
      align-content: center;
      max-width: 100%;
      min-height:64px;
  }
  
  .itrac-data-table-header.mini{
      height: 40px;
      max-height: 40px;
      min-height: 40px;
  }
  
  .itrac-data-table-header.mini h2{
      font-weight: lighter;
      overflow:hidden;
      text-overflow:ellipsis;
      font-size: 14pt;
      line-height: 32px;
      margin: auto 0.6em;
  }
  
  .md-card .itrac-data-table-header {
      padding-left: 16px;
      padding-right: 14px;
  }
  
  .md-card table.dataTable td:nth-child(1), .md-card table.dataTable th:nth-child(1){
      padding-left:16px;
  }
  
  .md-card table.dataTable td:last-child, .md-card table.dataTable th:last-child{
      padding-right:16px;
  }
  
  .itrac-data-table-header.selectionactive{
      background-color: #e3edfd;
  }
  
  .layout-align-start{
  -webkit-justify-content: start;
  -ms-flex-pack: start;
  justify-content: start;
  }
  
  .layout-align-space-between{
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-align-items: stretch;
      -ms-flex-align: stretch;
      align-items: stretch;
      -webkit-align-content: stretch;
      -ms-flex-line-pack: stretch;
      align-content: stretch;
  }
  
  .md-card {
      box-sizing: border-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      margin: 4px;
      background-color: white;
      box-shadow: 0 1px 3px 0 rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 2px 1px -1px rgba(0,0,0,.12);
  }
  
  .md-button.md-icon-button {
  margin: 0px;
  opacity:0.7;
  height: 40px;
  min-width: 0;
  line-height: 24px;
  padding: 8px;
  width: 40px;
  border-radius: 50%;
  }
  
  .itrac-header .md-button.md-icon-button {
  opacity:1;
  }
  
  .header-v-divider {
      border-right: 1px solid #e5e5e5;
      display: inline-block;
      display: inline-flex;
      height: 32px;
      margin: 4px 8px;
      vertical-align: middle;
      align-self: center;
  }
  
  .md-button.md-icon-button.md-icon-button-sml{
      margin: 0px;
      height: 26px;
      min-height: 0;
      min-width: 0;
      line-height: 26px; 
      padding: 2px;
      width: 26px;
  }
  
  .svg-white svg{
    fill:#FFFFFF;
  }
  
  .svg-black svg{
    fill:#000000;
  }
  
  a.icon-btn:hover .md-icon-button{
   background-color:rgba(0,0,0,0.2);
  }
  
  a.icon-btn.focus-within .md-icon-button,
  a.icon-ntn:focus-within .md-icon-button:focus-within{
  background-color:rgba(0,0,0,0.2);
  }
  
  a.icon-btn.svg-white:hover .md-button.md-icon-button{ 
  background-color:rgba(255,255,255,0.2);
  }
  
  a.icon-btn.svg-white:focus-within .md-button.md-icon-button,
  a.icon-btn.svg-white.focus-within .md-button.md-icon-button{
  background-color:rgba(255,255,255,0.2);
  }
  
  a:hover .md-button.md-icon-button{
  background-color:rgba(0,0,0,0.2);
  }
  .md-button.md-icon-button:focus-within,
  .md-button.md-icon-button.focus-within {
  background-color:rgba(0,0,0,0.2);
  }
  
  .md-button.md-icon-button.svg-white:hover{
  background-color:rgba(255,255,255,0.2);
  }
  
  .md-button.md-icon-button.svg-white:focus-within,
  .md-button.md-icon-button.svg-white.focus-within {
  background-color:rgba(255,255,255,0.2);
  }
  
  /*
  .itrac-header .md-button.md-icon-button:hover{ 
  background-color:rgba(255,255,115,0.4);
  }
  
  .itrac-header .md-button.md-icon-button:focus-within,
  .itrac-header .md-button.md-icon-button.focus-within {
  background-color:rgba(115,115,115,0.4);
  }
  */
  
  .md-button {
  border-radius: 3px;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  outline: 0;
  border: 0;
  display: inline-block;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0 6px;
  margin: 6px 8px;
  line-height: 36px;
  min-height: 36px;
  background: 0 0;
  white-space: nowrap;
  min-width: 88px;
  text-align: center;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 14px;
  font-style: inherit;
  font-variant: inherit;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
  overflow: hidden;
  transition: box-shadow .4s cubic-bezier(.25,.8,.25,1),background .4s cubic-bezier(.25,.8,.25,1);
  letter-spacing: .010em;
  vertical-align: baseline;
  }
  
  .flex {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  box-sizing: border-box;
  }
  
  .itrac-data-table-header h4{
  font-size: 16pt;
  position: relative;
  line-height: 64px;
  margin: 0px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  vertical-align: middle;
  display: inline;
  }
  
  .itrac-data-table-header h2{
      vertical-align: middle;
      position: relative;
      line-height: 64px;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      display: inline-block;
      font-weight: lighter;
      margin: 0px;
  }
  
  
  table.dataTable tr .action-menu-contain .itrac-inline-svg-btn{
     visibility:hidden;
  }
  table.dataTable tr:hover .action-menu-contain .itrac-inline-svg-btn{
     visibility:visible;
  }
  
  table.dataTable tbody tr.rowSelected{
    background-color:rgba(0,0,0,0.1)!important;
  }
  
  table.dataTable tr .action-menu-contain{
   padding:0px;	
  }
  
  .itrac-data-table-header.active-header{
    border:0px;
    display:none;	
  }
  .itrac-data-table-container{
      display:inline-block;
      background:white;
  }
  
  ul.itrac-record .itrac-data-table-container{
      width:100%;
  }
  
  .itrac-data-table-container.selectionActive .itrac-data-table-header.default-header{
    background:inherit;
    display:none;	
  }
  .itrac-data-table-container.selectionActive .itrac-data-table-header.active-header{
    display:flex;
    display: -webkit-flex;
    align-items: center;
    -ms-flex-direction: row;
    flex-direction: row;
  }
  
  .ui-collapsible-content .itrac-data-table-container{
      margin:0px;
      max-width: 100%;
      overflow-x: auto;
  }
  
  .ui-collapsible-content div.dataTables_wrapper {
      max-width: 100%;
      overflow-x: auto;
  }
  
  .ui-collapsible-content .itrac-data-table-header .table-title{
      display:none;
  }
  
  .ui-collapsible-content .itrac-data-table-header .inline-container{
      width:100%;
  }
  
  div.ui-collapsible-content div.itrac-data-table-header div.inline-container div.ui-input-search{
      width:100%;
  }
  
  .inline-container div.ui-input-search{
      vertical-align:middle;
  }
  
  div.icon-container > a.icon-btn{
      align-self: center;
      display:inline-block;
      display:inline-flex;
  }
  
  div.inline-container > a.icon-btn,
  div.inline-container > button {
      align-self: center;
      display:inline-block;
      display:inline-flex;
  }
  
  div.inline-container {
      white-space: nowrap;
      display: flex;
      align-items:center;
  }
  
  div.inline-container > div {
      display:inline-block;
      display:inline-flex;
  }
  
  .sticky{
      position:-webkit-sticky;
      position:sticky;
      top:0px;
      z-index:100;
  }
  
  .itrac-data-table-header.default-header{
      background-color:white;
  }
  
  .itrac-data-table-header-contain{
      box-sizing:border-box;
      box-shadow: 0;
      transition: box-shadow 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  .itrac-data-table-header-contain.scrolled{
      box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
  }
  
  tr.dtrg-group span.rowCount {
     border-radius: 50%;
     border: 1px solid rgba(0,0,0,0.4);
     padding: 4px;
     width: 16px;
     height: 16px;
     font-weight: lighter;
     font-size: 16px;
     line-height: 16px;
     text-align: Center;
     vertical-align: middle;
     display: inline-block;
 }

 tr.dtrg-start td{
     border-top: 1px solid rgba(0,0,0,0.2)!important;
 }

 tr.dtrg-group .expand-icon{
    float:right;
    cursor:pointer;
    transform: rotate(180deg);
    transition: transform 0.3s cubic-bezier(0.4, 0.0, 0.2, 1);
 }
  
 tr.dtrg-group.collapsed .expand-icon{
    transform: rotate(0deg);
 }


  table.dataTable { min-width:700px; }
  
  div.dataTables_wrapper { max-width:100%; }
  
  table.dataTable thead th {
      position: relative;
      background-image: none !important;
      /*white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;*/
  }
  
  /* -- Right Align --*/
  table.dataTable th.alignRight, 
  table.dataTable td.alignRight {
      text-align: right;
      padding-right: 0.5em;
  }
  
  table.dataTable td.alignRight input[type="text"]{
      text-align:right;
  }
  
  /*-- Center Align --*/
  table.dataTable th.alignCenter, 
  table.dataTable td.alignCenter {
      text-align: center;
      padding-right: 0.5em;
      padding-left: 0.5em;
  }
  
  table.dataTable td.alignCenter input[type="text"]{
      text-align:center;
  }
  
  
  table.dataTable thead th, table.dataTable thead td{
      font-weight:bold;
      font-size:9pt;
      padding-left: 0.5em;
      padding-right:1em;
      border-bottom:1px solid rgba(0,0,0,0.4);
  }
  
  table.dataTable tfoot td{
      font-weight:normal;
  }
  
  table.dataTable thead th.sorting:after,
  table.dataTable thead th.sorting_asc:after,
  table.dataTable thead th.sorting_desc:after {
      position: relative;
      display: inline-block;
      padding: 3px;
      font-weight: lighter;
      font-family: FontAwesome;
      color: rgba(0,0,0,0.4);
  }
  table.dataTable thead th.sorting:after {
      /*content: "\f0dc";*/
      content: "";
      color: #ddd;
      font-size: 0.8em;
      padding-top: 0.12em;
  }
  table.dataTable thead th.sorting_asc:after {
      content: "\f062";
  }
  table.dataTable thead th.sorting_desc:after {
      content: "\f063";
  }
  
  table.dataTable thead tr.group-column-headings th.group {
  font-size: 12pt;
  text-align: center;
  border-top: 0px;
  padding-top: 5px;
  }
  
  th.group{ border-left:0px; }
  th.group ~ th.group { border-left: 1px solid rgba(0,0,0,0.2); }
  
  
  table.dataTable thead tr.group-column-headings th.empty-group{
      border-bottom:0px;
  }
  
  /* Progress Bar */
  .progress {
    position: relative;
    height: 5px;
    display: block;
    width: 100%;
    background-color: #acece6;
    border-radius: 2px;
    background-clip: padding-box;
    margin: 3px 0 3px 0;
    overflow: hidden; }
    .progress .determinate {
      position: absolute;
      background-color: inherit;
      top: 0;
      bottom: 0;
      background-color: #26a69a;
      transition: width .3s linear; }
    .progress .indeterminate {
      background-color: #26a69a; }
      .progress .indeterminate:before {
        content: '';
        position: absolute;
        background-color: inherit;
        top: 0;
        left: 0;
        bottom: 0;
        will-change: left, right;
        -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
                animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; }
      .progress .indeterminate:after {
        content: '';
        position: absolute;
        background-color: inherit;
        top: 0;
        left: 0;
        bottom: 0;
        will-change: left, right;
        -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
                animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
        -webkit-animation-delay: 1.15s;
                animation-delay: 1.15s; }
  
  div.fullpage-progress{
      position: absolute;
      top: -3px;
      margin: 0px;
      z-index: 1001;
  }		  
  
  .sticky .progress {
    margin: 0px;
    position: absolute;
  }
  
  div.progress-msg-contain{
  margin:auto;
  width:400px;
  padding:1em 0em 1.5em 0em;
  }
  
  .progress-msg{
      text-align:center;
      margin:0.5em;
      font-size:9pt;
      font-weight:bold;
  }
  
  .progress-delay{
      -webkit-transition: opacity 3s, height 3s, max-height 3s; /* For Safari 3.1 to 6.0 */
      transition: opacity 3s, height 3s, max-height 3s;
      transition-delay:2s;
      opacity:0;
      overflow:hidden;
      max-height:0px;
      display:inline;
  }
  
  .progress-delay-show{
      opacity:1;
      height:auto;
      overflow:visible;
      max-height:100px;
  }
  
  
                
  @-webkit-keyframes indeterminate {
    0% {
      left: -35%;
      right: 100%; }
    60% {
      left: 100%;
      right: -90%; }
    100% {
      left: 100%;
      right: -90%; } }
  @keyframes indeterminate {
    0% {
      left: -35%;
      right: 100%; }
    60% {
      left: 100%;
      right: -90%; }
    100% {
      left: 100%;
      right: -90%; } }
  @-webkit-keyframes indeterminate-short {
    0% {
      left: -200%;
      right: 100%; }
    60% {
      left: 107%;
      right: -8%; }
    100% {
      left: 107%;
      right: -8%; } }
  @keyframes indeterminate-short {
    0% {
      left: -200%;
      right: 100%; }
    60% {
      left: 107%;
      right: -8%; }
    100% {
      left: 107%;
      right: -8%; } }
  
  
  ul.context-action-menu {
      list-style-type: none;
      margin: 0;
      padding: 0;
  }
   
  .context-action-menu li {
      font: 200 16px/1.5 Helvetica, Verdana, sans-serif;
      border-bottom: 1px solid #ccc;
      min-width: 230px;
      vertical-align:middle;
  }
  
  .context-menu-contain{
      border-radius:3px;
  }
  
  .context-action-menu li .header-svg-icon{
      vertical-align:top;
  }
   
  .context-action-menu li:last-child {
      border: none;
  }
   
  .context-action-menu li a {
      text-shadow:none;
      text-decoration: none;
      padding: 0.5em;
      font-weight:normal!important;
      display: block;
      color: #333333!important;
  }
   
  .context-action-menu li a svg{
  vertical-align: bottom;
  margin-right: 8px;
  }
  
  .context-action-menu li a:hover {
      background-color: #eeeeee;
      color: #2489ce!important;
      text-decoration: none!important;
  }
  
  div.fullscreenable{
    -webkit-transition: margin 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: margin 100ms cubic-bezier(0.215, 0.61, 0.355, 1);	
  }
  
  div.fullscreen-modal{
      overflow:auto;
      position: fixed;
      background: white;
      z-index: 1200;
      top: 0px;
      left: 0px;
      right: 0px;
      bottom:0px;
      margin: 0px!important;
      z-index: 9990!important;
      width: auto!important;
      max-width: 100vw!important;
      min-height: calc(100vh - 50px);
      max-height: calc(100vh - 50px);	
  }
  
  div.fullscreen-modal .dataTables_wrapper{
      overflow:visible;
      top:64px;
  }
  
  .fullscreen-modal .itrac-data-table-header{
  position:fixed;
  width:100%;
  z-index:200;
  background-color:white;
  }
  
  @media all and (max-width:60em){
  
      .ui-btn-icon-mobile-collapse{
          border-radius:50%;
      }
  
      .ui-btn-icon-mobile-collapse .ui-btn-inner,.ui-btn-icon-mobile-collapse .ui-btn-inner{
          min-width:32px;
          padding: 0.5em 0px;
          border-radius:50%;
      }
      
      .ui-btn-icon-mobile-collapse .ui-btn-inner .ui-icon{
          left:7px;
      }
          
      .ui-btn-icon-mobile-collapse .ui-btn-text{
          display: none;
      }
      
      div.inline-container .ui-input-search{
          width:100%;
      }
  }
  
  /*--- Froala Editor Fixes ---*/
  div.fr-fullscreen{ max-height: calc(100vh - 55px)!important; }
  div.fr-fullscreen div.fr-wrapper{ max-height: calc(100vh - 130px)!important;}
  
  li.address-complete-row{padding-top:30px!important;padding-bottom: 25px!important;}
  
  .label-sml {
      font-size: 9pt;
      font-weight: 400;
      opacity: 0.4;
      display: inline-block;
  }
  
  .light-large{
     margin-top:0px;
     font-weight:lighter;
     font-size:22pt;
     margin-bottom:15px;
  }
  
  a.post-item-link{
      font-size: 11pt;
      font-weight: normal !important;
      cursor: pointer;
      display: block;
      margin-top: 10px;
  }
  .fr-box{
          margin-left: 2px;
  }
  
  
  
  
  
  /*----------- Chat Stack ----------*/
  
  .itrac-chat-stack{
  margin:auto;
  margin-top:2em;
  margin-bottom:2em;	
  max-width:1200px;
  }
  
  
  .chat-msg-body{
  margin:0.5em 0em;
  padding:1em;
  max-width:950px;	
  }
  
  
  ol.conversation{
  list-style-type:none;
  margin:0px;
  }
  
  ol.conversation li {
    display: flex;
    margin-bottom:1em;
    align-items: flex-end;
  }
  
  .avatar {
    margin:5px;
    width: 36px;
  }
  
  .avatar img {
    display: block;
  }
  
  .chat-align-right{
  justify-content: flex-end;
  }
  
  .bullet-divider{
    display:inline-flex;
    line-height:13pt;
    vertical-align:middle;
    color:rgba(0,0,0,0.5);
    padding:0 7px;
  margin-bottom:0.8em;
  }
  
  .person-chat-name{
      display:inline-flex;
      font-weight:bold;
      font-size:12pt;
      color:rgba(0,0,0,0.7);
      vertical-align:middle;
      margin-bottom:0.8em;
  }
  
  .chat-time{
    display:inline-flex;
    line-height:13pt;
    color:rgba(0,0,0,0.5);
    font-weight:bold; 
    font-size:10pt;
    vertical-align:middle;
    margin-bottom:0.8em;
  }
  
  .chat-align-left .chat-msg-body{
  background-color: rgba(240, 244, 255, 0.6);
  }
  .chat-align-left .chat-msg-body{
  border-top-right-radius: 0.5em;
  border-top-left-radius: 0.5em;
  border-bottom-right-radius: 0.5em;	
  }
  
  .chat-align-right .chat-msg-body{
  background-color: rgba(255, 240, 250, 0.6);
  }
  .chat-align-right .chat-msg-body{
  border-top-right-radius: 0.5em;
  border-top-left-radius: 0.5em;
  border-bottom-left-radius: 0.5em;	
  }
  
  
  .chat-align-right .chat-box-container{
  text-align:right;
  }
  
  /*--- Moneris Invoice Styles ---*/
  
  .moneris-checkout-info{
      float:left;display:inline-block;
  }
  
  .moneris-checkout-info .logo{
      display:inline-block;padding:5px;
  }
  
  .moneris-receipt-logo{
      height:100%;position:relative;
  }
  
  .moneris-receipt-logo img{
      width:250px;
  }
  
  .moneris-checkout-info .checkout-disclaimer{
      max-width:425px;color:#666666;padding:5px 10px;line-height:25px;text-align:left;vertical-align:middle;font-size:10pt;
  }
  
  .right-align-block{
      float:right;display:inline-block;
  }
  
  .moneris-trans-error{
      color:#cc0000;
  }
  
  .moneris-order{
      display:block;vertical-align:top;
  }
  
  .moneris-order ul.ui-listview{
      margin:0; padding:0;	
  }
  
  .moneris-order ul.ui-listview li.ui-li.ui-li-divider{
      font-weight:bold;
      margin-bottom:0px;
  }
  
  .moneris-order ul li.outline{
  border-left:1px solid #b0b0b0;border-right:1px solid #b0b0b0;
  }
  
  .payment-form-notice{
      display: inline-block;
      padding: 1em;
      width: 400px;
      border: 1px solid #cc0000;
      border-radius: 8px;
      color: #cc0000;
  }
  
  .payment-form-notice h4{
      margin-top: 0px;
      color: #cc0000;
  }
  
  table[sticky-table-header] thead th{
      background:white;
      position:sticky!important;
      top:0px;
      z-index:200;
  }
  
  table[sticky-table-footer] tfoot th{
      background:white;
      position:sticky!important;
      bottom:0px;
      z-index:200;
  }
  
  
  /*--- CHIPS -----*/
  .chip {
  background-color: #dddddd;
  border-radius: 30px;
  margin-right: 0.3em;
  margin-top: 0.5em;
  max-width: 100%;
  position: relative;
  white-space: nowrap;
  }
  
  .inline{
  display: inline-block;
  }
  
  .chip .chip-icon{
      height:24px;
      width:24px;
      padding:8px;
      display:inline-block;
      vertical-align:middle;
      background-color: rgba(0,0,0,0.03);
      border-radius:30px;
  }
  
  .chip .chip-icon svg,.chip .chip-icon img{
    height:24px;
    width:24px;
  }
  
  .chip:hover{
      background-color: rgba(0,0,0,0.07);
  }
  
  .chip > a:not(.icon-btn),
  .chip > a.ui-link:not(.icon-btn),
  .chip > a.ui-link:not(.icon-btn):hover,
  .chip > a.ui-link:not(.icon-btn):visited{
      text-decoration: none!important;
      max-width: calc(100% - 45px);
      width: 100%;
      display: inline-block;
      font-weight:lighter!important;
      color: inherit;
  }
  
  .chip span.chip-title{
      display: inline-block;
      vertical-align: middle;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-left:5px;
      margin-right:35px;
      line-height:40px;
      max-width: calc(100% - 35px);
    }
    
  
  .chip .action-btn{
      position: absolute;
      right: 0px;	
  }
  
  .chip .action-btn a,
  .chip .action-btn a.ui-link,
  .chip .action-btn a.ui-link:hover,
  .chip .action-btn a.ui-link:visited{
      max-width:100%;
  }
  
  /*--- mini ---*/
  
  .chip-mini{
      position: relative;
      background-color: rgba(0,0,0,0.03);
      border: 1px solid rgba(0,0,0,0.1);
      border-radius: 30px;
      margin: 2px;
      max-width: 160px;
      overflow: hidden;
      min-width: 64px;
      white-space: nowrap;
      display: inline-block;
  }
  
  .chip-mini:hover{
      background-color: rgba(0,0,0,0.07);
  }
  
  .chip-mini .chip-icon{
      height: 16px;
      width: 16px;
      padding: 4px;
      display: inline-block;
      vertical-align: middle;
      background-color: #dfdfdf;
      border-radius: 30px;
  }
  
  .chip-mini a:not(.icon-btn),
  .chip-mini a.ui-link:not(.icon-btn),
  .chip-mini a.ui-link:hover:not(.icon-btn),
  .chip-mini a.ui-link:visited:not(.icon-btn){
      text-decoration: none!important;
      font-weight: lighter !important;
      display: inline-block;
      color: inherit;
  }
  
  .chip-mini a:first-child{
     margin-right:24px;
     max-width: 140px;
  }
  
  .chip-mini .action-btn svg{
     height:16px;
     width:16px;
  }
  
  .chip-mini span.chip-title{
      display: inline-block;
      vertical-align: middle;
      overflow: hidden;
      margin-right:2px;
      text-overflow: ellipsis;
      margin-left: 4px;
      line-height: 24px;
      font-size: 10pt;
      max-width: calc(100% - 34px);
      white-space:nowrap;
  }
  
  .chip-mini .action-btn{
      height: 24px;
      min-width: 24px;
      min-height: 24px;
      line-height: 24px;
      /* padding: 0 6px; */
      width: 24px;
      right: 0;
      position: absolute;
  }
  
  
  .chip-mini .md-button.md-icon-button {margin: 0px;opacity:0.7;height: 24px;min-width: 0;line-height: 24px;padding: 4px;width: 24px;display: inline;/* position:absolute; */right:0px;}
  
  .chip-mini .action-btn a,
  .chip-mini .action-btn a.ui-link,
  .chip-mini .action-btn a.ui-link:hover,
  .chip-mini .action-btn a.ui-link:visited{
    max-width:100%;	
  }
  
  .chip-mini.badge{
      min-width:24px;
      width:24px;
      max-width:24px;
  }
  
  .chip-mini.badge span.chip-title{ 
      vertical-align: middle;
      margin-right: 3px;
      color: rgba(0,0,0,0.8);
      text-align: center;
      margin-left: 3px;
      width: 24px;
      font-size: 9pt;
  }
  
  /*-------- tile ------- */
  
  .chip-tile {
      border: 1px solid #38323242;
      border-radius: 2px;
      transition: box-shadow 0.3s cubic-bezier(.25,.8,.25,1);
      width: 200px;
      height: 200px;
      display: inline-block;
      vertical-align: top;
      margin: 8px 8px 0px 0px;
      position: relative;
  }
  
  .chip-tile:hover {
      cursor: pointer;
      box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  }
  .chip-tile .action-btn {
     position:absolute;
     top:0px;
     right:0px;
     z-index:200;	
     opacity:0;
  }
  .chip-tile:hover .action-btn{
      opacity:1.0;
  }
  
  .chip-tile:focus-within .action-btn{
      opacity:1.0;
  }
  
  .chip-tile.focus-within .action-btn{
      opacity:1.0;
  }
  
  .chip-tile .thumb_contain{
      border-bottom:1px solid #dddddd;
      height:140px;
      text-align:center;
      position:relative;
      overflow:hidden;
      background-color:rgba(230, 235, 239, 1);
      background-size: 50%;
      background-position: center;
      background-repeat: no-repeat;
      transition: background-image 1s 1s ease-in-out;
  }
  .chip-tile .doc_thumb{
      position: relative;
      display: block;
      top: 50%;
      margin: auto;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
  }
  .chip-tile .doc_detail{
      height:50px;
      position:relative;
      padding:4px 6px;
      color: #333333;
      margin-left:-1px;
      margin-right:-1px;
      border-bottom-left-radius: 2px;
      border-bottom-right-radius: 2px;	
  }
  .chip-tile .doc_name{
      max-width: 190px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      font-size:7pt;
      font-weight:bold;
  }
      
  .chip-tile .doc_filename{
      max-width: 170px;
      overflow: hidden;
      display: inline-block;
      position: absolute;
      top: 5px;
      left: 26px;
      text-overflow: ellipsis;
      font-size: 10pt;
      font-weight: lighter;
  }
  .chip-tile .doc_date{
      font-size: 8pt;
      position: absolute;
      bottom: 6px;
      color: rgba(0,0,0,0.5);
  }
  .chip-tile .md-checkbox-contain{
      position:absolute;
      top:0;
      right:0;
      opacity:0;	
  }
  
  .chip-tile:hover .md-checkbox-contain{
      opacity:1.0;
  }
  
  .chip-tile:focus-within .md-checkbox-contain {
      opacity:1.0;
  }
  
  .chip-tile.focus-within .md-checkbox-contain {
      opacity:1.0;
  }
  
  .chip-tile .thumb_select .doc_detail {
      background-color: #337ab7;
      color: #ffffff;
      text-shadow: none;
  }
  
  .chip-tile .thumb_select .md-checkbox-contain {
      opacity:1.0;	
  }
  
  .chip-tile .thumb_select .md-checkbox-contain {
      opacity:1.0;	
  }
  
  
  /*-------- wide ------- */
  
  .chip-wide {
  border: 1px solid #38323242;
  border-radius: 2px;
  background-color:rgba(255,255,255,0.7);
  /*box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/
  transition: box-shadow 0.3s cubic-bezier(.25,.8,.25,1);
  width: 450px;
  width: 100%;
  display: block;
  max-width: 500px;
  margin: 16px auto;
  vertical-align: top;
  position: relative;
  }
  
  
  .itrac-record-row .chip-wide{
      margin: 16px 0px;
  }
  
  
  .chip-wide:hover {
      cursor: pointer;
      box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  }
  .chip-wide .action-btn {
     position:absolute;
     top:0px;
     right:0px;
     z-index:200;	
     opacity:0;
  }
  .chip-wide:hover .action-btn{
      opacity:1.0;
  }
  
  .chip-wide:focus-within .action-btn{
      opacity:1.0;
  }
  
  .chip-wide.focus-within .action-btn{
      opacity:1.0;
  }
  
  .chip-wide .thumb_contain{
      border-bottom:1px solid #dddddd;
      height:140px;
      text-align:center;
      position:relative;
      overflow:hidden;
      background-color:rgba(230, 235, 239, 1);
      background-size: 50%;
      background-position: center;
      background-repeat: no-repeat;
      transition: background-image 1s 1s ease-in-out;
  }
  .chip-wide .doc_thumb{
      position: relative;
      display: block;
      top: 50%;
      margin: auto;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
  }
  .chip-wide .doc_detail{
      display: flex;
      flex-direction: row;
      align-items: center;
      height:50px;
      padding:4px 6px;
      color: #333333;
      margin-left:-1px;
      margin-right:-1px;
      border-bottom-left-radius: 2px;
      border-bottom-right-radius: 2px;
  }
  .chip-wide .chip-icon{
      width: 36px;
      height: 36px;
      text-align: center;
      margin-right: 14px;
      margin-left: 6px;
  }
  .chip-wide .chip-icon img{
      width: 26px;
      height: 26px;	
  }
  .chip-wide .doc-info-contain{
      overflow: hidden;
      max-width: 100%;
      padding: 0px 26px 0px 0px;
  }
  .chip-wide .doc_name{
      max-width: 190px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      font-size:7pt;
      font-weight:bold;
  }
  .chip-wide .doc_filename{
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 10pt;
  font-weight: lighter;
  }
  .chip-wide .doc_date{
  font-size: 8pt;
  padding: 0px;
  color: rgba(0,0,0,0.5);
  }
  .chip-wide .md-checkbox-contain{
      position:absolute;
      top:0;
      right:0;
      opacity:0;	
  }
  
  .chip-wide:hover .md-checkbox-contain{
      opacity:1.0;
  }
  
  .chip-wide:focus-within .md-checkbox-contain {
      opacity:1.0;
  }
  
  .chip-wide.focus-within .md-checkbox-contain {
      opacity:1.0;
  }
  
  .chip-wide .thumb_select .doc_detail {
      background-color: #337ab7;
      color: #ffffff;
      text-shadow: none;
  }
  
  .chip-wide .thumb_select .md-checkbox-contain {
      opacity:1.0;	
  }
  
  .chip-wide .thumb_select .md-checkbox-contain {
      opacity:1.0;	
  }
  
  
  
  /*-------- list ------- */
  
  .chip-list {
  transition: background-color 0.3s cubic-bezier(.25,.8,.25,1);
  width: 100%;
  display: block;
  border-bottom: 1px solid #d0d0d0;
  vertical-align: top;
  position: relative;
  }
  
  .chip-list:last-child {
  border-bottom: none;
  }
  
  .chip-list:hover {
      cursor: pointer;
      background-color: rgba(0,0,0,0.06);
  }
  .chip-list .action-btn {
      position: absolute;
      top: auto;
      right: 6px;
      z-index: 200;
      min-width:32px;
      width:40px;
      min-height:32px;
      height:40px;
      padding:6px;
   /*  opacity:0;*/
  }
  
  .chip-list .action-btn svg {
      width: 20px;
      height: 20px;
  }
  /*.chip-list:hover .action-btn{
      opacity:1.0;
  }
  
  .chip-list:focus-within .action-btn{
      opacity:1.0;
  }
  
  .chip-list.focus-within .action-btn{
      opacity:1.0;
  }*/
  .chip-list .doc_detail{
      display: flex;
      flex-direction: row;
      align-items: center;
      height:50px;
      padding:4px 6px;
      color: #333333;
      margin-left:-1px;
      margin-right:-1px;
      border-bottom-left-radius: 2px;
      border-bottom-right-radius: 2px;
  }
  .chip-list .chip-icon{
      width: 32px;
      height: 32px;
      margin-right: 14px;
      margin-left: 6px;
  }
  .chip-list .chip-icon img{
      max-width: 32px;
      max-height: 32px;
      border-radius:4px;
  }
  .chip-list .doc-info-contain{
      overflow: hidden;
      max-width: 100%;
      padding: 0px 26px 0px 0px;
  }
  .chip-list .doc_name{
      max-width: 190px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      font-size:7pt;
      font-weight:bold;
  }
  .chip-list .doc_filename{
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 10pt;
  font-weight: lighter;
  }
  .chip-list .doc_date{
  font-size: 8pt;
  padding: 0px;
  color: rgba(0,0,0,0.5);
  }
  .chip-list .thumb_select .doc_detail {
      background-color: #337ab7;
      color: #ffffff;
      text-shadow: none;
  }
  .chip-list .b-lazy{
    max-width: 32px;	
  }
  
  
  
  .doc-icons{
      height: auto;
      width: 120px;
      vertical-align:middle;
      white-space: nowrap;
      text-align: right;
  }
  .docman-dz-filename{
      width:280px;
      white-space: nowrap;
      text-overflow: ellipsis;
  }
  .docman-dz-size{
      font-size: 8pt;
      padding: 0px;
      color: rgba(0,0,0,0.5);
  }
  .docman-dz-size-dtl{
      display:inline-block;
  }
  .doc-icons .md-button{
      vertical-align:middle;
  }
  
  .docman-dz-error-mark{
      width: 24px;
      height: 24px;
      display: none;
      text-align: center;
      vertical-align: middle;
  }
  .docman-dz-error-mark svg{
      fill: #CC0000;
  }
  .docman-dz-success-mark{
      width: 24px;
      height: 24px;
      display: none;
      text-align: center;
      vertical-align: middle;
  }
  .docman-dz-success-mark svg{
      fill: #22af2d;
  }
  .docman-dz-preview.dz-error .docman-dz-error-mark{
      display:inline-block;
  }
  .docman-dz-preview.dz-success .docman-dz-success-mark{
      display:inline-block;
  }
  
  .docman-dz-cancel{
      opacity:1;
      z-index:200;
  }
  .docman-dz-cancel *{
      cursor:pointer!important;
  }
  .docman-dz-pause{
      
  }
  .docman-dz-pause *{
      cursor:pointer!important;
  }
  .docman-dz-resume{
      display:none;
  }
  .docman-dz-resume *{
      cursor:pointer!important;
  }
  .docman-dz-preview.dz-success .docman-dz-pause, 
  .docman-dz-preview.dz-error .docman-dz-pause{
      display:none;
  }	
  
  .docman-dz-error-message{
      margin-left: 50px;
      margin-bottom: 5px;
      font-size: 10pt;
      color: #CC0000;
  }
  
  .docman-dz-progress{
      margin:0px;
  }
  
  .dz-success .docman-dz-progress,
  .dz-success .docman-dz-cancel{
      display:none;
  }
  
  .dz-error .docman-dz-process{
      display:none;
  }
  
  
  /*------ Material Button --------*/
  
  .primary-btn {
      cursor: pointer;
      position: relative;
      height: 40px;
      line-height:36px;
      display: inline-block;
      padding: 0px 8px;
      vertical-align:middle;
  
      overflow: hidden;
  
      border-width: 0;
      border-radius: 2px;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
      transition: box-shadow 0.3s cubic-bezier(.25,.8,.25,1), background-color .3s;
      
      background-color: #337ab7;
      color: #ecf0f1;
  }
  
  .primary-btn:hover, .primary-btn:focus {
      background-color: #4497de;
      box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);	
  }
  
  .primary-btn > * {
      position: relative;
  }
  
  .primary-btn span {
      display: block;
      padding: 0px 10px;
  }
  
  .primary-btn svg{
      vertical-align:middle;
      display:inline-block;
  }
  
  .primary-btn:before {
      content: "";
    
      position: absolute;
      top: 50%;
      left: 50%;
    
      display: block;
      width: 0;
      padding-top: 0;
      
      border-radius: 100%;
    
      background-color: rgba(236, 240, 241, .3);
    
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  }
  
  .primary-btn:active:before {
      width: 120%;
      padding-top: 120%;
      transition: width .2s ease-out, padding-top .2s ease-out;
  }
  .primary-txt{
      vertical-align:middle;
      display:inline;
  }
  
  /* outline-btn */
  
  .outline-btn {
      position: relative;
      display: inline-block;
      box-sizing: border-box;
      border: solid 1px;
      border-color: rgba(var(--itrac-material-onsurface-rgb, 0, 0, 0), 0.24);
      border-radius: 4px;
      padding: 3px 16px;
      height:40px;
      min-width: 64px;
      vertical-align: middle;
      text-align: center;
      text-overflow: ellipsis;
      text-transform: uppercase;
      background-color: transparent;
      font-family: var(--itrac-material-font, "Roboto", "Segoe UI", BlinkMacSystemFont, system-ui, -apple-system);
      font-size: 14px;
      font-weight: 500;
      overflow: hidden;
      outline: none;
      cursor: pointer;
  }
  
  .outline-btn.hasIcon{
      padding-left:6px;
  }
  
  
  .outline-btn.primary{
      color: rgb(var(--itrac-material-primary-rgb, 33, 150, 243));
      fill: rgb(var(--itrac-material-primary-rgb, 33, 150, 243));
  }
  
  .outline-btn svg{
      vertical-align:middle;
      display:inline-block;
      margin:3px;
  }
  .outline-btn span{
      display:inline-block;
      vertical-align:middle;
      line-height:16px;
  }
  
  .outline-btn::-moz-focus-inner {
      border: none;
  }
  
  /* Overlay */
  .outline-btn::before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      background-color: currentColor;
      opacity: 0;
      transition: opacity 0.2s;
  }
  
  /* Ripple */
  .outline-btn::after {
      content: "";
      position: absolute;
      left: 50%;
      top: 50%;
      border-radius: 50%;
      padding: 50%;
      width: 32px;
      height: 32px;
      background-color: currentColor;
      opacity: 0;
      transform: translate(-50%, -50%) scale(1) ;
      transition: opacity 1s, transform 0.5s;
  }
  
  /* Hover, Focus */
  .outline-btn:hover::before {
      opacity: 0.04;
  }
  
  .outline-btn:focus::before {
      opacity: 0.12;
  }
  
  .outline-btn:hover:focus::before {
      opacity: 0.16;
  }
  
  /* Active */
  .outline-btn:active::after {
      opacity: 0.16;
      transform: translate(-50%, -50%) scale(0);
      transition: transform 0s;
  }
  
  /* Disabled */
  .outline-btn:disabled {
      color: rgba(var(--itrac-material-onsurface-rgb, 0, 0, 0), 0.38);
      background-color: transparent;
      cursor: initial;
      fill: rgba(var(--itrac-material-onsurface-rgb, 0, 0, 0), 0.38);
  }
  
  .outline-btn:disabled::before,
  .outline-btn:disabled::after {
      opacity: 0;
  }
  
  .itrac-data-table-header.mini .primary-btn{
      height: 32px;
      line-height: 28px;
      align-self:center;
  }
  
  
  
  @media all and (max-width:844px){
      .primary-txt{
          display:none;
      }
  }
  @media all and (min-width:845px){
      .primary-txt{
          display:inline-block;
      }
  }
  
  
  /*-- b-lazy ---*/
  .b-lazy {
      -webkit-transition: opacity 500ms ease-in-out, width 500ms cubic-bezier(.17,.67,.83,.67), height 500ms cubic-bezier(.17,.67,.83,.67);
      -moz-transition: opacity 500ms ease-in-out, width 500ms cubic-bezier(.17,.67,.83,.67), height 500ms cubic-bezier(.17,.67,.83,.67);
      -o-transition: opacity 500ms ease-in-out, width 500ms cubic-bezier(.17,.67,.83,.67), height 500ms cubic-bezier(.17,.67,.83,.67);
      transition: opacity 500ms ease-in-out, width 500ms cubic-bezier(.17,.67,.83,.67), height 500ms cubic-bezier(.17,.67,.83,.67);
      max-width: 100%;
      opacity: 0;
  }
  .b-lazy.b-loaded{
      opacity: 1;
  }
  
  .chip-tile .b-lazy.b-loaded{
      max-width: 200px;
      max-height: 200px;
      width: auto;
      height: auto;
      opacity: 1;
  }
  
  .chip-wide .b-lazy.b-loaded{
      max-height: 140px;
      width: auto;
      height: auto;
      opacity: 1;
  }
  
  .semitransparent{
          opacity:0.5;
  }
  
  
  /*-- transition effect -- removeable --*/
  
  .removable{
     transition: margin-left 1.3s cubic-bezier(.25,.8,.25,1),opacity 0.6s 0.6s cubic-bezier(.25,.8,.25,1);
  }
  
  .removeLeft{
    margin-left: -200%;
    opacity: 0;
  }
  
  
  
  .inline-splash{
  display: inline-block;
  vertical-align: middle;
  padding-left: 6px;
  text-align: left;
  }
  
  svg.inline-splash{
      display:inline-block;
      padding-left:6px;
      opacity: 0.6;
      text-align:center;
      vertical-align: bottom;
  }
  
  .inline-splash .splash-label{
      display:inline-block !important;
      line-height: 32px !important;
      font-size: 26px;
      margin:0px!important;
  }
  
  .inline-splash.dense .splash-label{
      font-size:18px;
  }
  
  .inline-splash .splash-subtext{
      display: inline-block;
      vertical-align: bottom;
      margin: 2px 0px 5px 0px;
  }
  
  .inline-splash button{
      text-transform:none;
  }
  
  .full-width{
      display:block!important;
      width:100%!important;
  }
  
  .inline-splash.dense button{
      text-transform: none;
      padding: 2px 10px;
      height: 30px;
  }
  
  .item-drop-doc-area .dropzone{
      min-height:auto;
      border: 1px dashed rgba(0,0,0,0.3);
      padding:15px;
      max-width:510px;
      border-radius: 3px;
  }
  .item-drop-doc-area .dropzone.dz-drag-hover{
      border-color: rgb(3,169,244);
      background-color: rgba(3,169,244,0.05);
  }
  
  .item-drop-doc-area .dropzone .dz-message{
      margin:0em;
      text-align:center;
  }
  
  .doc-tile-scroll .item-docs-container{
      overflow-x: auto;
      white-space: nowrap;
  }
  
  .empty-state-medium-msg{
      text-align:center;
      margin:auto;
      margin-top:2em;
      margin-bottom:2em;
      width: 100%;
  }
  
  .empty-state-medium-msg h2{
      margin:auto;
      margin-top:0.5em;
      font-weight:lighter;
      font-size:20pt;	
  }
  
  .empty-state-medium-msg h4{
      font-weight:lighter;
  }
  
  
  
  
  /* Loader */
  .loader {
      position: relative;
      float: right;
      width: 30px;
      margin-left:10px;
      margin-top:2px;
  }
  
  .loader:before {
      content: '';
      display: block;
      padding-top: 100%;
  }
  
  .circular {
      -webkit-animation: rotate 2s linear infinite;
      animation: rotate 2s linear infinite;
      height: 100%;
      -webkit-transform-origin: center center;
      transform-origin: center center;
      width: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
  }
  
  .path {
      stroke-dasharray: 1, 200;
      stroke-dashoffset: 0;
      -webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
      animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
      stroke-linecap: round;
  }
  
  @-webkit-keyframes rotate {
      100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
      }
  }
  
  @keyframes rotate {
      100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
      }
  }
  
  @-webkit-keyframes dash {
      0% {
          stroke-dasharray: 1, 200;
          stroke-dashoffset: 0;
      }
      50% {
          stroke-dasharray: 89, 200;
          stroke-dashoffset: -35px;
      }
      100% {
          stroke-dasharray: 89, 200;
          stroke-dashoffset: -124px;
      }
  }
  
  @keyframes dash {
      0% {
          stroke-dasharray: 1, 200;
          stroke-dashoffset: 0;
      }
      50% {
          stroke-dasharray: 89, 200;
          stroke-dashoffset: -35px;
      }
      100% {
          stroke-dasharray: 89, 200;
          stroke-dashoffset: -124px;
      }
  }
  
  @-webkit-keyframes color {
      100%,
      0% {
          stroke: #ffffff;
      }
      40% {
          stroke: #ffffff;
      }
      66% {
          stroke: #ffffff;
      }
      80%,
      90% {
          stroke: #ffffff;
      }
  }
  
  @keyframes color {
      100%,
      0% {
          stroke: #ffffff;
      }
      40% {
          stroke: #ffffff;
      }
      66% {
          stroke: #ffffff;
      }
      80%,
      90% {
          stroke: #ffffff;
      }
  }