* {
    color: black;
}

body {
    position: relative;
    background-color: #ffe01b;
}

@font-face {
    font-family: Visitor1;
    src: url(Fonts/visitor1.ttf);
}

.papa-container {
    display: flex;
    height: 100vh;
    flex-direction: column;
    align-items: center;
    overflow-x: hidden;
}

.content-container {
    height: 100vh;
    overflow: hidden;
}

.overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-image: url("data:image/jpeg;base64,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");
    background-repeat: repeat;
    mix-blend-mode: multiply;
    pointer-events: none;
    /* z-index: 9999; */
}

.papa-container > div:not(.overlay, .home-container, .content-container) {
    margin-top: 80px;
}

/* multi-selectors */
.nav-link, h1, h2, h3 {
    font-family: Visitor1;
}

.abt-section, .stack-section, .qf-section {
    display: flex;
    width: 80%;
}

.click-this, .stack, .phew {
    font-family: "Nanum Pen Script";
    font-size: 24px;
}

.stack-section, .qf-section {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* multi-selectors > fs and cc content */

.fs-container, .creative-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 70%;
}

.fs-content, .creative-content {
    width: 80%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 90px;
}

.fs-desc, .cc-desc {
    text-align: center;
}

.fs-content h3, .creative-content h3 {
    font-size: 40px;
    margin-bottom: 20px;
}

/* navbar */
.logo {
    width: 90px;
}

.navbar {
    width: 100vw;
}

.nav-link {
    font-size: 20px;
    color: black;
}

.nav-link:hover, .goto-website {
    color: #0d6efd;
}

.navbar-nav {
    column-gap: 20px;
    margin-left: 10px;
}

.container-fluid {
    width: fit-content;
}

/* home page */
.home-container {
    position: relative;
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    width: 100vw;
}

.hero-logo {
    width: 600px;
    height: fit-content;
    transform: scaleX(-1);
}

h1 {
    font-size: 50px;
    text-align: center;
}

h1 span {
    font-size: 70px;
}

.click-this {
    margin-bottom: 0;
}

.arrow-container {
    margin-top: 10%;
    margin-left: 30%;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
}

.name-this {
    margin: 0;
}

.arrow-point {
    position: relative !important;
    width: 50px;
    transform: scaleX(-1);
    rotate: -50deg;
}

.click-container {
    margin-top: 40px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}

.arrow-point2 {
    position: relative !important;
    width: 50px;
    rotate: 220deg;
}

.choose-adv {
    position: relative;
    text-decoration: none;
    color: black;
}

.choose-adv::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 0;
    height: 6px;
    background-color: #0d6efd;
    transition: all 0.5s ease;
}

.choose-adv:hover::after {
    width: 100%;
}

/* home page > font switcher */
.f1 {
    font-family: "Instrument Serif";
    letter-spacing: -7px;
}

.f2 {
    font-family: "Pirata One";
}

.f3 {
    font-family: "Rubik Beastly";
}

.f4 {
    font-family: "UnifrakturMaguntia";
}

.f5 {
    font-family: "Redacted Script";
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
    padding: 0 1rem;
}

.f5:hover {
    color: #0d6efd;
    transition: color 0.3s ease;
}

/* home page > parallax */
.home-container img {
    position: absolute;
}

.glasses-one {
    position: absolute;
    top: 70px;
    width: 200px;
    left: 0;
    rotate: -40deg;
    filter: blur(10px);
    z-index: -1;
    animation: 2s infinite ease-in-out float-one;
}

.glasses-two {
    position: absolute;
    bottom: 2px;
    width: 600px;
    rotate: -20deg;
    right: -12%;
    filter: blur(7px);
    animation: 4s infinite ease-in-out float-two;
}

@keyframes float-one {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(8px);
    }

    100% {
        transform: translateY(0px);
    }
}

@keyframes float-two {
    0% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(15px, -15px);
    }

    100% {
        transform: translate(0, 0);
    }
}

/* about page */
.about-container {
    height: fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 70%;
}

/* about page > abt section */
.abt-section {
    flex-direction: row;
    align-items: center;
    column-gap: 70px;
    height: fit-content;
    padding-bottom: 40px;
}

.pfp {
    width: 300px;
    height: 600px;
    rotate: 3deg;
    object-fit: cover;
}

.txt-col h2 {
    font-size: 60px;
}

.txt-col h2:hover {
    transform: scaleY(1.2);
    cursor: pointer;
}

p {
    font-family: "Source Sans Pro";
}

.socials {
    margin-top: 20px;
    display: flex;
    flex-direction: row;
    column-gap: 10px;
}

/* about page > stack section */
.stack-section {
    margin: 70px 0 40px;
}

.stack-section p {
    transform: translateY(-20px);
}

.abstract-stack {
    display: flex;
    flex-direction: row;
    column-gap: 40px;
}

.abstract-stack h3 {
    font-size: 200px;
    cursor: default;
    z-index: 99999;
}

