/* DBIM element defaults */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* Style blocks in page text must not restyle the page frame */
html { font-size: 100% !important; }
body { margin: 0 !important; }
body {
margin: 0;
font-family: var(--dbim-font);
font-size: var(--dbim-size-p1);
font-weight: var(--dbim-weight-regular);
line-height: var(--dbim-leading-body);
color: var(--dbim-text);
background-color: var(--dbim-surface);
text-align: left;
}
/* Hindi text */
html[lang|="hi"] body, [lang|="hi"] { font-family: var(--dbim-font-hi); }
[lang|="en"] { font-family: var(--dbim-font); }
/* Headings */
h1, h2, h3, h4, h5, h6 {
font-family: inherit;
font-weight: var(--dbim-weight-semibold);
line-height: var(--dbim-leading-heading);
color: var(--dbim-text);
margin: 0 0 var(--dbim-space-4);
}
h1 { font-size: var(--dbim-size-h1); }
h2 { font-size: var(--dbim-size-h2); margin-top: var(--dbim-space-6); }
h3 { font-size: var(--dbim-size-h3); margin-top: var(--dbim-space-5); }
h4 { font-size: var(--dbim-size-p1); margin-top: var(--dbim-space-4); }
h5, h6 { font-size: var(--dbim-size-p2); margin-top: var(--dbim-space-4); }
h1:first-child, h2:first-child, h3:first-child { margin-top: 0; }
p, li, dd, dt, td, th, figcaption, blockquote { font-size: var(--dbim-size-p1); }
p { margin: 0 0 var(--dbim-space-4); }
small, .dbim-small { font-size: var(--dbim-size-small); }
strong, b { font-weight: var(--dbim-weight-semibold); }
code, kbd, samp, pre { font-family: inherit; font-size: inherit; color: inherit; }
/* Links */
a {
color: var(--dbim-link);
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 0.15em;
}
a:hover { color: var(--dbim-link-hover); text-decoration-thickness: 2px; }
/* Abbreviations in menu and footer labels */
abbr.dbim-abbr[title] { text-decoration: none; cursor: inherit; }
/* External link marker */
a[data-external]::after {
content: ""; display: inline-block; width: max(1em, 16px); height: max(1em, 16px); margin-left: 0.25em; vertical-align: -0.15em;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23000' transform='matrix(.3281 0 0 .3281 1.1719 1.1719)'%3E%3Cpath d='M57.9 57.9H8.1V8.1H33V1H8.1C4.2 1 1 4.2 1 8.1V57.9C1 61.8 4.2 65 8.1 65H57.9C61.8 65 65 61.8 65 57.9V33H57.9V57.9ZM40.1 1V8.1H52.9L17.9 43.1L22.9 48.1L57.9 13.1V25.9H65V1H40.1Z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23000' transform='matrix(.3281 0 0 .3281 1.1719 1.1719)'%3E%3Cpath d='M57.9 57.9H8.1V8.1H33V1H8.1C4.2 1 1 4.2 1 8.1V57.9C1 61.8 4.2 65 8.1 65H57.9C61.8 65 65 61.8 65 57.9V33H57.9V57.9ZM40.1 1V8.1H52.9L17.9 43.1L22.9 48.1L57.9 13.1V25.9H65V1H40.1Z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
}
.dbim-logo-grid a[data-external]::after, .dbim-campaigns a[data-external]::after, a[data-external]:has(> img:only-child)::after { content: none; }
/* Websites outside gov.in and nic.in */
@media screen {
a[data-external][data-dbim-other-domain]::after {
width: max(2em, 32px);
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.7 3.8 5.7 3.8 9s-1.3 6.3-3.8 9c-2.5-2.7-3.8-5.7-3.8-9S9.5 5.7 12 3z'/%3E%3C/svg%3E") no-repeat left center / max(1em, 16px) max(1em, 16px),
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23000' transform='matrix(.3281 0 0 .3281 1.1719 1.1719)'%3E%3Cpath d='M57.9 57.9H8.1V8.1H33V1H8.1C4.2 1 1 4.2 1 8.1V57.9C1 61.8 4.2 65 8.1 65H57.9C61.8 65 65 61.8 65 57.9V33H57.9V57.9ZM40.1 1V8.1H52.9L17.9 43.1L22.9 48.1L57.9 13.1V25.9H65V1H40.1Z'/%3E%3C/g%3E%3C/svg%3E") no-repeat right center / max(1em, 16px) max(1em, 16px);
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.7 3.8 5.7 3.8 9s-1.3 6.3-3.8 9c-2.5-2.7-3.8-5.7-3.8-9S9.5 5.7 12 3z'/%3E%3C/svg%3E") no-repeat left center / max(1em, 16px) max(1em, 16px),
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23000' transform='matrix(.3281 0 0 .3281 1.1719 1.1719)'%3E%3Cpath d='M57.9 57.9H8.1V8.1H33V1H8.1C4.2 1 1 4.2 1 8.1V57.9C1 61.8 4.2 65 8.1 65H57.9C61.8 65 65 61.8 65 57.9V33H57.9V57.9ZM40.1 1V8.1H52.9L17.9 43.1L22.9 48.1L57.9 13.1V25.9H65V1H40.1Z'/%3E%3C/g%3E%3C/svg%3E") no-repeat right center / max(1em, 16px) max(1em, 16px);
}
}
/* Focus */
:focus:not(:focus-visible) { outline: none; }
:focus-visible {
outline: var(--dbim-focus-width) solid var(--dbim-focus);
outline-offset: var(--dbim-focus-offset);
/* old page styles animate "all"; show the ring at once */
transition: none;
}
/* Focus inside an iframe (class set by dbim-site.js) */
iframe:focus, iframe:focus:not(:focus-visible), iframe.dbim-has-focus {
outline: var(--dbim-focus-width) solid var(--dbim-focus);
outline-offset: var(--dbim-focus-offset);
}
img, video, svg, iframe { max-width: 100%; }
img, video { height: auto; }
/* Missing image placeholder (set by dbim-site.js) */
.dbim-missing { display: inline-grid; max-width: 100%; vertical-align: middle; }
.dbim-missing--block { display: grid; flex: 1 1 auto; min-width: 0; }
.dbim-missing > * { grid-area: 1 / 1; min-width: 0; }
img[data-dbim-missing] { background-color: var(--dbim-surface-alt); outline: 1px solid var(--dbim-grey-1); outline-offset: -1px; }
img[data-dbim-missing="small"] { display: none; }
.dbim-missing__text {
display: block; overflow: visible;
align-self: center; justify-self: center; z-index: 1; max-width: 100%; padding: 0 var(--dbim-space-2);
font-size: var(--dbim-size-p2); font-weight: var(--dbim-weight-regular); line-height: var(--dbim-leading-heading);
color: var(--dbim-text); text-align: center; overflow-wrap: anywhere;
}
a .dbim-missing__text { color: var(--dbim-link); font-weight: var(--dbim-weight-semibold); text-decoration: underline; }
a:hover .dbim-missing__text { color: var(--dbim-link-hover); }
html[data-dbim-images="off"] .dbim-missing__text { display: none; }
figure { margin: 0 0 var(--dbim-space-4); }
figcaption { color: var(--dbim-text-muted); font-size: var(--dbim-size-p2); margin-top: var(--dbim-space-2); }
hr { border: 0; border-top: var(--dbim-rule); margin: var(--dbim-space-5) 0; opacity: 1; }
/* Tables */
table { border-collapse: collapse; }
caption { caption-side: top; text-align: left; font-weight: var(--dbim-weight-semibold); color: var(--dbim-text); padding: 0 0 var(--dbim-space-2); }
thead th { text-align: center; vertical-align: middle; }
td, tbody th { text-align: left; vertical-align: top; }
td.dbim-num, th.dbim-num { text-align: right; font-variant-numeric: tabular-nums; }
/* Wide tables scroll inside their region */
.dbim-table-wrap { position: relative; max-width: 100%; overflow-x: auto; margin: 0 0 var(--dbim-space-5); }
.dbim-table-wrap:focus-visible { outline-offset: 0; }
/* Utilities */
.dbim-visually-hidden {
position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important;
margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}
.dbim-skip-link {
position: absolute; left: var(--dbim-space-2); top: -100%; z-index: var(--dbim-z-dialog);
padding: var(--dbim-space-3) var(--dbim-space-4); min-height: var(--dbim-target-min);
background: var(--dbim-surface); color: var(--dbim-link); font-weight: var(--dbim-weight-semibold);
}
.dbim-skip-link:focus { top: var(--dbim-space-2); }
/* Same widths as Bootstrap's .container */
.dbim-container { width: 100%; margin: 0 auto; padding: 0 0.75rem; box-sizing: border-box; }
@media (min-width: 576px) { .dbim-container { max-width: 540px; } }
@media (min-width: 768px) { .dbim-container { max-width: 720px; } }
@media (min-width: 992px) { .dbim-container { max-width: 960px; } }
@media (min-width: 1200px) { .dbim-container { max-width: 1140px; } }
@media (min-width: 1400px) { .dbim-container { max-width: 1320px; } }
.dbim-measure { max-width: var(--dbim-measure); }
.dbim-meta { color: var(--dbim-text-muted); font-size: var(--dbim-size-p2); }
/* Accessibility panel options */
/* Colour filters; emblem, crest and portal logos keep their colours */
html[data-dbim-grey="on"] { --dbim-f-sat: grayscale(1); }
html[data-dbim-saturation="low"] { --dbim-f-sat: saturate(0.4); }
html[data-dbim-invert="on"] { --dbim-f-inv: invert(1) hue-rotate(180deg); }
html[data-dbim-filter] .dbim-lockup > :not(img),
html[data-dbim-filter] .dbim-masthead__inner > :not(.dbim-lockup):not(.dbim-cobrand),
html[data-dbim-filter] .dbim-nav,
html[data-dbim-filter] #main-content,
html[data-dbim-filter] body > :not(.dbim-header):not(#main-content):not(.dbim-footer),
html[data-dbim-filter] dialog { filter: var(--dbim-f-inv,) var(--dbim-f-sat,); }
html[data-dbim-filter] .dbim-footer__grid,
html[data-dbim-filter] .dbim-footer__follow-part:first-child,
html[data-dbim-filter] .dbim-footer__follow-title,
html[data-dbim-filter] .dbim-footer__meta { filter: var(--dbim-f-sat,); }
/* Invert: media are inverted back */
html[data-dbim-invert="on"] :is(#main-content, .dbim-nav, dialog, body > :not(.dbim-header):not(#main-content):not(.dbim-footer)) :is(img, video, canvas, iframe) { filter: invert(1) hue-rotate(180deg); }
html[data-dbim-invert="on"] body,
html[data-dbim-invert="on"] .dbim-header,
html[data-dbim-invert="on"] .dbim-masthead { background-color: var(--dbim-black); }
html[data-dbim-invert="on"] .dbim-lockup__emblem,
html[data-dbim-invert="on"] .dbim-lockup__crest,
html[data-dbim-invert="on"] .dbim-cobrand__img { background: var(--dbim-white); padding: 2px; }
html[data-dbim-grey="on"] .dbim-lockup:focus-visible { outline-color: var(--dbim-black); }
html[data-dbim-invert="on"] .dbim-lockup:focus-visible,
html[data-dbim-grey="on"][data-dbim-contrast="high"] .dbim-lockup:focus-visible,
html[data-dbim-grey="on"] .dbim-footer__portals a:focus-visible { outline-color: var(--dbim-white); }
html[data-dbim-grey="on"] .dbim-footer__portals a, html[data-dbim-grey="on"] .dbim-footer__portals .dbim-missing__text { color: var(--dbim-black); }
/* Footer band background takes the filter */
@media screen {
html:is([data-dbim-grey="on"], [data-dbim-saturation="low"]) footer.dbim-footer { position: relative; isolation: isolate; background-color: transparent; }
html:is([data-dbim-grey="on"], [data-dbim-saturation="low"]) footer.dbim-footer::before {
content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background-color: var(--dbim-band); filter: var(--dbim-f-sat,);
}
}
/* Open modal: the filter moves from the content to the dialog */
html[data-dbim-filter] body.modal-open #main-content { filter: none; }
html[data-dbim-filter] #main-content .modal { filter: var(--dbim-f-inv,) var(--dbim-f-sat,); }
@supports selector(:has(a)) {
html[data-dbim-filter] body.modal-open #main-content:not(:has(.modal)),
html[data-dbim-filter] body.modal-open :is(#main-content, #main-content *):has(.modal) > :not(.modal):not(:has(.modal)) { filter: var(--dbim-f-inv,) var(--dbim-f-sat,); }
}
/* Highlight links */
html[data-dbim-links="on"] a[href]:not(.dbim-lockup):not(.dbim-skip-link):not(:has(> img:only-child)),
html[data-dbim-links="on"] a[href]:not(.dbim-lockup):not(.dbim-skip-link):not(:has(> img:only-child)) * {
color: var(--dbim-earthy-brown) !important; background-color: var(--dbim-warning) !important; text-decoration: underline !important;
}
/* Hide images; emblem, crest and captcha stay */
html[data-dbim-images="off"] img:not([data-dbim-keep]):not([src*="aptcha" i]) { display: none !important; }
html[data-dbim-images="off"] a[data-dbim-alt]::before { content: attr(data-dbim-alt); }
.dbim-hero__alt { display: none; }
/* Text spacing; Hindi keeps its letter spacing */
html[data-dbim-spacing="on"] #main-content,
html[data-dbim-spacing="on"] #main-content * {
line-height: 1.5 !important; letter-spacing: 0.12em !important; word-spacing: 0.16em !important;
}
html[data-dbim-spacing="on"] #main-content p { margin-bottom: 2em !important; }
html[data-dbim-spacing="on"] #main-content:lang(hi),
html[data-dbim-spacing="on"] #main-content :lang(hi) { letter-spacing: normal !important; }
/* Large cursor */
html[data-dbim-cursor="large"], html[data-dbim-cursor="large"] * {
cursor: url("../img/cursor-arrow.svg") 6 3, url("../img/cursor-arrow.png") 6 3, auto !important;
}
html[data-dbim-cursor="large"] :is(a[href], button:not(:disabled), summary, select, label[for], input:is([type="submit"], [type="button"], [type="checkbox"], [type="radio"]), [role="button"], [role="tab"]),
html[data-dbim-cursor="large"] :is(a[href], button:not(:disabled), summary, label[for], [role="button"], [role="tab"]) * {
cursor: url("../img/cursor-hand.svg") 22 4, url("../img/cursor-hand.png") 22 4, pointer !important;
}
/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
/* Print only: page address under the footer */
.dbim-print-only { display: none; }
/* Print */
@media print {
@page { size: A4; margin: 15mm; }
.row { margin-left: 0 !important; margin-right: 0 !important; --bs-gutter-x: 0; }
body { font-size: 12pt; color: var(--dbim-black); background: var(--dbim-white); }
*, *::before, *::after {
color: var(--dbim-black) !important; background-color: transparent !important; background-image: none !important;
box-shadow: none !important; text-shadow: none !important; filter: none !important;
}
.dbim-no-print, .dbim-skip-link { display: none !important; }
.dbim-print-only { display: block !important; }
a { color: var(--dbim-black); }
/* external links print their address */
a[data-external]::after,
a[href^="http"]:not([href*="//crpf.gov.in"]):not([href*="//www.crpf.gov.in"])::after {
content: " (" attr(href) ")"; display: inline; width: auto; height: auto; margin: 0; vertical-align: baseline;
-webkit-mask: none; mask: none; font-size: 9pt;
word-break: normal; overflow-wrap: anywhere; hyphens: none;
}
/* let long addresses wrap inside flex and grid items */
a, .dbim-embed__actions { min-width: 0; max-width: 100%; }
.dbim-embed__actions { display: block; }
a:has(img)::after { content: none !important; }
table, tr, img, figure { break-inside: avoid; page-break-inside: avoid; }
thead { display: table-header-group; }
h1, h2, h3, h4, h5, h6, caption { break-after: avoid; page-break-after: avoid; }
p, li { orphans: 3; widows: 3; }
footer.dbim-footer { break-inside: avoid; break-before: avoid; }
#main-content > :last-child { break-after: avoid; }
.dbim-table-wrap { overflow: visible; }
#ui-datepicker-div, .ui-datepicker { display: none !important; }
/* wide tables: small type, wrapped cells */
.dbim-container { max-width: none !important; }
table { width: 100% !important; max-width: 100% !important; table-layout: auto; }
th, td { font-size: 12px; white-space: normal !important; overflow-wrap: anywhere; }
}