/*! Theme Name: Bezel Theme URI: https://simplefreethemes.com/bezel/ Author: SimpleFreeThemes Author URI: https://simplefreethemes.com/ Description: Bezel is a beautiful, light and elegant WordPress theme that allows your reader to focus on your content. Theme is based on Bootstrap framework grid and is perfect WordPress theme for personal blogs, product reviews, newspapers and magazines. It is simple and flexible theme with easy to use theme options. Bezel is packed with useful features such as responsive design, clean code, site logo, custom menu, translation ready, SEO friendly, Google fonts and easy to customize. Version: 0.1.6 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: bezel Domain Path: /languages/ Tags: two-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, blog, news, holiday This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. _s is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc. Underscores is distributed under the terms of the GNU GPL v2 or later. Resetting and rebuilding styles have been helped along thanks to the fine work of Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/ and Blueprint http://www.blueprintcss.org/ */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- 1.0 - Normalize 2.0 - Font Awesome 3.0 - Typography 3.1 - Global 3.2 - Paragraph 3.3 - Headings 3.4 - Links 3.5 - Blockquote 3.6 - General 4.0 - Elements 4.1 - HR 4.2 - List 4.3 - Table 4.4 - Image 4.5 - HTML5 Elements 4.6 - Forms 5.0 - Accessibility 6.0 - Alignments 7.0 - Clearings 8.0 - Navigation Menus 8.1 - Main Navigation 8.2 - Primary Menu 8.3 - Primary Menu Responsive 9.0 - Navigation Misc 9.1 - Navigation Archives 9.2 - Navigation Post 9.3 - Navigation Comments 9.4 - Navigation Attachments 9.5 - Navigation Common Styles: Comments, Attachments 10.0 - Skeleton 10.1 - Site Wrapper 10.2 - Header 10.3 - Site Branding Wrapper 10.4 - Site Logo 10.5 - Site Branding 10.6 - Site Content 10.7 - Sidebar 10.8 - Footer 11.0 - Content 11.1 - HEntry 11.2 - Page Links 11.3 - More Link 11.4 - Entry Meta 11.5 - Author Info 11.6 - Comments 12.0 - Widgets 12.1 - Search Form Widget 12.2 - Tag Cloud Widget 13.0 - Media 13.1 - Captions 13.2 - Galleries 13.3 - Media Elements 14.0 - Utilities 14.1 - Misc 15.0 - Jetpack 15.1 - WP Stats 16.0 - Media Queries --------------------------------------------------------------*/ /*-------------------------------------------------------------- 1.0 - Normalize --------------------------------------------------------------*/ 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, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; } html { overflow-y: scroll; /* Keeps page centered in all browsers regardless of content height */ -webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */ -ms-text-size-adjust: 100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */ box-sizing: border-box; /* Apply a natural box layout model to the document; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */ } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; } body { background: #fff; /* Fallback for when there is no custom background color defined. */ } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } ol, ul { list-style: none; } table { /* tables still need 'cellspacing="0"' in the markup */ border-collapse: separate; border-spacing: 0; } caption, th, td { font-weight: normal; text-align: left; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } a { background-color: transparent; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } a img { border: 0; } img { border: 0; } svg:not(:root) { overflow: hidden; } /* Forms */ button, input, optgroup, select, textarea { color: inherit; font: inherit; line-height: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-appearance: textfield; box-sizing: border-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } /*-------------------------------------------------------------- 2.0 Font Awesome --------------------------------------------------------------*/ .search-control:before, .toggle-menu-control:before, .sf-arrows .sf-with-ul:after, .primary-menu-responsive .dropdown-toggle:after, .comment-navigation .nav-previous a:before, .comment-navigation .nav-next a:after, .paging-navigation .nav-previous a:before, .paging-navigation .nav-next a:after, .image-navigation .nav-previous a:before, .image-navigation .nav-next a:after, .pagination .prev.page-numbers:before, .pagination .next.page-numbers:after, .post-label:before, .post-format-label a:before, .search-submit:before { display: inline-block; font-family: "FontAwesome"; font-size: 14px; font-size: 0.875rem; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; speak: none; text-align: center; text-decoration: inherit; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /*-------------------------------------------------------------- 3.0 Typography --------------------------------------------------------------*/ /*-------------------------------------------------------------- 3.1 Global --------------------------------------------------------------*/ body { background: #f2f2f0; color: #3d3d3d; font-family: "Open Sans", sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /*-------------------------------------------------------------- 3.2 Paragraph --------------------------------------------------------------*/ p { margin-bottom: 26px; margin-bottom: 1.625rem; } p:last-child { margin-bottom: 0; } /*-------------------------------------------------------------- 3.3 Headings --------------------------------------------------------------*/ h1, h2, h3, h4, h5, h6 { clear: both; color: #020202; font-family: "Montserrat", sans-serif; line-height: 1.3; } h1 { font-size: 32px; font-size: 2rem; margin-bottom: 26px; margin-bottom: 1.625rem; } h2 { font-size: 26px; font-size: 1.625rem; margin-bottom: 26px; margin-bottom: 1.625rem; } h3 { font-size: 23px; font-size: 1.4375rem; margin-bottom: 26px; margin-bottom: 1.625rem; } h4 { font-size: 16px; font-size: 1rem; margin-bottom: 26px; margin-bottom: 1.625rem; } h5 { font-size: 12px; font-size: 0.75rem; margin-bottom: 26px; margin-bottom: 1.625rem; -webkit-text-stroke: .35px; /* Hack to fix thin text in Windows */ } h6 { font-size: 10px; font-size: 0.625rem; margin-bottom: 26px; margin-bottom: 1.625rem; -webkit-text-stroke: .35px; /* Hack to fix thin text in Windows */ } /*-------------------------------------------------------------- 3.4 Links --------------------------------------------------------------*/ a, a:visited { color: #eb684b; text-decoration: none; } a:hover, a:focus, a:active { color: #d96045; } /*-------------------------------------------------------------- 3.5 Blockquote --------------------------------------------------------------*/ blockquote { color: #555; border-left: 6px solid #eb684b; font-family: "Montserrat", sans-serif; font-size: 21px; font-size: 1.3125rem; line-height: 1.3; margin: 0 auto 26px; margin: 0 auto 1.625rem; padding: 15px; padding: 0.9375rem; position: relative; } blockquote blockquote { margin: 15px; margin: 0.9375rem; } blockquote p { margin: 0; } blockquote cite { color: #cccccc; display: block; font-size: 15px; font-size: 0.9375rem; font-style: normal; margin: 15px 0 0; margin: 0.9375rem 0 0; text-transform: uppercase; } blockquote cite a, blockquote cite a:visited { color: #cccccc; } blockquote cite a:hover, blockquote cite a:focus, blockquote cite a:active { color: #999999; } blockquote:last-child { margin-bottom: 0; } /*-------------------------------------------------------------- 3.6 General --------------------------------------------------------------*/ b, strong { font-weight: bold; } dfn, cite, em, i { font-style: italic; } abbr, acronym { border-bottom: 1px dotted #ebebeb; cursor: help; } mark { background: #fcf8e3; padding: 2px 4px; padding: 0.125rem 0.25rem; text-decoration: none; } sup, sub { font-size: 75%; height: 0; line-height: 0; position: relative; vertical-align: baseline; } sup { bottom: 1ex; } sub { top: .5ex; } small { font-size: 75%; } big { font-size: 125%; } cite { font-size: 12px; font-size: 0.75rem; font-style: normal; text-transform: uppercase; } address { font-style: italic; margin: 0 0 26px; margin: 0 0 1.625rem; } address:last-child { margin-bottom: 0; } code, kbd, samp, tt, var { font-family: Menlo, Monaco, Consolas, "Courier New", monospace; font-size: 12px; font-size: 0.75rem; } kbd { background-color: #020202; border-radius: 2px; box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25); color: #fff; font-size: 90%; padding: 2px 4px; padding: 0.125rem 0.25rem; } kbd kbd { box-shadow: none; font-size: 100%; font-weight: bold; padding: 0; } pre { background: #fafafa; border: 1px dashed #ebebeb; color: #020202; font-family: Menlo, Monaco, Consolas, "Courier New", monospace; font-size: 12px; font-size: 0.75rem; margin: 0 0 26px; margin: 0 0 1.625rem; max-width: 100%; overflow: auto; padding: 15px; padding: 0.9375rem; } pre:last-child { margin-bottom: 0; } /*-------------------------------------------------------------- 4.0 Elements --------------------------------------------------------------*/ /*-------------------------------------------------------------- 4.1 HR --------------------------------------------------------------*/ hr { background-color: #ebebeb; border: 0; height: 1px; margin: 0 auto 26px; margin: 0 auto 1.625rem; width: 80%; } /*-------------------------------------------------------------- 4.2 List --------------------------------------------------------------*/ ul, ol { margin: 0 0 26px 26px; margin: 0 0 1.625rem 1.625rem; } ul:last-child, ol:last-child { margin-bottom: 0; } ul { list-style: disc; } ul ul { list-style: circle; } ul ul ul { list-style: square; } ol { list-style: decimal; } ol ol { list-style: upper-alpha; } ol ol ol { list-style: lower-roman; } ol ol ol ol { list-style: lower-alpha; } li > ul, li > ol { margin-bottom: 0; margin-left: 26px; margin-left: 1.625rem; } dt { font-weight: bold; } dd { margin: 0 26px 26px; margin: 0 1.625rem 1.625rem; } /*-------------------------------------------------------------- 4.3 Table --------------------------------------------------------------*/ /* Table Reboot */ table { table-layout: fixed; /* Prevents HTML tables from becoming too wide */ } /* Table Styles */ table { background-color: transparent; border-spacing: 0; border-collapse: collapse; min-width: 100%; margin-bottom: 26px; margin-bottom: 1.625rem; } table caption { margin-bottom: 15px; margin-bottom: 0.9375rem; } table th, table td { padding: 8px; padding: 0.5rem; line-height: 1.5; vertical-align: top; border-top: 1px solid #ebebeb; } table thead th { vertical-align: bottom; border-bottom: 2px solid #ebebeb; font-weight: 700; } table tbody + tbody { border-top: 2px solid #ebebeb; } table table { background-color: #fafafa; } table:last-child { margin-bottom: 0; } /* Table Responsive */ .table-responsive { display: block; margin-bottom: 26px; margin-bottom: 1.625rem; width: 100%; overflow-x: auto; } .table-responsive:last-child { margin-bottom: 0; } /*-------------------------------------------------------------- 4.4 Image --------------------------------------------------------------*/ img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ vertical-align: middle; } img.alignright, img.alignleft { max-width: 110px; } img.alignright { margin: 0 0 15px 20px; margin: 0 0 0.9375rem 1.25rem; } img.alignleft { margin: 0 20px 15px 0; margin: 0 1.25rem 0.9375rem 0; } .img-responsive { display: block; height: auto; max-width: 100%; } /*-------------------------------------------------------------- 4.5 HTML5 Elements --------------------------------------------------------------*/ figure { margin: 0; } embed, iframe, object, audio, canvas, progress, video { max-width: 100%; } /*-------------------------------------------------------------- 4.6 Forms --------------------------------------------------------------*/ /* Form Reboot */ button, input, select, textarea { font-size: 100%; line-height: inherit; margin: 0; max-width: 100%; } input, textarea { background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)); } input:focus, textarea:focus { outline: 0; } input[type="search"] { -webkit-appearance: none; } fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } legend { display: block; white-space: normal; width: 100%; padding: 0; margin-bottom: .5rem; font-size: 1.5rem; line-height: inherit; } ::-webkit-input-placeholder { color: #999; } :-moz-placeholder { color: #999; } ::-moz-placeholder { color: #999; opacity: 1; } :-ms-input-placeholder { color: #999; } /* Form Styles */ button, input[type="button"], input[type="reset"], input[type="submit"] { background: #eb684b; border: 1px solid #d96045; color: #fff; cursor: pointer; display: inline-block; font-size: 12px; font-size: 0.75rem; line-height: normal; padding: 12px 24px; padding: 0.75rem 1.5rem; text-transform: uppercase; text-decoration: none; -webkit-appearance: button; } button:hover, button:focus, button:active, input[type="button"]:hover, input[type="button"]:focus, input[type="button"]:active, input[type="reset"]:hover, input[type="reset"]:focus, input[type="reset"]:active, input[type="submit"]:hover, input[type="submit"]:focus, input[type="submit"]:active { background: #d96045; color: #fff; outline: none; } button:active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active { bottom: -2px; } input[type="text"], input[type="number"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], select, textarea { color: #020202; border: 1px solid #ebebeb; border-radius: 2px; } input[type="text"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, select:focus, textarea:focus { color: #020202; } input[type="text"], input[type="number"], input[type="email"], input[type="url"], input[type="password"], input[type="search"] { padding: 8px 10px; padding: 0.5rem 0.625rem; } select { padding: 8px 10px; padding: 0.5rem 0.625rem; width: 98%; } textarea { padding: 8px 10px; padding: 0.5rem 0.625rem; resize: vertical; vertical-align: top; width: 98%; } /*-------------------------------------------------------------- 5.0 Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers */ .says, .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute !important; width: 1px; /* many screen reader and browser combinations announce broken words as they would appear visually */ word-wrap: normal !important; } .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; padding: 0.9375rem 1.4375rem 0.875rem; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /* must have higher specificity than alternative color schemes inline styles */ .site .skip-link { background-color: #f1f1f1; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.2); color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: 700; left: -9999em; outline: none; padding: 15px 23px 14px; padding: 0.9375rem 1.4375rem 0.875rem; text-decoration: none; text-transform: none; top: -9999em; } .logged-in .site .skip-link { box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.2); } .site .skip-link:focus { clip: auto; height: auto; left: 6px; top: 7px; width: auto; z-index: 100000; } /*-------------------------------------------------------------- 6.0 Alignments --------------------------------------------------------------*/ .alignright { display: inline; float: right; margin: 0 0 15px 15px; margin: 0 0 0.9375rem 0.9375rem; } .alignleft { display: inline; float: left; margin: 0 15px 15px 0; margin: 0 0.9375rem 0.9375rem 0; } .aligncenter { clear: both; display: block; margin: 0 auto; } /*-------------------------------------------------------------- 7.0 Clearings --------------------------------------------------------------*/ .clear:before, .clear:after, .site-wrapper:before, .site-wrapper:after, .site-header:before, .site-header:after, .site-branding:before, .site-branding:after, .main-navigation:before, .main-navigation:after, .navigation:before, .navigation:after, .nav-links:before, .nav-links:after, .site-content:before, .site-content:after, .site-main:before, .site-main:after, .sidebar:before, .sidebar:after, .hentry:before, .hentry:after, .post-content-wrapper-single:before, .post-content-wrapper-single:after, .entry-data-wrapper-single:before, .entry-data-wrapper-single:after, .entry-content:before, .entry-content:after, .widget:before, .widget:after, .site-footer:before, .site-footer:after, .site-info:before, .site-info:after, .site-info-inside:before, .site-info-inside:after, .comment-body:before, .comment-body:after, .comment-meta:before, .comment-meta:after, .comment-content:before, .comment-content:after { content: " "; display: table; } .clear:after, .site-wrapper:after, .site-header:after, .site-branding:after, .main-navigation:after, .navigation:after, .nav-links:after, .site-content:after, .site-main:after, .sidebar:after, .hentry:after, .post-content-wrapper-single:after, .entry-data-wrapper-single:after, .entry-content:after, .widget:after, .site-footer:after, .site-info:after, .site-info-inside:after, .comment-body:after, .comment-meta:after, .comment-content:after { clear: both; } /*-------------------------------------------------------------- 8.0 Navigation Menus --------------------------------------------------------------*/ /*-------------------------------------------------------------- 8.1 Main Navigation --------------------------------------------------------------*/ /* Main navigation */ .main-navigation { display: none; } /*-------------------------------------------------------------- 8.2 Primary Menu --------------------------------------------------------------*/ /* Primary Menu */ .site-primary-menu { /* No need of style for xs devices. */ } /*-------------------------------------------------------------- 8.3 Primary Menu Responsive --------------------------------------------------------------*/ /* Toogle Menu */ .toggle-menu-wrapper { margin: 15px 0 0; margin: 0.9375rem 0 0; text-align: center; } .toggle-menu-wrapper a, .toggle-menu-wrapper a:visited { color: #eb684b; transition: all .25s ease-out; } .toggle-menu-wrapper a:hover, .toggle-menu-wrapper a:focus, .toggle-menu-wrapper a:active { color: #d96045; } .toggle-menu-wrapper a:before { content: "\f0c9"; font-size: 25px; font-size: 1.5625rem; vertical-align: middle; } .has-custom-header .site-header .toggle-menu-wrapper a, .has-custom-header .site-header .toggle-menu-wrapper a:visited { align-items: center; background: #fff; border: 1px solid #eee; border-radius: 50%; color: #242424; display: inline-flex; justify-content: center; width: 40px; height: 40px; transition: all .25s ease-out; } .has-custom-header .site-header .toggle-menu-wrapper a:hover, .has-custom-header .site-header .toggle-menu-wrapper a:focus, .has-custom-header .site-header .toggle-menu-wrapper a:active { border: 1px solid #242424; color: #eb684b; } /* Site Primary Menu Responsive */ .site-primary-menu-responsive { background: #141414; color: #fff; display: none; margin: 0; overflow: hidden; overflow-y: auto; padding: 30px; padding: 1.875rem; position: relative; transition: all 0.3s ease; } .site-primary-menu-responsive.show { display: block; } .site-primary-menu-responsive .primary-menu-responsive-close { color: #eb684b; cursor: pointer; font-size: 35px; font-size: 2.1875rem; line-height: 1; position: absolute; top: 5px; right: 15px; } .site-primary-menu-responsive .primary-menu-responsive-close:hover { color: #d96045; } /* Primary Menu Responsive */ .primary-menu-responsive { list-style: none; margin: 0 auto; padding: 0; } .primary-menu-responsive * { list-style: none; margin: 0; padding: 0; } .primary-menu-responsive ul { display: none; margin-left: 24px; margin-left: 1.5rem; } .primary-menu-responsive ul.toggle-on { display: block; } .primary-menu-responsive li { position: relative; word-wrap: break-word; white-space: normal; } .primary-menu-responsive li.current_page_item > a, .primary-menu-responsive li.current-menu-item > a, .primary-menu-responsive li.current_page_ancestor > a, .primary-menu-responsive li.current-menu-ancestor > a, .primary-menu-responsive li.current_page_parent > a, .primary-menu-responsive li.current-menu-parent > a { color: #eb684b; } .primary-menu-responsive a, .primary-menu-responsive a:visited { color: #ddd; display: block; font-size: 16px; font-size: 1rem; padding: 8px 0; padding: 0.5rem 0; } .primary-menu-responsive a:hover, .primary-menu-responsive a:focus, .primary-menu-responsive a:active { color: #aaa; } .primary-menu-responsive .dropdown-toggle { background: transparent; border: none; position: absolute; top: 0; right: 0; width: 40px; height: 40px; } .primary-menu-responsive .dropdown-toggle:after { font-size: 16px; font-size: 1rem; color: #fff; content: "\f078"; } .primary-menu-responsive .dropdown-toggle.toggle-on:after { content: "\f077"; color: #eb684b; } .primary-menu-responsive .page_item_has_children > a, .primary-menu-responsive .menu-item-has-children > a { padding-right: 40px; padding-right: 2.5rem; } /*-------------------------------------------------------------- 9.0 Navigation Misc --------------------------------------------------------------*/ /*-------------------------------------------------------------- 9.1 Navigation Archives --------------------------------------------------------------*/ .pagination { font-size: 0px; margin: 15px 0 0; margin: 0.9375rem 0 0; overflow: hidden; text-align: center; } .pagination .page-numbers { background: #020202; color: #fff; display: inline-block; font-size: 14px; font-size: 0.875rem; margin: 2px 1px; margin: 0.125rem 0.0625rem; padding: 9px 14px; padding: 0.5625rem 0.875rem; text-transform: uppercase; text-decoration: none; transition: all .25s ease-out; } .pagination .page-numbers:hover { background: #eb684b; color: #fff; } .pagination .current.page-numbers { background: #eb684b; color: #fff; font-weight: 700; } .pagination .prev.page-numbers:before, .pagination .next.page-numbers:after { font-size: 14px; font-size: 0.875rem; } .pagination .prev.page-numbers:before { content: "\f053"; } .pagination .next.page-numbers:after { content: "\f054"; } /*-------------------------------------------------------------- 9.2 Navigation Post --------------------------------------------------------------*/ .post-navigation { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; font-size: 15px; font-size: 0.9375rem; line-height: 1.5; margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 30px; padding: 1.875rem; position: relative; width: 100%; } .post-navigation .nav-next { margin: 30px 0 0; margin: 1.875rem 0 0; } .post-navigation a, .post-navigation a:visited { color: #020202; display: block; padding: 0; position: relative; transition: all .25s ease-out; } .post-navigation a:hover, .post-navigation a:focus, .post-navigation a:active { color: #eb684b; } .post-navigation .meta-nav { color: #eb684b; display: block; font-size: 23px; font-size: 1.4375rem; font-weight: 700; line-height: 1; margin: 0 0 10px; margin: 0 0 0.625rem; text-transform: uppercase; } /*-------------------------------------------------------------- 9.3 Navigation Comments --------------------------------------------------------------*/ .comment-navigation { margin: 0; overflow: hidden; text-align: center; } .comment-navigation.comment-navigation-above, .comment-navigation.comment-navigation-below { margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 0; } /*-------------------------------------------------------------- 9.4 Navigation Attachments --------------------------------------------------------------*/ .image-navigation { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 30px; padding: 1.875rem; position: relative; overflow: hidden; text-align: center; } /*-------------------------------------------------------------- 9.5 Navigation Common Styles: Comments, Attachments --------------------------------------------------------------*/ .comment-navigation .nav-previous, .comment-navigation .nav-next, .image-navigation .nav-previous, .image-navigation .nav-next { display: inline-block; margin: 0 1px; padding: 0; } .comment-navigation .nav-previous a, .comment-navigation .nav-previous a:visited, .comment-navigation .nav-next a, .comment-navigation .nav-next a:visited, .image-navigation .nav-previous a, .image-navigation .nav-previous a:visited, .image-navigation .nav-next a, .image-navigation .nav-next a:visited { color: #999; display: block; font-size: 13px; font-size: 0.8125rem; margin: 0 15px; margin: 0 0.9375rem; padding: 0; text-transform: uppercase; } .comment-navigation .nav-previous a:hover, .comment-navigation .nav-previous a:focus, .comment-navigation .nav-previous a:active, .comment-navigation .nav-next a:hover, .comment-navigation .nav-next a:focus, .comment-navigation .nav-next a:active, .image-navigation .nav-previous a:hover, .image-navigation .nav-previous a:focus, .image-navigation .nav-previous a:active, .image-navigation .nav-next a:hover, .image-navigation .nav-next a:focus, .image-navigation .nav-next a:active { color: #d96045; } .comment-navigation .nav-previous .meta-nav, .comment-navigation .nav-next .meta-nav, .image-navigation .nav-previous .meta-nav, .image-navigation .nav-next .meta-nav { display: none; } .comment-navigation .nav-previous a:before, .image-navigation .nav-previous a:before { color: #d96045; content: "\f053"; margin: 0 5px 0 0; margin: 0 0.3125rem 0 0; } .comment-navigation .nav-next a:after, .image-navigation .nav-next a:after { color: #d96045; content: "\f054"; margin: 0 0 0 5px; margin: 0 0 0 0.3125rem; } /*-------------------------------------------------------------- 10.0 Skeleton --------------------------------------------------------------*/ /*-------------------------------------------------------------- 10.1 Site Wrapper --------------------------------------------------------------*/ .site-wrapper { position: relative; } /*-------------------------------------------------------------- 10.2 Header --------------------------------------------------------------*/ .site-header { background: #fff; border-bottom: 1px solid #eee; margin: 0; min-height: 70px; padding: 15px 0; padding: 0.9375rem 0; position: relative; } .site-header .site-header-inside { position: relative; } /*-------------------------------------------------------------- 10.3 Site Branding Wrapper --------------------------------------------------------------*/ .site-branding-wrapper { align-items: center; display: flex; flex-direction: column; justify-content: center; margin: 0 auto; overflow: hidden; width: 100%; min-height: 40px; } /*-------------------------------------------------------------- 10.4 Site Logo --------------------------------------------------------------*/ .custom-logo { width: auto; max-height: 100px; margin: 0; padding: 0; } /*-------------------------------------------------------------- 10.5 Site Branding --------------------------------------------------------------*/ .has-site-branding .site-branding { margin: 0; padding: 0; overflow: hidden; text-align: center; } .wp-custom-logo.has-site-branding .site-branding { margin: 10px 0 0; margin: 0.625rem 0 0; } .site-title { font-size: 36px; font-size: 2.25rem; font-weight: 700; margin: 0; padding: 0; text-transform: uppercase; word-wrap: break-word; } .site-title a, .site-title a:visited { color: #020202; text-decoration: none; } .site-title a:hover, .site-title a:focus, .site-title a:active { color: #666; } .site-description { color: #666; font-family: "Open Sans", sans-serif; font-size: 12px; font-size: 0.75rem; line-height: 1.6; margin: 0; padding: 0; word-wrap: break-word; } /*-------------------------------------------------------------- 10.6 Site Content --------------------------------------------------------------*/ .site-content { margin: 0; padding: 15px 0; padding: 0.9375rem 0; } /*-------------------------------------------------------------- 10.7 Sidebar --------------------------------------------------------------*/ .sidebar { margin: 30px 0 0; margin: 1.875rem 0 0; position: relative; } /*-------------------------------------------------------------- 10.8 Footer --------------------------------------------------------------*/ /* Site Footer */ .site-footer { position: relative; } /* Site info */ .site-info { background: #020202; padding: 30px 0; padding: 1.875rem 0; } /* Credits */ .credits { color: #ddd; font-size: 12px; font-size: 0.75rem; text-align: center; } .credits a, .credits a:visited { color: #ddd; } .credits a:hover, .credits a:focus, .credits a:active { color: #aaa; } .credits .copyright { margin-bottom: 5px; margin-bottom: 0.3125rem; } /* Credits */ .credits-wrapper { position: relative; } .credits-wrapper .credits-blog { color: #ddd; font-size: 14px; font-size: 0.875rem; text-align: center; } .credits-wrapper .credits-blog a, .credits-wrapper .credits-blog a:visited { color: #ddd; } .credits-wrapper .credits-blog a:hover, .credits-wrapper .credits-blog a:focus, .credits-wrapper .credits-blog a:active { color: #aaa; } .credits-wrapper .credits-designer { color: #aaa; font-size: 12px; font-size: 0.75rem; margin-top: 5px; margin-top: 0.3125rem; text-align: center; } .credits-wrapper .credits-designer a, .credits-wrapper .credits-designer a:visited { color: #aaa; } .credits-wrapper .credits-designer a:hover, .credits-wrapper .credits-designer a:focus, .credits-wrapper .credits-designer a:active { color: #ddd; } /*-------------------------------------------------------------- 11.0 Content --------------------------------------------------------------*/ /*-------------------------------------------------------------- 11.1 HEntry --------------------------------------------------------------*/ .sticky { /* Sticky post is enhanced with a special icon */ } /* Entry (Posts,Pages) Block */ .hentry { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 0 0 15px; margin: 0 0 0.9375rem; padding: 0; position: relative; } .sidebar-widget-area .hentry { border: none; margin: 0; padding: 0; } /* Entry Image Wrapper Archive */ .entry-image-wrapper-archive { background-color: #ededeb; } .entry-image-wrapper-archive img { margin: 0 auto; } /* Entry Data Wrapper Single/Archive */ .entry-data-wrapper-archive, .entry-data-wrapper-single { padding: 30px; padding: 1.875rem; } /* Page Content Block */ .page-content { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 0; padding: 30px; padding: 1.875rem; position: relative; word-wrap: break-word; } /* Entry Header & Title (Posts,Pages) */ .entry-header-wrapper { margin: 0 0 15px; margin: 0 0 0.9375rem; } .entry-header { margin: 0 0 10px; margin: 0 0 0.625rem; padding: 0; } .entry-title { clear: none; font-size: 26px; font-size: 1.625rem; line-height: 1.2; margin: 0; padding: 0; word-wrap: break-word; } /* Page Header & Title */ .page-header { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 0 0 15px; margin: 0 0 0.9375rem; padding: 30px; padding: 1.875rem; position: relative; } .page-title { clear: none; font-size: 26px; font-size: 1.625rem; line-height: 1.2; margin: 0; padding: 0; word-wrap: break-word; } .page-title span { color: #eb684b; } .taxonomy-description { color: #999; font-size: 14px; font-size: 0.875rem; margin: 5px 0 0; margin: 0.3125rem 0 0; } /* Entry & Page Title Colors */ .entry-title a, .entry-title a:visited, .page-title a, .page-title a:visited { color: #020202; } .entry-title a:hover, .entry-title a:focus, .entry-title a:active, .page-title a:hover, .page-title a:focus, .page-title a:active { color: #d96045; } /* Entry Summary */ .entry-summary, .entry-summary p { margin: 0 0 30px; margin: 0 0 1.875rem; padding: 0; word-wrap: break-word; } /* Entry Content */ .entry-content { margin: 0; padding: 0; word-wrap: break-word; } /* Entry Attachment */ .entry-attachment { margin: 0 0 30px; margin: 0 0 1.875rem; } /* Entry, Page & Comment Content */ .entry-content h1:first-child, .entry-content h2:first-child, .entry-content h3:first-child, .entry-content h4:first-child, .entry-content h5:first-child, .entry-content h6:first-child, .entry-summary h1:first-child, .entry-summary h2:first-child, .entry-summary h3:first-child, .entry-summary h4:first-child, .entry-summary h5:first-child, .entry-summary h6:first-child, .page-content h1:first-child, .page-content h2:first-child, .page-content h3:first-child, .page-content h4:first-child, .page-content h5:first-child, .page-content h6:first-child, .comment-content h1:first-child, .comment-content h2:first-child, .comment-content h3:first-child, .comment-content h4:first-child, .comment-content h5:first-child, .comment-content h6:first-child { margin-top: 0; } /*-------------------------------------------------------------- 11.2 Page Links --------------------------------------------------------------*/ .page-links { clear: both; font-size: 0px; margin: 0; padding: 0; } .page-links a, .page-links > span { background: #ebebeb; color: #020202; display: inline-block; font-size: 14px; font-size: 0.875rem; line-height: 1; margin: 0 1px; margin: 0 0.0625rem; padding: 10px 14px; padding: 0.625rem 0.875rem; text-align: center; text-transform: uppercase; text-decoration: none; transition: all .25s ease-out; } .page-links a { color: #020202; text-decoration: none; } .page-links a:hover { background: #eb684b; color: #fff; font-weight: 700; } .page-links > span { background: #eb684b; color: #fff; } .page-links .page-links-title { background: transparent; border: none; color: #666; display: none; font-size: 14px; font-size: 0.875rem; margin: 0; padding: 0 7px 0 0; padding: 0 0.4375rem 0 0; } /*-------------------------------------------------------------- 11.3 More Link --------------------------------------------------------------*/ .more-link, .more-link:visited { background: #eb684b; color: #fff; display: inline-block; font-size: 13px; font-size: 0.8125rem; font-weight: 600; margin: 0; padding: 10px 30px; padding: 0.625rem 1.875rem; text-transform: uppercase; text-decoration: none; transition: all .25s ease-out; } .more-link:hover, .more-link:focus, .more-link:active { background: #d96045; color: #fff; } /*-------------------------------------------------------------- 11.4 Entry Meta --------------------------------------------------------------*/ .entry-meta { color: #999; font-size: 14px; font-size: 0.875rem; text-transform: uppercase; } .entry-meta ul { list-style: none; margin: 0; padding: 0; } .entry-meta ul > li { display: inline-block; margin: 0; padding: 0; } .entry-meta ul > li:before { color: #999; content: "\00b7"; font-size: 14px; font-size: 0.875rem; padding: 0 4px; padding: 0 0.25rem; } .entry-meta ul > li:first-child:before { display: none; } .entry-meta a, .entry-meta a:visited { color: #999; } .entry-meta a:hover, .entry-meta a:focus, .entry-meta a:active { color: #020202; } .entry-meta .posted-on a, .entry-meta .posted-on a:visited { color: #eb684b; } .entry-meta .posted-on a:hover, .entry-meta .posted-on a:focus, .entry-meta .posted-on a:active { color: #d96045; } /* Entry Meta Header */ .entry-meta-header-before { margin: 0 0 5px; margin: 0 0 0.3125rem; } /* Entry Meta Footer */ .entry-meta-footer { margin: 26px 0 0; margin: 1.625rem 0 0; } /* Entry Meta Elements */ .updated:not(.published) { display: none; } /* Post Featured */ .post-label-featured:before { content: "\f08d"; font-size: 12px; font-size: 0.75rem; padding: 0 4px; padding: 0 0.25rem; } /* Tags etc */ .tags-links:before, .edit-link:before { content: ' \2022 '; padding: 0 6px; } /* Entry Meta Single Page/Post */ .page .edit-link:before, .attachment .edit-link:before { display: none; } /*-------------------------------------------------------------- 11.5 Author Info --------------------------------------------------------------*/ .author-info { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 30px; padding: 1.875rem; position: relative; } .author-info .author-avatar { margin: 0 0 15px; margin: 0 0 0.9375rem; padding: 0; } .author-info .avatar { border: 1px solid #ebebeb; padding: 2px; padding: 0.125rem; } .author-info .author-description { font-size: 15px; font-size: 0.9375rem; line-height: 1.5; } .author-info .author-description .author-title { margin: 0 0 20px; margin: 0 0 1.25rem; padding: 0; } /*-------------------------------------------------------------- 11.6 Comments --------------------------------------------------------------*/ #comments { margin: 0 auto; padding: 0; position: relative; width: 100%; } .comments-area-wrapper { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 30px; padding: 1.875rem; position: relative; } .no-comments-wrapper { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 30px; padding: 1.875rem; text-align: center; position: relative; } /* Comments Title */ .comments-title { color: #020202; font-size: 23px; font-size: 1.4375rem; margin: 0; padding: 0; text-transform: uppercase; } /* Comment List */ .comment-list { list-style: none; margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 0; } .comment-list .children { list-style: none; } /* Comment Body */ .comment-list > li > .comment-body, .comment-list > li > .children .comment-body { border-top: 1px solid #ebebeb; margin: 15px 0 0; margin: 0.9375rem 0 0; padding-top: 15px; padding-top: 0.9375rem; position: relative; } .comment-list > li:first-child:not(.bypostauthor) > .comment-body { border-top: none; margin-top: 0; padding-top: 0; } .comment-list .bypostauthor > .comment-body { background: #f2f2f2; border-bottom: 3px solid #eb684b; padding: 15px; padding: 0.9375rem; } /* Comment Avatar */ .comment-list .comment-author .avatar { border: 1px solid #ebebeb; display: block; margin: 0 0 15px; margin: 0 0 0.9375rem; padding: 2px; padding: 0.125rem; } .comment-list .bypostauthor .comment-author .avatar { border: 1px solid #d9d9d9; } .comment-list .comment-author .avatar { width: 68px; height: 68px; } .comment-list .children .comment-author .avatar { width: 50px; height: 50px; } /* Comment Meta */ .comment-list .comment-meta { font-size: 12px; font-size: 0.75rem; margin-bottom: 15px; margin-bottom: 0.9375rem; } .comment-list .comment-content { margin-bottom: 15px; margin-bottom: 0.9375rem; word-wrap: break-word; } .comment-list .reply { font-size: 12px; font-size: 0.75rem; text-transform: uppercase; } .comment-list .comment-author .fn { font-weight: 900; } .comment-list .comment-author .fn a, .comment-list .comment-author .fn a:visited { color: #333; } .comment-list .comment-author .fn a:hover, .comment-list .comment-author .fn a:focus, .comment-list .comment-author .fn a:active { color: #999; } .comment-list .says { display: none; } .comment-list .edit-link { margin-left: 15px; margin-left: 0.9375rem; } .comment-list .comment-awaiting-moderation { color: #d96045; margin-top: 10px; margin-top: 0.625rem; } /* Comment Form */ div#respond { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 15px 0 0; margin: 0.9375rem 0 0; padding: 30px; padding: 1.875rem; position: relative; } .comment-list div#respond { background: #f8f8f8; margin: 15px 0; margin: 0.9375rem 0; padding: 15px; padding: 0.9375rem; position: relative; } div#respond .comment-reply-title { color: #020202; font-size: 23px; font-size: 1.4375rem; line-height: 1; margin: 0 0 15px; margin: 0 0 0.9375rem; } div#respond .comment-notes, div#respond .logged-in-as, div#respond .form-allowed-tags, div#respond .form-allowed-tags code { font-size: 13px; font-size: 0.8125rem; } div#respond .comment-form label { display: block; } div#respond .form-submit { margin: 0; } div#respond .required { color: #c0392b; } div#respond #cancel-comment-reply-link { color: #c0392b; font-size: 12px; font-size: 0.75rem; margin: 0; padding: 10px; padding: 0.625rem; position: absolute; text-transform: uppercase; top: 0; right: 0; } /* Comment Subscription Form */ .comment-subscription-form { font-size: 15px; font-size: 0.9375rem; line-height: 1.5; margin: 30px 0 0; margin: 1.875rem 0 0; padding: 0; } .comment-subscription-form + .comment-subscription-form { margin: 8px 0 0; margin: 0.5rem 0 0; } /*-------------------------------------------------------------- 12.0 Widgets --------------------------------------------------------------*/ .widget { background: #fff; border: solid #dfdfdd; border-width: 0 1px 1px 0; margin: 0 0 15px; margin: 0 0 0.9375rem; padding: 30px; padding: 1.875rem; position: relative; word-wrap: break-word; } .widget:last-child { margin-bottom: 0; } .page-content .widget { margin: 0 0 30px; margin: 0 0 1.875rem; padding: 0; } .page-content .widget:before, .page-content .widget:after { display: none; } .page-content .widget:last-child { margin-bottom: 0; } .widget .widget-title { color: #020202; font-family: "Montserrat", sans-serif; font-size: 18px; font-size: 1.125rem; margin: 0 0 22px; margin: 0 0 1.375rem; padding: 0; text-transform: uppercase; } .widget a, .widget a:visited { color: #3d3d3d; } .widget a:hover, .widget a:focus, .widget a:active { color: #666; } .widget ul, .widget ol { list-style: none; margin: 0; } .widget li > ul, .widget li > ol { margin-bottom: 0; margin-left: 24px; margin-left: 1.5rem; } .widget li, .widget li.hentry { padding: 0 0 15px; padding: 0 0 0.9375rem; position: relative; } .widget li ul, .widget li.hentry ul { margin-top: 9px; margin-top: 0.5625rem; } .widget li li:last-child, .widget li.hentry li:last-child { padding-bottom: 0; } .widget li:last-child, .widget li.hentry:last-child { padding-bottom: 0; } /*-------------------------------------------------------------- 12.1 Search Form Widget --------------------------------------------------------------*/ .search-form { margin: 0; padding: 0; position: relative; } .search-form .search-field { border: 1px solid #eee; height: 50px; padding: 0 20px; padding: 0 1.25rem; text-align: left; width: calc(100% - 60px); } .search-form .search-submit { background: #eb684b; border: 0; color: #fff; display: block; float: right; width: 60px; height: 50px; text-align: center; transition: all .25s ease-out; } .search-form .search-submit:hover { background: #d96045; } .search-form .search-submit:before { content: "\f002"; } /*-------------------------------------------------------------- 12.2 Tag Cloud Widget --------------------------------------------------------------*/ .widget_tag_cloud > div:before, .widget_tag_cloud > div:after { content: ''; display: table; } .widget_tag_cloud > div:after { clear: both; } .widget_tag_cloud a:after { color: #999; content: '\2044'; margin: 0 6px; margin: 0 0.375rem; } .widget_tag_cloud a, .widget_tag_cloud a:visited { float: left; font-size: 16px !important; font-size: 1rem !important; text-decoration: none; transition: all .25s ease-out; } /*-------------------------------------------------------------- 13.0 Media --------------------------------------------------------------*/ .page-content img.wp-smiley, .entry-content img.wp-smiley, .comment-content img.wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /*-------------------------------------------------------------- 13.1 Captions --------------------------------------------------------------*/ /* Attachment Caption */ .entry-caption { color: #999; font-size: 12px; font-size: 0.75rem; font-style: italic; border: 1px solid #eee; margin: 0; padding: 10px; padding: 0.625rem; text-align: center; } /* WP Caption */ .wp-caption { border: 1px solid #eee; margin-bottom: 26px; margin-bottom: 1.625rem; max-width: 100%; } .wp-caption:last-child { margin-bottom: 0; margin-bottom: 0; } .wp-caption img[class*="wp-image-"] { display: block; margin: 0 auto; } .wp-caption .wp-caption-text { color: #999; font-size: 12px; font-size: 0.75rem; font-style: italic; margin: 0; padding: 5px; padding: 0.3125rem; text-align: center; } .wp-caption.alignright, .wp-caption.alignleft { max-width: 110px; } .wp-caption.alignright { margin: 0 0 15px 20px; margin: 0 0 0.9375rem 1.25rem; } .wp-caption.alignleft { margin: 0 20px 15px 0; margin: 0 1.25rem 0.9375rem 0; } /*-------------------------------------------------------------- 13.2 Galleries --------------------------------------------------------------*/ .gallery { margin: 0 0 26px; margin: 0 0 1.625rem; } .gallery .gallery-item { display: inline-block; padding: 1.79104477%; text-align: center; vertical-align: top; width: 100%; } .gallery.gallery-columns-2 .gallery-item { max-width: 50%; } .gallery.gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery.gallery-columns-4 .gallery-item { max-width: 25%; } .gallery.gallery-columns-5 .gallery-item { max-width: 20%; } .gallery.gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery.gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery.gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery.gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery .gallery-icon img { margin: 0 auto; } .gallery .gallery-caption { color: #999; display: block; font-size: 12px; font-size: 0.75rem; padding: 5px 0; padding: 0.3125rem 0; } .gallery.gallery-columns-4 .gallery-caption, .gallery.gallery-columns-5 .gallery-caption, .gallery.gallery-columns-6 .gallery-caption, .gallery.gallery-columns-7 .gallery-caption, .gallery.gallery-columns-8 .gallery-caption, .gallery.gallery-columns-9 .gallery-caption { display: none; } .gallery:last-child { margin: 0; margin: 0; } /*-------------------------------------------------------------- 13.3 Media Elements --------------------------------------------------------------*/ .hentry .mejs-container { margin: 0 0 26px; margin: 0 0 1.625rem; } .hentry .mejs-mediaelement, .hentry .mejs-container .mejs-controls { background: #333; } .hentry .mejs-controls .mejs-time-rail .mejs-time-loaded, .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current { background: #fff; } .hentry .mejs-controls .mejs-time-rail .mejs-time-current { background: #d96045; } .hentry .mejs-controls .mejs-time-rail .mejs-time-total, .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total { background: rgba(255, 255, 255, 0.33); } .hentry .mejs-container .mejs-controls .mejs-time { padding-top: 9px; } .hentry .mejs-controls .mejs-time-rail span, .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total, .hentry .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current { border-radius: 0; } .hentry .mejs-overlay-loading { background: transparent; } /*-------------------------------------------------------------- 14.0 Utilities --------------------------------------------------------------*/ /*-------------------------------------------------------------- 14.1 Misc --------------------------------------------------------------*/ .img-featured, .img-postlist { opacity: 1; transition: opacity .2s ease-in-out; } .img-featured:hover, .img-postlist:hover { opacity: 0.6; } /*-------------------------------------------------------------- 15.0 Jetpack --------------------------------------------------------------*/ /*-------------------------------------------------------------- 15.1 WP Stats --------------------------------------------------------------*/ img#wpstats, img[id*="botd"] { position: absolute; top: -9999px; } /*-------------------------------------------------------------- 16.0 Media Queries --------------------------------------------------------------*/ /*-------------------------------------------------------------- 16.1 Small devices (phablets, 576px and up) --------------------------------------------------------------*/ @media (min-width: 576px) { /* Typography: Blockquote */ blockquote { padding: 15px 20px; padding: 0.9375rem 1.25rem; width: 90%; } blockquote blockquote { width: 95%; } .sidebar blockquote, .footer-sidebar blockquote { width: 100%; margin: 0; padding-right: 0; padding-right: 0; } /* Elements: Image */ img.alignright, img.alignleft { max-width: 175px; } /* Navigation Misc: Navigation Post */ .post-navigation .nav-links { display: flex; } .post-navigation .nav-previous, .post-navigation .nav-next { width: 50%; } .post-navigation .nav-previous { margin: 0; padding: 0 30px 0 0; } .post-navigation .nav-next { border-left: 1px solid #eee; margin: 0; padding: 0 0 0 30px; } /* Skeleton: Site Branding */ .site-title { font-size: 40px; font-size: 2.5rem; } /* Content: Post Wrapper Archive */ .post-wrapper-archive { align-items: stretch; display: flex; flex-wrap: wrap; justify-content: space-between; } .post-wrapper-archive .hentry { width: calc( 50% - 7.5px); } /* Content: Author Info */ .author-info { align-items: center; display: flex; justify-content: center; } .author-info .author-avatar { margin: 0; width: 15%; } .author-info .author-description { padding: 0 0 0 30px; padding: 0 0 0 1.875rem; width: 85%; } /* Content: Comments */ /* Comment Body */ .comment-list > li > .comment-body { padding-left: 83px; padding-left: 5.1875rem; } .comment-list > li > .children .comment-body { padding-left: 65px; padding-left: 4.0625rem; } .comment-list .bypostauthor .comment-body { padding-left: 98px; padding-left: 6.125rem; } .comment-list > li > .children .bypostauthor .comment-body { padding-left: 80px; padding-left: 5rem; } .comment-list .pingback .comment-body { padding-left: 0; } /* Comment Avatar */ .comment-list > li > .comment-body .comment-author .avatar, .comment-list > li > .children .comment-body .comment-author .avatar { margin: 0; position: absolute; top: 15px; left: 0; } .comment-list > li:first-child:not(.bypostauthor) > .comment-body .comment-author .avatar { top: 0; } .comment-list > li.bypostauthor > .comment-body .comment-author .avatar, .comment-list > li > .children li.bypostauthor > .comment-body .comment-author .avatar { top: 15px; left: 15px; } /* Media: WP Caption */ .wp-caption.alignright, .wp-caption.alignleft { max-width: 175px; } } /*-------------------------------------------------------------- 16.2 Medium devices (tablets, 768px and up) --------------------------------------------------------------*/ @media (min-width: 768px) { /* Typography: Global */ body { font-size: 18px; font-size: 1.125rem; line-height: 1.8; } /* Typography: Paragraph */ p { margin-bottom: 32px; margin-bottom: 2rem; } /* Typography: Headings */ h1 { font-size: 34px; font-size: 2.125rem; margin-bottom: 32px; margin-bottom: 2rem; } h2 { font-size: 28px; font-size: 1.75rem; margin-bottom: 32px; margin-bottom: 2rem; } h3 { font-size: 24px; font-size: 1.5rem; margin-bottom: 32px; margin-bottom: 2rem; } h4 { font-size: 17px; font-size: 1.0625rem; margin-bottom: 32px; margin-bottom: 2rem; } h5 { font-size: 12px; font-size: 0.75rem; margin-bottom: 32px; margin-bottom: 2rem; } h6 { font-size: 11px; font-size: 0.6875rem; margin-bottom: 32px; margin-bottom: 2rem; } /* Typography: Blockquote */ blockquote { font-size: 24px; font-size: 1.5rem; margin: 0 auto 32px; margin: 0 auto 2rem; } /* Typography: General */ address { margin: 0 0 32px; margin: 0 0 2rem; } pre { margin: 0 0 32px; margin: 0 0 2rem; padding: 20px; padding: 1.25rem; } /* Elements: HR */ hr { margin: 0 auto 32px; margin: 0 auto 2rem; } /* Elements: List */ ul, ol { margin: 0 0 32px 36px; margin: 0 0 2rem 2.25rem; } dd { margin: 0 24px 32px; margin: 0 1.5rem 2rem; } /* Elements: Table */ table { margin-bottom: 32px; margin-bottom: 2rem; } table caption { margin-bottom: 20px; margin-bottom: 1.25rem; } table th, table td { padding: 12px; padding: 0.75rem; } /* Elements: Image */ img.alignright, img.alignleft { max-width: 270px; } img.alignright { margin: 0 0 15px 25px; margin: 0 0 0.9375rem 1.5625rem; } img.alignleft { margin: 0 25px 15px 0; margin: 0 1.5625rem 0.9375rem 0; } /* Alignments */ .alignleft { margin: 0 20px 20px 0; margin: 0 1.25rem 1.25rem 0; } .alignright { margin: 0 0 20px 20px; margin: 0 0 1.25rem 1.25rem; } /* Navigation Menus: Main Navigation */ .main-navigation { background-color: #fff; border: solid #dfdfdd; border-width: 1px 0 1px 0; display: block; padding: 20px 0; padding: 1.25rem 0; position: relative; width: 100%; } /* Navigation Menus: Primary Menu */ .site-primary-menu { margin: 0 auto; } /* Essential Styles */ .sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; } .sf-menu { font-size: 0; } .sf-menu li { position: relative; } .sf-menu ul { position: absolute; display: none; font-size: 18px; font-size: 1.125rem; top: 100%; left: 0; z-index: 200; } .sf-menu > li > ul { top: 38px; left: -19px; } .sf-menu > li { display: inline-block; } .sf-menu li:hover > ul, .sf-menu li.sfHover > ul { display: block; } .sf-menu a { display: block; position: relative; } .sf-menu ul ul { top: 0; left: 105%; } /* Menu Skin */ .sf-menu { margin-bottom: 0; text-align: center; } .sf-menu ul { background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); min-width: 15em; /* allow long menu items to determine submenu width */ max-width: 15em; padding: 25px 35px; padding: 1.5625rem 2.1875rem; text-align: left; } /* Anchors */ /* Parent Anchors */ .sf-menu > li > a, .sf-menu > li > a:visited { color: #3d3d3d; font-size: 15px; font-size: 0.9375rem; padding: 0 15px; padding: 0 0.9375rem; text-transform: uppercase; text-decoration: none; transition: all .25s ease-out; } .sf-menu > li > a:hover, .sf-menu > li > a:focus, .sf-menu > li > a:active { color: #eb684b; } /* Child Menu Anchors */ .sf-menu ul a, .sf-menu ul a:visited { color: #020202; font-size: 15px; font-size: 0.9375rem; padding: 8px 0; padding: 0.5rem 0; } .sf-menu ul a:hover, .sf-menu ul a:focus, .sf-menu ul a:active { color: #eb684b; } .sf-menu ul li:last-child a { border-bottom: none; } /* Current Item Indicator */ .sf-menu > li.current_page_item > a, .sf-menu > li.current-menu-item > a, .sf-menu > li.current_page_ancestor > a, .sf-menu > li.current-menu-ancestor > a, .sf-menu > li.current_page_parent > a, .sf-menu > li.current-menu-parent > a { color: #eb684b; } .sf-menu > li li.current_page_item > a, .sf-menu > li li.current-menu-item > a, .sf-menu > li li.current_page_ancestor > a, .sf-menu > li li.current-menu-ancestor > a, .sf-menu > li li.current_page_parent > a, .sf-menu > li li.current-menu-parent > a { color: #eb684b; } /* SF Core */ .sf-menu li { word-wrap: break-word; white-space: normal; /* no need for Supersubs plugin */ transition: background .2s; } .sf-menu ul li { background: #ffffff; } .sf-menu ul ul li { background: #ffffff; } .sf-menu li:hover, .sf-menu li.sfHover { /* only transition out, not in */ transition: none; } /* Last & Second Last Child Drop Down Menu Second Level */ .sf-menu > li:last-child > ul, .sf-menu > li:nth-last-child(2) > ul { left: auto; right: 0; } /* Last & Second Last Child Drop Down Menu Third Level */ .sf-menu > li:last-child > ul ul, .sf-menu > li:nth-last-child(2) > ul ul { left: auto; right: 105%; } /* Parent Anchors Arrow */ .sf-arrows .sf-with-ul:after { content: "\f107"; color: #bfbfbf; font-size: 13px; font-size: 0.8125rem; line-height: 1.7; position: absolute; top: 0; right: 0; } .sf-arrows > li > .sf-with-ul:focus:after, .sf-arrows > li:hover > .sf-with-ul:after, .sf-arrows > .sfHover > .sf-with-ul:after { color: #3d3d3d; } /* Child Anchors Arrow */ .sf-arrows ul .sf-with-ul:after { content: "\f105"; color: #bfbfbf; font-size: 15px; font-size: 0.9375rem; line-height: 1.7; position: absolute; top: 8px; right: 0; } .sf-arrows ul li > .sf-with-ul:focus:after, .sf-arrows ul li:hover > .sf-with-ul:after, .sf-arrows ul .sfHover > .sf-with-ul:after { color: #3d3d3d; } /* Navigation Menus: Primary Menu Responsive */ .toggle-menu-wrapper { display: none; } /* Navigation Misc: Navigation Archives */ .pagination .page-numbers { font-size: 15px; font-size: 0.9375rem; padding: 13px 20px; padding: 0.8125rem 1.25rem; } /* Navigation Misc: Navigation Comments */ .comment-navigation.comment-navigation-above, .comment-navigation.comment-navigation-below { margin: 30px 0 0; margin: 1.875rem 0 0; } /* Skeleton: Header */ .site-header { border-bottom: none; min-height: 120px; padding: 30px 0; padding: 1.875rem 0; } /* Skeleton: Site Branding Wrapper */ .site-branding-wrapper { min-height: 60px; } /* Skeleton: Site Logo */ .custom-logo { max-height: 150px; } /* Skeleton: Site Branding */ .site-title { font-size: 52px; font-size: 3.25rem; } /* Skeleton: Site Content */ .site-content { padding: 30px 0; padding: 1.875rem 0; } /* Skeleton: Sidebar */ .sidebar { margin: 30px 0 0; margin: 1.875rem 0 0; } /* Content: Entry Header & Title (Posts,Pages) */ .entry-title { font-size: 28px; font-size: 1.75rem; } /* Content: Page Header & Title */ .page-title { font-size: 28px; font-size: 1.75rem; } /* Content: Entry Meta Footer */ .entry-meta-footer { margin: 32px 0 0; margin: 2rem 0 0; } /* Content: Comments */ /* Comment List */ .comment-list { margin: 30px 0 0; margin: 1.875rem 0 0; } /* Comment Body */ .comment-list > li > .comment-body, .comment-list > li > .children .comment-body { margin-top: 30px; margin-top: 1.875rem; padding-top: 30px; padding-top: 1.875rem; } .comment-list .bypostauthor .comment-body { padding: 30px 30px 30px 123px; padding: 1.875rem 1.875rem 1.875rem 7.6875rem; } .comment-list > li > .children .bypostauthor .comment-body { padding: 30px 30px 30px 94px; padding: 1.875rem 1.875rem 1.875rem 5.875rem; } /* Comment Avatar */ .comment-list > li > .comment-body .comment-author .avatar, .comment-list > li > .children .comment-body .comment-author .avatar { top: 30px; } .comment-list > li.bypostauthor > .comment-body .comment-author .avatar, .comment-list > li > .children li.bypostauthor > .comment-body .comment-author .avatar { top: 30px; left: 30px; } /* Media: Attachment Caption */ .entry-caption { font-size: 14px; font-size: 0.875rem; padding: 20px; padding: 1.25rem; } /* Media: WP Caption */ .wp-caption { margin-bottom: 32px; margin-bottom: 2rem; } .wp-caption .wp-caption-text { padding: 10px 20px; padding: 0.625rem 1.25rem; } .wp-caption.alignright, .wp-caption.alignleft { max-width: 270px; } .wp-caption.alignright { margin: 0 0 15px 25px; margin: 0 0 0.9375rem 1.5625rem; } .wp-caption.alignleft { margin: 0 25px 15px 0; margin: 0 1.5625rem 0.9375rem 0; } /* Media: Galleries */ .gallery { margin: 0 0 32px; margin: 0 0 2rem; } .gallery .gallery-caption { font-size: 13px; font-size: 0.8125rem; padding: 5px; padding: 0.3125rem; } .gallery.gallery-columns-4 .gallery-caption, .gallery.gallery-columns-5 .gallery-caption { display: block; } /* Media: Media Elements */ .hentry .mejs-container { margin: 0 0 32px; margin: 0 0 2rem; } } /*-------------------------------------------------------------- 16.3 Large devices (desktops, 992px and up) --------------------------------------------------------------*/ @media (min-width: 992px) { /* Elements: Table */ .sidebar table th, .sidebar table td { padding: 4px; padding: 0.25rem; } /* Skeleton: Site Content */ .has-no-sidebar .site-content { width: 767px; margin: 0 auto; } /* Skeleton: Sidebar */ .sidebar { margin: 0; } /* Content: Post Wrapper Archive */ .has-full-width-archive .post-wrapper-archive .hentry { width: calc( 33.33% - 10px); } } /*-------------------------------------------------------------- 16.4 Extra large devices (large desktops, 1200px and up) --------------------------------------------------------------*/ @media (min-width: 1200px) { /* Elements: Table */ .sidebar table th, .sidebar table td { padding: 6px; padding: 0.375rem; } /* Elements: Image */ img.alignright, img.alignleft { max-width: 300px; } img.alignright { margin: 0 0 15px 30px; margin: 0 0 0.9375rem 1.875rem; } img.alignleft { margin: 0 30px 15px 0; margin: 0 1.875rem 0.9375rem 0; } /* Navigation Misc: Navigation Archives */ .pagination .page-numbers { font-size: 17px; font-size: 1.0625rem; padding: 18px 28px; padding: 1.125rem 1.75rem; } /* Skeleton: Header */ .site-header { min-height: 150px; padding: 40px 0; padding: 2.5rem 0; } /* Skeleton: Site Branding Wrapper */ .site-branding-wrapper { min-height: 70px; } /* Skeleton: Site Logo */ .custom-logo { max-height: 200px; } /* Skeleton: Site Branding */ .site-title { font-size: 72px; font-size: 4.5rem; } .site-description { font-size: 14px; font-size: 0.875rem; } /* Skeleton: Site info */ .site-info { padding: 60px 0; padding: 3.75rem 0; } /* Content: Entry Header & Title (Posts,Pages) */ .entry-title { font-size: 30px; font-size: 1.875rem; } /* Content: Page Header & Title */ .page-title { font-size: 30px; font-size: 1.875rem; } /* Media: WP Caption */ .wp-caption { margin-bottom: 32px; margin-bottom: 2rem; } .wp-caption .wp-caption-text { padding: 20px; padding: 1.25rem; } .wp-caption.alignright, .wp-caption.alignleft { max-width: 300px; } .wp-caption.alignright { margin: 0 0 15px 30px; margin: 0 0 0.9375rem 1.875rem; } .wp-caption.alignleft { margin: 0 30px 15px 0; margin: 0 1.875rem 0.9375rem 0; } } /*-------------------------------------------------------------- 16.5 Extra Plus large devices (large desktops, 1280px and up) --------------------------------------------------------------*/ @media (min-width: 1280px) { /* Skeleton: Site Content */ .has-no-sidebar .site-content { width: 787px; margin: 0 auto; } /* Content: Entry Data Wrapper Single */ .entry-data-wrapper-single { padding: 40px; padding: 2.5rem; } /* Content: Page Content Block */ .page-content { padding: 40px; padding: 2.5rem; } /* Content: Page Header & Title */ .page-header { padding: 40px; padding: 2.5rem; } /* Widgets */ .widget { padding: 40px; padding: 2.5rem; } }