@media only screen and (max-width: 991px) {
.preloader1{
  position: absolute;
  top: calc(50% - 100px);
  left: calc(50% - 105px);
}
}

@media only screen and (min-width: 992px) {
  .preloader1{
    position: absolute;
    top: calc(50% - 100px);
    left: calc(50%);
  }
  }

  @media only screen and (min-width: 992px) {
  [data-kt-app-sidebar-minimize=on]
    .preloader1{
      position: absolute;
      top: calc(50% - 100px);
      left: calc(50% - 70px);
    }
    }

.preloader,
.preloader-portfolio {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
}


.preloader-animation {
  width: 200px;
  height: 200px;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: auto auto;
  filter: url('#goo');
  animation: rotate-move 2s ease-in-out infinite;
}

.preloader-noanimate {
  width: 200px;
  height: 200px;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: auto auto;
  filter: url('#goo');
}

.preloader-title{
  position: absolute; top: calc(40% + 125px); left: calc(50% - 100px); width: 200px; text-align: center; color: #555
}

.dot { 
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.dot-fixed-3 {
  /*background-color:transparent*/
  background-color: #e65959;
}


.dot-3 {
  background-color: #e65959;
  animation: dot-3-move 2s ease infinite, index 6s ease infinite;
}

.dot-2 {
  background-color: #f74d75;
  animation: dot-2-move 2s ease infinite, index 6s -4s ease infinite;
}

.dot-1 {
  background-color: #ffe386;
  animation: dot-1-move 2s ease infinite, index 6s -2s ease infinite;
}

@keyframes dot-3-move {
  20% {transform: scale(1)}
  45% {transform: translateY(-18px) scale(.45)}
  60% {transform: translateY(-90px) scale(.45)}
  80% {transform: translateY(-90px) scale(.45)}
  100% {transform: translateY(0px) scale(1)}
}

@keyframes dot-2-move {
  20% {transform: scale(1)}
  45% {transform: translate(-16px, 12px) scale(.45)}
  60% {transform: translate(-80px, 60px) scale(.45)}
  80% {transform: translate(-80px, 60px) scale(.45)}
  100% {transform: translateY(0px) scale(1)}
}

@keyframes dot-1-move {
  20% {transform: scale(1)}
  45% {transform: translate(16px, 12px) scale(.45)}
  60% {transform: translate(80px, 60px) scale(.45)}
  80% {transform: translate(80px, 60px) scale(.45)}
  100% {transform: translateY(0px) scale(1)}
}

@keyframes rotate-move {
  55% {transform: translate(-50%, -50%) rotate(0deg)}
  80% {transform: translate(-50%, -50%) rotate(360deg)}
  100% {transform: translate(-50%, -50%) rotate(360deg)}
}

@keyframes index {
  0%, 100% {z-index: 3}
  33.3% {z-index: 2}
  66.6% {z-index: 1}
}









body.page-loading {
    margin: 0; height: 100%; overflow: hidden;
}

.splash-screen {
    display: none;
}

.page-loading .splash-screen {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-family: Inter, Helvetica, "sans-serif";
    background-color: #F9F9F9;
    color: #5E6278;
    line-height: 1;
    font-size: 14px;
    font-weight: 400;
    top:0px;
    left:0px;
}

.page-loading .splash-screen span {
    color: #5E6278;
    transition: none !important;
    -webkit-font-smoothing: antialiased;
}

.page-loading .splash-screen img {
    margin-left: calc(100vw - 100%);
    margin-bottom: 30px;
    height: 30px !important;
}

html[data-bs-theme="dark"] .page-loading .splash-screen {
    background-color: #151521;
    color: #ffffff;
}

.splash-screen .dark-logo {
    display: none;
}

.splash-screen .light-logo {
    display: block;
}

html[data-bs-theme="dark"] .splash-screen .light-logo {
    display: none;
}

html[data-bs-theme="dark"] .splash-screen .dark-logo {
    display: block;
}













@media only screen and (max-width: 929px) {

  .ptr--ptr {
    z-index:9999999;
    background: #009ef7 !important;
  }

  .ptr--ptr {
    box-shadow: none !important;

    .ptr--icon, .ptr--text {
      color: white !important;
    }
  }
  .ptr--pull{
    //margin-top:80px;
  //margin-bottom: -80px;
  }

  .ptr--release{
    //margin-top:80px;
    //margin-bottom: -80px;
  }

  .ptr--refresh{
   // margin-top:80px;
    //margin-bottom: -80px;
  }
}

@media only screen and (min-width: 930px) {
  .ptr--ptr {
    display:block;
    z-index:9999999;
  }
}