:root{
    --primary-color: rgba(26,25,25);
    --secondary-color: rgba(60,54,53);
    --tertiary-color: rgba(128,119,119);
    --style-color-1:rgba(176,169,169);
    --opaque-background: rgba(127,118,119,0.05);
    --opaque-hover: rgba(26,25,25,0.90)
}


h4{
    text-align: center;
}




.nicole-heading{
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 80px;
}

.nicole-sub-heading{
    font-family: 'Inter', sans-serif;
    font-weight: 200;
    font-size: 30px;
}

.about-heading{
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: 50px;

}

.about-sub-heading{
    font-family: 'Inter', sans-serif;
    font-weight: 200;
    font-size: 38px;
   
}

.progress-heading{
    padding-top: 10px;
  
}
.progress-text {
font-size: 15px;
font-weight: 300;
}

.work-heading{
    font-family: 'Inter', sans-serif;
    font-weight: 200;
    font-size: 42px;
}

.work-sub-heading{
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: 30px;
}

#hero-content-container{
    margin-bottom: 10px;
    background: var(--opaque-background);
}

#home-page-buttons {
    font-family: 'Inter';
    font-weight: 200;
}

#work-cards{
  
    font-family: 'Inter', sans-serif;
    font-weight: 200;
    font-size: 15px;
}

#work-card-heading{
    font-family: 'Inter';
    font-size: 18px;
    font-weight: 200;
}

#portfolio-card{
    margin-left: 10px;
}

#about-headings {
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: 25px;

}
#about-cards {
    margin-top: 20px;
    font-family: 'Inter', sans-serif;
    font-weight: 200;
    font-size: 18px;
}

#active-card{
    background: var(--opaque-background);
}

#active-card:hover{
    background-color: var(--opaque-hover);
    color: white;
    transition-duration: 1s;
}

#social{
    color: black;
 }

#social:hover{
   color: var(--style-color-1)
}

#footer-text{
    font-family: 'Inter';
    font-weight: 200;
}