style.css

.saffron { color: #FF9933; }
.white { color: #FFFFFF; }
.green { color: #00FF00; }

.title-container {
    text-align: center;
}
.section {
    padding: 50px 0; 
}

.social-links {
display: flex; 
justify-content: center;
margin-top: 10px; 
}
.social-links a {
margin: 0 10px;
text-decoration: none;
color: #333; 
font-size: 100px;
}

.hover-effect:hover {
    text-shadow: 0 0 10px rgba(255,255,255,0.9); /* Example shadow effect */
    transition: text-shadow 0.3s ease-out;
}

body {
    background-size: cover;
    background-position: center;
    color: white;
}

.repo-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-top: 20px; /* Added margin to separate from the title */
}

.repo-card {
    flex: 0 0 calc(33.33% - 20px); /* Adjust the width as needed */
    max-width: calc(33.33% - 20px); /* Adjust the width as needed */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    overflow: hidden;
    transition: transform 0.2s;
    margin-bottom: 20px; /* Added margin for spacing between cards */
}

.repo-card img {
    width: 100%;
    height: auto; /* Ensure image aspect ratio is maintained */
}

@media (max-width: 992px) {
    .repo-card {
        flex: 0 0 calc(50% - 20px); /* Adjust for smaller screens */
        max-width: calc(50% - 20px); /* Adjust for smaller screens */
    }
}

@media (max-width: 576px) {
    .repo-card {
        flex: 0 0 100%; /* Full width on smaller screens */
        max-width: 100%; /* Full width on smaller screens */
    }
}