.stenLoading {
  padding-block: var(--zd_size13) var(--zd_size11) ;
  padding-inline:var(--zd_size15) ;
  position: relative;
  margin-block-end: var(--zd_size10) ;
  background-color: var(--zdt_gridstencils_default_bg);
  border-bottom: 1px solid var(--zdt_gridstencils_default_border);
  border-radius: 5px;
}

.stenLoadbody {
  margin-block: var(--zd_size8) ;
  margin-inline:0 var(--zd_size20) ;
}

.stenLoadbody::after {
  content: '';
  height: var(--zd_size22) ;
  width: var(--zd_size22) ;
  top: var(--zd_size15) ;
  position: absolute;
  border-radius: 50%;
  background-color: var(--zdt_gridstencils_after_bg);
}

[dir=ltr] .stenLoadbody::after {
  right: var(--zd_size20) ;
}

[dir=rtl] .stenLoadbody::after {
  left: var(--zd_size20) ;
}

.lineBar {
  width: 90% ;
}

.lineBar2 {
  width: 70% ;
  margin: var(--zd_size22) 0 ;
}

.lineBar3 {
  width: 50% ;
}

.lineBar,
.lineBar2,
.lineBar3 {
  height: var(--zd_size5) ;
}

.lineBar, .lineBar2, .lineBar3 {
  border-radius: 5px;
}
.stenListBAr {
  position: relative;
  background: var(--zdt_gridstencils_listbar_bg);
  background-image: var(--zdt_gridstencils_listbar_gradient_bg);
  background-repeat: no-repeat;
}
[dir=ltr] .stenListBAr {
  -webkit-animation-duration: var(--zd_transition10);
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name:  placeHolderShimmer-ltr ;
  -webkit-animation-timing-function: linear;
}
[dir=rtl] .stenListBAr {
  -webkit-animation-duration: var(--zd_transition10);
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name:  placeHolderShimmer-rtl ;
  -webkit-animation-timing-function: linear;
}
.stenListBAr {
  background: var(--zdt_gridstencils_listbar_bg);
  background-image: var(--zdt_gridstencils_listbar_gradient_bg);
  background-repeat: no-repeat;
}
[dir=ltr] .stenListBAr {
  -webkit-animation-duration: var(--zd_transition10);
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name:  placeHolderShimmer-ltr ;
  -webkit-animation-timing-function: linear;
}
[dir=rtl] .stenListBAr {
  -webkit-animation-duration: var(--zd_transition10);
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name:  placeHolderShimmer-rtl ;
  -webkit-animation-timing-function: linear;
}
@keyframes placeHolderShimmer-ltr {
  0% {
    background-position: -468px 0;
  }

  100% {
    background-position: 468px 0;
  }
}
@keyframes placeHolderShimmer-rtl {
  0% {
    background-position: right -468px top 0;
  }

  100% {
    background-position: right 468px top 0;
  }
}
.threeLayout .stenLoadbody::before {
  transform: scale(0.8);
}
[dir=ltr] .threeLayout .stenLoadbody::before {
  left: var(--zd_size16) ;
}
[dir=rtl] .threeLayout .stenLoadbody::before {
  right: var(--zd_size16) ;
}
[dir=ltr] .threeLayout .stenLoadbody {
  margin: var(--zd_size8) var(--zd_size20) var(--zd_size8) 0 ;
}
[dir=rtl] .threeLayout .stenLoadbody {
  margin: var(--zd_size8) 0 var(--zd_size8) var(--zd_size20) ;
}
.threeLayout .stenLoadbody::after {
  top: var(--zd_size15) ;
  transform: scale(0.8);
}
[dir=ltr] .threeLayout .stenLoadbody::after {
  right: var(--zd_size20) ;
}
[dir=rtl] .threeLayout .stenLoadbody::after {
  left: var(--zd_size20) ;
}
[dir=ltr] .leftCont .stenLoadbody::before {
  left: var(--zd_size33) ;
}
[dir=rtl] .leftCont .stenLoadbody::before {
  right: var(--zd_size33) ;
}
[dir=ltr] .leftCont .stenLoadbody {
  margin: var(--zd_size8) var(--zd_size20) var(--zd_size8) var(--zd_size46) ;
}
[dir=rtl] .leftCont .stenLoadbody {
  margin: var(--zd_size8) var(--zd_size46) var(--zd_size8) var(--zd_size20) ;
}
[dir=ltr] .leftCont .stenLoadbody::after {
  right: var(--zd_size40) ;
}
[dir=rtl] .leftCont .stenLoadbody::after {
  left: var(--zd_size40) ;
}
.leftCont .lineBar {
  width: 80% ;
}
.leftCont .lineBar2 {
  width: 60% ;
}
.leftCont .lineBar3 {
  width: 40% ;
}