/*@import url(IranSans.css);*/

/*#region public classes */
.tform {
  margin-top: 20px;
}

tbutton {
  float: right;
}

.divContainer {
  width: 100%;
}

.containerBtn {
  margin-top: 15px;
}

.tbody {
  background-color: #2c3e50;
  font-family: SPPC !important;
}

/* .tRtl {
    direction: rtl !important;    
} */

.body-content {
  width: 100% !important;
}

body.tRtl .body-content {
  direction: rtl;
}

body.tLtr .body-content {
  direction: ltr;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
  height: 200px !important;
}

.userinfo {
  color: white;
}

/* .tLtr {    
    direction:ltr!important;
} */

.tRtl .nopad {
  padding-right: 0 !important;
}

.tLtr .nopad {
  padding-left: 0 !important;
}

.btn-userInfo {
  margin-right: 10px;
}

.img-user {
  color: white;
  font-size: 80px !important;
}

.main-header .logo .logo-lg {
  font-family: SPPC !important;
}

.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini {
  font-family: SPPC !important;
  font-size: 15px !important;
}

body span.menuitem {
  margin-right: 2px !important;
}

a:hover {
  text-decoration: none !important;
}

.noprl {
  padding-right: 0;
  padding-left: 0;
}

.repRtl {
  direction: rtl !important;
}

.repLtr {
  direction: ltr !important;
}

a {
  text-decoration: none !important;
}

body.sidebar-collapse span.menuitem {
  margin-right: 0px !important;
}

li .glyphicon {
  margin-right: 18px;
  margin-top: 6px;
}

body.sidebar-collapse li .glyphicon {
  margin-right: 0px;
  margin-top: 0px;
}

body.sidebar-collapse .none {
  visibility: hidden;
}

label {
  display: block;
}

.voffset1 {
  margin-top: 5px;
}

.voffset2 {
  margin-top: 10px;
}

.voffset3 {
  margin-top: 15px;
}

.voffset4 {
  margin-top: 30px;
}

.flag {
  width: 28px;
  height: 23px;
}

.flag .active {
  border: 3px white solid;
  border-radius: 4px;
}

.k-pager-wrap {
  z-index: 0 !important;
}

/* .panel-primary {
    margin-bottom: 100px !important;
} */
/*#endregion public classes */
/*#region add class for sppc font*/
tgrid {
  font-family: SPPC !important;
  font-size: 15px;
}

.ui-widget {
  font-family: SPPC !important;
  font-size: 15px;
}

.fa-chevron-circle-right:before {
  content: '\f055' !important;
}

.fa-chevron-circle-down:before {
  content: '\f056' !important;
}

.toast {
  font-family: SPPC !important;
}

.labelTemplate {
  font-size: 16px;
  color: black;
}

.valueTemplate {
  font-size: 14px;
  color: darkblue;
}

.main-nav {
  font-family: SPPC !important;
  font-size: 18px;
}

.panel {
  font-family: SPPC !important;
  margin-top: 10px;
  margin-bottom: 0px;
}

.ui-dropdown {
  font-family: SPPC !important;
}

kendo-dropdownlist {
  font-family: SPPC !important;
}

/*#endregion */
/*#region override class for primeng datatable*/
.templateColumn {
  text-align: center;
  width: 5%;
}

.ui-paginator {
  direction: ltr !important;
}

.ui-datatable-footer {
  text-align: unset !important;
}

table thead tr th span.ui-column-title {
  display: inline !important;
}

.ui-helper-hidden {
  display: inline !important;
}

.k-animation-container {
  font-family: SPPC !important;
}

/*#endregion */

/*new sppiner*/

/*change this to resize*/

.example {
  position: fixed;
  top: 50%;
  left: 50%;
  height: 50px;
  width: 50px;
  transform: translateX(-50%) translateY(-50%);
}

.container {
  position: absolute;
  top: 0;
  left: 0;
  height: 50px;
  width: 50px;
}

.item1 {
  position: absolute;
  height: 50px;
  width: 15%;
  background: red;
  left: 10px;
}

.item2 {
  position: absolute;
  height: 50px;
  width: 15%;
  background: red;
  left: 25px;
}

.item3 {
  position: absolute;
  height: 50px;
  width: 15%;
  background: red;
  left: 40px;
}

.block {
  position: absolute;
  top: 0;
  left: 0;
  height: 50px;
  width: 50px;
}

