/* Google font */
.inter-100 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
}


/* Custom spacing utilities */
.mt-10 {
    margin-top: 8rem;
}

@media (min-width: 768px) {
    .mb-md-10 {
        margin-bottom: 8rem !important;
    }
}

.mb-15 {
    margin-bottom: 13rem;
}


body {
    font-family: 'Inter', sans-serif;
}


/* Column 1/Sidebar - make column fixed so it doesnt scroll */
#row_sidebar {
    align-items: start;
}

@media (min-width: 768px) {
    #column_sidebar {
    position: sticky;
    top: 8rem;
    }
}

/* Adds spacing above each section when scrolled to */
#about_me, #tech_stack, #projects {
    scroll-margin-top: 8rem;
}

/* Column 1/Sidebar Nav bar color and underline (display:...) */
#column_sidebar .nav-link {
    display: inline-block;
    color:grey;
}

#column_sidebar .nav-link:hover {
    color: black;
}

#column_sidebar .nav-link.active {
    color: black;
}


/* Column 1/Sidebar Nav bar animation */
#column_sidebar .nav-link {
    transition: transform 0.2s ease;
}

#column_sidebar .nav-link:hover {
    transform: translateX(6px);
}


/* Contact Me section SVGs */
#contact_links img {
    height: 1.7rem;
    width: 1.7rem;
}


/* Column 2/Main-Content Projects cards animation */
#column_main_content .projects-card {
    transition: transform 0.2s ease;
}

#column_main_content .projects-card:hover {
    transform: scale(1.03);
}


/* SKills marquee */
.skills-marquee {
    overflow: hidden;
    white-space: nowrap;
}

.skills-track {
    display: inline-flex;
    gap: 2rem;
    animation: marquee 20s linear infinite;
}

.skills-track img {
    height: clamp(32px, 4vw, 48px);
    width: auto;
}

@keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}