/* /Components/Layout/Background.razor.rz.scp.css */
body[b-251ba90byn] {
    margin: 0;
    min-height: 100vh;
    background: radial-gradient( circle at top left, rgba(178, 103, 94, 0.35), transparent 30% ), radial-gradient( circle at bottom right, rgba(39, 111, 191, 0.30), transparent 35% ), radial-gradient( circle at center, rgba(97, 208, 149, 0.20), transparent 40% ), linear-gradient( 135deg, #F7F7FF 0%, #eef2ff 100% );
    background-attachment: fixed;
}

body[b-251ba90byn]::before {
    content: "";
    position: fixed;
    inset: 0;
    background-image: linear-gradient( rgba(255,255,255,0.04) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255,255,255,0.04) 1px, transparent 1px );
    background-size: 40px 40px;
    pointer-events: none;
}

.background-blob[b-251ba90byn] {
    background: var(--accent-color);
    position: fixed;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    z-index: -1;
    animation: float-b-251ba90byn 9s ease-in-out infinite;
}

.blob1[b-251ba90byn] {
    top: -100px;
    left: -100px;
}

.blob2[b-251ba90byn] {
    bottom: -100px;
    right: -100px;
    animation-delay: 1s;
}

.blob3[b-251ba90byn] {
    top: 30%;
    left: 20%;
    animation-delay: 2s;
}
.blob4[b-251ba90byn] {
    top: 40%;
    left:90%;
    animation-delay: 3s;
}
.blob5[b-251ba90byn] {
    top: 80%;
    left: 0%;
    animation-delay: 4s;
}
.blob6[b-251ba90byn] {
    top: 10%;
    left: 70%;
    animation-delay: 5s;
}

@keyframes float-b-251ba90byn {
    0% {
        transform: translateY(0px) translateX(0px);
    }

    50% {
        transform: translateY(-200px) translateX(10px);
    }

    100% {
        transform: translateY(0px) translateX(0px);
    }
}
/* /Components/Layout/Game.razor.rz.scp.css */
*[b-5yyjk3fw0s] {
    all: unset;
}

.gameContainer[b-5yyjk3fw0s] {
    padding: 10px;
    width: 75%;
    aspect-ratio: 1 / 1;
    border: 3px solid var(--primary-color);
    background-color: var(--background-color);
    border-radius: 10px;
    display: flex;
    justify-content: center;

}

.innerGameContainer[b-5yyjk3fw0s] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.row[b-5yyjk3fw0s] {
    flex: 1;
    display: flex;
}

.square[b-5yyjk3fw0s] {
    flex: 1;
    border: 2px solid var(--primary-color);
    box-sizing: border-box;
    cursor: pointer;
}
.hidden[b-5yyjk3fw0s] {
    visibility:hidden;
}

button[b-5yyjk3fw0s] {
    align-self: center;
    justify-self: center;
    place-self: center;
    font-family: 'Raleway';
    font-weight: 900;
    font-size: xx-large;
    color: var(--primary-color);
    padding: 4px 16px 4px 16px;
    border-radius: 8px;
    border: 2px solid var(--primary-color);
    transition: all 0.25s ease-in;
}

.computerChecked[b-5yyjk3fw0s] {
    background: red;
    background: url(/images/me_symbol.png);
    background-size: contain;
}
.playerChecked[b-5yyjk3fw0s]{
    background: url(/images/player_symbol.png);
    background-size: contain;
}

.chat[b-5yyjk3fw0s]{
    min-height:200px;
    font-size: x-large;
    font-weight: 600;
    color: var(--primary-color);
}

@media (min-width: 768px){
    button:hover[b-5yyjk3fw0s]{
        background-color: var(--secondary-color);
    }
}

@media (max-width: 768px){
    .gameContainer[b-5yyjk3fw0s]{
        width: 95%;
    }
}

