/* Default (Light Mode) */
:root {
–main-logo-text-color: #d4d4d4;
–all-link-color: rgba(0, 0, 0, 0.7);
–body-color-main: #f4f4f9;
–text-font-color: #333;
–certificate-bg-color: #fff;
–certificate-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
–certificate-title-color: #333;
–background-color: #fff;
–button-bg-color: #333;
–button-text-color: #fff;
}
/* Dark Mode */
.dark {
–body-color-main: #292929;
–text-font-color: #e3e3e3;
–certificate-bg-color: #3a3a3a;
–certificate-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
–certificate-title-color: #dadada;
–background-color: #353535;
–button-bg-color: #dadada;
–button-text-color: #333;
}
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: var(–body-color-main);
color: var(–text-font-color);
transition: background-color 0.3s, color 0.3s;
}
.certificate-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); /* Increased minimum width */
gap: 30px; /* Increased gap for more space */
padding: 30px;
justify-items: center;
}
.certificate {
background-color: var(–certificate-bg-color);
border-radius: 10px;
box-shadow: var(–certificate-shadow);
overflow: hidden;
text-align: center;
transition: transform 0.3s ease-in-out;
color: var(–certificate-title-color);
padding: 20px;
}
.certificate:hover {
transform: translateY(-5px);
}
.certificate img {
width: 100%;
max-width: 100%;
height: auto;
border-radius: 8px;
max-height: 500px; /* Increased max height */
}
.certificate-title {
font-size: 16px; /* Increased font size for better visibility */
font-weight: bold;
margin-top: 10px;
color: var(–certificate-title-color);
}
/* Adjustments for Mobile Devices */
@media (max-width: 768px) {
.certificate-container {
grid-template-columns: 1fr; /* Stack certificates in one column */
}
.certificate img {
max-width: 95%; /* Increased the image width for better fit on smaller screens */
max-height: 450px; /* Increased image height */
}
.certificate-title {
font-size: 18px; /* Increased title font size on mobile */
}
}
@media (max-width: 480px) {
body {
font-size: 14px;
}
.certificate-title {
font-size: 16px;
}
}
/* Dark mode toggle button */
.theme-toggle-btn {
position: fixed;
top: 20px;
right: 20px;
background-color: var(–button-bg-color);
color: var(–button-text-color);
border: none;
padding: 10px 15px;
border-radius: 5px;
cursor: pointer;
font-size: 14px;
}
.theme-toggle-btn:hover {
background-color: #444;
}
h1 {
text-align: center;
font-size: 32px; /* Increased header size */
margin-top: 40px;
color: var(–text-font-color);
}

NPTEL Certificate in Spur and Helical Gear Cutting

NPTEL Certificate in Product Design and Development

NPTEL Certificate in Refrigeration and Air-Conditioning

NPTEL Certificate in Entrepreneurship Essentials
function toggleTheme() {
document.body.classList.toggle(“dark”);
}