.block > .item {
  position: absolute;
  height: 50px;
  width: 50px;
  background: #147ec2;
  -webkit-animation: move 2s linear infinite;
  animation: move 2s linear infinite;
}

.block > .item:nth-of-type(1) {
  top: -50px;
  left: -50px;
  -webkit-animation-delay: -1.75s;
  animation-delay: -1.75s;
}

.block > .item:nth-of-type(2) {
  top: -50px;
  left: 0;
  -webkit-animation-delay: -1.5s;
  animation-delay: -1.5s;
}

.block > .item:nth-of-type(3) {
  top: -50px;
  left: 50px;
  -webkit-animation-delay: -1.25s;
  animation-delay: -1.25s;
}

.block > .item:nth-of-type(4) {
  top: 0;
  left: 50px;
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}

.block > .item:nth-of-type(5) {
  top: 50px;
  left: 50px;
  -webkit-animation-delay: -0.75s;
  animation-delay: -0.75s;
}

.block > .item:nth-of-type(6) {
  top: 50px;
  left: 0;
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}

.block > .item:nth-of-type(7) {
  top: 50px;
  left: -50px;
  -webkit-animation-delay: -0.25s;
  animation-delay: -0.25s;
}

.block > .item:nth-of-type(8) {
  top: 0;
  left: -50px;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

@-webkit-keyframes move {
  0% {
    transform: rotate(0) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  10% {
    transform: rotate(90deg) scale(0);
  }

  50% {
    transform: rotate(90deg) scale(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  60% {
    transform: rotate(180deg) scale(1);
  }

  100% {
    transform: rotate(180deg) scale(1);
  }
}

@keyframes move {
  0% {
    transform: rotate(0) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  10% {
    transform: rotate(90deg) scale(0);
  }

  50% {
    transform: rotate(90deg) scale(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  60% {
    transform: rotate(180deg) scale(1);
  }

  100% {
    transform: rotate(180deg) scale(1);
  }
}

/*new sppiner*/

.k-dialog-buttongroup .k-primary:focus,
.k-dialog-buttongroup .k-primary.k-state-focused {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.13) !important;
}

.ng-bar-placeholder {
  height: 5px !important;
  background-color: #4189c7 !important;
}

body.tRtl kendo-grid-toolbar > button.rm {
  float: left !important;
  margin-left: 4px !important;
}

body.tLtr kendo-grid-toolbar > button.rm {
  float: right !important;
  margin-right: 4px !important;
}

.reportMargin {
  margin-left: 4px;
}

body.tRtl .sppc-float {
  float: right !important;
}

body.tLtr .sppc-float {
  float: left !important;
}

body.tRtl .sppc-float-diff {
  float: left !important;
}

body.tLtr .sppc-float-diff {
  float: right !important;
}

body.tRtl .k-checkbox-label,
body.tRtl .k-radio-label {
  padding-right: 20px;
  padding-left: 0;
}

body.tRtl .k-checkbox-label::before,
body.tRtl .k-checkbox-label::after,
body.tRtl .k-radio-label::before,
body.tRtl .k-radio-label::after {
  right: 0;
  left: unset;
}

body.tRtl .sppc-input-num {
  direction: ltr;
  text-align: right;
}

.sppc-width-100 {
  width: 100% !important;
}

.sppc-dialog-md {
  width: 800px;
}

.sppc-dialog-md hr {
  border-top: dashed 1px #147ec2;
}

@media screen and (max-width: 800px) {
  .sppc-dialog-md {
    width: 100%;
    min-width: 250px;
  }
}

.sppc-dialog-xs {
  width: 450px;
}

@media screen and (max-width: 450px) {
  .sppc-dialog-xs {
    width: 90%;
    min-width: 250px;
  }
}

.k-grid .k-grid-norecords {
  text-align: unset;
  display: contents;
}

.k-grid .money-item,
.k-footer-template > td {
  direction: ltr;
}

.sppc-switch.k-switch {
  width: 8.5em !important;
  margin: 0 10px;
}

.sppc-switch.k-switch[dir='rtl'].k-switch-off .k-switch-handle {
  left: calc(100% - 3.5em) !important;
}

.sppc-switch.k-switch[dir='ltr'].k-switch-on .k-switch-handle {
  left: calc(100% - 8.1em) !important;
}

.sppc-switch .k-switch-label-on,
.sppc-switch .k-switch-label-off {
  overflow: unset !important;
}

.tostrlink {
  text-decoration: underline !important;
}

.k-link.lbl {
  padding-left: 5px !important;
  padding-right: 8px !important;
}
