Omar A. Garcia
I’m a
.scroll-fade {
position: relative;
z-index: 5;
padding: 3rem 1rem;
}
.scroll-fade-inner {
text-align: center;
transition: opacity 0.6s ease, transform 0.6s ease;
}
body.scrolled .scroll-fade-inner {
opacity: 0;
transform: translateY(-40px);
pointer-events: none;
}
#shimmer-name {
font-size: 1.5rem;
font-weight: 600;
display: inline-block;
background: linear-gradient(270deg, #BC885D, #ffffff, #BC885D);
background-size: 300% 100%;
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
animation: shimmerGradient 4s ease infinite;
text-shadow: 0 0 10px rgba(255,255,255,0.3);
letter-spacing: 1.2px;
margin-bottom: 1rem;
}
.floating-divider {
width: 60px;
height: 2px;
background: #BC885D;
margin: 1rem auto;
border-radius: 4px;
animation: floatUpDown 3s ease-in-out infinite;
box-shadow: 0 0 8px rgba(188, 136, 93, 0.4);
}
#intro-heading {
font-size: 2.5rem;
font-weight: 600;
font-family: 'Poppins', sans-serif;
color: #fff;
letter-spacing: 1px;
}
.golden-typed {
color: #BC885D;
}
@keyframes shimmerGradient {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@keyframes floatUpDown {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-8px); }
}
window.addEventListener('scroll', () => {
const threshold = 60;
document.body.classList.toggle('scrolled', window.scrollY > threshold);
});
document.addEventListener("DOMContentLoaded", function () {
new Typed("#typed-text", {
strings: ["developer.", "student.", "problem solver.", "creative thinker.", "lifelong learner.","tech enthusiast."],
typeSpeed: 60,
backSpeed: 40,
backDelay: 1200,
loop: true
});
});
Omar A. Garcia
I’m a
About Me
Experience
.blocks-section {
text-align: left;
padding: 2rem 1rem;
max-width: 600px;
margin: 0 auto;
}
.title-container {
display: inline-block;
position: relative;
}
.blocks-title {
font-family: 'Poppins', sans-serif;
font-weight: 600;
font-size: 1.2rem;
color: #ffffff;
letter-spacing: 0.8px;
margin: 0;
}
/* Auto-width underline using relative width to the text */
.block-underline-auto {
position: absolute;
bottom: -6px;
left: 0;
height: 6px;
background-color: #BC885D;
border-radius: 3px;
width: 100%;
transform: scaleX(0);
transform-origin: left;
animation: expandBlock 2s ease-in-out infinite;
}
@keyframes expandBlock {
0%, 100% {
transform: scaleX(0);
opacity: 0.3;
}
50% {
transform: scaleX(1);
opacity: 1;
}
}
Experience
US Marine Corps (2016 - 2020)
.shimmer-years {
display: inline-block;
background: linear-gradient(270deg, #BC885D, #ffffff, #BC885D);
background-size: 300% 100%;
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
animation: shimmerGradient 4s ease infinite;
text-shadow: 0 0 10px rgba(255,255,255,0.3);
font-weight: 600;
letter-spacing: 0.8px;
}
@keyframes shimmerGradient {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
CRH&C (2022 - 2024)
.shimmer-years {
display: inline-block;
background: linear-gradient(270deg, #BC885D, #ffffff, #BC885D);
background-size: 300% 100%;
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
animation: shimmerGradient 4s ease infinite;
text-shadow: 0 0 10px rgba(255,255,255,0.3);
font-weight: 600;
letter-spacing: 0.8px;
}
@keyframes shimmerGradient {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
Education
.blocks-section {
text-align: left;
padding: 2rem 1rem;
max-width: 600px;
margin: 0 auto;
}
.title-container {
display: inline-block;
position: relative;
}
.blocks-title {
font-family: 'Poppins', sans-serif;
font-weight: 600;
font-size: 1.2rem;
color: #ffffff;
letter-spacing: 0.8px;
margin: 0;
}
/* Auto-width underline using relative width to the text */
.block-underline-auto {
position: absolute;
bottom: -6px;
left: 0;
height: 6px;
background-color: #BC885D;
border-radius: 3px;
width: 100%;
transform: scaleX(0);
transform-origin: left;
animation: expandBlock 2s ease-in-out infinite;
}
@keyframes expandBlock {
0%, 100% {
transform: scaleX(0);
opacity: 0.3;
}
50% {
transform: scaleX(1);
opacity: 1;
}
}
Education
Texas State University (Current)
.shimmer-years {
display: inline-block;
background: linear-gradient(270deg, #BC885D, #ffffff, #BC885D);
background-size: 300% 100%;
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
animation: shimmerGradient 4s ease infinite;
text-shadow: 0 0 10px rgba(255,255,255,0.3);
font-weight: 600;
letter-spacing: 0.8px;
}
@keyframes shimmerGradient {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
B.S. in Computer Science
Minor in Applied Mathematics
Tech That Powers My Work
Portfolio
Company Website
TXST Parking Pass Notifier Bot
Discord Bot
