.elementor-211 .elementor-element.elementor-element-f54dd28{margin-top:0px;margin-bottom:0px;padding:32px 32px 0px 32px;}.elementor-211 .elementor-element.elementor-element-2691e4c{text-align:center;}.elementor-211 .elementor-element.elementor-element-2691e4c .elementor-heading-title{font-family:"Markl Mono", Sans-serif;font-size:25px;color:var( --e-global-color-d338137 );}.elementor-211 .elementor-element.elementor-element-3f8b64f{text-align:center;font-family:"Montserrat", Sans-serif;font-size:16px;color:var( --e-global-color-9e102b5 );}.elementor-bc-flex-widget .elementor-211 .elementor-element.elementor-element-81d8fb7.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-211 .elementor-element.elementor-element-81d8fb7.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-211 .elementor-element.elementor-element-81d8fb7.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-211 .elementor-element.elementor-element-9a88eb5{column-gap:0px;text-align:center;font-family:"Markl Mono", Sans-serif;font-size:18px;line-height:1.5em;color:var( --e-global-color-d338137 );}.elementor-211 .elementor-element.elementor-element-a858da2 .elementor-button{background-color:#02010100;font-family:"DotGothic16", Sans-serif;font-size:18px;fill:var( --e-global-color-d338137 );color:var( --e-global-color-d338137 );}.elementor-211 .elementor-element.elementor-element-a858da2 .elementor-button:hover, .elementor-211 .elementor-element.elementor-element-a858da2 .elementor-button:focus{background-color:var( --e-global-color-e22d09b );color:#FFFFFF;}.elementor-211 .elementor-element.elementor-element-a858da2{width:auto;max-width:auto;}.elementor-211 .elementor-element.elementor-element-a858da2 .elementor-button:hover svg, .elementor-211 .elementor-element.elementor-element-a858da2 .elementor-button:focus svg{fill:#FFFFFF;}.elementor-bc-flex-widget .elementor-211 .elementor-element.elementor-element-2c5f4ee.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-211 .elementor-element.elementor-element-2c5f4ee.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-211 .elementor-element.elementor-element-2c5f4ee.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-211 .elementor-element.elementor-element-6afc5a6{column-gap:0px;text-align:center;font-family:"Markl Mono", Sans-serif;font-size:18px;line-height:1.5em;color:var( --e-global-color-d338137 );}.elementor-211 .elementor-element.elementor-element-2c08c0d .elementor-button{background-color:#02010100;font-family:"DotGothic16", Sans-serif;font-size:18px;fill:var( --e-global-color-d338137 );color:var( --e-global-color-d338137 );}.elementor-211 .elementor-element.elementor-element-2c08c0d .elementor-button:hover, .elementor-211 .elementor-element.elementor-element-2c08c0d .elementor-button:focus{background-color:var( --e-global-color-e22d09b );color:#FFFFFF;}.elementor-211 .elementor-element.elementor-element-2c08c0d{width:auto;max-width:auto;}.elementor-211 .elementor-element.elementor-element-2c08c0d .elementor-button:hover svg, .elementor-211 .elementor-element.elementor-element-2c08c0d .elementor-button:focus svg{fill:#FFFFFF;}.elementor-bc-flex-widget .elementor-211 .elementor-element.elementor-element-6b3058a.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-211 .elementor-element.elementor-element-6b3058a.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-211 .elementor-element.elementor-element-6b3058a.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-211 .elementor-element.elementor-element-5923d84{column-gap:0px;text-align:center;font-family:"Markl Mono", Sans-serif;font-size:18px;line-height:1.5em;color:var( --e-global-color-d338137 );}.elementor-211 .elementor-element.elementor-element-783ea49 .elementor-button{background-color:#02010100;font-family:"DotGothic16", Sans-serif;font-size:18px;fill:var( --e-global-color-d338137 );color:var( --e-global-color-d338137 );}.elementor-211 .elementor-element.elementor-element-783ea49 .elementor-button:hover, .elementor-211 .elementor-element.elementor-element-783ea49 .elementor-button:focus{background-color:var( --e-global-color-e22d09b );color:#FFFFFF;}.elementor-211 .elementor-element.elementor-element-783ea49{width:auto;max-width:auto;}.elementor-211 .elementor-element.elementor-element-783ea49 .elementor-button:hover svg, .elementor-211 .elementor-element.elementor-element-783ea49 .elementor-button:focus svg{fill:#FFFFFF;}.elementor-211 .elementor-element.elementor-element-04a9def > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-211 .elementor-element.elementor-element-04a9def{margin-top:100px;margin-bottom:100px;padding:32px 32px 32px 32px;}.elementor-211 .elementor-element.elementor-element-364440e{text-align:center;}.elementor-211 .elementor-element.elementor-element-364440e .elementor-heading-title{font-family:"DotGothic16", Sans-serif;font-size:20px;color:var( --e-global-color-8c8b518 );}.elementor-211 .elementor-element.elementor-element-5a97a81{text-align:center;font-family:"DotGothic16", Sans-serif;font-size:16px;color:var( --e-global-color-9e102b5 );}body.elementor-page-211:not(.elementor-motion-effects-element-type-background), body.elementor-page-211 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://thycao-portfolio.com/wp-content/uploads/2023/03/bg-2023-01-scaled.jpg");background-repeat:no-repeat;background-size:auto;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-211 .elementor-element.elementor-element-f54dd28{padding:24px 24px 0px 24px;}.elementor-211 .elementor-element.elementor-element-2691e4c{text-align:center;}.elementor-211 .elementor-element.elementor-element-3f8b64f{text-align:center;}.elementor-211 .elementor-element.elementor-element-783ea49 .elementor-button{font-size:16px;}.elementor-211 .elementor-element.elementor-element-5a97a81{text-align:center;}}@media(max-width:767px){.elementor-211 .elementor-element.elementor-element-f54dd28{padding:24px 12px 0px 12px;}.elementor-211 .elementor-element.elementor-element-3f8b64f{font-size:16px;}.elementor-211 .elementor-element.elementor-element-9a88eb5{width:100%;max-width:100%;align-self:center;text-align:center;font-size:18px;}.elementor-211 .elementor-element.elementor-element-a858da2{width:100%;max-width:100%;}.elementor-211 .elementor-element.elementor-element-a858da2 > .elementor-widget-container:hover{--e-transform-scale:1.1;}.elementor-211 .elementor-element.elementor-element-6afc5a6{width:100%;max-width:100%;align-self:center;text-align:center;font-size:18px;}.elementor-211 .elementor-element.elementor-element-2c08c0d{width:100%;max-width:100%;}.elementor-211 .elementor-element.elementor-element-2c08c0d > .elementor-widget-container:hover{--e-transform-scale:1.1;}.elementor-211 .elementor-element.elementor-element-5923d84{width:100%;max-width:100%;align-self:center;text-align:center;font-size:18px;}.elementor-211 .elementor-element.elementor-element-783ea49{width:100%;max-width:100%;}.elementor-211 .elementor-element.elementor-element-783ea49 > .elementor-widget-container:hover{--e-transform-scale:1.1;}.elementor-211 .elementor-element.elementor-element-783ea49 .elementor-button{font-size:16px;}.elementor-211 .elementor-element.elementor-element-04a9def{padding:12px 12px 12px 12px;}.elementor-211 .elementor-element.elementor-element-175c6db > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-211 .elementor-element.elementor-element-5a97a81{font-size:16px;}}@media(max-width:1024px) and (min-width:768px){.elementor-211 .elementor-element.elementor-element-81d8fb7{width:100%;}.elementor-211 .elementor-element.elementor-element-2c5f4ee{width:100%;}.elementor-211 .elementor-element.elementor-element-6b3058a{width:100%;}}@media(min-width:1025px){body.elementor-page-211:not(.elementor-motion-effects-element-type-background), body.elementor-page-211 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}/* Start custom CSS for button, class: .elementor-element-a858da2 */#glow-on-hover:before {
    content: '';
    background: linear-gradient(45deg, #FFFFFF, #000000, #ffffff,#000000, #ffffff, #000000);
    position: absolute;
    top: -2px;
    left:-2px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    animation: glowing 20s linear infinite;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    border-radius: 10px;
}

#glow-on-hover:active {
    color: #000
}

