.max-w-xl{max-width:100%}

/* Preloaders ================================== */
.md-preloader .pl-red {
    stroke: #F44336; }
  
  .md-preloader .pl-pink {
    stroke: #E91E63; }
  
  .md-preloader .pl-purple {
    stroke: #9C27B0; }
  
  .md-preloader .pl-deep-purple {
    stroke: #673AB7; }
  
  .md-preloader .pl-indigo {
    stroke: #3F51B5; }
  
  .md-preloader .pl-blue {
    stroke: #2196F3; }
  
  .md-preloader .pl-light-blue {
    stroke: #03A9F4; }
  
  .md-preloader .pl-cyan {
    stroke: #00BCD4; }
  
  .md-preloader .pl-teal {
    stroke: #009688; }
  
  .md-preloader .pl-green {
    stroke: #4CAF50; }
  
  .md-preloader .pl-light-green {
    stroke: #8BC34A; }
  
  .md-preloader .pl-lime {
    stroke: #CDDC39; }
  
  .md-preloader .pl-yellow {
    stroke: #ffe821; }
  
  .md-preloader .pl-amber {
    stroke: #FFC107; }
  
  .md-preloader .pl-orange {
    stroke: #FF9800; }
  
  .md-preloader .pl-deep-orange {
    stroke: #FF5722; }
  
  .md-preloader .pl-brown {
    stroke: #795548; }
  
  .md-preloader .pl-grey {
    stroke: #9E9E9E; }
  
  .md-preloader .pl-blue-grey {
    stroke: #607D8B; }
  
  .md-preloader .pl-black {
    stroke: #000000; }
  
  .md-preloader .pl-white {
    stroke: #ffffff; }
  
  .preloader {
    display: inline-block;
    position: relative;
    width: 50px;
    height: 50px;
    -webkit-animation: container-rotate 1568ms linear infinite;
    -moz-animation: container-rotate 1568ms linear infinite;
    -o-animation: container-rotate 1568ms linear infinite;
    animation: container-rotate 1568ms linear infinite; }
    .preloader.pl-size-xl {
      width: 75px;
      height: 75px; }
    .preloader.pl-size-l {
      width: 60px;
      height: 60px; }
    .preloader.pl-size-md {
      width: 50px;
      height: 50px; }
    .preloader.pl-size-sm {
      width: 40px;
      height: 40px; }
    .preloader.pl-size-xs {
      width: 25px;
      height: 25px; }
  
  .spinner-layer {
    position: absolute;
    width: 100%;
    height: 100%;
    border-color: #F44336;
    -ms-opacity: 1;
    opacity: 1;
    -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
    -moz-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
    -o-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
    animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
    .spinner-layer.pl-red {
      border-color: #F44336; }
    .spinner-layer.pl-pink {
      border-color: #E91E63; }
    .spinner-layer.pl-purple {
      border-color: #9C27B0; }
    .spinner-layer.pl-deep-purple {
      border-color: #673AB7; }
    .spinner-layer.pl-indigo {
      border-color: #3F51B5; }
    .spinner-layer.pl-blue {
      border-color: #2196F3; }
    .spinner-layer.pl-light-blue {
      border-color: #03A9F4; }
    .spinner-layer.pl-cyan {
      border-color: #00BCD4; }
    .spinner-layer.pl-teal {
      border-color: #009688; }
    .spinner-layer.pl-green {
      border-color: #4CAF50; }
    .spinner-layer.pl-light-green {
      border-color: #8BC34A; }
    .spinner-layer.pl-lime {
      border-color: #CDDC39; }
    .spinner-layer.pl-yellow {
      border-color: #ffe821; }
    .spinner-layer.pl-amber {
      border-color: #FFC107; }
    .spinner-layer.pl-orange {
      border-color: #FF9800; }
    .spinner-layer.pl-deep-orange {
      border-color: #FF5722; }
    .spinner-layer.pl-brown {
      border-color: #795548; }
    .spinner-layer.pl-grey {
      border-color: #9E9E9E; }
    .spinner-layer.pl-blue-grey {
      border-color: #607D8B; }
    .spinner-layer.pl-black {
      border-color: #000000; }
    .spinner-layer.pl-white {
      border-color: #ffffff; }
  
  .right {
    float: right !important; }
  
  .gap-patch {
    position: absolute;
    top: 0;
    left: 45%;
    width: 10%;
    height: 100%;
    overflow: hidden;
    border-color: inherit; }
    .gap-patch.circle {
      width: 1000%;
      left: -450%; }
  
  .circle-clipper {
    display: inline-block;
    position: relative;
    width: 50%;
    height: 100%;
    overflow: hidden;
    border-color: inherit; }
    .circle-clipper .circle {
      width: 200%;
      height: 100%;
      border-width: 3px;
      border-style: solid;
      border-color: inherit;
      border-bottom-color: transparent !important;
      -ms-border-radius: 50%;
      border-radius: 50%;
      -webkit-animation: none;
      animation: none;
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0; }
    .circle-clipper.left .circle {
      left: 0;
      border-right-color: transparent !important;
      -webkit-transform: rotate(129deg);
      -moz-transform: rotate(129deg);
      -ms-transform: rotate(129deg);
      -o-transform: rotate(129deg);
      transform: rotate(129deg);
      -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
      -moz-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
      -o-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
      animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
    .circle-clipper.right .circle {
      left: -100%;
      border-left-color: transparent !important;
      -webkit-transform: rotate(-129deg);
      -moz-transform: rotate(-129deg);
      -ms-transform: rotate(-129deg);
      -o-transform: rotate(-129deg);
      transform: rotate(-129deg);
      -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
      -moz-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
      -o-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
      animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
  
  @-webkit-keyframes container-rotate {
    to {
      -webkit-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg); } }
  
  @keyframes container-rotate {
    to {
      -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg); } }
  
  @-webkit-keyframes fill-unfill-rotate {
    12.5% {
      -webkit-transform: rotate(135deg);
      transform: rotate(135deg); }
    25% {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg); }
    37.5% {
      -webkit-transform: rotate(405deg);
      transform: rotate(405deg); }
    50% {
      -webkit-transform: rotate(540deg);
      transform: rotate(540deg); }
    62.5% {
      -webkit-transform: rotate(675deg);
      transform: rotate(675deg); }
    75% {
      -webkit-transform: rotate(810deg);
      transform: rotate(810deg); }
    87.5% {
      -webkit-transform: rotate(945deg);
      transform: rotate(945deg); }
    to {
      -webkit-transform: rotate(1080deg);
      transform: rotate(1080deg); } }
  
  @keyframes fill-unfill-rotate {
    12.5% {
      transform: rotate(135deg); }
    25% {
      transform: rotate(270deg); }
    37.5% {
      transform: rotate(405deg); }
    50% {
      transform: rotate(540deg); }
    62.5% {
      transform: rotate(675deg); }
    75% {
      transform: rotate(810deg); }
    87.5% {
      transform: rotate(945deg); }
    to {
      transform: rotate(1080deg); } }
  
  @-webkit-keyframes left-spin {
    from {
      -webkit-transform: rotate(130deg);
      -moz-transform: rotate(130deg);
      -ms-transform: rotate(130deg);
      -o-transform: rotate(130deg);
      transform: rotate(130deg); }
    50% {
      -webkit-transform: rotate(-5deg);
      -moz-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
      -o-transform: rotate(-5deg);
      transform: rotate(-5deg); }
    to {
      -webkit-transform: rotate(130deg);
      -moz-transform: rotate(130deg);
      -ms-transform: rotate(130deg);
      -o-transform: rotate(130deg);
      transform: rotate(130deg); } }
  
  @keyframes left-spin {
    from {
      -moz-transform: rotate(130deg);
      -ms-transform: rotate(130deg);
      -o-transform: rotate(130deg);
      -webkit-transform: rotate(130deg);
      transform: rotate(130deg); }
    50% {
      -moz-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
      -o-transform: rotate(-5deg);
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg); }
    to {
      -moz-transform: rotate(130deg);
      -ms-transform: rotate(130deg);
      -o-transform: rotate(130deg);
      -webkit-transform: rotate(130deg);
      transform: rotate(130deg); } }
  
  @-webkit-keyframes right-spin {
    from {
      -webkit-transform: rotate(-130deg);
      -moz-transform: rotate(-130deg);
      -ms-transform: rotate(-130deg);
      -o-transform: rotate(-130deg);
      transform: rotate(-130deg); }
    50% {
      -webkit-transform: rotate(5deg);
      -moz-transform: rotate(5deg);
      -ms-transform: rotate(5deg);
      -o-transform: rotate(5deg);
      transform: rotate(5deg); }
    to {
      -webkit-transform: rotate(-130deg);
      -moz-transform: rotate(-130deg);
      -ms-transform: rotate(-130deg);
      -o-transform: rotate(-130deg);
      transform: rotate(-130deg); } }
  
  @-moz-keyframes right-spin {
    from {
      -moz-transform: rotate(-130deg);
      -ms-transform: rotate(-130deg);
      -o-transform: rotate(-130deg);
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg); }
    50% {
      -moz-transform: rotate(5deg);
      -ms-transform: rotate(5deg);
      -o-transform: rotate(5deg);
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg); }
    to {
      -moz-transform: rotate(-130deg);
      -ms-transform: rotate(-130deg);
      -o-transform: rotate(-130deg);
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg); } }
  
  @keyframes right-spin {
    from {
      -moz-transform: rotate(-130deg);
      -ms-transform: rotate(-130deg);
      -o-transform: rotate(-130deg);
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg); }
    50% {
      -moz-transform: rotate(5deg);
      -ms-transform: rotate(5deg);
      -o-transform: rotate(5deg);
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg); }
    to {
      -moz-transform: rotate(-130deg);
      -ms-transform: rotate(-130deg);
      -o-transform: rotate(-130deg);
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg); } }

      .widgetArea .datagrid-header td, .widgetArea .datagrid-body td, .widgetArea .datagrid-footer td{border-style: solid} .widgetArea .datagrid-header td, .widgetArea .datagrid-body td, .widgetArea .datagrid-footer td{border-color: #ccc} .widgetArea .datagrid-header td, .widgetArea .datagrid-body td, .widgetArea .datagrid-footer td{border-width: 0 1px 1px 0;border-style: dotted;margin: 0;padding: 0;} .widgetArea .datagrid-htable, .widgetArea .datagrid-btable, .widgetArea .datagrid-ftable {color: #404040;border-collapse: separate;} .widgetArea .datagrid-cell-group, .widgetArea .datagrid-header .datagrid-cell{color:#555}
      .widgetArea .datagrid-header {overflow: hidden;cursor: default;border-width: 0 0 1px 0;border-style: solid;}
      .messager-body{height:auto!important} .messager-body, .dialog-button.messager-button{width:100%!important;height:auto!important;padding:10px 15px 5px 10px}

      .messager-window{max-width:600px!important;width:100%!important;top:75px!important;position:fixed!important;left:calc((100% - 600px)/2)!important} .confirmFullWidthBtn .messager-icon{display:none!important} ._t{position:fixed!important;box-shadow:0 0px 0px 0px rgba(0,0,0,.2), 0 1px 8px 0px rgba(0,0,0,.14), 0 2px 2px 0px rgba(0,0,0,.12);top:45px!important}
      .confirmFullWidthBtn a.l-btn{width:100%!important;margin:0px!important;margin-bottom:5px!important;} .window-shadow{display:none!important} .window .window-header{background:#f0f2f5;border-radius:4px 4px 0 0} /*div#appMessager{height:auto!important}*/
      .messager-info, .messager-warning, .messager-error, .messager-question{left:3px!important}

      .min-h-screen.bg-gray-100{overflow-y:scroll;height:100%} span.tick-label.tick-text{margin-left:35px!important;font-size:20px}

      @media (max-width: 601px){
        #appMessager footer{top:-46px} ._t{top:0px!important} ._t.window{width:100%!important;height:100%!important}
        .messager-window{max-width:100%!important;width:100%!important;top:0px!important;position:fixed!important;left:0px!important}
        #messagerPrompt{height:calc(100vh - 85px)!important}
      }