:root {
    --yellow: hsl(47, 88%, 63%);
    --gray500: hsl(0, 0%, 42%);
    --gray950: hsl(0, 0%, 7%);
    --white: #ffffff;
}

body {
    height: 100vh;
    background-color: var(--yellow) !important; 
    align-content: center;
    justify-items: center;
    
}

p {
    font-family:  "Figtree", sans-serif;
    font-size: 14px;
    font-color: var(--gray950);
}

.attribution { font-size: 11px; text-align: center; }
.attribution a { color: hsl(228, 45%, 44%); }

.card-size {
    max-width: 384px; 
    max-height: 522px !important;
    border-radius: 20px !important;
    box-shadow: 10px 10px black;
    
 }

.figtree-text {
    font-family: "Figtree", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    color: var(--gray500);
    font-size: 16px;
}

.figtree-header {
    font-family: "Figtree", sans-serif;
    font-optical-sizing: auto;
    font-weight: 800;
    font-style: normal;
    color: var(--gray950);
    font-size: 24px;
  
}

.figtree-header:hover{ 
    color: var(--yellow);
}

.badge-tag { 
    background-color: var(--yellow); 
    font-weight: 800;
    font-size: 14px;
    font-family: "Figtree", sans-serif;
    border-radius: 5px;
    padding: 5px 15px;

}

.user {
    color: var(--gray950);
    font-weight: 800;
    font-size: 14px;
    font-family: "Figtree", sans-serif;
    padding: 5px 10px;

}

.img-border { 
    border-radius: 10px;
    height: 200px !important;
}