#glow-on-hover:active:after {
    background: transparent;
}

#glow-on-hover:hover:before {
    opacity: 1;
}


#glow-on-hover:after {
    z-index: -1;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111;
    left: 0;
    top: 0;
    border-radius: 10px;
}

@keyframes glowing {
    0% { background-position: 0 0; }
    50% { background-position: 400% 0; }
    100% { background-position: 0 0; }
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-2c08c0d */#glow-on-hover:before {
    content: '';
    background: linear-gradient(45deg, #FFFFFF, #000000, #ffffff,#000000, #ffffff, #000000);
    position: absolute;
    top: -2px;
    left:-2px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    animation: glowing 20s linear infinite;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    border-radius: 10px;
}

#glow-on-hover:active {
    color: #000
}

#glow-on-hover:active:after {
    background: transparent;
}

#glow-on-hover:hover:before {
    opacity: 1;
}


#glow-on-hover:after {
    z-index: -1;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111;
    left: 0;
    top: 0;
    border-radius: 10px;
}

@keyframes glowing {
    0% { background-position: 0 0; }
    50% { background-position: 400% 0; }
    100% { background-position: 0 0; }
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-783ea49 */#glow-on-hover:before {
    content: '';
    background: linear-gradient(45deg, #FFFFFF, #000000, #ffffff,#000000, #ffffff, #000000);
    position: absolute;
    top: -2px;
    left:-2px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    animation: glowing 20s linear infinite;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    border-radius: 10px;
}

#glow-on-hover:active {
    color: #000
}

