/*! Theme Name: Ariele Lite Theme URI: http://www.roughpixels.com/free-themes/ariele-lite/ Author: Rough Pixels Author URI: https://www.roughpixels.com Description: Ariele Lite is designed for bloggers who are deeply enthusiastic when writing. Whether it's for the purist blogger or websites that are editorial-based, we put emphasis on your writing. You will be in company with other elite blog sites when you begin to build with Ariele Lite, especially if you take advantage of the Gutenberg block editor! If you absolutely need a theme designed specifically with that in mind, Ariele Lite is the perfect blogging theme for you! Enjoy unlimited colour options, multiple blog layouts, a bonus Recent Posts widget with thubnails, live previews using the built-in theme customizer, and a whole lot more! Version: 1.0.8 Requires PHP: 5.6.0 Tested up to: 5.4.2 Text Domain: ariele-lite Tags: blog, news, block-styles, wide-blocks, editor-style, grid-layout, theme-options, custom-background, custom-logo, custom-menu, featured-images, right-sidebar, left-sidebar, footer-widgets, custom-colors, translation-ready License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Ariele (C) 2018-2020 www.roughpixels.com */ /*-------------------------------------------------------------- # Normalize Normalizing styles have been helped along thanks to the fine work of Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/ --------------------------------------------------------------*/ button, hr, input { overflow: visible } progress, sub, sup { vertical-align: baseline } [type=checkbox], [type=radio], legend { box-sizing: border-box; padding: 0 } html { line-height: 1.15; -webkit-text-size-adjust: 100% } body { margin: 0 } h1 { font-size: 2em; margin: .67em 0 } hr { box-sizing: content-box; height: 0 } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em } a { background: transparent } abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted } b, strong { font-weight: bolder } small { font-size: 80% } sub, sup { font-size: 75%; line-height: 0; position: ariele } sub { bottom: -.25em } sup { top: -.5em } img { border-style: none } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0 } button, select { text-transform: none } [type=button], [type=reset], [type=submit], button { -webkit-appearance: button } [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner { border-style: none; padding: 0 } [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring { outline: ButtonText dotted 1px } fieldset { padding: .35em .75em .625em } legend { color: inherit; display: table; max-width: 100%; white-space: normal } textarea { overflow: auto } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto } [type=search] { -webkit-appearance: textfield; outline-offset: -2px } [type=search]::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit } details { display: block } summary { display: list-item } [hidden], template { display: none } /*-------------------------------------------------------------- # Base --------------------------------------------------------------*/ html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } body { background: #2d2d2d; color: #686868; font-family: Tahoma, Arial, Sans-serif; line-height: 1.6; -ms-word-wrap: break-word; word-wrap: break-word; } html, body { font-size: 80%; } /*-------------------------------------------------------------- # 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: #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; left: 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; } /*-------------------------------------------------------------- # Clearings --------------------------------------------------------------*/ .clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .entry-summary:before, .entry-summary:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after, .primary-menu:before, .primary-menu:after, .social-menu:before, .social-menu:after, .nav-links:before, .nav-links:after { content: ""; display: table; table-layout: fixed; } .clear:after, .entry-content:after, .entry-summary:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after, .primary-menu:after, .social-menu:after, .nav-links:after { clear: both; } /*-------------------------------------------------------------- # Typography --------------------------------------------------------------*/ /* headings */ h1, h2, h3, h4, h5, h6 { clear: both; font-family: 'Poppins', sans-serif; font-weight: 600; line-height: 1.1; margin: 2rem 0 1.5rem; } h4, h5 { margin: 2rem 0 1.125rem; } h1, h2, h3, h4, h5, h6, .entry-title a, .entry-title a:visited { color: #1b1b1b; } h1 { font-size: 2rem; } h2 { font-size: 1.75rem; } h3 { font-size: 1.5rem; } h4 { font-size: 1.25rem; } h5 { font-size: 1.125rem; } h6 { font-size: 1.063rem; } /* other */ p { margin: 0 0 1.75rem; } .text-center { text-align: center; } /* blockquotes */ blockquote { color: #1b1b1b; font-family: Georgia, serif; font-size: 1.5rem; font-weight: 400; line-height: 1.375; margin: 4rem 2rem 3rem; position: relative; z-index: 2; } blockquote::before { content: "\201C"; font-family: "Times new Roman", serif; color: #f5f2ed; color: #fde8e3; font-size: 250px; font-size: calc(1rem + 13vw); font-style: italic; line-height: 0; position: absolute; left: -2.5rem; font-weight: 700; top: 2rem; z-index: -1; } blockquote::after { /*Reset to make sure*/ content: ""; } blockquote p { margin-bottom: 6px; opacity: 0.9; } blockquote p:last-child { margin-bottom: 0; } blockquote a { text-decoration: none; cursor: pointer; padding: 0 3px; } blockquote a:hover { opacity: 0.8; } cite, blockquote cite { font-size: 55%; opacity: 0.65; } blockquote cite { display: block; margin: 1rem 0; } blockquote cite:before { content: "\2014"; font-family: Arial, sans-serif; margin-right: 4px; } blockquote.alignleft, blockquote.alignright { margin-bottom: 0; } blockquote.alignleft, blockquote.alignright { margin-bottom: 0; display: block; width: 100%; } dfn, cite, em, i { font-style: italic; } address { margin-bottom: 1.6rem; } /* links */ a { color: #ef562f; text-decoration: none; } .entry-content p a, .entry-content li a { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; } a:visited { color: #eab5a7; } a:hover, a:focus, a:active { color: #7094d0; } .entry-content p a:focus, .entry-content p a:hover, .entry-content li a:focus, .entry-content li a:hover { text-decoration: none; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } aside a, aside a:visited { color: inherit; } aside a:hover { color: #7094d0; } #footer-sidebars a, #footer-sidebars a:visited { color: #fff; } #footer-sidebars a:focus, #footer-sidebars a:hover { opacity: 0.75; } /* edit link */ ul.entry-footer { list-style: none; margin-left: 0; } .page .edit-link a { background: #1b1b1b; color: #fff; border-radius: 4px; display: inline-block; font-size: 0.75rem; margin: 2rem 0 0; padding: 0.25rem 1rem; text-transform: uppercase; } /*-------------------------------------------------------------- # Lists --------------------------------------------------------------*/ hr { background: #dedede; border: 0; height: 1px; margin: 2rem auto; } hr.spacer { background: transparent; height: 2.5rem; margin: 0; } ul, ol { margin: 0 0 1.75em 1.25em; padding: 0; } ul { list-style: disc; } ol { list-style: decimal; margin-left: 1.5em; } li > ul, li > ol { margin-bottom: 0; } dl { margin: 0 0 1.75em; } dt { font-weight: 700; } dd { margin: 0 1rem 1.75em; line-height: 1.5; } /*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ ::selection { background: #ef562f; color: #fff; } figure { /* Extra wide images within figure tags don't overflow the content area. */ margin: 1em 0; position: relative; } table { border-collapse: collapse; border-spacing: 0; border-bottom: 1px solid #efefef; border-color: #ebebeb; margin: 1rem 0 2rem; text-align: left; width: 100%; } table caption { color: #989898; padding: 0 0 5px 0; width: auto; font-style: italic; text-align: right; font-size: 12px; } thead th { background: #dcdcdc; color: #1b1b1b; } th, td { padding: 6px } th { font-size: 0.875rem; font-weight: bold; letter-spacing: 1.5px; text-transform: uppercase; text-align: left; padding: 9px 12px; border: 1px solid #ebebeb; border-left: none; border-top: none; } tr:nth-child(odd) {} tr th:first-child, tr td:first-child { border-color: #ebebeb; border-left-style: solid; border-left-width: 1px; } tr:first-child th, tr:first-child td { border-color: #ebebeb; border-top-style: solid; border-top-width: 1px; } td { padding: 9px 12px; border: 1px solid #ebebeb; border-left: none; border-top: none; } tr th:first-child, tr td:first-child { border-color: #ebebeb; border-left-style: solid; border-left-width: 1px; } /* code */ var { font-family: Monaco, Consolas; } code { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 1rem; font-size: 0.9375rem; padding: 0 0.5rem; background: #f7f7f7; border: 1px solid #ebebeb; color: #ef562f; } pre { position: relative; padding: 2rem; background: #f7f7f7; word-break: break-all; word-wrap: break-word; white-space: pre-wrap; font-size: 0.938rem; color: #656565; border: 1px solid #c2a68c; border-top-width: 1px; border-bottom-width: 1px; border-left: none; border-right: none; margin: 2rem 0; } pre code { padding: 0; color: #3f3b36; background: transparent; font-size: 1rem; } /* Media element - bootstrap */ .media, .media-body { zoom: 1; overflow: hidden; } .media-body { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 10000px; display: table-cell; vertical-align: top; } .media-heading { margin-top: 0; margin-bottom: 5px; } .media-list { padding-left: 0; list-style: none; } /*-------------------------------------------------------------- # Header --------------------------------------------------------------*/ #topbar { background: #ef562f; min-height: 13px; padding: 8px 0 0; font-size: 0.875rem; color: #fff; margin: 0 auto; text-align: center; } #topbar-left, #topbar-center, #topbar-right { text-align: center; } .topbar-info { padding: 7px 0; } #topbar .social-menu a, #topbar .social-menu a:visited { color: #fff; } #topbar .social-navigation { padding: 3px 0; } #topbar-right form.search-form { width: calc(250px - 45px); margin: 5px auto 15px; } #topbar input.search-field { background: rgba(255, 255, 255, 0.2); border-color: transparent; color: #fff; width: calc(250px - 45px); margin: 0; padding: 5px 45px 5px 10px; } #topbar button.search-submit { background: none; height: 29px; } .sticky-nav { position: fixed; top: 0; width: 100%; } /* need to add the content wrapper top padding + the nav height */ .sticky-nav + #content { padding-top: 98px; } .sticky-nav + #banner-sidebar, .page .sticky-nav + #featured-image-shadow { padding-top: 48px; } #masthead { background: #1b1b1b; padding: 1.5rem 4.5rem 1rem; } #site-branding { padding: 0; text-align: center; } #site-title { font-family: Poppins, sans-serif; font-weight: 700; font-size: 2rem; line-height: 1; margin: 0; text-transform: uppercase; } #site-title a { text-decoration: none; } #site-title a, #site-title a:visited { color: #fff; } #site-title a:focus, #site-title a:hover { opacity: 0.7; } .site-header2 #site-title a, .site-header2 #site-title a:visited { color: #fff; } #site-description { color: #ffffff; font-family: Tahoma, Arial, Sans-serif; font-weight: 400; font-size: 0.75rem; line-height: 15px; letter-spacing: 1px; margin: 0; } /*-------------------------------------------------------------- # Content --------------------------------------------------------------*/ #page { background: #f5f2ed; -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.15); /* padding-top: 2px; */ margin: 0 auto 30px; } .boxed #page { max-width: 1300px; } #content { margin-top: 3rem; margin-bottom: 3rem; } #main { padding: 0; } .template-half #main, .template-about #main { padding: 0 20px; } /*-------------------------------------------------------------- # Footer --------------------------------------------------------------*/ #site-footer { background: #ef562f; color: #fff; padding: 10px 0; font-size: 0.813rem; text-align: center; } .site-info, .site-info a, .site-info a:visited, #site-footer .widget-title { color: #8a8a8a; } .copyright, .footer-social { padding: 0.25rem 0; } /* Scroll To Top */ #scroll-to-top { background-color: #ef562f; bottom: 2rem; display: block; height: 3rem; position: fixed; margin: 0 0 0 0; right: 4rem; width: 3rem; text-align: center; z-index: 9999; } #scroll-to-top-arrow { display: block; height: 3rem; padding: 0.5rem; } #scroll-to-top-arrow i { position: relative; top: 2px; } #scroll-to-top:focus, #scroll-to-top:hover { background-color: #c2a68c; } #scroll-to-top-arrow, #scroll-to-top-arrow:focus, #scroll-to-top-arrow:hover { color: #fff; } /*-------------------------------------------------------------- ## Posts and pages --------------------------------------------------------------*/ #page-header { margin: 0 0 2.5rem; } .page #page-header { margin: 1rem 0 2.5rem; } .blog #page-header, .archive #page-header { margin-bottom: 3rem; padding: 0; } .blog #page-title, .archive #page-title, #page-title { font-size: 3rem; font-weight: 700; margin: 0; text-transform: uppercase; } .page #page-title { text-transform: none; } #blog-description p, #category-description p, #page-intro p { margin-bottom: 0; } #blog-description, #category-description, #page-intro { font-size: 1.313rem; font-weight: 500; color: #989898; line-height: 1.4; margin: 1rem 0 0; } .page #page-intro { max-width: 90%; } /* Featured media --------------------------------------- */ .featured-media { position: relative; display: block; margin-bottom: 2rem; } /* #featured-image { margin-top: 2.5rem; } */ .featured-media a, .featured-media img { display: block; } .featured-media img { border-radius: 4px; margin: 0 auto; } .featured-media iframe { display: block; border: none; max-width: 100%; height: auto; } .featured-media .featured-label { position: absolute; top: 5%; right: 0; padding: 8px 10px; border-radius: 3px 0 0 3px; background: #ef562f; color: #fff; font-size: 0.7em; text-transform: uppercase; letter-spacing: 1px; z-index: 10; } .media-caption-container { position: absolute; width: 95%; margin-left: 2.5%; bottom: 1rem; text-align: left; font-size: 0.85em; } .media-caption { display: inline-block; padding: 7px 11px; border-radius: 3px; background: #262626; background: rgba(38, 38, 38, 0.75); color: #fff; text-align: center; line-height: 1.2; margin-bottom: 0; } .media-caption:hover { background: #262626; color: #fff; } /* blog featured images - specific */ .blog-wide .featured-media img { width: 100%; } /* post content */ .hentry, #related-posts, #comments, #inset-top-sidebar, #inset-bottom-sidebar, .template-about #featured-image { margin: 0 auto 2rem; background: #fff; border: 1px solid #e8e8e8; border-radius: 5px; padding: 2rem; } .page .hentry { padding: 2rem 2rem 3rem; } .hentry:last-child, .search .hentry { margin-bottom: 1rem; } .updated:not(.published) { display: none; } .page-content, .entry-content, .entry-summary { font-size: 1.063rem; line-height: 1.6; margin: 0; } .search-no-results #primary { padding: 0; } .search-no-results .archive-subtitle p { font-weight: 700; } .search .entry-summary { margin-top: 1rem; } .page .entry-content p:last-child { margin-bottom: 0; } .page-links { clear: both; margin: 1rem 0 0; } /* entry titles */ .blog .entry-title, .archive .entry-title, .search .entry-title { font-size: 2.5rem; font-weight: 700; margin: 0 0 1.5rem; } .entry-title a, .entry-title a:visited { color: inherit; } .entry-title a:focus, .entry-title a:hover { color: #847264; } /* post excerpts */ .archive .entry-header p, .blog .entry-header p { font-size: 1.25rem; font-weight: 300; font-family: poppins; line-height: 1.4; } /* meta info */ .entry-meta { font-size: 0.875rem; letter-spacing: 0.5px; line-height: 1; margin: 0; padding: 0 0px 0 0px; margin-bottom: 1rem; } .entry-meta li:last-child { margin-right: 0; } .entry-meta .avatar { border-radius: 50%; } .entry-meta li { display: inline-block; margin-right: 0.5rem; position: relative; } .entry-meta li::last-child { margin-right: 0; } .entry-meta, .entry-meta a, .entry-meta a:visited { color: inherit; } .entry-meta a:focus, .entry-meta a:hover { color: #b97a56; } .entry-meta li:after { color: #000; content: "\00B7"; font-size: 1.5rem; position: relative; right: -0.25rem; top: 0.313rem; font-weight: 900; opacity: 0.35; } .entry-meta .post-author-avatar:after { content: none; } .entry-meta li:last-child::after { content: ""; } .post-categories { list-style: none; margin: 0 0 1rem; } .post-categories li { display: inline-block; margin: 1px 0; } .post-categories a, .post-categories a:visited { background: #ef562f; border-radius: 3px; color: #fff; font-style: normal; font-size: 0.875rem; font-weight: 300; letter-spacing: 1px; padding: 0.25rem 0.688rem 0.313rem 0.688rem; text-transform: uppercase; } /* read more link */ .more-link-wrapper { height: 2rem; margin: 2.5rem 0 0; } .blog-minimal-left .more-link-wrapper, .blog-minimal-right .more-link-wrapper { margin-top: 0; } .more-link, .more-link:visited, .excerpt-more-link, .excerpt-more-link:visited { background: #ef562f; color: #fff; display: inline-block; font-size: 0.875rem; padding: 0.5rem 1.125rem; border-radius: 0.313rem; line-height: 1; letter-spacing: 1px; } .more-link:focus, .more-link:hover, .excerpt-more-link:focus, .excerpt-more-link:hover { background: #1b1b1b; color: #fff; } .excerpt-more-link-wrapper { margin-bottom: 0; } /* Quote Format */ .archive .format-quote blockquote, .blog .format-quote blockquote { margin-bottom: 0; } /* Blog Wide */ .blog-wide .entry-summary { max-width: 800px; margin: 0 auto; } .blog-wide .media-caption-container { max-width: 800px; margin: auto; left: 0; right: 0; } /* Blog Grid Layouts */ #grid-summaries { list-style: none; } .blog-grid .hentry, .blog-grid-left .hentry, .blog-grid-right .hentry { margin-bottom: 2.5rem; padding: 2rem; } /* Blog Minimal */ .blog-minimal-left .entry-summary p:last-child, .blog-minimal-right .entry-summary p:last-child { margin-bottom: 0; } /* Single - full post */ .single .entry-title { margin-bottom: 0; } .single .entry-title { color: #1b1b1b; font-weight: 600; margin: 0 0 5px; } .single-right .entry-title, .single-left .entry-title { font-size: 2.688rem; line-height: 1; margin-bottom: 1rem; } .single .featured-image { margin-bottom: 2.5rem; position: relative; } .single-wide .featured-image img { margin: auto; display: block; } .single .hentry { margin-bottom: 2rem; } .single-wide .entry-header { text-align: center; } .single-right .entry-meta, .single-left .entry-meta, .single-wide .entry-meta { margin-bottom: 1.5rem; } .single-wide .single-inner { max-width: 800px; margin: 0 auto; padding: 2rem 0; } /* Page - Full width short */ .template-short #short-inner { max-width: 800px; margin: auto; } /* Page - Archive */ .archive-col ul li span { font-style: italic; font-size: smaller; color: #afafaf; } /* post footer info */ #entry-footer { margin-bottom: 2rem; padding-top: 2rem; } #entry-footer li { display: inline-block; font-size: 0.875rem; margin-right: 0.5rem; } #entry-footer ul { margin: 0; padding: 0; display: inline; } #entry-footer p { display: inline; margin-bottom: 5px; } ul.tag-list li { margin: 1px 0; } .tag-list a, .tag-list a:visited { display: inline-block; background: #ef562f; color: #fff; padding: 3px 9px; border-radius: 4px; letter-spacing: 1px; } .tag-list a:hover, .tag-list a:focus { background: #1b1b1b; color: #fff; } .tag-list a:before { content: "\f02b"; font-family: "fontawesome"; margin-right: 0.313rem; position: relative; } /* Author Info */ #author-info { display: table; margin: 0; border-top: 1px solid #c9beaf; padding-top: 2rem; } #author-avatar { float: left; margin-right: 1.5rem; } #author-info .avatar { border-radius: 50%; } #author-description { overflow: hidden; } #author-title { font-size: 1.25rem; font-weight: 600; margin: 0 0 1rem; } #author-bio { font-size: 0.938rem; margin-bottom: 0; } #author-bio #author-link { margin-top: 1rem; display: block; font-style: italic; } /* Related Posts */ #related-posts-header { font-weight: 600; margin-bottom: 2rem; } .related-post-title { display: block; font-size: 1.125rem; font-weight: 600; line-height: 1.1; margin-bottom: 0.75rem; } .related-post-title, .related-post-title:visited { color: #1b1b1b; } .related-post-title:focus, .related-post-title:hover { color: #847264; } .related-post-content { margin-bottom: 0; } .related-item { margin-bottom: 2rem; } .related-post-content p:last-child, .related-item:last-child { margin-bottom: 0; } .related-post-content .more-link-wrapper { margin: 0; } .related-post-content .more-link { display: inline-block; padding: 0.25rem 1rem 0.313rem; font-size: 0.75rem; margin: 1rem 0 0; } .related-post-thumbnail { margin-bottom: 1.125rem; } /*-------------------------------------------------------------- ## Comments --------------------------------------------------------------*/ h2.comments-title { font-size: 1.25rem; } .full-width-short .hentry { max-width: 980px; margin-left: auto; margin-right: auto; } .bypostauthor {} #respond, #comments { padding: 2rem; } #respond { padding: 2rem 0 0; } .comments-list { margin: 0; } .comment-content { border-bottom: 1px solid #eaeaea; color: inherit; margin-bottom: 1.5rem; } .comment-content p { margin-bottom: 1.25rem; } .comments-list ul.children { margin-left: 2rem; } .post_comments_box { border-top: 1px solid #e7e7e7; margin-top: -1px; } .post_comments_box h4.page-header { margin-top: 0; margin-bottom: 16px; } .commenter { float: left; } .commenter_name { display: block; font-size: 1.25rem; font-weight: 600; font-style: normal; margin-top: 0; margin-bottom: 0.25rem; } .commenter_name a { color: inherit; } .bypostauthor .url { font-family: Poppins, sans-serif; } .comment_info a.comment_time { color: #9a9a9a; } .commenter .avatar { border-radius: 50%; margin-right: 1rem; -webkit-border-radius: 50%; -moz-border-radius: 50%; } .comments-list .children .avatar { width: 60px; border-width: 2px; } .logged_in_name { color: #3d3d3d; } h3.comment-reply-title { font-size: 1.25rem; margin-bottom: 1px; } h3.comment-reply-title > a { color: #3d3d3d; font-weight: 500; } h3.comment-reply-title small {} .media.the_comment { border-bottom: 1px dotted #ddd; padding-bottom: 11px; display: inline-block; } .media.the_comment:last-child {} .media.the_comment .children { padding: 0; margin-top: 32px; } .comment_content_wrapper { border-left: 1px solid #ececec; padding-left: 20px; } .children .comment_content_wrapper { border-left: 0; padding-left: 0; } .children .media.the_comment > .commenter { padding-right: 10px; } .children .media.the_comment { margin-bottom: 0px; margin-top: 20px; border-bottom: 0; padding-bottom: 0; display: inline-block; } .show_no_avatars .comment_content_wrapper { border-left: none; padding-left: 0; } .show_no_avatars .media.the_comment .children { padding-left: 25px; } header.comment-meta { margin-bottom: 1rem; } .comments-list .media { margin-top: 0; } .comment_body .media-heading { margin: 0 0 3px; } .comment_body p { line-height: 1.6; } .comment_body p a { color: inherit; border-bottom: 1px dotted #000; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; transition: all 0.2s ease-in; } .comment_body p a:hover { color: #f47e00; border-bottom-color: #f47e00; } .bypostauthor, .bypostauthor a, .bypostauthor a:visited, .post.pingback a, .post.pingback a:visited { color: #1b1b1b; } .post.pingback a:hover { border-bottom: 1px dotted #333; } .post.pingback .edit-link a:hover { border-bottom: none; } .comment-date, .comment-date a, .comment-date a:visited { color: #9b9b9b; font-size: 0.938rem; line-height: 1; } a.comment-reply-link { background: #ef562f; border-radius: 3px; color: #fff; font-weight: 400; display: inline-block; padding: 2px 0.5rem 3px; letter-spacing: 1px; text-transform: uppercase; font-size: 0.688rem; margin: 0 5px; position: relative; bottom: 2px; } a.comment-reply-link:focus, a.comment-reply-link:hover { background: #1b1b1b; color: #fff; } /* Comments Form */ .comment-form-column-wrapper { margin: 0 -10px 10px; } .comment-form-column { width: 33.3333%; float: left; padding: 0 10px; } .comment-form p { margin-bottom: 10px; } p.logged-in-as a { color: inherit; } .comment-notes { font-size: 0.75rem; font-style: italic; } .comment-awaiting-moderation { font-style: italic; background: #7dafd2; color: #fff; border-radius: 6px; position: relative; top: 20px; padding: 0 12px; } .comment-respond input[type=text], .comment-respond input[type=email], .comment-respond input[type=url], .comment-respond textarea { background: #fafafa; border: none; border: 1px solid #c3c3c3; padding: 0.5rem; line-height: 1.6; width: 100%; } /* -------------------------------------------------------------------------------- # Error Page -------------------------------------------------------------------------------- */ #error-box { width: 100%; margin: 3rem auto; text-align: center; } #error-text { font-size: 1.5rem; margin-bottom: 1.25rem; } #error-text:after { margin: 20px auto 12px; } #error-type { color: #ef562f; font-size: 5rem; font-weight: 600; line-height: 1; margin-bottom: 1rem; } #error-content { font-size: 0.938rem; width: 90%; margin: auto; line-height: 1.35; opacity: 0.6; } /* -------------------------------------------------------------------------------- # Attachments Page -------------------------------------------------------------------------------- */ #attachment-view { margin: auto; text-align: center; } .attachment .post-header { margin-bottom: 2rem; } .attachment .hentry { text-align: center; } #attachment-wrapper { background: #000; margin-bottom: 1.75rem; } #attachment-wrapper img { display: block; margin: auto; } #attachment-description { margin: 0 auto; } .attachment .entry-title { font-weight: 500; margin-bottom: 0; text-align: center; } .attachment .gallery-post-caption { font-family: inherit; color: #000; } .attachment .gallery-post-caption p { font-size: 2rem; font-weight: 400; margin-bottom: 1rem; } .post-caption .more-link { display: none; } .attachment #comments, .attachment #respond { margin: auto; max-width: 960px; } #image-navigation { height: 40px; display: table; margin: 2rem auto; } #image-navigation a { padding: 5px 20px; } .prev-image, .next-image { display: inline-block; margin: 0 2px; } .attachment .form-submit { text-align: center; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } .entry-content img.wp-post-image { -webkit-box-shadow: 0 1px 10px -6px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 1px 10px -6px rgba(0, 0, 0, 0.8); box-shadow: 0 1px 10px -6px rgba(0, 0, 0, 0.8); } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ vertical-align: middle; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /* Make sure logo link wraps around logo image. */ .custom-logo-link { display: inline-block; } /*-------------------------------------------------------------- ## Captions --------------------------------------------------------------*/ .wp-caption { margin-bottom: 1.5rem; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0; } .wp-caption-text { color: #1b1b1b; font-size: 0.75rem; font-weight: 600; padding: 0.75rem 0 0; letter-spacing: 1px; text-align: center; } .caption.widget_media_image figcaption { background: #000; border-radius: 0.375rem; font-weight: 400; color: #fff; position: absolute; bottom: 1rem; margin: auto; max-width: fit-content; left: 0; right: 0; padding: 0.5rem 2rem; letter-spacing: 1px; } /* featured image captions */ .post-caption-container { position: absolute; width: 100%; bottom: 1.5rem; } .post-caption { display: inline-block; padding: 0.688rem 2.375rem 0.688rem 1rem; background: rgba(0, 0, 0, 0.5); color: #fff; font-size: 0.875rem; line-height: 1.3; margin: 0; } /* For small thumbnails that leaves very little caption space */ .gallery-columns-6 .gallery-caption, .gallery-columns-7 .gallery-caption, .gallery-columns-8 .gallery-caption, .gallery-columns-9 .gallery-caption { display: none; } /*-------------------------------------------------------------- ## Galleries --------------------------------------------------------------*/ .gallery { margin: 3rem -20px 0; } .entry-content .gallery { margin: 3rem -20px 2rem; } .gallery-item { display: inline-block; margin: 5px 0 2rem; padding: 0 20px; text-align: center; vertical-align: top; width: 100%; } .gallery-icon { background: #3e4a5f; padding: 1px 1px 0; text-align: center; } .gallery-icon img { display: block; filter: grayscale(1); margin: auto; width: 100%; } .gallery-icon img:hover { filter: grayscale(0); } .gallery-columns-2 .gallery-item, .gallery-columns-3 .gallery-item, .gallery-columns-4 .gallery-item, .gallery-columns-5 .gallery-item, .gallery-columns-6 .gallery-item, .gallery-columns-7 .gallery-item, .gallery-columns-8 .gallery-item, .gallery-columns-9 .gallery-item { max-width: 100%; } .gallery-caption { text-transform: uppercase; font-family: Poppins, sans-serif; font-weight: 600; line-height: 1; letter-spacing: 1px; padding: 12px 10px 10px; position: relative; } /*-------------------------------------------------------------- ## Sidebars and Widgets --------------------------------------------------------------*/ /* banner */ #banner-sidebar { margin-top: 2.5rem; position: relative; } #banner figure { margin-bottom: 0; } #banner figure img, #banner img { display: block; margin: auto; } /* top sidebars */ #top-sidebars { margin-bottom: 3rem; } /* bottom sidebars */ #bottom-sidebars { margin-top: 3rem; } /* breadcrumbs */ #breadcrumbs-sidebar .widget { max-width: 1160px; margin: auto; } #breadcrumbs-sidebar { background: #eae7e0; padding: 10px 0; margin-bottom: 1rem; font-size: 0.875rem; } /* left and right sidebars */ #blog-sidebar, #left-sidebar, #right-sidebar { padding-top: 0; } #half-sidebar .widget, #blog-sidebar .widget, #left-sidebar .widget, #right-sidebar .widget, #inset-top .widget, #inset-bottom .widget { margin-bottom: 1rem; padding: 1rem 2rem; } /* Inset top and bottom sidebars */ #inset-top { margin-bottom: 32px; } #inset-bottom .widget { margin-bottom: 2rem; } /* Footer sidebars */ #footer-sidebars { background: #b06545; color: #fff; font-size: 0.938rem; padding: 0.5rem; } #footer-sidebars .widget { margin: 2rem 0; } #footer-sidebars .widget-title { font-weight: 500; } /* Widgets */ .widget ul { list-style: none; margin: 0; } .widget-title { font-size: 1.063rem; margin-top: 0; position: relative; } #bottom-sidebars .widget-title, #top-sidebars .widget-title, #half-sidebar .widget-title, #blog-sidebar .widget-title, #left-sidebar .widget-title, #right-sidebar .widget-title, #inset-top-sidebar .widget-title, #inset-bottom-sidebar .widget-title, #footer-sidebars .widget-title { font-weight: 500; text-align: left; padding: 0 0 1.25rem; margin: 0 0 1.125rem; } #inset-top-sidebar .widget-title, #inset-bottom-sidebar .widget-title { font-weight: 600; padding: 0; } #bottom-sidebars .widget-title:after, #top-sidebars .widget-title:after, #half-sidebar .widget-title:after, #blog-sidebar .widget-title:after, #left-sidebar .widget-title:after, #right-sidebar .widget-title:after, #footer-sidebars .widget-title:after { background: #c9beaf; content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; display: block; border-radius: 2px; } #footer-sidebars .widget-title:after { background: #bf846b; } #inset-top .widget-title, #inset-bottom .widget-title { text-align: left; padding-left: 20px; } .widget p:last-child { margin-bottom: 0; } .widget ul li ul { margin: 0 0 -1px; padding: 0; position: relative; } .widget ul li li { border: 0; padding-left: 24px; padding-left: 0.5rem; } /* Styles */ .widget.dark, .widget.red, .widget.brown { font-size: 0.938rem; } #blog-sidebar .widget.dark .widget-title:after, #left-sidebar .widget.dark .widget-title:after, #right-sidebar .widget.dark .widget-title:after { background: #424040; } #blog-sidebar .widget.red .widget-title:after, #left-sidebar .widget.red .widget-title:after, #right-sidebar .widget.red .widget-title:after { background: #f9623c; } #blog-sidebar .widget.brown .widget-title:after, #left-sidebar .widget.brown .widget-title:after, #right-sidebar .widget.brown .widget-title:after { background: #bf846b; } .widget.dark { background: #1b1b1b; color: #fff; margin-bottom: 2rem; } .widget.red { background: #ef562f; color: #fff; } .widget.brown { background: #b06545; color: #fff; } #blog-sidebar .widget.dark, #blog-sidebar .widget.red, #blog-sidebar .widget.brown, #left-sidebar .widget.dark, #left-sidebar .widget.red, #left-sidebar .widget.brown, #right-sidebar .widget.dark, #right-sidebar .widget.red, #right-sidebar .widget.brown { margin: 1rem auto 2rem; padding: 2rem; } .widget.dark .widget-title, .widget.red .widget-title, .widget.brown .widget-title { color: #fff; } /* Widget Image Box */ .ariele-imagebox-image, .ariele-imagebox-content { position: relative; } .ariele-imagebox-content { border-radius: 5px; margin: 0; padding: 0 0.75rem; position: absolute; top: 50%; left: 2rem; right: 2rem; text-align: center; -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 1; } .ariele-imagebox-heading { font-size: 1.188rem; text-transform: capitalize; line-height: 1; margin: 0 0 0.75rem; color: #fff; font-weight: 600; letter-spacing: 0.25px; } .ariele-imagebox-content .button.imagebox-link, .ariele-imagebox-content .button.imagebox-link:visited { border-radius: 3px; font-size: 0.75rem; margin: 0.75rem auto; padding: 0.5rem 2rem; text-transform: uppercase; } .ariele-imagebox-content .button.imagebox-me-link:focus, .ariele-imagebox-content .button.imagebox-me-link:hover { background: #1c1c1c; } .ariele-imagebox-image, .ariele-imagebox-image img { border-radius: 0.25rem; } .ariele-imagebox-image { min-height: 260px; background-position: center; background-size: cover; } .ariele-imagebox-image:before { content: ""; background: rgba(0, 0, 0, 0.15); border-radius: 0.25rem; top: 0; bottom: 0; left: 0; right: 0; position: absolute; } /* About Widget */ .ariele-widget-about { text-align: center; } .about-me-name { font-size: 1.375rem; font-weight: 600; } .widget.dark .about-me-name, .widget.red .about-me-name, .widget.brown .about-me-name { color: #fff; } .portrait-image { margin: 0 auto 2rem; } .dark .portrait-image, .red .portrait-image, .brown .portrait-image { margin: 2rem auto; } .signature-image { margin: 2rem 0 0; } .portrait-image img { border-radius: 50%; max-width: 11rem; } .about-widget-wrapper { font-size: 0.938rem; } .about-me-link { display: inline-block; margin: 1.5rem 0 0; } /* Widget Menu */ .widget_nav_menu .sub-menu { text-transform: none; border-top: 1px solid #ebebeb; } .widget_nav_menu li { border-top: 1px solid #ededed; } .widget_nav_menu:not(.sub-menu) li:first-child { border-top: none; } .widget_nav_menu a { font-weight: 600; padding: 5px 0; display: inline-block; } .widget_nav_menu .sub-menu li:first-child a { padding-top: 10px; } .widget_nav_menu .sub-menu li:last-child a { padding-bottom: 10px; } .widget_nav_menu .sub-menu a { font-weight: 400; } .widget_nav_menu .sub-menu a:before { content: "\2013"; margin-right: 5px; opacity: 0.4; } .widget_nav_menu .current-menu-item a { color: #ef562f; } /* Image Widget */ #half-sidebar .caption.widget_media_image { padding: 1px 2rem 2rem 2rem; } /* Widget Pages */ .widget_pages .children { text-transform: none; border-top: 1px solid #ebebeb; } .widget_pages li { border-top: 1px solid #ededed; } .widget ul.children li { padding: 0 0 0 1rem; } .widget_pages:not(.children) li:first-child { border-top: none; } .widget_pages a { padding: 0.688rem 0; display: inline-block; } .widget_pages .children a { font-weight: 400; padding: 0 0 0.5rem; } .widget_pages .children li:first-child a { padding-top: 10px; } .widget_pages .children li:last-child a { padding-bottom: 10px; } .widget_pages .children a:before { content: "\2013"; margin-right: 5px; opacity: 0.4; } .widget_pages .current-menu-item a { color: #ef562f; } /* list widgets */ .widget_meta li, .widget_recent_entries li, .widget_recent_comments li, .widget_archive li, .widget_categories li { border-bottom: 1px solid #c9beaf; font-size: 1rem; line-height: 1.2; margin: 0 0 0.688rem; padding: 0 0 0.688rem; } .widget_meta.red li, .widget_recent_entries.red li, .widget_recent_comments.red li, .widget_archive.red li, .widget_categories.red li, .widget_meta.dark li, .widget_recent_entries.dark li, .widget_recent_comments.dark li, .widget_archive.dark li, .widget_categories.dark li, .widget_meta.brown li, .widget_recent_entries.brown li, .widget_recent_comments.brown li, .widget_archive.brown li, .widget_categories.brown li { border-color: rgba(255, 255, 255, 0.25); } #footer-sidebars .widget_meta li, #footer-sidebars .widget_recent_entries li, #footer-sidebars .widget_recent_comments li, #footer-sidebars .widget_archive li, #footer-sidebars .widget_categories li { border-bottom: 1px solid #fff; border-color: rgba(255, 255, 255, 0.2); } /* Text widget */ .widget_text { word-wrap: break-word; } .widget_text ul { list-style: disc; margin: 0 0 1.5em 1.5em; } .widget_text ol { list-style: decimal; } .widget_text ul li, .widget_text ol li { border: none; margin-bottom: 0.25rem; } .widget_text ul li:last-child, .widget_text ol li:last-child { padding-bottom: 0; } .widget_text ul li ul { margin: 0 0 0 1.5em; margin: 0.25rem 0 0.25rem 1.5rem; list-style: circle; } .widget_text ul li li { padding-left: 0; padding-right: 0; } .widget_text ol li { list-style-position: inside; } .widget_text ol li + li { margin-top: -1px; } /* Search */ .search-results li.post-author-avatar { display: none; } .search-form { position: relative; } .search-form .search-submit { padding: 0.5em 1em; position: absolute; } .widget input[type=search].search-field { margin-bottom: 0 } .widget .search-submit:before { font-size: 16px; left: 1px; line-height: 35px; width: 44px; } .widget button.search-submit { background: #ef562f; color: #fff; font-size: 0.75rem !important; padding: 0 0.75rem; } .widget button.search-submit:focus, .widget button.search-submit:hover { background: #1b1b1b; color: #fff; } .search-submit .fa { display: none; } .searchOpen { float: right; padding: 0; } .fa-search:before { color: #fff; content: "\f002"; } .curtainclose i { border: 3px solid; padding: 3px; } .tranz { -webkit-transition: all .5s ease; -moz-transition: all .5s ease; transition: all .5s ease; } #curtain { position: fixed; top: 0; left: 0; background: #ffffff; opacity: .0; height: 0; width: 100%; z-index: 99999; overflow: hidden; } #curtain.open { height: 100%; opacity: .98; } #curtain .search-form { max-width: 40%; width: 600px; height: 80px; margin: -40px 0 0 -300px; float: none; position: absolute; top: 45%; left: 50%; } #curtain .searchSubmit, #curtain a.curtainclose { border: none !important; top: 19px; right: 19px; font-size: 15px !important; width: 100px; height: 40px; } #curtain a.curtainclose { margin: 30px 10px; float: none; position: absolute; top: 0; right: 0; } .search-form input.search-field { padding: 20px 8% 20px 2%; margin: 0 0 0 0; height: 60px; font-style: normal; width: 100%; border: 1px solid rgba(204, 204, 204, .3); } #curtain .search-form input.search-field { padding: 12px 35px; height: 70px; background: rgba(0, 0, 0, 0.02); border: none; font-size: 18px !important; border: 1px solid rgba(0, 0, 0, 0.04); position: relative; } #curtain .fa-search { position: relative; left: 0.5rem; bottom: 1px; } .search-submit { position: absolute; height: 46px; width: 100px; border: none; cursor: pointer; margin: 0; overflow: hidden; padding: 4px; top: 7px; right: 7px; font-size: 15px !important; line-height: 1 !important; } .error404 .search-submit { width: 7rem; } #curtain .search-submit, #curtain a.curtainclose { border: none !important; top: 19px; right: 19px; font-size: 15px !important; width: 130px; height: 40px; } #curtain .search-submit { background: #ef562f; color: #fff; top: 15px; } #curtain .search-submit:focus, #curtain .search-submit:hover { background: #1b1b1b; color: #fff; } @media screen and (max-width: 991px) { .searchOpen { float: none; margin-bottom: 1rem; display: inline-block; } #curtain a.curtainclose { margin: 0; top: 30px; left: auto; right: 0; } .admin-bar #curtain a.curtainclose { top: 78px; } #curtain .search-form { max-width: 80%; margin: -40px 0 0 0; left: 10%; } } /* about author */ .ariele_lite_about_author { text-align: center; } .about-image { margin: 0 auto; } .about-content { padding: 1.5rem 1rem 0; line-height: 1.5; } .about-name { font-size: 1.5rem; font-weight: 500; margin-bottom: 1rem; } .about-icon, a.about-icon:visited { display: inline-block; width: 32px; height: 32px; background: #957339; color: #fff; border-radius: 50%; text-align: center; line-height: 32px; } .about-icon:hover { background: #965a18; color: #fff; } /* Recent comments with avatar widget */ #ariele-recent-comments { font-size: 0.875rem; list-style: none; margin: 0; padding: 0; } #ariele-recent-comments .comment-author-link { display: inline-block; font-size: 0.813rem; font-style: italic; overflow: hidden; } #ariele-recent-comments .comment-article { margin: 0; overflow: hidden; } #ariele-recent-comments .comment-author-link .url { margin-right: 5px; } #ariele-recent-comments .recent-comment .comment-avatar { border-radius: 50%; float: left; margin: 0 1rem 0 0; position: relative; top: 3px; } #ariele-recent-comments .recent-comment { clear: both; min-height: 40px; margin: 0 0 1.25rem; } #ariele-recent-comments .comment-link { display: block; font-size: 0.938rem; font-weight: 600; font-style: normal; line-height: 1.25; } #ariele-recent-comments .comment-link:hover { color: #d6ac6a; } #footer-sidebars #ariele-recent-comments .comment-link:hover { color: inherit; opacity: 0.75; } /* Recent posts with thumbnail widget */ .ariele-recent-posts li { display: grid; grid-template-columns: 80px 1fr; margin-bottom: 2rem; } .recent-post-thumbnail .wp-post-image:hover { -webkit-filter: grayscale(100%); filter: grayscale(100%); } .recent-post-thumbnail { margin: 0 1.5rem 0 0; } .recent-post-thumbnail .wp-post-image { border-radius: 50%; margin: 0; } .ariele-recent-posts { text-align: left; } .ariele-recent-posts .recent-title { font-weight: 600; font-size: 1rem; line-height: 1.3; margin-top: 0; margin-bottom: 0.25rem; } .ariele-recent-posts .recent-post-date { font-size: 0.688rem; font-style: italic; } .ariele-recent-posts p { margin: 0; } /* WordPress image widget - for the banner sidebar. * Adds the image caption with basic html as an overlay and is only available when used in the #banner sidebar. */ #banner .wp-caption-text { display: none; } #banner figure figcaption.wp-caption-text { background: #000; color: #fff; font-family: Poppins, sans-serif; position: absolute; bottom: 3rem; padding: 1rem 1rem 1.5rem; left: 2rem; line-height: 1; max-width: 75%; margin: auto; text-align: left; } #banner figcaption.wp-caption-text span { display: block; padding: 0 1rem; } #banner figcaption.wp-caption-text span.banner-title { font-size: 3rem; font-size: calc(1rem + 1.75vw); font-weight: 600; line-height: 1.3; } #banner figcaption.wp-caption-text span.banner-subtitle { font-size: 1.313rem; font-size: calc(1rem + 0.25rem); font-weight: 500; } /* WP Widget Gallery */ .widget .gallery-item { padding: 0 10px; margin-bottom: 15px; } .widget .gallery { margin: 1rem -10px; } .widget .gallery .gallery-caption { display: none; } /* calendar widget */ #wp-calendar a { color: #ef562f; } #wp-calendar { width: 100%; } #wp-calendar caption { text-align: right; color: #1b1b1b; font-size: 12px; padding-top: 0px; margin-bottom: 15px; } #wp-calendar thead { font-size: 10px; margin-bottom: 10px; } #wp-calendar thead th { padding: 10px; } #wp-calendar tbody { color: #aaa; } #wp-calendar tbody td { background: #f8f8f8; border: 1px solid #fff; text-align: center; padding: 8px; } #wp-calendar tbody td:hover { background: #fff; } #wp-calendar tbody .pad { background: #f8f8f8; } #wp-calendar tfoot #next { font-size: 10px; text-transform: uppercase; text-align: right; } #wp-calendar tfoot #prev { font-size: 10px; text-transform: uppercase; padding-top: 10px; } #wp-calendar thead th { background: #1b1b1b; color: #fff; text-align: center; border: 1px solid #5d5d5d; font-weight: normal; } #wp-calendar caption { color: #000; } /* tagcloud */ .tag-cloud-link { color: inherit; display: inline-block; font-size: 0.688rem !important; padding: 4px 8px; border: 1px solid #afafaf; line-height: 1rem; white-space: nowrap; margin: 0 3px 5px 0; text-transform: uppercase; letter-spacing: 1px; } .tag-cloud-link:hover { background: #965a18; border: 1px solid #965a18; color: #fff; } #footer-sidebars .tag-cloud-link { background: #c2a68c; border-color: #c2a68c; } #footer-sidebars .tag-cloud-link:focus, #footer-sidebars .tag-cloud-link:hover { background: #ef562f; border-color: #ef562f; } /*-------------------------------------------------------------- ## Navigation - Main Menu --------------------------------------------------------------*/ #nav-wrapper { padding: 0; text-align: center; display: block; margin: 1rem auto 0; z-index: 1000; } .site-header2 #nav-wrapper { background: transparent; border: none; float: right; margin: 0; } .menu-toggle { background: #d4b48f; border: 1px solid #d4b48f; cursor: pointer; color: #fff; font-size: 13px; font-size: 1.125rem; margin: 1rem 0; padding: 6px 16px; text-transform: uppercase; font-weight: 500; letter-spacing: 2px; } .no-js .menu-toggle { display: none; } .menu-toggle:hover, .menu-toggle:focus { background: #0f0f0f; border-color: #0f0f0f; color: #fff; } .menu-toggle.toggled-on, .menu-toggle.toggled-on:hover, .menu-toggle.toggled-on:focus { background: #0f0f0f; border-color: #0f0f0f; color: #fff; } .menu-toggle:focus { outline: 0; } .menu-toggle.toggled-on:focus { outline: thin dotted; } .site-header-menu { display: none; -webkit-flex: 0 1 100%; -ms-flex: 0 1 100%; flex: 0 1 100%; } .site-header-menu.toggled-on, .no-js .site-header-menu { display: block; margin-top: 0; } .site-footer .main-navigation { margin-bottom: 1.75rem; } .main-navigation .primary-menu { font-size: 0.875rem; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; } .main-navigation ul { display: table; list-style: none; margin: 0 auto; padding: 0; } .toggled-on .main-navigation .primary-menu { display: block; text-align: left; } .main-navigation li > ul { text-transform: none; -webkit-box-shadow: 0 1px 10px -6px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 1px 10px -6px rgba(0, 0, 0, 0.8); box-shadow: 0 1px 10px -6px rgba(0, 0, 0, 0.8); } .main-navigation li { position: relative; } .toggled-on .main-navigation li { border-top: 1px solid #404040; } .main-navigation a { color: #fff; display: block; line-height: 1.313; outline-offset: -1px; padding: 0.875rem 0 0.75rem; text-decoration: none; } .main-navigation a:hover, .main-navigation a:focus { color: #ef562f; } .main-navigation .current-menu-item > a, .main-navigation .current-menu-ancestor > a { color: #ef562f; } .main-navigation li li > a { color: #afafaf; } .main-navigation li li > a:hover { /* border-bottom: 2px solid transparent; */ } .toggled-on .main-navigation a { border-color: transparent !important; } .main-navigation ul ul { display: none; font-size: 0.813rem; margin-left: 0.875rem; padding-left: 0; /* prepare submenu for animated on hover */ opacity: 0; transition: visibility 0s linear 0.4s, opacity 0.4s linear; } .no-js .main-navigation ul ul { display: block; } .main-navigation ul .toggled-on { display: block; opacity: 1; text-align: left; } .main-navigation .menu-item-has-children > a { margin-right: 56px; } .dropdown-toggle { background: transparent; border: 0; border-radius: 0; color: #1b1b1b; content: ""; height: 44px; padding: 0; position: absolute; right: 0; text-transform: none; top: -1px; width: 56px; } .dropdown-toggle:after { cursor: pointer; display: block; border: 0 solid #404040; border-left-width: 1px; content: "\21E9"; font-size: 26px; left: 1px; position: relative; padding-left: 0; text-align: center; } .dropdown-toggle:hover, .dropdown-toggle:focus { background: transparent; color: #cea26d; } .dropdown-toggle:focus { outline: thin dotted; outline-offset: -1px; } .dropdown-toggle:focus:after { border-color: transparent; } .dropdown-toggle.toggled-on:after { content: "\21E7"; } /*-------------------------------------------------------------- # Navigation - Social Menu --------------------------------------------------------------*/ .social-menu { height: 32px; margin: 0; padding: 0; text-align: center; } #site-footer .social-menu { display: block; margin: 0; text-align: center; } .social-menu li { display: inline-block; height: 2rem; position: relative; width: 2rem; } .social-menu a { color: #848484; display: inline-block; font-size: 1rem; width: 2rem; height: 2rem; line-height: 2rem; position: relative; font-family: "Font Awesome 5 Brands", FontAwesome; color: inherit; text-align: center; -webkit-transition: background .2s ease-in-out; -moz-transition: background .2s ease-in-out; -ms-transition: background .2s ease-in-out; -o-transition: background .2s ease-in-out; transition: background .2s ease-in-out; } #site-footer .social-menu a { font-size: 1.5rem; } .social-menu a:focus, .social-menu a:hover { text-decoration: none; opacity: 0.7; } .social-menu a:before { position: absolute; left: 0; right: 0; content: "\f013"; } .social-menu a[href$="/feed/"]:before { content: "\f09e"; } .social-menu a[href*="deviantart.com"]:before { content: "\f1bd"; } .social-menu a[href*="digg.com"]:before { content: "\f1a6"; } .social-menu a[href*="dribbble.com"]:before { content: "\f17d"; } .social-menu a[href*="facebook.com"]:before { content: "\f09a"; } .social-menu a[href*="flickr.com"]:before { content: "\f16e"; } .social-menu a[href*="plus.google.com"]:before, .social-menu a[href*=".google.com"]:before { content: "\f0d5"; } .social-menu a[href*="github.com"]:before { content: "\f1d3"; } .social-menu a[href*="instagram.com"]:before { content: "\f16d"; } .social-menu a[href*="linkedin.com"]:before { content: "\f0e1"; } .social-menu a[href*="pinterest.com"]:before { content: "\f0d2"; } .social-menu a[href*="reddit.com"]:before { content: "\f1a1"; } .social-menu a[href*="stumbleupon.com"]:before { content: "\f1a4"; } .social-menu a[href*="tumblr.com"]:before { content: "\f173"; } .social-menu a[href*="twitter.com"]:before { content: "\f099"; } .social-menu a[href*="vimeo.com"]:before { content: "\f194"; } .social-menu a[href*="wordpress.com"]:before, .social-menu a[href*="wordpress.org"]:before { content: "\f19a"; } .social-menu a[href="xing.com"]:before { content: "f168"; } .social-menu a[href*="youtube.com"]:before { content: "\f167"; } .social-menu a[href*="vk.com"]:before { content: "\f189"; } .social-menu a[href^="mailto:"]:before { content: "\f0e0 "; } /*-------------------------------------------------------------- # Navigation - Blog Pagination --------------------------------------------------------------*/ .pagination { margin-top: 2rem; } .nav-links { border-radius: 5px; color: #f5f2ed; padding: 12px 0; font-family: Poppins, sans-serif; font-size: 0.875rem; letter-spacing: 0.25px; line-height: 1; text-align: center; text-transform: uppercase; } .blog-classic-left .nav-links, .blog-classic .nav-links { text-align: left; } .nav-links .fa { font-size: 1rem; position: relative; } span.page-numbers.dots { color: #000; } .prev.page-numbers, .next.page-numbers, a.page-numbers, a.page-numbers:visited, .page-numbers.current { display: inline-block; font-weight: 400; text-align: center; background: #fff; margin-right: 0.25rem; padding: 18px 22px; text-transform: uppercase; font-size: 1rem; -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.05); color: #1b1b1b; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; -ms-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .page-numbers.current, .page-numbers:hover, .page-numbers:visited:hover { background: #ef562f; color: #fff; } /* full post nav */ .single .nav-links { color: #1b1b1b; border: none; border-radius: 5px; background: #fff; padding: 1rem 2rem; -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.05); } .single .nav-links a, .single .nav-links a:visited { color: #1b1b1b; } .single .nav-links a:focus, .single .nav-links a:hover { color: #c2a68c; } .single .nav-links p { margin-bottom: 7px; } .single p.post-title { margin-bottom: 0; } .single .nav-previous, .single .nav-next { font-size: 0.75rem; max-width: 48%; } .single .nav-previous { float: left; text-align: left; } .single .nav-next { float: right; text-align: right; } .single .meta-nav { font-weight: 500; } .post-title { text-transform: initial; } .nav-arrow-prev, .nav-arrow-next { position: relative; bottom: 1px; } .nav-arrow-next .fa, .nav-arrow-prev .fa { font-size: 0.75rem; } .nav-arrow-next { margin-left: 4px; } .nav-arrow-prev { margin-right: 4px; } /*-------------------------------------------------------------- # Footer Menu --------------------------------------------------------------*/ #footer-nav { margin-bottom: 0; } #footer-menu { list-style: none; margin: 0; padding: 0; } #footer-menu a { text-decoration: none; font-weight: 400; } #footer-menu li { display: inline; margin: 0 0.125rem; } #footer-menu li:after { content: "\f111"; margin: -2px 0 0 0.538rem; font-size: 5px; display: inline-block; vertical-align: middle; font-family: "Font Awesome 5 Free", FontAwesome; font-weight: 900; opacity: 0.75; position: relative; top: 2px; } #footer-menu li:last-child:after { display: none; } /*-------------------------------------------------------------- # Transitions --------------------------------------------------------------*/ body a { -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; } .widget ul li, .widget_recent_entries a, .search-toggle.active .metal, .search-toggle.active .handle, a.more-link, a img, .tag-cloud-link, .prev.page-numbers, .next.page-numbers, a.page-numbers, a.page-numbers:visited, .page-numbers.current { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .main-navigation ul ul { -webkit-transition: visibility 0.3s, opacity 0.3s linear; transition: visibility 0.3s, opacity 0.3s linear; } #scroll-to-top { -webkit-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; -o-transition: background 0.3s ease-in-out; transition: background 0.3s ease-in-out; } button, input[type=button], input[type=reset], input[type=submit] { -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .image-wrapper:hover .image-overlay { -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } input[type=text], textarea { -webkit-transition: all 0.30s ease-in-out; -moz-transition: all 0.30s ease-in-out; -ms-transition: all 0.30s ease-in-out; -o-transition: all 0.30s ease-in-out; } /*-------------------------------------------------------------- # Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin: 0 2rem 1.25rem 0; } .alignright { display: inline; float: right; margin: 0 0 1.25rem 2rem; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; margin: 0 auto 1.25rem; } .alignnone { margin: 0 0 1.25rem; } /*-------------------------------------------------------------- # Forms --------------------------------------------------------------*/ /* Placeholder text color -- selectors need to be separate to work. */ #topbar ::-webkit-input-placeholder { color: #fff; } #topbar :-moz-placeholder { color: #fff; } #topbar ::-moz-placeholder { color: #fff; opacity: 1; /* Since FF19 lowers the opacity of the placeholder by default */ } #topbar :-ms-input-placeholder { color: #fff; } /* Placeholder text color -- selectors need to be separate to work. */ ::-webkit-input-placeholder { color: #686868; font-size: 0.875rem; } ::-moz-placeholder { color: #686868; font-size: 0.875rem; opacity: 1; /* Since FF19 lowers the opacity of the placeholder by default */ } ::-ms-input-placeholder { color: #686868; font-size: 0.875rem; } ::placeholder { color: #686868; font-size: 0.875rem; } /* base form styles */ input { line-height: normal; } input[type=text], textarea { outline: none; border: 1px solid #c3c3c3; } form p { margin-bottom: 0.5rem; } label { font-weight: 600; font-family: Poppins, sans-serif; font-weight: 500; font-size: 0.875rem; color: #1b1b1b; } .button, .button:visited, button, button[disabled]:hover, button[disabled]:focus, input[type=button], input[type=button][disabled]:hover, input[type=button][disabled]:focus, input[type=reset], input[type=reset][disabled]:hover, input[type=reset][disabled]:focus, input[type=submit], input[type=submit][disabled]:hover, input[type=submit][disabled]:focus { background: #1b1b1b; border: 0; border-radius: 5px; color: #fff; font-size: 0.875rem; letter-spacing: 1px; line-height: 1; padding: 0.813em 0.875rem 0.75rem; text-transform: uppercase; } .button:hover, button:hover, button:focus, input[type=button]:hover, input[type=button]:focus, input[type=reset]:hover, input[type=reset]:focus, input[type=submit]:hover, input[type=submit]:focus { background: #ef562f; cursor: pointer; } button:focus, input[type=button]:focus, input[type=reset]:focus, input[type=submit]:focus { outline: thin dotted; outline-offset: -4px; } input[type=date], input[type=time], input[type=datetime-local], input[type=week], input[type=month], input[type=text], input[type=email], input[type=url], input[type=password], input[type=search], input[type=tel], input[type=number], textarea, select { background: #f7f7f7; background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)); border: 1px solid #d1d1d1; border-radius: 2px; color: #686868; margin-bottom: 0.5rem; padding: 10px; width: 100%; } input[type=date]:focus, input[type=time]:focus, input[type=datetime-local]:focus, input[type=week]:focus, input[type=month]:focus, input[type=text]:focus, input[type=email]:focus, input[type=url]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=number]:focus, textarea:focus, select:focus { background: #fff; color: #1b1b1b; outline: 0; /* add a nice focus glow */ box-shadow: 0 0 4px rgba(195, 195, 195, 1); border: 1px solid rgba(195, 195, 195, 0.8); } .post-password-form { margin-bottom: 1.75em; } .post-password-form label { color: #686868; display: block; font-family: Montserrat, "Helvetica Neue", sans-serif; font-size: 13px; font-size: 0.8125rem; letter-spacing: 0.076923077em; line-height: 1.6153846154; margin-bottom: 1.75em; text-transform: uppercase; } .post-password-form input[type=password] { margin-top: 0.4375em; } .post-password-form > :last-child { margin-bottom: 0; } .search-form { position: relative; } /*-------------------------------------------------------------- # Infinite scroll --------------------------------------------------------------*/ /* Globally hidden elements when Infinite Scroll is supported and in use. */ .infinite-scroll .posts-navigation, .infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */ display: none; } /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */ .infinity-end.neverending .site-footer { display: block; } /*-------------------------------------------------------------- # Bootstrap 4 Grid and Layout --------------------------------------------------------------*/ /*! * Bootstrap v4.0.0-beta (https://getbootstrap.com) * Copyright 2011-2017 The Bootstrap Authors * Copyright 2011-2017 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ .container, .container-fluid { margin-right: auto; margin-left: auto; padding-right: 20px; padding-left: 20px; width: 100% } @-ms-viewport { width: device-width } html { box-sizing: border-box; -ms-overflow-style: scrollbar } *, ::after, ::before { box-sizing: inherit } @media (min-width:576px) { .container { max-width: 540px } } @media (min-width:768px) { .container { max-width: 720px } } @media (min-width:992px) { .container { max-width: 960px } } @media (min-width:1200px) { .container { max-width: 1200px } } .row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -20px; margin-left: -20px } .no-gutters { margin-right: 0; margin-left: 0 } .no-gutters > .col, .no-gutters > [class*=col-] { padding-right: 0; padding-left: 0 } .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { position: relative; width: 100%; min-height: 1px; padding-right: 20px; padding-left: 20px } .col { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .col-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333% } .col-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667% } .col-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .col-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333% } .col-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667% } .col-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .col-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333% } .col-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667% } .col-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .col-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333% } .col-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667% } .col-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } .order-1 { -ms-flex-order: 1; order: 1 } .order-2 { -ms-flex-order: 2; order: 2 } .order-3 { -ms-flex-order: 3; order: 3 } .order-4 { -ms-flex-order: 4; order: 4 } .order-5 { -ms-flex-order: 5; order: 5 } .order-6 { -ms-flex-order: 6; order: 6 } .order-7 { -ms-flex-order: 7; order: 7 } .order-8 { -ms-flex-order: 8; order: 8 } .order-9 { -ms-flex-order: 9; order: 9 } .order-10 { -ms-flex-order: 10; order: 10 } .order-11 { -ms-flex-order: 11; order: 11 } .order-12 { -ms-flex-order: 12; order: 12 } @media (min-width:576px) { .col-sm { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .col-sm-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .col-sm-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333% } .col-sm-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667% } .col-sm-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .col-sm-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333% } .col-sm-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667% } .col-sm-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .col-sm-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333% } .col-sm-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667% } .col-sm-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .col-sm-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333% } .col-sm-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667% } .col-sm-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } .order-sm-1 { -ms-flex-order: 1; order: 1 } .order-sm-2 { -ms-flex-order: 2; order: 2 } .order-sm-3 { -ms-flex-order: 3; order: 3 } .order-sm-4 { -ms-flex-order: 4; order: 4 } .order-sm-5 { -ms-flex-order: 5; order: 5 } .order-sm-6 { -ms-flex-order: 6; order: 6 } .order-sm-7 { -ms-flex-order: 7; order: 7 } .order-sm-8 { -ms-flex-order: 8; order: 8 } .order-sm-9 { -ms-flex-order: 9; order: 9 } .order-sm-10 { -ms-flex-order: 10; order: 10 } .order-sm-11 { -ms-flex-order: 11; order: 11 } .order-sm-12 { -ms-flex-order: 12; order: 12 } } @media (min-width:768px) { .col-md { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .col-md-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .col-md-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333% } .col-md-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667% } .col-md-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .col-md-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333% } .col-md-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667% } .col-md-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .col-md-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333% } .col-md-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667% } .col-md-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .col-md-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333% } .col-md-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667% } .col-md-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } .order-md-1 { -ms-flex-order: 1; order: 1 } .order-md-2 { -ms-flex-order: 2; order: 2 } .order-md-3 { -ms-flex-order: 3; order: 3 } .order-md-4 { -ms-flex-order: 4; order: 4 } .order-md-5 { -ms-flex-order: 5; order: 5 } .order-md-6 { -ms-flex-order: 6; order: 6 } .order-md-7 { -ms-flex-order: 7; order: 7 } .order-md-8 { -ms-flex-order: 8; order: 8 } .order-md-9 { -ms-flex-order: 9; order: 9 } .order-md-10 { -ms-flex-order: 10; order: 10 } .order-md-11 { -ms-flex-order: 11; order: 11 } .order-md-12 { -ms-flex-order: 12; order: 12 } } @media (min-width:992px) { .col-lg { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .col-lg-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .col-lg-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333% } .col-lg-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667% } .col-lg-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .col-lg-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333% } .col-lg-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667% } .col-lg-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .col-lg-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333% } .col-lg-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667% } .col-lg-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .col-lg-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333% } .col-lg-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667% } .col-lg-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } .order-lg-1 { -ms-flex-order: 1; order: 1 } .order-lg-2 { -ms-flex-order: 2; order: 2 } .order-lg-3 { -ms-flex-order: 3; order: 3 } .order-lg-4 { -ms-flex-order: 4; order: 4 } .order-lg-5 { -ms-flex-order: 5; order: 5 } .order-lg-6 { -ms-flex-order: 6; order: 6 } .order-lg-7 { -ms-flex-order: 7; order: 7 } .order-lg-8 { -ms-flex-order: 8; order: 8 } .order-lg-9 { -ms-flex-order: 9; order: 9 } .order-lg-10 { -ms-flex-order: 10; order: 10 } .order-lg-11 { -ms-flex-order: 11; order: 11 } .order-lg-12 { -ms-flex-order: 12; order: 12 } } @media (min-width:1200px) { .col-xl { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .col-xl-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .col-xl-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333% } .col-xl-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667% } .col-xl-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .col-xl-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333% } .col-xl-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667% } .col-xl-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .col-xl-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333% } .col-xl-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667% } .col-xl-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .col-xl-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333% } .col-xl-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667% } .col-xl-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } .order-xl-1 { -ms-flex-order: 1; order: 1 } .order-xl-2 { -ms-flex-order: 2; order: 2 } .order-xl-3 { -ms-flex-order: 3; order: 3 } .order-xl-4 { -ms-flex-order: 4; order: 4 } .order-xl-5 { -ms-flex-order: 5; order: 5 } .order-xl-6 { -ms-flex-order: 6; order: 6 } .order-xl-7 { -ms-flex-order: 7; order: 7 } .order-xl-8 { -ms-flex-order: 8; order: 8 } .order-xl-9 { -ms-flex-order: 9; order: 9 } .order-xl-10 { -ms-flex-order: 10; order: 10 } .order-xl-11 { -ms-flex-order: 11; order: 11 } .order-xl-12 { -ms-flex-order: 12; order: 12 } } /* hidden visible */ .d-none { display: none !important; } /* vertical-align elements */ .align-items-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-self-center { -ms-flex-item-align: center !important; align-self: center !important; } /* boxes layout for equal height columns */ .row-eq-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } /* split row columns */ .w-100 { width: 100% !important; } /*-------------------------------------------------------------- # Media Queries --------------------------------------------------------------*/ /* Extra small devices (portrait phones, 480px and up) */ @media (min-width: 480px) { html, body { font-size: 90%; } } /* Small devices (landscape phones, 576px and up) */ @media (min-width: 576px) { html, body { font-size: 95%; } #attachment-description { max-width: 95%; } .d-sm-none { display: none !important; } .d-sm-block { display: block !important; } #banner figcaption.wp-caption-text { display: block; } } /* Medium devices (tablets, 768px and up) */ @media (min-width: 768px) { html, body { font-size: 98%; } .d-md-none { display: none !important; } .d-md-block { display: block !important; } .menu-toggle { font-size: 1rem; margin: 1.313rem 0; padding: 0.75em 0.875rem 0.688rem; } #site-branding { display: block; } #topbar-left { padding-left: 0; text-align: left; } #topbar-right { padding-right: 0; text-align: right } /* main menu */ #nav-wrapper { display: block; clear: both; z-index: 1000; } .site-header-menu { display: block; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } .main-navigation { max-width: 1170px; margin: 0 -0.813rem 0 0; } .main-navigation ul { display: table; list-style: none; margin: 0 auto; padding: 0; } .main-navigation .primary-menu, .main-navigation .primary-menu > li { border: 0; } .main-navigation .primary-menu > li { float: left; padding: 0; } .main-navigation a { outline-offset: -8px; padding: 0.813rem; white-space: nowrap; } .main-navigation li:hover > a, .main-navigation li.focus > a { color: #fff; } .site-header2 .main-navigation li:hover > a, .site-header2 .main-navigation li.focus > a { color: #f5f2ed; } .main-navigation ul ul { background: #1b1b1b; display: block; left: -999em; margin: 0; padding: 1rem 0.75rem; position: absolute; text-align: right; z-index: 1000; } .main-navigation ul .toggled-on { text-align: right; } .main-navigation ul ul ul { top: -2px; } .main-navigation ul ul li { border-bottom-width: 0; } .main-navigation ul ul a { white-space: normal; width: 12.5rem; padding: 9px 8px 10px; } .main-navigation ul ul a:hover { color: #fff; } .main-navigation li:hover > ul, .main-navigation li.focus > ul { left: auto; right: -0.25rem; /* show the animated submenu on hover */ opacity: 1; transition-delay: 0s; } .main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul { left: auto; right: 100%; } .main-navigation .menu-item-has-children > a { margin: 0; } .main-navigation ul ul .menu-item-has-children > a { padding-right: 0.875rem; } .dropdown-toggle, .main-navigation ul .dropdown-toggle.toggled-on, .menu-toggle, .site-footer .main-navigation { display: none; } /* top bar */ #topbar-left { padding-left: 2.25rem; text-align: left; } #topbar-right { padding-right: 2.625rem; text-align: right; } /* end main menu */ #error-box { max-width: 80%; } #error-type { font-size: 10rem; } #error-text { font-size: 2rem; } #error-content { font-size: 1.25rem; max-width: 70%; } .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%; } blockquote.alignleft, blockquote.alignright { display: inline; max-width: 50%; } .related-post-thumbnail { margin-bottom: 0; } #banner .wp-caption-text { display: initial; } } /* Large devices (desktops, 992px and up) */ @media (min-width: 992px) { html, body { font-size: 100%; } #masthead { padding: 0.75rem 4.5rem; } .site-header { display: -webkit-flex; display: flex; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .default-page #page-intro { max-width: 70%; } #site-branding { text-align: left; display: inline-block; } #nav-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-preferred-size: auto; flex-basis: auto; /* positions menu to the right */ margin-left: auto; margin: 0 -0.375rem 0 auto; } #nav-wrapper ul.primary-menu { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin-right: auto; } .d-lg-none { display: none !important; } .d-lg-block { display: block !important; } #topbar { padding: 5px; } #topbar-right form.search-form { float: right; margin: 0; } #content-area { margin: 0 10%; padding: 2rem 0; } .social-menu { text-align: left; } #site-footer .social-menu { text-align: right; } blockquote:before { top: 4rem; } .copyright { padding: 1rem 0; text-align: left; } .footer-social { padding: 1rem 0; text-align: right; } /* Grid Blogs */ .blog-grid .hentry, .blog-grid-left .hentry, .blog-grid-right .hentry { padding: 1rem; } .blog-grid .media-caption, .blog-grid-left .media-caption, .blog-grid-right .media-caption { font-size: 0.75rem; letter-spacing: 1px; } .blog-grid .entry-meta, .blog-grid-left .entry-meta, .blog-grid-right .entry-meta { font-size: 0.75rem; } .blog-grid .entry-title, .blog-grid-left .entry-title, .blog-grid-right .entry-title { font-size: 1.75rem; } .blog-grid .post-author-avatar, .blog-grid-left .post-author-avatar, .blog-grid-right .post-author-avatar { max-width: 25px; } .blog-grid .media-caption-container, .blog-grid-left .media-caption-container, .blog-grid-right .media-caption-container { bottom: 0.25rem; } .blog-grid .featured-media .featured-label, .blog-grid-left .featured-media .featured-label, .blog-grid-right .featured-media .featured-label { padding: 4px 10px; } .blog-grid .featured-media, .blog-grid-left .featured-media, .blog-grid-right .featured-media { margin-bottom: 1.5rem; } /* Minimal blogs */ .blog-minimal-left .hentry, .blog-minimal-right .hentry { display: grid; grid-template-columns: 200px 1fr; grid-column-gap: 2rem; } .blog-minimal-left .post-author-avatar, .blog-minimal-right .post-author-avatar, .blog-minimal-left .featured-label, .blog-minimal-right .featured-label, .blog-minimal-left .media-caption-container, .blog-minimal-right .media-caption-container { display: none; } .blog-minimal-left .entry-title, .blog-minimal-right .entry-title { font-size: 1.813rem; } /* Blog Minimal */ .blog-minimal-left .entry-header, .blog-minimal-right .entry-header { display: grid; } .blog-minimal-left .entry-meta, .blog-minimal-right .entry-meta { font-size: 0.813rem; grid-row-start: 2; margin-bottom: 1.5rem; } .blog-minimal-left .entry-title, .blog-minimal-right .entry-title { margin-bottom: 0.5rem; } /* Featured image */ #featured-image img { display: block; margin: 0; width: 100%; } /* Sidebars */ #blog-sidebar .widget:first-child, #left-sidebar .widget:first-child, #right-sidebar .widget:first-child { padding-top: 0.5rem; } /* Widgets */ .ariele-imagebox-content { padding: 0; left: 1rem; right: 1rem; } /* error page */ #error-box { max-width: 60%; } #error-type { font-size: 10rem; } #attachment-description { max-width: 80%; } } /* Extra large devices (large desktops, 1200px and up) */ @media (min-width: 1200px) { #attachment-description { max-width: 60%; } }