.lh-48 {

  line-height: 48px;

}



.focus-none {

  box-shadow: none !important;

}



/* HTML: <div class="loader"></div> */

.front-loader {

  width: 50px;

  aspect-ratio: 1;

  display: flex;

  color: #9a55ff !important;

  background:

    linear-gradient(currentColor 0 0) right /51% 100%,

    linear-gradient(currentColor 0 0) bottom /100% 51%;

  background-repeat: no-repeat;

  animation: l16-0 2s infinite linear .25s;

  position: absolute;

  top: 45%;

  left: 45%;

}



.front-loader::before {

  content: "";

  width: 50%;

  height: 50%;

  background: currentColor;

  animation: l16-1 .5s infinite linear;

}



@keyframes l16-0 {



  0%,

  12.49% {

    transform: rotate(0deg)

  }



  12.5%,

  37.49% {

    transform: rotate(90deg)

  }



  37.5%,

  62.49% {

    transform: rotate(180deg)

  }



  62.5%,

  87.49% {

    transform: rotate(270deg)

  }



  87.5%,

  100% {

    transform: rotate(360deg)

  }

}



@keyframes l16-1 {

  0% {

    transform: perspective(80px) rotate3d(-1, -1, 0, 0)

  }



  80%,

  100% {

    transform: perspective(80px) rotate3d(-1, -1, 0, -180deg)

  }

}





.front-loader-layer {

  background-color: rgba(207, 207, 207, 0.4);

  display: none;

  height: 100%;

  left: 0;

  position: absolute;

  top: 0;

  width: 100%;

  z-index: 1;

}





.front-loader-layer.visible {

  display: block;

}



.loader {

  width: 50px;

  aspect-ratio: 1;

  display: flex;

  color: orange;

  background:

    linear-gradient(currentColor 0 0) right /51% 100%,

    linear-gradient(currentColor 0 0) bottom /100% 51%;

  background-repeat: no-repeat;

  animation: l16-0 2s infinite linear .25s;

  position: absolute;

  top: 50%;

  left: 50%;

}



.loader::before {

  content: "";

  width: 50%;

  height: 50%;

  background: currentColor;

  animation: l16-1 .5s infinite linear;

}



@keyframes l16-0 {



  0%,

  12.49% {

    transform: rotate(0deg)

  }



  12.5%,

  37.49% {

    transform: rotate(90deg)

  }



  37.5%,

  62.49% {

    transform: rotate(180deg)

  }



  62.5%,

  87.49% {

    transform: rotate(270deg)

  }



  87.5%,

  100% {

    transform: rotate(360deg)

  }

}



@keyframes l16-1 {

  0% {

    transform: perspective(80px) rotate3d(-1, -1, 0, 0)

  }



  80%,

  100% {

    transform: perspective(80px) rotate3d(-1, -1, 0, -180deg)

  }

}





.loader-layer {

  background-color: rgba(207, 207, 207, 0.4);

  display: none;

  height: 100%;

  left: 0;

  position: absolute;

  top: 0;

  width: 100%;

  z-index: 9999999999;

}





.loader-layer.visible {

  display: block;

}





.profile_pic {

  width: 35%;

  float: left;

}



.img-circle.profile_img {



  background: #fff;

  margin-left: 15%;

  z-index: 1000;

  position: inherit;

  margin-top: 20px;

  /* border: 1px solid rgba(52, 73, 94, 0.44); */

  padding: 4px;

}



.profile_info {

  padding: 25px 10px 10px;

  width: 65%;

  float: left;

}





.profile_info span {

  font-size: 13px;

  line-height: 30px;

  color: #BAB8B8;

}



.profile_info h2 {

  font-size: 14px;

  color: #ECF0F1;

  margin: 0;

  font-weight: 300;

}



.profile.img_2 {

  text-align: center;

}



.profile.img_2 .profile_pic {

  width: 100%;

}



.profile.img_2 .profile_pic .img-circle.profile_img {

  width: 50%;

  margin: 10px 0 0;

}



.profile.img_2 .profile_info {

  padding: 15px 10px 0;

  width: 100%;

  margin-bottom: 10px;

  float: left;

}



.info-number .badge {

  font-size: 10px;

  font-weight: normal;

  line-height: 13px;

  padding: 2px 6px;

  position: absolute;

  right: -2px;

  top: -8px;

}



@media (min-width: 480px) {

  .nav_menu {

    position: static;

  }



  .item {

    display: block;

  }

}



.subs-product-conatiner {

  height: 682px;

  display: block;

  overflow-y: auto;

  overflow-x: hidden;

}





.pic-loader {

  position: absolute;

  left: 40%;

  top: 40%;

  -webkit-transform: translateY(-50%) translateX(-50%);   

  -webkit-animation: spin 0.35s infinite linear;

  animation: spin 0.35s infinite linear;

  border: 2px solid #707070;

    border-top-color: rgb(112, 112, 112);

  border-radius: 50%;

  border-top-color: white;

  height: 25px;

  -webkit-transform-origin: left;

  transform-origin: center;

  top: 45%;

  width: 25px;

  transform: translate(-50%, -50%);

  box-sizing: border-box;

}



.pic-hidden-input {

  left: -999px;

  position: absolute;

}



.pic-image-wrapper {

  background: rgba(0, 0, 0, 0.2);

  bottom: 0px;

  height: 100%;

  left: 0px;

  position: absolute;

  /* -webkit-transition: bottom 0.15s linear; */

  /* transition: height 1s; */

  width: 100%;

  border-radius: 50%;

  display: none;

  

  

  /* display: none; */

}

.pic-size{

  position: relative;

  width: 155px;

  height: 155px;

  overflow: hidden;  

  display: block;

}



.pic-size:hover .pic-image-wrapper {

  display: block;

  height: 100%; 

}

.pic-edit {

  position: absolute;

  left: 50%;
  top: 50%;
  
  color: white;
  
  cursor: pointer;
  
    -webkit-transform: translate(-50%, -50%);
  
    transform: translate(-50%, -50%);

  


 

}

/* .pic-name {

  font-family: Helvetica, "Helvetica Neue", "Tahoma";

  font-size: 18px;

} */



.pic-layer {

  background-color: rgba(0, 0, 0, 0.25);

  display: none;

  height: 100%;

  left: 0;

  position: absolute;

  top: 0;

  width: 100%;

  z-index: 9999999999;

  border-radius: 50%;

}

.pic-layer.pic-visible {

  display: block;

}



.plugin-image

{

  border:1px solid #ddd;

  padding: 5px;

  width: 150px;

  height: 150px

}

.plugin-image img

{

  width: 100%;

}

.plugin-title 

{

  padding: 1em;

  font-size: 20px;

  font-weight: 800;

  color:#036f7d;

}

.plugin-dev

{

  padding: 0em 1em;

  font-size: 16px;

  font-weight: 500;

  color:#19a585;

  margin-left: 15px;

}

.plugin-desc

{

  padding: 0.2em 1em;

  font-size: 15px;

  font-weight: 400;

  margin: 5px;

  color:#868686;

}

.plugin-install

{

  padding:0em 2em;

}