html,body{
    height:100%;
     min-height:100%; 
    }
.background.img-bg {
    min-height: 100vh;
    background-image: url('../images/home.jpg');
    background-size: cover;
    background-position: top center;
    margin: 0;
}

.login-center {
    margin: 100px auto 0;
    z-index: 11;
}
.layer.layer-bg {
    /* position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    display: block; */
    min-height: 100vh;
    background: rgba(0,0,0,.5);
}
/* .layer:before,
.layer:after {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    content: "";
} */
.wrapper-full-page .page-header{
    padding: 0!important;
}
.page-header{
    align-items: unset;
}
.root-main-content{
    padding: 20px;
    width: 100%;
    z-index: 11;
}
.redirector{
    margin-top: 150px;
}
.login-head{
    display: inline-block;
    color: #ffffff;
    font-weight: 600;
    letter-spacing: 4px;
    padding: 5px 100px;
    border-bottom: 1px solid #ffffff;
}
.button-overlay{
    display: inline-block;
    margin: 0 10px;
    padding: 10px 10px;
    background: rgba(0,0,0, .4);
}
.button-overlay>button{
    padding: 10px 80px;
}

.wh-20{
    width: 20px;
    height: 20px;
}
.wh-30{
    width: 30px;
    height: 30px;
}
.wh-40{
    width: 40px;
    height: 40px;
}
.wh-50{
    width: 50px;
    height: 50px;
}
.wh-60{
    width: 60px;
    height: 60px;
}
.wh-70{
    width: 70px;
    height: 70px;
}
.wh-80{
    width: 80px;
    height: 80px;
}
.wh-90{
    width: 90px;
    height: 90px;
}
.wh-100{
    width: 100px;
    height: 100px;
}
.text-bold-600 {
    font-weight: 600;
}
strong{
  font-weight: 600;
  font-size: .985rem;
  color: #68717d;
}
.img-round{
    border-radius: 50%;
}
table>thead>tr>th{
    color: #3c4858;
    font-size: inherit !important;
    font-weight: 600 !important;
}
table.dataTable{
    margin-bottom: 40px!important;
}
.dataTables_length .custom-select.custom-select-sm{
    padding: 10px;
}
.section-head{
    color: #fff;
    margin: 0 15px 20px;
    padding: 15px;
    position: relative;
    border-radius: 3px;
}
.header-rose{
    background: linear-gradient(60deg,#ec407a,#d81b60);
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(233,30,99,.4);
}
.header-info{
    background: linear-gradient(60deg,#26c6da,#00acc1);
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(0,188,212,.4);
}
.header-primary{
    background: linear-gradient(60deg,#ab47bc,#8e24aa);
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(156,39,176,.4);
}
.section-head>i{
    margin-right: 10px;
    position: relative;
    display: inline-block;
    top: 0;
    margin-top: -1em;
    margin-bottom: -0.85em;
    vertical-align: middle;
}
/* ///////////////// Nav Bar ///////////////////// */
.navbar .navbar-brand{
    padding: 0.625rem 25px;
    margin: 0;
}
.navbar .navbar-brand>span{
    display: inline-block;
    margin-right: 10px;
}
.nav-pills.nav-pills-rose .nav-item .nav-link.active,
.nav-pills.nav-pills-rose .nav-item .nav-link.active:focus,
.nav-pills.nav-pills-rose .nav-item .nav-link.active:hover{
    background: linear-gradient(60deg,#ec407a,#d81b60);
}
/* ////////////////////////////////////////////// */

/* //////////////// Side bar ///////////////////////// */
.sidebar{
    background-color: #ffffff;
    box-shadow: 0 16px 13px -12px rgba(0,0,0,.56), 0 4px 25px 0 rgba(0,0,0,.12), 0 8px 10px -5px rgba(0,0,0,.2);
}
.sidebar .sidebar-wrapper{
  overflow-x: hidden;
}
.sidebar .logo .simple-text{
    text-align: left;
}
.simple-text.logo-mini{
    opacity: 1;
    float: left;
    width: 30px;
    margin-left: 23px;
    margin-right: 15px;
}
.sidebar .logo .simple-text.logo-normal{
    display: block;;
    opacity: 1;
    transform: translateZ(0);
}
.sidebar .nav li.active>[data-toggle=collapse]{
    border-left: 3px solid #e02b6b;
}
/* //////////// Sidebar mini ////////////// */
.sidebar-mini .sidebar .nav li a{
    padding: 10px;
}
/* ///////////////////////////////////////// */

/* ///////////////////// theme Setting ///////////////// */
.main-panel {
    background: #eeeeee;
    z-index: 11;
}
.fixed-plugin{
    top: 65px;
}
.fixed-plugin .dropdown .dropdown-menu{
    top: -18px!important;
}
.fixed-plugin .dropdown-menu:before, .fixed-plugin .dropdown-menu:after{
    top: 45px;
}
.fixed-plugin .dropdown .dropdown-menu li.adjustments-line{
    border-bottom: none;
}
.footer .copyright{
    padding: 40px 0 0;
}
/* ////////////////////////////////////////////////////// */
.icon-btn{
    cursor: pointer;
}
/* NOTIFICATION MENU */
.dropdown-menu.notifications-dropdown{
  width: 30rem;
  padding: 0;
}
.notifications-head{
  margin: 0;
  padding: 5px;
  text-align: center;
  background-color: #e91e63;
  color: #fff;
}
.nav.notifications-nav-tabs{
  padding: 0;
  border-bottom: 1px solid transparent;
  background-color: #e91e63;
  border-radius: 0;
}
.nav.notifications-nav-tabs.nav-tabs-rose{
  background-color: #e91e63;
}
.nav.notifications-nav-tabs .nav-item .nav-link{
  margin: 0;
}
.nav.notifications-nav-tabs .nav-item .nav-link.active {
  margin: 0;
  /* border-color: #ADB5BD #ADB5BD #F1F1F1; */
  border: 1px solid transparent;
  background: #fff;
  color: #000!important;
  border-radius: .25rem .25rem 0 0;
}
.nav.notifications-nav-tabs .nav-item .nav-link:hover,
.nav.notifications-nav-tabs .nav-item .nav-link:focus{
  box-shadow: none;
}
/* ////////////////////// MODAL General ///////////// */
.modal .modal-dialog {
    margin-top: 25px;
}
.modal-title{
    font-weight: 600;
}
/* //////////////////////////////////////////// */
/* /////////////////// View Info card //////////////// */
.card [class*=card-header-]{
    padding: 1px;
}
.view-info-card .card-body{
    font-size: 12px;
}
.view-profile-img{
    margin-top: 70px;
}
/* //////////////////////////////////////////////////// */
/* /////////////////// Form //////////////////////// */
.form-control{
    padding: .4375rem 5px;
}
.form-control:focus + .bmd-help{
  display: block;
}
.form-control, .is-focused .form-control {
    background-image: linear-gradient(0deg,#4caf50 2px,rgba(76, 175, 80,0) 0),linear-gradient(0deg,#d2d2d2 1px,hsla(0,0%,82%,0) 0);
}
.bootstrap-select .btn.dropdown-toggle.select-with-transition {
    border: 0!important;
    background-image: linear-gradient(0deg,#e91e63 2px,rgba(156,39,176,0) 0),linear-gradient(0deg,#d2d2d2 1px,hsla(0,0%,82%,0) 0);
}
div.primary .bootstrap-select .dropdown-item.active,
div.primary .bootstrap-select .dropdown-menu .dropdown-item:hover{
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(156,39,176,.4);
    background-color: #9c27b0;
}
div.rose .bootstrap-select .dropdown-item.active,
div.rose .bootstrap-select .dropdown-menu .dropdown-item:hover {
    background: linear-gradient(60deg,#ec407a,#d81b60);
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(233,30,99,.4);
    color: #fff;
}
.navbar[data-color="azure"] .dropdown-menu .dropdown-item:focus, 
.navbar[data-color="azure"] .dropdown-menu .dropdown-item:hover, 
.navbar[data-color="azure"] .dropdown-menu a:active, 
.navbar[data-color="azure"] .dropdown-menu a:focus, 
.navbar[data-color="azure"] .dropdown-menu a:hover,
.dropdown[data-color="azure"] .dropdown-menu .dropdown-item:focus, 
.dropdown[data-color="azure"] .dropdown-menu .dropdown-item:hover, 
.dropdown[data-color="azure"] .dropdown-menu a:active, 
.dropdown[data-color="azure"] .dropdown-menu a:focus, 
.dropdown[data-color="azure"] .dropdown-menu a:hover,
button[data-color="azure"],
button[data-color="azure"]:hover,
button[data-color="azure"]:active,
button[data-color="azure"]:focus {
    background-color: #00bcd4;
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(0,188,212,.4);
    color: #fff;
}
.navbar[data-color="purple"] .dropdown-menu .dropdown-item:focus, 
.navbar[data-color="purple"] .dropdown-menu .dropdown-item:hover, 
.navbar[data-color="purple"] .dropdown-menu a:active, 
.navbar[data-color="purple"] .dropdown-menu a:focus, 
.navbar[data-color="purple"] .dropdown-menu a:hover,
.dropdown[data-color="purple"] .dropdown-menu .dropdown-item:focus, 
.dropdown[data-color="purple"] .dropdown-menu .dropdown-item:hover, 
.dropdown[data-color="purple"] .dropdown-menu a:active, 
.dropdown[data-color="purple"] .dropdown-menu a:focus, 
.dropdown[data-color="purple"] .dropdown-menu a:hover,
button[data-color="purple"],
button[data-color="purple"]:hover,
button[data-color="purple"]:active,
button[data-color="purple"]:focus
 {
    background-color: #9c27b0;
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(156,39,176,.4);
    color: #fff;
}
.navbar[data-color="rose"] .dropdown-menu .dropdown-item:focus, 
.navbar[data-color="rose"] .dropdown-menu .dropdown-item:hover, 
.navbar[data-color="rose"] .dropdown-menu a:active, 
.navbar[data-color="rose"] .dropdown-menu a:focus, 
.navbar[data-color="rose"] .dropdown-menu a:hover,
.dropdown[data-color="rose"] .dropdown-menu .dropdown-item:focus, 
.dropdown[data-color="rose"] .dropdown-menu .dropdown-item:hover, 
.dropdown[data-color="rose"] .dropdown-menu a:active, 
.dropdown[data-color="rose"] .dropdown-menu a:focus, 
.dropdown[data-color="rose"] .dropdown-menu a:hover,
button[data-color="rose"],
button[data-color="rose"]:hover,
button[data-color="rose"]:active,
button[data-color="rose"]:focus {
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(233,30,99,.4);
    background-color: #e91e63;
    color: #fff;
}
select.form-control,
select.form-control:read-only,
.bootstrap-select.form-control,
.bootstrap-select.form-control:read-only{
    background-image: none;
}
:not(.input-group)>.select-sm>.bootstrap-select.form-control:not([class*=col-]) {
    width: 80px;
}
.select-sm .bootstrap-select>.dropdown-toggle {
    padding-right: 5px;
}
.select-sm .dropdown-menu .dropdown-item, .dropdown-menu li>a{
    min-width: 2rem;
}
.select-sm>.form-control>button.btn{
    margin: .1rem 1px;
}

/* ////////////////////////////////////////// */

/* ///////// Create Form ///////////////// */
.form-elements-continer{
    padding: 2rem;
}
input[type=password]{
padding-right: 25px;
}
.password-visibility{
    float: right;
    margin-top: -30px;
    cursor: pointer;
}
.password-visibility:hover{
    cursor: pointer;
}
.card .form-check {
    margin-top: 15px;
}
.form-check.success .form-check-input:checked+.form-check-sign .check {
    background: #4caf50;
}
.form-check.rose .form-check-input:checked~.circle{
  border-color: #e91e63;
}
.form-check.rose .form-check-label .circle .check{
  background-color: #e91e63;
}
.iti{
    display: block;
}
.custom-file-label{
    white-space: nowrap;
    padding-right: 100px;
    border: 1px solid #d2d2d2;
}
.custom-file-label:after{
    background-color: #ffffff;
    border-left: 1px solid #d2d2d2;
}
.lgselect .dropdown-menu.show{
     top: 40px!important;
   width: 100%;
}
.card .card-body .form-group{
  margin: 8px 0 10px;
}
/* //////////////////////////////////////////// */
/* Date Picker According to theme  */
._720kb-datepicker-calendar-month span{
  color: #ffffff;
}
.datepicker-rose ._720kb-datepicker-calendar-header:nth-child(odd){
  background: linear-gradient(60deg,#ec407a,#d81b60);
  box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(233,30,99,.4);
}
.datepicker-info ._720kb-datepicker-calendar-header:nth-child(odd){
  background: linear-gradient(60deg,#26c6da,#00acc1);
  box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(0,188,212,.4);
}
.datepicker-primary ._720kb-datepicker-calendar-header:nth-child(odd){
  background: linear-gradient(60deg,#ab47bc,#8e24aa);
  box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(156,39,176,.4);
}
._720kb-datepicker-calendar-header a, ._720kb-datepicker-calendar-header a:hover{
  color: #ffffff;
}
.datepicker-rose ._720kb-datepicker-calendar-header:nth-child(even) {
  background: #e12c6c;
  color: #fff;
}
.datepicker-info ._720kb-datepicker-calendar-header:nth-child(even) {
  background: #16bbcf;
  color: #fff;
}
.datepicker-primary ._720kb-datepicker-calendar-header:nth-child(even) {
  background: #9b34b2;
  color: #fff;
}
/* ///////// schedule Checkboxes ////////////////// */

ul.ks-cboxtags {
  list-style: none;
  padding: 20px;
}
ul.ks-cboxtags li{
display: inline;
}
ul.ks-cboxtags li label{
  display: inline-block;
  font-size: 12px;
  background-color: rgba(255, 255, 255, .9);
  border: 2px solid rgba(139, 139, 139, .1);
  color: #adadad;
  border-radius: 25px;
  white-space: nowrap;
  margin: 3px 0px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: all .2s;
}

ul.ks-cboxtags li label {
  padding: 4px 12px;
  cursor: pointer;
}

ul.ks-cboxtags li label::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Material Icons";
  font-weight: 900;
  font-size: 12px;
  padding: 2px 6px 2px 2px;
  content: "add";
  transition: transform .3s ease-in-out;

}

ul.ks-cboxtags li input[type="checkbox"]:checked + label::before {
  content: "done";
  transform: rotate(-360deg);
  transition: transform .3s ease-in-out;
}

ul.ks-cboxtags li input[type="checkbox"]:checked + label {
  background-color: #e91e63;
  box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(233,30,99,.4);
  color: #fff;
  transition: all .2s;
}

ul.ks-cboxtags li input[type="checkbox"] {
display: absolute;
}
ul.ks-cboxtags li input[type="checkbox"] {
position: absolute;
opacity: 0;
}
/* ul.ks-cboxtags li input[type="checkbox"]:focus + label {
border: 2px solid #e9a1ff;
} */
.user-doc-container .card{
  cursor: pointer;
}
.user-doc-container .card:hover{
  box-shadow: 0 8px 10px 0 rgba(0,0,0,.14);
}
.user-doc-container .card .card-header{
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    border-bottom: 1px solid #e6e6e6;
}
.user-doc-container .card .card-body{
text-align: center;
}
.user-doc-container .card .card-body i{
  font-size: 70px;
  opacity: 0.2;

}
.user-doc-container .card .card-footer{
  font-size: 12px;
}

.user-doc-container .card .card-footer i{
  vertical-align: text-bottom;
  font-size: 16px;
  color: #2a62ff;

}
.news-item{
  padding: 10px 20px;
  margin-bottom: 20px;
  border: 1px solid #e6e6e6;
}
.news-link{
  padding: 2px 10px;
    background: #f2f2f2;
    font-weight: 600;
    border-radius: 5px;
    border: 1px solid #e6e6e6;
}
.news-description{
  display: inline-block;
  margin-right: 10px;
}
















/* ////////////////// Custom Scroller /////////////////// */
::-webkit-scrollbar-track{
    -webkit-box-shadow: none;
    box-shadow: none;
	border-radius: 10px;
	background-color: #eeeeee;
}

::-webkit-scrollbar{
    width: 6px;
    background-color: transparent;
    box-shadow: none;
}

::-webkit-scrollbar-thumb{
	border-radius: 10px;
    background-color: rgba(230, 230, 230, .4);
}
::-webkit-scrollbar-thumb:hover{
    background-color: #8f8f8f;
    background-color: rgba(230, 230, 230, 1);
}

ul.iti__country-list::-webkit-scrollbar,
.countrySelect .dropdown-menu .inner::-webkit-scrollbar {
    width: 7px;
    border-radius: 6px;
    background-color: transparent;
    transition: background-color .2s linear,height .2s linear,width .2s ease-in-out,border-radius .2s ease-in-out;
}
ul.iti__country-list::-webkit-scrollbar:hover,
.countrySelect .dropdown-menu .inner::-webkit-scrollbar:hover{
    width: 10px;
}
ul.iti__country-list::-webkit-scrollbar-track,
.countrySelect .dropdown-menu .inner::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.3);
}
 
ul.iti__country-list::-webkit-scrollbar-thumb,
.countrySelect .dropdown-menu .inner::-webkit-scrollbar-thumb {
    background-color: #dcdcdc;
    height: 60px;
    border-radius: 6px;
}


.pre-loading{
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: #ffffff;
    z-index: 9999999;
}
.pre-spinner {
    display: block;
    width: 51.2px;
    height: 51.2px;
    position: relative;
    top: 50%;
    margin: auto;
    line-height: 100%;
  }
  .pre-spinner .text {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 1.6em;
    text-align: center;
    font-size: 80%;
    color: hsla(0, 0%, 0%, 0.4);
  }
  .pre-spinner .spinner-circle {
    position: absolute;
    background-color: transparent;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    border-style: solid;
    border-color: #181818 transparent #181818 transparent;
  }
  .pre-spinner .spinner-circle.spinner-circle-outer {
    width: 51.2px;
    height: 51.2px;
    border-width: 12.8px;
    top: -6.400000000000002px;
    left: -6.400000000000002px;
    opacity: 0.2;
    -ms-filter: alpha(opacity=50);
    filter: alpha(opacity=50);
    -webkit-animation: spinner-rotate-outer 2s 0s ease-in-out infinite;
    -moz-animation: spinner-rotate-outer 2s 0s ease-in-out infinite;
    -o-animation: spinner-rotate-outer 2s 0s ease-in-out infinite;
    -ms-animation: spinner-rotate-outer 2s 0s ease-in-out infinite;
    animation: spinner-rotate-outer 2s 0s ease-in-out infinite;
  }
  .pre-spinner .spinner-circle.spinner-circle-inner {
    width: 25.6px;
    height: 25.6px;
    border-width: 6.4px;
    top: 12.799999999999999px;
    left: 12.799999999999999px;
    opacity: 0.0;
    -ms-filter: alpha(opacity=70);
    filter: alpha(opacity=70);
    -webkit-animation: spinner-rotate-inner 3s 0s linear infinite;
    -moz-animation: spinner-rotate-inner 3s 0s linear infinite;
    -o-animation: spinner-rotate-inner 3s 0s linear infinite;
    -ms-animation: spinner-rotate-inner 3s 0s linear infinite;
    animation: spinner-rotate-inner 3s 0s linear infinite;
  }
  .pre-spinner .spinner-circle.spinner-circle-single-1 {
    width: 38.4px;
    height: 38.4px;
    border-width: 9.6px;
    top: 3.200000000000001px;
    left: 3.200000000000001px;
    opacity: 0.9;
    -ms-filter: alpha(opacity=30);
    filter: alpha(opacity=30);
    -webkit-animation: spinner-rotate-single-1 5s 0s ease-in-out infinite;
    -moz-animation: spinner-rotate-single-1 5s 0s ease-in-out infinite;
    -o-animation: spinner-rotate-single-1 5s 0s ease-in-out infinite;
    -ms-animation: spinner-rotate-single-1 5s 0s ease-in-out infinite;
    animation: spinner-rotate-single-1 5s 0s ease-in-out infinite;
    border-color: transparent transparent transparent #4dc3ff;
    -webkit-box-shadow: 2px 0 2px #4dc3ff;
    box-shadow: 2px 0 2px #4dc3ff;
  }
  .pre-spinner .spinner-circle.spinner-circle-single-2 {
    width: 0;
    height: 0;
    border-width: 25.6px;
    top: 6.399999999999999px;
    left: 6.399999999999999px;
    opacity: 0.0;
    -ms-filter: alpha(opacity=30);
    filter: alpha(opacity=30);
    -webkit-animation: spinner-rotate-single-2 7s 0s ease-in-out infinite;
    -moz-animation: spinner-rotate-single-2 7s 0s ease-in-out infinite;
    -o-animation: spinner-rotate-single-2 7s 0s ease-in-out infinite;
    -ms-animation: spinner-rotate-single-2 7s 0s ease-in-out infinite;
    animation: spinner-rotate-single-2 7s 0s ease-in-out infinite;
    border-color: #4dc3ff transparent transparent transparent;
    -webkit-box-shadow: 0 -12px 4px #4dc3ff;
    box-shadow: 0 -12px 4px #4dc3ff;
  }
  .pre-spinner:after{
      content: "...Loading...";
      margin-top: 55px;
      margin-left: -7px;
      font-size: 12px;
      display: inline-block;
  }


  select.form-control, select.form-control:read-only{
    background-image: linear-gradient(0deg,#d2d2d2 1px,hsla(0,0%,82%,0) 0),linear-gradient(0deg,#d2d2d2 1px,hsla(0,0%,82%,0) 0);
  }
  .form-check.success .form-check-input:checked~.circle{
    border-color: #4caf50;
  }
  .form-check.success .form-check-label .circle .check{
    background: #4caf50;
  }

.timing-select>select{
  margin: 0 20px;
}
.repeatingRow .cancelIcon{
  display: inline-block;
  margin-top: 25px;
  cursor: pointer;
  opacity: .2;
}
.repeatingRow .cancelIcon:hover{
  color: #e91e63;
  opacity: 1;
}


 /* ////////////// Media Quries /////////////// */
 @media (max-width: 991px){
.off-canvas-sidebar nav .navbar-collapse:before, .sidebar:before {
    background-color: #ffffff;
  }
 }
 @media (max-width: 796px){
  .days-container {
    flex-direction: column;
    }
   }
  @-moz-keyframes spinner-rotate-outer {
    0% {
      -webkit-transform: rotateZ(0deg);
      -moz-transform: rotateZ(0deg);
      -o-transform: rotateZ(0deg);
      -ms-transform: rotateZ(0deg);
      transform: rotateZ(0deg);
    }
    100% {
      -webkit-transform: rotateZ(360deg);
      -moz-transform: rotateZ(360deg);
      -o-transform: rotateZ(360deg);
      -ms-transform: rotateZ(360deg);
      transform: rotateZ(360deg);
    }
  }
  @-webkit-keyframes spinner-rotate-outer {
    0% {
      -webkit-transform: rotateZ(0deg);
      -moz-transform: rotateZ(0deg);
      -o-transform: rotateZ(0deg);
      -ms-transform: rotateZ(0deg);
      transform: rotateZ(0deg);
    }
    100% {
      -webkit-transform: rotateZ(360deg);
      -moz-transform: rotateZ(360deg);
      -o-transform: rotateZ(360deg);
      -ms-transform: rotateZ(360deg);
      transform: rotateZ(360deg);
    }
  }
  @-o-keyframes spinner-rotate-outer {
    0% {
      -webkit-transform: rotateZ(0deg);
      -moz-transform: rotateZ(0deg);
      -o-transform: rotateZ(0deg);
      -ms-transform: rotateZ(0deg);
      transform: rotateZ(0deg);
    }
    100% {
      -webkit-transform: rotateZ(360deg);
      -moz-transform: rotateZ(360deg);
      -o-transform: rotateZ(360deg);
      -ms-transform: rotateZ(360deg);
      transform: rotateZ(360deg);
    }
  }
  @-ms-keyframes spinner-rotate-outer {
    0% {
      -webkit-transform: rotateZ(0deg);
      -moz-transform: rotateZ(0deg);
      -o-transform: rotateZ(0deg);
      -ms-transform: rotateZ(0deg);
      transform: rotateZ(0deg);
    }
    100% {
      -webkit-transform: rotateZ(360deg);
      -moz-transform: rotateZ(360deg);
      -o-transform: rotateZ(360deg);
      -ms-transform: rotateZ(360deg);
      transform: rotateZ(360deg);
    }
  }
  @keyframes spinner-rotate-outer {
    0% {
      -webkit-transform: rotateZ(0deg);
      -moz-transform: rotateZ(0deg);
      -o-transform: rotateZ(0deg);
      -ms-transform: rotateZ(0deg);
      transform: rotateZ(0deg);
    }
    100% {
      -webkit-transform: rotateZ(360deg);
      -moz-transform: rotateZ(360deg);
      -o-transform: rotateZ(360deg);
      -ms-transform: rotateZ(360deg);
      transform: rotateZ(360deg);
    }
  }
  @-moz-keyframes spinner-rotate-inner {
    0% {
      -webkit-transform: rotateZ(30deg);
      -moz-transform: rotateZ(30deg);
      -o-transform: rotateZ(30deg);
      -ms-transform: rotateZ(30deg);
      transform: rotateZ(30deg);
    }
    100% {
      -webkit-transform: rotateZ(390deg);
      -moz-transform: rotateZ(390deg);
      -o-transform: rotateZ(390deg);
      -ms-transform: rotateZ(390deg);
      transform: rotateZ(390deg);
    }
  }
  @-webkit-keyframes spinner-rotate-inner {
    0% {
      -webkit-transform: rotateZ(30deg);
      -moz-transform: rotateZ(30deg);
      -o-transform: rotateZ(30deg);
      -ms-transform: rotateZ(30deg);
      transform: rotateZ(30deg);
    }
    100% {
      -webkit-transform: rotateZ(390deg);
      -moz-transform: rotateZ(390deg);
      -o-transform: rotateZ(390deg);
      -ms-transform: rotateZ(390deg);
      transform: rotateZ(390deg);
    }
  }
  @-o-keyframes spinner-rotate-inner {
    0% {
      -webkit-transform: rotateZ(30deg);
      -moz-transform: rotateZ(30deg);
      -o-transform: rotateZ(30deg);
      -ms-transform: rotateZ(30deg);
      transform: rotateZ(30deg);
    }
    100% {
      -webkit-transform: rotateZ(390deg);
      -moz-transform: rotateZ(390deg);
      -o-transform: rotateZ(390deg);
      -ms-transform: rotateZ(390deg);
      transform: rotateZ(390deg);
    }
  }
  @-ms-keyframes spinner-rotate-inner {
    0% {
      -webkit-transform: rotateZ(30deg);
      -moz-transform: rotateZ(30deg);
      -o-transform: rotateZ(30deg);
      -ms-transform: rotateZ(30deg);
      transform: rotateZ(30deg);
    }
    100% {
      -webkit-transform: rotateZ(390deg);
      -moz-transform: rotateZ(390deg);
      -o-transform: rotateZ(390deg);
      -ms-transform: rotateZ(390deg);
      transform: rotateZ(390deg);
    }
  }
  @keyframes spinner-rotate-inner {
    0% {
      -webkit-transform: rotateZ(30deg);
      -moz-transform: rotateZ(30deg);
      -o-transform: rotateZ(30deg);
      -ms-transform: rotateZ(30deg);
      transform: rotateZ(30deg);
    }
    100% {
      -webkit-transform: rotateZ(390deg);
      -moz-transform: rotateZ(390deg);
      -o-transform: rotateZ(390deg);
      -ms-transform: rotateZ(390deg);
      transform: rotateZ(390deg);
    }
  }
  @-moz-keyframes spinner-rotate-single-1 {
    0% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
    20% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    40% {
      -webkit-transform: rotateZ(-250deg);
      -moz-transform: rotateZ(-250deg);
      -o-transform: rotateZ(-250deg);
      -ms-transform: rotateZ(-250deg);
      transform: rotateZ(-250deg);
    }
    60% {
      -webkit-transform: rotateZ(40deg);
      -moz-transform: rotateZ(40deg);
      -o-transform: rotateZ(40deg);
      -ms-transform: rotateZ(40deg);
      transform: rotateZ(40deg);
    }
    70% {
      -webkit-transform: rotateZ(-80deg);
      -moz-transform: rotateZ(-80deg);
      -o-transform: rotateZ(-80deg);
      -ms-transform: rotateZ(-80deg);
      transform: rotateZ(-80deg);
    }
    100% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
  }
  @-webkit-keyframes spinner-rotate-single-1 {
    0% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
    20% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    40% {
      -webkit-transform: rotateZ(-250deg);
      -moz-transform: rotateZ(-250deg);
      -o-transform: rotateZ(-250deg);
      -ms-transform: rotateZ(-250deg);
      transform: rotateZ(-250deg);
    }
    60% {
      -webkit-transform: rotateZ(40deg);
      -moz-transform: rotateZ(40deg);
      -o-transform: rotateZ(40deg);
      -ms-transform: rotateZ(40deg);
      transform: rotateZ(40deg);
    }
    70% {
      -webkit-transform: rotateZ(-80deg);
      -moz-transform: rotateZ(-80deg);
      -o-transform: rotateZ(-80deg);
      -ms-transform: rotateZ(-80deg);
      transform: rotateZ(-80deg);
    }
    100% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
  }
  @-o-keyframes spinner-rotate-single-1 {
    0% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
    20% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    40% {
      -webkit-transform: rotateZ(-250deg);
      -moz-transform: rotateZ(-250deg);
      -o-transform: rotateZ(-250deg);
      -ms-transform: rotateZ(-250deg);
      transform: rotateZ(-250deg);
    }
    60% {
      -webkit-transform: rotateZ(40deg);
      -moz-transform: rotateZ(40deg);
      -o-transform: rotateZ(40deg);
      -ms-transform: rotateZ(40deg);
      transform: rotateZ(40deg);
    }
    70% {
      -webkit-transform: rotateZ(-80deg);
      -moz-transform: rotateZ(-80deg);
      -o-transform: rotateZ(-80deg);
      -ms-transform: rotateZ(-80deg);
      transform: rotateZ(-80deg);
    }
    100% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
  }
  @-ms-keyframes spinner-rotate-single-1 {
    0% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
    20% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    40% {
      -webkit-transform: rotateZ(-250deg);
      -moz-transform: rotateZ(-250deg);
      -o-transform: rotateZ(-250deg);
      -ms-transform: rotateZ(-250deg);
      transform: rotateZ(-250deg);
    }
    60% {
      -webkit-transform: rotateZ(40deg);
      -moz-transform: rotateZ(40deg);
      -o-transform: rotateZ(40deg);
      -ms-transform: rotateZ(40deg);
      transform: rotateZ(40deg);
    }
    70% {
      -webkit-transform: rotateZ(-80deg);
      -moz-transform: rotateZ(-80deg);
      -o-transform: rotateZ(-80deg);
      -ms-transform: rotateZ(-80deg);
      transform: rotateZ(-80deg);
    }
    100% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
  }
  @keyframes spinner-rotate-single-1 {
    0% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
    20% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    40% {
      -webkit-transform: rotateZ(-250deg);
      -moz-transform: rotateZ(-250deg);
      -o-transform: rotateZ(-250deg);
      -ms-transform: rotateZ(-250deg);
      transform: rotateZ(-250deg);
    }
    60% {
      -webkit-transform: rotateZ(40deg);
      -moz-transform: rotateZ(40deg);
      -o-transform: rotateZ(40deg);
      -ms-transform: rotateZ(40deg);
      transform: rotateZ(40deg);
    }
    70% {
      -webkit-transform: rotateZ(-80deg);
      -moz-transform: rotateZ(-80deg);
      -o-transform: rotateZ(-80deg);
      -ms-transform: rotateZ(-80deg);
      transform: rotateZ(-80deg);
    }
    100% {
      -webkit-transform: rotateZ(56deg);
      -moz-transform: rotateZ(56deg);
      -o-transform: rotateZ(56deg);
      -ms-transform: rotateZ(56deg);
      transform: rotateZ(56deg);
    }
  }
  @-moz-keyframes spinner-rotate-single-2 {
    0% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
    10% {
      -webkit-transform: rotateZ(142deg);
      -moz-transform: rotateZ(142deg);
      -o-transform: rotateZ(142deg);
      -ms-transform: rotateZ(142deg);
      transform: rotateZ(142deg);
    }
    20% {
      -webkit-transform: rotateZ(-87deg);
      -moz-transform: rotateZ(-87deg);
      -o-transform: rotateZ(-87deg);
      -ms-transform: rotateZ(-87deg);
      transform: rotateZ(-87deg);
    }
    30% {
      -webkit-transform: rotateZ(-345deg);
      -moz-transform: rotateZ(-345deg);
      -o-transform: rotateZ(-345deg);
      -ms-transform: rotateZ(-345deg);
      transform: rotateZ(-345deg);
    }
    40% {
      -webkit-transform: rotateZ(86deg);
      -moz-transform: rotateZ(86deg);
      -o-transform: rotateZ(86deg);
      -ms-transform: rotateZ(86deg);
      transform: rotateZ(86deg);
    }
    50% {
      -webkit-transform: rotateZ(175deg);
      -moz-transform: rotateZ(175deg);
      -o-transform: rotateZ(175deg);
      -ms-transform: rotateZ(175deg);
      transform: rotateZ(175deg);
    }
    60% {
      -webkit-transform: rotateZ(-245deg);
      -moz-transform: rotateZ(-245deg);
      -o-transform: rotateZ(-245deg);
      -ms-transform: rotateZ(-245deg);
      transform: rotateZ(-245deg);
    }
    70% {
      -webkit-transform: rotateZ(4deg);
      -moz-transform: rotateZ(4deg);
      -o-transform: rotateZ(4deg);
      -ms-transform: rotateZ(4deg);
      transform: rotateZ(4deg);
    }
    80% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    90% {
      -webkit-transform: rotateZ(345deg);
      -moz-transform: rotateZ(345deg);
      -o-transform: rotateZ(345deg);
      -ms-transform: rotateZ(345deg);
      transform: rotateZ(345deg);
    }
    100% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
  }
  @-webkit-keyframes spinner-rotate-single-2 {
    0% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
    10% {
      -webkit-transform: rotateZ(142deg);
      -moz-transform: rotateZ(142deg);
      -o-transform: rotateZ(142deg);
      -ms-transform: rotateZ(142deg);
      transform: rotateZ(142deg);
    }
    20% {
      -webkit-transform: rotateZ(-87deg);
      -moz-transform: rotateZ(-87deg);
      -o-transform: rotateZ(-87deg);
      -ms-transform: rotateZ(-87deg);
      transform: rotateZ(-87deg);
    }
    30% {
      -webkit-transform: rotateZ(-345deg);
      -moz-transform: rotateZ(-345deg);
      -o-transform: rotateZ(-345deg);
      -ms-transform: rotateZ(-345deg);
      transform: rotateZ(-345deg);
    }
    40% {
      -webkit-transform: rotateZ(86deg);
      -moz-transform: rotateZ(86deg);
      -o-transform: rotateZ(86deg);
      -ms-transform: rotateZ(86deg);
      transform: rotateZ(86deg);
    }
    50% {
      -webkit-transform: rotateZ(175deg);
      -moz-transform: rotateZ(175deg);
      -o-transform: rotateZ(175deg);
      -ms-transform: rotateZ(175deg);
      transform: rotateZ(175deg);
    }
    60% {
      -webkit-transform: rotateZ(-245deg);
      -moz-transform: rotateZ(-245deg);
      -o-transform: rotateZ(-245deg);
      -ms-transform: rotateZ(-245deg);
      transform: rotateZ(-245deg);
    }
    70% {
      -webkit-transform: rotateZ(4deg);
      -moz-transform: rotateZ(4deg);
      -o-transform: rotateZ(4deg);
      -ms-transform: rotateZ(4deg);
      transform: rotateZ(4deg);
    }
    80% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    90% {
      -webkit-transform: rotateZ(345deg);
      -moz-transform: rotateZ(345deg);
      -o-transform: rotateZ(345deg);
      -ms-transform: rotateZ(345deg);
      transform: rotateZ(345deg);
    }
    100% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
  }
  @-o-keyframes spinner-rotate-single-2 {
    0% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
    10% {
      -webkit-transform: rotateZ(142deg);
      -moz-transform: rotateZ(142deg);
      -o-transform: rotateZ(142deg);
      -ms-transform: rotateZ(142deg);
      transform: rotateZ(142deg);
    }
    20% {
      -webkit-transform: rotateZ(-87deg);
      -moz-transform: rotateZ(-87deg);
      -o-transform: rotateZ(-87deg);
      -ms-transform: rotateZ(-87deg);
      transform: rotateZ(-87deg);
    }
    30% {
      -webkit-transform: rotateZ(-345deg);
      -moz-transform: rotateZ(-345deg);
      -o-transform: rotateZ(-345deg);
      -ms-transform: rotateZ(-345deg);
      transform: rotateZ(-345deg);
    }
    40% {
      -webkit-transform: rotateZ(86deg);
      -moz-transform: rotateZ(86deg);
      -o-transform: rotateZ(86deg);
      -ms-transform: rotateZ(86deg);
      transform: rotateZ(86deg);
    }
    50% {
      -webkit-transform: rotateZ(175deg);
      -moz-transform: rotateZ(175deg);
      -o-transform: rotateZ(175deg);
      -ms-transform: rotateZ(175deg);
      transform: rotateZ(175deg);
    }
    60% {
      -webkit-transform: rotateZ(-245deg);
      -moz-transform: rotateZ(-245deg);
      -o-transform: rotateZ(-245deg);
      -ms-transform: rotateZ(-245deg);
      transform: rotateZ(-245deg);
    }
    70% {
      -webkit-transform: rotateZ(4deg);
      -moz-transform: rotateZ(4deg);
      -o-transform: rotateZ(4deg);
      -ms-transform: rotateZ(4deg);
      transform: rotateZ(4deg);
    }
    80% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    90% {
      -webkit-transform: rotateZ(345deg);
      -moz-transform: rotateZ(345deg);
      -o-transform: rotateZ(345deg);
      -ms-transform: rotateZ(345deg);
      transform: rotateZ(345deg);
    }
    100% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
  }
  @-ms-keyframes spinner-rotate-single-2 {
    0% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
    10% {
      -webkit-transform: rotateZ(142deg);
      -moz-transform: rotateZ(142deg);
      -o-transform: rotateZ(142deg);
      -ms-transform: rotateZ(142deg);
      transform: rotateZ(142deg);
    }
    20% {
      -webkit-transform: rotateZ(-87deg);
      -moz-transform: rotateZ(-87deg);
      -o-transform: rotateZ(-87deg);
      -ms-transform: rotateZ(-87deg);
      transform: rotateZ(-87deg);
    }
    30% {
      -webkit-transform: rotateZ(-345deg);
      -moz-transform: rotateZ(-345deg);
      -o-transform: rotateZ(-345deg);
      -ms-transform: rotateZ(-345deg);
      transform: rotateZ(-345deg);
    }
    40% {
      -webkit-transform: rotateZ(86deg);
      -moz-transform: rotateZ(86deg);
      -o-transform: rotateZ(86deg);
      -ms-transform: rotateZ(86deg);
      transform: rotateZ(86deg);
    }
    50% {
      -webkit-transform: rotateZ(175deg);
      -moz-transform: rotateZ(175deg);
      -o-transform: rotateZ(175deg);
      -ms-transform: rotateZ(175deg);
      transform: rotateZ(175deg);
    }
    60% {
      -webkit-transform: rotateZ(-245deg);
      -moz-transform: rotateZ(-245deg);
      -o-transform: rotateZ(-245deg);
      -ms-transform: rotateZ(-245deg);
      transform: rotateZ(-245deg);
    }
    70% {
      -webkit-transform: rotateZ(4deg);
      -moz-transform: rotateZ(4deg);
      -o-transform: rotateZ(4deg);
      -ms-transform: rotateZ(4deg);
      transform: rotateZ(4deg);
    }
    80% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    90% {
      -webkit-transform: rotateZ(345deg);
      -moz-transform: rotateZ(345deg);
      -o-transform: rotateZ(345deg);
      -ms-transform: rotateZ(345deg);
      transform: rotateZ(345deg);
    }
    100% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
  }
  @keyframes spinner-rotate-single-2 {
    0% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
    10% {
      -webkit-transform: rotateZ(142deg);
      -moz-transform: rotateZ(142deg);
      -o-transform: rotateZ(142deg);
      -ms-transform: rotateZ(142deg);
      transform: rotateZ(142deg);
    }
    20% {
      -webkit-transform: rotateZ(-87deg);
      -moz-transform: rotateZ(-87deg);
      -o-transform: rotateZ(-87deg);
      -ms-transform: rotateZ(-87deg);
      transform: rotateZ(-87deg);
    }
    30% {
      -webkit-transform: rotateZ(-345deg);
      -moz-transform: rotateZ(-345deg);
      -o-transform: rotateZ(-345deg);
      -ms-transform: rotateZ(-345deg);
      transform: rotateZ(-345deg);
    }
    40% {
      -webkit-transform: rotateZ(86deg);
      -moz-transform: rotateZ(86deg);
      -o-transform: rotateZ(86deg);
      -ms-transform: rotateZ(86deg);
      transform: rotateZ(86deg);
    }
    50% {
      -webkit-transform: rotateZ(175deg);
      -moz-transform: rotateZ(175deg);
      -o-transform: rotateZ(175deg);
      -ms-transform: rotateZ(175deg);
      transform: rotateZ(175deg);
    }
    60% {
      -webkit-transform: rotateZ(-245deg);
      -moz-transform: rotateZ(-245deg);
      -o-transform: rotateZ(-245deg);
      -ms-transform: rotateZ(-245deg);
      transform: rotateZ(-245deg);
    }
    70% {
      -webkit-transform: rotateZ(4deg);
      -moz-transform: rotateZ(4deg);
      -o-transform: rotateZ(4deg);
      -ms-transform: rotateZ(4deg);
      transform: rotateZ(4deg);
    }
    80% {
      -webkit-transform: rotateZ(-132deg);
      -moz-transform: rotateZ(-132deg);
      -o-transform: rotateZ(-132deg);
      -ms-transform: rotateZ(-132deg);
      transform: rotateZ(-132deg);
    }
    90% {
      -webkit-transform: rotateZ(345deg);
      -moz-transform: rotateZ(345deg);
      -o-transform: rotateZ(345deg);
      -ms-transform: rotateZ(345deg);
      transform: rotateZ(345deg);
    }
    100% {
      -webkit-transform: rotateZ(-24deg);
      -moz-transform: rotateZ(-24deg);
      -o-transform: rotateZ(-24deg);
      -ms-transform: rotateZ(-24deg);
      transform: rotateZ(-24deg);
    }
  }

  .material-table{
    display: block;
    width: 100%;
    overflow-x: auto;
  }

  .customModal {
    position: fixed; /* Stay in place */
    z-index: 99999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  }

  .custom-modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
  }

  .custom-modal-close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
  }

  .custom-modal-close:hover,
  .custom-modal-close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
  }

  th {
    font-weight: 500;
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .heigth235px {
    min-height: 235px !important;
  }

  .slot-table {
    border: 4px #5b5b5b0f solid;
    padding: 1%;
    margin-bottom: 2%;
  }

  .manually-addStaff {
    background: #61db61;
    color: white;
    padding: 0 9px 0 9px;
    cursor: pointer;
  }

  .job-searchStaff {
    overflow-y: scroll;
    max-height: 230px;
    position: absolute;
    width: 100%;
    background: #f1f1f1;
    z-index: 999999;
  }

  .job-searchStaff > li {
    cursor:pointer;  
  }

  .job-searchStaff > li:hover {
    background-color:#d81b60;  
    color: white;
  }  

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

  .suggestions-border {
    padding: 10px;
    color: red;
    border: red solid;
  }

  .incomplete-step {
    border: red solid;
    border-radius: 24%;
  }

  .margin-topBottom {
    margin-top: 1.5rem!important;
    margin-bottom: 1.5rem !important;
  }

  .notificationblock {
    transform-origin: 100% 0;
    right: 0;
    left: auto;
    position: absolute;
    width: 30rem;
    padding: 0;
    transform: scale(1);
  }

  .rating {
    color: #a9a9a9;
    margin: 0;
    padding: 0;
  }

  ul.rating {
    display: inline-block;
  }

  .rating li {
    list-style-type: none;
    display: inline-block;
    padding: 1px;
    text-align: center;
    font-weight: bold;
    cursor: pointer;
    font-size:40px;
  }

  .rating .filled-red {
    color: red;
  }

  .rating .filled-orange {
    color: orange;
  }

  .rating .filled-green {
    color: green;
  }

  .clear{
    margin-top:20px;
  }

  .performance-meterStaff:hover  {
    padding: 2%;
    margin: 1% 0 1% 0;
    box-shadow: 1px 1px 10px 1px;
  }

  #dashboardVistmobile {
    display: none !important;
  }

  @media only screen and (max-width: 768px) {
    #staffDashBoardStats, #dashboardVistDesktop {
      display: none !important;
    }

    #dashboardVistmobile {
      display: block !important;
    }

    #staffDashBoardStatsMobile {
      display: block !important;
    }

    #onlymobilemenu {
      display: block ;
      position: fixed;
      bottom: 0;
      width: 100%;
    }
    .mobileviewmenu{
      display: flex !important;
      padding: 2%;
      color: white;
      background-color: #a33db7;
    }
    .mobileviewmenu > a {
      flex: 1 1 20%;
      padding: 2%;
      margin: 5px;
      border-radius: 8px;
      color: white;
      text-align: center;
      font-size: 14px;
      font-weight: bold;
      border: 2px solid;
      z-index: 9999;
    }

    .mobileviewmenu > a:hover{
      background-color: white;
      color:#a33db7;
    }

    .selected-mobileviewmenu {
      background-color: white !important;
      color:#a33db7 !important;
    }

    .footer {
      margin-bottom: 90px !important;
    }

    .res-circle {
      flex: 1 1 25%;
      border-radius: 50%;
      line-height: 0;
      background-color: #9c27b0ab;
      border: 4px solid #9C27B0;
      position: relative;
      margin: 2%;
    }
    .res-circle:after {
      content: "";
      display: block;
      padding-bottom: 100%;
    }
    .circle-txt {
      position: absolute;
      bottom: 50%;
      width: 100%;
      text-align: center;
      font-family: arial, sans-serif;
      font-size: 2em;
      font-weight: bold;
      color: white;
    }

    .flex-container{
      display: flex;
    }

    .flex25 {
      flex: 1 1 25%;
    }

    .selectclass {
      padding-bottom: 40px ;
      margin-top: 4px ;
    }

    .suggestionaddress {
      padding-bottom: 40px ;
      margin-top: 6px ;
    }
  }

  option[disabled] {
    background-color:gainsboro;
  }

  .custom-cardheader {
    font-size: 36px;line-height: 56px;width: 56px;height: 56px;text-align: center;
  }

  @media only screen and (max-width: 991px) {
    .custom-cardheader {
      font-size: 25px;line-height: 56px;width: 56px;height: 56px;text-align: center;
    }
  }

  #smsadd:hover {
    color: #9c27b0;
    background-color: white;
    cursor: pointer;
  }

  tr > th {
    font-weight: bold;
  }
  tr > td {
    text-transform: capitalize;
  }

  .activedashboardsmallcards {
    color: white !important;
    float: none !important;
    text-align: center !important;
    background: linear-gradient(60deg,#ef5350,#e53935) !important;
    margin-right: 0 !important;
  }

  .res-circle {
    flex: 1 1 25%;
    border-radius: 50%;
    line-height: 0;
    background-color: #9c27b0ab;
    border: 4px solid #9C27B0;
    position: relative;
    margin: 2%;
  }
  .res-circle:after {
    content: "";
    display: block;
    padding-bottom: 100%;
  }
  .circle-txt {
    position: absolute;
    bottom: 50%;
    width: 100%;
    text-align: center;
    font-family: arial, sans-serif;
    font-size: 2em;
    font-weight: bold;
    color: white;
  }

  .flex-container{
    display: flex;
  }

  .flex25 {
    flex: 1 1 25%;
  }

  .priority {
    background: #ffc4c4 !important;
  }

  .highlightjob {
    background: gainsboro;
  }

  .unreadnoti {
    background: darkgrey;
  }

  #trumbowyg-icons {
    display: none;
  }