@import"https://fonts.googleapis.com/css2?family=Monoton&family=Paytone+One&family=Ubuntu:wght@400;500;700&display=swap";html,body{width:100%;height:100%;margin:0;padding:0}*{box-sizing:border-box}@keyframes bganimation{0%{background-position:-100% -100%,200% 200%,-100% 200%,200% -100%}50%{background-position:150% 100%,-200% 100%,100% 0%,0% 100%}to{background-position:-100% -100%,200% 200%,-100% 200%,200% -100%}}body{background:radial-gradient(ellipse at center,#a926a04d,#0000 70%),radial-gradient(ellipse at center,#ff00004d,#0000 70%),radial-gradient(ellipse at center,#00e1ff4d,#0000 70%) var(--theme-main);background-repeat:no-repeat,no-repeat,no-repeat;background-size:200%,200%,200%;background-attachment:fixed;background-color:var(--theme-main);animation:bganimation 13s infinite}body:has(.yellow){--theme-font: #073b4c;--theme-font-second: #6c757d;--theme-icon: #580aff;--theme-font-opposite: #f8f9fa;--theme-main: #fee440}body:has(.blue){--theme-font: #333533;--theme-font-second: #0a2463;--theme-icon: #ff6000;--theme-font-opposite: #ffecd1;--theme-main: #98f5e1}body:has(.dark){--theme-font: #b9fbc0;--theme-font-second: #fbfefb;--theme-icon: #00bbf9;--theme-font-opposite: #0b2545;--theme-main: #000102}body:has(.red){--theme-font: #d8a48f;--theme-font-second: #fbf8cc;--theme-icon: #ffffff;--theme-font-opposite: #0f4c5c;--theme-main: #9a031e}.theme-icon{font-size:24px;cursor:pointer;transition:transform .2s ease,color .2s ease}.theme-icon.yellow{color:#fee440}.theme-icon.blue{color:#072ac8}.theme-icon.red{color:#ea2525}.theme-icon.dark{color:#000102}.theme-icon.inactive{opacity:.6}.theme-icon:hover{opacity:1}.card-text{color:var(--theme-font)!important}.icon-set{opacity:0;animation:fadeIn 4s ease-in-out 2s forwards}.nav-link{transition:all .3s ease-in-out;color:var(--theme-font)!important}.nav-item .active,.nav-link:hover{color:var(--theme-font)!important;text-decoration:underline;text-decoration-color:var(--theme-icon);text-decoration-thickness:3px;text-underline-offset:4px}.navbar{opacity:0;animation:fadeIn 4s ease-in-out 2s forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.container{background:transparent}#home h1,#home p{color:var(--theme-font)}.btn-connect{background-color:var(--theme-font)!important;cursor:pointer;color:var(--theme-font-opposite);transition:all .3s ease-in-out}.btn-connect:hover{background-color:var(--theme-icon)!important;transform:scale(1.05);cursor:pointer;color:var(--theme-font-opposite)}.btn-connect{opacity:0;transform:scale(1);animation:showAndScale .5s ease-in-out 4s forwards}@keyframes showAndScale{0%{opacity:0;transform:scale(1)}25%{opacity:1;transform:scale(1.1)}50%{opacity:1;transform:scale(1)}75%{opacity:1;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.me{background-color:var(--theme-font)}.typing{white-space:nowrap;overflow:hidden;width:fit-content;animation:typing 4s steps(30,end),cursor .6s step-end infinite}@keyframes typing{0%{width:0}to{width:100%}}@keyframes cursor{0%{border-right-color:transparent}to{border-right-color:#000}}.typing:after{content:"";width:2px;height:1em;margin-left:4px;background-color:#000;animation:cursor .6s step-end infinite}.floating{opacity:0;transform:translateY(100%);animation:floatIn 2s ease-in-out 2s forwards}.floating-img{opacity:0;transform:translate(100%);animation:floatIn20 1s ease-in-out 3.5s forwards}@keyframes floatIn{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes floatIn20{0%{opacity:0;transform:translate(20%)}to{opacity:1;transform:translate(0)}}.card{min-height:24rem;background-color:transparent}.project-img{width:100%;height:auto;object-fit:cover}.card-title{font-family:Ubuntu,sans-serif;font-weight:700;font-style:normal;letter-spacing:-1px;line-height:1}.react-tooltip{max-width:19rem;line-height:1.5;font-size:.9rem}.project-detail-img{width:100%;height:auto;object-fit:cover;border:1rem solid var(--theme-font);border-radius:1rem}.mytitle{font-family:Monoton,sans-serif;text-align:center;font-size:3.5rem;margin-top:4rem;color:var(--theme-font);opacity:0;transform:translateY(-1rem);animation:bounce-title 1.5s ease-out 5s forwards}.title-container i{color:var(--theme-icon);transform:translateY(-1rem)}.title-container .description{transform:translateY(-1.2rem)}.description{color:var(--theme-font-second);opacity:0;animation:bounce-desc 1s ease-out 6s forwards}.title-i{opacity:0;transform:translate(-100px);animation:flyIn-left 1s ease-out 6.5s forwards;transform:translateY(-1.2rem)}@keyframes bounce-desc{0%{opacity:0;transform:translateY(-2.5rem)}to{opacity:1;transform:translateY(-1.2rem)}}@keyframes bounce-title{0%{opacity:0;transform:translateY(-2.5rem)}to{opacity:1;transform:translateY(-1rem)}}@keyframes flyIn-left{0%{opacity:0;transform:translate(-100px);transform:translateY(-1.2rem)}to{opacity:1;transform:translate(0);transform:translateY(-1.2rem)}}@keyframes flyIn-right{0%{opacity:0;transform:translate(100px)}to{opacity:1;transform:translate(0)}}.view{transform:translateY(-1.8rem);color:var(--theme-font);opacity:0;transform:translate(100px);animation:flyIn-right 1s ease-out 6.5s forwards}.view i{transition:color .3s}.view i:hover,.view i.active-view{color:var(--theme-icon)}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;opacity:0;animation:bounce-view 1.5s ease-in-out forwards}.project-list{opacity:0;animation:flyIn-view 1.5s ease-out forwards}@media screen and (max-width:768px){.project-grid{grid-template-columns:repeat(2,1fr)}}@media screen and (max-width:480px){.project-grid{grid-template-columns:1fr}}@keyframes flyIn-right{0%{opacity:0;transform:translate(100px);transform:translateY(-1.8rem)}to{opacity:1;transform:translate(0);transform:translateY(-1.8rem)}}@keyframes bounce-view{0%{opacity:0;transform:translateY(-2.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes flyIn-view{0%{opacity:0;transform:translate(6rem)}to{opacity:1;transform:translate(0)}}.skill-shadow{filter:drop-shadow(0 0 10px rgba(0,0,0,.2))}.small-70{transform:scale(.7)}.small-80{transform:scale(.8)}.small-55{transform:scale(.55)}.small-40{transform:scale(.4)}.skill-container{display:flex;overflow:hidden;width:100%;background:#ffffff80}.scroll-animation{display:flex;animation:scroll-left 30s linear infinite}.scroll-animation img{margin:0 1rem;max-height:3rem;width:auto}@keyframes scroll-left{0%{transform:translate(0)}to{transform:translate(-50%)}}#connect{background-color:var(--theme-font);color:var(--theme-font-opposite)}.connect-title{font-family:Monoton,sans-serif;text-align:center;font-size:3rem;margin-top:2rem;color:var(--theme-font-opposite)}#connect h5{color:var(--theme-main)}#connect i{font-size:2.5rem}.btn-msg{color:var(--theme-font-opposite);background-color:transparent;border:solid 1px var(--theme-font-opposite);transition:all .3s ease-in-out}.btn-msg:hover{color:var(--theme-font);background-color:var(--theme-font-opposite);border:solid 1px var(--theme-font-opposite)}.nav-bottom a{text-decoration:none}.nav-bottom-link{color:var(--theme-font-opposite)!important;transition:all .3s ease-in-out}.nav-bottom .active,.nav-bottom-link:hover{text-decoration:underline;text-decoration-color:var(--theme-font-opposite);text-decoration-thickness:2px;text-underline-offset:4px}.connect{text-decoration:none;color:var(--theme-font-opposite);transition:all .3s ease-in-out}.connect:hover{color:var(--theme-main)}#footer{background-color:var(--theme-font);color:var(--theme-font-opposite)}:root{--theme-font: #073b4c;--theme-font-second:#6c757d;--theme-icon:#580aff;--theme-font-opposite:#f8f9fa;--theme-main:#fee440}#root{max-width:1366px;margin:0;padding:0;text-align:center}.card-title,.link{color:var(--theme-font)}.project-detail .link:hover{color:var(--theme-icon)!important}.grid-item:hover{background-color:var(--theme-font);color:var(--theme-font-opposite)}.grid-item:hover .link,.grid-item:hover .card-title{color:var(--theme-font-opposite)!important}.grid-item:hover .link:hover{color:var(--theme-main)!important}