.elementor-672 .elementor-element.elementor-element-3afac07{--display:flex;--background-transition:0.3s;--padding-top:50%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;}.elementor-672 .elementor-element.elementor-element-9cf5052{width:var( --container-widget-width, 0.521% );max-width:0.521%;--container-widget-width:0.521%;--container-widget-flex-grow:0;top:25%;}.elementor-672 .elementor-element.elementor-element-9cf5052 > .elementor-widget-container{margin:0% 0% 0% 0%;padding:0% 0% 0% 0%;}.elementor-672 .elementor-element.elementor-element-9cf5052.elementor-element{--flex-grow:0;--flex-shrink:0;}body:not(.rtl) .elementor-672 .elementor-element.elementor-element-9cf5052{left:37%;}body.rtl .elementor-672 .elementor-element.elementor-element-9cf5052{right:37%;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}body:not(.rtl) .elementor-672 .elementor-element.elementor-element-720e0c0{left:3%;}body.rtl .elementor-672 .elementor-element.elementor-element-720e0c0{right:3%;}.elementor-672 .elementor-element.elementor-element-720e0c0{top:50%;}.elementor-672 .elementor-element.elementor-element-720e0c0 .elementor-icon-wrapper{text-align:right;}.elementor-672 .elementor-element.elementor-element-720e0c0 .elementor-icon{font-size:100%;}.elementor-672 .elementor-element.elementor-element-720e0c0 .elementor-icon svg{height:100%;}.elementor-672 .elementor-element.elementor-element-8438657 > .elementor-widget-container{padding:0% 0% 0% 0%;}.elementor-672 .elementor-element.elementor-element-8438657.elementor-element{--align-self:center;}body:not(.rtl) .elementor-672 .elementor-element.elementor-element-8438657{left:50%;}body.rtl .elementor-672 .elementor-element.elementor-element-8438657{right:50%;}.elementor-672 .elementor-element.elementor-element-8438657{top:3%;}.elementor-672 .elementor-element.elementor-element-8438657 .elementor-icon-wrapper{text-align:right;}.elementor-672 .elementor-element.elementor-element-8438657 .elementor-icon{font-size:100%;}.elementor-672 .elementor-element.elementor-element-8438657 .elementor-icon svg{height:100%;}@media(max-width:700px){body:not(.rtl) .elementor-672 .elementor-element.elementor-element-9cf5052{left:28%;}body.rtl .elementor-672 .elementor-element.elementor-element-9cf5052{right:28%;}.elementor-672 .elementor-element.elementor-element-9cf5052{top:36%;}body:not(.rtl) .elementor-672 .elementor-element.elementor-element-720e0c0{left:3%;}body.rtl .elementor-672 .elementor-element.elementor-element-720e0c0{right:3%;}.elementor-672 .elementor-element.elementor-element-720e0c0{top:49%;}body:not(.rtl) .elementor-672 .elementor-element.elementor-element-8438657{left:50%;}body.rtl .elementor-672 .elementor-element.elementor-element-8438657{right:50%;}.elementor-672 .elementor-element.elementor-element-8438657{top:1%;}}@media(max-width:500px){body:not(.rtl) .elementor-672 .elementor-element.elementor-element-9cf5052{left:26%;}body.rtl .elementor-672 .elementor-element.elementor-element-9cf5052{right:26%;}.elementor-672 .elementor-element.elementor-element-9cf5052{top:25%;}.elementor-672 .elementor-element.elementor-element-720e0c0 > .elementor-widget-container{margin:0% 0% 0% 0%;padding:32% 0% 0% 0%;}body:not(.rtl) .elementor-672 .elementor-element.elementor-element-720e0c0{left:4%;}body.rtl .elementor-672 .elementor-element.elementor-element-720e0c0{right:4%;}.elementor-672 .elementor-element.elementor-element-720e0c0{top:47%;}.elementor-672 .elementor-element.elementor-element-8438657 > .elementor-widget-container{margin:0% 0% 0% 0%;padding:32% 0% 0% 0%;}body:not(.rtl) .elementor-672 .elementor-element.elementor-element-8438657{left:50%;}body.rtl .elementor-672 .elementor-element.elementor-element-8438657{right:50%;}.elementor-672 .elementor-element.elementor-element-8438657{top:0%;}}/* Start custom CSS for html, class: .elementor-element-9cf5052 */*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box }
body { height: 100vh; display: grid; place-items: center; background-color: #1D1E22 }

/* scene set-up */
[scene], [rotation], [center-z] { display: grid }
[scene] :not(:empty) { transform-style: preserve-3d }
[scene] { width: var(--size); perspective: calc(var(--size) * 2); aspect-ratio: 1 }

/* rotate/animate scene  */
[rotation][animate="true"] { animation: rotateScene 10s linear infinite }
@keyframes rotateScene{ to { transform: rotateY(360deg) } }

/* position contents to z-center */
[center-z] { transform: translateZ(calc(var(--size) * .5)) }

/* grid */
[grid] { 
  display: grid;
  grid-template-columns: repeat(var(--dimension), 1fr);
  grid-template-rows: repeat(var(--dimension), 1fr);
}

/* pixel */
[pixel] {
  --pixel-size: calc(var(--size) / var(--dimension));
  grid-row: calc(var(--dimension) - var(--l) + 1); 
  grid-column: var(--c); 
  transform: translateZ(calc(var(--pixel-size) * (var(--dimension) - var(--r)) * -1));
  background-color: var(--color);
}
/* sides set up */
[pixel], [pixel] > span { display: grid }
[pixel] > span { background-color: inherit; transform-style: preserve-3d }
[pixel]::before, [pixel]::after, [pixel] > span::before, [pixel] > span::after { content: ""; background-color: inherit }
[pixel]::before, [pixel]::after, [pixel] > span, [pixel] > span::before, [pixel] > span::after { grid-column: 1; grid-row: 1 }

/*sides orientation*/
[pixel]::before { transform-origin: left; transform: rotateY(90deg) } /*left*/
[pixel]::after { transform-origin: right; transform: rotateY(-90deg) } /*right*/
[pixel] > span { transform: translateZ(calc(var(--pixel-size) * -1)) } /*back*/
[pixel] > span::before { transform-origin: top; transform: rotateX(90deg) } /*top*/
[pixel] > span::after { transform-origin: bottom; transform: rotateX(-90deg) } /*bottom*/

/* shading */
[pixel]::after{ background-image: linear-gradient(rgb(0 0 0 / .25) 100%, transparent) }/*right*/
[pixel] > span::after { background-image: linear-gradient(rgb(0 0 0 / .375) 100%, transparent) }/*bottom*/

/*lighting*/
[pixel]::before { background-image: linear-gradient(rgb(255 255 255 / .25) 100%, transparent) }/*left*/
[pixel] > span::before { background-image: linear-gradient(rgb(255 255 255 / .375) 100%, transparent) }/*top*//* End custom CSS */