CSS CODE for Blog
<h1> class="h1-heading-box"
class="blogger-banner"
<h2> class="h2-subheading-box"
<h3> class="h3-minor-heading"
<table> class="overview-table"
class="simple-table"
class="link-table-container"
<style>
/* Blue Theme Variables */
:root {
--primary-blue: #1d4e89; /* Deep Blue */
--accent-blue: #0077b6; /* Bright Blue */
--light-blue: #f0f7ff; /* Very Light Background Blue */
--watermark-blue: rgba(29, 78, 137, 0.08); /* Light for watermark */
}
.meri-button-hai-sample {
padding: 10px 24px; font: 600 16px 'Poppins', sans-serif; color: #fff;
background: var(--primary-blue); border: none; border-radius: 6px; cursor: pointer;
transition: background 0.2s ease;
}
.meri-button-hai-sample:hover { background: #153b6a; }
.blogger-banner {
display: flex; align-items: center; justify-content: center; text-align: center;
width: 100%; max-width: 800px; margin: 12px auto; font-size: 24px !important;
padding: 10px 15px !important; box-sizing: border-box; position: relative; overflow: hidden;
background-color: #f9fcff; border: 1.5px solid var(--primary-blue);
border-top-left-radius: 12px; border-bottom-right-radius: 12px;
border-top-right-radius: 2px; border-bottom-left-radius: 2px;
border-left: 5px solid var(--primary-blue); border-right: 5px solid var(--primary-blue);
font-family: 'Poppins', sans-serif; color: #1a2a3a; font-weight: 700; line-height: 1.2;
}
.blogger-banner::before {
content: "PARAKH PATH"; position: absolute; top: 50%; left: 50%;
transform: translate(-50%, -50%); width: 100%; text-align: center;
font-family: 'Arial Black', sans-serif; font-size: 24px; font-weight: 900;
letter-spacing: 3px; white-space: nowrap; color: var(--primary-blue); opacity: 0.07;
pointer-events: none; user-select: none;
}
.custom-vksu-button {
display: flex !important;
align-items: center !important;
width: 100% !important;
padding: 8px 12px !important;
background-color: #f8fbff !important;
border: 1px solid #e0e7ed !important;
border-radius: 12px !important;
text-decoration: none !important;
color: #1a3c61 !important;
font-family: sans-serif !important;
gap: 12px !important;
box-sizing: border-box !important;
margin: 10px 0 !important;
}
.custom-vksu-button:hover {
background-color: #eff5fc !important;
border-color: #c1d4e6 !important;
}
.h1-heading-box {
position: relative; overflow: hidden; margin: 15px auto; padding: 7px 10px;
font-size: 24px !important; max-width: 800px; text-align: center;
background-color: #f0f7ff; border-top: 1px solid var(--accent-blue);
border-bottom: 1px solid var(--accent-blue);
border-left: 5px solid var(--primary-blue); border-right: 5px solid var(--primary-blue);
border-radius: 15px 0 15px 0; box-shadow: 0 4px 15px rgba(29, 78, 137, 0.1);
}
.h1-heading-box h2 {
font-family: 'Poppins', sans-serif; font-size: 1.3rem; font-weight: 600;
color: var(--primary-blue); margin: 0; padding: 0; position: relative; z-index: 2;
}
.h1-heading-box::before {
content: "PARAKH PATH"; position: absolute; top: 50%; left: 50%;
transform: translate(-50%, -50%); font-family: 'Poppins', sans-serif;
font-size: 2.2rem; font-weight: 800; text-transform: uppercase;
color: rgba(0, 119, 182, 0.12); white-space: nowrap; pointer-events: none; z-index: 1;
}
.h2-subheading-box {
font-family: 'Poppins', sans-serif; background: #ffffff;
border-bottom: 3px solid var(--primary-blue); padding: 10px 10px 5px 10px;
margin: 10px 0 !important; font-size: 18px !important; position: relative;
overflow: hidden; box-shadow: 0 2px 8px rgba(29, 78, 137, 0.06);
background-image: radial-gradient(var(--accent-blue) 0.5px, transparent 0.5px),
radial-gradient(var(--accent-blue) 0.5px, #ffffff 0.5px);
background-size: 20px 20px !important; background-position: 0 0, 10px 10px;
}
.h2-subheading-box::before {
content: "PARAKH PATH"; position: absolute; right: 10px; bottom: -2px;
font-family: 'Poppins', sans-serif; font-size: 1.4rem; font-weight: 900;
color: var(--accent-blue); opacity: 0.22; pointer-events: none; z-index: 0;
}
.h2-subheading-box h2 {
font-size: 1.15rem !important; font-weight: 600; color: #1a1a1a;
margin: 0 !important; padding: 0 !important; position: relative; z-index: 1;
}
.h3-minor-heading {
display: inline-block; background-color: rgba(29, 78, 137, 0.08);
border-left: 4px solid var(--primary-blue); padding: 4px 8px 4px 12px;
margin: 10px 0; font-family: sans-serif; font-size: 20px;
font-weight: 700; color: #1e2229; line-height: 1.2;
}
.overview-table {
width: 100%; border-collapse: collapse; font-family: sans-serif;
font-size: 0.95rem; background-color: #ffffff;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); border-radius: 10px;
overflow: hidden; border: 1px solid #eef6ff;
}
.overview-table th { background-color: var(--primary-blue); color: #ffffff; padding: 10px 16px; }
.overview-table td { padding: 10px 16px; color: #333333; border-bottom: 1px solid #f5f8ff; }
.overview-table tbody tr:nth-child(even) { background-color: rgba(29, 78, 137, 0.04); }
.overview-table td:first-child { border-left: 4px solid var(--accent-blue); font-weight: 500; }
.overview-table td:last-child { color: var(--primary-blue); font-weight: 600; }
.simple-table { width: 100%; border-collapse: collapse; font-size: 15px; color: #333333; margin: 15px 0; }
.simple-table thead { background-color: rgba(29, 78, 137, 0.1); color: var(--primary-blue); }
.simple-table th { font-weight: 600; border-bottom: 2px solid var(--primary-blue); padding: 6px 10px; text-align: left; }
.simple-table tbody tr td { border-bottom: 1px solid #f0f5ff; padding: 6px 10px; }
.simple-table tbody tr:nth-child(even) { background-color: rgba(0, 119, 182, 0.05); }
.link-table-container {
width: 100%; margin: 20px 0; padding: 8px; border-top: 1px solid var(--accent-blue);
border-bottom: 1px solid var(--accent-blue); border-left: 6px solid var(--primary-blue);
border-right: 6px solid var(--primary-blue); border-top-left-radius: 24px;
border-bottom-right-radius: 24px; background: #fdfeff; position: relative;
overflow: hidden; box-shadow: 0 5px 20px rgba(29, 78, 137, 0.1);
}
.link-table-container::before {
content: "PARAKH PATH"; position: absolute; top: 50%; left: 50%;
transform: translate(-50%, -50%) rotate(-12deg); font-size: 3rem; font-weight: 800;
color: rgba(0, 119, 182, 0.09); pointer-events: none; z-index: 1;
}
.link-table-container th { background: linear-gradient(135deg, var(--accent-blue), var(--primary-blue));
color: #ffffff; padding: 14px 12px; border-bottom: 3px solid var(--accent-blue); }
.link-table-container td:first-child { color: var(--primary-blue); }
.link-table-container td:last-child { color: var(--accent-blue); }
</style> VKSU Home Button
for in thr post
<div style="width: 100%; margin: 10px 0;">
<a href="https://career.parakhpath.com/p/vksu.html" target="_blank" rel="noopener noreferrer" style="display: flex; align-items: center; width: 100%; padding: 10px; background-color: #f8fbff; border: 1px solid #e0e7ed; border-radius: 10px; text-decoration: none; box-sizing: border-box; color: #1a3c61; margin: 0;">
<div style="font-size: 24px; margin-right: 12px; flex-shrink: 0;">🏛️</div>
<div style="flex-grow: 1;">
<div style="font-weight: bold; font-size: 18px; margin: 0; text-align: center; padding: 0; line-height: 1.2;">Veer Kunwar Singh University, Ara (Bhojpur)</div>
<div style="font-size: 16px; color: #5a7a9a; margin: 0; padding: 0; text-align: center; line-height: 1.2;">Check Here : Notice, Exam Form, Admit Card, Result</div>
</div>
</a>
</div> CODE TITTLE ADD
TITTLE
ADD CODE NOT HTML CODE TITTLE ADD
TITTLE
ADD CODE NOT HTML CODE TITTLE ADD
TITTLE
ADD CODE NOT HTML CODE TITTLE ADD
TITTLE
ADD CODE NOT HTML
