%PDF- %PDF-
Direktori : /home/ugotscom/public_html/boniface/blog/wp-content/themes/purea-magazine/ |
Current File : /home/ugotscom/public_html/boniface/blog/wp-content/themes/purea-magazine/style.css |
/* Theme Name: Purea Magazine Theme URI: https://www.spiraclethemes.com/purea-magazine-free-wordpress-theme/ Author: Spiracle Themes Author URI: https://www.spiraclethemes.com/ Description: Purea Magazine is a simple, creative, easy to use free WordPress theme for news, sports, game, travel and other small company and business sites. The theme is built on the popular Bootstrap Framework which is completely responsive and SEO friendly. You can customize almost all the options from the Customizer itself. Purea Magazine also comes with trending news slider, preloader option, news widgets etc. Theme comes with the cross browser compatibility and supports RTL sites. Purea Magazine is also compatible with all the popular page builders like Elementor, Beaver Builder, Visual Composer, Site Origin etc. More Information here: https://www.spiraclethemes.com/purea-magazine-free-wordpress-theme/ Version: 1.0.7 License: GNU General Public License v3 License URI: https://www.gnu.org/licenses/gpl-3.0.html Requires at least: 4.5 Tags: blog, one-column, news, right-sidebar, left-sidebar, custom-header, featured-images, custom-menu, custom-logo, theme-options, threaded-comments, translation-ready, sticky-post, full-width-template, two-columns, three-columns, rtl-language-support Text Domain: purea-magazine */ /** ==================================================================== General Classes ==================================================================== */ *, *:after, *::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; } html, body { color: #555; font-family: 'Poppins', sans-serif; font-size: 13px; font-style: normal; font-weight: 400; height: 100%; letter-spacing: 0.5px; margin: 0; padding: 0; text-rendering: optimizeLegibility; text-rendering: geometricPrecision; width: 100%; -moz-font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -webkit-font-smoothing: subpixel-antialiased; } html,body { line-height: 1.7em; } h1,h2,h3,h4,h5,h6,p,ul { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6 { color: #555; clear: both; line-height: 1.4; margin: 0 0 0.75em; padding: 0.5em 0 0; font-family: 'Spectral', serif; } h1 {font-size: 34px;} h2 {font-size: 30px;} h3 {font-size: 25px;} h4 {font-size: 22px;} h5 {font-size: 18px;} h6 {font-size: 14px;} a { text-decoration: none; display: inline-block; word-break: break-word; -ms-word-wrap: break-word; } a:hover, a:visited { text-decoration: none; } a:focus{ text-decoration: none; } img { max-width: 100%; height: auto; } ol, ul { list-style: none; } input[type="text"], input[type="email"], input[type="url"], input[type="password"] { border: 1px solid #d0d0d0; color: #a1a1a1; height: 50px; padding: 0px 10px 0 20px; width: 100%; font-weight: 400; } textarea { border: 1px solid #d0d0d0; color: #000; padding: 10px 10px 0 20px; width: 100%; font-weight: 400; } select { width: 100%; height: 50px; background: none; border: 1px solid #ccc; border-radius: 0; } textarea:hover, input:hover, textarea:active, input:active, button:active, button:hover { -webkit-appearance: none; } textarea:focus, input:focus, button:focus, select:focus { -webkit-appearance: none; } blockquote { background: transparent url(img/bquote.png) no-repeat scroll 0 0; border: none; padding: 0 0 0 40px; } blockquote p { margin-top: 30px; overflow: hidden; margin-bottom: 8px !important; } blockquote cite { font-weight: 700; } table { border-bottom: 1px solid #ededed; border-collapse: collapse; border-spacing: 0; font-size: 14px; line-height: 2; margin: 0 0 20px; width: 100%; } td { border-top: 1px solid #ededed; padding: 6px 10px 6px 0; } caption, td { font-weight: normal; text-align: left; } tr{ font-weight: 700; } ul { margin-left: 0; } ol { margin-left: 20px; list-style: decimal; } li > ul, li > ol { margin-left: 20px; } address { font-style: italic; } p { margin: 0 0 1.5em; padding: 0; } dd { margin: 0 0 1.5em 20px; padding: 0; } big { font-size: 125%; } small { font-size: 80%; } .clearfix { clear: both; } /** ==================================================================== Preloader ==================================================================== */ .loader-wrapper { background: #fff; width: 100%; height: 100%; position: fixed !important; top: 0; bottom: 0; left: 0; right: 0; z-index: 100000; } #pre-loader { height: 30px; width: 30px; position: absolute; top: 45%; left: 47%; } .loader-pulse { width: 50px; height: 50px; background-color: #555; border-radius: 100%; animation: loader-pulse 1.2s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955); } @keyframes loader-pulse { 0% { transform: scale(0); } 100% { transform: scale(1); opacity: 0; } } /** ==================================================================== WordPress Core ==================================================================== */ .alignnone { margin: 5px 20px 20px 0; } .aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; } .alignright { float:right; margin: 5px 0 20px 20px; } .alignleft { float: left; margin: 5px 20px 20px 0; } a img.alignright { float: right; margin: 5px 0 20px 20px; } a img.alignnone { margin: 5px 20px 20px 0; } a img.alignleft { float: left; margin: 5px 20px 20px 0; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto; } .wp-caption { background: #fff; max-width: 96%; /* Image does not overflow the content area */ padding: 5px 3px 10px; text-align: center; } .wp-caption.alignnone { margin: 5px 20px 20px 0; } .wp-caption.alignleft { margin: 5px 20px 20px 0; } .wp-caption.alignright { margin: 5px 0 20px 20px; } .wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; } /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; white-space: nowrap; height: 1px; width: 1px; overflow: hidden; } .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; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } .sticky { padding-bottom: 2px; } .entry-title .fa-thumb-tack { padding-right: 5px; } .gallery-caption { font-size: 16px; font-weight: 700; } .bypostauthor { font-size: 14px; color: #555; } .center { text-align: center; } /** ==================================================================== Page ==================================================================== */ main .content-inner { margin: 40px 0; } .page-title h1 { text-align: center; margin-top: 50px; } /** ==================================================================== Blog ==================================================================== */ .style1 #blog-section { margin: 70px 0; } .style2 #blog-section { margin-top: 150px; margin-bottom: 70px; } .blog article { width: 50%; vertical-align: top; display: inline-block; padding: 10px; } article .meta-wrapper .meta { margin-top: 15px; } article .meta-item { padding-right: 30px; font-size: 13px; } article .read-more { margin-bottom: 80px; } .meta-item i { padding-right: 5px; } article h3 { margin: 5px; } article h3 a { display: inline-block; word-break: break-word; -ms-word-wrap: break-word; } .blog-post .meta { margin-top: 5px; } article .read-more a { padding: 16px 40px; color: #fff; font-size: 12px; border-radius: 0; background: #bc2a26; } aside.widget { margin-bottom: 50px; } .blog h4.widget-title, .search h4.widget-title, .archive h4.widget-title, .single h4.widget-title { border-bottom: 3px dotted #000; padding-bottom: 10px; } aside ul { list-style-type: none; margin-left: 0; } aside li { vertical-align: top; margin-bottom: 20px; } .blog aside li { border-bottom: 1px solid #e4e4e4; padding-bottom: 10px; } aside li.mini_cart_item { padding-left: 30px !important; } .comment-meta img { border-radius: 45px; } .comment-content p { font-size: 13px; } .single nav.post-navigation { border-top: 1px solid #ececec; padding: 10px; margin-bottom: 70px; margin-top: 50px; border-bottom: 1px solid #ececec; } .post-navigation h2 { display: none; } .nav-previous, .nav-links .nav-next { width: 50%; display: inline-block; vertical-align: top; } .nav-links .nav-previous .meta-nav:before { content: "\f060"; font-family: 'Font Awesome 5 Free'; font-weight: 700; padding-right: 5px; } .nav-links .nav-next .meta-nav:after { content: "\f061"; font-family: 'Font Awesome 5 Free'; font-weight: 700; padding-left: 5px; } .nav-links .nav-next { text-align: right; } article .blog-wrapper { border-bottom: 1px solid #dedede; } .blog-wrapper .meta .share i { padding: 0 7px; } article.sticky .meta .share i { padding: 0 12px; } input#wp-comment-cookies-consent { margin-right: 10px; } .blog-widget article { margin-bottom: 50px; } .archive article { width: 33%; display: inline-block; padding: 10px; vertical-align: top; margin-bottom: 50px; } .archive article.product{ width: 100%; } .archive article .meta span { display: block; } .archive article .meta { background: #f9f9f9; padding: 15px; } .archive article .meta .meta-item { font-size: 12px; padding: 4px; } /* Single post */ .single .title, .single .content { width: 65%; margin: 0 auto; } .single .blog-post .meta, .single .blog-post .post-tags { width: 65%; margin: 0 auto; text-align: center; } .single .blog-post .post-tags { padding-bottom: 30px; } .single .blog-post .meta { padding-top: 30px; padding-bottom: 30px; } .single h1.entry-title { text-align: center; margin: 0; } .single .image { text-align: center; margin-bottom: 50px; } .single .nav-links { padding: 25px; font-size: 13px; } .single .nav-links .meta-nav { font-size: 13px; } .single ul.post-categories { display: inline-block; margin-left: 5px; } .single ul.post-categories li { display: inline; } .single ul.post-categories li a { background: #efefef; padding: 5px 15px; border-radius: 45px; margin-right: 5px; margin-bottom: 10px; } .single .content p { font-size: 15px; line-height: 1.8; } .single .post-categories { text-align: center; } .single .post-tags a { padding: 0px 8px; border: 1px solid #c5c5c5; background: none; } .single.single-right-sidebar .title, .single.single-right-sidebar .content, .single.single-left-sidebar .title, .single.single-left-sidebar .content { width: 90%; } /** ==================================================================== Pagination ==================================================================== */ .pagination { padding-left: 15px; width: 100%; margin-bottom: 40px; } .pagination .nav-links .page-numbers { border: 0; height: 40px; width: 60px; text-align: center; padding: 0; font-size: 12px; margin-right: 15px; } .pagination .nav-links .current { font-weight: 700; font-size: 15px; padding: 6px 14px; color: #fff; } .pagination .nav-links a { padding: 5px 25px; } /** ==================================================================== Search ==================================================================== */ .style1 .searchpage { margin: 70px 0; } .style2 .searchpage { margin: 150px 0; } form.searchform input#searchsubmit, form.searchform label.search-icon { display: none; } .searchpage .content-area article { margin: 50px 0; } .searchpage .content-area article h3 { margin: 15px 0; } .search-content h1 { margin-bottom: 20px; padding: 0; } form.searchformmenu input.searchsubmitmenu, form.searchformmenu label.search-icon { display: none; } .searchpage .entry-footer span { margin: 10px 0; } .searchpage .entry-footer span a { color: #fff; } .search .entry-summary { margin: 30px 0; } .searchpage .entry-footer .cat-links, .searchpage .entry-footer .comments-link, .searchpage .entry-footer .tags-links { background: #bc2a26; color: #fff; padding: 5px 20px; border-radius: 45px; display: inline-block; font-size: 11px; } .searchpage .entry-footer .cat-links, .searchpage .entry-footer .tags-links { margin-right: 10px; } #search-box .blog-search{ z-index: 99; position: relative; background: #fff; } /** ==================================================================== Comments ==================================================================== */ .single #comments { width: 65%; margin: 0 auto; padding-top: 80px; } .single.single-right-sidebar #comments, .single.single-left-sidebar #comments { width: 90%; } ol.comment-list { margin-top: 30px; list-style-type: none; margin-left: 0; } ol.children { list-style-type: none; } .comment-metadata { margin: 10px 0; padding: 0px 70px; border-radius: 45px; } #respond { margin-top: 50px; } .comment-meta .reply { margin: 10px 0; float: right; } .post-tags { margin: 70px 0 10px 0; } .post-tags a { background: #efefef; padding: 5px 15px; border-radius: 45px; margin-right: 5px; margin-bottom: 10px; } .post-tags a:hover { background: #d4d1d1; color: inherit; } .comment-meta b.fn { display: block; margin-left: 70px; margin-top: -50px; } .comment-meta span.says { margin-left: 70px; } #respond h3#reply-title { margin-bottom: 5px; } .children .comment { padding-left: 50px; } .comment-metadata time:before { content: "\f017"; display: inline-block; vertical-align: middle; font-size: 14px; font-family: 'Font Awesome 5 Free'; font-weight: 700; padding-right: 5px; } /** ==================================================================== Contact Us ==================================================================== */ form.wpcf7-form { width: 100%; margin: auto; } form.wpcf7-form label { display: block; } form.wpcf7-form input[type="submit"] { border: 0; margin-top: 35px; color: #fff; padding: 16px 40px; transition: all 0.3s ease-in-out; outline: 0 !important; -webkit-appearance: none; } div.wpcf7 .ajax-loader { margin-left: 20px; } div.wpcf7-mail-sent-ng { text-align: center; border: 0; color: #ff0000; } div.wpcf7-mail-sent-ok { text-align: center; border: 0; color: #408e1e; } span.wpcf7-not-valid-tip { display: none; } input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-bottom: 1px solid #ff0000; transition: all 0.3s ease-in-out; } /** ==================================================================== Footer ==================================================================== */ .footer-widgets-wrapper h4 { padding: 0; } .footer-widgets-wrapper li { padding: 5px 0; } .footer-widgets-wrapper li a { border-bottom: 2px dotted #dadada; } footer .social { color: #555; } footer .social-icons .s-icon a { color: #555; } footer .social-icons .s-icon { padding: 5px; } footer .social-icons i { text-align: center; font-size: 16px; width: 45px; height: 45px; padding: 12px; border-radius: 50%; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } footer ul li { padding: 5px 0; } footer .social-icons i:hover { color: #fff; background: #000; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } footer .copyrights { margin-bottom: 30px; text-align: center; margin-top: 20px; } footer .footer-inner { text-align: center; } footer .footer-inner .icon i { font-size: 40px; } footer .social { margin-top: -15px; } .footer-widgets-wrapper ul { list-style-type: none; margin-left: 0; } .footer-widgets-wrapper .widget-column { margin-bottom: 50px; } /** ==================================================================== Social menu ==================================================================== */ #menu-social-menu li a { border: 1px solid #d4d4d4; padding: 15px; } #menu-social-menu li a .social-menu-wrap { display: none; } #menu-social-menu li a::before { display: block; font-size: 18px; text-align: center; width: 37px; line-height: 37px; font-family: 'Font Awesome 5 Brands'; color: inherit; } #menu-social-menu li a[href*="facebook.com"]::before { content: "\f09a"; color: #3b5998; transition: 0.5s; } #menu-social-menu li a[href*="facebook.com"]:hover::before { background: #3b5998; color: #fff; transition: 0.5s; } #menu-social-menu li a[href*="twitter.com"]::before { content: "\f099"; color: #1da1f2; transition: 0.5s; } #menu-social-menu li a[href*="twitter.com"]:hover::before { background: #1da1f2; color: #fff; transition: 0.5s; } #menu-social-menu li a[href*="instagram.com"]::before { content: "\f16d"; color: #df2176; transition: 0.5s; } #menu-social-menu li a[href*="instagram.com"]:hover::before { background: #df2176; color: #fff; transition: 0.5s; } #menu-social-menu li a[href*="linkedin.com"]::before { content: "\f0e1"; color: #0078bb; transition: 0.5s; } #menu-social-menu li a[href*="linkedin.com"]:hover::before { background: #0078bb; color: #fff; transition: 0.5s; } #menu-social-menu li a[href*="pinterest.com"]::before { content: "\f231"; color: #cc0000; transition: 0.5s; } #menu-social-menu li a[href*="pinterest.com"]:hover::before { background: #cc0000; color: #fff; transition: 0.5s; } #menu-social-menu li a[href*="behance.net"]::before { content: "\f1b4"; color: #4465ff; transition: 0.5s; } #menu-social-menu li a[href*="behance.net"]:hover::before { background: #4465ff; color: #fff; transition: 0.5s; } #menu-social-menu li a[href*="github.com"]::before { content: "\f09b"; color: #000; transition: 0.5s; } #menu-social-menu li a[href*="github.com"]:hover::before { background: #000; color: #fff; transition: 0.5s; } #menu-social-menu li a[href*="youtube.com"]::before { content: "\f167"; color: #f40a; transition: 0.5s; } #menu-social-menu li a[href*="youtube.com"]:hover::before { background: #f40a; color: #fff; transition: 0.5s; } #menu-social-menu li { padding: 0; display: inline-block; margin: 4px; } .collapse:not(.show) { display: block; } /** ==================================================================== Buttons ==================================================================== */ .btn { padding: 6px 25px; } button, input[type="submit"], input[type="reset"] { color: #fff; cursor: pointer; font-size: 12px; padding: 16px 40px; border: none; background: #bc2a26; } .btn-default { color: #fff; } .btn-default:focus { border: none; color: #fff; } .btn-default:hover { border: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /*-- link buttons --*/ a.trans { outline: 0 !important; -webkit-appearance: none; transition: all 0.3s ease-in-out; } /*-- button up --*/ .btntoTop { width: 30px; height: 30px; position: fixed; bottom: 50px; right: 30px; border: 1px solid #000; text-align: center; line-height: 25px; cursor: pointer; opacity: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btntoTop:before { content: "\f106"; display: inline-block; vertical-align: middle; font-size: 20px; font-family: 'Font Awesome 5 Free'; font-weight: 700; } .btntoTop.active { opacity: 1; } .btntoTop.active:hover { opacity: 0.8; background: #bc2a26; border: 1px solid #bc2a26; color: #fff; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /** ==================================================================== Page Title ==================================================================== */ .title.content-section { background: #f5f5f5; } .section-title.page-title { padding: 20px 5px 60px 5px; } .section-title h1 { color: #555; margin: 0; padding: 0; } /** ==================================================================== 404 Page ==================================================================== */ .error404 .style1 .content-inner { margin: 70px 0; } .error404 .style2 .content-inner { margin: 150px 0; } .page-content-area h1.page-error { margin-bottom: 20px; padding-top: 0; } .error404 .page-content-area form { margin-top: 50px; } /** ==================================================================== Top Bar ==================================================================== */ .top-bar { background: #000; color: #fff; padding: 8px 0; font-size: 14px; font-weight: 500; text-transform: uppercase; } .top-bar .date-time { text-align: right; } .top-social ul { display: inline-block; } ul.top-social { display: inline-block; margin-left: 20px; } .top-social li { display: inline-block; padding-right: 10px; } .top-social li i { color: #fff; } /** ==================================================================== Logo ==================================================================== */ .header-wrapper .logo { text-align: center; padding: 15px; } .header-wrapper .logo h1 { margin: 0; } /** ==================================================================== Navigation ==================================================================== */ .top-menu-wrapper { border-top: 2px solid #e0e0e0; border-bottom: 2px solid #e0e0e0; } #menu-primary { list-style-type: none; } .top-menu { position: relative; text-align: center; } .top-menu .navbar-collapse { padding: 0; } .top-menu .navigation { position: relative; margin: 0; } .top-menu .navigation > li { position: relative; display: inline-block; padding: 0; } .top-menu .navigation > li > a { position: relative; display: block; line-height: 30px; padding: 12px 24px; font-size: 14px; color: #3c3c3c; font-weight: 600; opacity: 1; letter-spacing: 1px; text-transform: uppercase; } .top-menu .navigation > li > a:hover::before, .top-menu .navigation > li.current > a:before { left: 0px; right: 0px; } .top-menu .navigation > li > a:before { content: ""; position: absolute; background: #bc2a26; height: 3px; z-index: -1; left: 50%; right: 50%; bottom: 0; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .dropdown-menu { padding: 0; border-radius: 0; } .dropdown-menu span.caret{ display: none; } .header-upper .top-menu .navigation > li:hover > a, .header-upper .top-menu .navigation > li:focus > a, .header-upper .top-menu .navigation > li.current > a, .header-upper .top-menu .navigation > li.current-menu-item > a { color: #e73f43; opacity: 1; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } .top-menu .navigation > li:hover > a:after, .top-menu .navigation > li:focus > a:after { opacity: 1; } .top-menu .navigation > li > ul { z-index: 100; display: none; position: absolute; left: 0px; width: 240px; padding: 0px 0px; background: #101010; border: 0; border-radius: 5px; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } .top-menu .navigation .dropdown:hover > ul, .top-menu .navigation .dropdown:focus-within > ul { display: block; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } .top-menu .navigation > li > ul.from-right { left: auto; right: 0px; } .top-menu .navigation > li > ul > li { position: relative; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.10); } .top-menu .navigation > li > ul > li:last-child { border-bottom: none; } .top-menu .navigation > li > ul > li > a { position: relative; display: block; font-size: 12px; color: #fff; background: #0f0f0f; text-align: left; padding: 15px 20px; line-height: 22px; font-weight: 500; } .top-menu .navigation > li > ul > li:hover > a, .dropdown-menu > li > a:focus { color: #fff; background-color: #bc2a26; } .top-menu .navigation > li > ul > li.dropdown > a:after { font-family: 'Font Awesome 5 Free'; font-weight: 700; content: "\f105"; position: absolute; right: 10px; top: 12px; width: 10px; height: 20px; line-height: 21px; font-size: 16px; text-align: center; z-index: 5; display: block; } .top-menu .navigation > li > ul > li.dropdown:hover > a:after { color: #fff; } .top-menu .navigation > li > ul > li > ul { position: absolute; left: 100%; top: 20px; width: 240px; z-index: 100; display: none; background: #101010; } .top-menu .navigation > li > ul > li > ul > li { position: relative; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.10); } .top-menu .navigation > li > ul > li > ul > li:last-child{ border-bottom: none; } .top-menu .navigation > li > ul > li > ul > li > a { position: relative; display: block; padding: 12px 20px; line-height: 22px; font-weight: 500; font-size: 12px; color: #e0e0e0; text-align: left; } .top-menu .navigation > li > ul > li > ul > li > a:hover { color: #fff; background-color: #bc2a26; } .top-menu .navigation > li.dropdown:hover > ul, .top-menu .navigation > li.dropdown:focus-within > ul { opacity: 1; top: 100%; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } .top-menu .navigation li > ul > li.dropdown:hover > ul, .top-menu .navigation li > ul > li.dropdown:focus-within > ul { visibility: visible; opacity: 1; top: 0px; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } .top-menu .navigation > li > ul { /*border: none !important;*/ } .top-menu .navigation li.dropdown .dropdown-btn { position: absolute; right: 10px; top: 6px; width: 34px; height: 30px; border: 1px solid #ffffff; text-align: center; font-size: 16px; line-height: 26px; color: #fff; cursor: pointer; z-index: 5; display: none; } .main-header .header-lower { position: relative; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; } .main-header .top-menu-wrapper { position: relative; } .main-header .outer-box { position: absolute; right: 0px; top: 0px; } /** ==================================================================== Trending News ==================================================================== */ .trending-news { padding-top: 15px; padding-bottom: 15px; border-bottom: 2px solid #f3f3f3; } .home .trending-news { border-bottom: 0; } .single .trending-news { border-bottom: 1px solid #e0e0e0; } .breaking-news-title { display: inline-block; font-weight: 500; color: #fff; background: #bc2a26; margin-right: 7px; padding: 7px 15px; font-size: 14px; } .trending-content { list-style: none; padding: 0; margin: 0; display: inline-block; } .left-sidebar .trending-content, .right-sidebar .trending-content { width: 86% !important; } .both-sidebars .trending-content { width: 87% !important; } .trending-content.owl-theme .owl-nav [class*='owl-']{ margin: 5px; } .trending-content.owl-carousel.owl-loaded{ float: right; } .trending-content .owl-stage-outer { width: 100%; } .trending-content.owl-theme .owl-nav{ margin-top: -20px !important; z-index: 99; position: relative; } .owl-theme .owl-nav [class*='owl-']:hover { background: none !important; color: #555 !important; } .trending-content .item { padding-top: 10px; } .trending-content .item a:hover{ color: #bc2a26; } .trending-content p { margin: 0; } .trending-content-marq { list-style: none; padding: 0; margin: 0; float: right; padding: 10px 15px; } .left-sidebar .trending-content-marq, .right-sidebar .trending-content-marq { width: 88%; } .both-sidebars .trending-content-marq { width: 87%; } .right-sidebar .trending-content-marq, .left-sidebar .trending-content-marq, .no-sidebar .trending-content-marq { width: 86%; } .trending-content-marq a { font-size: 14px; color: #000; } .trending-content .owl-nav { float: right; } /* marquee */ span.post-break { font-weight: 900; color: #000; padding: 0 10px; } .trending-news-content a:last-child span.post-break{ display: none; } .trending-content-marq a:hover { color: #bc2a26; } /** ==================================================================== Highlight Area 3 Columns ==================================================================== */ .highlight-area-content { position: relative; background-size: cover !important; background-position: center; transition: all 0.5s ease; } .highlight-area-content .content-wrapper:before { position: absolute; content: ''; left: 0px; top: 0px; width: 100%; height: 100%; display: block; background-color: rgba(0,0,0,0.20); } .highlight-area-content .content-wrapper { position: relative; text-align: center; color: #fff; padding: 150px 70px; height: 500px; -webkit-font-smoothing: antialiased; } .highlight-area-content ul.post-categories { list-style-type: none; } .highlight-area-wrapper .col-md-4 { padding-left: 5px; padding-right: 5px; } .highlight-area-wrapper .row { margin-right: 0px !important; margin-left: 0px !important; } .highlight-area-wrapper .col-md-4:first-child { padding-left: 0; } .highlight-area-wrapper .col-md-4:last-child { padding-right: 0; } .highlight-area-content .title h3 a { color: #fff; position: relative; font-size: 24px; } .highlight-area-content .meta { font-size: 14px; color: #fff; position: relative; } .highlight-area-content .meta .author a { font-size: 14px; color: #fff; position: relative; } .highlight-area-content .category .post-categories a { color: #fff; position: relative; text-transform: uppercase; } .section-hightlight-area-box { overflow: hidden; margin-bottom: 10px; } .section-hightlight-area-box .highlight-area-content::before { content: ""; position: absolute; top:0;right:0;bottom:0;left:0; background: inherit; transition: inherit; } .section-hightlight-area-box .highlight-area-content:hover::before { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .section-hightlight-area-box.highlight-area-content .content { position: relative; } /** ==================================================================== Featured Posts ==================================================================== */ .featured-category-post { clear: both; width: 49%; margin-bottom: 18px; display: inline-block; } .col-left.widget-area .featured-category-post, .col-right.widget-area .featured-category-post { width: 100%; } .featured-category-post:nth-of-type(odd) { float: right; } .featured-posts-lists-wrapper { margin-bottom: 30px; } .featured-area-content { position: relative; background-size: cover !important; background-position: center; transition: all 0.5s ease; } .featured-category-post .content-wrapper { clear: both; color: #fff; height: 400px; padding: 30px; vertical-align: bottom; display: table-cell; -webkit-font-smoothing: antialiased; } .col-left.widget-area .featured-category-post:first-child .content-wrapper, .col-right.widget-area .featured-category-post:first-child .content-wrapper { clear: both; position: relative; color: #fff; height: 400px; padding: 30px; vertical-align: bottom; display: table-cell; -webkit-font-smoothing: antialiased; } .featured-category-post:first-child { width: 100%; display: block; margin-bottom: 18px; } .featured-category-post:first-child .content-wrapper { height: 500px; display: inherit !important; padding: 0; } .col-left.widget-area .featured-category-post:first-child .content-wrapper, .col-right.widget-area .featured-category-post:first-child .content-wrapper { height: auto; display: inherit !important; } .featured-category-post:first-child .content-wrapper .content { background: #bc2a26; width: 35%; height: 500px; position: absolute; top: 0; right: 0; padding: 70px 20px; } .col-left.widget-area .featured-category-post:first-child .content-wrapper .content, .col-right.widget-area .featured-category-post:first-child .content-wrapper .content { background:none; width: 100%; height: auto; position: relative; padding: 0; } .featured-category-post:first-child .content h3 a { font-weight: 500; line-height: 1.7; padding-left: 15px; border-left: 2px solid #ffffff59; } .col-left.widget-area .featured-category-post:first-child .content h3 a, .col-right.widget-area .featured-category-post:first-child .content h3 a { padding-left: 0; border-left: 0; } .featured-category-post:first-child .content .meta { padding: 20px 0; } .featured-category-post:first-child .content .read-more { display: block; } .featured-category-post:first-child .content .read-more a { color: #fff; position: relative; font-size: 13px; font-weight: 500; margin: 30px 0px; } .featured-category-post:first-child .content-wrapper:before { position: relative; background: none; } .col-left.widget-area .featured-category-post:first-child .content-wrapper:before, .col-right.widget-area .featured-category-post:first-child .content-wrapper:before { position: absolute; background: linear-gradient(to top,rgba(0, 0, 0, 0.9),rgba(0,0,0,0.3), transparent); } .featured-category-post .content-wrapper:before { position: absolute; content: ''; left: 0px; top: 0px; width: 100%; height: 100%; display: block; background: linear-gradient(to top,rgba(0, 0, 0, 0.9),rgba(0,0,0,0.3), transparent); } .featured-area-content .title h3 a, .featured-area-content .meta a, .featured-area-content span { color: #fff; position: relative; } .featured-area-content .category .post-categories a { color: #fff; position: relative; text-transform: uppercase; } .featured-area-content .title h3 { margin: 0; } .featured-area-content .title h3 a { font-size: 22px; font-weight: 600; } .featured-category-post .content .read-more { display: none; } .section-featured-area-box { overflow: hidden; } .featured-category-post .featured-area-content::before { content:""; position:absolute; top:0;right:0;bottom:0;left:0; background:inherit; transition:inherit; } .featured-category-post .featured-area-content:hover::before { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .featured-category-post .featured-area-content .content { position: relative; } .featured-posts-wrapper h2 { padding: 0; } /** ==================================================================== Posts Layout 1 ==================================================================== */ .posts-layout-1-wrapper { margin-top: 30px; margin-bottom: 30px; } .layout-1-category-post { clear: both; width: 49%; margin-bottom: 30px; display: inline-block; vertical-align: top; } .layout-1-area-content { position: relative; background-size: cover !important; background-position: center; transition: all 0.5s ease; } .layout-1-category-post .content-wrapper { clear: both; position: relative; color: #555; padding: 0 10px; vertical-align: bottom; display: table-cell; -webkit-font-smoothing: antialiased; } .layout-1-category-post:first-child { width: 100%; display: block; margin-bottom: 30px; } .layout-1-category-post:first-child .content-wrapper { display: inherit !important; padding: 0; padding-left: 20px; } .layout-1-category-post:first-child .content h3 a { font-weight: 700; line-height: 1.3; } .layout-1-category-post:first-child .content .meta { padding: 7px 0; font-weight: 600; font-style: italic; } .layout-1-category-post:first-child .content .read-more { display: block; } .layout-1-category-post:first-child .content .post-categories a { font-size: 11px; color: #fff; position: relative; text-transform: uppercase; background: #bc2a26; padding: 3px 10px; border-radius: 45px; font-weight: 500; } .layout-1-category-post:first-child .content .read-more a { color: #555; position: relative; font-size: 13px; font-weight: 500; margin: 30px 0px; } .layout-1-area-content .title h3 a, .layout-1-area-content .meta a, .layout-1-area-content span { color: #abaaaa; position: relative; } .layout-1-area-content .category .post-categories a { color: #bc2a26; position: relative; text-transform: uppercase; font-weight: 500; } .layout-1-area-content .title h3 { margin: 0; padding: 0; } .layout-1-category-post:first-child h3 { padding-top: 15px; } .layout-1-area-content .title h3 a { font-size: 18px; font-weight: 500; color: #000; } .layout-1-category-post .content .read-more { display: none; } .section-layout-1-area-box { overflow: hidden; } .layout-1-category-post .layout-1-area-content:hover::before { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .layout-1-category-post .layout-1-area-content .content { position: relative; } .section-layout-1-area-box .col-first { width: 30%; display: inline-block; } .layout-1-category-post:first-child .col-first { width: 58%; } .section-layout-1-area-box .col-second { width: 68%; display: inline-block; vertical-align: top; } .layout-1-category-post:first-child .col-second { width: 41%; } .section-layout-1-area-box .layout-1-post-image { display: inline-block; overflow: hidden; } .section-layout-1-area-box .layout-1-post-image img { transition: all 0.5s ease; vertical-align: middle; } .section-layout-1-area-box .layout-1-post-image img:hover { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); transition: all 0.5s ease; } /* For 3 columns */ .both-sidebars .container .col-left, .both-sidebars .container .col-right { width: 24%; display: inline-block; vertical-align: top; } .both-sidebars .container .col-middle { width: 50%; display: inline-block; vertical-align: top; } .both-sidebars .container .col-left { padding-right: 25px; float: left; } .both-sidebars .container .col-right { padding-left: 25px; float: right; } /** ==================================================================== Latest Posts Widget ==================================================================== */ .section-latest-posts-area-box .col-first { width: 30%; display: inline-block; vertical-align: top; } .section-latest-posts-area-box .col-second { width: 68%; display: inline-block; vertical-align: top; padding-left: 15px; } .section-latest-posts-area-box .content h6 { padding: 0; margin-bottom: 0; } .section-latest-posts-area-box .content .meta { font-size: 12px; font-weight: 600; } .latest-posts-content .latest-category-post { margin-bottom: 20px; } .section-latest-posts-area-box { overflow: hidden; } .section-latest-posts-area-box .latest-post-image { display: inline-block; overflow: hidden; } .section-latest-posts-area-box .latest-post-image img { transition: all 0.5s ease; vertical-align: middle; } .section-latest-posts-area-box .latest-post-image img:hover { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); transition: all 0.5s ease; } .section-latest-posts-area-box .content h6 a:hover { color: #bc2a26; } /** ==================================================================== Top Categories Widget ==================================================================== */ .top-categories-content li { padding-left: 0; border-left: 0; } /** ==================================================================== Toggle button ==================================================================== */ .top-menu .menu-header { position: absolute; right: 0px; top: -75px; z-index: 12; display: none; } .top-menu .menu-header button { position: relative; display: block; height: 36px; width: 42px; background: none; color: #7f7f7f; text-align: center; font-size: 20px; line-height: 36px; border: 1px solid #a0a0a0; font-weight: normal; } .top-menu .navbar-toggle .icon-bar { background: #555; } /** ==================================================================== Left Popup Sidebar ==================================================================== */ .hd-bar { position: fixed; top: 0; width: 100%; height: 100%; background: #000; z-index: 9999; } .hd-bar .mCSB_inside > .mCSB_container { margin-right: 0; } .hd-bar.left-align { left: -400px; } .hd-bar.left-align.visible-sidebar { left: 0px; } .hd-bar.left-align { left: -100%; } .hd-bar.left-align.visible-sidebar { left: 0%; display: none; } .hd-bar .hd-bar-closer { width: 40px; height: 40px; position: absolute; right: 80px; top: 5px; background: none; color: #ffffff; border-radius: 0px; text-align: center; line-height: 40px; z-index: 999999; } .admin-bar .hd-bar .hd-bar-closer { top: 40px; } .hd-bar .hd-bar-closer button { background: none; display: block; font-size: 20px; color: #656565; width: 40px; height: 40px; line-height: 40px; } .hd-bar .hd-bar-closer:hover button { color: #ffffff; } .hd-bar-wrapper { height: 100%; padding: 45px 30px 40px; padding-right: 0; } .hd-bar-wrapper .mCustomScrollBox { overflow: visible; } .hd-bar .side-menu { background-color: transparent; padding: 0; font-size: 13px; text-align: center; padding-right: 40px; } .hd-bar .side-menu ul li ul a { background: transparent; } .hd-bar .side-menu ul li ul li ul li a { background: transparent; text-transform: uppercase; padding-left: 22px; font-size: 13px; color: rgba(255,255,255,0.50); } .hd-bar .side-menu a.current { color: #c5a47e; } .hd-bar .side-menu li.current > a { color: #c5a47e; } .hd-bar .side-menu ul { margin-top: 50px; } .hd-bar .side-menu ul li { position: relative; display: block; border-bottom: 1px solid rgba(255,255,255,0.15); } .hd-bar .side-menu ul .dropdown:focus-within > ul { display: block !important; } .hd-bar .side-menu > ul > li > ul { background-color: #2a2a2a; } .hd-bar .side-menu ul.navigation > li > ul > li { margin-left: 50px; } .hd-bar .side-menu ul.navigation > li > ul > li ul { margin-left: 50px; } .hd-bar .side-menu ul.navigation > li > ul > li:first-child { border-top: 1px solid rgba(255,255,255,0.15); } .hd-bar .side-menu ul.navigation > li > ul > li:last-child { border-bottom: none; } .hd-bar .side-menu ul li a { background: transparent; color: #ffffff; display: inline-block; font-weight: 400; text-transform: uppercase; padding: 12px 15px 12px 15px; position: relative; cursor: pointer; line-height: 24px; font-size: 12px; letter-spacing: 1px; width: 100%; text-align: left; } .hd-bar .side-menu ul.navigation > li > ul > li > a { text-transform: uppercase; padding-left: 22px; font-size: 12px; color: rgba(255,255,255,0.50); } .hd-bar .side-menu ul.navigation > li > ul > li.dropdown > a { padding-left: 22px; } .hd-bar .side-menu ul.navigation > li > ul > li.dropdown { width: auto; } .hd-bar .side-menu ul li a:hover, .hd-bar .side-menu ul > li.current > a, .hd-bar .side-menu ul > li > ul > li.current > a, .hd-bar .side-menu ul.navigation > li > ul > li > a:hover, .hd-bar .side-menu ul.navigation > li.active > a { color: #bc2a26; } .hd-bar .side-menu ul li.dropdown .fas { position: absolute; z-index: 99; width: 60px; right: 0; top: 0; line-height: 50px; border-left: 1px solid rgba(130, 130, 130, 0.58); color: #ffffff; font-size: 18px; text-align: center; cursor: pointer; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .qb-close-button:before { content: "\f00d"; font-family: 'Font Awesome 5 Free'; font-weight: 700; padding-right: 5px; } .side-navigation .navigation .dropdown-menu { position:relative; z-index: 1; display: block; float: none; min-width: 100%; padding: 5px 0; margin: 2px 0 0; font-size: 14px; text-align: center; list-style: none; background-color: transparent; -webkit-background-clip: padding-box; background-clip: padding-box; border: none; border-radius: 1px; -webkit-box-shadow: none; box-shadow: none; } #navbar-collapse-2 .navigation li.dropdown .fas { display: none; position: absolute; z-index: 99; width: 60px; right: 0; top: 0; line-height: 50px; border-left: 1px solid rgba(255, 255, 255, 0.13); color: #b3b3b9; font-size: 18px; text-align: center; cursor: pointer; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .side-navigation .navigation .dropdown-menu{ margin-right: 50px; } #navbar-collapse-2 .navigation li a span.caret { display: none; } .hd-bar .side-menu ul li:last-child { border-bottom: none; } /** ==================================================================== Footer Menu ==================================================================== */ .footer-menu .dropdown-menu { display: block; position: relative; box-shadow: none; border: none; float: none; z-index: 0; } .footer-menu .dropdown-menu > li > a { padding: 0; padding: 3px 0; } .footer-menu ul>li>a { font-size: 20px; font-weight: 600; margin-bottom: 10px; font-family: 'Spectral', serif; border-bottom: 2px dotted #dadada; pointer-events: none; cursor: default; text-decoration: none } .footer-menu ul>li { display: inline-block; vertical-align: top; } .footer-menu ul>li ul>li { display: block; } .footer-menu ul>li ul>li>a { font-weight: inherit; font-size: 13px; margin-bottom: 0; font-family:inherit; pointer-events: inherit; cursor: pointer; text-decoration: inherit; } .footer-menu ul>li { width: 24%; } .footer-menu .dropdown-menu > li > a:hover, .footer-menu .dropdown-menu > li > a:focus { background: none; color: #bc2a26; } footer .dropdown-menu { background-color: transparent; } footer ul.navigation { margin-bottom: 50px; } /** ==================================================================== Search Overlay ==================================================================== */ .search-btn { background: #fff; color: #3c3c3c; border: none; padding: 10px 15px; font-size: 16px; cursor: pointer; } .search-btn:hover { background: #bc2a26; color: #fff; } .overlay { height: 100%; width: 100%; display: none; position: fixed; z-index: 9; top: 0; left: 0; background-color: rgb(0,0,0); background-color: rgba(0,0,0, 0.9); } .overlay-content { position: relative; top: 46%; width: 80%; text-align: center; margin-top: 30px; margin: auto; } .overlay .search-closebtn { position: absolute; top: 20px; right: 45px; font-size: 35px; cursor: pointer; color: white; } .overlay .search-closebtn:hover { color: #ccc; } .overlay input[type=text] { padding: 15px; font-size: 17px; border: none; float: none; width: 75%; background: white; } .overlay input[type=text]:hover { background: #f1f1f1; } .overlay .overlay-content label { padding-bottom: 10px; color: #fff; } .overlay button { float: left; width: 5%; padding: 15px; background: none; font-size: 17px; border: none; cursor: pointer; } .overlay button:hover { background: none; } /** ==================================================================== Skip Links ==================================================================== */ .skip-link { background: #fff !important; color: #555 !important; box-shadow: none !important; border: 1px solid #555 !important; } .skip-link:hover { background: #bc2a26 !important; color: #fff !important; box-shadow: none !important; border: 1px solid #bc2a26 !important; } ::-moz-selection { background-color: #bfdcea; } ::selection { background-color: #bfdcea; } /** ==================================================================== Extra CSS ==================================================================== */ input[type="radio"],input[type="radio"]:hover { -webkit-appearance: radio; } input[type="checkbox"],input[type="checkbox"]:hover { -webkit-appearance: checkbox; } h1.main-title { padding: 0; } .single.theme-installer-active .title, .single.theme-installer-active .blog-post .meta, .single.theme-installer-active .content, .single.theme-installer-active #comments{ width: 100%; }