#glow-on-hover:active:after {
    background: transparent;
}

#glow-on-hover:hover:before {
    opacity: 1;
}


#glow-on-hover:after {
    z-index: -1;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111;
    left: 0;
    top: 0;
    border-radius: 10px;
}

@keyframes glowing {
    0% { background-position: 0 0; }
    50% { background-position: 400% 0; }
    100% { background-position: 0 0; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8590310 */.cube-container {
  width: 300px;
  height: 300px;
  position: relative;
  margin: 0 auto;
}

#cube {
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transform-style: preserve-3d;
  -webkit-animation: rotatecube 10s infinite;
  -moz-transform-style: preserve-3d;
  -moz-animation: rotatecube 10s infinite;
}

#cube div {
  width: 300px;
  height: 300px;
  display: block;
  position: absolute;
  border: 1px dotted #d5d5d5;
  line-height: 300px;
  text-align: center;
  font-size: 20px;
  font-weight: thin;
  color:#fff;
  font-family: "Markl Mono", sans-serif;
}

@-webkit-keyframes rotatecube {
  0% { -webkit-transform: rotateX(0deg) rotateY(360deg) rotateZ(90deg); }
  25% { -webkit-transform: rotateX(90deg) rotateY(270deg) rotateZ(180deg); }
  50% { -webkit-transform: rotateX(180deg) rotateY(180deg) rotateZ(0deg); }
  75% { -webkit-transform: rotateX(270deg) rotateY(90deg) rotateZ(360deg); }
  100% { -webkit-transform: rotateX(360deg) rotateY(0deg) rotateZ(270deg); }
}

@-moz-keyframes rotatecube {
  0% { -moz-transform: rotateX(0deg) rotateY(360deg) rotateZ(90deg); }
  25% { -moz-transform: rotateX(90deg) rotateY(270deg) rotateZ(180deg); }
  50% { -moz-transform: rotateX(180deg) rotateY(180deg) rotateZ(0deg); }
  75% { -moz-transform: rotateX(270deg) rotateY(90deg) rotateZ(360deg); }
  100% { -moz-transform: rotateX(360deg) rotateY(0deg) rotateZ(270deg); }
}

.front {
  background: rgba(30, 50, 127, .8);
}

.back {
  background: rgba(0,0,0,.5);
}

.right {
  background: rgba(0,0,0,.5);
}

.left {
  background: rgba(0,0,0,.5);
}

.top {
 background: rgba(0,0,0,.5);
}

.bottom {
  background: rgba(0,0,0,.5);
}

#cube .front  {
  -webkit-transform: rotateY(0deg ) translateZ( 150px );
  -moz-transform: rotateY( 0deg ) translateZ( 150px );
}
#cube .back {
  -webkit-transform: rotateX( 180deg ) translateZ( 150px );
  -moz-transform: rotateX( 180deg ) translateZ( 150px );
}
#cube .right  {
  -webkit-transform: rotateY(  90deg ) translateZ( 150px );
  -moz-transform: rotateY(  90deg ) translateZ( 150px );
}
#cube .left   {
  -webkit-transform: rotateY( -90deg ) translateZ( 150px );
  -moz-transform: rotateY( -90deg ) translateZ( 150px );
}
#cube .top    {
  -webkit-transform: rotateX(  90deg ) translateZ( 150px );
  -moz-transform: rotateX(  90deg ) translateZ( 150px );
}
#cube .bottom {
  -webkit-transform: rotateX( -90deg ) translateZ( 150px );
  -moz-transform: rotateX( -90deg ) translateZ( 150px );
}

.cube-container:hover .front {
    -webkit-animation:rainbow 1s infinite;
-ms-animation:rainbow 1s infinite;
-o-animation:rainbow 1s infinite;
animation:rainbow 1s infinite;
cursor:pointer;
} 