.abstract-stack p {
    position: relative;
    transform: translateY(-55px);
    height: 0;
    z-index: -1;
}

.s {
    text-align: end;
    rotate: -8deg;
}

/* about page > stack section > mern hovers */
.hidden {
    /* display: none; */
    opacity: 0;
    transition: opacity 0.5s ease;
}

.m-stack:hover 
{
    font-family: "Instrument Serif";
    color: #0d6efd;
}

.e-stack:hover 
{
    font-family: "Pirata One";
    color: #ff5412;
}

.r-stack:hover 
{
    font-family: "Redacted Script";
    color: #9cc533;
}

.n-stack:hover 
{
    font-family: "UnifrakturMaguntia";
    color: #ff66e9;
}

/* full stack dev page */
.fs-vid, .fs-pic {
    width: 100%;
    margin-bottom: 30px;
}

.tool-container {
    display: flex;
    flex-direction: row;
    column-gap: 20px;
    margin-bottom: 20px;
}

.tool {
    font-family: Visitor1;
    color: #0d6efd;
    /* background-color: #d7e4f7; */
    padding: 5px 30px;
    border: solid 2px #0d6efd;
}

.goto-website {
    text-decoration: none;
    color: black;
}

.sc {
    text-decoration: none;
    color: #0d6efd;
}

/* Creative page */
.cc-grid {
    width: 100%;
    height: fit-content;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.creative-content {
    margin-bottom: 100px;
    height: fit-content;
}

.cc-desc {
    margin-bottom: 35px;
}

.cc-grid > * {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p5 {
    grid-row: span 2;
    grid-column: span 1;
}

.yt-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    margin-bottom: 10px;
}

.yt-vid {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* mobile */
@media screen and (max-width: 991px)
{
    body{
        background-color: aliceblue;
    }

    .papa-container > div:not(.overlay) {
        align-items: flex-start;
    }

    /* multi-selectors */
    .abt-section, .stack-section, .qf-section {
        width: 100%;
    }

    .papa-container > div:not(.overlay, .home-container, .content-container) {
        margin-top: 40px;
    }

    /* multi-selectors > margins */
    .content-container, .about-container, .fs-container, .creative-container {
        margin: 0 25px;
    }

    /* navbar */
    .container-fluid {
        width: 100%;
    }

    /* home page */
    h1 {
        width: 100%;
        text-align: left;
        font-size: 40px;
    }
    
    h1 span {
        font-size: 50px;
    }

    .f1 {
        font-family: "Instrument Serif";
        letter-spacing: -3px;
    }

    .f3 {
        font-family: "Rubik Beastly";
        font-size: 45px;
    }

    .f5 {
        font-family: Visitor1;
        font-size: 40px;
        text-decoration: none;
    }

    .home-container {
        align-items: flex-start;
        width: 100%;
    }

    .home-container img {
        position: absolute;
        display: none;
    }

    .choose-adv {
        text-decoration: underline;
        color: #0d6efd;
    }

    .choose-adv::after {
        display: none;
        transition: none;
    }

    /* about page */
    .about-container {
        width: auto;
        align-items: flex-start;
    }

    .abt-section {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 30px;
        padding-bottom: 30px;
    }

    .pfp {
        width: 100%;
        height: 50%;
    }

    .txt-col h2, .qf-section h3 {
        font-size: 40px;
    }

    .txt-col h2:hover {
        transform: scaleY(0);
    }

    .stack-section {
        margin: 0 0 40px;
    }

    .stack-section p {
        text-align: left;
    }

    .ab-p {
        margin-top: 20px;
    }

    .abstract-stack {
        flex-direction: column;
        align-items: center;
    }

    .abstract-stack h3 {
        font-size: 70px;
    }

    .phew {
        display: none;
    } 

    .qf-section {
        display: flex;
        align-items: flex-start;
        text-align: left;
    }

    .stack {
        margin-top: 40px;
    }
    
    .s {
        text-align: center !important;
    }

    /* full stack dev page & creative page */
    .fs-container, .creative-container {
        width: auto;
    }

    .fs-content, .creative-content {
        align-items: flex-start;
        width: 100%;
        margin-bottom: 70px;
    }

    .fs-content h3, .creative-content h3 {
        font-size: 30px;
    }

    .fs-vid, .fs-pic {
        width: 100%;
        margin-bottom: 30px;
    }

    .fs-desc, .cc-desc {
        text-align: left;
    }

    .tool-container {
        width: 100%;
        flex-direction: column;
        row-gap: 20px;
    }

    .tool {
       text-align: center;
    }

    /* creative page */
    .cc-grid {
        display: flex;
        flex-direction: column;
    }

    .cc-grid > * {
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .creative-content h3 {
        margin-bottom: 10px;
    }

    .cc-desc {
        margin-bottom: 20px;
    }

    .arrow-container,
    .click-container {
        display: none;
    }
}