/* ===================================================================== ActuPolice.com — Feuille de style principale --------------------------------------------------------------------- Reprise du thème WordPress « Viral News » (HashThemes), purgée des règles mortes : blocs « page builder » de la page d'accueil jamais activés, carrousel Owl, widgets Timeline et Personal Info non utilisés, styles AMP et Elementor. 143 règles supprimées, soit 31 % du fichier, sans aucun changement de rendu. Les valeurs pilotées depuis le back-office — couleur principale, bannière, polices — sont injectées en variables CSS dans le . Voir app/templates/layout/document.php. ===================================================================== */ /*-------------------------------------------------------------- # Normalize --------------------------------------------------------------*/ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { margin: 0; } article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } a { background-color: transparent; text-decoration: none; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } hr { box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-appearance: textfield; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*-------------------------------------------------------------- # Typography --------------------------------------------------------------*/ html, body, button, input, select, textarea { color: var(--viral-news-body-color, #404040); font-size: var(--viral-news-body-size, 14px); letter-spacing: var(--viral-news-body-letter-spacing, 0); line-height: var(--viral-news-body-line-height, 1.8); font-family: var(--viral-news-body-family, Libre Baskerville); font-weight: var(--viral-news-body-weight, 400); font-style: var(--viral-news-body-style, normal); text-decoration: var(--viral-news-body-text-decoration, none); text-transform: var(--viral-news-body-text-transform, none); } h1, h2, h3, h4, h5, h6 { font-family: var(--viral-news-header-family, Playfair Display); letter-spacing: var(--viral-news-header-letter-spacing, 0); line-height: var(--viral-news-header-line-height, 1.3); font-weight: var(--viral-news-header-weight, 400); font-style: var(--viral-news-header-style, normal); text-decoration: var(--viral-news-header-text-decoration, none); text-transform: var(--viral-news-header-text-transform, none); margin: 0; } h1 { font-size: 36px; margin-bottom: 15px; } h2 { font-size: 30px; margin-bottom: 15px; } h3 { font-size: 26px; margin-bottom: 15px; } h4 { font-size: 22px; margin-bottom: 10px; } h5 { font-size: 20px; margin-bottom: 10px; } h6 { font-size: 18px; margin-bottom: 10px; } p { margin: 0 0 15px; } dfn, cite, em, i { font-style: italic; } blockquote, .wp-block-quote.is-large, .wp-block-quote.is-style-large { margin: 0 0 25px; border-left: 3px solid #EEE; padding-left: 30px; } address { margin: 0 0 15px; } pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; margin-bottom: 25px; max-width: 100%; overflow: auto; padding: 30px; } code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } /*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ html { box-sizing: border-box; } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; } body { background: #fff; /* Fallback for when there is no custom background color defined. */ } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } hr { background-color: #EEE; border: 0; height: 1px; margin-top: 25px; margin-bottom: 25px; clear: both; } ul, ol { margin: 0 0 20px 25px; padding: 0; } ul { list-style: square; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; margin-left: 20px; } dt { font-weight: bold; } dd { margin: 0 15px 15px; } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ vertical-align: middle; } table { margin: 0 0 15px; width: 100%; } /*-------------------------------------------------------------- # Forms --------------------------------------------------------------*/ button, input[type="button"], input[type="reset"], input[type="submit"] { background: var(--viral-news-template-color, #0078af); color: #FFF; padding: 10px 20px; border: 0; } button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { background: #0E0E0E; } button:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, button:active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active { } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea { border: 1px solid #EEE; width: 100%; padding: 10px; } select { border: 1px solid #EEE; padding: 10px; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus, select:focus { } textarea { width: 100%; height: auto; } /*-------------------------------------------------------------- ## Links --------------------------------------------------------------*/ a { color: var(--viral-news-body-color, #404040); text-decoration: none; } a:hover, a:focus, a:active { color: var(--viral-news-template-color, #0078af) } a:focus { } a:hover, a:active { } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; right: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } /*-------------------------------------------------------------- # Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin-right: 25px; margin-bottom: 25px; } .alignright { display: inline; float: right; margin-left: 25px; margin-bottom: 25px; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; margin-bottom: 25px; } .wp-block-cover, .wp-block-cover-image { margin-bottom: 25px; } .wp-block-latest-posts.wp-block-latest-posts__list { margin-left: 0; } /*-------------------------------------------------------------- # Clearings --------------------------------------------------------------*/ .vn-clearfix:before, .vn-clearfix:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after, .nav-links:before, .nav-links:after { content: ""; display: table; } .vn-clearfix:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after, .nav-links:after { clear: both; } /*-------------------------------------------------------------- # Widgets --------------------------------------------------------------*/ .widget { margin: 0 0 30px; } /* Make sure select elements fit in widgets. */ .widget select { max-width: 100%; } /* Search widget. */ .widget_search .search-submit { display: none; } .widget a { color: #404040; } .tagcloud { font-size: 0; } .tagcloud a { display: inline-block; font-size: 15px !important; border: 2px solid #EEE; padding: 6px 10px; line-height: 1; margin: 0 8px 8px 0; color: inherit !important; } .search-form { display: flex; } .search-form label { flex-grow: 1; } /*-------------------------------------------------------------- ## Posts and pages --------------------------------------------------------------*/ .sticky { display: block; } .hentry { margin: 0 0 40px; } .byline, .updated:not(.published) { display: none; } .single .byline { display: inline; } .page-content, .entry-content, .entry-summary { } .page-links { clear: both; margin: 0 0 15px; } #primary { width: 69%; float: left; } #secondary { width: 27%; float: right; } .viral-news-no-sidebar #primary { width: auto; float: none; } .viral-news-no-sidebar-condensed #primary { width: 76%; float: none; margin: 0 auto; } .viral-news-left-sidebar #primary { float: right; } .viral-news-left-sidebar #secondary { float: left; } .vn-main-header { margin-bottom: 40px; text-align: center } .vn-main-header h1 { margin-bottom: 0; } .vn-main-header .taxonomy-description, .vn-main-header .posted-on { margin-top: 20px; } /* Archive Page*/ .vn-post-wrapper .entry-figure { margin-bottom: 0; } .entry-body { background: rgba(0, 0, 0, 0.02); padding: 30px; } .entry-post-info { float: left; width: 20%; text-align: center; padding-right: 40px; } .entry-post-content { float: right; width: 80%; } .entry-post-info .entry-date { display: inline-block; padding: 10px 0; background: var(--viral-news-template-color, #0078af); color: #FFF; width: 70px; margin-top: -30px; margin-bottom: 30px; line-height: 1.3; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .entry-post-info .entry-date span { display: block; } .entry-post-info .entry-date span.vn-day { font-size: 28px; line-height: 1.2; } .entry-post-info .entry-author { display: block; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #DDD; } .entry-post-info .entry-author img { border-radius: 50%; margin-bottom: 10px; } .entry-post-info .entry-author .author { display: block; } .entry-figure { background: #F6F6F6; text-align: center; } .entry-header .entry-title { margin-bottom: 20px; } .entry-header .entry-title a { text-decoration: none; } .entry-categories { font-size: 13px; margin-bottom: 15px; } .entry-categories .fa { margin-right: 5px; } .entry-categories a { text-decoration: none; } .entry-footer .cat-links, .entry-footer .tags-links, .entry-footer .edit-link { font-size: 14px; margin-bottom: 10px; } .entry-footer .cat-links a, .entry-footer .tags-links a, .entry-footer .edit-link a { } .entry-footer .cat-links i, .entry-footer .tags-links i, .entry-footer .edit-link i { margin-right: 5px; } .vn-archive-post { margin-bottom: 50px; } .vn-archive-post .entry-footer { margin-top: 30px; } .entry-footer .vn-read-more { background: var(--viral-news-template-color, #0078af); padding: 10px 20px; color: #FFF; display: inline-block; line-height: 1.2; float: right; } .entry-footer .vn-read-more:hover { background: #0E0E0E; } .entry-footer .vn-share-buttons { float: left; } .vn-share-buttons span { margin-right: 10px; } .vn-share-buttons a { padding: 0 5px; font-size: 18px; display: inline-block; } .vn-share-buttons .fa { line-height: 40px; display: block; } /* Single Page*/ .vn-article-content p { margin-bottom: 25px; } .single-featured-img { margin-bottom: 20px; } /* 404 Page*/ .error404 .page-content { min-height: 200px; } /*-------------------------------------------------------------- ## Asides --------------------------------------------------------------*/ .widget-area ul { list-style: none; padding: 0; margin: 0; } .widget-area ul ul { margin-top: 10px; } .widget-area ul ul li { padding-left: 10px; } .widget-area ul ul li:last-child { border-bottom: 0; padding-bottom: 0; } .widget-area li { padding: 0 0 10px; } .widget-area a { text-decoration: none; } .widget-area .widget { margin-bottom: 40px; } /* Contact Info Widget */ .vn-contact-info ul { list-style: none; margin: 0; padding: 0; } .vn-contact-info ul li { padding: 0 0 0 30px; margin: 0 0 10px; border: none; } .vn-contact-info ul li i { margin-left: -30px; float: left; margin-top: 6px; } .vn-contact-info p { margin: 0; } /* Category Block Widget */ .vn-category_block .vn-post-thumb { float: left; width: 100px; } .vn-category_block .vn-post-thumb .vn-thumb-container { padding-bottom: 100px; } .vn-category_block .vn-post-content { margin-left: 120px; } .vn-category_block .posted-on .byline { display: none; } /* Category Widget */ .widget_categories li:before, .widget_categories li:after { content: ""; display: table; } .widget_categories li:after { clear: both; } .widget_categories li { text-align: right; } .widget_categories li a { float: left; } /*-------------------------------------------------------------- ## Comments --------------------------------------------------------------*/ .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } .author-email-url input { width: 100%; } .comment-form .form-submit { margin-bottom: 0 } #comments { margin-bottom: 40px; } h3#reply-title, h3.comments-title { font-size: 20px; text-transform: uppercase; border-bottom: 3px solid #EEE; margin-bottom: 30px; font-weight: normal; line-height: 20px; padding-bottom: 10px; } .logged-in-as, .comment-notes { font-size: 14px; } #comments ul { list-style: none; margin: 0; padding: 0; } #comments li.comment { margin: 0 0 30px; } #comments li.comment .children { display: block; margin: 30px 0 0 30px; padding: 0px; list-style: none; } article.comment-body { margin: 0px; position: relative; } .comment-list a { color: inherit; } .comment-list a:hover { color: var(--viral-news-template-color, #0078af); } .comment-list .comment-respond { margin-top: 20px; } .comment-list .vcard img { margin-right: 10px; vertical-align: middle; } .comment-list .vcard .fn { font-weight: normal; font-size: 16px; } .comment-list .edit-link { position: absolute; right: 0; top: 0; } .comment-list .edit-link a { font-size: 13px; display: inline-block; padding: 10px; } .comment-list .comment-meta { margin-bottom: 15px; } .comment-list .comment-metadata { border-top: 1px solid #EEE; padding-top: 10px; font-size: 13px; } .comment-list .comment-metadata a { float: left; } .comment-list .comment-metadata .reply { float: right; } #cancel-comment-reply-link { float: right; } .comment-navigation .nav-previous a, .comment-navigation .nav-next a { background: var(--viral-news-template-color, #0078af); color: #FFF; display: inline-block; padding: 0 10px; font-size: 12px; line-height: 22px; position: relative; } .comment-navigation .nav-next a { margin-right: 13px; } .comment-navigation .nav-next a:after { content: ""; position: absolute; border-left: 11px solid var(--viral-news-template-color, #0078af); border-top: 11px solid transparent; border-bottom: 11px solid transparent; top: 0; right: -11px; } .comment-navigation .nav-previous a { margin-left: 11px; } .comment-navigation .nav-previous a:after { content: ""; position: absolute; border-right: 11px solid var(--viral-news-template-color, #0078af); border-top: 11px solid transparent; border-bottom: 11px solid transparent; top: 0; left: -11px; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /*-------------------------------------------------------------- ## Captions --------------------------------------------------------------*/ .wp-caption { margin-bottom: 15px; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /*-------------------------------------------------------------- ## Galleries --------------------------------------------------------------*/ .gallery { margin-bottom: 15px; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } /*-------------------------------------------------------------- ## General --------------------------------------------------------------*/ .vn-boxed { background: #EAEAEA; } .vn-boxed #vn-page { width: 1250px; margin: 0 auto; background: #FFF; } .vn-container { width: 1170px; margin: 0 auto; } .pagination { text-align: center; margin-bottom: 40px; } .pagination a, .pagination span { border: 1px solid #333; padding: 8px 20px; display: inline-block; margin: 4px 2px; color: #333; } .pagination span.current, .pagination a:hover { background: #333; color: #FFF; } /*-------------------------------------------------------------- ## Header --------------------------------------------------------------*/ #vn-masthead { position: relative; z-index: 999; } .vn-top-header { color: #333; padding: 12px 0; font-size: 13px; border-bottom: 1px solid #EEE; background: #FFF; } .vn-top-header.vn-dark { background: #000; border: none; color: #FFF; } .vn-top-header.vn-theme-color { border: none; color: #FFF; background: var(--viral-news-template-color, #0078af); } .vn-top-header.vn-theme-color a, .vn-top-header.vn-dark a { color: #FFF; } .vn-top-header .vn-container { display: flex; justify-content: space-between; align-items: center; } .vn-top-header a { color: #333; } .vn-top-header.vn-dark a { color: #FFF; } .vn-top-left-header { max-width: 60%; } .vn-top-left-header > span { display: inline-block; margin-right: 25px; } .vn-top-left-header > span i { display: inline-block; margin-right: 6px; font-weight: bold; } .vn-top-right-header > .vn-top-menu { display: inline-block; } .vn-top-right-header .vn-top-menu ul { margin: 0; padding: 0; list-style: none; } .vn-top-right-header .vn-top-menu ul li { display: inline; margin-right: 10px; } .vn-top-right-header { max-width: 70%; } .vn-top-right-header > a { padding: 0 6px; } .vn-header { padding: var(--viral-news-header-padding, 50px 0); background-size: cover; background-position: center; background-image: var(--viral-news-header-image); } .vn-header.vn-white a, .vn-header.vn-white .vn-header-search span { color: #FFF; } .vn-header .vn-container { display: -webkit-flex; display: flex; align-items: center; -webkit-align-items: center; justify-content: space-between; } .vn-header-social-icons, .vn-header-search { width: 260px; } #vn-site-branding { text-align: center; padding: 10px 0; } .vn-site-title { font-family: var(--viral-news-header-family, Playfair Display); font-weight: bold; margin: 0 0 10px; letter-spacing: 2px; text-transform: uppercase; font-size: 46px; line-height: 1; } .vn-site-title a, .vn-site-description a { text-decoration: none; color: #333; } .vn-site-description { margin: 0; font-size: 14px; font-style: italic; line-height: 1; } .vn-header a { color: #444; } .vn-header-social-icons a { padding: 10px; font-size: 20px; color: #111; } .vn-header-search { text-align: right; font-size: 24px; } .vn-header-search span { color: #000; } .vn-header-search i { cursor: pointer; padding: 10px; color: inherit; font-weight: bold; transform: rotate(90deg); } /*-------------------------------------------------------------- ## Menus --------------------------------------------------------------*/ #vn-site-navigation { border-top: 1px solid #EEE; border-bottom: 1px solid #EEE; margin-bottom: 40px; background: #FFF; } #vn-site-navigation .vn-container { display: flex; justify-content: center; } .vn-main-navigation ul { list-style: none; margin: 0; padding-left: 0; font-family: var(--viral-news-menu-family, Playfair Display); } .vn-main-navigation li { float: left; position: relative; } .vn-main-navigation a { display: block; color: #333; line-height: 32px; letter-spacing: var(--viral-news-menu-letter-spacing, 0); font-size: var(--viral-news-menu-size, 15px); font-weight: var(--viral-news-menu-weight, 400); font-style: var(--viral-news-menu-style, normal); text-decoration: var(--viral-news-menu-text-decoration, none); text-transform: var(--viral-news-menu-text-transform, uppercase); } .vn-menu > ul > li { padding: 16px 0; margin: 0 15px; } .vn-menu > ul > li > a { padding: 0; } .vn-main-navigation ul ul { display: none; position: absolute; left: 0; top: 100%; background: #FFF; box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2); min-width: 240px; z-index: 99; } .vn-main-navigation ul ul ul { left: 100%; top: 0; } .vn-main-navigation ul ul a { text-transform: none; line-height: 1.5; padding: 14px 20px; } .vn-main-navigation ul ul li { float: none; border-bottom: 1px solid rgba(0, 0, 0, 0.05); } .vn-main-navigation ul ul li:last-child { border-bottom: 0; } .vn-main-navigation ul li:hover > ul { display: block; } .vn-main-navigation .vn-menu > ul > li > a:after { content: ""; position: absolute; left: 0; width: 0; top: 100%; margin-top: -15px; background: #333; height: 1px; transition: all 0.2s ease; -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; } .vn-main-navigation .vn-menu > ul > li:hover > a:after, .vn-main-navigation .vn-menu > ul > .current_page_item > a:after, .vn-main-navigation .vn-menu > ul > .current-menu-item > a:after, .vn-main-navigation .vn-menu > ul > .current_page_ancestor > a:after { width: 100%; } #vn-site-navigation.vn-dark { border: none; background: #000; } #vn-site-navigation.vn-dark .vn-menu > ul > li > a { color: #FFF; } .vn-main-navigation.vn-dark .vn-menu > ul > li > a:after { background: #FFF; } #vn-site-navigation.vn-theme-color { border: none; background: var(--viral-news-template-color, #0078af); } #vn-site-navigation.vn-theme-color .vn-menu > ul > li > a { color: #FFF; } .vn-main-navigation.vn-theme-color .vn-menu > ul > li > a:after { background: #FFF; } .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation { margin: 0 0 15px; overflow: hidden; } .comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous { float: left; width: 50%; text-align: right; padding: 20px; border-right: 1px solid #EEE; } .comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next { float: right; width: 50%; text-align: left; padding: 20px; } .post-navigation { border-top: 1px solid #EEE; border-bottom: 1px solid #EEE; margin-bottom: 50px; } .post-navigation .nav-links { display: -webkit-flex; display: flex; } .post-navigation a { color: inherit; } .post-navigation a:hover { color: var(--viral-news-template-color, #0078af); } .post-navigation span { display: block; } .nav-previous span i { margin-right: 10px; font-size: 1.2em; } .nav-next span i { margin-left: 10px; font-size: 1.2em; } /* Top Section Blocks */ .vn-post-thumb { position: relative } .vn-thumb-container { position: relative; padding-bottom: 70%; background: #f7f7f7; background-position: center; background-size: cover; overflow: hidden; } .vn-thumb-container img { position: absolute; left: 0; bottom: 0; width: 100% !important; height: 100% !important; object-fit: cover; object-position: center } .posted-on i { display: inline-block; margin-right: 5px; font-size: 0.88em; font-weight: bold; } .vn-post-item h3.vn-large-title { font-size: 26px; } .vn-post-item h3.vn-big-title { font-size: 22px; } .vn-post-content.vn-gradient-overlay { position: absolute; left: 0; right: 0; bottom: 0; padding: 15px; color: #fff; background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .9) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, .9))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .9) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .9) 100%); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .9) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#b3000000', GradientType=0) } .vn-post-content.vn-gradient-overlay h3.vn-post-title { color: #fff } .vn-post-content .posted-on { color: inherit } /* Middle Section */ body .he-block-title { font-weight: var(--viral-news-header-weight, 400); } .vn-block-title, .widget-area .widget-title { font-size: 20px; text-transform: uppercase; border-bottom: 3px solid rgba(0, 0, 0, 0.1); margin-bottom: 30px; line-height: 1; } .vn-block-title span, .widget-area .widget-title span { position: relative; display: inline-block; padding-bottom: 10px; } .vn-block-title span:before, .widget-area .widget-title span:before { content: ""; position: absolute; height: 3px; top: 100%; left: 0; width: 100%; background: var(--viral-news-template-color, #0078af); } .vn-post-item { margin-bottom: 30px; } .vn-post-item:last-child { margin-bottom: 0; } .vn-post-item h3 { font-size: 16px; margin-bottom: 10px; } .vn-post-item h3 a { color: inherit; } .vn-post-item h3 a:hover { color: var(--viral-news-template-color, #0078af); } .vn-post-thumb { overflow: hidden; } .vn-post-thumb img { transform: scale(1); transition: all 0.3s ease; } .vn-post-thumb:hover img { transform: scale(1.2); } .posted-on { font-size: 12px; opacity: 0.8; } /*-------------------------------------------------------------- ## Footer --------------------------------------------------------------*/ #vn-colophon { background: #000; color: #FAFAFA; } #vn-colophon a { color: #F0F0F0; } #vn-colophon a:hover { color: #F6F6F6; } .vn-top-footer-inner { margin: 0 -20px; } .vn-top-footer { padding: 60px 0 30px; } .vn-footer-block { width: 25%; padding: 0 20px; float: left; } .vn-footer-block .widget-title { font-size: 22px; margin-bottom: 20px; color: #EEE; } .vn-footer-block ul { list-style: none; padding: 0; margin: 0; } .vn-footer-block li { padding: 5px 0; line-height: 1.3; } .vn-footer-block .posted-on { color: #F6F6F6; } .vn-footer-block .vn-contact-info ul li i { margin-top: 4px; } .vn-footer-block .widget_categories > ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; } .vn-bottom-footer { text-align: center; } .vn-bottom-footer .vn-container { border-top: 1px solid #111; padding: 20px 0; font-size: 12px; } .vn-bottom-footer a { text-decoration: underline; } #vn-back-top { background: var(--viral-news-template-color, #0078af); color: #FFF; height: 40px; width: 40px; position: fixed; right: 20px; bottom: 20px; display: flex; align-items: center; justify-content: center; font-size: 24px; cursor: pointer; transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; } #vn-back-top .fa { line-height: 40px; } #vn-back-top:hover { background: #0E0E0E } #vn-back-top.vn-hide { opacity: 0; visibility: hidden; transform: scale(0.5); -ms-transform: scale(0.5); -webkit-transform: scale(0.5); } /*** arrows (for all except IE7) **/ .sf-arrows .sf-with-ul { padding-right: 1.5em; } /* styling for both css and generated arrows */ .sf-arrows .sf-with-ul:before { content: '\F0140'; font-family: "Material Design Icons"; position: absolute; right: 1em; height: 0; width: 0; } /* styling for right-facing arrows */ .sf-arrows ul .sf-with-ul:before { content: '\F0142'; } /*-------------------------------s------------------------------- ## Search Overlay CSS --------------------------------------------------------------*/ .ht-search-wrapper { position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); z-index: 99999; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .ht-search-wrapper.ht-search-triggered { opacity: 1; visibility: visible; } .ht-search-close { position: absolute; top: 0; right: 0; cursor: pointer; height: 90px; width: 90px; text-align: center; line-height: 90px; color: #333; font-size: 30px; } .ht-search-close span { display: block; position: absolute; height: 40px; width: 40px; left: 25px; top: 25px; } .ht-search-close span:after, .ht-search-close span:before { content: ""; position: absolute; left: 0; top: 50%; height: 2px; width: 100%; background: #333; } .ht-search-close span:after { transform: rotate(45deg); } .ht-search-close span:before { transform: rotate(-45deg); } .ht-search-container { position: absolute; left: 20%; right: 20%; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .ht-search-container .search-form { background: #FFF; padding: 0 90px; } .ht-search-container .search-field { width: 100%; background: none; border: none; height: 90px; font-size: 30px; color: #333; padding: 15px; line-height: 1; } .ht-search-container .search-submit { background: none !important; border: none; position: absolute; left: 0; top: 0; height: 90px; width: 90px; text-align: center; line-height: 90px; cursor: pointer; font-size: 28px; padding: 0; color: #333; } .vn-main-navigation .vn-toggle-menu, .vn-main-navigation .vn-header-search { display: none; } .elementor-element.e-con { --padding-top: var(--container-default-padding-top, 0); --padding-right: var(--container-default-padding-right, 0); --padding-bottom: var(--container-default-padding-bottom, 0); --padding-left: var(--container-default-padding-left, 0); } @media screen and (max-width: 1250px) { .vn-boxed #vn-page { width: 100%; } } @media screen and (max-width: 1200px) { .vn-container { width: 100%; padding: 0 30px; } .e-con.e-parent > .e-con-inner { width: 100% !important; padding-left: 30px !important; padding-right: 30px !important; } } @media screen and (max-width: 1000px) { .vn-top-header .vn-container { display: block; } .vn-top-right-header { display: none; } .vn-top-left-header { text-align: center; max-width: 100%; } #vn-site-navigation .vn-container { justify-content: flex-end; } .vn-main-navigation .vn-menu { display: none; background: #FFF; float: none; position: absolute; top: 100%; left: 0; right: 0; text-align: center; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .vn-main-navigation li { float: none; display: inline-block; } .vn-main-navigation ul ul li { display: block; text-align: left; } .vn-main-navigation .vn-menu a { color: #0E0E0E !important; } .vn-main-navigation .vn-toggle-menu { display: block; float: right; height: 54px; width: 54px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .vn-main-navigation .vn-toggle-menu span { position: relative; background: #333; height: 2px; width: 32px; display: block; box-shadow: 0 10px 0px 0px #333, 0 -10px 0px 0px #333; } .vn-theme-color.vn-main-navigation .vn-toggle-menu span, .vn-dark.vn-main-navigation .vn-toggle-menu span { background: #FFF; box-shadow: 0 10px 0px 0px #FFF, 0 -10px 0px 0px #FFF; } .vn-theme-color.vn-main-navigation .vn-header-search span, .vn-dark.vn-main-navigation .vn-header-search span { color: #FFF; } } @media screen and (max-width: 768px) { .vn-header .vn-container { display: block; } .vn-header-social-icons, .vn-header-search { display: none; } #vn-site-navigation .vn-container { justify-content: space-between; align-items: center; } .vn-main-navigation .vn-header-search { display: block; width: auto; } .vn-main-navigation .vn-header-search span { font-size: 18px; } .ht-search-container { left: 20px; right: 20px; } #vn-site-branding { text-align: center; } .vn-menu > ul > li, .vn-main-navigation li { padding: 0; display: block; border-bottom: 1px solid #FAFAFA; } .vn-menu > ul > li > a, .vn-main-navigation a { padding: 12px 0; } .vn-main-navigation ul ul { position: static; box-shadow: none; border-top: 1px solid #FAFAFA; } .vn-main-navigation ul ul li { text-align: center; } .vn-menu > ul > li > a:after { display: none; } #primary { width: auto !important; float: none !important; } #secondary { width: auto !important; float: none !important; } .vn-footer-block { width: 100%; float: none; margin-bottom: 40px; } .vn-footer-block:last-child { margin-bottom: 0; } .vn-footer-block .widget:last-child { margin-bottom: 0 } } @media screen and (max-width: 580px) { #vn-site-branding { padding: 0; } .vn-post-item h3 { font-size: 18px !important; } .entry-body { padding: 20px; } .entry-post-info, .entry-post-content { width: 100%; float: none; } .entry-post-info .entry-date { margin-bottom: 0; } .entry-post-info { margin-bottom: 40px; } } @media screen and (max-width: 480px) { .post-navigation .nav-links { display: block; } .comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous, .comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next { width: 100%; } .comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous { border-right: 0; border-bottom: 1px solid #EEE; } .ht-search-container .search-form { padding: 0 50px; } .ht-search-container .search-field { height: 60px; font-size: 18px; } .ht-search-container .search-submit, .ht-search-close { height: 60px; width: 50px; line-height: 60px; font-size: 16px; } .ht-search-close span { height: 20px; width: 20px; left: 15px; top: 20px; } } @media screen and (min-width: 1001px) { .vn-main-navigation .vn-menu { display: block !important; } }