@-webkit-keyframes rainbow {
0% {background: rgba(255, 0, 0, .5);}
10% {background: rgba(255, 128, 0, .5);}
20% {background: rgba(255, 255, 0, .5)
;}
30% {background: rgba(128, 255, 0, .5)
;}
40% {background: rgba(30, 50, 127, .5);;}
50% {background: rgba(0, 255, 128, .5);}
60% {background: rgba(0, 255, 255, .5);}
70% {background: rgba(0, 128, 255, .5)
;}
80% {background: rgba(0, 0, 255, .5)
}
90% {background: rgba(128, 0, 255, .5);}
100% {background: rgba(255, 0, 128, .5);}
}
@-ms-keyframes rainbow {
0% {background: rgba(255, 0, 0, .5);}
10% {background: rgba(255, 128, 0, .5);}
20% {background: rgba(255, 255, 0, .5)
;}
30% {background: rgba(128, 255, 0, .5)
;}
40% {background: rgba(30, 50, 127, .5);;}
50% {background: rgba(0, 255, 128, .5);}
60% {background: rgba(0, 255, 255, .5);}
70% {background: rgba(0, 128, 255, .5)
;}
80% {background: rgba(0, 0, 255, .5)
}
90% {background: rgba(128, 0, 255, .5);}
100% {background: rgba(255, 0, 128, .5);}
}
@-o-keyframes rainbow {
0% {background: rgba(255, 0, 0, .5);}
10% {background: rgba(255, 128, 0, .5);}
20% {background: rgba(255, 255, 0, .5)
;}
30% {background: rgba(128, 255, 0, .5)
;}
40% {background: rgba(30, 50, 127, .5);;}
50% {background: rgba(0, 255, 128, .5);}
60% {background: rgba(0, 255, 255, .5);}
70% {background: rgba(0, 128, 255, .5)
;}
80% {background: rgba(0, 0, 255, .5)
}
90% {background: rgba(128, 0, 255, .5);}
100% {background: rgba(255, 0, 128, .5);}
}
@keyframes rainbow {
0% {background: rgba(255, 0, 0, .5);}
10% {background: rgba(255, 128, 0, .5);}
20% {background: rgba(255, 255, 0, .5)
;}
30% {background: rgba(128, 255, 0, .5)
;}
40% {background: rgba(30, 50, 127, .5);;}
50% {background: rgba(0, 255, 128, .5);}
60% {background: rgba(0, 255, 255, .5);}
70% {background: rgba(0, 128, 255, .5)
;}
80% {background: rgba(0, 0, 255, .5)
}
90% {background: rgba(128, 0, 255, .5);}
100% {background: rgba(255, 0, 128, .5);}
}

@mobile only screen and (max-width:480px){
    #cube div {
  width: 100px;
  height: 100px;
    }
    #cube .front  {
  -webkit-transform: rotateY(0deg ) translateZ( 50px );
  -moz-transform: rotateY( 0deg ) translateZ( 50px );
}
#cube .back {
  -webkit-transform: rotateX( 180deg ) translateZ( 50px );
  -moz-transform: rotateX( 180deg ) translateZ( 50px );
}
#cube .right  {
  -webkit-transform: rotateY(  90deg ) translateZ( 50px );
  -moz-transform: rotateY(  90deg ) translateZ( 50px );
}
#cube .left   {
  -webkit-transform: rotateY( -90deg ) translateZ( 50px );
  -moz-transform: rotateY( -90deg ) translateZ( 50px );
}
#cube .top    {
  -webkit-transform: rotateX(  90deg ) translateZ( 50px );
  -moz-transform: rotateX(  90deg ) translateZ( 50px );
}
#cube .bottom {
  -webkit-transform: rotateX( -90deg ) translateZ( 50px );
  -moz-transform: rotateX( -90deg ) translateZ( 50px );
}
    
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Markl Mono';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://thycao-portfolio.com/wp-content/uploads/2025/06/MarklMono-Regular.eot');
	src: url('https://thycao-portfolio.com/wp-content/uploads/2025/06/MarklMono-Regular.eot?#iefix') format('embedded-opentype'),
		url('https://thycao-portfolio.com/wp-content/uploads/2025/06/MarklMono-Regular.woff2') format('woff2'),
		url('https://thycao-portfolio.com/wp-content/uploads/2025/06/MarklMono-Regular.woff') format('woff'),
		url('https://thycao-portfolio.com/wp-content/uploads/2025/06/MarklMono-Regular.ttf') format('truetype');
}
/* End Custom Fonts CSS */