body {
    /* background-color: #300a24; Dark purple background */
    background-color: #0d1016;
    color: #ffffff; /* White text */
    font-family: 'Ubuntu Mono', monospace; /* Ubuntu Mono font */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    margin: 0;
}

.socialmedia {
    display: flex;
    /* background-color: white; */
}

.typewriter-text {
    font-size: 14px; 
    padding: 20px 0px;
    max-width: 80%;
    margin-bottom: 20px; 
    white-space: pre-line; 
}

.github {
    display: flex;
    max-width: 80%;
    
    
}
.npm {
    display: flex;
    max-width: 80%;
    
}

.resume {
    display: flex;
    max-width: 80%;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.logo-container {
    /* display: flex; */
    min-width: 100px;
    min-height: 100px;
}

.logo {
    width: 50px;
    height: 50px;
    margin: 10px 50px;
    opacity: 0; 
    transition: opacity 1s ease-in-out;
    background-color: #ffffff; 
    border-radius: 5px; 
    padding: 5px; 
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px; 
    font-weight: bold; 
    color: #000000; 
    text-transform: uppercase; 
    text-align: center; 
    cursor: pointer; 
}

.logo:hover {
    background-color: #79b8ff; 
    color: #000000; 
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); 
}


.logo a {
    text-decoration: none; 
    color: inherit; 
}

.logo a:hover {
    text-decoration: underline; 
}


.resume-logo {
    width: 80px;
    height: 120px;
    margin: 10px 50px;
    opacity: 1; 
    transition: opacity 1s ease-in-out;
    background-color: #ffffff; 
    border-radius: 5px; 
    padding: 5px; 
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px; 
    font-weight: bold; 
    color: #000000; 
    text-transform: uppercase; 
    text-align: center; 
    cursor: pointer; 
}

.resume-logo:hover {
    background-color: #79b8ff; 
    color: #000000; 
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); 
}


.resume-logo a {
    text-decoration: none; 
    color: inherit; 
}

.resume-logo a:hover {
    text-decoration: underline; 
}



.skills-table {
    width: 80%;
    margin: 0 auto;
    border-collapse: collapse;
    opacity: 0;
    transition: opacity 1s ease-in-out 0.3s; /* Added delay of 0.5s */
}

.skills-table th, .skills-table td {
    padding: 12px;
    border-bottom: 1px solid #fff;
    color: #fff;
}

.skills-table th {
    background-color: #79b8ff;
    color: #000;
    text-transform: uppercase;
}

.skills-table tbody tr:nth-child(even) {
    background-color: #3a3a3a;
}

.skills-table tbody tr:hover {
    background-color: #525252;
}


h2 {
    opacity: 0;
    
}