/* /Components/Layout/HamburgerMenu.razor.rz.scp.css */
svg[b-2hsvok185r]{
   color: var(--primary-color);
}
.imageContainer[b-2hsvok185r]{
    padding-right: 12px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* /Components/Layout/MailForm.razor.rz.scp.css */
*[b-4m0nmipojz] {
    all:unset;
}

.errorMessage[b-4m0nmipojz] {
    color: red;
    font-weight: 600;
}
.successMessage[b-4m0nmipojz]{
    color: var(--secondary-color);
    font-weight: 600;
}
.hidden[b-4m0nmipojz] {
    display: none;
}

.formContainer[b-4m0nmipojz] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.outerFormContainer[b-4m0nmipojz] {
    width: 40%;
}

button[b-4m0nmipojz] {
    width: 100%;
    height: 60px;
    margin-top: 10px;
    text-align: center;
    font-family: 'Raleway';
    font-weight: 900;
    font-size: larger;
    color: var(--primary-color);
    background: transparent;
    border-radius: 25px;
    border: 3px solid var(--primary-color);
    cursor: pointer;
    align-self: center;
    transition: all 0.25s ease-in
}
.sendEmailTitle[b-4m0nmipojz]{
    font-size: x-large;
}

@media (max-width: 768px) {

    button[b-4m0nmipojz] {
        background-color: var(--secondary-color);
    }
    .outerFormContainer[b-4m0nmipojz]{
        width: 100%;
    }
    .sendEmailTitle[b-4m0nmipojz]{
        text-align: center;
    }
}

@media (min-width: 768px) {
    button:hover[b-4m0nmipojz] {
        background-color: var(--secondary-color)
    }
}

[b-4m0nmipojz] .messageBox .mud-input-outlined-border {
    border-color: var(--primary-color) !important;
    border: 2px solid var(--primary-color);
}

[b-4m0nmipojz] .messageBox label {
    color: var(--primary-color) !important;
}
[b-4m0nmipojz] .messageBox label:active {
    color: var(--accent-color) !important;
}

[b-4m0nmipojz] .messageBox .mud-input-root {
    color: var(--text-color) !important;
}
[b-4m0nmipojz] .mud-input-outlined {
    z-index: 0 !important;
}
[b-4m0nmipojz] .mud-input-control {
    position: static !important;
    z-index: auto !important;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-w6g4fbnkx9]{
    width: 100%;
}

@media (max-width: 768px){
    article[b-w6g4fbnkx9] {
        margin-top: 60px;
    }
}
/* /Components/Layout/NavbarMobile.razor.rz.scp.css */
*[b-1c284no2wx]{
    all: unset;
}

.navbarContainer[b-1c284no2wx] {
    position: fixed;
    top: 0;
    width: 100%;
}

.navbar[b-1c284no2wx] {
    display:flex;
    justify-content: end;
    width: 100%;
    height:60px;
    border-bottom: 2px solid var(--primary-color);
    background-color: var(--background-color);
}

.icon[b-1c284no2wx] {
    width: 48px;
    background-color: var(--primary-color);
    aspect-ratio: 1 / 1;
    background-size: auto;
    transition: all 0.25s linear;
}

.hidden[b-1c284no2wx]{
    display:none;
}

.linksContainer[b-1c284no2wx] {
    isolation: isolate;
    position: fixed;
    inset: 60px 0 0 0;
    background-color: #232323F0;
    z-index: 2147483647;
}

.links[b-1c284no2wx] {
    display:flex;
    justify-content: start;
    align-items: start;
    flex-direction: column;
}

.nav-link-style[b-1c284no2wx] {
    display: inline-flex;
    cursor: pointer;
    width: 100%;
    transition: all 0.25s ease-in;
    border-radius: 0px;
    text-align: start;
    text-decoration: none;
    color: var(--primary-color);
    border-bottom: 2px solid var(--primary-color);
    font-weight: 600;
    font-size: xx-large;
    text-align: center;
}

.nav-link-text[b-1c284no2wx] {
    cursor: pointer;
    pointer-events: none;
    text-align: center;
    padding: 8px 8px;
    justify-self: center;
    align-self: center;
    opacity: 1;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
a[b-w0pmr0reqo]{
    all:unset;
}
.navbarDesktop[b-w0pmr0reqo] {
    all: unset;
    display: flex;
    position: fixed;
    top: 0px;
    width: 100%;
    height: 60px;
    border-bottom: 2px var(--primary-color) solid;
    flex-direction: row;
    justify-content: center;
    transition: all 0.25s ease-in;
    gap: 20px;
    align-items: center;
}
.nav-link-style[b-w0pmr0reqo] {
    all: unset;
    transition: all 0.25s ease-in;
    border-radius: 0px;
    text-align: center;
    text-decoration: none;
    color: var(--primary-color);
    font-weight: 600;
    text-align: center;
    
}

.nav-link-text[b-w0pmr0reqo] {
    all: unset;
    text-align: center;
    padding: 8px 8px;
    justify-self: center;
    align-self: center;
    opacity: 1;
    transition: all 0.25s ease;
    height: 100%;
}

.mobileOnly[b-w0pmr0reqo]{
    display: none;
}

.navbarDesktop.opaque[b-w0pmr0reqo]{
    background-color: var(--background-color);
}

@media (max-width: 768px){
    .navbarDesktop[b-w0pmr0reqo] {
        display: none;
    }
    .mobileOnly[b-w0pmr0reqo]{
        display: block;
    }

}

@media (min-width: 768px){
    .nav-link-style:hover[b-w0pmr0reqo] {
        background-color: var(--shadow-color);
        border-radius: 8px;
        cursor:pointer;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-axu4hugxau],
.components-reconnect-repeated-attempt-visible[b-axu4hugxau],
.components-reconnect-failed-visible[b-axu4hugxau],
.components-pause-visible[b-axu4hugxau],
.components-resume-failed-visible[b-axu4hugxau],
.components-rejoining-animation[b-axu4hugxau] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-retrying[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-failed[b-axu4hugxau],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-axu4hugxau] {
    display: block;
}


#components-reconnect-modal[b-axu4hugxau] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-axu4hugxau 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-axu4hugxau 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-axu4hugxau 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-axu4hugxau]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-axu4hugxau 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-axu4hugxau {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-axu4hugxau {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-axu4hugxau {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-axu4hugxau] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-axu4hugxau] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-axu4hugxau] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-axu4hugxau] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-axu4hugxau] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-axu4hugxau] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-axu4hugxau] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-axu4hugxau 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-axu4hugxau] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-axu4hugxau {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Layout/Symbol.razor.rz.scp.css */
.node-wrapper[b-glnbls33jq] {
    display: flex;
    margin-right: 10px;
    width: 20%;
    height: 100%;
    flex-direction: column;
    align-items: center;
}

.node[b-glnbls33jq] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 2px solid var(--text-color);
    background-color: var(--primary-color);
}

/* shared line style */
.line[b-glnbls33jq] {
    width: 2px;
    height: 120px;
    background: var(--text-color);
}

@media (max-width: 768px){
    .line[b-glnbls33jq]{
        height: 180px;
    }
}

/* optional spacing tuning */
.line.top[b-glnbls33jq] {
    margin-bottom: 5px;
}

.line.bottom[b-glnbls33jq] {
    margin-top: 5px;
}
.hidden[b-glnbls33jq]{
    visibility:hidden;
}
/* /Components/Layout/TechnologyComponent.razor.rz.scp.css */
h3[b-u7rrxroe6u] {
    all: unset;
    font-size: x-large;
    color: var(--primary-color);
    font-weight: 700;
}

.mainContainer[b-u7rrxroe6u] {
    display:flex;
    gap: 20px;
    align-items: center;
    margin-bottom: 20px;
}

.frameworkContainer[b-u7rrxroe6u] {
    display: flex;
    gap: 1rem;
}

.framework[b-u7rrxroe6u]{
    color: var(--primary-color);
    font-weight: 600;
    width: fit-content;
    padding: 8px 12px 8px 12px;
    border: 2px solid var(--primary-color);
    border-radius: 8px;
}

@media (max-width: 768px){
    h3[b-u7rrxroe6u]{
        font-size: large;
    }
}
/* /Components/Layout/TitleComponent.razor.rz.scp.css */
.titleContainer[b-tl4o0agji8]{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.imageAndTitleContainer[b-tl4o0agji8] {
    display: flex;
    flex-direction: row;
    gap: 100px;
    justify-content: center;
    align-items: center;
    height: calc(100vh - 60px);
    width: 100%;
}
.imageContainer[b-tl4o0agji8]{
    width: 300px;
    aspect-ratio: 1 / 1;
    border: 3px solid var(--primary-color);
    border-radius: 50%;
    background-image: url(/images/website_me.png);
    background-size: contain;
}
.image[b-tl4o0agji8]{
    width: 300px;
    display:none;
}

p[b-tl4o0agji8]{
    width: 50vw;
}
h1[b-tl4o0agji8]{
    width: 50vw;
}

.hiText[b-tl4o0agji8]{
    font-family: 'Source Code Pro';
}
.introText[b-tl4o0agji8]{
    max-width:50vw;
}
.companyText[b-tl4o0agji8]{
    color: var(--primary-color);
    font-weight:900;
}
.redactedText[b-tl4o0agji8] {
    background-color: var(--primary-color);
    color: var(--primary-color);
}

@media (max-width: 768px) {
    .imageAndTitleContainer[b-tl4o0agji8] {
        flex-direction: column;
        gap: 50px;
    }
    .introText[b-tl4o0agji8], p[b-tl4o0agji8], h1[b-tl4o0agji8]{
        width: 100%;
        max-width: 100%;
    }
}
/* /Components/Layout/WorkExperienceComponent.razor.rz.scp.css */
h3[b-frs4vhjofo]{
    color: var(--primary-color);
    font-weight:700;
}

h4[b-frs4vhjofo] {
    color: var(--primary-color);
    font-size: medium;
}
.infoContainer[b-frs4vhjofo]{
    display:flex;
    width: 85%;
    flex-direction: column;
    justify-content: center;
}

.mainContainer[b-frs4vhjofo] {
    display:flex;
    justify-content: center;
    align-items: center;
}

/* /Components/Pages/Contact.razor.rz.scp.css */
.contactContainer[b-zar12tenz0] {
    width: 100%;
    height: calc(100vh - 60px);
    padding-right: 40px;
    padding-left: 40px;
    margin-top: 80px;
    margin-bottom: 40px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.messageContainer[b-zar12tenz0] {
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;

}
.socialsContainer[b-zar12tenz0]{
    display: flex;
    gap:40px;
}


#linkedIn[b-zar12tenz0], #github[b-zar12tenz0]{
    color: var(--primary-color);
    transition: all 0.25s ease-in;
}

.dividerContainer[b-zar12tenz0]{
    text-align: center;
    width: 20%;
    font-weight: 900;
    color: var(--primary-color);
    font-size: xx-large;
}

@media (min-width: 768px){
    #linkedIn:hover[b-zar12tenz0], #github:hover[b-zar12tenz0] {
        cursor: pointer;
        color: var(--secondary-color);
    }
}

@media (max-width: 768px) {
    .dividerContainer[b-zar12tenz0]{
        width: 100%;
    }
    .contactContainer[b-zar12tenz0] {
        height: fit-content;
        padding-top: 40px;
        flex-direction: column;
        gap:40px;
    }
    .messageContainer[b-zar12tenz0]{
        width: 100%;
    }
}
/* /Components/Pages/ForRecruiters.razor.rz.scp.css */
*[b-8p6fp0jok5] {
    all:unset;
}
.introContainer[b-8p6fp0jok5]{
    display:flex;
    flex-direction: column;
    justify-self:center;
    justify-content: center;
    gap: 20px;
    width: 50vw;
    height: calc(100vh - 60px);
}
.title[b-8p6fp0jok5]{
    width: inherit;
    font-weight:900;
}
button[b-8p6fp0jok5]{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100px;
    font-family: 'Raleway';
    font-weight: 900;
    font-size: larger;
    color: var(--primary-color);
    background:transparent;
    border-radius: 25px;
    border: 3px solid var(--primary-color);
    cursor: pointer;
    align-self: center;
    transition: all 0.25s ease-in
}
@media (max-width: 768px){
    .introContainer[b-8p6fp0jok5]{
        width: 100%;
    }
    button[b-8p6fp0jok5]{
        width: 75%;
        background-color: var(--secondary-color);
    }
    
}

@media (min-width: 768px){
    button:hover[b-8p6fp0jok5] {
        background-color: var(--secondary-color)
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* /Components/Pages/NotFound.razor.rz.scp.css */
.nfcontainer[b-nxlnswb0tz] {
    padding-top: 100px;
}
h3[b-nxlnswb0tz]{
    color: var(--primary-color);
    font-weight: 900;
}
/* /Components/Pages/Resume.razor.rz.scp.css */
h2[b-mefght2rgp]{
    color: var(--primary-color);
    font-weight: 700;
}
.mainContainer[b-mefght2rgp]{
    padding-top: 80px;
    padding-left: 40px;
    padding-right: 40px;
}
@media (max-width: 768px){
    .mainContainer[b-mefght2rgp] {
        padding-top: 20px;
        padding-left: 0px;
        padding-right: 0px;
    }
}

.titleDivider[b-mefght2rgp]{
    background-color: var(--primary-color);
    height: 1px;
    width: 100%;
    margin-bottom: 20px;
}
h3[b-mefght2rgp]{
    color: var(--primary-color);
    font-weight: 600;
}
h4[b-mefght2rgp]{
    font-size: medium;
    color: var(--primary-color);
}
.educationEntryTitle[b-mefght2rgp] {
    display: flex;
    justify-content: space-between;
}
bold[b-mefght2rgp]{
    font-weight: bold;
}

@media (min-width: 768px){
    .technologyComponentContainer[b-mefght2rgp] {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px;
        flex-wrap: wrap;
    }
}
/* /Components/Pages/TicTacToe.razor.rz.scp.css */
.ticContainer[b-yu782d81ks] {
    height: calc(100vh - 60px);
    max-width:700px;
    margin-top: 160px;
    width: 50vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    justify-self: center;
    align-items: center;
    gap: 10px;
}

@media (max-width: 768px){
    .ticContainer[b-yu782d81ks]{
        margin-top: 100px;
        width: 100%;
    }
}
