.elementor-5209 .elementor-element.elementor-element-2716a99{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5209 .elementor-element.elementor-element-2716a99:not(.elementor-motion-effects-element-type-background), .elementor-5209 .elementor-element.elementor-element-2716a99 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#445C3A;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-5209 .elementor-element.elementor-element-7463463{width:var( --container-widget-width, 50% );max-width:50%;margin:50px 20px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:50%;--container-widget-flex-grow:0;text-align:start;font-family:"Poppins", Sans-serif;font-size:1.3em;font-weight:400;text-transform:uppercase;color:var( --e-global-color-primary );}.elementor-5209 .elementor-element.elementor-element-7463463.elementor-element{--align-self:flex-end;}.elementor-5209 .elementor-element.elementor-element-39ad293{--display:flex;--position:fixed;--min-height:100vh;--justify-content:flex-end;top:0px;}body:not(.rtl) .elementor-5209 .elementor-element.elementor-element-39ad293{left:0px;}body.rtl .elementor-5209 .elementor-element.elementor-element-39ad293{right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-5209 .elementor-element.elementor-element-688ab7b{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:10px 50px 10px 50px;}.elementor-5209 .elementor-element.elementor-element-688ab7b .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:17rem;font-weight:400;text-transform:uppercase;color:#888878;}.elementor-5209 .elementor-element.elementor-element-3165790{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5209 .elementor-element.elementor-element-3165790:not(.elementor-motion-effects-element-type-background), .elementor-5209 .elementor-element.elementor-element-3165790 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#445C3A;}.elementor-5209 .elementor-element.elementor-element-5af354f{--display:flex;--min-height:100vh;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:1;}.elementor-5209 .elementor-element.elementor-element-1a1c1ee .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:12rem;font-weight:400;text-transform:uppercase;color:#888878;}.elementor-5209 .elementor-element.elementor-element-20bceec{--display:flex;--min-height:100vh;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:2;}.elementor-5209 .elementor-element.elementor-element-20bceec:not(.elementor-motion-effects-element-type-background), .elementor-5209 .elementor-element.elementor-element-20bceec > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#D65E5E;}.elementor-5209 .elementor-element.elementor-element-2649ac3 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:12rem;font-weight:400;text-transform:uppercase;color:#888878;}.elementor-5209 .elementor-element.elementor-element-b942937{--display:flex;--min-height:100vh;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:3;}.elementor-5209 .elementor-element.elementor-element-b942937:not(.elementor-motion-effects-element-type-background), .elementor-5209 .elementor-element.elementor-element-b942937 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#2B304B;}.elementor-5209 .elementor-element.elementor-element-af618a6 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:12rem;font-weight:400;text-transform:uppercase;color:#888878;}.elementor-5209 .elementor-element.elementor-element-42dc639{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for heading, class: .elementor-element-688ab7b */.elementor-5209 .elementor-element.elementor-element-688ab7b h1 { hyphens: auto;}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-1a1c1ee */.elementor-5209 .elementor-element.elementor-element-1a1c1ee h1 { hyphens: auto;}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-2649ac3 */.elementor-5209 .elementor-element.elementor-element-2649ac3 h1 { hyphens: auto;}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-af618a6 */.elementor-5209 .elementor-element.elementor-element-af618a6 h1 { hyphens: auto;}/* End custom CSS */ /* Start custom CSS */.cube{ position: relative; height: 300px; width: 300px; transform-style: preserve-3d; transform: rotateX(-30deg); animation: animate 4s linear infinite ; } .cube div{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform-style: preserve-3d; } @keyframes animate { 0%{ transform: rotateX(-30deg) rotateY(0deg); } 100%{ transform: rotateX(-30deg) rotateY(360deg); } } .cube div span{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; /* background: linear-gradient( black, rgb(0, 255, 0)); */ /* background: linear-gradient( to left, black, red, green, blue) ; */ transform: rotateY( calc(90deg * var(--i)) ) translateZ(150px); } .cube div span.red { background: linear-gradient( black, red) ; } .cube div span.green { background: linear-gradient( black, rgb(0, 255, 0)) ; } .cube div span.blue { background: linear-gradient( black, rgb(0, 0, 255)) ; } .cube div span.yellow { background: linear-gradient( black, rgb(255, 255, 0)) ; } .cube div span.white { background: linear-gradient( black, rgb(255, 255, 255)) ; } .top{ position: absolute; top: 0; left: 0; width: 300px; height: 300px; background: rgb(26, 26, 26); transform: rotateX(90deg) translateZ(150px); } .top::before{ content: ""; position: absolute; top: 0; left: 0; width: 300px; height: 300px; /* background: rgb(0, 255, 0); */ transform: translateZ( -380px ) ; filter: blur(20px); /* box-shadow: 0 0 120px rgb(0, 255, 0, 0.2), 0 0 200px rgb(0, 255, 0, 0.4), 0 0 300px rgb(0, 255, 0, 0.6), 0 0 400px rgb(0, 255, 0, 0.8), 0 0 500px rgb(0, 255, 0, 1);*/ } .top.red::before{ background: red; box-shadow: 0 0 120px rgb(255, 0, 0, 0.2), 0 0 200px rgb(255, 0, 0, 0.4), 0 0 300px rgb(255, 0, 0, 0.6), 0 0 400px rgb(255, 0, 0, 0.8), 0 0 500px rgb(255, 0, 0, 1); } .top.green::before{ background: green; box-shadow: 0 0 120px rgb(0, 255, 0, 0.2), 0 0 200px rgb(0, 255, 0, 0.4), 0 0 300px rgb(0, 255, 0, 0.6), 0 0 400px rgb(0, 255, 0, 0.8), 0 0 500px rgb(0, 255, 0, 1); } .top.yellow::before{ background: yellow; box-shadow: 0 0 120px rgb(255, 255, 0, 0.2), 0 0 200px rgb(255, 255, 0, 0.4), 0 0 300px rgb(255, 255, 0, 0.6), 0 0 400px rgb(255, 255, 0, 0.8), 0 0 500px rgb(255, 255, 0, 1); } .top.blue::before{ background: blue; box-shadow: 0 0 120px rgb(0, 0, 255, 0.2), 0 0 200px rgb(0, 0, 255, 0.4), 0 0 300px rgb(0, 0, 255, 0.6), 0 0 400px rgb(0, 0, 255, 0.8), 0 0 500px rgb(0, 0, 255, 1); } .top.white::before{ background: white; box-shadow: 0 0 120px rgb(255, 255, 255, 0.2), 0 0 200px rgb(255, 255, 255, 0.4), 0 0 300px rgb(255, 255, 255, 0.6), 0 0 400px rgb(255, 255, 255, 0.8), 0 0 500px rgb(255, 255, 255, 1); } div.options button { padding: 5px 15px; margin: 0 20px; font-size: 16px; color: white; background: black; border: 2px solid white; border-radius: 15px; cursor: pointer; } div.options button:hover{ background: white; color: black; }/* End custom CSS */